recursal/MDN huggingface dataset:
Payment Request API
===================

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

The **Payment Request API** provides a consistent user experience for merchants and users. It is not a new way of paying for things; instead, it's a way for users to select their preferred way of paying for things and make that information available to a merchant.

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

Many problems related to online shopping cart abandonment can be traced to checkout forms, which can be difficult and time-consuming to fill out and often require multiple steps to complete. The **Payment Request API** is meant to reduce the steps needed to complete payment online, potentially doing away with checkout forms. It aims to make the checkout process more accessible by having payment apps store a user's details, which are passed along to a merchant, hopefully without requiring an HTML form.

To request a payment, a web page creates a `PaymentRequest` object in response to a user action that initiates a payment, such as clicking a "Purchase" button. The `PaymentRequest` allows the web page to exchange information with the user agent while the user provides input to complete the transaction.

You can find a complete guide in Using the Payment Request API.

**Note:** The API is available inside cross-origin `<iframe>` elements only if they have had the `allowpaymentrequest` attribute set on them.

Interfaces
----------

`PaymentAddress` 
Deprecated

Non-standard

An object that contains address information; used for billing and shipping addresses, for example.

`PaymentRequest`

An object that provides the API for creating and managing the user agent's payment interface.

`PaymentRequestUpdateEvent`

Enables the web page to update the details of the payment request in response to a user action.

`PaymentMethodChangeEvent`

Represents the user changing payment instrument (e.g., switching from one payment method to another).

`PaymentResponse`

An object returned after the user selects a payment method and approves a payment request.

`MerchantValidationEvent` 
Deprecated

Represents the browser requiring the merchant (website) to validate themselves as allowed to use a particular payment handler (e.g., registered as allowed to use Apple Pay).

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

| Specification |
| --- |
| Payment Request API 1.1 # paymentrequest-interface |

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

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

See also
--------

* Using the Payment Request API
* Payment processing concepts
* Introducing the Payment Request API for Apple Pay
* Google Pay API PaymentRequest Tutorial
* Samsung Pay Web Payments Integration Guide
* W3C Payment Request API FAQ
* Permissions Policy directive `payment`
AnimationEffect
===============

Baseline 2022
-------------

Newly availableSince September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The `AnimationEffect` interface of the Web Animations API is an interface representing animation effects.

`AnimationEffect` is an abstract interface and so isn't directly instantiable. However, concrete interfaces such as `KeyframeEffect` inherit from it, and instances of these interfaces can be passed to `Animation` objects for playing, and may also be used by CSS Animations and Transitions.

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

`AnimationEffect.getTiming()`

Returns the object associated with the animation containing all the animation's timing values.

`AnimationEffect.getComputedTiming()`

Returns the calculated timing properties for this `AnimationEffect`.

`AnimationEffect.updateTiming()`

Updates the specified timing properties of this `AnimationEffect`.

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

| Specification |
| --- |
| Web Animations # the-animationeffect-interface |

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

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

See also
--------

* Web Animations API
* `Animation.effect`
KeyframeEffect
==============

Baseline 2022
-------------

Newly availableSince September 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Learn more
* See full compatibility
* Report feedback
The **`KeyframeEffect`** interface of the Web Animations API lets us create sets of animatable properties and values, called **keyframes.** These can then be played using the `Animation()` constructor.

AnimationEffect

KeyframeEffectConstructor
-----------

`KeyframeEffect()`

Returns a new `KeyframeEffect` object instance, and also allows you to clone an existing keyframe effect object instance.

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

`KeyframeEffect.target`

Gets and sets the element, or originating element of the pseudo-element, being animated by this object. This may be `null` for animations that do not target a specific element or pseudo-element.

`KeyframeEffect.pseudoElement`

Gets and sets the selector of the pseudo-element being animated by this object. This may be `null` for animations that do not target a pseudo-element.

`KeyframeEffect.iterationComposite`

Gets and sets the iteration composite operation for resolving the property value changes of this keyframe effect.

`KeyframeEffect.composite`

Gets and sets the composite operation property for resolving the property value changes between this and other keyframe effects.

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

*This interface inherits some of its methods from its parent, `AnimationEffect`.*

`AnimationEffect.getComputedTiming()`

