recursal/MDN huggingface dataset:
IdleDetector: start() method
============================

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
**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 **`start()`** method of the `IdleDetector` interface returns a
 `Promise` that resolves when the detector starts listening for changes in the
 user's idle state. This
 method takes an optional `options` object with the `threshold` in milliseconds
 where inactivity should be reported and `signal` for an `AbortSignal` to abort
 the idle detector.

Syntax
------


```js
start()
start(options)
```

### Parameters

`options` Optional

An object with the following properties:

`threshold`

The minimum number of idle milliseconds before reporting should begin.

`signal`

A reference to an `AbortSignal` instance allowing you to abort idle detection.


### Return value

A `Promise`.

### Exceptions

`NotAllowedError` `DOMException`

Use of this feature was blocked by a Permissions Policy.

Examples
--------

The following example shows how to start idle detection using the `options` argument. It retrieves an instance of `AbortSignal` from an instance of `AbortController`.


```js
const controller = new AbortController();
const signal = controller.signal;

await idleDetector.start({
  threshold: 60\_000,
  signal,
});
console.log("IdleDetector is active.");
```

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

| Specification |
| --- |
| Idle Detection API # api-idledetector-start |

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

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

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
**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 **`screenState`** read-only property of the `IdleDetector` interface
 returns a string indicating whether the screen is locked, one of `"locked"` or
 `"unlocked"`.

Value
-----

Either `"locked"` or `"unlocked"` if `IdleDetector.start()` has been called, or `null` otherwise.

Examples
--------

In the following example, the `change` callback prints the status of `userState` and `screenState` to the console.


```js
idleDetector.addEventListener("change", () => {
  const userState = idleDetector.userState;
  const screenState = idleDetector.screenState;
  console.log(`Idle change: ${userState}, ${screenState}.`);
});
```

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

| Specification |
| --- |
| Idle Detection API # api-idledetector-screenstate |

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

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

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
**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 **`IdleDetector()`** constructor creates a new `IdleDetector`
 object which provides events indicating when the user is no longer interacting
 with their device or the screen has locked.

Syntax
------


```js
new IdleDetector()
```

### Parameters

None.

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

| Specification |
| --- |
| Idle Detection API # dom-idledetector-idledetector |

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

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

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
**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 **`userState`** read-only property of the `IdleDetector` interface returns a string indicating whether the user has interacted with the device since the call to `start()`.

Value
-----

Either `"active"` or `"idle"` if `IdleDetector.start()` has been called, or `null` otherwise.

Examples
--------

In the following example, the `change` callback prints the status of `userState` and `screenState` to the console.


```js
idleDetector.addEventListener("change", () => {
  const userState = idleDetector.userState;
  const screenState = idleDetector.screenState;
  console.log(`Idle change: ${userState}, ${screenState}.`);
});
```

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

| Specification |
| --- |
| Idle Detection API # api-idledetector-userstate |

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

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

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

 The **`wgslLanguageFeatures`** read-only property of the
 `GPU` interface returns a `WGSLLanguageFeatures` object that reports the WGSL language extensions supported by the WebGPU implementation.

**Note:** Not all WGSL language extensions are available to WebGPU in all browsers that support the API. We recommend you thoroughly test any extensions you choose to use.

Value
-----

A `WGSLLanguageFeatures` object instance. This is a setlike object.

Examples
--------


```js
if (!navigator.gpu) {
  throw Error("WebGPU not supported.");
}

const wgslFeatures = navigator.gpu.wgslLanguageFeatures;

// Return the size of the set
console.log(wgslFeatures.size);

// Iterate through all the set values using values()
const valueIterator = wgslFeatures.values();
for (const value of valueIterator) {
  console.log(value);
}

// ...
```

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

| Specification |
| --- |
| WebGPU # dom-gpu-wgsllanguagefeatures |

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

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

See also
--------

* WebGPU API
GPU: getPreferredCanvasFormat() method
======================================

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

 The **`getPreferredCanvasFormat()`** method of the
 `GPU` interface returns the optimal canvas texture format for displaying 8-bit depth, standard dynamic range content on the current system.

This is commonly used to provide a `GPUCanvasContext.configure()` call with the optimal `format` value for the current system. This is recommended — if you don't use the preferred format when configuring the canvas context, you may incur additional overhead, such as additional texture copies, depending on the platform.

