recursal/MDN huggingface dataset:
SVGElement: style property
==========================

The read-only **`style`** property of the `SVGElement` returns the *inline* style of an element in the form of a live `CSSStyleDeclaration` object that contains a list of all styles properties for that element with values assigned only for the attributes that are defined in the element's inline `style` attribute.

Shorthand properties are expanded. If you set `style="border-top: 1px solid black"`, the longhand properties (`border-top-color`, `border-top-style`, and `border-top-width`) are set instead.

This property is read-only, meaning it is not possible to assign a `CSSStyleDeclaration` object to it. Nevertheless, it is possible to set an inline style by assigning a *string* directly to the `style` property. In this case the string is forwarded to `CSSStyleDeclaration.cssText`. Using `style` in this manner will completely overwrite all inline styles on the element.

Therefore, to add specific styles to an element without altering other style values, it is generally preferable to set individual properties on the `CSSStyleDeclaration` object. For example, you can write `element.style.backgroundColor = "red"`.

A style declaration is reset by setting it to `null` or an empty string, e.g., `elt.style.color = null`.

**Note:** CSS property names are converted to JavaScript identifier with these rules:

* If the property is made of one word, it remains as it is: `height` stays as is (in lowercase).
* If the property is made of several words, separated by dashes, the dashes are removed and it is converted to camel case: `background-attachment` becomes `backgroundAttachment`.
* The property `float`, being a reserved JavaScript keyword, is converted to `cssFloat`.

The `style` property has the same priority in the CSS cascade as an inline style declaration set via the `style` attribute.

Value
-----

A live `CSSStyleDeclaration` object.

Examples
--------

### Getting style information

The following code snippet demonstrates how the `style` attribute is translated into a list of entries in `CSSStyleDeclaration` :


```html
<svg
 width="50"
 height="50"
 xmlns="http://www.w3.org/2000/svg"
 viewBox="0 0 250 250"
 width="250"
 height="250">
  <circle
 cx="100"
 cy="100"
 r="50"
 id="circle"
 style="fill: red; stroke: black; stroke-width: 2px;" />
</svg>
<pre id="out"></pre>
```



```js
const element = document.querySelector("circle");
const out = document.getElementById("out");
const elementStyle = element.style;

// We loop through all styles (for…of doesn't work with CSStyleDeclaration)
for (const prop in elementStyle) {
  if (Object.hasOwn(elementStyle, prop)) {
    out.textContent += `${
 elementStyle[prop]
 } = '${elementStyle.getPropertyValue(elementStyle[prop])}'\n`;
  }
}
```

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

| Specification |
| --- |
| CSS Object Model (CSSOM) # dom-elementcssinlinestyle-style |

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

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

See also
--------

* Using dynamic styling information
* `HTMLElement.style`
SVGElement: load event
======================

The `load` event fires on an `SVGElement` when it is loaded in the browser, e.g. in the DOM in the case of an embedded `<svg>`. It is basically the same as the standard `load` DOM event.

This event is not cancelable and does not bubble.

Syntax
------

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


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

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

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

A generic `Event`.

Examples
--------


```js
svgElem.addEventListener("load", () => {
  console.log("SVG loaded.");
});
```

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

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

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
SVGElement: error event
=======================

The `error` event is fired when an SVG element does not load properly or when an error occurs during script execution.

This basically implements the standard `error` DOM event.

This event is not cancelable.

Syntax
------

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


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

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

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

A generic `Event`.

Examples
--------


```js
svgElem.addEventListener("error", () => {
  console.log("SVG not loaded properly.");
});
```

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

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

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VRDisplayCapabilities: canPresent property
==========================================

**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 **`canPresent`** read-only property of the `VRDisplayCapabilities` interface returns a boolean value stating whether the VR display is capable of presenting content (e.g. through an HMD).

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

This is useful for identifying "magic window" devices that are capable of 6DoF tracking but for which `VRDisplay.requestPresent()` is not meaningful. If `canPresent` is `false`, calls to `VRDisplay.requestPresent()` will fail, and `VRDisplay.getEyeParameters()` will return `null`.

