recursal/MDN huggingface dataset:
GPURenderBundleEncoder: popDebugGroup() method
==============================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`popDebugGroup()`** method of the
 `GPURenderBundleEncoder` interface ends a render bundle debug group, which is begun with a `pushDebugGroup()` call.

This could be used for telemetry, or may be utilized in `GPUError` messages, browser dev tools, or other services in the future to help with debugging.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `popDebugGroup()`.

Syntax
------


```js
popDebugGroup()
```

### Parameters

None.

### Return value

None (`Undefined`).

### Validation

The following criteria must be met when calling **`popDebugGroup()`**, otherwise a `GPUValidationError` is generated and the `GPURenderBundleEncoder` becomes invalid:

* The render bundle encoder's debug stack is not empty (i.e. at least one render bundle debug group was previously started with `pushDebugGroup()`).
Examples
--------


```js
// ...

const bundleEncoder = device.createRenderBundleEncoder(renderBundleDescriptor);

bundleEncoder.pushDebugGroup("mygroupmarker"); // Start labeled debug group

bundleEncoder.setPipeline(renderPipeline);
bundleEncoder.setVertexBuffer(0, vertexBuffer);
bundleEncoder.draw(3);

bundleEncoder.popDebugGroup();

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpudebugcommandsmixin-popdebuggroup |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: drawIndirect() method
=============================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`drawIndirect()`** method of the
 `GPURenderBundleEncoder` interface draws primitives using parameters read from a `GPUBuffer`.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `drawIndirect()`.

Syntax
------


```js
drawIndirect(indirectBuffer, indirectOffset)
```

### Parameters

`indirectBuffer`

A `GPUBuffer` containing the `vertexCount`, `instanceCount`, `firstVertex`, and `firstInstance` values needed to carry out the drawing operation. The buffer must contain a tightly packed block of four 32-bit unsigned integer values representing the values (16 bytes total), given in the same order as the arguments for `GPURenderBundleEncoder.draw()`. So for example:


```js
const uint32 = new Uint32Array(4);
uint32[0] = 3; // The vertexCount value
uint32[1] = 1; // The instanceCount value
uint32[2] = 0; // The firstVertex value
uint32[3] = 0; // The firstInstance value

// Write values into a GPUBuffer
device.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);
```


`indirectOffset`

The offset, in bytes, into `indirectBuffer` where the value data begins.

### Return value

None (`Undefined`).

### Validation

The following criteria must be met when calling **`drawIndirect()`**, otherwise a `GPUValidationError` is generated and the `GPURenderBundleEncoder` becomes invalid:

* `indirectBuffer`'s `GPUBuffer.usage` contains the `GPUBufferUsage.INDIRECT` flag.
* `indirectOffset` + the total size specified by the value parameters in the `indirectBuffer` is less than or equal to the `indirectBuffer`'s `GPUBuffer.size`.
* `indirectOffset` is a multiple of 4.
Examples
--------


```js
// ...

// Create GPURenderBundleEncoder
const bundleEncoder = device.createRenderBundleEncoder(descriptor);

// Set pipeline and vertex buffer
bundleEncoder.setPipeline(renderPipeline);
bundleEncoder.setVertexBuffer(0, vertexBuffer);

// Create drawIndirect values
const uint32 = new Uint32Array(4);
uint32[0] = 3;
uint32[1] = 1;
uint32[2] = 0;
uint32[3] = 0;

// Create a GPUBuffer and write the draw values into it
const drawValues = device.createBuffer({
  size: 16,
  usage: GPUBufferUsage.COPY\_DST | GPUBufferUsage.INDIRECT,
});
device.queue.writeBuffer(drawValues, 0, uint32, 0, uint32.length);

// Draw the vertices
bundleEncoder.drawIndirect(drawValues, 0);

// End the bundle recording
const renderBundle = bundleEncoder.finish();

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpurendercommandsmixin-drawindirect |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: drawIndexedIndirect() method
====================================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`drawIndexedIndirect()`** method of the
 `GPURenderBundleEncoder` interface draws indexed primitives using parameters read from a `GPUBuffer`.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `drawIndexedIndirect()`.

Syntax
------


```js
drawIndexedIndirect(indirectBuffer, indirectOffset)
```

### Parameters

`indirectBuffer`

