recursal/MDN huggingface dataset:
PaymentAddress: addressLine property
====================================

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

**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 **`addressLine`** read-only
 property of the `PaymentAddress` interface is an array of
 strings, each specifying a line of the address that is not
 covered by one of the other properties of `PaymentAddress`.

 These
 lines may include the street name, house number, apartment number, rural delivery route,
 descriptive instructions, or post office box.

Value
-----

 An array of strings, each containing one line of the address.
 For example, the `addressLine` array for the Mozilla Space in London would
 have the following entries:


| Index | addressLine[] value |
| --- | --- |
| 0 | Metal Box Factory |
| 1 | Suite 441, 4th floor |
| 2 | 30 Great Guildford Street |

 These, combined with additional values for other properties of the
 `PaymentAddress`, would represent the full address, which is:

 Mozilla
 Metal Box Factory
 Suite 441, 4th floor
 30 Great Guildford Street
 London SE1 0HS
 United Kingdom

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

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

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

**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 **`sortingCode`** read-only property of the
 `PaymentAddress` interface returns a string containing a postal sorting
 code such as is used in France.

Value
-----

A string containing the sorting code portion of the address.

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

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

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

**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 read-only **`recipient`** property of the
 `PaymentAddress` interface returns a string containing the name of the
 recipient, purchaser, or contact person at the payment address.

Value
-----

 A string giving the name of the person receiving or paying for the
 purchase, or the name of a contact person in other contexts. If no name is available,
 this string is empty.

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

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

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

**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 **`country`** read-only property of the
 `PaymentAddress` interface is a string identifying the address's country
 using the ISO 3166-1 alpha-2 standard. The string is
 always in its canonical upper-case form.

 Some examples of valid `country` values: `"US"`,
 `"GB"`, `"CN"`, or `"JP"`.

Value
-----

 A string which contains the ISO3166-1 alpha-2 code identifying the
 country in which the address is located, or an empty string if no country is available,
 which frequently can be assumed to mean "same country as the site owner."

Usage notes
-----------

 If the payment handler validates the address and determines that the value of
 `country` is invalid, a call to
 `PaymentRequestUpdateEvent.updateWith()` will be made with a
 `details` object containing a `shippingAddressErrors`
 field. That field contains an object whose
 `country` property is a string indicating the
 validation error that occurred and, if possible, suggestions on how to fix it.

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

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

See also
--------

* Using the Payment Request API
* `PaymentRequestUpdateEvent.updateWith`
PaymentAddress: organization property
=====================================

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

**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 **`organization`** read-only
 property of the `PaymentAddress` interface returns a string containing
 the name of the organization, firm, company, or institution at the address.

Value
-----

 A string whose value is the name of the organization or company
 located at the address described by the `PaymentAddress` object. This should
 be the name of the organization that is to receive the shipment for shipping addresses,
 or which is responsible for payment addresses.

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

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

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

 The read-only **`id`** property of the
 `ContentIndexEvent` interface is a `String` which identifies
 the deleted content index via its `id`.

Value
-----

A `String` representation of the deleted content index id.

Examples
--------

 This example listens for the `contentdelete` event
 and logs the removed content index id.

 The `ContentIndexEvent` is only available to the
 global scope of a
 `ServiceWorker`.


```js
self.addEventListener("contentdelete", (event) => {
  console.log(event.id);

  // logs content index id, which can then be used to determine what content to delete from your cache
});
```

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

| Specification |
| --- |
| Content Index # dom-contentindexevent-id |

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

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

See also
--------

* An introductory article on the Content Index API
* An app which uses the Content Index API to list and remove 'save for later' content
* Service Worker API, along with information about Cache and CacheStorage
ContentIndexEvent: ContentIndexEvent() constructor
==================================================

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

 The **`ContentIndexEvent()`** constructor creates a new `ContentIndexEvent` object
 whose type and other options are configured as specified.

Syntax
------


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

### Parameters

`type`

 A string with the name of the event.
 It is case-sensitive and browsers always set it to `contentdelete`.


`options`

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

`id`

The id of the indexed content you want the `ContentIndex` object to remove.


### Return value

A new `ContentIndexEvent` object configured using the given options.

Examples
--------

This examples constructs a new `ContentIndexEvent` with the relevant id.


```js
const removeData = {
  id: "unique-content-id",
};

const ciEvent = new ContentIndexEvent("contentdelete", removeData);

ciEvent.id; // should return 'unique-content-id'
```

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

| Specification |
| --- |
| Content Index # content-index-event |

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

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

See also
--------

