recursal/MDN huggingface dataset:
SpeechSynthesisUtterance: pitch property
========================================

The **`pitch`** property of the `SpeechSynthesisUtterance` interface gets and sets the pitch at which the utterance will be spoken at.

If unset, a default value of 1 will be used.

Value
-----

 A float representing the pitch value.
 It can range between 0 (lowest) and 2 (highest), with 1 being the default pitch for the current platform or voice. Some speech synthesis engines or voices may constrain the minimum and maximum rates further.
 If SSML is used, this value will be overridden by prosody tags in the markup.

Examples
--------


```js
const synth = window.speechSynthesis;

const inputForm = document.querySelector("form");
const inputTxt = document.querySelector("input");
const voiceSelect = document.querySelector("select");

const voices = synth.getVoices();

// ...

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 = 1.5;
  synth.speak(utterThis);
  inputTxt.blur();
};
```

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

| Specification |
| --- |
| Web Speech API # dom-speechsynthesisutterance-pitch |

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

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

See also
--------

* Web Speech API
SpeechSynthesisUtterance: text property
=======================================

 The **`text`** property of the
 `SpeechSynthesisUtterance` interface gets and sets the text that will be synthesized when the utterance is spoken.

 The text may be provided as plain text, or a well-formed SSML document.
 The SSML tags will be stripped away by devices that don't support SSML.

Value
-----

 A string representing the text to the synthesized.
 The maximum length of the text that can be spoken in each utterance is 32,767 characters.

Examples
--------


```js
const synth = window.speechSynthesis;

const inputForm = document.querySelector("form");
const inputTxt = document.querySelector("input");
const voiceSelect = document.querySelector("select");

const voices = synth.getVoices();

// ...

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];
    }
  }
  console.log(utterThis.text);
  synth.speak(utterThis);
  inputTxt.blur();
};
```

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

| Specification |
| --- |
| Web Speech API # dom-speechsynthesisutterance-text |

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

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

See also
--------

* Web Speech API
SpeechSynthesisUtterance: resume event
======================================

The **`resume`** event of the Web Speech API `SpeechSynthesisUtterance` object is fired when a paused utterance is resumed.

Syntax
------

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


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

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

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

A `SpeechSynthesisEvent`. Inherits from `Event`.

Event

SpeechSynthesisEventEvent properties
----------------

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

`charIndex` Read only 

Returns the index position of the character in the `SpeechSynthesisUtterance.text` that was being spoken when the event was triggered.

`elapsedTime` Read only 

Returns the elapsed time in seconds after the `SpeechSynthesisUtterance.text` started being spoken that the event was triggered at.

`name` Read only 

Returns the name associated with certain types of events occurring as the `SpeechSynthesisUtterance.text` is being spoken: the name of the SSML marker reached in the case of a `mark` event, or the type of boundary reached in the case of a `boundary` event.

`utterance` Read only 

Returns the `SpeechSynthesisUtterance` instance that the event was triggered on.

Examples
--------

You can use the `resume` event in an `addEventListener` method:


```js
utterThis.addEventListener("resume", (event) => {
  console.log(`Speech resumed after ${event.elapsedTime} seconds.`);
});
```


Or use the `onresume` event handler property:


```js
utterThis.onresume = (event) => {
  console.log(`Speech resumed after ${event.elapsedTime} seconds.`);
};
```

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

| Specification |
| --- |
| Web Speech API # eventdef-speechsynthesisutterance-resume |
| Web Speech API # dom-speechsynthesisutterance-onresume |

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

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

See also
--------

* Web Speech API
CryptoKey: algorithm property
=============================

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

The read-only **`algorithm`** property of the `CryptoKey` interface returns an object describing the algorithm for which this key can be used, and any associated extra parameters.

The object returned depends of the algorithm used to generate the key.

Value
-----

An object matching:

