recursal/MDN huggingface dataset:
AudioTrack: enabled property
============================

 The **`AudioTrack`** property
 **`enabled`** specifies whether or not the described audio
 track is currently enabled for use. If the track is disabled by setting
 `enabled` to `false`, the track is muted and does not produce
 audio.

Value
-----

 The `enabled` property is a Boolean whose value is `true` if the
 track is enabled; enabled tracks produce audio while the media is playing. Setting
 `enabled` to `false` effectively mutes the audio track, preventing
 it from contributing to the media's audio performance.

Example
-------

This example switches between the main and commentary audio tracks of a media element.


```js
function swapCommentaryMain() {
  const videoElem = document.getElementById("main-video");
  let audioTrackMain;
  let audioTrackCommentary;

  videoElem.audioTracks.forEach((track) => {
    if (track.kind === "main") {
      audioTrackMain = track;
    } else if (track.kind === "commentary") {
      audioTrackCommentary = track;
    }
  });

  if (audioTrackMain && audioTrackCommentary) {
    const commentaryEnabled = audioTrackCommentary.enabled;
    audioTrackCommentary.enabled = audioTrackMain.enabled;
    audioTrackMain.enabled = commentaryEnabled;
  }
}
```


 The `swapCommentaryMain()` function above finds within the audio tracks of
 the `<video>` element `"main-video"` the audio tracks whose
 `kind` values are `"main"` and
 `"commentary"`. These represent the primary audio track and the commentary
 track.


