recursal/MDN huggingface dataset:
CustomElementRegistry
=====================

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
The **`CustomElementRegistry`** interface provides methods for registering custom elements and querying registered elements. To get an instance of it, use the `window.customElements` property.

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

`CustomElementRegistry.define()`

Defines a new custom element.

`CustomElementRegistry.get()`

Returns the constructor for the named custom element, or `undefined` if the custom element is not defined.

`CustomElementRegistry.getName()`

Returns the name for the already-defined custom element, or `null` if the custom element is not defined.

`CustomElementRegistry.upgrade()`

Upgrades a custom element directly, even before it is connected to its shadow root.

`CustomElementRegistry.whenDefined()`

Returns an empty `Promise` that resolves when a custom element becomes defined with the given name. If such a custom element is already defined, the returned promise is immediately fulfilled.

Examples
--------

See the Examples section in our guide to using custom elements.

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

| Specification |
| --- |
| HTML Standard # custom-elements-api |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
OES\_texture\_float\_linear extension
=====================================

The **`OES_texture_float_linear`** extension is part of the WebGL API and allows linear filtering with floating-point pixel types for textures.

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

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

Linear filtering
----------------

The `OES_texture_float` extension alone does not allow linear filtering with floating-point textures. This extension enables this ability.

With the help of this extension, you can now set the magnification or minification filter in the `WebGLRenderingContext.texParameter()` method to one of `gl.LINEAR`, `gl.LINEAR_MIPMAP_NEAREST`, `gl.NEAREST_MIPMAP_LINEAR`, or `gl.LINEAR_MIPMAP_LINEAR`, and use floating-point textures.

Examples
--------


```js
gl.getExtension("OES\_texture\_float");
gl.getExtension("OES\_texture\_float\_linear");

const texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE\_2D, texture);

gl.texParameterf(gl.TEXTURE\_2D, gl.TEXTURE\_MAG\_FILTER, gl.LINEAR);
gl.texImage2D(gl.TEXTURE\_2D, 0, gl.RGBA, gl.RGBA, gl.FLOAT, image);
```

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

| Specification |
| --- |
| WebGL OES\_texture\_float\_linear 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()`
* `WebGLRenderingContext.texImage2D()`
* `WebGLRenderingContext.texSubImage2D()`
* `OES_texture_float`
* `OES_texture_half_float`
* `OES_texture_half_float_linear`
SensorErrorEvent
================

The **`SensorErrorEvent`** interface of the Sensor APIs provides information about errors thrown by a `Sensor` or derived interface.

Event

SensorErrorEventConstructor
-----------

`SensorErrorEvent()`

Creates a new `SensorErrorEvent` object.

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

`SensorErrorEvent.error` Read only 

Returns the `DOMException` object passed in the event's constructor.

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

| Specification |
| --- |
| Generic Sensor API # the-sensor-error-event-interface |

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

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

The **`EcKeyImportParams`** dictionary of the Web Crypto API represents the object that should be passed as the `algorithm` parameter into `SubtleCrypto.importKey()` or `SubtleCrypto.unwrapKey()`, when generating any elliptic-curve-based key pair: that is, when the algorithm is identified as either of ECDSA or ECDH.

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

`name`

A string. This should be set to `ECDSA` or `ECDH`, depending on the algorithm you want to use.

`namedCurve`

A string representing the name of the elliptic curve to use. This may be any of the following names for NIST-approved curves:

* `P-256`
* `P-384`
* `P-521`

Examples
--------

See the examples for `SubtleCrypto.importKey()`.

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

| Specification |
| --- |
| Web Cryptography API # dfn-EcKeyImportParams |

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

Browsers that support the "ECDH" or "ECDSA" algorithms for the `SubtleCrypto.importKey()` or `SubtleCrypto.wrapKey()` methods will support this type.

See also
--------

* `SubtleCrypto.importKey()`.
* `SubtleCrypto.unwrapKey()`.
XRTransientInputHitTestSource
=============================

**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 **`XRTransientInputHitTestSource`** interface of the WebXR Device API handles transient input hit test subscriptions. You can get an `XRTransientInputHitTestSource` object by calling the `XRSession.requestHitTestSourceForTransientInput()`.

This object doesn't itself contain transient input hit test results, but it is used to compute hit tests for each `XRFrame` by calling `XRFrame.getHitTestResultsForTransientInput()`, which returns `XRTransientInputHitTestResult` objects.

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

None.

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

`XRTransientInputHitTestSource.cancel()` 
Experimental

Unsubscribes from the transient input hit test.

Examples
--------

### Getting an `XRTransientInputHitTestSource` object for a session

Use the `XRSession.requestHitTestSourceForTransientInput()` method to get a transient input hit test source.


```js
const xrSession = navigator.xr.requestSession("immersive-ar", {
  requiredFeatures: ["local", "hit-test"],
});

