recursal/MDN huggingface dataset:
CSSRotate
=========

The **`CSSRotate`** interface of the CSS\_Object\_Model#css\_typed\_object\_model represents the rotate value of the individual `transform` property in CSS. It inherits properties and methods from its parent `CSSTransformValue`.

CSSTransformComponent

CSSRotateConstructor
-----------

`CSSRotate()`

Creates a new `CSSRotate` object.

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

`x`

Returns or sets the x-axis value.

`y`

Returns or sets the y-axis value.

`z`

Returns or sets the z-axis value.

`angle`

Returns or sets the angle value.

Examples
--------

To do.

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

| Specification |
| --- |
| CSS Typed OM Level 1 # cssrotate |

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

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

The **`CanvasCaptureMediaStreamTrack`** interface of the Media Capture and Streams API represents the video track contained in a `MediaStream` being generated from a `<canvas>` following a call to `HTMLCanvasElement.captureStream()`.

EventTarget

MediaStreamTrack

CanvasCaptureMediaStreamTrackInstance properties
-------------------

*This interface inherits the properties of its parent, `MediaStreamTrack`.*

`CanvasCaptureMediaStreamTrack.canvas` Read only 

Returns the `HTMLCanvasElement` object whose surface is captured in real-time.

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

*This interface inherits the methods of its parent, `MediaStreamTrack`.*

`CanvasCaptureMediaStreamTrack.requestFrame()`

Manually forces a frame to be captured and sent to the stream. This lets applications that wish to specify the frame capture times directly do so, if they specified a `frameRate` of 0 when calling `captureStream()`.

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

| Specification |
| --- |
| Media Capture from DOM Elements # the-canvascapturemediastreamtrack |

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

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

See also
--------

* `HTMLCanvasElement.captureStream()` to begin capturing frames from a canvas
PictureInPictureEvent
=====================

The **`PictureInPictureEvent`** interface represents picture-in-picture-related events, including `enterpictureinpicture`, `leavepictureinpicture` and `resize`

Event

PictureInPictureEventConstructor
-----------

`PictureInPictureEvent()`

Creates a `PictureInPictureEvent` event with the given parameters.

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

*This interface also inherits properties from its parent `Event`*.

`PictureInPictureEvent.pictureInPictureWindow`

Returns the `PictureInPictureWindow` the event relates to.

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

*This interface also inherits methods from its parent `Event`*.

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

| Specification |
| --- |
| Picture-in-Picture # event-types |

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

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

See also
--------

* The `Event` base interface
SVGPatternElement
=================

The **`SVGPatternElement`** interface corresponds to the `<pattern>` element.

EventTarget

Node

Element

SVGElement

SVGPatternElementInstance properties
-------------------

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

`SVGPatternElement.href` Read only 

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

`SVGPatternElement.patternUnits` Read only 

An `SVGAnimatedEnumeration` corresponding to the `patternUnits` attribute of the given `<pattern>` element. Takes one of the constants defined in `SVGUnitTypes`.

`SVGPatternElement.patternContentUnits` Read only 

An `SVGAnimatedEnumeration` corresponding to the `patternContentUnits` attribute of the given `<pattern>` element. Takes one of the constants defined in `SVGUnitTypes`.

`SVGPatternElement.patternTransform` Read only 

An `SVGAnimatedTransformList` corresponding to the `patternTransform` attribute of the given `<pattern>` element.

`SVGPatternElement.x` Read only 

An `SVGAnimatedEnumeration` corresponding to the `x` attribute of the given `<pattern>` element.

`SVGPatternElement.y` Read only 

An `SVGAnimatedEnumeration` corresponding to the `y` attribute of the given `<pattern>` element.

`SVGPatternElement.width` Read only 

An `SVGAnimatedEnumeration` corresponding to the `width` attribute of the given `<pattern>` element.

`SVGPatternElement.height` Read only 

An `SVGAnimatedEnumeration` corresponding to the `height` attribute of the given `<pattern>` element.

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

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

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

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

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

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

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

The **`WindowControlsOverlayGeometryChangeEvent`** interface of the Window Controls Overlay API is passed to `geometrychange` when the size or visibility of a desktop Progress Web App's title bar region changes.

Event

WindowControlsOverlayGeometryChangeEventConstructor
-----------

`WindowControlsOverlayGeometryChangeEvent()` 
Experimental

Creates a `WindowControlsOverlayGeometryChangeEvent` event with the given parameters.

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

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