Syntax
------


```js
getPreferredCanvasFormat()
```

### Parameters

None.

### Return value

A string indicating a canvas texture format. The value can be `rgba8unorm` or `bgra8unorm`.

### Exceptions

None.

Examples
--------


```js
const canvas = document.querySelector("#gpuCanvas");
const context = canvas.getContext("webgpu");

context.configure({
  device: device,
  format: navigator.gpu.getPreferredCanvasFormat(),
  alphaMode: "premultiplied",
});
```

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

| Specification |
| --- |
| WebGPU # dom-gpu-getpreferredcanvasformat |

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

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

See also
--------

* The WebGPU API
SpeechRecognitionAlternative: transcript property
=================================================

 The **`transcript`** read-only property of the
 `SpeechRecognitionResult` interface returns a string containing the
 transcript of the recognized word(s).

 For continuous recognition, leading or trailing whitespace will be included where
 necessary so that concatenation of consecutive `SpeechRecognitionResult`s
 produces a proper transcript of the session.

Value
-----

A string.

Examples
--------

 This code is excerpted from our
 Speech color changer example.


```js
recognition.onresult = (event) => {
  // The SpeechRecognitionEvent results property returns a SpeechRecognitionResultList object
  // The SpeechRecognitionResultList object contains SpeechRecognitionResult objects.
  // It has a getter so it can be accessed like an array
  // The first [0] returns the SpeechRecognitionResult at position 0.
  // Each SpeechRecognitionResult object contains SpeechRecognitionAlternative objects
  // that contain individual results.
  // These also have getters so they can be accessed like arrays.
  // The second [0] returns the SpeechRecognitionAlternative at position 0.
  // We then return the transcript property of the SpeechRecognitionAlternative object
  const color = event.results[0][0].transcript;
  diagnostic.textContent = `Result received: ${color}.`;
  bg.style.backgroundColor = color;
};
```

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

| Specification |
| --- |
| Web Speech API # dom-speechrecognitionalternative-transcript |

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

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

See also
--------

* Web Speech API
SpeechRecognitionAlternative: confidence property
=================================================

 The **`confidence`** read-only property of the
 `SpeechRecognitionResult` interface returns a numeric estimate of how
 confident the speech recognition system is that the recognition is correct.


**Note:** Mozilla's implementation of `confidence` is still
 being worked on — at the moment, it always seems to return 1.


Value
-----

A number between 0 and 1.

Examples
--------

 This code is excerpted from our
 Speech color changer example.


```js
recognition.onresult = (event) => {
  // The SpeechRecognitionEvent results property returns a SpeechRecognitionResultList object
  // The SpeechRecognitionResultList object contains SpeechRecognitionResult objects.
  // It has a getter so it can be accessed like an array
  // The first [0] returns the SpeechRecognitionResult at position 0.
  // Each SpeechRecognitionResult object contains SpeechRecognitionAlternative objects
  // that contain individual results.
  // These also have getters so they can be accessed like arrays.
  // The second [0] returns the SpeechRecognitionAlternative at position 0.
  // We then return the transcript property of the SpeechRecognitionAlternative object
  const color = event.results[0][0].transcript;
  diagnostic.textContent = `Result received: ${color}.`;
  bg.style.backgroundColor = color;
  console.log(`Confidence: ${event.results[0][0].confidence}`);
};
```

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

| Specification |
| --- |
| Web Speech API # dom-speechrecognitionalternative-confidence |

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

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

See also
--------

* Web Speech API
RTCSessionDescription: sdp property
===================================

 The property **`RTCSessionDescription.sdp`** is a read-only
 string containing the SDP which describes the session.

Syntax
------


```js
const value = sessionDescription.sdp
sessionDescription.sdp = value
```

### Value

The value is a string containing an SDP message like this one:
```

v=0
o=alice 2890844526 2890844526 IN IP4 host.anywhere.com
s=
c=IN IP4 host.anywhere.com
t=0 0
m=audio 49170 RTP/AVP 0
a=rtpmap:0 PCMU/8000
m=video 51372 RTP/AVP 31
a=rtpmap:31 H261/90000
m=video 53000 RTP/AVP 32
a=rtpmap:32 MPV/90000
```

Example
-------


