recursal/MDN huggingface dataset:
Force Touch events
==================

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

**Force Touch Events** are a proprietary, Apple-specific feature which makes possible (where supported by the input hardware) new interactions based on how hard the user clicks or presses down on the touchscreen or trackpad.

Events
------

`webkitmouseforcewillbegin` 
Non-standard

This event is fired before the `mousedown` event. Its main use is that it can be `Event.preventDefault()`ed.

`webkitmouseforcedown` 
Non-standard

This event is fired after the `mousedown` event as soon as sufficient pressure has been applied for it to qualify as a "force click".

`webkitmouseforceup` 
Non-standard

This event is fired after the `webkitmouseforcedown` event as soon as the pressure has been reduced sufficiently to end the "force click".

`webkitmouseforcechanged` 
Non-standard

This event is fired each time the amount of pressure changes. This event first fires after the `mousedown` event and stops firing before the `mouseup` event.

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

The following property is known to be available on the `webkitmouseforcewillbegin`, `mousedown`, `webkitmouseforcechanged`, `webkitmouseforcedown`, `webkitmouseforceup`, `mousemove`, and `mouseup` event objects:

`MouseEvent.webkitForce` 
Non-standard
 Read only 

The amount of pressure currently being applied to the trackpad/touchscreen.

Constants
---------

These constants are useful for determining the relative intensity of the pressure indicated by `MouseEvent.webkitForce`:

`MouseEvent.WEBKIT_FORCE_AT_MOUSE_DOWN` 
Non-standard
 Read only 

Minimum force necessary for a normal click.

`MouseEvent.WEBKIT_FORCE_AT_FORCE_MOUSE_DOWN` 
Non-standard
 Read only 

Minimum force necessary for a force click.

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

*Not part of any specification.* Apple has a description at the Mac Developer Library.
KeyboardLayoutMap
=================

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

The **`KeyboardLayoutMap`** interface of the Keyboard API is a read-only object with functions for retrieving the string associated with specific physical keys.

A `KeyboardLayoutMap` instance is a read-only `Map`-like object, in which each key is a string identifying the unique physical key on the keyboard (a "key code"), and the corresponding value is the associated key attribute value (which may be affected by the keyboard layout, and so on).

A list of valid keys is found in the UI Events KeyboardEvent code Values specification.

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

`KeyboardLayoutMap.size` Read only  
Experimental

Returns the number of elements in the `KeyboardLayoutMap` object.

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

`KeyboardLayoutMap.[@@iterator]()` 
Experimental

Returns a new Iterator object that contains the key/value pairs.

`KeyboardLayoutMap.entries()` 
Experimental

Returns a new Iterator object that contains the key/value pairs.

`KeyboardLayoutMap.forEach()` 
Experimental

Executes a provided function once for each element of `KeyboardLayoutMap`.

`KeyboardLayoutMap.get()` 
Experimental

Returns the element with the given key from the `KeyboardLayoutMap` object.

`KeyboardLayoutMap.has()` 
Experimental

Returns a boolean indicating whether the `KeyboardLayoutMap` object has an element with the specified key.

`KeyboardLayoutMap.keys()` 
Experimental

Returns a new Iterator object that contains the keys for each index in the `KeyboardLayoutMap` object.

`KeyboardLayoutMap.values()` 
Experimental

Returns a new Iterator object that contains the values for each index in the `KeyboardLayoutMap` object.

Examples
--------

The following example demonstrates how to get the location- or layout-specific string associated with the keyboard code that corresponds to the 'W' key on an English QWERTY keyboard.


```js
navigator.keyboard.getLayoutMap().then((keyboardLayoutMap) => {
  const upKey = keyboardLayoutMap.get("KeyW");
  window.alert(`Press ${upKey} to move up.`);
});
```

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

| Specification |
| --- |
| Keyboard Map # keyboardlayoutmap-interface |

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

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

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
**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`ImageTrackList`** interface of the WebCodecs API represents a list of image tracks.

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

`ImageTrackList.ready` Read only  
Experimental

Returns a `promise` that resolves once the `ImageTrackList` has been populated with `tracks`.

`ImageTrackList.length` Read only  
Experimental