`WindowControlsOverlayGeometryChangeEvent.titlebarAreaRect` Read only  
Experimental

A `DOMRect` representing the position and size of the title bar region.

`WindowControlsOverlayGeometryChangeEvent.visible` Read only  
Experimental

A Boolean that indicates whether the window controls overlay is visible or not.

Examples
--------

 The following example shows how to use a `WindowControlsOverlayGeometryChangeEvent` instance by adding an
 event handler on the `Navigator.windowControlsOverlay` property, to listen to geometry changes of a PWA's title bar region.


```js
if ("windowControlsOverlay" in navigator) {
  navigator.windowControlsOverlay.addEventListener(
    "geometrychange",
    (event) => {
      if (event.visible) {
        const rect = event.titlebarAreaRect;
        // Do something with the coordinates of the title bar area.
      }
    },
  );
}
```

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

| Specification |
| --- |
| Window Controls Overlay # windowcontrolsoverlay-interface |

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

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

See also
--------

* The Window Controls Overlay API.
Web Share API
=============

The **Web Share API** provides a mechanism for sharing text, links, files, and other content to an arbitrary *share target* selected by the user.

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

**Note:** This API is *not available* in Web Workers (not exposed via `WorkerNavigator`).

**Note:** This API should not be confused with the Web Share Target API, which allows a website to specify itself as a share target.

Concepts and usage
------------------

 The **Web Share API** allows a site to share text, links, files, and other content to user-selected share targets, utilizing the sharing mechanisms of the underlying operating system.
 These share targets typically include the system clipboard, email, contacts or messaging applications, and Bluetooth or Wi-Fi channels.

 The API has just two methods.
 The `navigator.canShare()` method may be used to first validate whether some data is "shareable", prior to passing it to `navigator.share()` for sending.

 The `navigator.share()` method invokes the native sharing mechanism of the underlying operating system and passes the specified data.
 It requires transient activation, and hence must be triggered off a UI event like a button click.
 Further, the method must specify valid data that is supported for sharing by the native implementation.

 The Web Share API is gated by the web-share Permissions Policy.
 If the policy is supported but has not been granted, both methods will indicate that the data is not shareable.

Interfaces
----------

`navigator.canShare()`

Returns a boolean indicating whether the specified data is shareable.

`navigator.share()`

 Returns a `Promise` that resolves if the passed data was successfully sent to a share target.
 This method must be called on a button click or other user activation (requires transient activation).


Example
-------

The code below shows how you can share a link using `navigator.share()`, triggered off a button click.


```js
const shareData = {
  title: "MDN",
  text: "Learn web development on MDN!",
  url: "https://developer.mozilla.org",
};

const btn = document.querySelector("button");
const resultPara = document.querySelector(".result");

// Share must be triggered by "user activation"
btn.addEventListener("click", async () => {
  try {
    await navigator.share(shareData);
    resultPara.textContent = "MDN shared successfully";
  } catch (err) {
    resultPara.textContent = `Error: ${err}`;
  }
});
```


The above example is taken from our Web share test (see the source code). You can also see this as a live example in `navigator.share()`.

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

| Specification |
| --- |
| Web Share API # share-method |
| Web Share API # canshare-data-method |

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

### api.Navigator.share

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

### api.Navigator.canShare

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

See also
--------

* Web Share Target API
SpeechSynthesisVoice
====================

 The **`SpeechSynthesisVoice`** interface of the Web Speech API represents a voice that the system supports.
 Every `SpeechSynthesisVoice` has its own relative speech service including information about language, name and URI.

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

`SpeechSynthesisVoice.default` Read only 

A boolean value indicating whether the voice is the default voice for the current app language (`true`), or not (`false`.)

`SpeechSynthesisVoice.lang` Read only 

Returns a BCP 47 language tag indicating the language of the voice.

`SpeechSynthesisVoice.localService` Read only 

A boolean value indicating whether the voice is supplied by a local speech synthesizer service (`true`), or a remote speech synthesizer service (`false`.)

`SpeechSynthesisVoice.name` Read only 

Returns a human-readable name that represents the voice.

`SpeechSynthesisVoice.voiceURI` Read only 

Returns the type of URI and location of the speech synthesis service for this voice.

Examples
--------

The following snippet is excerpted from our Speech synthesizer demo.