A `GPUBuffer` containing the `indexCount`, `instanceCount`, `firstIndex`, `baseVertex`, and `firstInstance` values needed to carry out the drawing operation. The buffer must contain a tightly packed block of five 32-bit unsigned integer values representing the values (20 bytes total), given in the same order as the arguments for `GPURenderBundleEncoder.drawIndexed()`. So for example:


```js
const uint32 = new Uint32Array(5);
uint32[0] = 3; // The indexCount value
uint32[1] = 1; // The instanceCount value
uint32[2] = 0; // The firstIndex value
uint32[3] = 0; // The baseVertex value
uint32[4] = 0; // The firstInstance value

// Write values into a GPUBuffer
device.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);
```


`indirectOffset`

The offset, in bytes, into `indirectBuffer` where the value data begins.

### Return value

None (`Undefined`).

### Validation

The following criteria must be met when calling **`drawIndirect()`**, otherwise a `GPUValidationError` is generated and the `GPURenderBundleEncoder` becomes invalid:

* `indirectBuffer`'s `GPUBuffer.usage` contains the `GPUBufferUsage.INDIRECT` flag.
* `indirectOffset` + the total size specified by the value parameters in the `indirectBuffer` is less than or equal to the `indirectBuffer`'s `GPUBuffer.size`.
* `indirectOffset` is a multiple of 4.
Examples
--------


```js
// ...

// Create GPURenderBundleEncoder
const bundleEncoder = device.createRenderBundleEncoder(descriptor);

// Set pipeline and vertex buffer
bundleEncoder.setPipeline(renderPipeline);
bundleEncoder.setVertexBuffer(0, vertexBuffer);
bundleEncoder.setIndexBuffer(indexBuffer, "uint16");

// Create drawIndexedIndirect values
const uint32 = new Uint32Array(5);
uint32[0] = 3;
uint32[1] = 1;
uint32[2] = 0;
uint32[3] = 0;
uint32[4] = 0;

// Create a GPUBuffer and write the draw values into it
const drawValues = device.createBuffer({
  size: 20,
  usage: GPUBufferUsage.COPY\_DST | GPUBufferUsage.INDIRECT,
});
device.queue.writeBuffer(drawValues, 0, uint32, 0, uint32.length);

// Draw the vertices
bundleEncoder.drawIndexedIndirect(drawValues, 0);

// End the bundle recording
const renderBundle = bundleEncoder.finish();

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpurendercommandsmixin-drawindexedindirect |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: setIndexBuffer() method
===============================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`setIndexBuffer()`** method of the
 `GPURenderBundleEncoder` interface sets the current `GPUBuffer` that will provide index data for subsequent drawing commands.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `setIndexBuffer()`.

Syntax
------


```js
setIndexBuffer(buffer, indexFormat, offset, size)
```

### Parameters

`buffer`

A `GPUBuffer` representing the buffer containing the index data to use for subsequent drawing commands.

`indexFormat`

An enumerated value that defines the format of the index data contained in `buffer`. Possible values are:

* `"uint16"`
* `"uint32"`

`offset` Optional

A number representing the offset, in bytes, into `buffer` where the index data begins. If omitted, `offset` defaults to 0.

`size` Optional

A number representing the size, in bytes, of the index data contained in `buffer`. If omitted, `size` defaults to the `buffer`'s `GPUBuffer.size` - `offset`.

#### Note on indexFormat

`indexFormat` determines both the data type of index values in a buffer and, when used with a pipeline that specifies a strip primitive topology (`"line-strip"` or `"triangle-strip"`), also determines the primitive restart value. The primitive restart value is an index value indicating that a new primitive should be started rather than continuing to construct the strip with the prior indexed vertices. The value is `0xFFFF` for `"uint16"`, or `0xFFFFFFFF` for `"uint32"`.

### Return value

None (`Undefined`).

### Validation

The following criteria must be met when calling **`setIndexBuffer()`**, otherwise a `GPUValidationError` is generated and the `GPURenderBundleEncoder` becomes invalid:

* `buffer`'s `GPUBuffer.usage` contains the `GPUBufferUsage.INDEX` flag.
* `offset` + `size` is less than or equal to the `buffer`'s `GPUBuffer.size`.
* `offset` is a multiple of `indexFormat`'s byte size (2 for `"uint16"`, 4 for `"uint32"`).
Examples
--------


```js
// ...

const bundleEncoder = device.createRenderBundleEncoder(descriptor);