Returns an integer indicating the length of the `ImageTrackList`.

`ImageTrackList.selectedIndex` Read only  
Experimental

Returns an integer indicating the index of the `selectedTrack`.

`ImageTrackList.selectedTrack` Read only  
Experimental

Returns the selected `ImageTrack`.

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

| Specification |
| --- |
| WebCodecs # imagetracklist-interface |

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

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

The **`SVGFEMergeNodeElement`** interface corresponds to the `<feMergeNode>` element.

EventTarget

Node

Element

SVGElement

SVGFEMergeNodeElementInstance properties
-------------------

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

`SVGFEMergeNodeElement.in1` Read only 

An `SVGAnimatedString` corresponding to the `in` attribute of the given element.

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

*This interface does not provide any specific methods, but implements those of its parent, `SVGElement`.*

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

| Specification |
| --- |
| Filter Effects Module Level 1 # InterfaceSVGFEMergeNodeElement |

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

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

See also
--------

* `<feMergeNode>`
VRStageParameters
=================

**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 **`VRStageParameters`** interface of the WebVR API represents the values describing the stage area for devices that support room-scale experiences.

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

This interface is accessible through the `VRDisplay.stageParameters` property.

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

`VRStageParameters.sittingToStandingTransform` 
Deprecated
 Read only  
Non-standard

Contains a matrix that transforms the sitting-space view matrices of `VRFrameData` to standing-space.

`VRStageParameters.sizeX` 
Deprecated
 Read only  
Non-standard

*Returns the width* of the play-area bounds in meters.

`VRStageParameters.sizeY` 
Deprecated
 Read only  
Non-standard

*Returns the depth* of the play-area bounds in meters.

Examples
--------


```js
const info = document.querySelector("p");
let vrDisplay;

navigator.getVRDisplays().then((displays) => {
  vrDisplay = displays[0];
  const stageParams = vrDisplay.stageParameters;
  // stageParams is a VRStageParameters object

  if (stageParams === null) {
    info.textContent =
      "Your VR Hardware does not support room-scale experiences.";
  } else {
    info.innerHTML =
      `<strong>Display stage parameters</strong><br>` +
      `Sitting to standing transform: ${stageParams.sittingToStandingTransform}<br>` +
      `Play area width (m): ${stageParams.sizeX}<br>` +
      `Play area depth (m): ${stageParams.sizeY}`;
  }
});
```

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
SVGAnimatedTransformList
========================

SVG animated transform list interface
-------------------------------------

The `SVGAnimatedTransformList` interface is used for attributes which take a list of numbers and which can be animated.

### Interface overview

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

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

| Name | Type | Description |
| --- | --- | --- |
| `baseVal` | `SVGTransformList` | The base value of the given attribute before applying any animations. |
| `animVal` | `SVGTransformList` | 
 A read only `SVGTransformList` representing
 the current animated value of the given attribute. If the given
 attribute is not currently being animated, then the
 `SVGTransformList` 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 `SVGAnimatedTransformList` interface doesn't provide any specific methods.

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

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

The **`CSSStyleRule`** interface represents a single CSS style rule.

CSSRule

CSSGroupingRule

CSSStyleRuleInstance properties
-------------------

*Inherits properties from its ancestor `CSSRule`.*

`CSSStyleRule.selectorText`

Returns the textual representation of the selector for this rule, e.g. `"h1, h2"`.

`CSSStyleRule.style` Read only 

Returns the `CSSStyleDeclaration` object for the rule.

`CSSStyleRule.styleMap` Read only 

Returns a `StylePropertyMap` object which provides access to the rule's property-value pairs.

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

*No specific methods; inherits methods from its ancestor `CSSRule`.*

Examples
--------

 The CSS includes one style rule. This will be the first `CSSRule` returned by `document.styleSheets[0].cssRules`.
 `myRules[0]` therefore returns a `CSSStyleRule` object representing the rule defined for `h1`.


```css
h1 {
  color: pink;
}
```



```js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // a CSSStyleRule representing the h1.
```

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

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

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

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

**Note:** This feature is available in Web Workers

The **`File`** interface provides information about files and allows JavaScript in a web page to access their content.