let transientHitTestSource = null;

xrSession
  .requestHitTestSourceForTransientInput({
    profile: "generic-touchscreen",
    offsetRay: new XRRay(),
  })
  .then((touchScreenHitTestSource) => {
    transientHitTestSource = touchScreenHitTestSource;
  });

// frame loop
function onXRFrame(time, xrFrame) {
  let hitTestResults = xrFrame.getHitTestResultsForTransientInput(
    transientHitTestSource,
  );

  // do things with the transient hit test results
}
```

### Unsubscribe from a transient input hit test

To unsubscribe from a transient input hit test source, use the `XRTransientInputHitTestSource.cancel()` method. Since the object will no longer be usable, you can clean up and set the `XRTransientInputHitTestSource` object to `null`.


```js
transientHitTestSource.cancel();
transientHitTestSource = null;
```

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

| Specification |
| --- |
| WebXR Hit Test Module # transient-input-hit-test-source-interface |

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

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

See also
--------

* `XRTransientInputHitTestResult`
CSSMathValue
============

The **`CSSMathValue`** interface of the CSS\_Object\_Model#css\_typed\_object\_model a base class for classes representing complex numeric values.

CSSStyleValue

CSSNumericValue

CSSMathValueInterfaces based on CSSMathValue
--------------------------------

Below is a list of interfaces based on the CSSMathValue interface.

* `CSSMathInvert`
* `CSSMathMax`
* `CSSMathMin`
* `CSSMathNegate`
* `CSSMathProduct`
* `CSSMathSum`
Instance properties
-------------------

`CSSMathValue.operator`

Indicates the operator that the current subtype represents.

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

*The interface may also inherit methods from its parent interface, `CSSNumericValue`.*

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

*The interface may also inherit methods from its parent interface, `CSSNumericValue`.*

Event handlers
--------------

No

Examples
--------

We create an element with a `width` determined using a `calc()` function, then `console.log()` the `operator`.


```html
<div>has width</div>
```


We assign a `width` with a calculation


```css
div {
  width: calc(30% - 20px);
}
```


We add the JavaScript


```js
const styleMap = document.querySelector("div").computedStyleMap();

console.log(styleMap.get("width")); // CSSMathSum {values: CSSNumericArray, operator: "sum"}
console.log(styleMap.get("width").operator); // 'sum'
console.log(styleMap.get("width").values[1].value); // -20
```


The `CSSMathValue.operator` returns '`sum`' because `styleMap.get('width').values[1].value );` is `-20`: adding a negative number.

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

| Specification |
| --- |
| CSS Typed OM Level 1 # complex-numeric |

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

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

The **`HTMLPictureElement`** interface represents a `<picture>` HTML element. It doesn't implement specific properties or methods.

EventTarget

Node

Element

HTMLElement

HTMLPictureElementInstance properties
-------------------

*No specific property, but inherits properties from its parent, `HTMLElement`.*

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

*No specific method, but inherits methods from its parent, `HTMLElement`.*

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

| Specification |
| --- |
| HTML Standard # htmlpictureelement |

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

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

See also
--------

* The `<picture>` HTML element that implements it.
* The `HTMLImageElement` and `HTMLSourceElement` interfaces, often used in conjunction with a `<picture>` element.
HTMLUListElement
================

The **`HTMLUListElement`** interface provides special properties (beyond those defined on the regular `HTMLElement` interface it also has available to it by inheritance) for manipulating unordered list (`<ul>`) elements.

EventTarget

Node

Element

HTMLElement

HTMLUListElementInstance properties
-------------------

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

`HTMLUListElement.type` 
Deprecated

A string value reflecting the `type` and defining the kind of marker to be used to display. The values are browser dependent and have never been standardized.

`HTMLUListElement.compact` 
Deprecated

A boolean value indicating that spacing between list items should be reduced. This property reflects the `compact` attribute only, it doesn't consider the `line-height` CSS property used for that behavior in modern pages.

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

*No specific method; inherits methods from its parent, `HTMLElement`.*

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

| Specification |
| --- |
| HTML Standard # htmlulistelement |

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

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

See also
--------

* The HTML element implementing this interface: `<ul>`.
TrustedTypePolicy
=================

The **`TrustedTypePolicy`** interface of the `Trusted Types API` defines a group of functions which create `TrustedType` objects.

A `TrustedTypePolicy` object is created by `TrustedTypePolicyFactory.createPolicy()` to define a policy for enforcing security rules on input. Therefore, `TrustedTypePolicy` has no constructor.

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

`TrustedTypePolicy.name` Read only 

A string containing the name of the policy.

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

`TrustedTypePolicy.createHTML()`

Creates a `TrustedHTML` object.

`TrustedTypePolicy.createScript()`

Creates a `TrustedScript` object.

`TrustedTypePolicy.createScriptURL()`

Creates a `TrustedScriptURL` object.

Examples
--------

In the below example we create a policy that will create `TrustedHTML` objects using `TrustedTypePolicyFactory.createPolicy()`. We can then use `TrustedTypePolicy.createHTML` to create a sanitized HTML string to be inserted into the document.

The sanitized value can then be used with `Element.innerHTML` to ensure that no new HTML elements can be injected.


```html
<div id="myDiv"></div>
```



```js
const escapeHTMLPolicy = trustedTypes.createPolicy("myEscapePolicy", {
  createHTML: (string) => string.replace(/>/g, "<"),
});