bundleEncoder.setPipeline(pipeline);
bundleEncoder.setBindGroup(0, sceneBindGroupForRender);
bundleEncoder.setBindGroup(1, modelBindGroup);
bundleEncoder.setVertexBuffer(0, vertexBuffer);
bundleEncoder.setIndexBuffer(indexBuffer, "uint16");
bundleEncoder.drawIndexed(indexCount);

const renderBundle = bundleEncoder.finish();

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpurendercommandsmixin-setindexbuffer |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: pushDebugGroup() method
===============================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`pushDebugGroup()`** method of the
 `GPURenderBundleEncoder` interface begins a render bundle debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a `popDebugGroup()` method is invoked.

This could be used for telemetry, or may be utilized in `GPUError` messages, browser dev tools, or other services in the future to help with debugging.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `pushDebugGroup()`.

Syntax
------


```js
pushDebugGroup(groupLabel)
```

### Parameters

`groupLabel`

A string representing the label for the debug group.

### Return value

None (`Undefined`).

Examples
--------


```js
// ...

const bundleEncoder = device.createRenderBundleEncoder(renderBundleDescriptor);

bundleEncoder.pushDebugGroup("mygroupmarker"); // Start labeled debug group

bundleEncoder.setPipeline(renderPipeline);
bundleEncoder.setVertexBuffer(0, vertexBuffer);
bundleEncoder.draw(3);

bundleEncoder.popDebugGroup();

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpudebugcommandsmixin-pushdebuggroup |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: insertDebugMarker() method
==================================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`insertDebugMarker()`** method of the
 `GPURenderBundleEncoder` interface marks a specific point in a series of encoded render bundle pass commands with a label.

This could be used for telemetry, or may be utilized in `GPUError` messages, browser dev tools, or other services in the future to help with debugging.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `InsertDebugMarker()`.

Syntax
------


```js
insertDebugMarker(markerLabel)
```

### Parameters

`markerLabel`

A string representing the label to insert.

### Return value

None (`Undefined`).

Examples
--------


```js
// ...

bundleEncoder.insertDebugMarker("mymarker");

// ...
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpudebugcommandsmixin-insertdebugmarker |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: label property
======================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`label`** read-only property of the
 `GPURenderBundleEncoder` interface is a string providing a label that can be used to identify the object, for example in `GPUError` messages or console warnings.

This can be set by providing a `label` property in the descriptor object passed into the originating `GPUDevice.createRenderBundleEncoder()` call, or you can get and set it directly on the `GPURenderBundleEncoder` object.

**Note:** This property is functionally identical to its equivalent on `GPURenderPassEncoder` — `label`.

Value
-----

A string. If no label value has previously been set, getting the label returns an empty string.

Examples
--------

Setting and getting a label via `GPURenderBundleEncoder.label`:


```js
const renderBundleEncoder = device.createRenderBundleEncoder({
  colorFormats: [presentationFormat],
});

renderBundleEncoder.label = "myrenderbundleencoder";
console.log(renderBundleEncoder.label); // "myrenderbundleencoder"
```


Setting a label via the originating `GPUDevice.createRenderBundleEncoder()` call, and then getting it via `GPURenderBundleEncoder.label`:


```js
const renderBundleEncoder = device.createRenderBundleEncoder({
  colorFormats: [presentationFormat],
  label: "myrenderbundleencoder",
});

console.log(renderBundleEncoder.label); // "myrenderbundleencoder"
```

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpuobjectbase-label |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
GPURenderBundleEncoder: setPipeline() method
============================================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

 The **`setPipeline()`** method of the
 `GPURenderBundleEncoder` interface sets the `GPURenderPipeline` to use for subsequent render bundle commands.

**Note:** This method is functionally identical to its equivalent on `GPURenderPassEncoder` — `setPipeline()`.

Syntax
------


```js
setPipeline(pipeline)
```

### Parameters

`pipeline`

The `GPURenderPipeline` to use for subsequent render bundle commands.

### Return value

None (`Undefined`).

### Validation

The following criteria must be met when calling **`setPipeline()`**, otherwise a `GPUValidationError` is generated and the `GPURenderBundleEncoder` becomes invalid:

* If the `GPURenderPipeline` writes to the depth component of the depth/stencil attachment, `depthReadOnly` (as specified in the descriptor of the originating `GPUCommandEncoder.beginRenderPass()` call) is `true`.
* If the `GPURenderPipeline` writes to the stencil component of the depth/stencil attachment, `stencilReadOnly` (as specified in the descriptor of the originating `GPUCommandEncoder.beginRenderPass()` call) is `true`.
Examples
--------