* `AesKeyGenParams` if the algorithm is any of the AES variants.
* `RsaHashedKeyGenParams` if the algorithm is any of the RSA variants.
* `EcKeyGenParams` if the algorithm is any of the EC variants.
* `HmacKeyGenParams` if the algorithm is HMAC.
Examples
--------


```js
const rawKey = window.crypto.getRandomValues(new Uint8Array(16));

// Import an AES secret key from an ArrayBuffer containing the raw bytes.
// Takes an ArrayBuffer string containing the bytes, and returns a Promise
// that will resolve to a CryptoKey representing the secret key.
function importSecretKey(rawKey) {
  return window.crypto.subtle.importKey("raw", rawKey, "AES-GCM", true, [
    "encrypt",
    "decrypt",
  ]);
}

const key = importSecretKey(rawKey);
console.log(`This key is to be used with the ${key.algorithm} algorithm.`);
```

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

| Specification |
| --- |
| Web Cryptography API # dom-cryptokey-algorithm |

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

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

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

The read-only **`usages`** property of the `CryptoKey` interface indicates what can be done with the key.

Value
-----

An `Array` of strings from the following list:

* `"encrypt"`: The key may be used to `encrypt` messages.
* `"decrypt"`: The key may be used to `decrypt` messages.
* `"sign"`: The key may be used to `sign` messages.
* `"verify"`: The key may be used to `verify` signatures.
* `"deriveKey"`: The key may be used in `deriving a new key`.
* `"deriveBits"`: The key may be used in `deriving bits`.
* `"wrapKey"`: The key may be used to `wrap a key`.
* `"unwrapKey"`: The key may be used to `unwrap a key`.
Examples
--------


```js
const rawKey = window.crypto.getRandomValues(new Uint8Array(16));

// Import an AES secret key from an ArrayBuffer containing the raw bytes.
// Takes an ArrayBuffer string containing the bytes, and returns a Promise
// that will resolve to a CryptoKey representing the secret key.
function importSecretKey(rawKey) {
  return window.crypto.subtle.importKey("raw", rawKey, "AES-GCM", true, [
    "encrypt",
    "decrypt",
  ]);
}

const key = importSecretKey(rawKey);
console.log(
  `The following usages are reported for this key: ${key.usages.toString()}`,
);
```

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

| Specification |
| --- |
| Web Cryptography API # dom-cryptokey-usages |

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

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

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

The read-only **`extractable`** property of the `CryptoKey` interface indicates whether or not the key may be extracted using `SubtleCrypto.exportKey()` or `SubtleCrypto.wrapKey()`.

If the key cannot be exported, `exportKey()` or `wrapKey()` will throw an exception if used to extract it.

Value
-----

A boolean value that is `true` if the key can be exported and `false` if not.

Examples
--------

In this example, the *Export* button is disabled, and no listener added, if the key cannot be exported.


```js
// Export the given key and write it into the "exported-key" space.
async function exportCryptoKey(key) {
  const exported = await window.crypto.subtle.exportKey("raw", key);
  const exportedKeyBuffer = new Uint8Array(exported);

  const exportKeyOutput = document.querySelector(".exported-key");
  exportKeyOutput.textContent = `[${exportedKeyBuffer}]`;
}

// Enable or disable the exportButton if the key is extractable or not
function setExportButton(key) {
  const exportButton = document.querySelector(".raw");

  // Disable the button if the key is not extractable
  exportButton.disabled = !key.extractable;
  if (key.extractable) {
    // Add an event listener to extract the key
    exportButton.addEventListener("click", () => {
      exportCryptoKey(key);
    });
  }
}

// Generate an encrypt/decrypt secret key,
// then enable and set up an event listener on the "Export" button.
window.crypto.subtle
  .generateKey(
    {
      name: "AES-GCM",
      length: 256,
    },
    true,
    ["encrypt", "decrypt"],
  )
  .then(setExportButton(key));
```

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

| Specification |
| --- |
| Web Cryptography API # dom-cryptokey-extractable |

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

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

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