`File` objects are generally retrieved from a `FileList` object returned as a result of a user selecting files using the `<input>` element, or from a drag and drop operation's `DataTransfer` object.

A `File` object is a specific kind of `Blob`, and can be used in any context that a Blob can. In particular, `FileReader`, `URL.createObjectURL()`, `createImageBitmap()`, the `body` option to `fetch()`, and `XMLHttpRequest.send()` accept both `Blob`s and `File`s.

See Using files from web applications for more information and examples.

Blob

FileConstructor
-----------

`File()`

Returns a newly constructed `File`.

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

*The `File` interface also inherits properties from the `Blob` interface.*

`File.lastModified` Read only 

Returns the last modified time of the file, in millisecond since the UNIX epoch (January 1st, 1970 at Midnight).

`File.lastModifiedDate` 
Deprecated
 Read only  
Non-standard

Returns the last modified `Date` of the file referenced by the `File` object.

`File.name` Read only 

Returns the name of the file referenced by the `File` object.

`File.webkitRelativePath` Read only 

Returns the path the URL of the `File` is relative to.

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

*The `File` interface also inherits methods from the `Blob` interface.*

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

| Specification |
| --- |
| File API # file-section |

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

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

See also
--------

* Using files from web applications
* `FileReader`
HTMLParamElement
================

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

The **`HTMLParamElement`** interface provides special properties (beyond those of the regular `HTMLElement` object interface it inherits) for manipulating `<param>` elements, representing a pair of a key and a value that acts as a parameter for an `<object>` element.

EventTarget

Node

Element

HTMLElement

HTMLParamElementInstance properties
-------------------

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

`HTMLParamElement.name` 
Deprecated

A string representing the name of the parameter. It reflects the `name` attribute.

`HTMLParamElement.value` 
Deprecated

A string representing the value associated to the parameter. It reflects the `value` attribute.

`HTMLParamElement.type` 
Deprecated

A string containing the type of the parameter when `valueType` has the `"ref"` value. It reflects the `type` attribute.

`HTMLParamElement.valueType` 
Deprecated

A string containing the type of the `value`. It reflects the valuetype attribute and has one of the values: `"data"`, `"ref"`, or `"object"`.

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

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

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

| Specification |
| --- |
| HTML Standard # htmlparamelement |

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: `<param>`.
XPathNSResolver
===============

The `XPathNSResolver` interface permits prefix strings in an XPath expression to be properly bound to namespace URI strings.

The `XPathEvaluator` interface can construct an implementation of `XPathNSResolver` from a node, or the interface may be implemented by any application.

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

`XPathNSResolver.lookupNamespaceURI()`

Looks up the namespace URI associated to the given namespace prefix.

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

#### No specification found

No specification data found for `api.XPathNSResolver`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

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

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

See also
--------

* `XPathEvaluator`
GamepadButton
=============

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

The **`GamepadButton`** interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device.

A `GamepadButton` object is returned by querying any value of the array returned by the `buttons` property of the `Gamepad` interface.

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

`GamepadButton.pressed` Read only 

A boolean value indicating whether the button is currently pressed (`true`) or unpressed (`false`).

`GamepadButton.touched` Read only 

A boolean value indicating whether the button is currently touched (`true`) or not touched (`false`).

`GamepadButton.value` Read only 

A double value used to represent the current state of analog buttons, such as the triggers on many modern gamepads. The values are normalized to the range 0.0 —1.0, with 0.0 representing a button that is not pressed, and 1.0 representing a button that is fully pressed.

Example
-------

The button values in the following example are stored as an array of `GamepadButton` objects. This simple example checks to see if the `GamepadButton.value` of a button is greater than `0`, or if the `GamepadButton.pressed` property indicates the button has been pressed.


```js
function gameLoop() {
  const gp = navigator.getGamepads()[0];

  if (gp.buttons[0].value > 0 || gp.buttons[0].pressed) {
    b--;
  } else if (gp.buttons[1].value > 0 || gp.buttons[1].pressed) {
    a++;
  } else if (gp.buttons[2].value > 0 || gp.buttons[2].pressed) {
    b++;
  } else if (gp.buttons[3].value > 0 || gp.buttons[3].pressed) {
    a--;
  }

  ball.style.left = `${a \* 2}px`; // ball is a UI widget
  ball.style.top = `${b \* 2}px`;

  requestAnimationFrame(gameLoop);
}
```

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