```js
const synth = window.speechSynthesis;
function populateVoiceList() {
  voices = synth.getVoices();

  for (let i = 0; i < voices.length; i++) {
    const option = document.createElement("option");
    option.textContent = `${voices[i].name} (${voices[i].lang})`;

    if (voices[i].default) {
      option.textContent += " — DEFAULT";
    }

    option.setAttribute("data-lang", voices[i].lang);
    option.setAttribute("data-name", voices[i].name);
    voiceSelect.appendChild(option);
  }
}

populateVoiceList();
if (speechSynthesis.onvoiceschanged !== undefined) {
  speechSynthesis.onvoiceschanged = populateVoiceList;
}

inputForm.onsubmit = (event) => {
  event.preventDefault();

  const utterThis = new SpeechSynthesisUtterance(inputTxt.value);
  const selectedOption =
    voiceSelect.selectedOptions[0].getAttribute("data-name");
  for (let i = 0; i < voices.length; i++) {
    if (voices[i].name === selectedOption) {
      utterThis.voice = voices[i];
    }
  }
  utterThis.pitch = pitch.value;
  utterThis.rate = rate.value;
  synth.speak(utterThis);

  utterThis.onpause = (event) => {
    const char = event.utterance.text.charAt(event.charIndex);
    console.log(
      `Speech paused at character ${event.charIndex} of "${event.utterance.text}", which is "${char}".`,
    );
  };

  inputTxt.blur();
};
```

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

| Specification |
| --- |
| Web Speech API # speechsynthesisvoice |

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

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

See also
--------

* Web Speech API
HTMLCollection
==============

The **`HTMLCollection`** interface represents a generic collection (array-like object similar to `arguments`) of elements (in document order) and offers methods and properties for selecting from the list.

**Note:** This interface is called `HTMLCollection` for historical reasons (before the modern DOM, collections implementing this interface could only have HTML elements as their items).

An `HTMLCollection` in the HTML DOM is live; it is automatically updated when the underlying document is changed. For this reason it is a good idea to make a copy (e.g., using `Array.from`) to iterate over if adding, moving, or removing nodes.

**Note:** This interface was an attempt to create an unmodifiable list and only continues to be supported to not break code that's already using it. Modern APIs use types that wrap around ECMAScript array types instead, so you can treat them like ECMAScript arrays, and at the same time impose additional semantics on their usage (such as making their items read-only).

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

`HTMLCollection.length` Read only 

Returns the number of items in the collection.

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

`HTMLCollection.item()`

Returns the specific element at the given zero-based `index` into the list. Returns `null` if the `index` is out of range.

An alternative to accessing `collection[i]` (which instead returns `undefined` when `i` is out-of-bounds). This is mostly useful for non-JavaScript DOM implementations.

`HTMLCollection.namedItem()`

Returns the specific node whose ID or, as a fallback, name matches the string specified by `name`. Matching by name is only done as a last resort, only in HTML, and only if the referenced element supports the `name` attribute. Returns `null` if no node exists by the given name.

An alternative to accessing `collection[name]` (which instead returns `undefined` when `name` does not exist). This is mostly useful for non-JavaScript DOM implementations.

Usage in JavaScript
-------------------

`HTMLCollection` also exposes its members as properties by name and index. HTML IDs may contain `:` and `.` as valid characters, which would necessitate using bracket notation for property access. Currently, an `HTMLCollection` object does not recognize purely numeric IDs, which would cause conflict with the array-style access, though HTML does permit these.

For example, assuming there is one `<form>` element in the document and its `id` is `myForm`:


```js
let elem1, elem2;

// document.forms is an HTMLCollection

elem1 = document.forms[0];
elem2 = document.forms.item(0);

alert(elem1 === elem2); // shows: "true"

elem1 = document.forms.myForm;
elem2 = document.forms.namedItem("myForm");

alert(elem1 === elem2); // shows: "true"

elem1 = document.forms["named.item.with.periods"];
```

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

| Specification |
| --- |
| DOM Standard # interface-htmlcollection |

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

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

See also
--------

* `NodeList`
* `HTMLFormControlsCollection`, `HTMLOptionsCollection`
SVGFEDisplacementMapElement
===========================

The **`SVGFEDisplacementMapElement`** interface corresponds to the `<feDisplacementMap>` element.

EventTarget

Node

Element

SVGElement

SVGFEDisplacementMapElementConstants
---------

| Name | Value | Description |
| --- | --- | --- |
| `SVG_CHANNEL_UNKNOWN` | 0 | 
 The type is not one of predefined types. It is invalid to attempt to
 define a new value of this type or to attempt to switch an existing
 value to this type.
  |