* An introductory article on the Content Index API
* An app which uses the Content Index API to list and remove 'save for later' content
* Service Worker API, along with information about Cache and CacheStorage
HIDConnectionEvent: HIDConnectionEvent() 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 **`HIDConnectionEvent()`** constructor creates a new `HIDConnectionEvent` object. Typically this constructor is not used as events are created when an input report is received.

Syntax
------


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

### Parameters

`type`

 A string with the name of the event.
 It is case-sensitive and browsers set it to `connect` or `disconnect`.


`options`

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

`device`

The `HIDDevice` instance representing the device sending the input report.


### Return value

A new `HIDConnectionEvent` object.

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

| Specification |
| --- |
| WebHID API # dom-hidconnectionevent-constructor |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HIDConnectionEvent: device 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 **`device`** read-only property of the `HIDConnectionEvent` interface returns the `HIDDevice` associated with this connection event.

Value
-----

A `HIDDevice`.

Examples
--------

The following example registers event listeners for `connect` and `disconnect` events, then prints the `HIDDevice.productName` to the console.


```js
navigator.hid.addEventListener("connect", ({ device }) => {
  console.log(`HID connected: ${device.productName}`);
});

navigator.hid.addEventListener("disconnect", ({ device }) => {
  console.log(`HID disconnected: ${device.productName}`);
});
```

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

| Specification |
| --- |
| WebHID API # dom-hidconnectionevent-device |

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

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

The read-only **`target`** property of the `Touch` interface returns the (`EventTarget`) on which the touch contact started when it was first placed on the surface, even if the touch point has since moved outside the interactive area of that element or even been removed from the document. Note that if the target element is removed from the document, events will still be targeted at it, and hence won't necessarily bubble up to the window or document anymore. If there is any risk of an element being removed while it is being touched, the best practice is to attach the touch listeners directly to the target.

Value
-----

The `EventTarget` the `Touch` object applies to.

Examples
--------

This example illustrates how to access the `Touch` object's `Touch.target` property. The `Touch.target` property is an `Element` (`EventTarget`) on which a touch point is started when contact is first placed on the surface.

In following simple code snippet, we assume the user initiates one or more touch contacts on the `source` element. When the `touchstart` event handler for this element is invoked, each touch point's `Touch.target` property is accessed via the event's `TouchEvent.targetTouches` list.


```js
// Register a touchmove listener for the 'source' element
const src = document.getElementById("source");

src.addEventListener(
  "touchstart",
  (e) => {
    // Iterate through the touch points that were activated
    // for this element.
    for (let i = 0; i < e.targetTouches.length; i++) {
      console.log(`touchpoint[${i}].target = ${e.targetTouches[i].target}`);
    }
  },
  false,
);
```

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

| Specification |
| --- |
| Touch Events # dom-touch-target |

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

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

 The **`Touch.clientY`** read-only property returns the Y
 coordinate of the touch point relative to the browser's viewport, not including any
 scroll offset.

Value
-----

 A `double` floating point value representing the Y coordinate of the touch point
 relative to the viewport, not including any scroll offset.

Examples
--------

 This example illustrates using the `Touch` object's
 `Touch.clientX` and `Touch.clientY` properties. The
 `Touch.clientX` property is the horizontal coordinate of a touch point
 relative to the browser's viewport excluding any scroll offset. The
 `Touch.clientY` property is the vertical coordinate of the touch point
 relative to the browser's viewport excluding any scroll offset .

 In this example, we assume the user initiates a touch on an element with an id of
 `source`, moves within the element or out of the element and then releases
 contact with the surface. When the `touchend`
 event handler is invoked, the changes in the `Touch.clientX` and
 `Touch.clientY` coordinates, from the starting touch point to the ending
 touch point, are calculated.


```js
// Register touchstart and touchend listeners for element 'source'
const src = document.getElementById("source");
let clientX;
let clientY;

src.addEventListener(
  "touchstart",
  (e) => {
    // Cache the client X/Y coordinates
    clientX = e.touches[0].clientX;
    clientY = e.touches[0].clientY;
  },
  false,
);

src.addEventListener(
  "touchend",
  (e) => {
    let deltaX;
    let deltaY;

    // Compute the change in X and Y coordinates.
    // The first touch point in the changedTouches
    // list is the touch point that was just removed from the surface.
    deltaX = e.changedTouches[0].clientX - clientX;
    deltaY = e.changedTouches[0].clientY - clientY;

    // Process the data…
  },
  false,
);
```

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

| Specification |
| --- |
| Touch Events # dom-touch-clienty |

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

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

 The **`Touch.force`** read-only property returns the amount of
 pressure the user is applying to the touch surface for a `Touch` point.