```js
// The remote description has been set previously on pc, an RTCPeerConnection

alert(pc.remoteDescription.sdp);
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcsessiondescription-sdp |

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

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

See also
--------

* WebRTC
* The standard for using SDP in an offer/answer protocol RFC 3264.
RTCSessionDescription: RTCSessionDescription() constructor
==========================================================

**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 **`RTCSessionDescription()`** constructor creates a new
 `RTCSessionDescription` with its properties initialized as described in the
 specified object.


**Note:** This constructor has been deprecated because
 `RTCPeerConnection.setLocalDescription()` and other methods which take
 SDP as input now directly accept an object conforming to the
 `RTCSessionDescriptionInit` dictionary, so you don't have to instantiate an
 `RTCSessionDescription` yourself.


Syntax
------


```js
new RTCSessionDescription(options)
```

### Values

`options` Optional

 An object providing the default values for the session description; the object
 conforms to the `RTCSessionDescriptionInit` dictionary. That dictionary has
 the following properties:


`type`

**Required.** A string which is used to set the `type` property of the new `RTCSessionDescription` object.

`sdp`

A string containing a SDP message describing the session. This value is an empty string (`""`) by default and may not be `null`.


Example
-------

 This example uses the constructor to convert an SDP offer into an
 `RTCSessionDescription` object.


**Note:** This is no longer necessary, however;
 `RTCPeerConnection.setLocalDescription()` and other methods which take
 SDP as input now directly accept an object conforming to the
 `RTCSessionDescriptionInit` dictionary, so you don't have to instantiate an
 `RTCSessionDescription` yourself.



```js
navigator.getUserMedia({ video: true }, (stream) => {
  pc.onaddstream({ stream });
  // Adding a local stream won't trigger the onaddstream callback
  pc.addStream(stream);

  pc.createOffer((offer) => {
    pc.setLocalDescription(
      new RTCSessionDescription(offer),
      () => {
        // send the offer to a server to be forwarded to the friend you're calling.
      },
      error,
    );
  }, error);
});
```

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

This feature is not part of any current specification. It is no longer on track to become a standard.

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

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

See also
--------

* WebRTC API
* `RTCSessionDescription`
RTCSessionDescription: toJSON() method
======================================

 The **`RTCSessionDescription.toJSON()`** method generates a
 JSON description of the object. Both properties,
 `type` and
 `sdp`, are contained in the generated JSON.

Syntax
------


```js
toJSON()
```

### Parameters

None.

### Return value

A `JSON` object containing the following properties:

`type`

One of the following: `"offer"`, `"answer"`, `"pranswer"` or `null`.

`sdp`

Either `null` or the SDP message string corresponding to `RTCSessionDescription.sdp` property.

Example
-------


```js
// sd is a RTCSessionDescriptor

alert(JSON.stringify(sd)); // This call the toJSON() method behind the scene.
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcsessiondescription-tojson |

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

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

See also
--------

* WebRTC
RTCSessionDescription: type property
====================================

 The property **`RTCSessionDescription.type`** is a read-only
 string value which describes the description's type.

Syntax
------


```js
const value = sessionDescription.type
sessionDescription.type = value
```

### Value

The possible values are:

`"answer"`

The SDP contained in the `sdp` property is the definitive choice in the exchange. In other words, this session description describes the agreed-upon configuration, and is being sent to finalize negotiation.

`"offer"`

The session description object describes the initial proposal in an offer/answer exchange. The session negotiation process begins with an offer being sent from the caller to the callee.

`"pranswer"`

The session description object describes a provisional answer; that is, a response to a previous offer that is not the final answer. It is usually employed by legacy hardware.

`"rollback"`

This special type with an empty session description is used to roll back to the previous stable state.

Example
-------