Value
-----

A boolean value.

Examples
--------

See `VRDisplayCapabilities` for example code.

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

This property 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
VRDisplayCapabilities: hasPosition property
===========================================

**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 **`hasPosition`** read-only property of the `VRDisplayCapabilities` interface returns `true` if the VR display can track and return position information.

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

Value
-----

A boolean value.

Examples
--------

See `VRDisplayCapabilities` for example code.

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

This property 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
VRDisplayCapabilities: hasOrientation property
==============================================

**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 **`hasOrientation`** read-only property of the `VRDisplayCapabilities` interface returns `true` if the VR display can track and return orientation information.

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

Value
-----

A boolean value.

Examples
--------

See `VRDisplayCapabilities` for example code.

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

This property 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
VRDisplayCapabilities: hasExternalDisplay property
==================================================

**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.

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

The **`hasExternalDisplay`** read-only property of the `VRDisplayCapabilities` interface returns `true` if the VR display is separate from the device's primary display.

**Note:** If presenting VR content would obscure other content on the device, this will return `false`, in which case the application should not attempt to mirror VR content or update non-VR UI because that content will not be visible.

Value
-----

A boolean value.

Examples
--------

See `VRDisplayCapabilities` for example code.

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

This property 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
VRDisplayCapabilities: maxLayers property
=========================================

**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 **`maxLayers`** read-only property of the `VRDisplayCapabilities` interface returns a number indicating the maximum number of `VRLayerInit`s that the VR display can present at once (e.g. the maximum length of the array that `VRDisplay.requestPresent()` can accept.)

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

Value
-----

A number, which must be 1 if `VRDisplayCapabilities.canPresent` is `true`, or 0 otherwise.

Examples
--------

See `VRDisplayCapabilities` for example code.

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

This property 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
GPUOutOfMemoryError: GPUOutOfMemoryError() constructor
======================================================

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

 The **`GPUOutOfMemoryError()`** constructor creates a new
 `GPUOutOfMemoryError` object instance.

Syntax
------


```js
new GPUOutOfMemoryError(message)
```

### Parameters

`message`

A string providing a human-readable message that explains why the error occurred.

Examples
--------

A developer would not manually use the constructor to create a `GPUOutOfMemoryError` object. The user agent uses this constructor to create an appropriate object when an out-of-memory error is surfaced by `GPUDevice.popErrorScope` or the `uncapturederror` event.

See the main `GPUOutOfMemoryError` page for a specific example involving a `GPUOutOfMemoryError` object instance.

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

| Specification |
| --- |
| WebGPU # dom-gpuoutofmemoryerror-gpuoutofmemoryerror |

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

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

See also
--------

* The WebGPU API
* WebGPU Error Handling best practices
XRCubeLayer: redraw event
=========================

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

The `redraw` event is sent to the `XRCubeLayer` object when the underlying resources of the layer are lost or when the XR Compositor can no longer reproject the layer. If this event is sent, authors should redraw the content of the layer in the next XR animation frame.

See also the `XRCompositionLayer.needsRedraw` property which is also available to `XRCubeLayer` objects through inheritance from `XRCompositionLayer`.

Syntax
------

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


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

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

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

An `XRLayerEvent`. Inherits from `Event`.

Event properties
----------------

*In addition to the properties listed below, properties from the parent interface, `Event`, are available.*

`layer` Read only 

The `XRLayer` which generated the event.

Examples
--------

### Using the `redraw` event

You can pass `redraw` to `addEventListener()`:


```js
cubeLayer.addEventListener("redraw", (event) => {
  // redraw the layer
});
```


Alternatively, you can use the `onredraw` event handler property to establish a handler for the `redraw` event:


```js
cubeLayer.onredraw = (event) => {
  // redraw the layer
};
```

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

| Specification |
| --- |
| WebXR Layers API Level 1 # eventdef-xrlayer-redraw |

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

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

See also
--------

* `XRCompositionLayer.needsRedraw`
XRCubeLayer: space property
===========================

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