Returns the calculated, current timing values for this keyframe effect.

`KeyframeEffect.getKeyframes()`

Returns the computed keyframes that make up this effect along with their computed keyframe offsets.

`AnimationEffect.getTiming()`

Returns the object associated with the animation containing all the animation's timing values.

`KeyframeEffect.setKeyframes()`

Replaces the set of keyframes that make up this effect.

`AnimationEffect.updateTiming()`

Updates the specified timing properties.

Examples
--------

In the Follow the White Rabbit example, the KeyframeEffect constructor is used to create a set of keyframes that dictate how the White Rabbit should animate down the hole:


```js
const whiteRabbit = document.getElementById("rabbit");

const rabbitDownKeyframes = new KeyframeEffect(
  whiteRabbit, // element to animate
  [
    { transform: "translateY(0%)" }, // keyframe
    { transform: "translateY(100%)" }, // keyframe
  ],
  { duration: 3000, fill: "forwards" }, // keyframe options
);

const rabbitDownAnimation = new Animation(
  rabbitDownKeyframes,
  document.timeline,
);

// Play rabbit animation
rabbitDownAnimation.play();
```

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

| Specification |
| --- |
| Web Animations # the-keyframeeffect-interface |

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

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

See also
--------

* Web Animations API
* `Animation`
DynamicsCompressorNode
======================

The `DynamicsCompressorNode` interface provides a compression effect, which lowers the volume of the loudest parts of the signal in order to help prevent clipping and distortion that can occur when multiple sounds are played and multiplexed together at once. This is often used in musical production and game audio. `DynamicsCompressorNode` is an `AudioNode` that has exactly one input and one output.

EventTarget

AudioNode

DynamicsCompressorNode

|  |  |
| --- | --- |
| Number of inputs | `1` |
| Number of outputs | `1` |
| Channel count mode | `"clamped-max"` |
| Channel count | `2` |
| Channel interpretation | `"speakers"` |

Constructor
-----------

`DynamicsCompressorNode()`

Creates a new instance of an `DynamicsCompressorNode` object.

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

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

`DynamicsCompressorNode.threshold` Read only 

A k-rate `AudioParam` representing the decibel value above which the compression will start taking effect.

`DynamicsCompressorNode.knee` Read only 

A k-rate `AudioParam` containing a decibel value representing the range above the threshold where the curve smoothly transitions to the compressed portion.

`DynamicsCompressorNode.ratio` Read only 

A k-rate `AudioParam` representing the amount of change, in dB, needed in the input for a 1 dB change in the output.

`DynamicsCompressorNode.reduction` Read only 

A `float` representing the amount of gain reduction currently applied by the compressor to the signal.

`DynamicsCompressorNode.attack` Read only 

A k-rate `AudioParam` representing the amount of time, in seconds, required to reduce the gain by 10 dB.

`DynamicsCompressorNode.release` Read only 

A k-rate `AudioParam` representing the amount of time, in seconds, required to increase the gain by 10 dB.

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

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

Example
-------

See `BaseAudioContext.createDynamicsCompressor()` example code.

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

| Specification |
| --- |
| Web Audio API # DynamicsCompressorNode |

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

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

See also
--------

* Using the Web Audio API
XRSpace
=======

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

The **`XRSpace`** interface of the WebXR Device API is an abstract interface providing a common basis for every class which represents a virtual coordinate system within the virtual world, in which its origin corresponds to a physical location. Spatial data in WebXR is always expressed relative to an object based upon one of the descendant interfaces of `XRSpace`, at the time at which a given `XRFrame` takes place.

Numeric values such as pose positions are thus coordinates in the corresponding `XRSpace`, relative to that space's origin.

**Note:** The `XRSpace` interface is never used directly; instead, all spaces are created using one of the interfaces based on `XRSpace`. At this time, those are `XRReferenceSpace`, `XRBoundedReferenceSpace`, and `XRJointSpace`.

EventTarget

XRSpaceInterfaces based on XRSpace
---------------------------

Below is a list of interfaces based on the `XRSpace` interface.

`XRBoundedReferenceSpace`