Value
-----

 A `float` that represents the amount of pressure the user is applying to the
 touch surface. This is a value between `0.0` (no pressure) and
 `1.0` (the maximum amount of pressure the hardware can recognize). A value of
 `0.0` is returned if no value is known (for example the touch device does not
 support this property). In environments where force is known, the absolute pressure
 represented by the force attribute, and the sensitivity in levels of pressure, may vary.

Examples
--------

 This example illustrates using the `Touch` interface's
 `Touch.force` property. This property is a relative value of pressure
 applied, in the range `0.0` to `1.0`, where `0.0` is no
 pressure, and `1.0` is the highest level of pressure the touch device is
 capable of sensing.

 In following code snippet, the `touchstart` event handler iterates through
 the `targetTouches` list and logs the `force` value of each touch
 point but the code could invoke different processing depending on the value.


```js
someElement.addEventListener(
  "touchstart",
  (e) => {
    // Iterate through the list of touch points and log each touch
    // point's force.
    for (let i = 0; i < e.targetTouches.length; i++) {
      // Add code to "switch" based on the force value. For example
      // minimum pressure vs. maximum pressure could result in
      // different handling of the user's input.
      console.log(`targetTouches[${i}].force = ${e.targetTouches[i].force}`);
    }
  },
  false,
);
```

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

| Specification |
| --- |
| Touch Events # dom-touch-force |

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

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

Returns the Y coordinate of the touch point relative to the screen, not including any scroll offset.

Value
-----

A number.

Examples
--------

The Touch.screenX example includes an example of this property's usage.

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

| Specification |
| --- |
| Touch Events # dom-touch-screeny |

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

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

Returns the X coordinate of the touch point relative to the screen, not including any scroll offset.

Value
-----

A number.

Examples
--------

This example illustrates how to access the `Touch` object's `Touch.screenX` and `Touch.screenY` properties. The `Touch.screenX` property is the horizontal (x) coordinate of a touch point relative to the screen in CSS pixels. The `Touch.screenY` property is the vertical coordinate of a touch point relative to the screen in CSS pixels.

In following simple code snippet, we assume the user initiates multiple touch contacts on an element with an id of `source` and then releases contacts with the surface. When the `touchstart` event handler is invoked, each touch point's `Touch.screenX` and `Touch.screenY` coordinates are accessed.


```js
// Register a touchstart listeners for the 'source' element
const src = document.getElementById("source");

src.addEventListener(
  "touchstart",
  (e) => {
    // Iterate through the touch points and log each screenX/Y coordinate.
    // The unit of each coordinate is CSS pixels.
    for (let i = 0; i < e.touches.length; i++) {
      console.log(`touchpoint[${i}].screenX = ${e.touches[i].screenX}`);
      console.log(`touchpoint[${i}].screenY = ${e.touches[i].screenY}`);
    }
  },
  false,
);
```

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

| Specification |
| --- |
| Touch Events # dom-touch-screenx |

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

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

 The `Touch.clientX` read-only property returns the X coordinate of the touch
 point relative to the viewport, not including any scroll offset.

Value
-----

 A `double` floating point value representing the X coordinate of the touch point
 relative to the viewport, not including any scroll offset.

Examples
--------

 This example illustrates using the `Touch` object's
 `Touch.clientX` and `Touch.clientY` properties. The
 `Touch.clientX` property is the horizontal coordinate of a touch point
 relative to the browser's viewport excluding any scroll offset. The
 `Touch.clientY` property is the vertical coordinate of the touch point
 relative to the browser's viewport excluding any scroll offset .

 In this example, we assume the user initiates a touch on an element with an id of
 `source`, moves within the element or out of the element and then releases
 contact with the surface. When the `touchend`
 event handler is invoked, the changes in the `Touch.clientX` and
 `Touch.clientY` coordinates, from the starting touch point to the ending
 touch point, are calculated.


```js
// Register touchstart and touchend listeners for element 'source'
const src = document.getElementById("source");
let clientX;
let clientY;

src.addEventListener(
  "touchstart",
  (e) => {
    // Cache the client X/Y coordinates
    clientX = e.touches[0].clientX;
    clientY = e.touches[0].clientY;
  },
  false,
);

src.addEventListener(
  "touchend",
  (e) => {
    let deltaX;
    let deltaY;

    // Compute the change in X and Y coordinates.
    // The first touch point in the changedTouches
    // list is the touch point that was just removed from the surface.
    deltaX = e.changedTouches[0].clientX - clientX;
    deltaY = e.changedTouches[0].clientY - clientY;

    // Process the data…
  },
  false,
);
```

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

| Specification |
| --- |
| Touch Events # dom-touch-clientx |

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

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