The read-only **`type`** property of the `CryptoKey` interface indicates which kind of key is represented by the object. It can have the following values:

* `"secret"`: This key is a secret key for use with a symmetric algorithm.
* `"private"`: This key is the private half of an asymmetric algorithm's `CryptoKeyPair`.
* `"public"`: This key is the public half of an asymmetric algorithm's `CryptoKeyPair`.
Value
-----

One of the following strings: `"secret"`, `"private"`, or `"public"`.

Examples
--------

This function verifies a message using `SubtleCrypto.verify()` and a public key given in the parameter. If the key is not a public key, it always returns `"invalid"`, as such verification is fundamentally insecure.


```js
async function verifyMessage(publicKey) {
  const signatureValue = document.querySelector(
    ".rsassa-pkcs1 .signature-value",
  );
  signatureValue.classList.remove("valid", "invalid");

  let result = false; // By default, it is invalid

  if (publicKey.type === "public") {
    const encoded = getMessageEncoding();
    result = await window.crypto.subtle.verify(
      "RSASSA-PKCS1-v1\_5",
      publicKey,
      signature,
      encoded,
    );
  }

  signatureValue.classList.add(result ? "valid" : "invalid");
}
```

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

| Specification |
| --- |
| Web Cryptography API # dom-cryptokey-type |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TaskController: TaskController() 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
The **`TaskController()`** constructor creates a new `TaskController` object, optionally setting the initial priority of its associated `signal`.

If no priority is set, the signal priority defaults to `user-visible`

Syntax
------


```js
new TaskController()
new TaskController(options)
```

### Parameters

`options` Optional

An object with the following properties:

`priority` Optional

 The priority of the signal associated with this `TaskController`.
 One of: `"user-blocking"`, `"user-visible"` (default), `"background"`.



Examples
--------

This code shows how to construct a task controller that has a signal with default priority (`user-visible`).


```js
const controller = new TaskController();
```


To construct a task controller that has a specific signal priority, pass the `priority` as a property of the optional argument.


```js
controller2 = new TaskController({ priority: "user-blocking" });
```

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

| Specification |
| --- |
| Prioritized Task Scheduling # dom-taskcontroller-taskcontroller |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
TaskController: setPriority() 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

 The **`setPriority()`** method of the `TaskController` interface can be called to set a new priority for this controller's `signal`.
 If a prioritized task is configured to use the signal, this will also change the task priority.

 Observers are notified of priority changes by dispatching a `prioritychange` event.
 The method will only notify if the priority actually changes (the event is not fired if the priority would not be changed by the call).

 Note that task priority can only be changed for tasks with mutable priorities.
 If the task is immutable, the function call is ignored.

Syntax
------


```js
setPriority(priority)
```

### Parameters

`priority`

 The priority of the task.
 One of: `"user-blocking"`, `"user-visible"`, `"background"`.


### Return Value

None (`undefined`).

### Exceptions

`NotAllowedError` `DOMException`

A priority change has been started when one is already running.

Examples
--------

 First we create a task controller.
 In this case we don't specify a priority, so it will default to `user-visible`.


```js
// Create a TaskController with default priority: 'user-visible'
const controller = new TaskController();
```


Then we pass the controller's signal to the `Scheduler.postTask()` method.


```js
// Post task passing the controller's signal.
// The signal priority sets the initial priority of the task
scheduler
  .postTask(() => "Task execute", { signal: controller.signal })
  .then((taskResult) => {
    console.log(`${taskResult}`);
  }) // Run on success)
  .catch((error) => {
    console.log(`Catch error: ${error}`);
  }); // Run on fail
```


The controller can then be used to change the priority


```js
// Change the priority to 'background' using the controller
controller.setPriority("background");
```


Additional examples, including showing how to handle the event that results from changing the priority, can be found in: Prioritized Task Scheduling API > Examples.

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