```js
// The remote description has been set previously on pc, a RTCPeerConnection

alert(pc.remoteDescription.type);
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-rtcsessiondescription-type |

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

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

See also
--------

* WebRTC
HTMLSlotElement: name property
==============================

 The **`name`** property of the `HTMLSlotElement`
 interface returns or sets the slot name. A slot is a placeholder inside a web component
 that users can fill with their own markup.

Value
-----

A string.

Examples
--------

The following snippet is taken from our slotchange example (See it live).


```js
let slots = this.shadowRoot.querySelectorAll("slot");
slots[1].addEventListener("slotchange", (e) => {
  let nodes = slots[1].assignedNodes();
  console.log(
    `Element in Slot "${slots[1].name}" changed to "${nodes[0].outerHTML}".`,
  );
});
```


 Here we grab references to all the slots, then add a slotchange event listener to the
 2nd slot in the template — which is the one that keeps having its contents changed in
 the example.

 Every time the element inserted in the slot changes, we log a report to the console
 saying which slot has changed, and what the new node inside the slot is.

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

| Specification |
| --- |
| HTML Standard # dom-slot-name-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLSlotElement: assign() method
================================

The **`assign()`** method of the `HTMLSlotElement` interface sets the slot's *manually assigned nodes* to an ordered set of slottables. The manually assigned nodes set is initially empty until nodes are assigned using `assign()`.

**Note:** you cannot mix manually (imperative) and named (declarative, automatic) slot assignments. Therefore, for this method to work, the shadow tree needs to have been created with the `slotAssignment: "manual"` option.

Syntax
------


```js
assign(node1)
assign(node1, node2)
assign(node1, node2, /\* …, \*/ nodeN)
```

### Parameters

`node1`, …, `nodeN`

A set of `Element` or `Text` nodes.

### Return value

None (`undefined`).

### Exceptions

* `NotAllowedError` `DOMException`
 -: Thrown when calling this method on an automatically assigned slot.
Examples
--------

In the example below, the `assign()` method is used to display the correct tab in a tabbed application. The function is called and passed the panel to show, which is then assigned to the slot.


```js
function UpdateDisplayTab(elem, tabIdx) {
  const shadow = elem.shadowRoot;
  const slot = shadow.querySelector("slot");
  const panels = elem.querySelectorAll("tab-panel");
  if (panels.length && tabIdx && tabIdx <= panels.length) {
    slot.assign(panels[tabIdx - 1]);
  } else {
    slot.assign();
  }
}
```

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

| Specification |
| --- |
| HTML Standard # dom-slot-assign |

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

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

See also
--------

* `Element.attachShadow()`
HTMLSlotElement: assignedElements() method
==========================================

 The **`assignedElements()`** method of the `HTMLSlotElement`
 interface returns a sequence of the elements assigned to this slot (and no
 other nodes).

If the `flatten` option is set to `true`, it returns a sequence of both the elements assigned to this slot, as well as the elements assigned to any other slots that are descendants of this slot. If no assigned elements are found, it returns the slot's fallback content.

Syntax
------


```js
assignedElements()
assignedElements(options)
```

### Parameters

`options` Optional

An object that sets options for the nodes to be returned. The available options are:

`flatten`

 A boolean value indicating whether to return the
 assigned elements of any available child `<slot>` elements
 (`true`) or not (`false`). Defaults to `false`.



### Return value

An array of elements.

Examples
--------


```js
let slots = this.shadowRoot.querySelector("slot");
let elements = slots.assignedElements({ flatten: true });
```

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

| Specification |
| --- |
| HTML Standard # dom-slot-assignedelements-dev |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLSlotElement: assignedNodes() method
=======================================

The **`assignedNodes()`** method of the `HTMLSlotElement` interface returns a sequence of the nodes assigned to this slot.

If the `flatten` option is set to `true`, it returns a sequence of both the nodes assigned to this slot, as well as the nodes assigned to any other slots that are descendants of this slot. If no assigned nodes are found, it returns the slot's fallback content.

Syntax
------


```js
assignedNodes()
assignedNodes(options)
```

### Parameters

`options` Optional

An object that sets options for the nodes to be returned. The available options are:

`flatten`

A boolean value indicating whether to return the assigned nodes of any available child `<slot>` elements (`true`) or not (`false`). Defaults to `false`.


### Return value

An array of nodes.

Examples
--------

The following snippet is taken from our slotchange example (See it live).


```js
let slots = this.shadowRoot.querySelectorAll("slot");
slots[1].addEventListener("slotchange", (e) => {
  let nodes = slots[1].assignedNodes();
  console.log(
    `Element in Slot "${slots[1].name}" changed to "${nodes[0].outerHTML}".`,
  );
});
```


 Here we grab references to all the slots, then add a slotchange event listener to the
 2nd slot in the template — which is the one that keeps having its contents changed in
 the example.

 Every time the element inserted in the slot changes, we log a report to the console
 saying which slot has changed, and what the new node inside the slot is.

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

| Specification |
| --- |
| HTML Standard # dom-slot-assignednodes-dev |

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

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