| `SVG_CHANNEL_R` | 1 | Corresponds to the `R` value. |
| `SVG_CHANNEL_G` | 2 | Corresponds to the `G` value. |
| `SVG_CHANNEL_B` | 3 | Corresponds to the `B` value. |
| `SVG_CHANNEL_A` | 4 | Corresponds to the `A` value. |

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

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

`SVGFEDisplacementMapElement.height` Read only 

An `SVGAnimatedLength` corresponding to the `height` attribute of the given element.

`SVGFEDisplacementMapElement.in1` Read only 

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

`SVGFEDisplacementMapElement.in2` Read only 

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

`SVGFEDisplacementMapElement.result` Read only 

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

`SVGFEDisplacementMapElement.scale` Read only 

An `SVGAnimatedNumber` corresponding to the `scale` attribute of the given element.

`SVGFEDisplacementMapElement.width` Read only 

An `SVGAnimatedLength` corresponding to the `width` attribute of the given element.

`SVGFEDisplacementMapElement.x` Read only 

An `SVGAnimatedLength` corresponding to the `x` attribute of the given element.

`SVGFEDisplacementMapElement.xChannelSelector` Read only 

An `SVGAnimatedEnumeration` corresponding to the `xChannelSelect` attribute of the given element. It takes one of the `SVG_CHANNEL_*` constants defined on this interface.

`SVGFEDisplacementMapElement.y` Read only 

An `SVGAnimatedLength` corresponding to the `y` attribute of the given element.

`SVGFEDisplacementMapElement.yChannelSelector` Read only 

An `SVGAnimatedEnumeration` corresponding to the `yChannelSelect` attribute of the given element. It takes one of the `SVG_CHANNEL_*` constants defined on this interface.

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

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

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

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

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

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

See also
--------

* `<feDisplacementMap>`
SVGImageElement
===============

The **`SVGImageElement`** interface corresponds to the `<image>` element.

EventTarget

Node

Element

SVGElement

SVGGraphicsElement

SVGImageElementInstance properties
-------------------

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

`SVGImageElement.href` Read only 

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

`SVGImageElement.decoding`

Represents a hint given to the browser on how it should decode the image. If this value is provided, it must be one of the possible permitted values: `"sync"` to decode the image synchronously, `"async"` to decode it asynchronously, or `"auto"` to indicate no preference (which is the default).

`SVGImageElement.height` Read only 

An `SVGAnimatedLength` corresponding to the `height` attribute of the given `<image>` element.

`SVGImageElement.preserveAspectRatio` Read only 

An `SVGAnimatedPreserveAspectRatio` corresponding to the `preserveAspectRatio` attribute of the given `<image>` element.

`SVGImageElement.width` Read only 

An `SVGAnimatedLength` corresponding to the `width` attribute of the given `<image>` element.

`SVGImageElement.x` Read only 

An `SVGAnimatedLength` corresponding to the `x` attribute of the given `<image>` element.

`SVGImageElement.y` Read only 

An `SVGAnimatedLength` corresponding to the `y` attribute of the given `<image>` element.

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

*This interface also inherits methods from its parent interface, `SVGGraphicsElement`.*

`SVGImageElement.decode()`

Initiates asynchronous decoding of the image data. Returns a `Promise` which resolves once the image data is ready to be used.

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

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

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

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

The **`HTMLHeadElement`** interface contains the descriptive information, or metadata, for a document. This object inherits all of the properties and methods described in the `HTMLElement` interface.

EventTarget

Node

Element

HTMLElement

HTMLHeadElementInstance properties
-------------------

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

`HTMLHeadElement.profile` 
Deprecated

A string representing the URIs of one or more metadata profiles (white space separated).

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

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

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

| Specification |
| --- |
| HTML Standard # htmlheadelement |

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: `<head>`
CaretPosition
=============

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

The `CaretPosition` interface represents the caret position, an indicator for the text insertion point. You can get a `CaretPosition` using the `Document.caretPositionFromPoint()` method.

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

*This interface doesn't inherit any properties.*

`CaretPosition.offsetNode` Read only  
Experimental

Returns a `Node` containing the found node at the caret's position.

`CaretPosition.offset` Read only  
Experimental

Returns a `long` representing the character offset in the caret position node.

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

`CaretPosition.getClientRect` 
Experimental

Returns the client rectangle for the caret range.

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

| Specification |
| --- |
| CSSOM View Module # caret-position |

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

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

See also
--------

* `Document.caretPositionFromPoint()`
* `Range`
* `Node`