| Specification |
| --- |
| Gamepad # gamepadbutton-interface |

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

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

See also
--------

Using the Gamepad API
XRLayerEvent
============

**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 **`XRLayerEvent`** interface of the WebXR Device API is the event type for events related to a change of state of an `XRLayer` object. These events occur, for example, when the layer needs to be redrawn.

Event

XRLayerEventConstructor
-----------

`XRLayerEvent()` 
Experimental

Creates and returns a new `XRLayerEvent` object.

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

*In addition to properties inherited from its parent interface, `Event`, `XRLayerEvent` provides the following:*

`layer` Read only  
Experimental

The `XRLayer` which generated the event.

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

*While `XRSessionEvent` defines no methods, it inherits methods from its parent interface, `Event`.*

Event types
-----------

*The following events are represented using the `XRLayerEvent` interface, and are permitted values for its `type` parameter.*

### `redraw` event

The `redraw` event is tent to the layer 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. It is available on the following layer objects:

* `XRQuadLayer`: `redraw`
* `XRCylinderLayer`: `redraw`
* `XREquirectLayer`: `redraw`
* `XRCubeLayer`: `redraw`
Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # xrlayerevent-interface |

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

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

See also
--------

* `XRCompositionLayer.needsRedraw`
DOMTokenList
============

The **`DOMTokenList`** interface represents a set of space-separated tokens. Such a set is returned by `Element.classList` or `HTMLLinkElement.relList`, and many others.

A `DOMTokenList` is indexed beginning with `0` as with JavaScript `Array` objects. `DOMTokenList` is always case-sensitive.

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

`DOMTokenList.length` Read only 

An `integer` representing the number of objects stored in the object.

`DOMTokenList.value`

A stringifier property that returns the value of the list as a string.

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

`DOMTokenList.item()`

Returns the item in the list by its index, or `null` if the index is greater than or equal to the list's `length`.

`DOMTokenList.contains()`

Returns `true` if the list contains the given token, otherwise `false`.

`DOMTokenList.add()`

Adds the specified tokens to the list.

`DOMTokenList.remove()`

Removes the specified tokens from the list.

`DOMTokenList.replace()`

Replaces the token with another one.

`DOMTokenList.supports()`

Returns `true` if the given token is in the associated attribute's supported tokens.

`DOMTokenList.toggle()`

Removes the token from the list if it exists, or adds it to the list if it doesn't. Returns a boolean indicating whether the token is in the list after the operation.

`DOMTokenList.entries()`

Returns an iterator, allowing you to go through all key/value pairs contained in this object.

`DOMTokenList.forEach()`

Executes a provided callback function once for each `DOMTokenList` element.

`DOMTokenList.keys()`

Returns an iterator, allowing you to go through all keys of the key/value pairs contained in this object.

`DOMTokenList.values()`

Returns an iterator, allowing you to go through all values of the key/value pairs contained in this object.

Examples
--------

In the following simple example, we retrieve the list of classes set on a `<p>` element as a `DOMTokenList` using `Element.classList`, add a class using `DOMTokenList.add()`, and then update the `Node.textContent` of the `<p>` to equal the `DOMTokenList`.

First, the HTML:


```html
<p class="a b c"></p>
```


Now the JavaScript:


```js
let para = document.querySelector("p");
let classes = para.classList;
para.classList.add("d");
para.textContent = `paragraph classList is "${classes}"`;
```


The output looks like this:

Trimming of whitespace and removal of duplicates
------------------------------------------------

Methods that modify the `DOMTokenList` (such as `DOMTokenList.add()`) automatically trim any excess Whitespace and remove duplicate values from the list. For example:


```html
<span class=" d d e f"></span>
```



```js
let span = document.querySelector("span");
let classes = span.classList;
span.classList.add("x");
span.textContent = `span classList is "${classes}"`;
```


The output looks like this:

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

| Specification |
| --- |
| DOM Standard # interface-domtokenlist |

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

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