Represents a reference space which may move within a region of space whose borders are defined by an array of points laid out in clockwise order along the floor to define the passable region of the space. The origin of an `XRBoundedReferenceSpace` is always at floor level, with its X and Z coordinates typically defaulting to a location near the room's center.

`XRReferenceSpace`

Represents a reference space which is typically expected to remain static for the duration of the `XRSession`. While objects may move within the space, the space itself remains fixed in place. There are exceptions to this static nature; most commonly, an `XRReferenceSpace` may move in order to adjust based on reconfiguration of the user's headset or other motion-sensitive device.

`XRJointSpace`

Represents the space of an `XRHand` joint.

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

*The `XRSpace` interface defines no properties of its own; however, it does inherit the properties of its parent interface, `EventTarget`.*

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

*The `XRSpace` interface provides no methods of its own. However, it inherits the methods of `EventTarget`, its parent interface.*

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

| Specification |
| --- |
| WebXR Device API # xrspace-interface |

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

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

The **`ImageData`** interface represents the underlying pixel data of an area of a `<canvas>` element.

It is created using the `ImageData()` constructor or creator methods on the `CanvasRenderingContext2D` object associated with a canvas: `createImageData()` and `getImageData()`. It can also be used to set a part of the canvas by using `putImageData()`.

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

Constructors
------------

`ImageData()`

Creates an `ImageData` object from a given `Uint8ClampedArray` and the size of the image it contains. If no array is given, it creates an image of a transparent black rectangle. Note that this is the most common way to create such an object in workers as `createImageData()` is not available there.

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

`ImageData.data` Read only 

A `Uint8ClampedArray` representing a one-dimensional array containing the data in the RGBA order, with integer values between `0` and `255` (inclusive). The order goes by rows from the top-left pixel to the bottom-right.

`ImageData.colorSpace` Read only 

A string indicating the color space of the image data.

`ImageData.height` Read only 

An `unsigned long` representing the actual height, in pixels, of the `ImageData`.

`ImageData.width` Read only 

An `unsigned long` representing the actual width, in pixels, of the `ImageData`.

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

| Specification |
| --- |
| HTML Standard # imagedata |

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

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

See also
--------

* `CanvasRenderingContext2D`
* The `<canvas>` element and its associated interface, `HTMLCanvasElement`.
ImageTrack
==========

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`ImageTrack`** interface of the WebCodecs API represents an individual image track.

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

`ImageTrack.animated` Read only  
Experimental

Returns a `boolean` indicating whether the track is animated and therefore has multiple frames.

`ImageTrack.frameCount` Read only  
Experimental

Returns an integer indicating the number of frames in the track.

`ImageTrack.repetitionCount` Read only  
Experimental

Returns an integer indicating the number of times that the animation repeats.

`ImageTrack.selected` Read only  
Experimental

Returns a `boolean` indicating whether the track is selected for decoding.

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

| Specification |
| --- |
| WebCodecs # imagetrack-interface |

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

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

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

The **`PaymentMethodChangeEvent`** interface of the Payment Request API describes the `paymentmethodchange` event which is fired by some payment handlers when the user switches payment instruments (e.g., a user selects a "store" card to make a purchase while using Apple Pay).

Event

PaymentRequestUpdateEvent

PaymentMethodChangeEventConstructor
-----------

`PaymentMethodChangeEvent()`

Creates and returns a new `PaymentMethodChangeEvent` object.

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

*In addition to the properties below, this interface includes properties inherited from `PaymentRequestUpdateEvent`.*

`methodDetails` Read only 

An object containing payment method-specific data useful when handling a payment method change. If no such information is available, this value is `null`.

`methodName` Read only 

A string containing the payment method identifier, a string which uniquely identifies a particular payment method. This identifier is usually a URL used during the payment process, but may be a standardized non-URL string as well, such as `basic-card`. The default value is the empty string, `""`.

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

*This interface includes methods inherited from `PaymentRequestUpdateEvent`.*

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

| Specification |
| --- |
| Payment Request API 1.1 # paymentmethodchangeevent-interface |

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

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

SVG animated boolean interface
------------------------------

The `SVGAnimatedBoolean` interface is used for attributes of type boolean which can be animated.

### Interface overview

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

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