**Note:** This example assumes that there is only one of each kind of
 track in the video, but this is not necessarily the case.


 The element's audio tracks are then scanned through using the JavaScript
 `forEach()` method (although the
 `audioTracks` property of a media element
 isn't actually a JavaScript array, it can be accessed like one for the most part).

 The scan looks for the tracks whose `kind` values are
 `"main"` and `"commentary"` and remembers those
 `AudioTrack` objects. Once those have been found, the values of the two
 tracks' `enabled` properties are exchanged, which results in swapping which
 of the two tracks is currently active.

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

| Specification |
| --- |
| HTML Standard # dom-audiotrack-enabled-dev |

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

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

 The **`id`** property contains a
 string which uniquely identifies the track represented by the
 **`AudioTrack`**.

 This ID can be used with the
 `AudioTrackList.getTrackById()` method to locate a specific track within
 the media associated with a media element. The track ID can also be used as the fragment of a URL that loads the specific track
 (if the media supports media fragments).

Value
-----

 A string which identifies the track, suitable for use when calling
 `getTrackById()` on an
 `AudioTrackList` such as the one specified by a media element's
 `audioTracks` property.

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

| Specification |
| --- |
| HTML Standard # dom-audiotrack-id-dev |

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

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

The **`DOMRectReadOnly()`** constructor creates a new `DOMRectReadOnly` object.

Syntax
------


```js
new DOMRectReadOnly(x, y, width, height)
```

### Parameters

`x`

 The `x` coordinate of the `DOMRectReadOnly`'s
 origin.


`y`

 The `y` coordinate of the `DOMRectReadOnly`'s
 origin.


`width`

The width of the `DOMRectReadOnly`.

`height`

The height of the `DOMRectReadOnly`.

Examples
--------

To create a new `DOMRectReadOnly`, you could run a line of code like so:


```js
const myDOMRect = new DOMRectReadOnly(0, 0, 100, 100);
// running 'myDOMRect' in the console would then return
// DOMRectReadOnly { x: 0, y: 0, width: 100, height: 100, top: 0, right: 100, bottom: 100, left: 0 }
```

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-domrectreadonly |

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

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

See also
--------

* `DOMPoint`
* `DOMRect`
DOMRectReadOnly: bottom property
================================

The **`bottom`** read-only property of the **`DOMRectReadOnly`** interface returns the bottom coordinate value of the `DOMRect`. (Has the same value as `y + height`, or `y` if `height` is negative.)

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-bottom |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: fromRect() static method
=========================================

 The **`fromRect()`** static method of the
 `DOMRectReadOnly` object creates a new `DOMRectReadOnly`
 object with a given location and dimensions.

Syntax
------


```js
DOMRectReadOnly.fromRect()
DOMRectReadOnly.fromRect(rectangle)
```

### Parameters

`rectangle` Optional

 An object specifying the location and dimensions of a rectangle. All properties
 default to `0`. The properties are:


* `x`: The coordinate of the left side of the rectangle.
* `y`: The coordinate of the top side of the rectangle.
* `width`: The width of the rectangle.
* `height`: The height of the rectangle.

### Return value

An instance of `DOMRectReadOnly`.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-fromrect |

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

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

The **`height`** read-only property of the **`DOMRectReadOnly`** interface represents the height of the `DOMRect`.

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-height |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: right property
===============================

The **`right`** read-only property of the **`DOMRectReadOnly`** interface returns the right coordinate value of the `DOMRect`. (Has the same value as `x + width`, or `x` if `width` is negative.)

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-right |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: x property
===========================

The **`x`** read-only property of the **`DOMRectReadOnly`** interface represents the x coordinate of the `DOMRect`'s origin.

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-x |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: left property
==============================

The **`left`** read-only property of the **`DOMRectReadOnly`** interface returns the left coordinate value of the `DOMRect`. (Has the same value as `x`, or `x + width` if `width` is negative.)

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-left |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: y property
===========================

The **`y`** read-only property of the **`DOMRectReadOnly`** interface represents the y coordinate of the `DOMRect`'s origin.

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-y |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: top property
=============================

The **`top`** read-only property of the **`DOMRectReadOnly`** interface returns the top coordinate value of the `DOMRect`. (Has the same value as `y`, or `y + height` if `height` is negative.)

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-top |

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

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

See also
--------

* `DOMRect`
DOMRectReadOnly: width property
===============================

The **`width`** read-only property of the **`DOMRectReadOnly`** interface represents the width of the `DOMRect`.

Value
-----

A double.

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

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-domrectreadonly-width |

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

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

See also
--------

* `DOMRect`
RTCError: errorDetail property
==============================

 The `RTCError` interface's read-only
 **`errorDetail`** property is a string indicating the WebRTC-specific error code that occurred.

Value
-----

 A read-only string whose value indicates the type of WebRTC-specific error that
 occurred on an `RTCPeerConnection`. The possible values are:

`data-channel-failure`

The connection's `RTCDataChannel` has failed.

`dtls-failure`

 The negotiation of the DTLS connection failed, or the connection was
 terminated with a fatal error. The error's `message`
 contains details about the nature of the error. If a fatal error is *received*,
 the error object's `receivedAlert` property is
 set to the value of the DTLSL alert received. If, on the other hand, a fatal error was
 *sent*, the `sentAlert` is set to the
 alert's value.


`fingerprint-failure`

 The remote certificate for the `RTCDtlsTransport` didn't match any of
 the fingerprints listed in the SDP. If the remote peer can't match the local
 certificate against the provided fingerprints, this error doesn't occur, though this
 situation may result instead in a `dtls-failure` error.


`hardware-encoder-error`

The hardware encoder doesn't support the given configuration parameters.

`hardware-encoder-not-available`

 The hardware encoder resources required to accomplish the requested operation aren't
 available.


`sctp-failure`

 The SCTP negotiation has failed, or the connection has terminated
 with a fatal error. The SCTP cause code can be found in the `RTCError`
 object's `sctpCauseCode`. SCTP error cause
 codes 1-13 are defined in the SCTP specification: RFC 4960, section 3.3.10.


`sdp-syntax-error`

 The SDP syntax is invalid. The error's `sdpLineNumber` property indicates the line number within the SDP at which the
 error was detected.


Examples
--------

tbd

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcerror-errordetail |

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

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

 The read-only **`sctpCauseCode`** property in an
 `RTCError` object provides the SCTP cause code explaining
 why the SCTP negotiation failed, if the `RTCError` represents an SCTP error.

Value
-----

 An unsigned long integer value specifying SCTP cause code explaining why the error
 occurred. This property is `null` if the error isn't an SCTP error, with its
 `errorDetail` property set to
 `sctp-failure`.

 The standard SCTP error cause codes, numbered 1-13, are defined in the SCTP
 specification: RFC 4960, section 3.3.10.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcerror-sctpcausecode |

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

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

 The `RTCError` read-only property
 **`receivedAlert`** specifies the fatal DTLS
 error which resulted in an alert being received from the remote peer.

Value
-----

 An unsigned long integer value specifying the fatal DTLS error which
 resulted in an alert being received from the remote peer.


**Note:** This property is `null` if the `RTCError` doesn't represent a
 DTLS error (with `errorDetail` set to
 `dtls-failure`).


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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcerror-receivedalert |

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

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

 The read-only **`sentAlert`** property in an
 `RTCError` object specifies the DTLS alert number occurred
 while sending data to the remote peer, if the error represents an outbound DTLS error.

Value
-----

 An unsigned integer value providing the DTLS alert number corresponding to the DTLS
 error which was sent to the remote peer, as represented by this `RTCError`
 object. This property is `null` if `errorDetail` isn't `dtls-failure`.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcerror-sentalert |

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

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

 The `RTCError` interface's read-only property
 **`sdpLineNumber`** specifies the line number within the
 SDP at which a syntax error occurred while parsing it.

Value
-----

 An unsigned integer value indicating the line within the SDP at which the syntax error
 described by the `RTCError` object occurred. The lines are numbed starting
 with line 1.

 This property is `null` unless the value of
 `errorDetail` is `sdp-syntax-error`.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcerror-sdplinenumber |

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

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

 The **`AnimationEvent.animationName`** read-only property is a
 string containing the value of the `animation-name` CSS
 property associated with the transition.

Value
-----

A string containing the value of the `animation-name` CSS property.

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

| Specification |
| --- |
| CSS Animations Level 1 # dom-animationevent-animationname |

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

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

See also
--------

* Using CSS animations
* Animation-related CSS properties and at-rules: `animation`,
 `animation-delay`, `animation-direction`,
 `animation-duration`, `animation-fill-mode`,
 `animation-iteration-count`, `animation-name`,
 `animation-play-state`, `animation-timing-function`,
 `@keyframes`.
* The `AnimationEvent` interface it belongs to.
AnimationEvent: elapsedTime property
====================================

 The **`AnimationEvent.elapsedTime`** read-only property is a
 `float` giving the amount of time the animation has been running, in seconds,
 when this event fired, excluding any time the animation was paused. For an
 `animationstart` event,
 `elapsedTime` is `0.0` unless there was a negative value for
 `animation-delay`, in which case the event will be fired with
 `elapsedTime` containing `(-1 * delay)`.

Value
-----

A `float` giving the amount of time in seconds.

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

| Specification |
| --- |
| CSS Animations Level 1 # dom-animationevent-elapsedtime |

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

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

See also
--------

* Using CSS animations
* Animation-related CSS properties and at-rules: `animation`,
 `animation-delay`, `animation-direction`,
 `animation-duration`, `animation-fill-mode`,
 `animation-iteration-count`, `animation-name`,
 `animation-play-state`, `animation-timing-function`,
 `@keyframes`.
* The `AnimationEvent` interface it belongs to.
AnimationEvent: AnimationEvent() constructor
============================================

The **`AnimationEvent()`** constructor returns a new `AnimationEvent` object, representing an event in relation with an animation.

Syntax
------


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

### Parameters

`type`

 A string with the name of the type of the `AnimationEvent`.
 It is case-sensitive and browsers set it to `animationstart`, `animationend`, or `animationiteration`.


`options` Optional

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

`animationName` Optional

A string containing the value of the `animation-name` CSS property associated with the transition. It defaults to `""`.

`elapsedTime` Optional

 A `float` giving the amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused.
 For an `animationstart` event, `elapsedTime` is `0.0` unless there was a negative value for `animation-delay`,
 in which case the event will be fired with `elapsedTime` containing `(-1 * delay)`. It defaults to `0.0`.


`pseudoElement` Optional

A string, starting with `"::"`, containing the name of the pseudo-element the animation runs on. If the animation doesn't run on a pseudo-element but on the element itself, specify an empty string: `""`. It defaults to `""`.


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

| Specification |
| --- |
| CSS Animations Level 1 # dom-animationevent-animationevent |

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

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

See also
--------

* Using CSS animations
* Animation-related CSS properties and at-rules: `animation`,
 `animation-delay`, `animation-direction`,
 `animation-duration`, `animation-fill-mode`,
 `animation-iteration-count`, `animation-name`,
 `animation-play-state`, `animation-timing-function`,
 `@keyframes`
* The `AnimationEvent` interface it belongs to.
AnimationEvent: pseudoElement property
======================================

 The **`AnimationEvent.pseudoElement`** read-only property is a
 string, starting with `'::'`, containing the name of the pseudo-element the animation runs on.
 If the animation doesn't run on a pseudo-element but on the element, an empty string: `''`.

Value
-----

A string, starting with `'::'`, containing the name of the pseudo-element the animation runs on.

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

| Specification |
| --- |
| CSS Animations Level 1 # dom-animationevent-pseudoelement |

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

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

See also
--------

* Using CSS animations
* Animation-related CSS properties and at-rules: `animation`,
 `animation-delay`, `animation-direction`,
 `animation-duration`, `animation-fill-mode`,
 `animation-iteration-count`, `animation-name`,
 `animation-play-state`, `animation-timing-function`,
 `@keyframes`.
* The `AnimationEvent` interface it belongs to.
FontData: fullName property
===========================

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

The **`fullName`** read-only property of the `FontData` interface returns the full name of the font face. This is usually a human-readable name used to identify the font, e.g., "Optima Bold".

Examples include:

* Apple SD Gothic Neo UltraLight
* Arial Black
* Avenir Next Heavy
* Katari Medium Italic
* YuMincho +36p Kana Extrabold
Value
-----

A string.

Examples
--------

The following snippet will query for all available fonts, and log metadata. This could be used, for example, to populate a font-picker control.


```js
async function logFontData() {
  try {
    const availableFonts = await window.queryLocalFonts();
    for (const fontData of availableFonts) {
      console.log(fontData.postscriptName);
      console.log(fontData.fullName);
      console.log(fontData.family);
      console.log(fontData.style);
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}
```

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

| Specification |
| --- |
| Local Font Access # ref-for-dom-fontdata-fullname |

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

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

See also
--------

* Use advanced typography with local fonts
* `@font-face`
FontData: postscriptName property
=================================

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

The **`postscriptName`** read-only property of the `FontData` interface returns the PostScript name of the font face.

This is the name used to uniquely identify the PostScript font, and is generally an unbroken sequence of characters that includes the font's name and style.

Examples include:

* AppleSDGothicNeo-UltraLight
* Arial-Black
* AvenirNext-Heavy
* Katari-MediumItalic
* YuMin\_36pKn-Extrabold
Value
-----

A string.

Examples
--------

The following snippet will query for all available fonts, and log metadata. This could be used, for example, to populate a font-picker control.


```js
async function logFontData() {
  try {
    const availableFonts = await window.queryLocalFonts();
    for (const fontData of availableFonts) {
      console.log(fontData.postscriptName);
      console.log(fontData.fullName);
      console.log(fontData.family);
      console.log(fontData.style);
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}
```

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

| Specification |
| --- |
| Local Font Access # ref-for-dom-fontdata-postscriptname |

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

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

See also
--------

* Use advanced typography with local fonts
* `@font-face`