```js
function recordRenderPass(
  passEncoder: GPURenderBundleEncoder | GPURenderPassEncoder // TypeScript
) {
  if (settings.dynamicOffsets) {
    passEncoder.setPipeline(dynamicPipeline);
  } else {
    passEncoder.setPipeline(pipeline);
  }
  passEncoder.setVertexBuffer(0, vertexBuffer);
  passEncoder.setBindGroup(0, timeBindGroup);
  const dynamicOffsets = [0];
  for (let i = 0; i < numTriangles; ++i) {
    if (settings.dynamicOffsets) {
      dynamicOffsets[0] = i \* alignedUniformBytes;
      passEncoder.setBindGroup(1, dynamicBindGroup, dynamicOffsets);
    } else {
      passEncoder.setBindGroup(1, bindGroups[i]);
    }
    passEncoder.draw(3, 1, 0, 0);
  }
}
```


The above snippet is taken from the WebGPU Samples Animometer example.

Specifications
--------------

| Specification |
| --- |
| WebGPU # dom-gpurendercommandsmixin-setpipeline |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The WebGPU API
DedicatedWorkerGlobalScope: messageerror event
==============================================

The `messageerror` event is fired on a `DedicatedWorkerGlobalScope` object when it receives a message that can't be deserialized.

This event is not cancellable and does not bubble.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("messageerror", (event) => {});

onmessageerror = (event) => {};
```

Event type
----------

A `MessageEvent`. Inherits from `Event`.

Event

MessageEventEvent properties
----------------

*This interface also inherits properties from its parent, `Event`.*

`MessageEvent.data` Read only 

The data sent by the message emitter.

`MessageEvent.origin` Read only 

A string representing the origin of the message emitter.

`MessageEvent.lastEventId` Read only 

A string representing a unique ID for the event.

`MessageEvent.source` Read only 

A `MessageEventSource` (which can be a WindowProxy, `MessagePort`, or `ServiceWorker` object) representing the message emitter.

`MessageEvent.ports` Read only 

An array of `MessagePort` objects representing the ports associated with the channel the message is being sent through (where appropriate, e.g. in channel messaging or when sending a message to a shared worker).

Examples
--------

Listen for `messageerror` using `addEventListener()`:


```js
// worker.js

self.addEventListener("messageerror", (event) => {
  self.postMessage("Error receiving message");
  console.error(event);
});
```


The same, but using the `onmessageerror` event handler property:


```js
// worker.js

self.onmessageerror = (event) => {
  self.postMessage("Error receiving message");
  console.error(event);
};
```

Specifications
--------------

| Specification |
| --- |
| HTML Standard # event-messageerror |
| HTML Standard # handler-dedicatedworkerglobalscope-onmessageerror |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `DedicatedWorkerGlobalScope`
* `WorkerGlobalScope`
* Related events: `message`
* `Worker.postMessage()`
* Using channel messaging
DedicatedWorkerGlobalScope: close() method
==========================================

The **`close()`** method of the `DedicatedWorkerGlobalScope` interface discards any tasks queued in the `DedicatedWorkerGlobalScope`'s event loop, effectively closing this particular scope.

Syntax
------


```js
close()
```

### Parameters

None.

### Return value

None (`undefined`).

Examples
--------

If you want to close your worker instance from inside the worker itself, you can call the following:


```js
close();
```


`close()` and `self.close()` are effectively equivalent — both represent `close()` being called from inside the worker's inner scope.

**Note:** There is also a way to stop the worker from the main thread: the `Worker.terminate` method.

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-dedicatedworkerglobalscope-close-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

`DedicatedWorkerGlobalScope`
DedicatedWorkerGlobalScope: name property
=========================================

 The **`name`** read-only property of the
 `DedicatedWorkerGlobalScope` interface returns the name that the
 `Worker` was (optionally) given when it was created. This is the name that
 the `Worker()` constructor can pass to get a reference to
 the `DedicatedWorkerGlobalScope`.

Value
-----

A string.

Examples
--------

If a worker is created using a constructor with a `name` option:


```js
const myWorker = new Worker("worker.js", { name: "myWorker" });
```


 the `DedicatedWorkerGlobalScope` will now have a name of "myWorker",
 returnable by running


```js
self.name;
```


from inside the worker.

Specifications
--------------

| Specification |
| --- |
| HTML Standard # dom-dedicatedworkerglobalscope-name-dev |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `DedicatedWorkerGlobalScope`