let el = document.getElementById("myDiv");
const escaped = escapeHTMLPolicy.createHTML("<img src=x onerror=alert(1)>");
console.log(escaped instanceof TrustedHTML); // true
el.innerHTML = escaped;
```

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

| Specification |
| --- |
| Trusted Types # trusted-type-policy |

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

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

**Deprecated:** This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

**Non-standard:** This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

The **`VRFrameData`** interface of the WebVR API represents all the information needed to render a single frame of a VR scene; constructed by `VRDisplay.getFrameData()`.

**Note:** This interface was part of the old WebVR API. It has been superseded by the WebXR Device API.

Constructor
-----------

`VRFrameData()` 
Deprecated

Non-standard

Creates a `VRFrameData` object instance.

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

`VRFrameData.leftProjectionMatrix` 
Deprecated
 Read only  
Non-standard

A `Float32Array` representing a 4x4 matrix that describes the projection to be used for the left eye's rendering.

`VRFrameData.leftViewMatrix` 
Deprecated
 Read only  
Non-standard

A `Float32Array` representing a 4x4 matrix that describes the view transform to be used for the left eye's rendering.

`VRFrameData.pose` 
Deprecated
 Read only  
Non-standard

The `VRPose` of the `VRDisplay` at the current `VRFrameData.timestamp`.

`VRFrameData.rightProjectionMatrix` 
Deprecated
 Read only  
Non-standard

A `Float32Array` representing a 4x4 matrix that describes the projection to be used for the right eye's rendering.

`VRFrameData.rightViewMatrix` 
Deprecated
 Read only  
Non-standard

A `Float32Array` representing a 4x4 matrix that describes the view transform to be used for the right eye's rendering.

`VRFrameData.timestamp` 
Deprecated
 Read only  
Non-standard

A constantly increasing timestamp value representing the time a frame update occurred.

Examples
--------

See `VRDisplay.getFrameData()` for example code.

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

This interface was part of the old WebVR API that has been superseded by the WebXR Device API. It is no longer on track to becoming a standard.

Until all browsers have implemented the new WebXR APIs, it is recommended to rely on frameworks, like A-Frame, Babylon.js, or Three.js, or a polyfill, to develop WebXR applications that will work across all browsers [1].

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

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

See also
--------

* WebVR API
CSSPageRule
===========

**`CSSPageRule`** represents a single CSS `@page` rule.

CSSRule

CSSGroupingRule

CSSPageRuleInstance properties
-------------------

*Inherits properties from its ancestor `CSSRule`.*

`CSSPageRule.selectorText`

Represents the text of the page selector associated with the at-rule.

`CSSPageRule.style` Read only 

Returns the declaration block associated with the at-rule.

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

*Inherits methods from its ancestor `CSSRule`.*

Examples
--------

The stylesheet includes a single `@page` rule, therefore the first (and only) rule returned will be a `CSSPageRule`.


```css
@page {
  margin: 1cm;
}
```



```js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // a CSSPageRule
```

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

| Specification |
| --- |
| CSS Object Model (CSSOM) # the-csspagerule-interface |

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

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

The `XMLSerializer` interface provides the `serializeToString()` method to construct an XML string representing a DOM tree.

Constructor
-----------

`XMLSerializer()`

Creates a new `XMLSerializer` object.

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

`serializeToString()`

Returns the serialized subtree of a string.

Examples
--------

### Serializing XML into a string

This example just serializes an entire document into a string containing XML.


```js
const s = new XMLSerializer();
const str = s.serializeToString(document);
saveXML(str);
```


This involves creating a new `XMLSerializer` object, then passing the `Document` to be serialized into `serializeToString()`, which returns the XML equivalent of the document. `saveXML()` represents a function that would then save the serialized string.

### Inserting nodes into a DOM based on XML

This example uses the `Element.insertAdjacentHTML()` method to insert a new DOM `Node` into the body of the `Document`, based on XML created by serializing an `Element` object.

**Note:** In the real world, you should usually instead call `importNode()` method to import the new node into the DOM, then call one of the following methods to add the node to the DOM tree:

* The `Element.append()`/`Element.prepend()` and `Document.append()`/`Document.prepend()` methods.
* The `Element.replaceWith` method (to replace an existing node with the new one)
* The `Element.insertAdjacentElement()` method.

Because `insertAdjacentHTML()` accepts a string and not a `Node` as its second parameter, `XMLSerializer` is used to first convert the node into a string.


```js
const inp = document.createElement("input");
const XMLS = new XMLSerializer();
const inp_xmls = XMLS.serializeToString(inp); // First convert DOM node into a string