| Name | Type | Description |
| --- | --- | --- |
| `baseVal` | boolean | The base value of the given attribute before applying any animations. |
| `animVal` | boolean | 
 If the given attribute or property is being animated, contains the
 current animated value of the attribute or property. If the given
 attribute or property is not currently being animated, contains the same
 value as `baseVal`.
  |

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

The `SVGAnimatedBoolean` interface do not provide any specific methods.

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

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

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

The Permissions interface of the Permissions API provides the core Permission API functionality, such as methods for querying and revoking permissions

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

`Permissions.query()`

Returns the user permission status for a given API.

`Permissions.request()` 
Experimental

Requests permission to use a given API. This is not currently supported in any browser.

`Permissions.requestAll()` 
Experimental

Non-standard

Requests permission to use a given set of APIs. This is not currently supported in any browser.

`Permissions.revoke()` 
Deprecated

Revokes the permission currently set on a given API.

Example
-------


```js
navigator.permissions.query({ name: "geolocation" }).then((result) => {
  if (result.state === "granted") {
    showLocalNewsWithGeolocation();
  } else if (result.state === "prompt") {
    showButtonToEnableLocalNews();
  }
  // Don't do anything if the permission was denied.
});
```

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

| Specification |
| --- |
| Permissions # permissions-interface |

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

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

**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 **`XRAnchor`** interface creates anchors which keep track of the pose that is fixed relative to the real world. With anchors, you can specify poses in the world that need to be updated to correctly reflect the evolving understanding of the world, such that the poses remain aligned with the same place in the physical world. That helps to build an illusion that the placed objects are really present in the user's environment.

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

`XRAnchor.anchorSpace` Read only  
Experimental

Returns an `XRSpace` object to locate the anchor relative to other `XRSpace` objects.

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

`XRAnchor.delete()` 
Experimental

Removes the anchor.

Examples
--------

### Requesting a session with anchors enabled


```js
navigator.xr.requestSession("immersive-ar", {
  requireFeatures: ["anchors"],
});
```

### Adding anchors

You can use `XRFrame.createAnchor()` to create an anchor.


```js
frame.createAnchor(anchorPose, referenceSpace).then(
  (anchor) => {
    // Do stuff with the anchor (assign objects that will be relative to this anchor)
  },
  (error) => {
    console.error(`Could not create anchor: ${error}`);
  },
);
```

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

| Specification |
| --- |
| WebXR Anchors Module # xr-anchor |

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

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

See also
--------

* `XRAnchorSet`
* `XRFrame.createAnchor()`
* `XRFrame.trackedAnchors`
* `XRHitTestResult.createAnchor()`
HTMLParagraphElement
====================

The **`HTMLParagraphElement`** interface provides special properties (beyond those of the regular `HTMLElement` object interface it inherits) for manipulating `<p>` elements.

EventTarget

Node

Element

HTMLElement

HTMLParagraphElementInstance properties
-------------------

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

`HTMLParagraphElement.align` 
Deprecated

A string representing an enumerated property indicating alignment of the element's contents with respect to the surrounding context. The possible values are `"left"`, `"right"`, `"justify"`, and `"center"`.

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

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

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

| Specification |
| --- |
| HTML Standard # htmlparagraphelement |

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: `<p>`.
MediaError
==========

The **`MediaError`** interface represents an error which occurred while handling media in an HTML media element based on `HTMLMediaElement`, such as `<audio>` or `<video>`.

A `MediaError` object describes the error in general terms using a numeric `code` categorizing the kind of error, and a `message`, which provides specific diagnostics about what went wrong.

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

*This interface doesn't inherit any properties.*

`MediaError.code`

A number which represents the general type of error that occurred.

`MediaError.message`

A human-readable string which provides *specific diagnostic information* to help the reader understand the error condition which occurred; specifically, it isn't a summary of what the error code means, but actual diagnostic information to help in understanding what exactly went wrong. This text and its format is not defined by the specification and will vary from one user agent to another. If no diagnostics are available, or no explanation can be provided, this value is an empty string (`""`).

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

*This interface doesn't implement or inherit any methods, and has none of its own.*

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

| Specification |
| --- |
| HTML Standard # error-codes |

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

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

See also
--------

* `HTMLMediaElement.error`