recursal/MDN huggingface dataset:
WebGLTexture
============

The **WebGLTexture** interface is part of the WebGL API and represents an opaque texture object providing storage and state for texturing operations.

WebGLObject

WebGLTextureWebGL textures
--------------

The `WebGLTexture` object does not define any methods or properties of its own and its content is not directly accessible. When working with `WebGLTexture` objects, the following methods of the `WebGLRenderingContext` are useful:

* `WebGLRenderingContext.bindTexture()`
* `WebGLRenderingContext.createTexture()`
* `WebGLRenderingContext.deleteTexture()`
* `WebGLRenderingContext.isTexture()`

See also the WebGL tutorial on Using textures in WebGL.

WebXR opaque textures
---------------------

When using WebXR layers, the `XRWebGLBinding` object will return instances of an *opaque* `WebGLTexture` for the color and depth/stencil attachments.

WebXR methods that return *opaque* `WebGLTexture` objects:

* `XRWebGLBinding.getSubImage()`
* `XRWebGLBinding.getViewSubImage()`

The WebXR *opaque texture* is identical to the standard `WebGLTexture` with the following exceptions:

* A WebXR opaque texture is invalid outside a WebXR `requestAnimationFrame()` callback for its session.
* A WebXR opaque texture is invalid until it is returned by `XRWebGLBinding.getSubImage()` or `XRWebGLBinding.getViewSubImage()`.
* A WebXR opaque texture for the color attachment contains colors with premultiplied alpha.
* At the end of a `requestAnimationFrame()` callback a WebXR opaque texture is unbounded and detached from all `WebGLShader` objects.
* A WebXR opaque texture behaves as though it was allocated with `texStorage2D` or `texStorage3D`, as appropriate, even when using a WebGL 1.0 context.
* If a WebXR opaque texture calls `WebGLRenderingContext.deleteTexture()`, an `INVALID_OPERATION` error is thrown.
* Changes to the dimension or format of a WebXR opaque texture are not allowed. GL functions may only alter the texel values and texture parameters.
Examples
--------

### Creating a texture


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const texture = gl.createTexture();
```

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

| Specification |
| --- |
| WebGL Specification # 5.9 |

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

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

See also
--------

* `WebGLRenderingContext.bindTexture()`
* `WebGLRenderingContext.createTexture()`
* `WebGLRenderingContext.deleteTexture()`
* `WebGLRenderingContext.isTexture()`
* `WebGLRenderingContext.compressedTexImage2D()`
* `WebGLRenderingContext.compressedTexSubImage2D()`
* `WebGLRenderingContext.copyTexImage2D()`
* `WebGLRenderingContext.copyTexSubImage2D()`
* `WebGLRenderingContext.generateMipmap()`
* `WebGLRenderingContext.getTexParameter()`
* `WebGLRenderingContext.texImage2D()`
* `WebGLRenderingContext.texSubImage2D()`
* `WebGLRenderingContext.texParameterf()`
* `WebGLRenderingContext.texParameteri()`
SVGAnimatedRect
===============

The `SVGAnimatedRect` interface is used for attributes of basic `SVGRect` which can be animated.

### Interface overview

|  |  |
| --- | --- |
| Also implement | *None* |
| Methods | *None* |
| Properties | * readonly `SVGRect` `baseVal`
* readonly `SVGRect` `animVal`
 |
| Normative document | SVG 1.1 (2nd Edition) |

Instance properties
-------------------

| Name | Type | Description |
| --- | --- | --- |
| `baseVal` | `SVGRect` | The base value of the given attribute before applying any animations. |
| `animVal` | `SVGRect` | 
 A read only `SVGRect` representing the current
 animated value of the given attribute. If the given attribute is not
 currently being animated, then the `SVGRect` will
 have the same contents as `baseVal`. The object referenced by
 `animVal` will always be distinct from the one referenced by
 `baseVal`, even when the attribute is not animated.
  |

Instance methods
----------------

*The `SVGAnimatedRect` interface do not provide any specific methods.*

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WEBGL\_debug\_renderer\_info extension
======================================

The **`WEBGL_debug_renderer_info`** extension is part of the WebGL API and exposes two constants with information about the graphics driver for debugging purposes.

Depending on the privacy settings of the browser, this extension might only be available to privileged contexts. Generally, the graphics driver information should only be used in edge cases to optimize your WebGL content or to debug GPU problems. The `WebGLRenderingContext.getParameter()` method can help you to detect which features are supported and the `failIfMajorPerformanceCaveat` context attribute lets you control if a context should be returned at all, if the performance would be dramatically slow.

WebGL extensions are available using the `WebGLRenderingContext.getExtension()` method. For more information, see also Using Extensions in the WebGL tutorial.

**Note:** Depending on the privacy settings of the browser, this extension might only be available to privileged contexts or not work at all. In Firefox, if `privacy.resistFingerprinting` is set to `true`, this extensions is disabled.

This extension is available to both, WebGL1 and WebGL2 contexts.

Constants
---------

ext.UNMASKED\_VENDOR\_WEBGL

Vendor string of the graphics driver.

ext.UNMASKED\_RENDERER\_WEBGL

Renderer string of the graphics driver.

Examples
--------

With the help of this extension, privileged contexts are able to retrieve debugging information about the user's graphic driver:


```js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");