| Specification |
| --- |
| Prioritized Task Scheduling # dom-taskcontroller-setpriority |

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

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

 The **`name`** property of the `HTMLMapElement` represents the unique name `<map>` element.
 Its value can be used with the `useMap` attribute of the `<img>` element to reference a `<map>` element.

If an `id` attribute is set on the `<map>` element, then this `name` property should be the same as this `id`.

Value
-----

A non-empty string without whitespaces.

Example
-------


```html
<map name="image-map">
  <area shape="circle" coords="15,15,5" />
</map>
```



```js
const mapElement = document.getElementsByName("image-map")[0];
console.log(mapElement.name); // output: "image-map"
```

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

| Specification |
| --- |
| HTML Standard # dom-map-name |

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

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

See also
--------

* `HTMLImageElement.useMap` property
* `HTMLAreaElement` element
PresentationConnection: url property
====================================

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

 The **`url`** readonly property of the
 `PresentationConnection` interface returns the URL used to create or
 reconnect to the presentation.

Value
-----

A string containing a URL.

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

| Specification |
| --- |
| Presentation API # dom-presentationconnection-url |

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

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

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

 The **`send()`** method of the
 `PresentationConnection` interface tells a controlling browsing context to
 send binary or text data to a presenting browsing context.

Syntax
------


```js
send(data)
```

### Parameters

`data`

The data to send to the presentation context. It will be one of the following:

* `String`
* `Blob`
* `Array`

### Return value

None (`undefined`).

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

| Specification |
| --- |
| Presentation API # dom-presentationconnection-send |

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

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

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

When the `close()` method is called on a `PresentationConnection`, the user agent begins the process of closing the connection by sending an empty `closeMessage` with the `closeReason` set to `closed`.

Syntax
------


```js
close()
```

### Parameters

None.

### Return value

None (`undefined`).

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

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

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

When the `terminate()` method is called on a `PresentationConnection`, the user agent begins the process of terminating the presentation. The exact process differs depending on whether `terminate()` is called in the controlling or the presenting context.

Syntax
------


```js
terminate()
```

### Parameters

None.

### Return value

None (`undefined`).

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

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

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

When a `PresentationConnection` object is created, its `binaryType` IDL attribute *MUST* be set to the string `"arraybuffer"`. Upon getting, the attribute *MUST* return its most recent value (the value it was last set as). Upon setting, the user agent *MUST* set the IDL attribute to the new value.

**Note:** The `binaryType` attribute allows authors to control how binary data is exposed to scripts. By setting the attribute to `"blob"`, binary data is returned in `Blob` form; by setting it to `"arraybuffer"`, it is returned in `ArrayBuffer` form. The attribute defaults to `"arraybuffer"`. This attribute has no effect on data sent in a string form.

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

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

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

The **`state`** attribute reflects the presentation connection's current state. Depending on the current `PresentationConnectionState`, the `state` attribute can hold one of the following values.

* **`connecting`**: The user agent is attempting to establish a presentation connection with the destination browsing context. This is the initial state when a `PresentationConnection` object is created.
* **`connected`**: The presentation connection is established and communication is possible.
* **`closed`**: The presentation connection has been closed or could not be opened. The connection may be reopened by calling `reconnect()`. No communication is possible in this state.
* **`terminated`**: The receiving browsing context has terminated. Any presentation connection to that presentation has also terminated and cannot be reopened. No communication is possible.
Browser compatibility
---------------------

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

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

The **`id`** attribute specifies the presentation identifier of a presentation connection.

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

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

The **`UIEvent.detail`** read-only property, when non-zero, provides the current (or next, depending on the event) click count.

For `click` or `dblclick` events, `UIEvent.detail` is the current click count.

For `mousedown` or `mouseup` events, `UIEvent.detail` is *1 plus* the current click count.

For all other `UIEvent` objects, `UIEvent.detail` is always zero.

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

| Specification |
| --- |
| UI Events # dom-uievent-detail |

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

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