The **`space`** property of the `XRCubeLayer` interface represents the layer's spatial relationship with the user's physical environment.

Value
-----

An `XRSpace`.

Examples
--------

### Updating the cube layer's space

The `XRWebGLBinding.createCubeLayer()` method creates a cube layer and requires a `space` property to be provided. The `XRCubeLayer.space` property can be used after layer creation to get the space used or to set it to a new one.


```js
const cubeLayer = xrGlBinding.createCubeLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
});

cubeLayer.space = someOtherSpace;
```

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

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrcubelayer-space |

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

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

See also
--------

* `XRSpace`
* `XRWebGLBinding.createCubeLayer()`
XRCubeLayer: orientation property
=================================

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

The **`orientation`** property of the `XRCubeLayer` interface represents the orientation relative to the `space` property.

Value
-----

A `DOMPointReadOnly`.

Examples
--------

### Updating the cube layer's orientation

The `XRWebGLBinding.createCubeLayer()` method creates a cube layer and allows specifying an `orientation`. The `XRCubeLayer.orientation` property can be used after layer creation to get the current orientation or to set it to a new one.


```js
const cubeLayer = xrGlBinding.createCubeLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
  orientation: DOMPointReadOnly.fromPoint({ x: 0.0, y: 0.0, z: 0.0, w: 1.0 }),
});

cubeLayer.orientation = someOtherPoint;
```

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

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrcubelayer-orientation |

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

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

See also
--------

* `DOMPointReadOnly`
* `XRSpace`
* `XRWebGLBinding.createCubeLayer()`
LinearAccelerationSensor: LinearAccelerationSensor() constructor
================================================================

 The **`LinearAccelerationSensor()`**
 constructor creates a new `LinearAccelerationSensor` object which
 provides on each reading the acceleration applied to the device along all three axes,
 but without the contribution of gravity.

Syntax
------


```js
new LinearAccelerationSensor()
new LinearAccelerationSensor(options)
```

### Parameters

`options` Optional

Options are as follows:

`frequency`

 The desired number of times per second a sample should
 be taken, meaning the number of times per second that the
 `reading` event will be called. A whole number or decimal may be
 used, the latter for frequencies less than a second. The actual reading frequency
 depends on device hardware and consequently may be less than requested.


`referenceFrame`

 Either `'device'` or
 `'screen'`. The default is `'device'`.



### Exceptions

`SecurityError` `DOMException`

Use of this feature was blocked by a Permissions Policy.

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

| Specification |
| --- |
| Accelerometer # dom-linearaccelerationsensor-linearaccelerationsensor |

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

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

See also
--------

* `reading` event
TrackEvent: track property
==========================

 The read-only **`track`** property of
 the `TrackEvent` interface specifies the media track object to which the
 event applies.

 The media track will be an `AudioTrack`,
 `VideoTrack`, or `TextTrack` object.

Value
-----

 An object which is one of the types `AudioTrack`,
 `VideoTrack`, or `TextTrack`, depending on the type of media
 represented by the track. This identifies the track to which the event applies.

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

| Specification |
| --- |
| HTML Standard # dom-trackevent-track-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TrackEvent: TrackEvent() constructor
====================================

 The **`TrackEvent()`** constructor
 creates and returns a new `TrackEvent` object describing an event which
 occurred on a list of tracks (`AudioTrackList`,
 `VideoTrackList`, or `TextTrackList`).

Syntax
------


```js
new TrackEvent(type)
new TrackEvent(type, options)
```

### Parameters

`type`

 A string with the name of the event.
 It is case-sensitive and browsers set it to `addtrack` or `removetrack`.


`options` Optional

An object that, *in addition of the properties defined in `Event()`*, can have the following properties:

`track` Optional

 The track to which the event refers; this is `null` by default, but
 should be set to a `VideoTrack`, `AudioTrack`, or
 `TextTrack` as appropriate given the type of track.



### Return value

 A new `TrackEvent` object, initialized as described by the
 inputs to the constructor.

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

| Specification |
| --- |
| HTML Standard # the-trackevent-interface |

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

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