const debugInfo = gl.getExtension("WEBGL\_debug\_renderer\_info");
const vendor = gl.getParameter(debugInfo.UNMASKED\_VENDOR\_WEBGL);
const renderer = gl.getParameter(debugInfo.UNMASKED\_RENDERER\_WEBGL);

console.log(vendor);
console.log(renderer);
```

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

| Specification |
| --- |
| WebGL WEBGL\_debug\_renderer\_info Khronos Ratified Extension Specification  |

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

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

See also
--------

* `WebGLRenderingContext.getExtension()`
VideoDecoder
============

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The **`VideoDecoder`** interface of the WebCodecs API decodes chunks of video.

EventTarget

VideoDecoderConstructor
-----------

`VideoDecoder()`

Creates a new `VideoDecoder` object.

Instance properties
-------------------

*Inherits properties from its parent, `EventTarget`.*

`VideoDecoder.decodeQueueSize` Read only 

An integer representing the number of queued decode requests.

`VideoDecoder.state` Read only 

Indicates the current state of decoder. Possible values are:

* `"unconfigured"`
* `"configured"`
* `"closed"`

### Events

`dequeue`

Fires to signal a decrease in `VideoDecoder.decodeQueueSize`.

Static methods
--------------

`VideoDecoder.isConfigSupported()`

Returns a promise indicating whether the provided `VideoDecoderConfig` is supported.

Instance methods
----------------

*Inherits methods from its parent, `EventTarget`.*

`VideoDecoder.configure()`

Enqueues a control message to configure the video decoder for decoding chunks.

`VideoDecoder.decode()`

Enqueues a control message to decode a given chunk of video.

`VideoDecoder.flush()`

Returns a promise that resolves once all pending messages in the queue have been completed.

`VideoDecoder.reset()`

Resets all states including configuration, control messages in the control message queue, and all pending callbacks.

`VideoDecoder.close()`

Ends all pending work and releases system resources.

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

| Specification |
| --- |
| WebCodecs # videodecoder-interface |

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

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

See also
--------

* Video processing with WebCodecs
* WebCodecs API Samples
XRInputSourceArray
==================

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

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

The interface **`XRInputSourceArray`** represents a *live* list of WebXR input sources, and is used as the return value of the `XRSession` property `inputSources`. Each entry is an `XRInputSource` representing one input device connected to the WebXR system.

In addition to being able to access the input sources in the list using standard array notation (that is, with index numbers inside square brackets), methods are available to allow the use of iterators and the `forEach()` method is also available.

Instance properties
-------------------

*The following properties are available on `XRInputSourceArray` objects.*

`length` Read only  
Experimental

The number of `XRInputSource` objects in the list.

Instance methods
----------------

*The following methods are available on `XRInputSourceArray` objects. You may also use the features of the `Symbol` type.*

`entries()` 
Experimental

Returns an `iterator` you can use to walk the list of key/value pairs in the list. Each item returned is an array whose first value is the index and whose second value is the `XRInputSource` at that index.

`forEach()` 
Experimental

Iterates over each item in the list, in order from first to last.

`keys()` 
Experimental

A list of the keys corresponding to the entries in the input source list.

`values()` 
Experimental

Returns an `iterator` you can use to go through all the values in the list. Each item is a single `XRInputSource` object.

In addition to these methods, you may use array notation to access items in the list by index For example, the snippet of code below calls a function `handleInput()`, passing into it the first item in the input source list, if the list isn't empty.


```js
let sources = xrSession.inputSources;
if (sources.length > 0) {
  handleInput(sources[0]);
}
```

Examples
--------

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

| Specification |
| --- |
| WebXR Device API # xrinputsourcearray-interface |

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

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

The **`SVGScriptElement`** interface corresponds to the SVG `<script>` element.

EventTarget

Node

Element

SVGElement

SVGScriptElementInstance properties
-------------------

`SVGScriptElement.href` Read only 

An `SVGAnimatedString` corresponding to the `href` or `xlink:href` 
Deprecated
 attribute of the given `<script>` element.

`SVGScriptElement.type` Read only 

A string corresponding to the `type` attribute of the given `<script>` element. A `DOMException` is raised with the code `NO_MODIFICATION_ALLOWED_ERR` on an attempt to change the value of a read only attribute.

`SVGScriptElement.crossOrigin` Read only 

A string corresponding to the `crossorigin` attribute of the given `<script>` element.

Instance methods
----------------

*This interface doesn't implement any specific methods, but inherits methods from its parent interface, `SVGElement`.*

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

| Specification |
| --- |
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGScriptElement |

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

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

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

The **`GPUPipelineLayout`** interface of the WebGPU API defines the `GPUBindGroupLayout`s used by a pipeline. `GPUBindGroup`s used with the pipeline during command encoding must have compatible `GPUBindGroupLayout`s.

A `GPUPipelineLayout` object instance is created using the `GPUDevice.createPipelineLayout()` method.

Instance properties
-------------------

`label` 
Experimental

A string providing a label that can be used to identify the object, for example in `GPUError` messages or console warnings.

Examples
--------

**Note:** The WebGPU samples feature many more examples.

### Basic pipeline layout example

The following snippet:

* Creates a `GPUBindGroupLayout` that describes a binding with a buffer, a texture, and a sampler.
* Creates a `GPUPipelineLayout` based on the `GPUBindGroupLayout`.


```js
// ...