// Insert the newly created node into the document's body
document.body.insertAdjacentHTML("afterbegin", inp_xmls);
```


The code creates a new `<input>` element by calling `Document.createElement()`, then serializes it into XML using `serializeToString()`.

Once that's done, `insertAdjacentHTML()` is used to insert the `<input>` element into the DOM.

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

| Specification |
| --- |
| DOM Parsing and Serialization # the-xmlserializer-interface |

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

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

See also
--------

* Parsing and serializing XML
* `DOMParser`
MIDIAccess
==========

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

The **`MIDIAccess`** interface of the Web MIDI API provides methods for listing MIDI input and output devices, and obtaining access to those devices.

EventTarget

MIDIAccessInstance properties
-------------------

`MIDIAccess.inputs` Read only 

Returns an instance of `MIDIInputMap` which provides access to any available MIDI input ports.

`MIDIAccess.outputs` Read only 

Returns an instance of `MIDIOutputMap` which provides access to any available MIDI output ports.

`MIDIAccess.sysexEnabled` Read only 

A boolean attribute indicating whether system exclusive support is enabled on the current MIDIAccess instance.

### Events

`MIDIAccess.statechange_event`

Called whenever a new MIDI port is added or an existing port changes state.

Examples
--------

The `Navigator.requestMIDIAccess()` method returns a promise that resolves with a `MIDIAccess` object. Information about the input and output ports is returned.

When a port changes state, information about that port is printed to the console.


```js
navigator.requestMIDIAccess().then((access) => {
  // Get lists of available MIDI controllers
  const inputs = access.inputs.values();
  const outputs = access.outputs.values();

  access.onstatechange = (event) => {
    // Print information about the (dis)connected MIDI controller
    console.log(event.port.name, event.port.manufacturer, event.port.state);
  };
});
```

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

| Specification |
| --- |
| Web MIDI API # midiaccess-interface |

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

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

The **`CSSMediaRule`** interface represents a single CSS `@media` rule.

CSSRule

CSSGroupingRule

CSSConditionRule

CSSMediaRuleInstance properties
-------------------

*Inherits properties from its ancestors `CSSConditionRule`, `CSSGroupingRule`, and `CSSRule`.*

`CSSMediaRule.media` Read only 

Returns a `MediaList` representing the intended destination medium for style information.

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

*No specific methods; inherits methods from its ancestors `CSSConditionRule`, `CSSGroupingRule`, and `CSSRule`.*

Examples
--------

 The CSS below includes a media query with one style rule.
 As this rule lives in the last stylesheet added to the document, it will be the first CSSRule returned by the last stylesheet in the document (`document.styleSheets[document.styleSheets.length-1].cssRules`).
 `myRules[0]` returns a `CSSMediaRule` object, from which we can get the `mediaText`.


```html
<p id="log"></p>
```



```css
@media (min-width: 500px) {
  body {
    color: blue;
  }
}
```



```js
const log = document.getElementById("log");
const myRules = document.styleSheets[document.styleSheets.length - 1].cssRules;
const mediaList = myRules[0]; // a CSSMediaRule representing the media query.
log.textContent += ` ${mediaList.media.mediaText}`;
```

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

| Specification |
| --- |
| CSS Conditional Rules Module Level 3 # the-cssmediarule-interface |

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

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