const bindGroupLayout = device.createBindGroupLayout({
  entries: [
    {
      binding: 0,
      visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT,
      buffer: {},
    },
    {
      binding: 1,
      visibility: GPUShaderStage.FRAGMENT,
      texture: {},
    },
    {
      binding: 2,
      visibility: GPUShaderStage.FRAGMENT,
      sampler: {},
    },
  ],
});

const pipelineLayout = device.createPipelineLayout({
  bindGroupLayouts: [bindGroupLayout],
});

// ...
```

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

| Specification |
| --- |
| WebGPU # gpupipelinelayout |

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

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

See also
--------

* The WebGPU API
CharacterBoundsUpdateEvent
==========================

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

The **`CharacterBoundsUpdateEvent`** interface is a `DOM event` that represents a request from the operating system to know the bounds of certain characters within an editable region that's attached to an `EditContext` instance.

This interface inherits properties from `Event`.

Event

CharacterBoundsUpdateEventConstructor
-----------

`CharacterBoundsUpdateEvent()` 
Experimental

Creates a new `CharacterBoundsUpdateEvent` object.

Instance properties
-------------------

`CharacterBoundsUpdateEvent.rangeStart` Read only  
Experimental

The offset of the first character within the editable region text for which the operating system needs the bounds.

`CharacterBoundsUpdateEvent.rangeEnd` Read only  
Experimental

The offset of the last character within the editable region text for which the operating system needs the bounds.

Examples
--------

### Updating the character bounds when needed

This example shows how to use the `characterboundsupdate` event and the `updateCharacterBounds` method to inform the operating system of the character bounds it requires. Note that the event listener callback is only called when using an IME window, or other platform-specific editing UI surfaces, to compose text.


```html
<canvas id="editor-canvas"></canvas>
```



```js
const FONT\_SIZE = 40;
const FONT = `${FONT\_SIZE}px Arial`;

const canvas = document.getElementById("editor-canvas");
const ctx = canvas.getContext("2d");
ctx.font = FONT;

const editContext = new EditContext();
canvas.editContext = editContext;

function computeCharacterBound(offset) {
  // Measure the width from the start of the text to the character.
  const widthBeforeChar = ctx.measureText(
    editContext.text.substring(0, offset),
  ).width;

  // Measure the character width.
  const charWidth = ctx.measureText(editContext.text[offset]).width;

  const charX = canvas.offsetLeft + widthBeforeChar;
  const charY = canvas.offsetTop;

  // Return a DOMRect representing the character bounds.
  return DOMRect.fromRect({
    x: charX,
    y: charY - FONT\_SIZE,
    width: charWidth,
    height: FONT\_SIZE,
  });
}

editContext.addEventListener("characterboundsupdate", (e) => {
  const charBounds = [];
  for (let offset = e.rangeStart; offset < e.rangeEnd; offset++) {
    charBounds.push(computeCharacterBound(offset));
  }

  // Update the character bounds in the EditContext instance.
  editContext.updateCharacterBounds(e.rangeStart, charBounds);

  console.log(
    "The required character bounds are",
    charBounds
      .map((bound) => {
        return `(x: ${bound.x}, y: ${bound.y}, width: ${bound.width}, height: ${bound.height})`;
      })
      .join(", "),
  );
});
```

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

| Specification |
| --- |
| EditContext API # dom-characterboundsupdateevent |

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

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

The **`DOMHighResTimeStamp`** type is a `double` and is used to store a time value in milliseconds.

This type can be used to describe a discrete point in time or a time interval (the difference in time between two discrete points in time). The starting time can be either a specific time determined by the script for a site or app, or the time origin.

The time, given in milliseconds, should be accurate to 5 µs (microseconds), with the fractional part of the number indicating fractions of a millisecond. However, if the browser is unable to provide a time value accurate to 5 µs (due, for example, to hardware or software constraints), the browser can represent the value as a time in milliseconds accurate to a millisecond. Also note the section below on reduced time precision controlled by browser preferences to avoid timing attacks and fingerprinting.

Further, if the device or operating system the user agent is running on doesn't have a clock accurate to the microsecond level, they may only be accurate to the millisecond.

Security requirements
---------------------

To offer protection against timing attacks and fingerprinting, `DOMHighResTimeStamp` types are coarsened based on site isolation status.

* Resolution in isolated contexts: 5 microseconds
* Resolution in non-isolated contexts: 100 microseconds

 Cross-origin isolate your site using the `Cross-Origin-Opener-Policy` and
 `Cross-Origin-Embedder-Policy` headers:


```http
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
```


 These headers ensure a top-level document does not share a browsing context group with
 cross-origin documents. COOP process-isolates your document and potential attackers
 can't access to your global object if they were opening it in a popup, preventing a set
 of cross-origin attacks dubbed XS-Leaks.

See also
--------

* `performance.now()`
* `performance.timeOrigin`
SVGMetadataElement
==================

The **`SVGMetadataElement`** interface corresponds to the `<metadata>` element.

EventTarget

Node

Element

SVGElement

SVGMetadataElementInstance properties
-------------------

*This interface doesn't implement any specific properties, but inherits properties from its parent interface, `SVGElement`.*

Instance methods
----------------

*This interface doesn't implement any specific methods, but inherits methods from its parent interface, `SVGElement`.*

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

| Specification |
| --- |
| Scalable Vector Graphics (SVG) 2 # InterfaceSVGMetadataElement |

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

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

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

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

A `PresentationRequest` object is used to initiate or reconnect to a presentation made by a controlling browsing context. The `PresentationRequest` object *MUST* be implemented in a controlling browsing context provided by a controlling user agent.

When a `PresentationRequest` is constructed, the given `urls` *MUST* be used as the list of *presentation request URLs* which are each a possible presentation URL for the `PresentationRequest` instance.

EventTarget

PresentationRequestConstructor
-----------

`PresentationRequest()` 
Experimental

Creates a `PresentationRequest`.

Instance properties
-------------------

None

Instance methods
----------------

`PresentationRequest.start()` 
Experimental

Returns a `Promise` that resolves with a `PresentationConnection` after the user agent prompts the user to select a display and grant permission to use that display.

`PresentationRequest.reconnect()` 
Experimental

When the `reconnect(presentationId)` method is called on a `PresentationRequest` *presentationRequest*, the user agent *MUST* run the following steps to *reconnect to a presentation*.

`PresentationRequest.getAvailability()` 
Experimental

When the `getAvailability()` method is called, the user agent *MUST* run the steps as the link.

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

| Specification |
| --- |
| Presentation API # interface-presentationrequest |

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

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

The **`ClipboardEvent`** interface of the Clipboard API represents events providing information related to modification of the clipboard, that is `cut`, `copy`, and `paste` events.

Event

ClipboardEventConstructor
-----------

`ClipboardEvent()`

Creates a `ClipboardEvent` event with the given parameters.

Instance properties
-------------------

*Also inherits properties from its parent `Event`*.

`ClipboardEvent.clipboardData` Read only 

A `DataTransfer` object containing the data affected by the user-initiated `cut`, `copy`, or `paste` operation, along with its MIME type.

Instance methods
----------------

*No specific methods; inherits methods from its parent `Event`*.

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

| Specification |
| --- |
| Clipboard API and events # clipboard-event-interfaces |

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

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

See also
--------

* Copy-related events: `copy`, `cut`, `paste`
* Clipboard API
* Image support for Async Clipboard article
DocumentType
============

The **`DocumentType`** interface represents a `Node` containing a doctype.

EventTarget

Node

DocumentTypeInstance properties
-------------------

*Inherits properties from its parent, `Node`.*

`DocumentType.name` Read only 

The type of the document. It is always `"html"` for HTML documents, but will vary for XML documents.

`DocumentType.publicId` Read only 

A string with an identifier of the type of document. Always empty (`""`) for HTML, it will be, for example, `"-//W3C//DTD SVG 1.1//EN"` for SVG documents.

`DocumentType.systemId` Read only 

A string containing the URL to the associated DTD. Always empty (`""`) for HTML, it will be, for example, `"http://www.w3.org/2000/svg"` for SVG documents.

Instance methods
----------------

*Inherits methods from its parent, `Node`.*

`DocumentType.after()`

 Inserts a set of `Node` or string objects in the children list of the
 object's parent, just after this node.


`DocumentType.before()`

 Inserts a set of `Node` or string objects in the children list of the
 object's parent, just before this node.


`DocumentType.remove()`

Removes this object from its parent children list.

`DocumentType.replaceWith()`

Replaces the document type with a set of given nodes.

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

| Specification |
| --- |
| DOM Standard # interface-documenttype |

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

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

See also
--------

* The DOM interfaces index.
* `DOMImplementation.createDocumentType()` to create a new `DocumentType` node.