From 806af113c9b88abc479e271286aa9c5237b76b32 Mon Sep 17 00:00:00 2001 From: Piotr Tomiak Date: Thu, 5 Feb 2026 10:44:44 +0100 Subject: [PATCH] WEB-76699 MDN: documentation update February 2025 GitOrigin-RevId: 0623bc7ffc6312a5dfa49350c4d211055e723b52 --- .../com/intellij/documentation/mdn/Css.json | 5441 +++++++++-------- .../intellij/documentation/mdn/DomEvents.json | 53 +- .../documentation/mdn/GlobalObjects.json | 1663 +++-- .../com/intellij/documentation/mdn/Html.json | 563 +- .../intellij/documentation/mdn/MathML.json | 78 +- .../com/intellij/documentation/mdn/Svg.json | 312 +- .../intellij/documentation/mdn/WebApi-a.json | 1536 +++-- .../intellij/documentation/mdn/WebApi-e.json | 1359 ++-- .../documentation/mdn/WebApi-index.json | 65 +- .../intellij/documentation/mdn/WebApi-l.json | 1602 +++-- .../intellij/documentation/mdn/WebApi-r.json | 1345 ++-- .../intellij/documentation/mdn/WebApi-u.json | 906 +-- 12 files changed, 8609 insertions(+), 6314 deletions(-) diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Css.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Css.json index c8062cb0ebe9..6ae13aa1f5ba 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Css.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Css.json @@ -10,7 +10,7 @@ "lang": "en-us", "atRules": { "charset": { - "url": "$MDN_URL$/web/css/@charset", + "url": "$MDN_URL$/web/css/reference/at-rules/@charset", "status": [ "StandardTrack" ], @@ -29,16 +29,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The @charset CSS rule specifies the character encoding used in the style sheet. This syntax is useful when using non-ASCII characters in some CSS properties, like content. Although the first character in @charset is the @ symbol, it is not an at-rule. It is a specific byte sequence that can only be placed at the very beginning of a stylesheet. No other characters, except the Unicode byte-order mark, are allowed before it. It also does not follow normal CSS syntax rules such as use of quotes or whitespace.\n

If a @charset is not recognized as the charset declaration, it is parsed as a normal at-rule. The CSS syntax module deprecates this fallback behavior, defining it as an unrecognized legacy rule to be dropped when a stylesheet is grammar-checked.\n

As there are several ways to define the character encoding of a style sheet, the browser will try the following methods in the following order (and stop as soon as one yields a result):\n

    \n
  1. The value of the Unicode byte-order character placed at the beginning of the file.
  2. \n
  3. The value given by the charset attribute of the Content-Type: HTTP header or the equivalent in the protocol used to serve the style sheet.
  4. \n
  5. The @charset CSS declaration.
  6. \n
  7. Use the character encoding defined by the referring document: the charset attribute of the <link> element. This method is obsolete and should not be used.
  8. \n
  9. Assume that the document is UTF-8.
  10. \n
", + "doc": "The @charset CSS rule specifies the character encoding used in the style sheet. This syntax is useful when using non-ASCII characters in some CSS properties, like content. Although the first character in @charset is the @ symbol, it is not an at-rule. It is a specific byte sequence that can only be placed at the very beginning of a stylesheet. No other characters, except the Unicode byte-order mark, are allowed before it. It also does not follow normal CSS syntax rules such as use of quotes or whitespace.\n

If a @charset is not recognized as the charset declaration, it is parsed as a normal at-rule. The CSS syntax module deprecates this fallback behavior, defining it as an unrecognized legacy rule to be dropped when a stylesheet is grammar-checked.\n

As there are several ways to define the character encoding of a style sheet, the browser will try the following methods in the following order (and stop as soon as one yields a result):\n

    \n
  1. The value of the Unicode byte-order character placed at the beginning of the file.
  2. \n
  3. The value given by the charset attribute of the Content-Type: HTTP header or the equivalent in the protocol used to serve the style sheet.
  4. \n
  5. The @charset CSS declaration.
  6. \n
  7. Use the character encoding defined by the referring document: the charset attribute of the <link> element. This method is obsolete and should not be used.
  8. \n
  9. Assume that the document is UTF-8.
  10. \n
", "formalSyntax": "Note that the @charset rule is not parsed via syntax, but via a specific byte sequence of the following form:" }, "color-profile": { - "url": "$MDN_URL$/web/css/@color-profile", - "doc": "The @color-profile CSS at-rule defines and names a color profile which can later be used in the color() function to specify a color.", + "url": "$MDN_URL$/web/css/reference/at-rules/@color-profile", + "doc": "The @color-profile CSS at-rule defines and names a color profile which can later be used in the color() function to specify a color.", "formalSyntax": "@color-profile [ <dashed-ident> | device-cmyk ] { <declaration-list> }" }, "container": { - "url": "$MDN_URL$/web/css/@container", + "url": "$MDN_URL$/web/css/reference/at-rules/@container", "status": [ "StandardTrack" ], @@ -57,11 +57,11 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The @container CSS at-rule is a conditional group rule that applies styles to a containment context.\nStyle declarations are filtered by a condition and applied to the container if the condition is true.\nThe condition is evaluated when the queried container size, <style-feature>, or scroll-state changes.\n

The container-name property specifies a list of query container names. These names can be used by @container rules to filter which query containers are targeted. The optional, case-sensitive <container-name> filters the query containers that are targeted by the query.\n

Once an eligible query container has been selected for an element, each container feature in the <container-condition> is evaluated against that query container.", + "doc": "The @container CSS at-rule is a conditional group rule that applies styles to a containment context.\nStyle declarations are filtered by a condition and applied to the container if the condition is true.\nThe condition is evaluated when the queried container size, <style-feature>, or scroll-state changes.\n

The container-name property specifies a list of query container names. These names can be used by @container rules to filter which query containers are targeted. The optional, case-sensitive <container-name> filters the query containers that are targeted by the query.\n

Once an eligible query container has been selected for an element, each container feature in the <container-condition> is evaluated against that query container.", "formalSyntax": "@container <container-condition># { <block-contents> }\n  <container-condition> = [ <container-name>? <container-query>? ]!\n  <container-name> = <custom-ident>\n  <container-query> = not <query-in-parens> | <query-in-parens> [ [ and <query-in-parens> ]* | [ or <query-in-parens> ]* ]\n  <query-in-parens> = ( <container-query> ) | ( <size-feature> ) | style( <style-query> ) | scroll-state( <scroll-state-query> ) | <general-enclosed>\n  <style-query> = not <style-in-parens> | <style-in-parens> [ [ and <style-in-parens> ]* | [ or <style-in-parens> ]* ] | <style-feature>\n  <scroll-state-query> = not <scroll-state-in-parens> | <scroll-state-in-parens> [ [ and <scroll-state-in-parens> ]* | [ or <scroll-state-in-parens> ]* ] | <scroll-state-feature>\n  <general-enclosed> = [ <function-token> <any-value>? ) ] | [ ( <any-value>? ) ]\n  <style-in-parens> = ( <style-query> ) | ( <style-feature> ) | <general-enclosed>\n  <style-feature> = <style-feature-plain> | <style-feature-boolean> | <style-range>\n  <scroll-state-in-parens> = ( <scroll-state-query> ) | ( <scroll-state-feature> ) | <general-enclosed>\n  <style-feature-plain> = <style-feature-name> : <style-feature-value>\n  <style-feature-boolean> = <style-feature-name>\n  <style-range> = <style-range-value> <mf-comparison> <style-range-value> | <style-range-value> <mf-lt> <style-range-value> <mf-lt> <style-range-value> | <style-range-value> <mf-gt> <style-range-value> <mf-gt> <style-range-value>\n  <style-range-value> = <custom-property-name> | <style-feature-value>\n  <mf-comparison> = <mf-lt> | <mf-gt> | <mf-eq>\n  <mf-lt> = '<' '='?\n  <mf-gt> = '>' '='?\n  <mf-eq> = '='" }, "counter-style": { - "url": "$MDN_URL$/web/css/@counter-style", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style", "status": [ "StandardTrack" ], @@ -79,10 +79,10 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The @counter-style CSS at-rule lets you extend predefined list styles and define your own counter styles that are not part of the predefined set of styles. The @counter-style rule contains descriptors defining how the counter value is converted into a string representation.\n

While CSS provides many useful predefined counter styles, the @counter-style at-rule offers an open-ended method for creating counters. This at-rule caters to the needs of worldwide typography by allowing authors to define their own counter styles when the predefined styles don't fit their requirements.", + "doc": "The @counter-style CSS at-rule lets you extend predefined list styles and define your own counter styles that are not part of the predefined set of styles. The @counter-style rule contains descriptors defining how the counter value is converted into a string representation.\n

While CSS provides many useful predefined counter styles, the @counter-style at-rule offers an open-ended method for creating counters. This at-rule caters to the needs of worldwide typography by allowing authors to define their own counter styles when the predefined styles don't fit their requirements.", "properties": { "additive-symbols": { - "url": "$MDN_URL$/web/css/@counter-style/additive-symbols", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/additive-symbols", "status": [ "StandardTrack" ], @@ -100,15 +100,15 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The additive-symbols descriptor of the @counter-style at-rule is used to specify counter symbols when the @counter-style system descriptor value is set as additive. The additive system is used to construct sign-value numbering systems such as Roman numerals.", - "formalSyntax": "[ <integer [0,∞]> && <symbol> ]#\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "doc": "The additive-symbols descriptor of the @counter-style at-rule is used to specify counter symbols when the @counter-style system descriptor value is set as additive. The additive system is used to construct sign-value numbering systems such as Roman numerals.", + "formalSyntax": "[ <integer [0,∞]> && <symbol> ]#\n  <integer> = <number-token>\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "<integer>": "A non-negative integer values specifying the integer weight of the associated symbol value of the tuple.", "<symbol>": "Specifies the counter symbol to be used for the weight value defined by the associated <integer> weight value of the tuple." } }, "fallback": { - "url": "$MDN_URL$/web/css/@counter-style/fallback", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/fallback", "status": [ "StandardTrack" ], @@ -126,11 +126,11 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The fallback descriptor of the @counter-style at-rule can be used to specify a counter style to fall back to if the counter style being defined cannot create a marker representation for a particular counter value.", - "formalSyntax": "<counter-style-name>" + "doc": "The fallback descriptor of the @counter-style at-rule can be used to specify a counter style to fall back to if the counter style being defined cannot create a marker representation for a particular counter value.", + "formalSyntax": "<counter-style-name>\n  <counter-style-name> = <custom-ident>" }, "negative": { - "url": "$MDN_URL$/web/css/@counter-style/negative", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/negative", "status": [ "StandardTrack" ], @@ -148,14 +148,14 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The negative descriptor of the @counter-style at-rule lets you define how negative counter values are represented when defining custom counter styles. The value of the negative descriptor defines the symbols to be added before and after the counter representation when the counter's value is negative.", + "doc": "The negative descriptor of the @counter-style at-rule lets you define how negative counter values are represented when defining custom counter styles. The value of the negative descriptor defines the symbols to be added before and after the counter representation when the counter's value is negative.", "formalSyntax": "<symbol> <symbol>?\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "<symbol>": "If only one value is specified, it is added before the counter representation when the counter is negative. If two values are specified, the first one is added before and the second one is added after the counter representation when the counter is negative." } }, "pad": { - "url": "$MDN_URL$/web/css/@counter-style/pad", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/pad", "status": [ "StandardTrack" ], @@ -173,15 +173,15 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The pad descriptor of the @counter-style at-rule is used to set a minimum length for marker representations.", - "formalSyntax": "<integer [0,∞]> &&<symbol>\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "doc": "The pad descriptor of the @counter-style at-rule is used to set a minimum length for marker representations.", + "formalSyntax": "<integer [0,∞]> &&<symbol>\n  <integer> = <number-token>\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "<integer>": "Specifies the minimum length that all marker representations must reach. The value must be non-negative. In the case of the pad descriptor, this value is also known as the pad length.", "<symbol>": "Specifies the symbol to be used for padding if the minimum length defined by the <integer> is not reached. In the case of the pad descriptor, this value is also known as the padding symbol." } }, "prefix": { - "url": "$MDN_URL$/web/css/@counter-style/prefix", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/prefix", "status": [ "StandardTrack" ], @@ -199,14 +199,14 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The @counter-style rule's prefix descriptor specifies content that will be added to the beginning of the counter's marker representation.\n

When the counter value is negative, the prefix comes before the negative sign and any other <symbol>s added by the negative descriptor.", + "doc": "The @counter-style rule's prefix descriptor specifies content that will be added to the beginning of the counter's marker representation.\n

When the counter value is negative, the prefix comes before the negative sign and any other <symbol>s added by the negative descriptor.", "formalSyntax": "<symbol>\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<symbol>": "Specifies a <symbol> — a <string>, <image>, or <custom-ident> — that is prepended to the marker representation." + "<symbol>": "Specifies a <symbol> — a <string>, <image>, or <custom-ident> — that is prepended to the marker representation." } }, "range": { - "url": "$MDN_URL$/web/css/@counter-style/range", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/range", "status": [ "StandardTrack" ], @@ -224,15 +224,15 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The range descriptor lets the author specify one or more ranges of counter values for which the style is applied when defining custom counter styles with the @counter-style at-rule. When the range descriptor is included, the defined counter will only be used for values in the set ranges. If the counter value is outside the specified range, the fallback style will be used to construct the representation of that marker.", - "formalSyntax": "[ [ <integer> | infinite ]{2} ]# | auto", + "doc": "The range descriptor lets the author specify one or more ranges of counter values for which the style is applied when defining custom counter styles with the @counter-style at-rule. When the range descriptor is included, the defined counter will only be used for values in the set ranges. If the counter value is outside the specified range, the fallback style will be used to construct the representation of that marker.", + "formalSyntax": "[ [ <integer> | infinite ]{2} ]# | auto\n  <integer> = <number-token>", "values": { - "auto": "The entire set of numbers representable by the counter system. Those range values depends on the counter system:\n

", - "[ [ <integer> | infinite ]{2} ]#": "Each range within the comma separated list of ranges includes two values, each being either an <integer> or the keyword infinite. If infinite is used as the first value in a range, it represents negative infinity; if it is used as the second value, it represents positive infinity. The first value of each range is the lower bound for the range and the second value is the upper bound, inclusive. If the lower bound of any range in the list is higher than the upper bound, the entire range descriptor is invalid and will be ignored." + "auto": "The entire set of numbers representable by the counter system. Those range values depends on the counter system:\n", + "[ [ <integer> | infinite ]{2} ]#": "Each range within the comma separated list of ranges includes two values, each being either an <integer> or the keyword infinite. If infinite is used as the first value in a range, it represents negative infinity; if it is used as the second value, it represents positive infinity. The first value of each range is the lower bound for the range and the second value is the upper bound, inclusive. If the lower bound of any range in the list is higher than the upper bound, the entire range descriptor is invalid and will be ignored." } }, "speak-as": { - "url": "$MDN_URL$/web/css/@counter-style/speak-as", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/speak-as", "status": [ "StandardTrack" ], @@ -247,19 +247,19 @@ "baseline": { "level": "NONE" }, - "doc": "The speak-as descriptor specifies how a counter symbol constructed with a given @counter-style will be represented in the spoken form. For example, an author can specify a counter symbol to be either spoken as its numerical value or just represented with an audio cue.", - "formalSyntax": "auto | bullets | numbers | words | spell-out | <counter-style-name>", + "doc": "The speak-as descriptor specifies how a counter symbol constructed with a given @counter-style will be represented in the spoken form. For example, an author can specify a counter symbol to be either spoken as its numerical value or just represented with an audio cue.", + "formalSyntax": "auto | bullets | numbers | words | spell-out | <counter-style-name>\n  <counter-style-name> = <custom-ident>", "values": { - "auto": "If the value of speak-as is specified as auto, then the effective value of speak-as will be determined based on the value of the system descriptor:\n", + "auto": "If the value of speak-as is specified as auto, then the effective value of speak-as will be determined based on the value of the system descriptor:\n", "bullets": "A phrase or an audio cue defined by the user agent for representing an unordered list item will be read out.", "numbers": "The numerical value of the counter will be read out in the document language.", "words": "The user agent will generate a counter value as normal and read it out as a word in the document language.", "spell-out": "The user agent will generate a counter representation as normal and would read it out letter by letter. If the user agent doesn't know how to read out a particular counter symbol, the user agent might read it out as if the value of speak-as was numbers.", - "<counter-style-name>": "The name of another counter style, specified as a <custom-ident>. If included, the counter will be spoken out in the form specified in that counter style, kind of like specifying the fallback descriptor. If the specified style does not exist, speak-as defaults to auto." + "<counter-style-name>": "The name of another counter style, specified as a <custom-ident>. If included, the counter will be spoken out in the form specified in that counter style, kind of like specifying the fallback descriptor. If the specified style does not exist, speak-as defaults to auto." } }, "suffix": { - "url": "$MDN_URL$/web/css/@counter-style/suffix", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/suffix", "status": [ "StandardTrack" ], @@ -277,14 +277,14 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The suffix descriptor of the @counter-style rule specifies content that will be added to the end of the marker representation.", + "doc": "The suffix descriptor of the @counter-style rule specifies content that will be added to the end of the marker representation.", "formalSyntax": "<symbol>\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<symbol>": "Specifies a <symbol> that is appended to the marker representation. It may be a <string>, <image>, or <custom-ident>." + "<symbol>": "Specifies a <symbol> that is appended to the marker representation. It may be a <string>, <image>, or <custom-ident>." } }, "symbols": { - "url": "$MDN_URL$/web/css/@counter-style/symbols", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/symbols", "status": [ "StandardTrack" ], @@ -295,14 +295,14 @@ "baseline": { "level": "NONE" }, - "doc": "The symbols CSS descriptor of the @counter-style at-rule is used to specify the symbols for creating counter representations in the specified counter system. Specifying this descriptor is mandatory when the value of the system descriptor is cyclic, numeric, alphabetic, symbolic, or fixed.", + "doc": "The symbols CSS descriptor of the @counter-style at-rule is used to specify the symbols for creating counter representations in the specified counter system. Specifying this descriptor is mandatory when the value of the system descriptor is cyclic, numeric, alphabetic, symbolic, or fixed.", "formalSyntax": "<symbol>+\n  <symbol> = <string> | <image> | <custom-ident>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<symbol>": "Specifies the symbol to use within the counter system. Each symbol in the list can be either a <string>, an <image>, or a <custom-ident>. The <image> value can, in turn, be specified as a <url> or <gradient>." + "<symbol>": "Specifies the symbol to use within the counter system. Each symbol in the list can be either a <string>, an <image>, or a <custom-ident>. The <image> value can, in turn, be specified as a <url> or <gradient>." } }, "system": { - "url": "$MDN_URL$/web/css/@counter-style/system", + "url": "$MDN_URL$/web/css/reference/at-rules/@counter-style/system", "status": [ "StandardTrack" ], @@ -320,32 +320,45 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The system descriptor specifies the algorithm to be used for converting the integer value of a counter to a string representation. It is used in a @counter-style to define the behavior of the defined style.\n

If the algorithm specified in the system descriptor is unable to construct the representation for a particular counter value, then that value's representation will be constructed using the fallback system provided.", - "formalSyntax": "cyclic | numeric | alphabetic | symbolic | additive | [ fixed <integer>? ] | [ extends <counter-style-name> ]", + "doc": "The system descriptor specifies the algorithm to be used for converting the integer value of a counter to a string representation. It is used in a @counter-style to define the behavior of the defined style.\n

If the algorithm specified in the system descriptor is unable to construct the representation for a particular counter value, then that value's representation will be constructed using the fallback system provided.", + "formalSyntax": "cyclic | numeric | alphabetic | symbolic | additive | [ fixed <integer>? ] | [ extends <counter-style-name> ]\n  <integer> = <number-token>\n  <counter-style-name> = <custom-ident>", "values": { - "cyclic": "Cycles through the list of symbols provided in the symbols descriptor. Once the end of the list is reached, the cycle will loop back to the beginning and start over. This value is useful both for basic bullet styles with just one symbol and for styles with multiple symbols. At least one symbol must be specified in the symbols descriptor, otherwise the counter style is not valid.", + "cyclic": "Cycles through the list of symbols provided in the symbols descriptor. Once the end of the list is reached, the cycle will loop back to the beginning and start over. This value is useful both for basic bullet styles with just one symbol and for styles with multiple symbols. At least one symbol must be specified in the symbols descriptor, otherwise the counter style is not valid.", "numeric": "Interprets the counter symbols as digits in a place-value numbering system. The numeric system is similar to the alphabetic system, described above. The main difference is that in the alphabetic system, the first counter symbol given in the symbols descriptor is interpreted as 1, the next as 2, and so on. However, in the numeric system, the first counter symbol is interpreted as 0, the next as 1, then 2, and so on.\n

At least two counter symbols must be specified in the symbols descriptor or the counter style is not valid.", "alphabetic": "Interprets the specified symbols as digits, to an alphabetic numbering system. If the characters \"a\" to \"z\" are specified as symbols in a counter style, with the alphabetic system, then the first 26 counter representations will be \"a\", \"b\" up to \"z\". Until this point, the behavior is the same as that of the symbolic system, described above. However, after \"z\", it will continue as \"aa\", \"ab\", \"ac\"…\n

The symbols descriptor must contain at least two symbols or the counter style is not valid. The first counter symbol provided in the symbols descriptor is interpreted as 1, the next as 2, and so on. This system is also defined strictly over positive counter values.", "symbolic": "Cycles through the symbols provided in the symbols descriptor list repeatedly, doubling, tripling, and so on, the symbols on each successive pass through the list. For example, if two symbols \"◽\" and \"◾\" are specified in the symbols descriptor, on each successive pass, they will become \"◽◽\" and \"◾◾\", then \"◽◽◽\" and \"◾◾◾\", and so on in subsequent passes. At least one symbol must be specified in the symbols descriptor, otherwise the counter style is not valid. This counter system works for positive counter values only.", "additive": "Used to represent \"sign-value\" numbering systems, such as Roman numerals, which rather than reuse digits in different positions to obtain different values, define additional digits for larger values. The value of a number in such a system can be found out by adding the digits in the number.\n

An additional descriptor called additive-symbols must be specified with at least one additive tuple, or else the counter style rule will not be valid. An additive tuple is similar to a composite counter symbol, which is made up of two parts: a normal counter symbol and a non-negative integer weight. The additive tuples must be specified in the descending order of their weights or the system is invalid.", - "fixed or fixed <integer>": "Defines a finite set of symbols, iterating once through the list of symbols provided in the symbols descriptor. Once the specified symbols have been iterated through, the fallback counter style is used. This keyword value is useful in cases where the counter style values are finite. At least one symbol must be specified in the symbols descriptor, otherwise the counter style is not valid. The fixed keyword can be followed by an optional <integer> value. If specified, the <integer> value indicates the item in the list that will get the first symbol from the list of symbols. If omitted, the default value of integer is 1, which gives the first item in the list the first symbol.", + "fixed or fixed <integer>": "Defines a finite set of symbols, iterating once through the list of symbols provided in the symbols descriptor. Once the specified symbols have been iterated through, the fallback counter style is used. This keyword value is useful in cases where the counter style values are finite. At least one symbol must be specified in the symbols descriptor, otherwise the counter style is not valid. The fixed keyword can be followed by an optional <integer> value. If specified, the <integer> value indicates the item in the list that will get the first symbol from the list of symbols. If omitted, the default value of integer is 1, which gives the first item in the list the first symbol.", "extends": "Extends the algorithm of another browser- or author-defined counter style by allowing the alteration of some aspects of the extended counter style. Any unspecified descriptors and their values are inherited from the extended counter style specified. If the counter style name specified with extends is not yet defined, the decimal counter style will be extended by default.\n

It must not contain a symbols or additive-symbols descriptor, otherwise the counter style rule will be invalid. If one or more counter styles definitions form a cycle with their extends values, the browser will treat all the participating counter styles as extending from the decimal style." } } }, - "formalSyntax": "@counter-style <counter-style-name> { <declaration-list> }" + "formalSyntax": "@counter-style <counter-style-name> { <declaration-list> }\n  <counter-style-name> = <custom-ident>" + }, + "custom-media": { + "url": "$MDN_URL$/web/css/reference/at-rules/@custom-media", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": {}, + "baseline": { + "level": "NONE" + }, + "doc": "

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

\n

The @custom-media CSS at-rule defines aliases for long or complex media queries. Instead of repeating the same hardcoded <media-query-list> in multiple @media at-rules, it can be defined once in a @custom-media at-rule and referenced throughout the stylesheet whenever needed.", + "formalSyntax": "@custom-media <extension-name> [ <media-query-list> | true | false ] ;" }, "document": { - "url": "$MDN_URL$/web/css/@document", + "url": "$MDN_URL$/web/css/reference/at-rules/@document", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

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.

\n

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets (see userchrome.org for more information), though it can be used on author-defined style sheets, too.", + "doc": "

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.

\n

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The @document CSS at-rule restricts the style rules contained within it based on the URL of the document. It is designed primarily for user-defined style sheets (see userchrome.org for more information), though it can be used on author-defined style sheets, too.", "formalSyntax": "@document [ <url> | url-prefix(<string>) | domain(<string>) | media-document(<string>) | regexp(<string>)]# {<group-rule-body>}" }, "font-face": { - "url": "$MDN_URL$/web/css/@font-face", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face", "status": [ "StandardTrack" ], @@ -364,10 +377,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer.", + "doc": "The @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer.", "properties": { "ascent-override": { - "url": "$MDN_URL$/web/css/@font-face/ascent-override", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/ascent-override", "status": [ "StandardTrack" ], @@ -382,15 +395,15 @@ "baseline": { "level": "NONE" }, - "doc": "The ascent-override CSS descriptor for the @font-face at-rule defines the ascent metric for the font. The ascent metric is the height above the baseline that CSS uses to lay out line boxes in an inline formatting context.", + "doc": "The ascent-override CSS descriptor for the @font-face at-rule defines the ascent metric for the font. The ascent metric is the height above the baseline that CSS uses to lay out line boxes in an inline formatting context.", "formalSyntax": "normal | <percentage [0,∞]>", "values": { "normal": "The default value. When used the metric value is obtained from the font file.", - "<percentage>": "A <percentage> value." + "<percentage>": "A <percentage> value." } }, "descent-override": { - "url": "$MDN_URL$/web/css/@font-face/descent-override", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/descent-override", "status": [ "StandardTrack" ], @@ -405,15 +418,15 @@ "baseline": { "level": "NONE" }, - "doc": "The descent-override CSS descriptor for the @font-face at-rule defines the descent metric for the font. The descent metric is the height below the baseline that CSS uses to lay out line boxes in an inline formatting context.", + "doc": "The descent-override CSS descriptor for the @font-face at-rule defines the descent metric for the font. The descent metric is the height below the baseline that CSS uses to lay out line boxes in an inline formatting context.", "formalSyntax": "normal | <percentage [0,∞]>", "values": { "normal": "The default value. When used the metric value is obtained from the font file.", - "<percentage>": "A <percentage> value." + "<percentage>": "A <percentage> value." } }, "font-display": { - "url": "$MDN_URL$/web/css/@font-face/font-display", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-display", "status": [ "StandardTrack" ], @@ -432,7 +445,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The font-display descriptor for the @font-face at-rule determines how a font face is displayed based on whether and when it is downloaded and ready to use.", + "doc": "The font-display descriptor for the @font-face at-rule determines how a font face is displayed based on whether and when it is downloaded and ready to use.", "formalSyntax": "auto | block | swap | fallback | optional", "values": { "auto": "The font display strategy is defined by the user agent.", @@ -443,7 +456,7 @@ } }, "font-family": { - "url": "$MDN_URL$/web/css/@font-face/font-family", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-family", "status": [ "StandardTrack" ], @@ -462,14 +475,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-family CSS descriptor sets the font family for a font specified in an @font-face at-rule.\n

The value is used for name matching against a particular @font-face when styling elements using the font-family property.\nAny name may be used, and this overrides any name specified in the underlying font data.", + "doc": "The font-family CSS descriptor sets the font family for a font specified in an @font-face at-rule.\n

The value is used for name matching against a particular @font-face when styling elements using the font-family property.\nAny name may be used, and this overrides any name specified in the underlying font data.", "formalSyntax": "<family-name>\n  <family-name> = <string> | <custom-ident>+", "values": { "<family-name>": "Specifies the name of the font family." } }, "font-feature-settings": { - "url": "$MDN_URL$/web/css/@font-face/font-feature-settings", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-feature-settings", "status": [ "StandardTrack" ], @@ -487,18 +500,17 @@ "level": "LOW", "lowDate": "2025-09-05" }, - "doc": "The font-feature-settings CSS descriptor allows you to define the initial settings to use for the font defined by the @font-face at-rule. You can further use this descriptor to control typographic font features such as ligatures, small caps, and swashes, for the font defined by @font-face. The values for this descriptor are the same as the font-feature-settings property, except for the global keyword values.\n

Since this descriptor sets feature values on the font object in the @font-face at-rule and not on an entire element, only some glyphs in an element may be rendered using this descriptor.", - "formalSyntax": "normal | <feature-tag-value>#\n  <feature-tag-value> = <opentype-tag> [ <integer [0,∞]> | on | off ]?\n  <opentype-tag> = <string>", + "doc": "The font-feature-settings CSS descriptor allows you to define the initial settings to use for the font defined by the @font-face at-rule. You can further use this descriptor to control typographic font features such as ligatures, small caps, and swashes, for the font defined by @font-face. The values for this descriptor are the same as the font-feature-settings property, except for the global keyword values.\n

Since this descriptor sets feature values on the font object in the @font-face at-rule and not on an entire element, only some glyphs in an element may be rendered using this descriptor.", + "formalSyntax": "normal | <feature-tag-value>#\n  <feature-tag-value> = <opentype-tag> [ <integer [0,∞]> | on | off ]?\n  <opentype-tag> = <string>\n  <integer> = <number-token>", "values": { "normal": "Indicates that text is laid out using default font settings. This is the default value.", - "<feature-tag-value>": "Represents a space-separated tuple consisting of a tag name and an optional value.\n

The tag name is always a <string> of four ASCII characters. If the tag name has more or fewer characters or if it contains characters outside the U+20 – U+7E code point range, the descriptor is invalid.\n

The optional value can be a positive integer or the keyword on or off. The keywords on and off are synonyms for the values 1 and 0, respectively. If no value is set, the default is 1. For non-boolean OpenType features (e.g., stylistic alternates), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off." + "<feature-tag-value>": "Represents a space-separated tuple consisting of a tag name and an optional value.\n

The tag name is always a <string> of four ASCII characters. If the tag name has more or fewer characters or if it contains characters outside the U+20 – U+7E code point range, the descriptor is invalid.\n

The optional value can be a positive integer or the keyword on or off. The keywords on and off are synonyms for the values 1 and 0, respectively. If no value is set, the default is 1. For non-boolean OpenType features (e.g., stylistic alternates), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off." } }, "font-stretch": { - "url": "$MDN_URL$/web/css/@font-face/font-stretch", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-stretch", "status": [ - "StandardTrack", - "Deprecated" + "StandardTrack" ], "compatibility": { "Chrome": "62", @@ -510,17 +522,22 @@ "Safari": "10.1", "SafariIOS": "10.3" }, - "doc": "

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.

\n

The font-stretch CSS descriptor allows authors to specify a normal, condensed, or expanded face for the fonts specified in the @font-face at-rule.\n

For a particular font family, authors can download various font faces which correspond to the different styles of the same font family, and then use the font-stretch descriptor to explicitly specify the font face's stretch. The values for the CSS descriptor is same as that of its corresponding font property.", + "baseline": { + "level": "HIGH", + "lowDate": "2018-09-05", + "highDate": "2021-03-05" + }, + "doc": "

\n

Note:\nThe font-stretch descriptor was renamed to font-width in the CSS Fonts specification. To preserve compatibility, the specification retains font-stretch as an alias for the font-width descriptor.\n

\n

The font-stretch CSS descriptor allows authors to specify a normal, condensed, or expanded face for the fonts specified in the @font-face at-rule.\n

For a particular font family, authors can download various font faces which correspond to the different styles of the same font family, and then use the font-stretch descriptor to explicitly specify the font face's stretch. The values for the CSS descriptor is same as that of its corresponding font property.", "formalSyntax": "auto | <'font-width'>{1,2}\n  <font-width> = normal | <percentage [0,∞]> | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded", "values": { "normal": "Specifies a normal font face.", "semi-condensed
\ncondensed
\nextra-condensed
\nultra-condensed": "Specifies a more condensed font face than normal, with ultra-condensed as the most condensed.", "semi-expanded
\nexpanded
\nextra-expanded
\nultra-expanded": "Specifies a more expanded font face than normal, with ultra-expanded as the most expanded.", - "<percentage>": "A <percentage> value between 50% and 200% (inclusive). Negative values are not allowed for this property." + "<percentage>": "A <percentage> value between 50% and 200% (inclusive). Negative values are not allowed for this property." } }, "font-style": { - "url": "$MDN_URL$/web/css/@font-face/font-style", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-style", "status": [ "StandardTrack" ], @@ -539,7 +556,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-style CSS descriptor allows authors to specify font styles for the fonts specified in the @font-face at-rule.\n

For a particular font family, authors can download various font faces that correspond to the different styles of the same font family and then use the font-style descriptor to explicitly specify the font face's style. The values for this CSS descriptor are the same as that of the corresponding font-style property.", + "doc": "The font-style CSS descriptor allows authors to specify font styles for the fonts specified in the @font-face at-rule.\n

For a particular font family, authors can download various font faces that correspond to the different styles of the same font family and then use the font-style descriptor to explicitly specify the font face's style. The values for this CSS descriptor are the same as that of the corresponding font-style property.", "formalSyntax": "auto | normal | italic | left | right | oblique [ <angle [-90deg,90deg]>{1,2} ]?", "values": { "normal": "Selects the normal version of the font-family.", @@ -550,7 +567,7 @@ } }, "font-variation-settings": { - "url": "$MDN_URL$/web/css/@font-face/font-variation-settings", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-variation-settings", "status": [ "StandardTrack" ], @@ -565,15 +582,15 @@ "baseline": { "level": "NONE" }, - "doc": "The font-variation-settings CSS descriptor allows authors to specify low-level OpenType or TrueType font variations in the @font-face at-rule. The values for this descriptor are the same as the font-variation-settings property, except for the global keyword values.\n

Since this descriptor sets variation values on the font object in the @font-face at-rule and not on an entire element, only some glyphs in an element may be rendered using this descriptor.", + "doc": "The font-variation-settings CSS descriptor allows authors to specify low-level OpenType or TrueType font variations in the @font-face at-rule. The values for this descriptor are the same as the font-variation-settings property, except for the global keyword values.\n

Since this descriptor sets variation values on the font object in the @font-face at-rule and not on an entire element, only some glyphs in an element may be rendered using this descriptor.", "formalSyntax": "normal | [ <string> <number> ]#", "values": { "normal": "Text is laid out using default settings.", - "<string> <number>": "When rendering text, the list of OpenType axis names is passed to the text layout engine to enable or disable font features. Each setting is always a <string> of 4 ASCII characters, followed by a <number> indicating the axis value. If the <string> has more or fewer characters or contains characters outside the U+20 - U+7E code point range, the whole property is invalid. The <number> can be fractional or negative." + "<string> <number>": "When rendering text, the list of OpenType axis names is passed to the text layout engine to enable or disable font features. Each setting is always a <string> of 4 ASCII characters, followed by a <number> indicating the axis value. If the <string> has more or fewer characters or contains characters outside the U+20 - U+7E code point range, the whole property is invalid. The <number> can be fractional or negative." } }, "font-weight": { - "url": "$MDN_URL$/web/css/@font-face/font-weight", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/font-weight", "status": [ "StandardTrack" ], @@ -592,16 +609,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-weight CSS @font-face descriptor enables authors to specify a single font weight, or a range of font weights, for the font specified in a @font-face at-rule. This is then used by the browser to select the appropriate font when a CSS rule sets a desired font weight.\n

Typically, a developer will want to use fonts from a single font family in a range of different weights. With traditional, or static fonts, a single font file contains characters from a font family in a specific weight and style: for example, \"Helvetica bold italic\". To enable displaying light, regular, bold, or extra-bold fonts when the font-weight property calls a specific weight, you can define multiple @font-face at-rules for the same family (all with the same font-family descriptor value), one for each weight or range of weights.\n

To declare the font to be used for a range of font weights, declare a space-separated pair of font-weight values as the value for the font-weight descriptor. When CSS rules set a font weight by setting the font-weight property or the font shorthand property, the appropriate font will then be used.\n

For example, if the descriptor is font-weight: 400 600;, when the property is font-weight: 450 or font-weight: 550, that font will be use for that font-family.\nWhether the font is a static or a variable font, the font matching the range will be used. In this case, if the font is a static font, 450 and 550 will appear the same. If the font is a variable font, the latter will be bolder.\n

The descriptor is the same for all fonts, but the range you'll set for a variable font will generally be greater, possibly even 1 1000 to use the same font for all font weight property values.", + "doc": "The font-weight CSS @font-face descriptor enables authors to specify a single font weight, or a range of font weights, for the font specified in a @font-face at-rule. This is then used by the browser to select the appropriate font when a CSS rule sets a desired font weight.\n

Typically, a developer will want to use fonts from a single font family in a range of different weights. With traditional, or static fonts, a single font file contains characters from a font family in a specific weight and style: for example, \"Helvetica bold italic\". To enable displaying light, regular, bold, or extra-bold fonts when the font-weight property calls a specific weight, you can define multiple @font-face at-rules for the same family (all with the same font-family descriptor value), one for each weight or range of weights.\n

To declare the font to be used for a range of font weights, declare a space-separated pair of font-weight values as the value for the font-weight descriptor. When CSS rules set a font weight by setting the font-weight property or the font shorthand property, the appropriate font will then be used.\n

For example, if the descriptor is font-weight: 400 600;, when the property is font-weight: 450 or font-weight: 550, that font will be use for that font-family.\nWhether the font is a static or a variable font, the font matching the range will be used. In this case, if the font is a static font, 450 and 550 will appear the same. If the font is a variable font, the latter will be bolder.\n

The descriptor is the same for all fonts, but the range you'll set for a variable font will generally be greater, possibly even 1 1000 to use the same font for all font weight property values.", "formalSyntax": "auto | <font-weight-absolute>{1,2}\n  <font-weight-absolute> = normal | bold | <number [1,1000]>", "values": { "normal": "Normal font weight. Same as 400.", "bold": "Bold font weight. Same as 700.", - "<number>": "A <number> value between 1 and 1000, inclusive. Higher numbers represent weights that are bolder than (or as bold as) lower numbers. Certain commonly used values correspond to common weight names, as described in the Common weight name mapping section below." + "<number>": "A <number> value between 1 and 1000, inclusive. Higher numbers represent weights that are bolder than (or as bold as) lower numbers. Certain commonly used values correspond to common weight names, as described in the Common weight name mapping section below." } }, "line-gap-override": { - "url": "$MDN_URL$/web/css/@font-face/line-gap-override", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/line-gap-override", "status": [ "StandardTrack" ], @@ -616,15 +633,15 @@ "baseline": { "level": "NONE" }, - "doc": "The line-gap-override CSS descriptor for the @font-face at-rule defines the line-gap metric for the font. The line-gap metric is the font recommended line-gap or external leading.", + "doc": "The line-gap-override CSS descriptor for the @font-face at-rule defines the line-gap metric for the font. The line-gap metric is the font recommended line-gap or external leading.", "formalSyntax": "normal | <percentage [0,∞]>", "values": { "normal": "The default value. When used the metric value is obtained from the font file.", - "<percentage>": "A <percentage> value." + "<percentage>": "A <percentage> value." } }, "size-adjust": { - "url": "$MDN_URL$/web/css/@font-face/size-adjust", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/size-adjust", "status": [ "StandardTrack" ], @@ -642,14 +659,14 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The size-adjust CSS descriptor for the @font-face at-rule defines a multiplier for glyph outlines and metrics associated with this font. This makes it easier to harmonize the designs of various fonts when rendered at the same font size.\n

The size-adjust descriptor behaves in a similar fashion to the font-size-adjust property. It calculates an adjustment per font by matching ex heights.", + "doc": "The size-adjust CSS descriptor for the @font-face at-rule defines a multiplier for glyph outlines and metrics associated with this font. This makes it easier to harmonize the designs of various fonts when rendered at the same font size.\n

The size-adjust descriptor behaves in a similar fashion to the font-size-adjust property. It calculates an adjustment per font by matching ex heights.", "formalSyntax": "<percentage [0,∞]>", "values": { - "<percentage>": "A <percentage> value with an initial value of 100%." + "<percentage>": "A <percentage> value with an initial value of 100%." } }, "src": { - "url": "$MDN_URL$/web/css/@font-face/src", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/src", "status": [ "StandardTrack" ], @@ -668,10 +685,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The src CSS descriptor for the @font-face at-rule specifies the resource containing font data. It is required for the @font-face rule to be valid.", + "doc": "The src CSS descriptor for the @font-face at-rule specifies the resource containing font data. It is required for the @font-face rule to be valid.", "formalSyntax": "<font-src-list>", "values": { - "url()": "Specifies an external reference consisting of a <url>, followed by optional hints using the format() and tech() component values that specify the format and font technology of the resource referenced by the URL. The format() and tech() components are a comma-separated list of strings of known font formats and technologies. If a user agent doesn't support the font technology or formats, it skips downloading the font resource. If no format or technology hints are supplied, the font resource is always downloaded.", + "url()": "Specifies an external reference consisting of a <url>, followed by optional hints using the format() and tech() component values that specify the format and font technology of the resource referenced by the URL. The format() and tech() components are a comma-separated list of strings of known font formats and technologies. If a user agent doesn't support the font technology or formats, it skips downloading the font resource. If no format or technology hints are supplied, the font resource is always downloaded.", "format()": "An optional declaration that follows the url() value that provides a hint for the user agent on the font format.\nIf the value is not supported or invalid, the browser may not download the resource, potentially saving bandwidth.\nIf omitted, the browser will download the resource and then detect the format.\nIf including a font source for backward-compatibility that is not in the list of defined keywords, enclose the format string in quotes.\nPossible values are described in the Font formats section below.", "tech()": "An optional declaration that follows the url() value that provides a hint for the user agent on the font technology.\nThe value for tech() may be one of the keywords described in Font technologies.", "local(<font-face-name>)": "Specifies the font name should the font be available on the user's device.\nEnclosing the font name in quotes is optional.\n

\n

Note:\nFor OpenType and TrueType fonts, <font-face-name> is used to match either the Postscript name or the full font name in the name table of locally available fonts. Which type of name is used varies by platform and font, so you should include both of these names to assure proper matching across platforms. Platform substitutions for a given font name must not be used.\n

\n
\n

Note:\nLocally available fonts may have been preinstalled on the user's device, or may have been actively installed by the user.\n

While the set of preinstalled fonts is likely to be the same for all users of a particular device, the set of user-installed fonts is not. By discovering the set of user-installed fonts, a site can therefore build a fingerprint for the device, helping the site to track users across the web.\n

To prevent this, user agents may ignore user-installed fonts when using local().\n

", @@ -679,7 +696,7 @@ } }, "unicode-range": { - "url": "$MDN_URL$/web/css/@font-face/unicode-range", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-face/unicode-range", "status": [ "StandardTrack" ], @@ -698,7 +715,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The unicode-range CSS descriptor sets the specific range of characters to be used from a font defined using the @font-face at-rule and made available for use on the current page. If the page doesn't use any character in this range, the font is not downloaded; if it uses at least one, the whole font is downloaded.", + "doc": "The unicode-range CSS descriptor sets the specific range of characters to be used from a font defined using the @font-face at-rule and made available for use on the current page. If the page doesn't use any character in this range, the font is not downloaded; if it uses at least one, the whole font is downloaded.", "formalSyntax": "<unicode-range-token>#", "values": { "single code point": "A single Unicode character code point, for example U+26.", @@ -707,7 +724,7 @@ } }, "woff": { - "url": "$MDN_URL$/web/css/css_fonts/woff", + "url": "$MDN_URL$/web/css/guides/fonts/woff", "status": [ "StandardTrack" ], @@ -733,13 +750,13 @@ "SafariIOS": "10" } }, - "doc": "WOFF (the Web Open Font Format) is a web font format developed by Mozilla in concert with Type Supply, LettError, and other organizations. It uses a compressed version of the same table-based sfnt structure used by TrueType, OpenType, and Open Font Format, but adds metadata and private-use data structures, including predefined fields allowing foundries and vendors to provide license information if desired.\n

There are three main benefits to using WOFF:\n

    \n
  1. The font data is compressed, so sites using WOFF will use less bandwidth and will load faster than if they used equivalent uncompressed TrueType or OpenType files.
  2. \n
  3. Many font vendors that are unwilling to license their TrueType or OpenType format fonts for use on the web will license WOFF format fonts. This improves availability of fonts to site designers.
  4. \n
  5. Both proprietary and free software browser vendors like the WOFF format, so it has the potential of becoming a truly universal, interoperable font format for the web, unlike other current font formats.
  6. \n
\n

There are two versions of WOFF: WOFF and WOFF2. They mostly differ in regard to the compression algorithm used. In @font-face they are identified by the 'woff' and 'woff2' format descriptor respectively." + "doc": "WOFF (the Web Open Font Format) is a web font format developed by Mozilla in concert with Type Supply, LettError, and other organizations. It uses a compressed version of the same table-based sfnt structure used by TrueType, OpenType, and Open Font Format, but adds metadata and private-use data structures, including predefined fields allowing foundries and vendors to provide license information if desired.\n

There are three main benefits to using WOFF:\n

    \n
  1. The font data is compressed, so sites using WOFF will use less bandwidth and will load faster than if they used equivalent uncompressed TrueType or OpenType files.
  2. \n
  3. Many font vendors that are unwilling to license their TrueType or OpenType format fonts for use on the web will license WOFF format fonts. This improves availability of fonts to site designers.
  4. \n
  5. Both proprietary and free software browser vendors like the WOFF format, so it has the potential of becoming a truly universal, interoperable font format for the web, unlike other current font formats.
  6. \n
\n

There are two versions of WOFF: WOFF and WOFF2. They mostly differ in regard to the compression algorithm used. In @font-face they are identified by the 'woff' and 'woff2' format descriptor respectively." } }, "formalSyntax": "@font-face { <declaration-list> }" }, "font-feature-values": { - "url": "$MDN_URL$/web/css/@font-feature-values", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-feature-values", "status": [ "StandardTrack" ], @@ -758,11 +775,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The @font-feature-values CSS at-rule lets you use a common name in the font-variant-alternates property for features activated differently in OpenType. This can help simplify your CSS when using multiple fonts.\n

The @font-feature-values at-rule may be used either at the top level of your CSS or inside any CSS conditional-group at-rule.", + "doc": "The @font-feature-values CSS at-rule lets you use a common name in the font-variant-alternates property for features activated differently in OpenType. This can help simplify your CSS when using multiple fonts.\n

The @font-feature-values at-rule may be used either at the top level of your CSS or inside any CSS conditional-group at-rule.", "properties": { "font-display": { - "url": "$MDN_URL$/web/css/@font-feature-values/font-display", - "doc": "The font-display descriptor for the @font-feature-values at-rule sets the default value of how a font face is displayed based on whether and when it is downloaded. Setting a value for the font-display descriptor within a @font-feature-values block sets the default value of the font-display descriptor for the @font-face at-rule for all the fonts with the same font-family value.", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-feature-values/font-display", + "doc": "The font-display descriptor for the @font-feature-values at-rule sets the default value of how a font face is displayed based on whether and when it is downloaded. Setting a value for the font-display descriptor within a @font-feature-values block sets the default value of the font-display descriptor for the @font-face at-rule for all the fonts with the same font-family value.", "values": { "auto": "The font display strategy is defined by the user agent.", "block": "Gives the font face a short block period, generally around 3 seconds, and an infinite swap period.", @@ -775,7 +792,7 @@ "formalSyntax": "@font-feature-values <family-name># { <declaration-rule-list> }\n  <family-name> = <string> | <custom-ident>+" }, "font-palette-values": { - "url": "$MDN_URL$/web/css/@font-palette-values", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-palette-values", "status": [ "StandardTrack" ], @@ -794,10 +811,10 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The @font-palette-values CSS at-rule allows you to customize the default values of font-palette created by the font-maker.", + "doc": "The @font-palette-values CSS at-rule allows you to customize the default values of font-palette created by the font-maker.", "properties": { "base-palette": { - "url": "$MDN_URL$/web/css/@font-palette-values/base-palette", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-palette-values/base-palette", "status": [ "StandardTrack" ], @@ -817,13 +834,13 @@ "highDate": "2025-05-15" }, "doc": "The base-palette CSS descriptor is used to specify the name or index of a pre-defined palette to be used for creating a new palette. If the specified base-palette does not exist, then the palette defined at index 0 will be used.", - "formalSyntax": "light | dark | <integer [0,∞]>", + "formalSyntax": "light | dark | <integer [0,∞]>\n  <integer> = <number-token>", "values": { "<index>": "Specifies the index of the pre-defined palette to use." } }, "font-family": { - "url": "$MDN_URL$/web/css/@font-palette-values/font-family", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-palette-values/font-family", "status": [ "StandardTrack" ], @@ -842,14 +859,14 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The @font-palette-values descriptor font-family is used to specify which font-family palette values are to be applied to. This need to match exactly the values used when setting the CSS font-family.", + "doc": "The @font-palette-values descriptor font-family is used to specify which font-family palette values are to be applied to. This need to match exactly the values used when setting the CSS font-family.", "formalSyntax": "<family-name>#\n  <family-name> = <string> | <custom-ident>+", "values": { - "<family-name>": "Specifies the name of the font-family." + "<family-name>": "Specifies the name of the font-family." } }, "override-colors": { - "url": "$MDN_URL$/web/css/@font-palette-values/override-colors", + "url": "$MDN_URL$/web/css/reference/at-rules/@font-palette-values/override-colors", "status": [ "StandardTrack" ], @@ -868,17 +885,17 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The override-colors CSS descriptor is used to override colors in the chosen base-palette for a color font.", - "formalSyntax": "[ <integer [0,∞]> <color> ]#", + "doc": "The override-colors CSS descriptor is used to override colors in the chosen base-palette for a color font.", + "formalSyntax": "[ <integer [0,∞]> <color> ]#\n  <integer> = <number-token>", "values": { - "[ <integer [0,∞]> <absolute-color-base> ]": "Specifies the index of a color in a base-palette and the color to overwrite it with." + "[ <integer [0,∞]> <absolute-color-base> ]": "Specifies the index of a color in a base-palette and the color to overwrite it with." } } }, "formalSyntax": "@font-palette-values <dashed-ident> { <declaration-list> }" }, "function": { - "url": "$MDN_URL$/web/css/@function", + "url": "$MDN_URL$/web/css/reference/at-rules/@function", "status": [ "Experimental", "StandardTrack" @@ -892,11 +909,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The @function CSS at-rule enables defining CSS custom functions. Once defined, a custom function can be called using the <dashed-function> syntax (for example, --my-function(30px, 3)) within any property value.", + "doc": "

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

\n

The @function CSS at-rule enables defining CSS custom functions. Once defined, a custom function can be called using the <dashed-function> syntax (for example, --my-function(30px, 3)) within any property value.", "formalSyntax": "@function <function-token> <function-parameter>#? ) [ returns <css-type> ]? { <declaration-rule-list> }\n  <function-parameter> = <custom-property-name> <css-type>? [ : <default-value> ]?\n  <css-type> = <syntax-component> | <type()>\n  <default-value> = <declaration-value>\n  <syntax-component> = <syntax-single-component> <syntax-multiplier>? | '<' transform-list '>'\n  <type()> = type( <string> )\n  <syntax-single-component> = '<' <syntax-type-name> '>' | <ident>\n  <syntax-multiplier> = '#' | '+'\n  <syntax-type-name> = angle | color | custom-ident | image | integer | length | length-percentage | number | percentage | resolution | string | time | url | transform-function" }, "import": { - "url": "$MDN_URL$/web/css/@import", + "url": "$MDN_URL$/web/css/reference/at-rules/@import", "status": [ "StandardTrack" ], @@ -915,10 +932,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The @import CSS at-rule is used to import style rules from other valid stylesheets.\nAn @import rule must be defined at the top of the stylesheet, before any other at-rule (except @charset and @layer) and style declarations, or it will be ignored.", + "doc": "The @import CSS at-rule is used to import style rules from other valid stylesheets.\nAn @import rule must be defined at the top of the stylesheet, before any other at-rule (except @charset and @layer) and style declarations, or it will be ignored.", "properties": { "layer_function": { - "url": "$MDN_URL$/web/css/@import/layer_function", + "url": "$MDN_URL$/web/css/reference/at-rules/@import/layer_function", "status": [ "StandardTrack" ], @@ -937,14 +954,14 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The layer() CSS function is used along with the @import at-rule to put the imported resource in a separate named cascade layer.", + "doc": "The layer() CSS function is used along with the @import at-rule to put the imported resource in a separate named cascade layer.", "formalSyntax": "layer( <layer-name> )\n  <layer-name> = <ident> [ '.' <ident> ]*" } }, "formalSyntax": "@import [ <url> | <string> ] [ layer | layer( <layer-name> ) ]? <import-conditions> ;\n  <url> = <url()> | <src()>\n  <layer-name> = <ident> [ '.' <ident> ]*\n  <import-conditions> = [ supports( [ <supports-condition> | <declaration> ] ) ]? <media-query-list>?\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <supports-condition> = not <supports-in-parens> | <supports-in-parens> [ and <supports-in-parens> ]* | <supports-in-parens> [ or <supports-in-parens> ]*\n  <supports-in-parens> = ( <supports-condition> ) | <supports-feature> | <general-enclosed>\n  <supports-feature> = <supports-decl>\n  <general-enclosed> = [ <function-token> <any-value>? ) ] | [ ( <any-value>? ) ]\n  <supports-decl> = ( <declaration> )" }, "keyframes": { - "url": "$MDN_URL$/web/css/@keyframes", + "url": "$MDN_URL$/web/css/reference/at-rules/@keyframes", "status": [ "StandardTrack" ], @@ -963,11 +980,11 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The @keyframes CSS at-rule controls the intermediate steps in a CSS animation sequence by defining styles for keyframes (or waypoints) along the animation sequence. This gives more control over the intermediate steps of the animation sequence than transitions.", + "doc": "The @keyframes CSS at-rule controls the intermediate steps in a CSS animation sequence by defining styles for keyframes (or waypoints) along the animation sequence. This gives more control over the intermediate steps of the animation sequence than transitions.", "formalSyntax": "@keyframes <keyframes-name> { <qualified-rule-list> }\n  <keyframes-name> = <custom-ident> | <string>" }, "layer": { - "url": "$MDN_URL$/web/css/@layer", + "url": "$MDN_URL$/web/css/reference/at-rules/@layer", "status": [ "StandardTrack" ], @@ -986,11 +1003,11 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The @layer CSS at-rule is used to declare a cascade layer and can also be used to define the order of precedence in case of multiple cascade layers.", + "doc": "The @layer CSS at-rule is used to declare a cascade layer and can also be used to define the order of precedence in case of multiple cascade layers.", "formalSyntax": "@layer <layer-name>? { <rule-list> } | @layer <layer-name># ;\n  <layer-name> = <ident> [ '.' <ident> ]*" }, "media": { - "url": "$MDN_URL$/web/css/@media", + "url": "$MDN_URL$/web/css/reference/at-rules/@media", "status": [ "StandardTrack" ], @@ -1009,10 +1026,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. With it, you specify a media query and a block of CSS to apply to the document if and only if the media query matches the device on which the content is being used.\n

\n

Note:\nIn JavaScript, the rules created using @media can be accessed with the CSSMediaRule CSS object model interface.\n

", + "doc": "The @media CSS at-rule can be used to apply part of a style sheet based on the result of one or more media queries. With it, you specify a media query and a block of CSS to apply to the document if and only if the media query matches the device on which the content is being used.\n
\n

Note:\nIn JavaScript, the rules created using @media can be accessed with the CSSMediaRule CSS object model interface.\n

", "properties": { "-moz-device-pixel-ratio": { - "url": "$MDN_URL$/web/css/@media/-moz-device-pixel-ratio", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-moz-device-pixel-ratio", "status": [ "Deprecated" ], @@ -1020,10 +1037,10 @@ "Firefox": "4", "FirefoxAndroid": "4" }, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n

The -moz-device-pixel-ratio Gecko-only CSS media feature can be used to apply styles based on the number of device pixels per CSS pixel.\n

\n

Warning:\nDo not use this feature. Use the resolution feature with the dppx unit instead.\n

\n
\n

Note:\nThis media feature is also implemented by WebKit as -webkit-device-pixel-ratio. The min and max prefixes as implemented by Gecko are named min--moz-device-pixel-ratio and max--moz-device-pixel-ratio; but the same prefixes as implemented by WebKit are named -webkit-min-device-pixel-ratio and -webkit-max-device-pixel-ratio.\n

" + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n

The -moz-device-pixel-ratio Gecko-only CSS media feature can be used to apply styles based on the number of device pixels per CSS pixel.\n

\n

Warning:\nDo not use this feature. Use the resolution feature with the dppx unit instead.\n

\n
\n

Note:\nThis media feature is also implemented by WebKit as -webkit-device-pixel-ratio. The min and max prefixes as implemented by Gecko are named min--moz-device-pixel-ratio and max--moz-device-pixel-ratio; but the same prefixes as implemented by WebKit are named -webkit-min-device-pixel-ratio and -webkit-max-device-pixel-ratio.\n

" }, "-webkit-animation": { - "url": "$MDN_URL$/web/css/@media/-webkit-animation", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-webkit-animation", "status": [ "Deprecated" ], @@ -1031,14 +1048,14 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Note:\nAll browsers support the animation property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers supports the -webkit-animation media feature. No browsers support animation, without the prefix, as a media query. Use the @supports (animation) feature query instead.\n

\n

The -webkit-animation Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS animations are supported.\n

Apple has a description in Safari CSS Reference.\n

\n

Note:\nThis media feature is only supported by WebKit. If possible, use an @supports feature query instead.\n

", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Note:\nAll browsers support the animation property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers supports the -webkit-animation media feature. No browsers support animation, without the prefix, as a media query. Use the @supports (animation) feature query instead.\n

\n

The -webkit-animation Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS animations are supported.\n

Apple has a description in Safari CSS Reference.\n

\n

Note:\nThis media feature is only supported by WebKit. If possible, use an @supports feature query instead.\n

", "values": { - "true": "The browser supports -webkit prefixed CSS animation.", + "true": "The browser supports -webkit prefixed CSS animation.", "false": "The browser doesn't support these prefixed CSS animations." } }, "-webkit-device-pixel-ratio": { - "url": "$MDN_URL$/web/css/@media/-webkit-device-pixel-ratio", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-webkit-device-pixel-ratio", "status": [ "StandardTrack" ], @@ -1057,25 +1074,25 @@ "lowDate": "2018-10-23", "highDate": "2021-04-23" }, - "doc": "The -webkit-device-pixel-ratio is a non-standard Boolean CSS media feature which is an alternative to the standard resolution media feature.\n
\n

Note:\nIf possible, use the resolution media feature query instead, which is a standard media feature. While this prefixed media feature is a WebKit feature, other browser engines may support it. See browser compatibility below.\n

", + "doc": "The -webkit-device-pixel-ratio is a non-standard Boolean CSS media feature which is an alternative to the standard resolution media feature.\n
\n

Note:\nIf possible, use the resolution media feature query instead, which is a standard media feature. While this prefixed media feature is a WebKit feature, other browser engines may support it. See browser compatibility below.\n

", "values": { - "<number>": "The number of device pixels used to represent each CSS px. Although the value is a <number>, and thus doesn't syntactically allow units, its implicit unit is dppx." + "<number>": "The number of device pixels used to represent each CSS px. Although the value is a <number>, and thus doesn't syntactically allow units, its implicit unit is dppx." } }, "-webkit-transform-2d": { - "url": "$MDN_URL$/web/css/@media/-webkit-transform-2d", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-webkit-transform-2d", "compatibility": { "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n
\n

Note:\nAll browsers support the transform property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers supports the -webkit-transform-2d media feature. No browsers support transform, without the prefix or 2d extension, as a media query. Use the @supports (transform) feature query instead.\n

\n

The -webkit-transform-2d Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS 2D transforms and non-standard vendor-prefixed media queries are supported.\n

Apple has a description in Safari CSS Reference.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n
\n

Note:\nAll browsers support the transform property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers supports the -webkit-transform-2d media feature. No browsers support transform, without the prefix or 2d extension, as a media query. Use the @supports (transform) feature query instead.\n

\n

The -webkit-transform-2d Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS 2D transforms and non-standard vendor-prefixed media queries are supported.\n

Apple has a description in Safari CSS Reference.", "values": { "true": "The browser supports the 2D CSS transforms with the -webkit prefix.", "false": "The 2D CSS transforms prefixed with -webkit are not supported by the browser." } }, "-webkit-transform-3d": { - "url": "$MDN_URL$/web/css/@media/-webkit-transform-3d", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-webkit-transform-3d", "status": [ "StandardTrack" ], @@ -1094,14 +1111,14 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The -webkit-transform-3d Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS 3D transforms are supported.\n

\n

Note:\nWhile this media feature is currently supported by most browsers. If possible, use an @supports feature query instead.\n

", + "doc": "The -webkit-transform-3d Boolean CSS media feature is a WebKit extension whose value is true if vendor-prefixed CSS 3D transforms are supported.\n
\n

Note:\nWhile this media feature is currently supported by most browsers. If possible, use an @supports feature query instead.\n

", "values": { "true": "The browser supports the 3D CSS transforms with the -webkit prefix and supports non-standard, prefixed media queries.", "false": "The 3D CSS transforms prefixed with -webkit are not supported by the browser." } }, "-webkit-transition": { - "url": "$MDN_URL$/web/css/@media/-webkit-transition", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/-webkit-transition", "status": [ "Deprecated" ], @@ -1109,10 +1126,10 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

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.

\n

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n
\n

Note:\nAll browsers support the transition property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers support the -webkit-transition media feature. No browsers support transition without the prefix as a media query (though some browsers do support - -webkit-transform-3d). Use the @supports (transition) feature query instead.\n

\n

The -webkit-transition Boolean non-standard CSS media feature is a WebKit extension whose value is true if the browsing context supports CSS transitions.\n

Apple has a description in Safari CSS Reference; this is now called transition there.\n

\n

Note:\nYou should not use this media feature; it was never specified, has never been widely implemented, and has been removed from most browsers. Use a @supports feature query instead.\n

" + "doc": "

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.

\n

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n
\n

Note:\nAll browsers support the transition property without vendor prefixes. Only WebKit (Safari), and not Chromium, based browsers support the -webkit-transition media feature. No browsers support transition without the prefix as a media query (though some browsers do support - -webkit-transform-3d). Use the @supports (transition) feature query instead.\n

\n

The -webkit-transition Boolean non-standard CSS media feature is a WebKit extension whose value is true if the browsing context supports CSS transitions.\n

Apple has a description in Safari CSS Reference; this is now called transition there.\n

\n

Note:\nYou should not use this media feature; it was never specified, has never been widely implemented, and has been removed from most browsers. Use a @supports feature query instead.\n

" }, "any-hover": { - "url": "$MDN_URL$/web/css/@media/any-hover", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/any-hover", "status": [ "StandardTrack" ], @@ -1131,10 +1148,10 @@ "lowDate": "2018-12-11", "highDate": "2021-06-11" }, - "doc": "The any-hover CSS media feature can be used to test whether any available input mechanism can hover over elements." + "doc": "The any-hover CSS media feature can be used to test whether any available input mechanism can hover over elements." }, "any-pointer": { - "url": "$MDN_URL$/web/css/@media/any-pointer", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/any-pointer", "status": [ "StandardTrack" ], @@ -1153,10 +1170,10 @@ "lowDate": "2018-12-11", "highDate": "2021-06-11" }, - "doc": "The any-pointer CSS media feature tests whether the user has any pointing device (such as a mouse), and if so, how accurate it is.\n
\n

Note:\nIf you want to test the accuracy of the primary pointing device, use pointer instead.\n

" + "doc": "The any-pointer CSS media feature tests whether the user has any pointing device (such as a mouse), and if so, how accurate it is.\n
\n

Note:\nIf you want to test the accuracy of the primary pointing device, use pointer instead.\n

" }, "aspect-ratio": { - "url": "$MDN_URL$/web/css/@media/aspect-ratio", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/aspect-ratio", "status": [ "StandardTrack" ], @@ -1175,10 +1192,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The aspect-ratio CSS media feature can be used to test the aspect ratio of the viewport." + "doc": "The aspect-ratio CSS media feature can be used to test the aspect ratio of the viewport." }, "calc": { - "url": "$MDN_URL$/web/css/calc", + "url": "$MDN_URL$/web/css/reference/values/calc", "status": [ "StandardTrack" ], @@ -1197,11 +1214,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used with <length>, <frequency>, <angle>, <time>, <percentage>, <number>, <integer>, and <color-function> values.", + "doc": "The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used with <length>, <frequency>, <angle>, <time>, <percentage>, <number>, <integer>, and <color-function> values.", "formalSyntax": "calc( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "color": { - "url": "$MDN_URL$/web/css/@media/color", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/color", "status": [ "StandardTrack" ], @@ -1220,10 +1237,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The color CSS media feature can be used to test the number of bits per color component (red, green, blue) of the output device." + "doc": "The color CSS media feature can be used to test the number of bits per color component (red, green, blue) of the output device." }, "color-gamut": { - "url": "$MDN_URL$/web/css/@media/color-gamut", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/color-gamut", "status": [ "StandardTrack" ], @@ -1242,10 +1259,10 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The color-gamut CSS media feature is used to apply CSS styles based on the approximate range of color gamut supported by the user agent and the output device." + "doc": "The color-gamut CSS media feature is used to apply CSS styles based on the approximate range of color gamut supported by the user agent and the output device." }, "color-index": { - "url": "$MDN_URL$/web/css/@media/color-index", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/color-index", "status": [ "StandardTrack" ], @@ -1260,10 +1277,10 @@ "baseline": { "level": "NONE" }, - "doc": "The color-index CSS media feature can be used to test the number of entries in the output device's color lookup table." + "doc": "The color-index CSS media feature can be used to test the number of entries in the output device's color lookup table." }, "device-aspect-ratio": { - "url": "$MDN_URL$/web/css/@media/device-aspect-ratio", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/device-aspect-ratio", "status": [ "StandardTrack", "Deprecated" @@ -1278,10 +1295,10 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

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.

\n
\n

Note:\nTo query for the aspect ratio of the viewport, developers should use the aspect-ratio media feature instead.\n

\n

The device-aspect-ratio CSS media feature can be used to test the width-to-height aspect ratio of an output device." + "doc": "

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.

\n
\n

Note:\nTo query for the aspect ratio of the viewport, developers should use the aspect-ratio media feature instead.\n

\n

The device-aspect-ratio CSS media feature can be used to test the width-to-height aspect ratio of an output device." }, "device-height": { - "url": "$MDN_URL$/web/css/@media/device-height", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/device-height", "status": [ "StandardTrack", "Deprecated" @@ -1296,10 +1313,10 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

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.

\n
\n

Note:\nTo query for the height of the viewport, developers should use the height media feature instead.\n

\n

The device-height CSS media feature can be used to test the height of an output device's rendering surface." + "doc": "

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.

\n
\n

Note:\nTo query for the height of the viewport, developers should use the height media feature instead.\n

\n

The device-height CSS media feature can be used to test the height of an output device's rendering surface." }, "device-posture": { - "url": "$MDN_URL$/web/css/@media/device-posture", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/device-posture", "status": [ "Experimental", "StandardTrack" @@ -1313,10 +1330,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The device-posture CSS media feature can be used to detect the device's current posture, that is, whether the viewport is in a flat (continuous) or folded state (folded)." + "doc": "

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

\n

The device-posture CSS media feature can be used to detect the device's current posture, that is, whether the viewport is in a flat (continuous) or folded state (folded)." }, "device-width": { - "url": "$MDN_URL$/web/css/@media/device-width", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/device-width", "status": [ "StandardTrack", "Deprecated" @@ -1331,10 +1348,10 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

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.

\n
\n

Note:\nTo query for the width of the viewport, developers should use the width media feature instead.\n

\n

The device-width CSS media feature can be used to test the width of an output device's rendering surface." + "doc": "

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.

\n
\n

Note:\nTo query for the width of the viewport, developers should use the width media feature instead.\n

\n

The device-width CSS media feature can be used to test the width of an output device's rendering surface." }, "display-mode": { - "url": "$MDN_URL$/web/css/@media/display-mode", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/display-mode", "status": [ "StandardTrack" ], @@ -1343,17 +1360,19 @@ "ChromeAndroid": "42", "Edge": "79", "Firefox": "47", + "FirefoxAndroid": "116", "Opera": "29", "Safari": "13", "SafariIOS": "12.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2023-08-01" }, - "doc": "The display-mode CSS media feature can be used to test whether a web app is being displayed in a normal browser tab or in some alternative way, such as a standalone app or fullscreen mode.\n

For example:\n

\n

The display-mode value applies to the top-level browsing context and any child browsing contexts." + "doc": "The display-mode CSS media feature can be used to test whether a web app is being displayed in a normal browser tab or in some alternative way, such as a standalone app or fullscreen mode.\n

For example:\n

\n

The display-mode value applies to the top-level browsing context and any child browsing contexts." }, "dynamic-range": { - "url": "$MDN_URL$/web/css/@media/dynamic-range", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/dynamic-range", "status": [ "StandardTrack" ], @@ -1372,10 +1391,10 @@ "lowDate": "2022-05-03", "highDate": "2024-11-03" }, - "doc": "The dynamic-range CSS media feature can be used to test the combination of brightness, contrast ratio, and color depth that are supported by the user agent and the output device.\n

\n

Note:\nSome devices have high dynamic range capabilities that are not always 'on' and need to be activated (sometimes programmatically, sometimes by the user, sometimes based on the content). This media feature does not test whether the dynamic range capability is active; it only tests whether the device is capable of high dynamic range visuals.\n

" + "doc": "The dynamic-range CSS media feature can be used to test the combination of brightness, contrast ratio, and color depth that are supported by the user agent and the output device.\n
\n

Note:\nSome devices have high dynamic range capabilities that are not always 'on' and need to be activated (sometimes programmatically, sometimes by the user, sometimes based on the content). This media feature does not test whether the dynamic range capability is active; it only tests whether the device is capable of high dynamic range visuals.\n

" }, "forced-colors": { - "url": "$MDN_URL$/web/css/@media/forced-colors", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/forced-colors", "status": [ "StandardTrack" ], @@ -1394,14 +1413,14 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The forced-colors CSS media feature is used to detect if the user agent has enabled a forced colors mode where it enforces a user-chosen limited color palette on the page. An example of a forced colors mode is Windows High Contrast mode.", + "doc": "The forced-colors CSS media feature is used to detect if the user agent has enabled a forced colors mode where it enforces a user-chosen limited color palette on the page. An example of a forced colors mode is Windows High Contrast mode.", "values": { "none": "Forced colors mode is not active; the page's colors are not being forced into a limited palette.", - "active": "Indicates that forced colors mode is active. The browser provides the color palette to authors through the CSS system color keywords and, if appropriate, triggers the appropriate value of prefers-color-scheme so that authors can adapt the page. The browser selects the value for prefers-color-scheme based on the lightness of the Canvas system color (see the color adjust spec for more details)." + "active": "Indicates that forced colors mode is active. The browser provides the color palette to authors through the CSS system color keywords and, if appropriate, triggers the appropriate value of prefers-color-scheme so that authors can adapt the page. The browser selects the value for prefers-color-scheme based on the lightness of the Canvas system color (see the color adjust spec for more details)." } }, "grid": { - "url": "$MDN_URL$/web/css/@media/grid", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/grid", "status": [ "StandardTrack" ], @@ -1420,10 +1439,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The grid CSS media feature can be used to test whether the output device uses a grid-based screen.\n

Most modern computers and smartphones have bitmap-based screens. Examples of grid-based devices include text-only terminals and basic phones with only one fixed font." + "doc": "The grid CSS media feature can be used to test whether the output device uses a grid-based screen.\n

Most modern computers and smartphones have bitmap-based screens. Examples of grid-based devices include text-only terminals and basic phones with only one fixed font." }, "height": { - "url": "$MDN_URL$/web/css/@media/height", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/height", "status": [ "StandardTrack" ], @@ -1442,10 +1461,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height CSS media feature can be used to apply styles based on the height of the viewport (or the page box, for paged media)." + "doc": "The height CSS media feature can be used to apply styles based on the height of the viewport (or the page box, for paged media)." }, "horizontal-viewport-segments": { - "url": "$MDN_URL$/web/css/@media/horizontal-viewport-segments", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/horizontal-viewport-segments", "status": [ "Experimental", "StandardTrack" @@ -1459,10 +1478,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The horizontal-viewport-segments CSS media feature detects whether the device has a specified number of viewport segments laid out horizontally (side by side).\n

Related to the Viewport Segments API, the vertical-viewport-segments feature can be used to create responsive designs that work well on multi-viewport devices — devices with a display that is divided into logically separate viewport segments, such as foldable or hinged devices." + "doc": "

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

\n

The horizontal-viewport-segments CSS media feature detects whether the device has a specified number of viewport segments laid out horizontally (side by side).\n

Related to the Viewport Segments API, the vertical-viewport-segments feature can be used to create responsive designs that work well on multi-viewport devices — devices with a display that is divided into logically separate viewport segments, such as foldable or hinged devices." }, "hover": { - "url": "$MDN_URL$/web/css/@media/hover", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/hover", "status": [ "StandardTrack" ], @@ -1481,10 +1500,10 @@ "lowDate": "2018-12-11", "highDate": "2021-06-11" }, - "doc": "The hover CSS media feature can be used to test whether the user's primary input mechanism can hover over elements." + "doc": "The hover CSS media feature can be used to test whether the user's primary input mechanism can hover over elements." }, "inverted-colors": { - "url": "$MDN_URL$/web/css/@media/inverted-colors", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/inverted-colors", "status": [ "StandardTrack" ], @@ -1495,10 +1514,10 @@ "baseline": { "level": "NONE" }, - "doc": "The inverted-colors CSS media feature is used to test if the user agent or the underlying operating system has inverted all colors.\n

Inversion of colors can have unpleasant side effects, such as shadows turning into highlights, which can reduce the readability of the content. Using this media feature, you can detect if inversion is happening and style the content accordingly while respecting user preference." + "doc": "The inverted-colors CSS media feature is used to test if the user agent or the underlying operating system has inverted all colors.\n

Inversion of colors can have unpleasant side effects, such as shadows turning into highlights, which can reduce the readability of the content. Using this media feature, you can detect if inversion is happening and style the content accordingly while respecting user preference." }, "monochrome": { - "url": "$MDN_URL$/web/css/@media/monochrome", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/monochrome", "status": [ "StandardTrack" ], @@ -1517,10 +1536,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The monochrome CSS media feature can be used to test the number of bits per pixel in the monochrome frame buffer of the output device." + "doc": "The monochrome CSS media feature can be used to test the number of bits per pixel in the monochrome frame buffer of the output device." }, "orientation": { - "url": "$MDN_URL$/web/css/@media/orientation", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/orientation", "status": [ "StandardTrack" ], @@ -1539,10 +1558,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The orientation CSS media feature can be used to test the orientation of the viewport (or the page box, for paged media).\n

\n

Note:\nThis feature does not correspond to device orientation. Opening the soft keyboard on many devices in portrait orientation will cause the viewport to become wider than it is tall, thereby causing the browser to use landscape styles instead of portrait.\n

" + "doc": "The orientation CSS media feature can be used to test the orientation of the viewport (or the page box, for paged media).\n
\n

Note:\nThis feature does not correspond to device orientation. Opening the soft keyboard on many devices in portrait orientation will cause the viewport to become wider than it is tall, thereby causing the browser to use landscape styles instead of portrait.\n

" }, "overflow-block": { - "url": "$MDN_URL$/web/css/@media/overflow-block", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/overflow-block", "status": [ "StandardTrack" ], @@ -1560,10 +1579,10 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The overflow-block CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the block axis.\n
\n

Note:\nThe overflow-block property does not determine whether overflow occurs; rather, it reveals the device's handling of such overflow. Typically, on screens in most browsers, the behavior will be \"scroll\": when content exceeds the available vertical space, the device allows you to scroll to access the overflowed content.\n

" + "doc": "The overflow-block CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the block axis.\n
\n

Note:\nThe overflow-block property does not determine whether overflow occurs; rather, it reveals the device's handling of such overflow. Typically, on screens in most browsers, the behavior will be \"scroll\": when content exceeds the available vertical space, the device allows you to scroll to access the overflowed content.\n

" }, "overflow-inline": { - "url": "$MDN_URL$/web/css/@media/overflow-inline", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/overflow-inline", "status": [ "StandardTrack" ], @@ -1581,10 +1600,10 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The overflow-inline CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the inline axis.\n
\n

Note:\nThe overflow-inline property does not determine whether overflow occurs; rather, it reveals the device's handling of such overflow. Typically, on screens in most browsers, the behavior will be \"scroll\": when content exceeds the available horizontal space, the device allows you to scroll to access the overflowed content.\n

" + "doc": "The overflow-inline CSS media feature can be used to test how the output device handles content that overflows the initial containing block along the inline axis.\n
\n

Note:\nThe overflow-inline property does not determine whether overflow occurs; rather, it reveals the device's handling of such overflow. Typically, on screens in most browsers, the behavior will be \"scroll\": when content exceeds the available horizontal space, the device allows you to scroll to access the overflowed content.\n

" }, "pointer": { - "url": "$MDN_URL$/web/css/@media/pointer", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/pointer", "status": [ "StandardTrack" ], @@ -1603,10 +1622,10 @@ "lowDate": "2018-12-11", "highDate": "2021-06-11" }, - "doc": "The pointer CSS media feature tests whether the user has a pointing device (such as a mouse), and if so, how accurate the primary pointing device is.\n
\n

Note:\nIf you want to test the accuracy of any pointing device, use any-pointer instead.\n

" + "doc": "The pointer CSS media feature tests whether the user has a pointing device (such as a mouse), and if so, how accurate the primary pointing device is.\n
\n

Note:\nIf you want to test the accuracy of any pointing device, use any-pointer instead.\n

" }, "prefers-color-scheme": { - "url": "$MDN_URL$/web/css/@media/prefers-color-scheme", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/prefers-color-scheme", "status": [ "StandardTrack" ], @@ -1625,10 +1644,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The prefers-color-scheme CSS media feature is used to detect if a user has requested light or dark color themes.\nA user indicates their preference through an operating system setting (e.g., light or dark mode) or a user agent setting." + "doc": "The prefers-color-scheme CSS media feature is used to detect if a user has requested light or dark color themes.\nA user indicates their preference through an operating system setting (e.g., light or dark mode) or a user agent setting." }, "prefers-contrast": { - "url": "$MDN_URL$/web/css/@media/prefers-contrast", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/prefers-contrast", "status": [ "StandardTrack" ], @@ -1647,10 +1666,10 @@ "lowDate": "2022-05-31", "highDate": "2024-11-30" }, - "doc": "The prefers-contrast CSS media feature is used to detect whether the user has requested the web content to be presented with a lower or higher contrast." + "doc": "The prefers-contrast CSS media feature is used to detect whether the user has requested the web content to be presented with a lower or higher contrast." }, "prefers-reduced-data": { - "url": "$MDN_URL$/web/css/@media/prefers-reduced-data", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/prefers-reduced-data", "status": [ "Experimental", "StandardTrack" @@ -1659,10 +1678,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n
\n

Note:\nThis feature is not supported by any user agent and its specifics are subject to change.\n

\n

The prefers-reduced-data CSS media feature is used to detect if the user has requested the web content that consumes less internet traffic." + "doc": "

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

\n
\n

Note:\nThis feature is not supported by any user agent and its specifics are subject to change.\n

\n

The prefers-reduced-data CSS media feature is used to detect if the user has requested the web content that consumes less internet traffic." }, "prefers-reduced-motion": { - "url": "$MDN_URL$/web/css/@media/prefers-reduced-motion", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/prefers-reduced-motion", "status": [ "StandardTrack" ], @@ -1681,10 +1700,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

\n

Warning:\nAn embedded example at the bottom of this page has a scaling movement that may be problematic for some readers. Readers with vestibular motion disorders may wish to enable the reduce motion feature on their device before viewing the animation.\n

\n

The prefers-reduced-motion CSS media feature is used to detect if a user has enabled a setting on their device to minimize the amount of non-essential motion. The setting is used to convey to the browser on the device that the user prefers an interface that removes, reduces, or replaces motion-based animations.\n

Such animations can trigger discomfort for those with vestibular motion disorders. Animations such as scaling or panning large objects can be vestibular motion triggers." + "doc": "

\n

Warning:\nAn embedded example at the bottom of this page has a scaling movement that may be problematic for some readers. Readers with vestibular motion disorders may wish to enable the reduce motion feature on their device before viewing the animation.\n

\n

The prefers-reduced-motion CSS media feature is used to detect if a user has enabled a setting on their device to minimize the amount of non-essential motion. The setting is used to convey to the browser on the device that the user prefers an interface that removes, reduces, or replaces motion-based animations.\n

Such animations can trigger discomfort for those with vestibular motion disorders. Animations such as scaling or panning large objects can be vestibular motion triggers." }, "prefers-reduced-transparency": { - "url": "$MDN_URL$/web/css/@media/prefers-reduced-transparency", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/prefers-reduced-transparency", "status": [ "Experimental", "StandardTrack" @@ -1698,10 +1717,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The prefers-reduced-transparency CSS media feature is used to detect if a user has enabled a setting on their device to reduce the transparent or translucent layer effects used on the device. Switching on such a setting can help improve contrast and readability for some users." + "doc": "

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

\n

The prefers-reduced-transparency CSS media feature is used to detect if a user has enabled a setting on their device to reduce the transparent or translucent layer effects used on the device. Switching on such a setting can help improve contrast and readability for some users." }, "resolution": { - "url": "$MDN_URL$/web/css/@media/resolution", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/resolution", "status": [ "StandardTrack" ], @@ -1720,14 +1739,14 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The resolution CSS media feature can be used to test the pixel density of the output device." + "doc": "The resolution CSS media feature can be used to test the pixel density of the output device." }, "scan": { - "url": "$MDN_URL$/web/css/@media/scan", - "doc": "The scan CSS media feature is used to apply CSS styles based on the scanning process of the output device." + "url": "$MDN_URL$/web/css/reference/at-rules/@media/scan", + "doc": "The scan CSS media feature is used to apply CSS styles based on the scanning process of the output device." }, "scripting": { - "url": "$MDN_URL$/web/css/@media/scripting", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/scripting", "status": [ "StandardTrack" ], @@ -1745,14 +1764,14 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The scripting CSS media feature can be used to test whether scripting (such as JavaScript) is available.\n

\n

Note:\nThe detection is done by the browsers based on the user settings. Some browser extensions can implement script blocking using different techniques. In such cases the scripting media feature may not work as expected.\n

" + "doc": "The scripting CSS media feature can be used to test whether scripting (such as JavaScript) is available.\n
\n

Note:\nThe detection is done by the browsers based on the user settings. Some browser extensions can implement script blocking using different techniques. In such cases the scripting media feature may not work as expected.\n

" }, "shape": { - "url": "$MDN_URL$/web/css/@media/shape", - "doc": "

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

\n

The shape CSS media feature can be used to test the shape of the device to distinguish rectangular and round displays." + "url": "$MDN_URL$/web/css/reference/at-rules/@media/shape", + "doc": "

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

\n

The shape CSS media feature can be used to test the shape of the device to distinguish rectangular and round displays." }, "update": { - "url": "$MDN_URL$/web/css/@media/update", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/update", "status": [ "StandardTrack" ], @@ -1770,10 +1789,10 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The update CSS media feature can be used to test how frequently (if at all) the output device is able to modify the appearance of content once rendered." + "doc": "The update CSS media feature can be used to test how frequently (if at all) the output device is able to modify the appearance of content once rendered." }, "vertical-viewport-segments": { - "url": "$MDN_URL$/web/css/@media/vertical-viewport-segments", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/vertical-viewport-segments", "status": [ "Experimental", "StandardTrack" @@ -1787,10 +1806,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The vertical-viewport-segments CSS media feature detects whether the device has a specified number of viewport segments laid out vertically (top to bottom).\n

Related to the Viewport Segments API, the vertical-viewport-segments feature can be used to create responsive designs that work well on multi-viewport devices — devices with a display that is divided into logically separate viewport segments, such as foldable or hinged devices." + "doc": "

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

\n

The vertical-viewport-segments CSS media feature detects whether the device has a specified number of viewport segments laid out vertically (top to bottom).\n

Related to the Viewport Segments API, the vertical-viewport-segments feature can be used to create responsive designs that work well on multi-viewport devices — devices with a display that is divided into logically separate viewport segments, such as foldable or hinged devices." }, "video-dynamic-range": { - "url": "$MDN_URL$/web/css/@media/video-dynamic-range", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/video-dynamic-range", "status": [ "StandardTrack" ], @@ -1801,10 +1820,10 @@ "baseline": { "level": "NONE" }, - "doc": "The video-dynamic-range CSS media feature can be used to test the combination of brightness, contrast ratio, and color depth that are supported by the video plane of the user agent and the output device.\n

Some user agents, including many TVs, render video and graphics in two separate planes (bi-plane) with distinct screen characteristics. The video-dynamic-range feature is used to test the characteristics in the video plane." + "doc": "The video-dynamic-range CSS media feature can be used to test the combination of brightness, contrast ratio, and color depth that are supported by the video plane of the user agent and the output device.\n

Some user agents, including many TVs, render video and graphics in two separate planes (bi-plane) with distinct screen characteristics. The video-dynamic-range feature is used to test the characteristics in the video plane." }, "width": { - "url": "$MDN_URL$/web/css/@media/width", + "url": "$MDN_URL$/web/css/reference/at-rules/@media/width", "status": [ "StandardTrack" ], @@ -1823,13 +1842,13 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width CSS media feature can be used to test the width of the viewport (or the page box, for paged media)." + "doc": "The width CSS media feature can be used to test the width of the viewport (or the page box, for paged media)." } }, "formalSyntax": "@media <media-query-list> { <rule-list> }" }, "namespace": { - "url": "$MDN_URL$/web/css/@namespace", + "url": "$MDN_URL$/web/css/reference/at-rules/@namespace", "status": [ "StandardTrack" ], @@ -1848,11 +1867,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "@namespace is an at-rule that defines XML namespaces to be used in a CSS style sheet.", + "doc": "@namespace is an at-rule that defines XML namespaces to be used in a CSS style sheet.", "formalSyntax": "@namespace <namespace-prefix>? [ <string> | <url> ] ;\n  <namespace-prefix> = <ident>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )" }, "page": { - "url": "$MDN_URL$/web/css/@page", + "url": "$MDN_URL$/web/css/reference/at-rules/@page", "status": [ "StandardTrack" ], @@ -1873,7 +1892,7 @@ "doc": "The @page at-rule is a CSS at-rule used to modify different aspects of printed pages. It targets and modifies the page's dimensions, orientation, and margins. The @page at-rule can be used to target all pages in a print-out or a subset using its various pseudo-classes.", "properties": { "page-orientation": { - "url": "$MDN_URL$/web/css/@page/page-orientation", + "url": "$MDN_URL$/web/css/reference/at-rules/@page/page-orientation", "status": [ "StandardTrack" ], @@ -1888,7 +1907,7 @@ "baseline": { "level": "NONE" }, - "doc": "The page-orientation CSS descriptor for the @page at-rule controls the rotation of a printed page. It handles the flow of content across pages when the orientation of a page is changed. This behavior differs from the size descriptor in that a user can define the direction in which to rotate the page.\n

This descriptor helps with the layout and orientation of printed documents, especially when documents are printed double-sided. A user can specify how the pages will be rotated when printed. This is particularly useful to lay out content such as tables, which may be wider than the rest of the content, in a different orientation.\n

\n

Note:\nMargin boxes and other positional elements have no special interaction with this descriptor. Margins are laid out as normal in the unrotated page, then rotated along with everything else.\n

", + "doc": "The page-orientation CSS descriptor for the @page at-rule controls the rotation of a printed page. It handles the flow of content across pages when the orientation of a page is changed. This behavior differs from the size descriptor in that a user can define the direction in which to rotate the page.\n

This descriptor helps with the layout and orientation of printed documents, especially when documents are printed double-sided. A user can specify how the pages will be rotated when printed. This is particularly useful to lay out content such as tables, which may be wider than the rest of the content, in a different orientation.\n

\n

Note:\nMargin boxes and other positional elements have no special interaction with this descriptor. Margins are laid out as normal in the unrotated page, then rotated along with everything else.\n

", "formalSyntax": "upright | rotate-left | rotate-right", "values": { "upright": "No orientation is applied and the page is laid out and formatted as normal.", @@ -1897,7 +1916,7 @@ } }, "size": { - "url": "$MDN_URL$/web/css/@page/size", + "url": "$MDN_URL$/web/css/reference/at-rules/@page/size", "status": [ "StandardTrack" ], @@ -1915,13 +1934,13 @@ "level": "LOW", "lowDate": "2024-12-11" }, - "doc": "The size CSS at-rule descriptor, used with the @page at-rule, defines the size and orientation of the box which is used to represent a page. Most of the time, this size corresponds to the target size of the printed page if applicable.\n

Size may either be defined with a \"scalable\" keyword (in this case the page will fill the available dimensions) or with absolute dimensions.", + "doc": "The size CSS at-rule descriptor, used with the @page at-rule, defines the size and orientation of the box which is used to represent a page. Most of the time, this size corresponds to the target size of the printed page if applicable.\n

Size may either be defined with a \"scalable\" keyword (in this case the page will fill the available dimensions) or with absolute dimensions.", "formalSyntax": "<length [0,∞]>{1,2} | auto | [ <page-size> || [ portrait | landscape ] ]", "values": { "auto": "The user agent decides the size of the page. In most cases, the dimensions and orientation of the target sheet are used.", "landscape": "The content of the page is displayed in landscape mode (i.e., the longest side of the box is horizontal).", "portrait": "The content of the page is displayed in portrait mode (i.e., the longest side of the box is vertical). This is the default orientation.", - "<length>": "Any length value (see <length>). The first value corresponds to the width of the page box and the second one corresponds to its height. If only one value is provided, it is used for both width and height.", + "<length>": "Any length value (see <length>). The first value corresponds to the width of the page box and the second one corresponds to its height. If only one value is provided, it is used for both width and height.", "<page-size>": "A keyword which may be any of the following values:\n

\n
A5
\n
\n

This matches the standard, ISO dimensions: 148mm x 210mm.\n

\n
A4
\n
\n

This matches the standard, ISO dimensions: 210mm x 297mm. (most frequently used dimensions for personal printing.)\n

\n
A3
\n
\n

This matches the standard, ISO dimensions: 297mm x 420mm.\n

\n
B5
\n
\n

This matches the standard, ISO dimensions: 176mm x 250mm.\n

\n
B4
\n
\n

This matches the standard, ISO dimensions: 250mm x 353mm.\n

\n
JIS-B5
\n
\n

This correspond to the JIS standard dimensions: 182mm x 257mm.\n

\n
JIS-B4
\n
\n

This correspond to the JIS standard dimensions: 257mm x 364mm.\n

\n
letter
\n
\n

This keyword is an equivalent to the dimensions of letter paper in North America i.e., 8.5in x 11in.\n

\n
legal
\n
\n

This keyword is an equivalent to the dimensions of legal papers in North America i.e., 8.5in x 14in.\n

\n
ledger
\n
\n

This keyword is an equivalent to the dimensions of ledger pages in North America i.e., 11in x 17in.\n

\n
" } } @@ -1929,7 +1948,7 @@ "formalSyntax": "@page <page-selector-list>? { <declaration-rule-list> }\n  <page-selector-list> = <page-selector>#\n  <page-selector> = [ <ident-token>? <pseudo-page>* ]!\n  <pseudo-page> = : [ left | right | first | blank ]" }, "position-try": { - "url": "$MDN_URL$/web/css/@position-try", + "url": "$MDN_URL$/web/css/reference/at-rules/@position-try", "status": [ "StandardTrack" ], @@ -1937,18 +1956,21 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The @position-try CSS at-rule is used to define a custom position try fallback option, which can be used to define positioning and alignment for anchor-positioned elements. One or more sets of position try fallback options can be applied to the anchored element via the position-try-fallbacks property or position-try shorthand. When the positioned element is moved to a position where it starts to overflow its containing block or the viewport, the browser will select the first position try fallback option it finds that places the positioned element fully back on-screen.\n

Each position option is named with a <dashed-ident> and contains a descriptor list specifying declarations that define information such as inset position, margin, sizing, and self-alignment. The <dashed-ident> is used to reference the custom position option in the position-try-fallbacks property and position-try shorthand.\n

For detailed information on anchor features and position try fallback usage, see the CSS anchor positioning module landing page and the Fallback options and conditional hiding for overflow guide.", + "doc": "The @position-try CSS at-rule is used to define a custom position try fallback option, which can be used to define positioning and alignment for anchor-positioned elements. One or more sets of position try fallback options can be applied to the anchored element via the position-try-fallbacks property or position-try shorthand. When the positioned element is moved to a position where it starts to overflow its containing block or the viewport, the browser will select the first position try fallback option it finds that places the positioned element fully back on-screen.\n

Each position option is named with a <dashed-ident> and contains a descriptor list specifying declarations that define information such as inset position, margin, sizing, and self-alignment. The <dashed-ident> is used to reference the custom position option in the position-try-fallbacks property and position-try shorthand.\n

For detailed information on anchor features and position try fallback usage, see the CSS anchor positioning module and the Fallback options and conditional hiding for overflow guide.", "formalSyntax": "@position-try <dashed-ident> { <declaration-list> }" }, "property": { - "url": "$MDN_URL$/web/css/@property", + "url": "$MDN_URL$/web/css/reference/at-rules/@property", "status": [ "StandardTrack" ], @@ -1966,10 +1988,10 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The @property CSS at-rule is part of the CSS Houdini set of APIs. It allows developers to explicitly define CSS custom properties, allowing for property type checking and constraining, setting default values, and defining whether a custom property can inherit values or not.\n

The @property rule represents a custom property registration directly in a stylesheet without having to run any JavaScript. Valid @property rules result in a registered custom property, which is similar to calling registerProperty() with equivalent parameters.", + "doc": "The @property CSS at-rule is used to explicitly define CSS custom properties, allowing for property type checking and constraining, setting default values, and defining whether a custom property can inherit values or not.\n

\n

Note:\nThe JavaScript registerProperty() method is equivalent to the @property at-rule.\n

", "properties": { "inherits": { - "url": "$MDN_URL$/web/css/@property/inherits", + "url": "$MDN_URL$/web/css/reference/at-rules/@property/inherits", "status": [ "StandardTrack" ], @@ -1987,7 +2009,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The inherits CSS descriptor of the @property at-rule controls whether or not the registered CSS custom property inherits by default.\nIt is a required descriptor; if missing or invalid, the entire @property rule is invalid and ignored.", + "doc": "The inherits CSS descriptor of the @property at-rule controls whether or not the registered CSS custom property inherits by default.\nIt is a required descriptor; if missing or invalid, the entire @property rule is invalid and ignored.", "formalSyntax": "true | false", "values": { "true": "The property inherits by default.", @@ -1995,7 +2017,7 @@ } }, "initial-value": { - "url": "$MDN_URL$/web/css/@property/initial-value", + "url": "$MDN_URL$/web/css/reference/at-rules/@property/initial-value", "status": [ "StandardTrack" ], @@ -2013,11 +2035,11 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The initial-value descriptor of the @property at-rule specifies the initial value for the registered CSS custom property.\nIt is a required descriptor unless the syntax descriptor value is the universal syntax (*).\nIf required but missing or invalid, the entire @property rule is invalid and ignored.", + "doc": "The initial-value descriptor of the @property at-rule specifies the initial value for the registered CSS custom property.\nIt is a required descriptor unless the syntax descriptor value is the universal syntax (*).\nIf required but missing or invalid, the entire @property rule is invalid and ignored.", "formalSyntax": "<declaration-value>?" }, "syntax": { - "url": "$MDN_URL$/web/css/@property/syntax", + "url": "$MDN_URL$/web/css/reference/at-rules/@property/syntax", "status": [ "StandardTrack" ], @@ -2035,53 +2057,60 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The syntax descriptor of the @property at-rule defines the allowed value types for the registered CSS custom property.\nIt controls how the property's specified value is processed to derive the computed value.\nIt is a required descriptor; if missing or invalid, the entire @property rule is invalid and ignored.", + "doc": "The syntax descriptor of the @property at-rule defines the allowed value types for the registered CSS custom property.\nIt controls how the property's specified value is processed to derive the computed value.\nIt is a required descriptor; if missing or invalid, the entire @property rule is invalid and ignored.", "formalSyntax": "<string>", "values": { - "\"<angle>\"": "Accepts any valid <angle> value.", - "\"<color>\"": "Accepts any valid <color> value.", - "\"<custom-ident>\"": "Accepts any valid <custom-ident> value.", - "\"<image>\"": "Accepts any valid <image> value.", - "\"<integer>\"": "Accepts any valid <integer> value.", - "\"<length>\"": "Accepts any valid <length> value.", - "\"<length-percentage>\"": "Accepts any valid <length> or <percentage> value and any valid calc() expression combining <length> and <percentage> values.", - "\"<number>\"": "Accepts any valid <number> value.", - "\"<percentage>\"": "Accepts any valid <percentage> value.", - "\"<resolution>\"": "Accepts any valid <resolution> value.", - "\"<string>\"": "Accepts any valid <string> value.", - "\"<time>\"": "Accepts any valid <time> value.", - "\"<transform-function>\"": "Accepts any valid <transform-function> value.", - "\"<transform-list>\"": "Accepts a list of valid <transform-function> values. It is equivalent to \"<transform-function>+\".", - "\"<url>\"": "Accepts any valid <url> value." + "\"<angle>\"": "Accepts any valid <angle> value.", + "\"<color>\"": "Accepts any valid <color> value.", + "\"<custom-ident>\"": "Accepts any valid <custom-ident> value.", + "\"<image>\"": "Accepts any valid <image> value.", + "\"<integer>\"": "Accepts any valid <integer> value.", + "\"<length>\"": "Accepts any valid <length> value.", + "\"<length-percentage>\"": "Accepts any valid <length> or <percentage> value and any valid calc() expression combining <length> and <percentage> values.", + "\"<number>\"": "Accepts any valid <number> value.", + "\"<percentage>\"": "Accepts any valid <percentage> value.", + "\"<resolution>\"": "Accepts any valid <resolution> value.", + "\"<string>\"": "Accepts any valid <string> value.", + "\"<time>\"": "Accepts any valid <time> value.", + "\"<transform-function>\"": "Accepts any valid <transform-function> value.", + "\"<transform-list>\"": "Accepts a list of valid <transform-function> values. It is equivalent to \"<transform-function>+\".", + "\"<url>\"": "Accepts any valid <url> value." } } }, "formalSyntax": "@property <custom-property-name> { <declaration-list> }" }, "scope": { - "url": "$MDN_URL$/web/css/@scope", + "url": "$MDN_URL$/web/css/reference/at-rules/@scope", "status": [ "StandardTrack" ], "compatibility": { "support_of_at-scope": { + "Chrome": "143", + "ChromeAndroid": "143", + "Edge": "143", "Firefox": "142", - "FirefoxAndroid": "142" + "FirefoxAndroid": "142", + "Safari": "26.2", + "SafariIOS": "26.2" }, "support_of_scope": { "Chrome": "118", "ChromeAndroid": "118", "Edge": "118", + "Firefox": "146", + "FirefoxAndroid": "146", "Opera": "104", "Safari": "17.4", "SafariIOS": "17.4" } }, - "doc": "The @scope CSS at-rule enables you to select elements in specific DOM subtrees, targeting elements precisely without writing overly-specific selectors that are hard to override, and without coupling your selectors too tightly to the DOM structure.\n

In JavaScript, @scope can be accessed via the CSS object model interface CSSScopeRule.", - "formalSyntax": "@scope [ ( <scope-start> ) ]? [ to ( <scope-end> ) ]? { <block-contents> }" + "doc": "The @scope CSS at-rule enables you to select elements in specific DOM subtrees, targeting elements precisely without writing overly-specific selectors that are hard to override, and without coupling your selectors too tightly to the DOM structure.\n

In JavaScript, @scope can be accessed via the CSS object model interface CSSScopeRule.", + "formalSyntax": "@scope [ ( <scope-start> ) ]? [ to ( <scope-end> ) ]? { <block-contents> }\n  <scope-start> = <selector-list>\n  <scope-end> = <selector-list>\n  <selector-list> = <complex-selector-list>\n  <complex-selector-list> = <complex-selector>#\n  <complex-selector> = <complex-selector-unit> [ <combinator>? <complex-selector-unit> ]*\n  <complex-selector-unit> = [ <compound-selector>? <pseudo-compound-selector>* ]!\n  <combinator> = '>' | '+' | '~' | [ '|' '|' ]\n  <compound-selector> = [ <type-selector>? <subclass-selector>* ]!\n  <pseudo-compound-selector> = <pseudo-element-selector> <pseudo-class-selector>*\n  <type-selector> = <wq-name> | <ns-prefix>? '*'\n  <subclass-selector> = <id-selector> | <class-selector> | <attribute-selector> | <pseudo-class-selector>\n  <pseudo-element-selector> = : <pseudo-class-selector> | <legacy-pseudo-element-selector>\n  <pseudo-class-selector> = : <ident-token> | : <function-token> <any-value> )\n  <wq-name> = <ns-prefix>? <ident-token>\n  <ns-prefix> = [ <ident-token> | '*' ]? '|'\n  <id-selector> = <hash-token>\n  <class-selector> = '.' <ident-token>\n  <attribute-selector> = '[' <wq-name> ']' | '[' <wq-name> <attr-matcher> [ <string-token> | <ident-token> ] <attr-modifier>? ']'\n  <legacy-pseudo-element-selector> = : [ before | after | first-line | first-letter ]\n  <attr-matcher> = [ '~' | '|' | '^' | '$' | '*' ]? '='\n  <attr-modifier> = i | s" }, "starting-style": { - "url": "$MDN_URL$/web/css/@starting-style", + "url": "$MDN_URL$/web/css/reference/at-rules/@starting-style", "status": [ "StandardTrack" ], @@ -2099,11 +2128,11 @@ "level": "LOW", "lowDate": "2024-08-06" }, - "doc": "The @starting-style CSS at-rule is used to define starting values for properties set on an element that you want to transition from when the element receives its first style update, i.e., when an element is first displayed on a previously loaded page.", + "doc": "The @starting-style CSS at-rule is used to define starting values for properties set on an element that you want to transition from when the element receives its first style update, i.e., when an element is first displayed on a previously loaded page.", "formalSyntax": "@starting-style { <rule-list> }" }, "supports": { - "url": "$MDN_URL$/web/css/@supports", + "url": "$MDN_URL$/web/css/reference/at-rules/@supports", "status": [ "StandardTrack" ], @@ -2122,11 +2151,11 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The @supports CSS at-rule lets you specify CSS declarations that depend on a browser's support for CSS features.\nUsing this at-rule is commonly called a feature query.\nThe rule must be placed at the top level of your code or nested inside any other conditional group at-rule.", + "doc": "The @supports CSS at-rule lets you specify CSS declarations that depend on a browser's support for CSS features.\nUsing this at-rule is commonly called a feature query.\nThe rule must be placed at the top level of your code or nested inside any other conditional group at-rule.\n

In JavaScript, @supports can be accessed via the CSS object model interface CSSSupportsRule.", "formalSyntax": "@supports <supports-condition> { <rule-list> }\n  <supports-condition> = not <supports-in-parens> | <supports-in-parens> [ and <supports-in-parens> ]* | <supports-in-parens> [ or <supports-in-parens> ]*\n  <supports-in-parens> = ( <supports-condition> ) | <supports-feature> | <general-enclosed>\n  <supports-feature> = <supports-decl>\n  <general-enclosed> = [ <function-token> <any-value>? ) ] | [ ( <any-value>? ) ]\n  <supports-decl> = ( <declaration> )" }, "view-transition": { - "url": "$MDN_URL$/web/css/@view-transition", + "url": "$MDN_URL$/web/css/reference/at-rules/@view-transition", "status": [ "StandardTrack" ], @@ -2141,29 +2170,29 @@ "baseline": { "level": "NONE" }, - "doc": "The @view-transition CSS at-rule is used to opt in the current and destination documents to undergo a view transition, in the case of a cross-document navigation.\n

For a cross-document view transition to work, the current and destination documents of the navigation also need to be on the same origin.", + "doc": "The @view-transition CSS at-rule is used to opt in the current and destination documents to undergo a view transition, in the case of a cross-document navigation.\n

For a cross-document view transition to work, the current and destination documents of the navigation need to be on the same origin.", "formalSyntax": "@view-transition { <declaration-list> }" } }, "dataTypes": { "-moz-image-rect": { - "url": "$MDN_URL$/web/css/-moz-image-rect", + "url": "$MDN_URL$/web/css/reference/values/-moz-image-rect", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n

The -moz-image-rect value for CSS background-image lets you use a portion of a larger image as a background.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n

The -moz-image-rect value for CSS background-image lets you use a portion of a larger image as a background.", "values": { "<url>": "The URI of the image from which to take the sub-image.", - "top": "The top edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", - "right": "The right edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", - "bottom": "The bottom edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", - "left": "The left edge, specified as an <integer> or <percentage>, of the sub-image within the specified image." + "top": "The top edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", + "right": "The right edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", + "bottom": "The bottom edge, specified as an <integer> or <percentage>, of the sub-image within the specified image.", + "left": "The left edge, specified as an <integer> or <percentage>, of the sub-image within the specified image." } }, "absolute-size": { - "url": "$MDN_URL$/web/css/absolute-size", - "doc": "The <absolute-size> CSS data type describes the absolute size keywords. This data type is used in the font shorthand and font-size properties.\n

The font size keywords are mapped to the deprecated HTML size attribute. See the HTML size attribute section below).", + "url": "$MDN_URL$/web/css/reference/values/absolute-size", + "doc": "The <absolute-size> CSS data type describes the absolute size keywords. This data type is used in the font shorthand and font-size properties.\n

The font size keywords are mapped to the deprecated HTML size attribute. See the HTML size attribute section below).", "values": { "xx-small": "An absolute size 60% the size of medium. Mapped to the deprecated size=\"1\".", "x-small": "An absolute size 75% the size of medium.", @@ -2176,12 +2205,12 @@ } }, "alpha-value": { - "url": "$MDN_URL$/web/css/alpha-value", - "doc": "The <alpha-value> CSS data type represents a value that can be either a <number> or a <percentage>, specifying the alpha channel or transparency of a color.", + "url": "$MDN_URL$/web/css/reference/values/alpha-value", + "doc": "The <alpha-value> CSS data type represents a value that can be either a <number> or a <percentage>, specifying the alpha channel or transparency of a color.", "formalSyntax": "<number> | <percentage>" }, "angle": { - "url": "$MDN_URL$/web/css/angle", + "url": "$MDN_URL$/web/css/reference/values/angle", "status": [ "StandardTrack" ], @@ -2200,10 +2229,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <angle> CSS data type represents an angle value expressed in degrees, gradians, radians, or turns. It is used, for example, in <gradient>s and in some transform functions." + "doc": "The <angle> CSS data type represents an angle value expressed in degrees, gradians, radians, or turns. It is used, for example, in <gradient>s and in some transform functions." }, "angle-percentage": { - "url": "$MDN_URL$/web/css/angle-percentage", + "url": "$MDN_URL$/web/css/reference/values/angle-percentage", "status": [ "StandardTrack" ], @@ -2222,12 +2251,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <angle-percentage> CSS data type represents a value that can be either a <angle> or a <percentage>.\n

Where an <angle-percentage> is specified as an allowable type, this means that the percentage resolves to an angle and therefore can be used in a calc() expression.", + "doc": "The <angle-percentage> CSS data type represents a value that can be either an <angle> or a <percentage>.\n

Where an <angle-percentage> is specified as an allowable type, this means that the percentage resolves to an angle and therefore can be used in a calc() expression.", "formalSyntax": "<angle> | <percentage>" }, + "axis": { + "url": "$MDN_URL$/web/css/reference/values/axis", + "doc": "The <axis> enumerated data type specifies the scrolling direction of the scroll container controlling a scroll timeline.\n

The <axis> keyword values are used in the following CSS functions and properties:\n

", + "formalSyntax": "block | inline | x | y" + }, "baseline-position": { - "url": "$MDN_URL$/web/css/baseline-position", - "doc": "The <baseline-position> enumerated value type represents the baseline keyword values and first and last modifiers, used for the align-content, align-items, align-self, justify-items and justify-self properties as well as the place-content, place-items, and place-self shorthand properties.\n

The first and last values give a box a baseline alignment preference, defaulting to first if the modifier is omitted.", + "url": "$MDN_URL$/web/css/reference/values/baseline-position", + "doc": "The <baseline-position> enumerated value type represents the baseline keyword values and first and last modifiers, used for the align-content, align-items, align-self, justify-items and justify-self properties as well as the place-content, place-items, and place-self shorthand properties.\n

The first and last values give a box a baseline alignment preference, defaulting to first if the modifier is omitted.", "values": { "baseline": "Computes to first baseline, as defined below.", "first baseline": "Aligns the alignment baseline of the box's first baseline set with the corresponding baseline of its baseline-sharing group. The fallback alignment is safe self-start for self-alignment or safe start for content distribution.", @@ -2235,7 +2269,7 @@ } }, "basic-shape": { - "url": "$MDN_URL$/web/css/basic-shape", + "url": "$MDN_URL$/web/css/reference/values/basic-shape", "status": [ "StandardTrack" ], @@ -2254,10 +2288,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The <basic-shape> CSS data type represents a shape used in the clip-path, shape-outside, and offset-path properties." + "doc": "The <basic-shape> CSS data type represents a shape used in the clip-path, shape-outside, and offset-path properties." }, "blend-mode": { - "url": "$MDN_URL$/web/css/blend-mode", + "url": "$MDN_URL$/web/css/reference/values/blend-mode", "status": [ "StandardTrack" ], @@ -2276,8 +2310,8 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The <blend-mode> CSS data type describes how colors should appear when elements overlap. It is used in the background-blend-mode and mix-blend-mode properties.", - "formalSyntax": "normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue | saturation | color | luminosity", + "doc": "The <blend-mode> CSS data type describes how colors should appear when elements overlap. It is used in the background-blend-mode and mix-blend-mode properties.", + "formalSyntax": "normal | darken | multiply | color-burn | lighten | screen | color-dodge | overlay | soft-light | hard-light | difference | exclusion | hue | saturation | color | luminosity", "values": { "normal": "The final color is the top color, regardless of what the bottom color is.\nThe effect is like two opaque pieces of paper overlapping.", "multiply": "The final color is the result of multiplying the top and bottom colors.\nA black layer leads to a black final layer, and a white layer leads to no change.\nThe effect is like two images printed on transparent film overlapping.", @@ -2298,18 +2332,18 @@ } }, "box-edge": { - "url": "$MDN_URL$/web/css/box-edge", - "doc": "The <box-edge> value types represent a box edge keyword, such as content-box and border-box. The box-edge keywords are used to define different aspects of an element's box model and how elements are positioned and rendered on screen.\n

The box-edge keywords are the components of, but not limited to, the data types <visual-box>, <layout-box>, <paint-box>, <coord-box>, and <geometry-box>. These types are applied to properties such as transform-box and background-clip.", + "url": "$MDN_URL$/web/css/reference/values/box-edge", + "doc": "The <box-edge> value types represent a box edge keyword, such as content-box and border-box. The box-edge keywords are used to define different aspects of an element's box model and how elements are positioned and rendered on screen.\n

The box-edge keywords are the components of, but not limited to, the data types <visual-box>, <layout-box>, <paint-box>, <coord-box>, and <geometry-box>. These types are applied to properties such as transform-box and background-clip.", "values": { - "<visual-box>": "Refers to the rectangular box generated for an element as seen by a user on a web page. It includes the element's content, padding, and border. Also referred to as <box>, this value excludes the margin area. This value type is used for the background-clip and overflow-clip-margin properties.", - "<layout-box>": "Refers to the space occupied by an element, including its content, padding, border, and margin. This value type is used for layout and positioning purposes. Also referred to as <shape-box>, this value type is used for the shape-outside property.", + "<visual-box>": "Refers to the rectangular box generated for an element as seen by a user on a web page. It includes the element's content, padding, and border. Also referred to as <box>, this value excludes the margin area. This value type is used for the background-clip and overflow-clip-margin properties.", + "<layout-box>": "Refers to the space occupied by an element, including its content, padding, border, and margin. This value type is used for layout and positioning purposes. Also referred to as <shape-box>, this value type is used for the shape-outside property.", "<paint-box>": "Refers to the area within the layout box that is used to visually render the content. This includes the area where the element's background and borders are painted. As an element's paintable area does not include its margins, this value excludes margin-box.", - "<coord-box>": "Refers to the coordinate box used for positioning and sizing an element within its parent container. It is used to control how content flows around the edges of the box. It excludes the margin area. This value type is used for the offset-path property.", - "<geometry-box>": "Defines the reference box for a basic shape, or if specified by itself, causes the edges of the specified box, including any corner shaping (such as a border-radius), to be the clipping path. This value type is used for the clip-path, mask-clip, and mask-origin properties and the SVG clip-path attribute." + "<coord-box>": "Refers to the coordinate box used for positioning and sizing an element within its parent container. It is used to control how content flows around the edges of the box. It excludes the margin area. This value type is used for the offset-path property.", + "<geometry-box>": "Defines the reference box for a basic shape, or if specified by itself, causes the edges of the specified box, including any corner shaping (such as a border-radius), to be the clipping path. This value type is used for the clip-path, mask-clip, and mask-origin properties and the SVG clip-path attribute." } }, "calc-keyword": { - "url": "$MDN_URL$/web/css/calc-keyword", + "url": "$MDN_URL$/web/css/reference/values/calc-keyword", "status": [ "StandardTrack" ], @@ -2328,7 +2362,7 @@ "lowDate": "2022-12-13", "highDate": "2025-06-13" }, - "doc": "The <calc-keyword> CSS data type represents well-defined constants such as e and pi. Rather than require authors to manually type out several digits of these mathematical constants or calculate them, a few of them are provided directly by CSS for convenience.", + "doc": "The <calc-keyword> CSS data type represents well-defined constants such as e and pi. Rather than require authors to manually type out several digits of these mathematical constants or calculate them, a few of them are provided directly by CSS for convenience.", "formalSyntax": "e | pi | infinity | -infinity | NaN", "values": { "e": "The base of the natural logarithm, approximately equal to 2.7182818284590452354.", @@ -2338,12 +2372,12 @@ } }, "calc-sum": { - "url": "$MDN_URL$/web/css/calc-sum", - "doc": "The <calc-sum> CSS data type represents an expression which performs a calculation in any CSS math function. The expression executes a basic arithmetic operation of addition and subtraction between two values.", + "url": "$MDN_URL$/web/css/reference/values/calc-sum", + "doc": "The <calc-sum> CSS data type represents an expression which performs a calculation in any CSS math function. The expression executes a basic arithmetic operation of addition and subtraction between two values.", "formalSyntax": "<calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "color": { - "url": "$MDN_URL$/web/css/color_value", + "url": "$MDN_URL$/web/css/reference/values/color_value", "status": [ "StandardTrack" ], @@ -2362,11 +2396,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <color> CSS data type represents a color.\nA <color> may also include an alpha-channel transparency value, indicating how the color should composite with its background.\n

\n

Note:\nAlthough <color> values are precisely defined, their actual appearance may vary (sometimes significantly) from device to device. This is because most devices are not calibrated, and some browsers do not support output devices' color profiles.\n

", - "formalSyntax": "<color-base> | currentColor | <system-color>\n  <color-base> = <hex-color> | <color-function> | <named-color> | transparent\n  <color-function> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hwb()> | <lab()> | <lch()> | <oklab()> | <oklch()> | <ictcp()> | <jzazbz()> | <jzczhz()> | <alpha()> | <color()>\n  <rgb()> = <legacy-rgb-syntax> | <modern-rgb-syntax>\n  <rgba()> = <legacy-rgba-syntax> | <modern-rgba-syntax>\n  <hsl()> = <legacy-hsl-syntax> | <modern-hsl-syntax>\n  <hsla()> = <legacy-hsla-syntax> | <modern-hsla-syntax>\n  <hwb()> = hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <lab()> = lab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <lch()> = lch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <oklab()> = oklab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <oklch()> = oklch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <ictcp()> = ictcp( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <jzazbz()> = jzazbz( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <jzczhz()> = jzczhz( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <alpha()> = alpha( [ from <color> ] [ / [ <alpha-value> | none ] ]? )\n  <color()> = color( <colorspace-params> [ / [ <alpha-value> | none ] ]? )\n  <legacy-rgb-syntax> = rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )\n  <modern-rgb-syntax> = rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )\n  <legacy-rgba-syntax> = rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )\n  <modern-rgba-syntax> = rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )\n  <legacy-hsl-syntax> = hsl( <hue> , <percentage> , <percentage> , <alpha-value>? )\n  <modern-hsl-syntax> = hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <legacy-hsla-syntax> = hsla( <hue> , <percentage> , <percentage> , <alpha-value>? )\n  <modern-hsla-syntax> = hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>\n  <colorspace-params> = <predefined-rgb-params> | <xyz-params>\n  <predefined-rgb-params> = <predefined-rgb> [ <number> | <percentage> | none ]{3}\n  <xyz-params> = <xyz-space> [ <number> | <percentage> | none ]{3}\n  <predefined-rgb> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | rec2100-pq | rec2100-hlg | rec2100-linear\n  <xyz-space> = xyz | xyz-d50 | xyz-d65" + "doc": "The <color> CSS data type represents a color.\nA <color> may also include an alpha-channel transparency value, indicating how the color should composite with its background.\n
\n

Note:\nAlthough <color> values are precisely defined, their actual appearance may vary (sometimes significantly) from device to device. This is because most devices are not calibrated, and some browsers do not support output devices' color profiles.\n

", + "formalSyntax": "<color-base> | currentColor | <system-color>\n  <color-base> = <hex-color> | <color-function> | <named-color> | transparent\n  <system-color> = AccentColor | AccentColorText | ActiveText | ButtonBorder | ButtonFace | ButtonText | Canvas | CanvasText | Field | FieldText | GrayText | Highlight | HighlightText | LinkText | Mark | MarkText | SelectedItem | SelectedItemText | VisitedText | <deprecated-color>\n  <color-function> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hwb()> | <lab()> | <lch()> | <oklab()> | <oklch()> | <ictcp()> | <jzazbz()> | <jzczhz()> | <alpha()> | <color()>\n  <named-color> = aliceblue | antiquewhite | aqua | aquamarine | azure | beige | bisque | black | blanchedalmond | blue | blueviolet | brown | burlywood | cadetblue | chartreuse | chocolate | coral | cornflowerblue | cornsilk | crimson | cyan | darkblue | darkcyan | darkgoldenrod | darkgray | darkgreen | darkgrey | darkkhaki | darkmagenta | darkolivegreen | darkorange | darkorchid | darkred | darksalmon | darkseagreen | darkslateblue | darkslategray | darkslategrey | darkturquoise | darkviolet | deeppink | deepskyblue | dimgray | dimgrey | dodgerblue | firebrick | floralwhite | forestgreen | fuchsia | gainsboro | ghostwhite | gold | goldenrod | gray | green | greenyellow | grey | honeydew | hotpink | indianred | indigo | ivory | khaki | lavender | lavenderblush | lawngreen | lemonchiffon | lightblue | lightcoral | lightcyan | lightgoldenrodyellow | lightgray | lightgreen | lightgrey | lightpink | lightsalmon | lightseagreen | lightskyblue | lightslategray | lightslategrey | lightsteelblue | lightyellow | lime | limegreen | linen | magenta | maroon | mediumaquamarine | mediumblue | mediumorchid | mediumpurple | mediumseagreen | mediumslateblue | mediumspringgreen | mediumturquoise | mediumvioletred | midnightblue | mintcream | mistyrose | moccasin | navajowhite | navy | oldlace | olive | olivedrab | orange | orangered | orchid | palegoldenrod | palegreen | paleturquoise | palevioletred | papayawhip | peachpuff | peru | pink | plum | powderblue | purple | rebeccapurple | red | rosybrown | royalblue | saddlebrown | salmon | sandybrown | seagreen | seashell | sienna | silver | skyblue | slateblue | slategray | slategrey | snow | springgreen | steelblue | tan | teal | thistle | tomato | turquoise | violet | wheat | white | whitesmoke | yellow | yellowgreen | transparent\n  <deprecated-color> = ActiveBorder | ActiveCaption | AppWorkspace | Background | ButtonHighlight | ButtonShadow | CaptionText | InactiveBorder | InactiveCaption | InactiveCaptionText | InfoBackground | InfoText | Menu | MenuText | Scrollbar | ThreeDDarkShadow | ThreeDFace | ThreeDHighlight | ThreeDLightShadow | ThreeDShadow | Window | WindowFrame | WindowText\n  <rgb()> = <legacy-rgb-syntax> | <modern-rgb-syntax>\n  <rgba()> = <legacy-rgba-syntax> | <modern-rgba-syntax>\n  <hsl()> = <legacy-hsl-syntax> | <modern-hsl-syntax>\n  <hsla()> = <legacy-hsla-syntax> | <modern-hsla-syntax>\n  <hwb()> = hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <lab()> = lab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <lch()> = lch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <oklab()> = oklab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <oklch()> = oklch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <ictcp()> = ictcp( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <jzazbz()> = jzazbz( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <jzczhz()> = jzczhz( [ from <color> ]? [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <alpha()> = alpha( [ from <color> ] [ / [ <alpha-value> | none ] ]? )\n  <color()> = color( <colorspace-params> [ / [ <alpha-value> | none ] ]? )\n  <legacy-rgb-syntax> = rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )\n  <modern-rgb-syntax> = rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )\n  <legacy-rgba-syntax> = rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )\n  <modern-rgba-syntax> = rgba( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )\n  <legacy-hsl-syntax> = hsl( <hue> , <percentage> , <percentage> , <alpha-value>? )\n  <modern-hsl-syntax> = hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <legacy-hsla-syntax> = hsla( <hue> , <percentage> , <percentage> , <alpha-value>? )\n  <modern-hsla-syntax> = hsla( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>\n  <colorspace-params> = <predefined-rgb-params> | <xyz-params>\n  <predefined-rgb-params> = <predefined-rgb> [ <number> | <percentage> | none ]{3}\n  <xyz-params> = <xyz-space> [ <number> | <percentage> | none ]{3}\n  <predefined-rgb> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | rec2100-pq | rec2100-hlg | rec2100-linear\n  <xyz-space> = xyz | xyz-d50 | xyz-d65" }, "color-interpolation-method": { - "url": "$MDN_URL$/web/css/color-interpolation-method", + "url": "$MDN_URL$/web/css/reference/values/color-interpolation-method", "status": [ "StandardTrack" ], @@ -2380,32 +2414,28 @@ "Safari": "16.2", "SafariIOS": "16.2" }, - "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" - }, - "doc": "The <color-interpolation-method> CSS data type represents the color space used for interpolation between <color> values. It can be used to override the default interpolation color space for color-related functional notations such as color-mix() and linear-gradient().\n

When interpolating <color> values, the interpolation color space defaults to Oklab.", + "doc": "The <color-interpolation-method> CSS data type represents the color space used for interpolation between <color> values. It can be used to override the default interpolation color space for color-related functional notations such as color-mix() and linear-gradient().\n

When interpolating <color> values, the interpolation color space defaults to Oklab.", "formalSyntax": "in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <xyz-space> = xyz | xyz-d50 | xyz-d65", "values": { "<rectangular-color-space>": "One of the keywords srgb, srgb-linear, display-p3, a98-rgb, prophoto-rgb, rec2020, lab, oklab, xyz, xyz-d50, or xyz-d65.", "<polar-color-space>": "One of the keywords hsl, hwb, lch, or oklch.", "<hue-interpolation-method>": "The algorithm for hue interpolation. It defaults to shorter hue.", - "<custom-color-space>": "A <dashed-ident> referring to a custom @color profile." + "<custom-color-space>": "A <dashed-ident> referring to a custom @color profile." } }, "content-distribution": { - "url": "$MDN_URL$/web/css/content-distribution", - "doc": "The <content-distribution> enumerated value type is used by justify-content and align-content properties, and the place-content shorthand, to distribute a container's extra space among its alignment subjects.", + "url": "$MDN_URL$/web/css/reference/values/content-distribution", + "doc": "The <content-distribution> enumerated value type is used by justify-content and align-content properties, and the place-content shorthand, to distribute a container's extra space among its alignment subjects.", "values": { "space-between": "Evenly distributes the alignment subject within the alignment container. The first item is placed flush with the start edge of the alignment container, the last item subject is placed flush with the end edge of the alignment container, and the remaining items are evenly distributed so that the spacing between any two adjacent items is the same. The default fallback alignment for space-between is safe flex-start for flex layout, and start otherwise. If there is only one item, the item will be flush with the start edge.", "space-around": "The items are evenly distributed in the container, with a half-size space on either end. The spacing between any two adjacent items is the same, and the spacing before the first and after the last items is half the size of the other spacing. The default fallback alignment for space-around is safe center. If the container has only one child, the item will be centered.", "space-evenly": "The items are evenly distributed in the container, with a full-size space on either end. The spacing between any two adjacent items, before the first item, and after the last item, are all the same. The default fallback alignment for space-evenly is safe center. If the container has only one child, the item will be centered.", - "stretch": "If the combined size of the items is less than the size of the container, any items that can grow will have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height, max-width, or equivalent functionality, so that the combined size of the items exactly fills the container. The default fallback alignment for stretch is flex-start in flexbox, and start in other layout modes. If there is only one item, and that item can grow, it will grow to fill the container." + "stretch": "If the combined size of the items is less than the size of the container, any items that can grow will have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height, max-width, or equivalent functionality, so that the combined size of the items exactly fills the container. The default fallback alignment for stretch is flex-start in flexbox, and start in other layout modes. If there is only one item, and that item can grow, it will grow to fill the container." } }, "content-position": { - "url": "$MDN_URL$/web/css/content-position", - "doc": "The <content-position> enumerated value type is used by justify-content and align-content properties, and the place-content shorthand, to align the box's contents within itself.", + "url": "$MDN_URL$/web/css/reference/values/content-position", + "doc": "The <content-position> enumerated value type is used by justify-content and align-content properties, and the place-content shorthand, to align the box's contents within itself.", "values": { "center": "Centers the alignment subject within its alignment container.", "start": "Aligns the alignment subject flush with the alignment container's start edge.", @@ -2415,7 +2445,7 @@ } }, "corner-shape-value": { - "url": "$MDN_URL$/web/css/corner-shape-value", + "url": "$MDN_URL$/web/css/reference/values/corner-shape-value", "status": [ "Experimental", "StandardTrack" @@ -2429,19 +2459,19 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The <corner-shape-value> CSS data type describes the shape of a container corner. It is used by the corner-shape shorthand property and its constituent properties to specify the shape to apply to affected container corners.", - "formalSyntax": "round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )", + "doc": "

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

\n

The <corner-shape-value> CSS data type describes the shape of a container corner. It is used by the corner-shape shorthand property and its constituent properties to specify the shape to apply to affected container corners.", + "formalSyntax": "round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )", "values": { "superellipse()": "Defines a custom corner superellipse shape. A negative parameter creates an inward, or concave, curve while a positive parameter creates an outward, or convex, curve.", - "Keywords": "The available keyword values are as follows:\n

\n
bevel
\n
\n

Defines a straight, diagonal corner, which is neither convex nor concave. The bevel keyword is equivalent to superellipse(0).\n

\n
notch
\n
\n

Defines a 90-degree concave square corner. The notch keyword is equivalent to superellipse(-infinity).\n

\n
round
\n
\n

Defines a convex ordinary ellipse, which is the standard rounded corner created by border-radius without a corner-shape applied. The round keyword is equivalent to superellipse(1). This is the default (initial) value for all corner-shape properties.\n

\n
scoop
\n
\n

Defines a concave ordinary ellipse. The scoop keyword is equivalent to superellipse(-1).\n

\n
square
\n
\n

Defines a 90-degree convex square corner, which is the default corner shape when no border-radius (or border-radius: 0) is applied. The square keyword is equivalent to superellipse(infinity).\n

\n
squircle
\n
\n

Defines a \"squircle\", which is a convex curve in between round and square. The squircle keyword is equivalent to superellipse(2).\n

\n
" + "Keywords": "The available keyword values are as follows:\n
\n
bevel
\n
\n

Defines a straight, diagonal corner, which is neither convex nor concave. The bevel keyword is equivalent to superellipse(0).\n

\n
notch
\n
\n

Defines a 90-degree concave square corner. The notch keyword is equivalent to superellipse(-infinity).\n

\n
round
\n
\n

Defines a convex ordinary ellipse, which is the standard rounded corner created by border-radius without a corner-shape applied. The round keyword is equivalent to superellipse(1). This is the default (initial) value for all corner-shape properties.\n

\n
scoop
\n
\n

Defines a concave ordinary ellipse. The scoop keyword is equivalent to superellipse(-1).\n

\n
square
\n
\n

Defines a 90-degree convex square corner, which is the default corner shape when no border-radius (or border-radius: 0) is applied. The square keyword is equivalent to superellipse(infinity).\n

\n
squircle
\n
\n

Defines a \"squircle\", which is a convex curve in between round and square. The squircle keyword is equivalent to superellipse(2).\n

\n
" } }, "custom-ident": { - "url": "$MDN_URL$/web/css/custom-ident", - "doc": "The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity." + "url": "$MDN_URL$/web/css/reference/values/custom-ident", + "doc": "The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity." }, "dashed-function": { - "url": "$MDN_URL$/web/css/dashed-function", + "url": "$MDN_URL$/web/css/reference/values/dashed-function", "status": [ "Experimental", "StandardTrack" @@ -2455,14 +2485,14 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The <dashed-function> CSS data type represents the syntax used to call CSS custom functions, which are defined using the @function at-rule." + "doc": "

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

\n

The <dashed-function> CSS data type represents the syntax used to call CSS custom functions, which are defined using the @function at-rule." }, "dashed-ident": { - "url": "$MDN_URL$/web/css/dashed-ident", - "doc": "The <dashed-ident> CSS data type denotes an arbitrary string used as an identifier." + "url": "$MDN_URL$/web/css/reference/values/dashed-ident", + "doc": "The <dashed-ident> CSS data type denotes an arbitrary string used as an identifier." }, "dimension": { - "url": "$MDN_URL$/web/css/dimension", + "url": "$MDN_URL$/web/css/reference/values/dimension", "status": [ "StandardTrack" ], @@ -2481,10 +2511,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <dimension> CSS data type represents a <number> with a unit attached to it, for example 10px.\n

CSS uses dimensions to specify distances (<length>), durations (<time>), frequencies (<frequency>), resolutions (<resolution>), and other quantities." + "doc": "The <dimension> CSS data type represents a <number> with a unit attached to it, for example 10px.\n

CSS uses dimensions to specify distances (<length>), durations (<time>), frequencies (<frequency>), resolutions (<resolution>), and other quantities." }, "display-box": { - "url": "$MDN_URL$/web/css/display-box", + "url": "$MDN_URL$/web/css/reference/values/display-box", "status": [ "StandardTrack" ], @@ -2507,7 +2537,7 @@ "formalSyntax": "contents | none" }, "display-inside": { - "url": "$MDN_URL$/web/css/display-inside", + "url": "$MDN_URL$/web/css/reference/values/display-inside", "status": [ "StandardTrack" ], @@ -2560,11 +2590,11 @@ "SafariIOS": "" } }, - "doc": "These keywords specify the element's inner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element). These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-outside> keywords.", + "doc": "These keywords specify the element's inner display type, which defines the type of formatting context that lays out its contents (assuming it is a non-replaced element). These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-outside> keywords.", "formalSyntax": "flow | flow-root | table | flex | grid | ruby" }, "display-internal": { - "url": "$MDN_URL$/web/css/display-internal", + "url": "$MDN_URL$/web/css/reference/values/display-internal", "status": [ "StandardTrack" ], @@ -2673,7 +2703,7 @@ "formalSyntax": "table-row-group | table-header-group | table-footer-group | table-row | table-cell | table-column-group | table-column | table-caption | ruby-base | ruby-text | ruby-base-container | ruby-text-container" }, "display-legacy": { - "url": "$MDN_URL$/web/css/display-legacy", + "url": "$MDN_URL$/web/css/reference/values/display-legacy", "status": [ "StandardTrack" ], @@ -2723,7 +2753,7 @@ "formalSyntax": "inline-block | inline-table | inline-flex | inline-grid" }, "display-listitem": { - "url": "$MDN_URL$/web/css/display-listitem", + "url": "$MDN_URL$/web/css/reference/values/display-listitem", "status": [ "StandardTrack" ], @@ -2742,11 +2772,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents.", + "doc": "The list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents.", "formalSyntax": "<display-outside>? &&[ flow | flow-root ]? &&list-item\n  <display-outside> = block | inline | run-in" }, "display-outside": { - "url": "$MDN_URL$/web/css/display-outside", + "url": "$MDN_URL$/web/css/reference/values/display-outside", "status": [ "StandardTrack" ], @@ -2760,11 +2790,11 @@ "Safari": "", "SafariIOS": "" }, - "doc": "The <display-outside> keywords specify the element's outer display type, which is essentially its role in flow layout. These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-inside> keywords.", + "doc": "The <display-outside> keywords specify the element's outer display type, which is essentially its role in flow layout. These keywords are used as values of the display property, and can be used for legacy purposes as a single keyword, or as defined in the Level 3 specification alongside a value from the <display-inside> keywords.", "formalSyntax": "block | inline | run-in" }, "easing-function": { - "url": "$MDN_URL$/web/css/easing-function", + "url": "$MDN_URL$/web/css/reference/values/easing-function", "status": [ "StandardTrack" ], @@ -2783,16 +2813,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <easing-function> CSS data type represents a mathematical function that describes the rate at which a value changes.\n

This transition between two values may be applied in different situations. It may be used to describe how fast values change during animations. This lets you vary the animation's speed over the course of its duration. You can specify an easing function for CSS transition and animation properties.", - "formalSyntax": "<linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", + "doc": "The <easing-function> CSS data type represents a mathematical function that describes the rate at which a value changes.\n

This transition between two values may be applied in different situations. It may be used to describe how fast values change during animations. This lets you vary the animation's speed over the course of its duration. You can specify an easing function for CSS transition and animation properties.", + "formalSyntax": "<linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", "values": { - "<linear-easing-function>": "Creates transitions that progress at a constant rate. This function can be specified using one of the following:\n

\n
linear
\n
\n

Specifies a constant rate of interpolation, with no change in the rate of progress throughout the duration (that is, no acceleration or deceleration).\nThis keyword value is equivalent to linear(0, 1).\nIt can also be represented as cubic-bezier(0, 0, 1, 1).\n

\n

Note:\nThe linear keyword is always interpreted as linear(0, 1), whereas the function linear(0, 1) is interpreted as linear(0 0%, 1 100%).\n

\n
\n
linear()
\n
\n

Defines multiple points of progress using <number> values, with optional <percentage> values to control their timing.\n

\n
", - "<cubic-bezier-easing-function>": "Creates smooth transitions with variable rates of change. This function can be specified using one of the following:\n
\n
ease
\n
\n

Represents the easing function cubic-bezier(0.25, 0.1, 0.25, 1).\nIt indicates that the interpolation starts slowly, accelerates sharply, and then slows gradually towards the end.\nIt is similar to the ease-in-out keyword, though it accelerates more sharply at the beginning.\n

\n
ease-in
\n
\n

Represents the easing function cubic-bezier(0.42, 0, 1, 1).\nIt indicates that the interpolation starts slowly, then progressively speeds up until the end, at which point it stops abruptly.\n

\n
ease-out
\n
\n

Represents the easing function cubic-bezier(0, 0, 0.58, 1).\nIt indicates that the interpolation starts abruptly and then progressively slows down towards the end.\n

\n
ease-in-out
\n
\n

Represents the easing function cubic-bezier(0.42, 0, 0.58, 1).\nIt indicates that the interpolation starts slowly, speeds up, and then slows down towards the end.\nAt the beginning, it behaves like the ease-in keyword; at the end, it is like the ease-out keyword.\n

\n
cubic-bezier()
\n
\n

Defines a custom curve using four <number> values that specify the coordinates of two control points.\nThe x-coordinates must be in the range [0, 1].\n

\n
", - "<step-easing-function>": "Creates stepped transitions that divides the animation into a set number of equal-length intervals, causing the animation to jump from one step to the next rather than transitioning smoothly.\nThis function can be specified using one of the following:\n
\n
step-start
\n
\n

Represents the easing function steps(1, jump-start) or steps(1, start).\nIt indicates that the interpolation jumps immediately to its final state, where it stays until the end.\n

\n
step-end
\n
\n

Represents the easing function steps(1, jump-end) or steps(1, end).\nIt indicates that the interpolation stays in its initial state until the end, at which point it jumps directly to its final state.\n

\n
steps()
\n
\n

Creates a stair-shaped curve using an <integer> to specify the number of intervals and an optional keyword to control the timing of jumps.\n

\n
" + "<linear-easing-function>": "Creates transitions that progress at a constant rate. This function can be specified using one of the following:\n
\n
linear
\n
\n

Specifies a constant rate of interpolation, with no change in the rate of progress throughout the duration (that is, no acceleration or deceleration).\nThis keyword value is equivalent to linear(0, 1).\nIt can also be represented as cubic-bezier(0, 0, 1, 1).\n

\n

Note:\nThe linear keyword is always interpreted as linear(0, 1), whereas the function linear(0, 1) is interpreted as linear(0 0%, 1 100%).\n

\n
\n
linear()
\n
\n

Defines multiple points of progress using <number> values, with optional <percentage> values to control their timing.\n

\n
", + "<cubic-bezier-easing-function>": "Creates smooth transitions with variable rates of change. This function can be specified using one of the following:\n
\n
ease
\n
\n

Represents the easing function cubic-bezier(0.25, 0.1, 0.25, 1).\nIt indicates that the interpolation starts slowly, accelerates sharply, and then slows gradually towards the end.\nIt is similar to the ease-in-out keyword, though it accelerates more sharply at the beginning.\n

\n
ease-in
\n
\n

Represents the easing function cubic-bezier(0.42, 0, 1, 1).\nIt indicates that the interpolation starts slowly, then progressively speeds up until the end, at which point it stops abruptly.\n

\n
ease-out
\n
\n

Represents the easing function cubic-bezier(0, 0, 0.58, 1).\nIt indicates that the interpolation starts abruptly and then progressively slows down towards the end.\n

\n
ease-in-out
\n
\n

Represents the easing function cubic-bezier(0.42, 0, 0.58, 1).\nIt indicates that the interpolation starts slowly, speeds up, and then slows down towards the end.\nAt the beginning, it behaves like the ease-in keyword; at the end, it is like the ease-out keyword.\n

\n
cubic-bezier()
\n
\n

Defines a custom curve using four <number> values that specify the coordinates of two control points.\nThe x-coordinates must be in the range [0, 1].\n

\n
", + "<step-easing-function>": "Creates stepped transitions that divides the animation into a set number of equal-length intervals, causing the animation to jump from one step to the next rather than transitioning smoothly.\nThis function can be specified using one of the following:\n
\n
step-start
\n
\n

Represents the easing function steps(1, jump-start) or steps(1, start).\nIt indicates that the interpolation jumps immediately to its final state, where it stays until the end.\n

\n
step-end
\n
\n

Represents the easing function steps(1, jump-end) or steps(1, end).\nIt indicates that the interpolation stays in its initial state until the end, at which point it jumps directly to its final state.\n

\n
steps()
\n
\n

Creates a stair-shaped curve using an <integer> to specify the number of intervals and an optional keyword to control the timing of jumps.\n

\n
" } }, "filter-function": { - "url": "$MDN_URL$/web/css/filter-function", + "url": "$MDN_URL$/web/css/reference/values/filter-function", "status": [ "StandardTrack" ], @@ -2811,11 +2841,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The <filter-function> CSS data type represents a graphical effect that can change the appearance of an input image. It is used in the filter and backdrop-filter properties.", + "doc": "The <filter-function> CSS data type represents a graphical effect that can change the appearance of an input image. It is used in the filter and backdrop-filter properties.", "formalSyntax": "<blur()> | <brightness()> | <contrast()> | <drop-shadow()> | <grayscale()> | <hue-rotate()> | <invert()> | <opacity()> | <sepia()> | <saturate()>\n  <blur()> = blur( <length>? )\n  <brightness()> = brightness( [ <number> | <percentage> ]? )\n  <contrast()> = contrast( [ <number> | <percentage> ]? )\n  <drop-shadow()> = drop-shadow( [ <color>? && <length>{2,3} ] )\n  <grayscale()> = grayscale( [ <number> | <percentage> ]? )\n  <hue-rotate()> = hue-rotate( [ <angle> | <zero> ]? )\n  <invert()> = invert( [ <number> | <percentage> ]? )\n  <opacity()> = opacity( [ <number> | <percentage> ]? )\n  <sepia()> = sepia( [ <number> | <percentage> ]? )\n  <saturate()> = saturate( [ <number> | <percentage> ]? )" }, "flex": { - "url": "$MDN_URL$/web/css/flex_value", + "url": "$MDN_URL$/web/css/reference/values/flex_value", "status": [ "StandardTrack" ], @@ -2834,20 +2864,20 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "The <flex> CSS data type denotes a flexible length within a grid container. It is used in grid-template-columns, grid-template-rows and other related properties." + "doc": "The <flex> CSS data type denotes a flexible length within a grid container. It is used in grid-template-columns, grid-template-rows and other related properties." }, "frequency": { - "url": "$MDN_URL$/web/css/frequency", - "doc": "The <frequency> CSS data type represents a frequency dimension, such as the pitch of a speaking voice. It is not currently used in any CSS properties." + "url": "$MDN_URL$/web/css/reference/values/frequency", + "doc": "The <frequency> CSS data type represents a frequency dimension, such as the pitch of a speaking voice. It is not currently used in any CSS properties." }, "frequency-percentage": { - "url": "$MDN_URL$/web/css/frequency-percentage", - "doc": "The <frequency-percentage> CSS data type represents a value that can be either a <frequency> or a <percentage>. Frequency values, e.g., the pitch of a speaking voice, are not currently used in any CSS properties.", + "url": "$MDN_URL$/web/css/reference/values/frequency-percentage", + "doc": "The <frequency-percentage> CSS data type represents a value that can be either a <frequency> or a <percentage>. Frequency values, e.g., the pitch of a speaking voice, are not currently used in any CSS properties.", "formalSyntax": "<frequency> | <percentage>" }, "generic-family": { - "url": "$MDN_URL$/web/css/generic-family", - "doc": "The <generic-family> CSS data type represents the keyword values for generic font families used in the font shorthand and font-family longhand properties. The <generic-family> represents one or more locally-installed fonts belonging to that category of fonts.", + "url": "$MDN_URL$/web/css/reference/values/generic-family", + "doc": "The <generic-family> CSS data type represents the keyword values for generic font families used in the font shorthand and font-family longhand properties. The <generic-family> represents one or more locally-installed fonts belonging to that category of fonts.", "formalSyntax": "serif | sans-serif | monospace | cursive | fantasy | system-ui | ui-serif | ui-sans-serif | ui-monospace | ui-rounded | math | fangsong", "values": { "serif": "A serif is a small line or stroke attached to the end of a larger stroke in a letter. In serif fonts, glyphs have finishing strokes, flared or tapering ends. Examples include Lucida Bright, Lucida Fax, Palatino, Palatino Linotype, Palladio, and URW Palladio.", @@ -2865,7 +2895,7 @@ } }, "gradient": { - "url": "$MDN_URL$/web/css/gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient", "status": [ "StandardTrack" ], @@ -2884,11 +2914,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <gradient> CSS data type is a special type of <image> that consists of a progressive transition between two or more colors.", + "doc": "The <gradient> CSS data type is a special type of <image> that consists of a progressive transition between two or more colors.", "formalSyntax": "<linear-gradient()> | <repeating-linear-gradient()> | <radial-gradient()> | <repeating-radial-gradient()>\n  <linear-gradient()> = linear-gradient( [ <linear-gradient-syntax> ] )\n  <repeating-linear-gradient()> = repeating-linear-gradient( [ <linear-gradient-syntax> ] )\n  <radial-gradient()> = radial-gradient( [ <radial-gradient-syntax> ] )\n  <repeating-radial-gradient()> = repeating-radial-gradient( [ <radial-gradient-syntax> ] )\n  <linear-gradient-syntax> = [ <angle> | <zero> | to <side-or-corner> ]? , <color-stop-list>\n  <radial-gradient-syntax> = [ <radial-shape> || <radial-size> ]? [ at <position> ]? , <color-stop-list>\n  <side-or-corner> = [ left | right ] || [ top | bottom ]\n  <color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?\n  <radial-shape> = circle | ellipse\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <linear-color-stop> = <color> <length-percentage>?\n  <linear-color-hint> = <length-percentage>\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <length-percentage> = <length> | <percentage>" }, "hex-color": { - "url": "$MDN_URL$/web/css/hex-color", + "url": "$MDN_URL$/web/css/reference/values/hex-color", "status": [ "StandardTrack" ], @@ -2907,10 +2937,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <hex-color> CSS data type is a notation for describing the hexadecimal color syntax of an sRGB color using its primary color components (red, green, blue) written as hexadecimal numbers, as well as its transparency.\n

A <hex-color> value can be used everywhere where a <color> can be used." + "doc": "The <hex-color> CSS data type is a notation for describing the hexadecimal color syntax of an sRGB color using its primary color components (red, green, blue) written as hexadecimal numbers, as well as its transparency.\n

A <hex-color> value can be used everywhere where a <color> can be used." }, "hue": { - "url": "$MDN_URL$/web/css/hue", + "url": "$MDN_URL$/web/css/reference/values/hue", "status": [ "StandardTrack" ], @@ -2956,7 +2986,7 @@ "SafariIOS": "15.4" } }, - "doc": "The <hue> CSS data type represents the hue angle of a color.\nIt is used in the color functions that accept hue expressed as a single value, specifically hsl(), hwb(), lch(), and oklch() functional notations.", + "doc": "The <hue> CSS data type represents the hue angle of a color.\nIt is used in the color functions that accept hue expressed as a single value, specifically hsl(), hwb(), lch(), and oklch() functional notations.", "formalSyntax": "<number> | <angle>", "values": { "<angle>": "An angle expressed in degrees, gradians, radians, or turns using the deg, grad, rad, or turn, respectively.", @@ -2964,7 +2994,7 @@ } }, "hue-interpolation-method": { - "url": "$MDN_URL$/web/css/hue-interpolation-method", + "url": "$MDN_URL$/web/css/reference/values/hue-interpolation-method", "status": [ "StandardTrack" ], @@ -2982,7 +3012,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "The <hue-interpolation-method> CSS data type represents the algorithm used for interpolation between <hue> values.\nThe interpolation method specifies how to find a midpoint between two hue values based on a color wheel.\nIt is used as a component of the <color-interpolation-method> data type.\n

When interpolating <hue> values, the hue interpolation algorithm defaults to shorter.", + "doc": "The <hue-interpolation-method> CSS data type represents the algorithm used for interpolation between <hue> values.\nThe interpolation method specifies how to find a midpoint between two hue values based on a color wheel.\nIt is used as a component of the <color-interpolation-method> data type.\n

When interpolating <hue> values, the hue interpolation algorithm defaults to shorter.", "formalSyntax": "[ shorter | longer | increasing | decreasing ] hue", "values": { "shorter": "Use the shorter arc. When the two radii coincide, the arc degenerates to a single point. When both arcs have the same lengths:\n

\n
\n\n\n\n\n\n\n
θ1 = 45deg, θ2 = 135degθ1 = 135deg, θ2 = 45deg
", @@ -2992,11 +3022,11 @@ } }, "ident": { - "url": "$MDN_URL$/web/css/ident", - "doc": "The <ident> CSS data type denotes an arbitrary string used as an identifier." + "url": "$MDN_URL$/web/css/reference/values/ident", + "doc": "The <ident> CSS data type denotes an arbitrary string used as an identifier." }, "image": { - "url": "$MDN_URL$/web/css/image", + "url": "$MDN_URL$/web/css/reference/values/image", "status": [ "StandardTrack" ], @@ -3015,11 +3045,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <image> CSS data type represents a two-dimensional image.", + "doc": "The <image> CSS data type represents a two-dimensional image.", "formalSyntax": "<url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )" }, "inherit": { - "url": "$MDN_URL$/web/css/inherit", + "url": "$MDN_URL$/web/css/reference/values/inherit", "status": [ "StandardTrack" ], @@ -3038,10 +3068,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The inherit CSS keyword causes the element to take the computed value of the property from its parent element. It can be applied to any CSS property, including the CSS shorthand property all.\n

For inherited properties, this reinforces the default behavior, and is only needed to override another rule.\n

\n

Note:\nInheritance is always from the parent element in the document tree, even when the parent element is not the containing block.\n

" + "doc": "The inherit CSS keyword causes the element to take the computed value of the property from its parent element. It can be applied to any CSS property, including the CSS shorthand property all.\n

For inherited properties, this reinforces the default behavior, and is only needed to override another rule.\n

\n

Note:\nInheritance is always from the parent element in the document tree, even when the parent element is not the containing block.\n

" }, "initial": { - "url": "$MDN_URL$/web/css/initial", + "url": "$MDN_URL$/web/css/reference/values/initial", "status": [ "StandardTrack" ], @@ -3060,10 +3090,10 @@ "lowDate": "2015-11-12", "highDate": "2018-05-12" }, - "doc": "The initial CSS keyword applies the initial (or default) value of a property to an element. It can be applied to any CSS property, including the CSS shorthand property all. With all set to initial, all CSS properties can be restored to their respective initial values in one go instead of restoring each one separately.\n

On inherited properties, the initial value may be unexpected. You should consider using the inherit, unset, revert, or revert-layer keywords instead." + "doc": "The initial CSS keyword applies the initial (or default) value of a property to an element. It can be applied to any CSS property, including the CSS shorthand property all. With all set to initial, all CSS properties can be restored to their respective initial values in one go instead of restoring each one separately.\n

On inherited properties, the initial value may be unexpected. You should consider using the inherit, unset, revert, or revert-layer keywords instead." }, "integer": { - "url": "$MDN_URL$/web/css/integer", + "url": "$MDN_URL$/web/css/reference/values/integer", "status": [ "StandardTrack" ], @@ -3082,10 +3112,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <integer> CSS data type is a special type of <number> that represents a positive or negative whole number. Integers can be used in numerous CSS properties and descriptors, such as the column-count, counter-increment, grid-column, grid-row, and z-index properties and the range descriptor." + "doc": "The <integer> CSS data type is a special type of <number> that represents a positive or negative whole number. Integers can be used in numerous CSS properties and descriptors, such as the column-count, counter-increment, grid-column, grid-row, and z-index properties and the range descriptor." }, "length": { - "url": "$MDN_URL$/web/css/length", + "url": "$MDN_URL$/web/css/reference/values/length", "status": [ "StandardTrack" ], @@ -3104,10 +3134,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <length> CSS data type represents a distance value. Lengths can be used in numerous CSS properties, such as width, height, margin, padding, border-width, font-size, and text-shadow.\n

\n

Note:\nAlthough <percentage> values are usable in some of the same properties that accept <length> values, they are not themselves <length> values. See <length-percentage>.\n

" + "doc": "The <length> CSS data type represents a distance value. Lengths can be used in numerous CSS properties, such as width, height, margin, padding, border-width, font-size, and text-shadow.\n
\n

Note:\nAlthough <percentage> values are usable in some of the same properties that accept <length> values, they are not themselves <length> values. See <length-percentage>.\n

" }, "length-percentage": { - "url": "$MDN_URL$/web/css/length-percentage", + "url": "$MDN_URL$/web/css/reference/values/length-percentage", "status": [ "StandardTrack" ], @@ -3126,11 +3156,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <length-percentage> CSS data type represents a value that can be either a <length> or a <percentage>.", + "doc": "The <length-percentage> CSS data type represents a value that can be either a <length> or a <percentage>.", "formalSyntax": "<length> | <percentage>" }, "line-style": { - "url": "$MDN_URL$/web/css/line-style", + "url": "$MDN_URL$/web/css/reference/values/line-style", "status": [ "StandardTrack" ], @@ -3149,7 +3179,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <line-style> enumerated value type represents keyword values that define the style of a line, or the lack of a line. The <line-style> keyword values are used in the following longhand and shorthand border and column properties:\n", + "doc": "The <line-style> enumerated value type represents keyword values that define the style of a line, or the lack of a line. The <line-style> keyword values are used in the following longhand and shorthand border and column properties:\n", "formalSyntax": "none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { "none": "Displays no line. The computed value of the line width is 0 even if a width value is specified. In the case of table cell and border collapsing, the none value has the lowest priority. If any other conflicting border is set, it will be displayed. The none value is similar to hidden.", @@ -3160,12 +3190,12 @@ "double": "Displays two straight lines with some space between them. The length of the lines adds up to the pixel size defined by the line's width.", "groove": "Displays a border with a carved appearance. This value is the opposite of ridge.", "ridge": "Displays a border with an extruded appearance. This value is the opposite of groove.", - "inset": "Displays a border that makes the element appear embedded. This value is the opposite of outset. When applied to a table cell border and border-collapse is set to collapsed, this value behaves like groove.", - "outset": "Displays a border that makes the element appear embossed. This value is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge." + "inset": "Displays a border that makes the element appear embedded. This value is the opposite of outset. When applied to a table cell border and border-collapse is set to collapsed, this value behaves like groove.", + "outset": "Displays a border that makes the element appear embossed. This value is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge." } }, "named-color": { - "url": "$MDN_URL$/web/css/named-color", + "url": "$MDN_URL$/web/css/reference/values/named-color", "status": [ "StandardTrack" ], @@ -3184,10 +3214,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <named-color> CSS data type is the name of a color, such as red, blue, black, or lightseagreen. Syntactically, a <named-color> is an <ident>.\n

A <named-color> value can be used anywhere a <color> can be used." + "doc": "The <named-color> CSS data type is the name of a color, such as red, blue, black, or lightseagreen. Syntactically, a <named-color> is an <ident>.\n

A <named-color> value can be used anywhere a <color> can be used." }, "number": { - "url": "$MDN_URL$/web/css/number", + "url": "$MDN_URL$/web/css/reference/values/number", "status": [ "StandardTrack" ], @@ -3206,10 +3236,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <number> CSS data type represents a number, being either an integer, a number with a fractional component, or a base-ten exponent in scientific notation." + "doc": "The <number> CSS data type represents a number, being either an integer, a number with a fractional component, or a base-ten exponent in scientific notation." }, "overflow": { - "url": "$MDN_URL$/web/css/overflow_value", + "url": "$MDN_URL$/web/css/reference/values/overflow_value", "status": [ "StandardTrack" ], @@ -3228,25 +3258,25 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <overflow> enumerated value type represents the keyword values for the overflow-block, overflow-inline, overflow-x, and overflow-y longhand properties and the overflow shorthand property. These properties apply to block containers, flex containers, and grid containers.", + "doc": "The <overflow> enumerated value type represents the keyword values for the overflow-block, overflow-inline, overflow-x, and overflow-y longhand properties and the overflow shorthand property. These properties apply to block containers, flex containers, and grid containers.", "values": { "visible": "Overflow content is not clipped and may be visible outside the element's padding box. The element box is not a scroll container. This is the default value for all the properties that have the <overflow> enumerated value type.", "hidden": "Overflow content is clipped at the element's padding box. There are no scroll bars, and the clipped content is not visible (i.e., clipped content is hidden), but the content still exists. User agents do not add scrollbars and also do not allow users to view the content outside the clipped region by actions such as dragging on a touch screen or using the scroll wheel on a mouse. The content can be scrolled programmatically (for example, by setting the value of the scrollLeft property or the scrollTo() method). The content can also be scrolled via keyboard interaction; arrows enable scrolling through the content and tabbing to a focusable element within the hidden content enables scrolling the focused element into view. The element box on which this value is set is a scroll container.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. Overflow content outside the clipped region is not visible, user agents do not add a scrollbar, and programmatic scrolling is also not supported. No new formatting context is created.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. Overflow content outside the clipped region is not visible, user agents do not add a scrollbar, and programmatic scrolling is also not supported. No new formatting context is created.", "scroll": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view using scrollbars. User agents display scrollbars in both horizontal and vertical directions if only one value is set, whether or not any content is overflowing or clipped. The use of this keyword value, therefore, can prevent scrollbars from appearing and disappearing as content changes. Printers may still print overflowing content. The element box on which this value is set is a scroll container.", "auto": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view. Unlike scroll, user agents display scrollbars only if the content is overflowing and hide scrollbars by default. If content fits inside the element's padding box, it looks the same as with visible but still establishes a new formatting context. The element box on which this value is set is a scroll container." } }, "overflow-position": { - "url": "$MDN_URL$/web/css/overflow-position", - "doc": "The <overflow-position> enumerated value type defines how an alignment subject that is larger than its alignment container will overflow that container. For example, if centered items are wider than their container, the overflow may be displayed beyond the viewport's start edge, which can't be scrolled to. The <overflow-position> value defines whether the alignment mode should be overridden to ensure the content is visible (safe) or if the alignment mode must be adhered to (unsafe).\n

This data type is valid for the align-content, align-items, align-self, justify-items and justify-self properties as well as the place-content, place-items, and place-self shorthand properties.\nIf omitted, the default overflow alignment is a blend of safe and unsafe.", + "url": "$MDN_URL$/web/css/reference/values/overflow-position", + "doc": "The <overflow-position> enumerated value type defines how an alignment subject that is larger than its alignment container will overflow that container. For example, if centered items are wider than their container, the overflow may be displayed beyond the viewport's start edge, which can't be scrolled to. The <overflow-position> value defines whether the alignment mode should be overridden to ensure the content is visible (safe) or if the alignment mode must be adhered to (unsafe).\n

This data type is valid for the align-content, align-items, align-self, justify-items and justify-self properties as well as the place-content, place-items, and place-self shorthand properties.\nIf omitted, the default overflow alignment is a blend of safe and unsafe.", "values": { "safe": "If the size of the alignment subject overflows the alignment container, the alignment subject is instead aligned as if the alignment mode were start.", "unsafe": "Regardless of the relative sizes of the alignment subject and alignment container, the given alignment value is honored." } }, "percentage": { - "url": "$MDN_URL$/web/css/percentage", + "url": "$MDN_URL$/web/css/reference/values/percentage", "status": [ "StandardTrack" ], @@ -3265,10 +3295,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <percentage> CSS data type represents a percentage value. It is often used to define a size as relative to an element's parent object. Numerous properties can use percentages, such as width, height, margin, padding, and font-size.\n

\n

Note:\nOnly calculated values can be inherited. Thus, even if a percentage value is used on the parent property, a real value (such as a width in pixels for a <length> value) will be accessible on the inherited property, not the percentage value.\n

" + "doc": "The <percentage> CSS data type represents a percentage value. It is often used to define a size as relative to an element's parent object. Numerous properties can use percentages, such as width, height, margin, padding, and font-size.\n
\n

Note:\nOnly calculated values can be inherited. Thus, even if a percentage value is used on the parent property, a real value (such as a width in pixels for a <length> value) will be accessible on the inherited property, not the percentage value.\n

" }, "position": { - "url": "$MDN_URL$/web/css/position_value", + "url": "$MDN_URL$/web/css/reference/values/position_value", "status": [ "StandardTrack" ], @@ -3287,11 +3317,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <position> CSS data type denotes a two-dimensional coordinate used to set a location relative to an element box. It is used in the background-position, object-position, mask-position offset-position, offset-anchor and transform-origin properties.\n
\n

Note:\nThe final position described by the <position> value does not need to be inside the element's box.\n

", + "doc": "The <position> CSS data type denotes a two-dimensional coordinate used to set a location relative to an element box. It is used in the background-position, object-position, mask-position offset-position, offset-anchor and transform-origin properties.\n
\n

Note:\nThe final position described by the <position> value does not need to be inside the element's box.\n

", "formalSyntax": "[ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>" }, "ratio": { - "url": "$MDN_URL$/web/css/ratio", + "url": "$MDN_URL$/web/css/reference/values/ratio", "status": [ "StandardTrack" ], @@ -3310,19 +3340,19 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <ratio> CSS data type describes the proportional relationship between two values. It mostly represents the aspect ratio, which relates width to height. For example, the <ratio> is used as a value for the aspect-ratio media feature in @media media queries, the aspect-ratio size feature in @container container queries, and as a value for the CSS aspect-ratio property.", + "doc": "The <ratio> CSS data type describes the proportional relationship between two values. It mostly represents the aspect ratio, which relates width to height. For example, the <ratio> is used as a value for the aspect-ratio media feature in @media media queries, the aspect-ratio size feature in @container container queries, and as a value for the CSS aspect-ratio property.", "formalSyntax": "<number [0,∞]> [ / <number [0,∞]> ]?" }, "relative-size": { - "url": "$MDN_URL$/web/css/relative-size", - "doc": "The <relative-size> CSS data type describes relative size keywords. The <relative-size> keywords define a size relative to the computed size of the parent element. This data type is used in the font shorthand and font-size properties.", + "url": "$MDN_URL$/web/css/reference/values/relative-size", + "doc": "The <relative-size> CSS data type describes relative size keywords. The <relative-size> keywords define a size relative to the computed size of the parent element. This data type is used in the font shorthand and font-size properties.", "values": { "smaller": "A relative size one size smaller than the inherited size.", "larger": "A relative size one size larger than the inherited size." } }, "resolution": { - "url": "$MDN_URL$/web/css/resolution", + "url": "$MDN_URL$/web/css/reference/values/resolution", "status": [ "StandardTrack" ], @@ -3341,10 +3371,10 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution.\n

On screens, the units are related to CSS inches, centimeters, or pixels, not physical values." + "doc": "The <resolution> CSS data type, used for describing resolutions in media queries, denotes the pixel density of an output device, i.e., its resolution.\n

On screens, the units are related to CSS inches, centimeters, or pixels, not physical values." }, "revert": { - "url": "$MDN_URL$/web/css/revert", + "url": "$MDN_URL$/web/css/reference/values/revert", "status": [ "StandardTrack" ], @@ -3363,10 +3393,10 @@ "lowDate": "2020-07-27", "highDate": "2023-01-27" }, - "doc": "The revert CSS keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the current element. Thus, it resets the property either to user agent set value, to user set value, to its inherited value (if it is inheritable), or to initial value. It can be applied to any CSS property, including the CSS shorthand property all.\n

This keyword removes from the cascade all of the styles that have been overridden until the style being rolled back to is reached.\n

\n

The revert keyword works exactly the same as unset in many cases. The only difference is for properties that have values set by the browser or by custom stylesheets created by users (set on the browser side).\n

Revert will not affect rules applied to children of an element you reset (but will remove effects of a parent rule on a child). So if you have a color: green for all sections and all: revert on a specific section, the color of the section will be black. But if you have a rule to make all paragraphs red, then all paragraphs will still be red in all sections.\n

\n

Note:\nRevert is just a value. It is still possible to override the revert value using specificity.\n

\n
\n

Note:\nThe revert keyword is different from and should not be confused with the initial keyword, which uses the initial value defined on a per-property basis by the CSS specifications. In contrast, user-agent stylesheets set default values on the basis of CSS selectors.\n

For example, the initial value for the display property is inline, whereas a normal user-agent stylesheet sets the default display value of <div>s to block, of <table>s to table, etc.\n

" + "doc": "The revert CSS keyword reverts the cascaded value of the property from its current value to the value the property would have had if no changes had been made by the current style origin to the current element. Thus, it resets the property either to user agent set value, to user set value, to its inherited value (if it is inheritable), or to initial value. It can be applied to any CSS property, including the CSS shorthand property all.\n

This keyword removes from the cascade all of the styles that have been overridden until the style being rolled back to is reached.\n

\n

The revert keyword works exactly the same as unset in many cases. The only difference is for properties that have values set by the browser or by custom stylesheets created by users (set on the browser side).\n

Revert will not affect rules applied to children of an element you reset (but will remove effects of a parent rule on a child). So if you have a color: green for all sections and all: revert on a specific section, the color of the section will be black. But if you have a rule to make all paragraphs red, then all paragraphs will still be red in all sections.\n

\n

Note:\nRevert is just a value. It is still possible to override the revert value using specificity.\n

\n
\n

Note:\nThe revert keyword is different from and should not be confused with the initial keyword, which uses the initial value defined on a per-property basis by the CSS specifications. In contrast, user-agent stylesheets set default values on the basis of CSS selectors.\n

For example, the initial value for the display property is inline, whereas a normal user-agent stylesheet sets the default display value of <div>s to block, of <table>s to table, etc.\n

" }, "revert-layer": { - "url": "$MDN_URL$/web/css/revert-layer", + "url": "$MDN_URL$/web/css/reference/values/revert-layer", "status": [ "StandardTrack" ], @@ -3385,11 +3415,11 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The revert-layer CSS-wide keyword rolls back the value of a property in a cascade layer to the value of the property in a CSS rule matching the element in a previous cascade layer. The value of a property with this keyword is recalculated as if no rules were specified on the target element in the current cascade layer.\n

If there is no other cascade layer to revert to for the matching CSS rule, the property value rolls back to the computed value derived from the current layer. Furthermore, if there is no matching CSS rule in the current layer, the property value for the element rolls back to the style defined in a previous style origin.\n

This keyword can be applied to any CSS property, including the CSS shorthand property all." + "doc": "The revert-layer CSS-wide keyword rolls back the value of a property in a cascade layer to the value of the property in a CSS rule matching the element in a previous cascade layer. The value of a property with this keyword is recalculated as if no rules were specified on the target element in the current cascade layer.\n

If there is no other cascade layer to revert to for the matching CSS rule, the property value rolls back to the computed value derived from the current layer. Furthermore, if there is no matching CSS rule in the current layer, the property value for the element rolls back to the style defined in a previous style origin.\n

This keyword can be applied to any CSS property, including the CSS shorthand property all." }, "self-position": { - "url": "$MDN_URL$/web/css/self-position", - "doc": "The <self-position> enumerated value data type is used by the justify-self and align-self properties, and the place-self shorthand, to align the box within its alignment container. It is also used by the justify-items and align-items properties, and the place-items shorthand, to specify default values for justify-self and align-self.", + "url": "$MDN_URL$/web/css/reference/values/self-position", + "doc": "The <self-position> enumerated value data type is used by the justify-self and align-self properties, and the place-self shorthand, to align the box within its alignment container. It is also used by the justify-items and align-items properties, and the place-items shorthand, to specify default values for justify-self and align-self.", "values": { "center": "Centers the alignment subject within its alignment container.", "start": "Aligns the alignment subject flush with the alignment container's start edge.", @@ -3401,7 +3431,7 @@ } }, "shape": { - "url": "$MDN_URL$/web/css/shape", + "url": "$MDN_URL$/web/css/reference/values/shape", "status": [ "StandardTrack", "Deprecated" @@ -3416,16 +3446,16 @@ "Safari": "1.3", "SafariIOS": "" }, - "doc": "

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.

\n

The <shape> CSS data type defines the specific form (shape) of a region. The region represents the part of an element to which the clip property applies.\n

\n

Note:\n<shape> and rect() work in conjunction with clip, which has been deprecated in favor of clip-path. When possible, use clip-path and the <basic-shape> data type instead.\n

", + "doc": "

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.

\n

The <shape> CSS data type defines the specific form (shape) of a region. The region represents the part of an element to which the clip property applies.\n

\n

Note:\n<shape> and rect() work in conjunction with clip, which has been deprecated in favor of clip-path. When possible, use clip-path and the <basic-shape> data type instead.\n

", "values": { - "top": "Is a <length> representing the offset for the top of the rectangle relative to the top border of the element's box.", - "right": "Is a <length> representing the offset for the right of the rectangle relative to the left border of the element's box.", - "bottom": "Is a <length> representing the offset for the bottom of the rectangle relative to the top border of the element's box.", - "left": "Is a <length> representing the offset for the left of the rectangle relative to the left border of the element's box." + "top": "Is a <length> representing the offset for the top of the rectangle relative to the top border of the element's box.", + "right": "Is a <length> representing the offset for the right of the rectangle relative to the left border of the element's box.", + "bottom": "Is a <length> representing the offset for the bottom of the rectangle relative to the top border of the element's box.", + "left": "Is a <length> representing the offset for the left of the rectangle relative to the left border of the element's box." } }, "string": { - "url": "$MDN_URL$/web/css/string", + "url": "$MDN_URL$/web/css/reference/values/string", "status": [ "StandardTrack" ], @@ -3444,10 +3474,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content, font-family, and quotes." + "doc": "The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content, font-family, and quotes." }, "system-color": { - "url": "$MDN_URL$/web/css/system-color", + "url": "$MDN_URL$/web/css/reference/values/system-color", "status": [ "StandardTrack" ], @@ -3466,10 +3496,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <system-color> CSS data type usually reflects the default color choices used for the different parts of a web page.\n

However, user agents can provide an accessibility feature called forced colors mode, in which colors are restricted into a user- and user agent-defined palette, overriding the author's choice of colors in certain properties. In forced colors mode, <system-color> exposes the chosen colors, so that the rest of the page can integrate with them. An example of forced colors mode is high contrast mode on Windows.\n

In forced colors mode, authors should use colors from the <system-color> type for all properties that are not in the set of properties whose colors are overridden. This ensures that the page consistently uses the same color palette across all properties.\n

Authors can detect forced colors mode using the forced-colors media feature.\n

A <system-color> value can be used anywhere a <color> can be used." + "doc": "The <system-color> CSS data type usually reflects the default color choices used for the different parts of a web page.\n

However, user agents can provide an accessibility feature called forced colors mode, in which colors are restricted into a user- and user agent-defined palette, overriding the author's choice of colors in certain properties. In forced colors mode, <system-color> exposes the chosen colors, so that the rest of the page can integrate with them. An example of forced colors mode is high contrast mode on Windows.\n

In forced colors mode, authors should use colors from the <system-color> type for all properties that are not in the set of properties whose colors are overridden. This ensures that the page consistently uses the same color palette across all properties.\n

Authors can detect forced colors mode using the forced-colors media feature.\n

A <system-color> value can be used anywhere a <color> can be used." }, "text-edge": { - "url": "$MDN_URL$/web/css/text-edge", + "url": "$MDN_URL$/web/css/reference/values/text-edge", "status": [ "StandardTrack" ], @@ -3484,17 +3514,17 @@ "baseline": { "level": "NONE" }, - "doc": "The <text-edge> enumerated data type defines keywords that specify font metrics representing specific regions on a font's block-start edge and block-end edge. Each keyword specifies a position of a font's over and/or under edge.\n

The <text-edge> values are used in the text-box-edge property to specify an amount of space to trim from the block-start and block-end edge of a text element's block container.", + "doc": "The <text-edge> enumerated data type defines keywords that specify font metrics representing specific regions on a font's block-start edge and block-end edge. Each keyword specifies a position of a font's over and/or under edge.\n

The <text-edge> values are used in the text-box-edge property to specify an amount of space to trim from the block-start and block-end edge of a text element's block container.", "formalSyntax": "[ text | ideographic | ideographic-ink ] | [ text | ideographic | ideographic-ink | cap | ex ] [ text | ideographic | ideographic-ink | alphabetic ]", "values": { - "text": "The font's over and under edges are its text-over baseline/text-under baseline: this includes the font's ascenders and descenders but excludes the half-leading set on the text.\n

\n

Note:\nThe amount of half-leading included on a text element can be controlled using the line-height property.\n

The font's over edge is its text-over baseline (includes the font's ascenders but excludes the over edge half-leading), or its under edge is its text-under baseline (includes the font's descenders but excludes the under edge half-leading), depending on which edge the value is set for.", + "text": "The font's over and under edges are its text-over baseline/text-under baseline: this includes the font's ascenders and descenders but excludes the half-leading set on the text.\n

\n

Note:\nThe amount of half-leading included on a text element can be controlled using the line-height property.\n

The font's over edge is its text-over baseline (includes the font's ascenders but excludes the over edge half-leading), or its under edge is its text-under baseline (includes the font's descenders but excludes the under edge half-leading), depending on which edge the value is set for.", "alphabetic": "The font's under edge is its alphabetic baseline, which is the bottom of its short lower-case letters (for example, \"m\", \"n\", and \"o\") or capital letters.", "cap": "The font's over edge is its cap-height baseline, which is the top of its capital letters.", "ex": "The font's over edge is its x-height baseline, which is the top of its short lower-case letters." } }, "time": { - "url": "$MDN_URL$/web/css/time", + "url": "$MDN_URL$/web/css/reference/values/time", "status": [ "StandardTrack" ], @@ -3513,15 +3543,20 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <time> CSS data type represents a time value expressed in seconds or milliseconds. It is used in animation, transition, and related properties." + "doc": "The <time> CSS data type represents a time value expressed in seconds or milliseconds. It is used in animation, transition, and related properties." }, "time-percentage": { - "url": "$MDN_URL$/web/css/time-percentage", - "doc": "The <time-percentage> CSS data type represents a value that can be either a <time> or a <percentage>.", + "url": "$MDN_URL$/web/css/reference/values/time-percentage", + "doc": "The <time-percentage> CSS data type represents a value that can be either a <time> or a <percentage>.", "formalSyntax": "<time> | <percentage>" }, + "timeline-range-name": { + "url": "$MDN_URL$/web/css/reference/values/timeline-range-name", + "doc": "The <timeline-range-name> enumerated data type is a CSS identifier representing one of the predefined named timeline ranges inside a view progress timeline.\n

The <timeline-range-name> keyword values are used in keyframe selectors and the following longhand and shorthand properties:\n

", + "formalSyntax": "cover | contain | entry | exit | entry-crossing | exit-crossing" + }, "transform-function": { - "url": "$MDN_URL$/web/css/transform-function", + "url": "$MDN_URL$/web/css/reference/values/transform-function", "status": [ "StandardTrack" ], @@ -3540,10 +3575,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <transform-function> CSS data type represents a transformation that affects an element's appearance. Transformation functions can rotate, resize, distort, or move an element in 2D or 3D space. It is used in the transform property." + "doc": "The <transform-function> CSS data type represents a transformation that affects an element's appearance. Transformation functions can rotate, resize, distort, or move an element in 2D or 3D space. It is used in the transform property." }, "unset": { - "url": "$MDN_URL$/web/css/unset", + "url": "$MDN_URL$/web/css/reference/values/unset", "status": [ "StandardTrack" ], @@ -3562,12 +3597,12 @@ "lowDate": "2016-03-21", "highDate": "2018-09-21" }, - "doc": "The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not. In other words, it behaves like the inherit keyword in the first case, when the property is an inherited property, and like the initial keyword in the second case, when the property is a non-inherited property.\n

unset can be applied to any CSS property, including the CSS shorthand property all." + "doc": "The unset CSS keyword resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not. In other words, it behaves like the inherit keyword in the first case, when the property is an inherited property, and like the initial keyword in the second case, when the property is a non-inherited property.\n

unset can be applied to any CSS property, including the CSS shorthand property all." } }, "functions": { "abs": { - "url": "$MDN_URL$/web/css/abs", + "url": "$MDN_URL$/web/css/reference/values/abs", "status": [ "StandardTrack" ], @@ -3585,11 +3620,11 @@ "level": "LOW", "lowDate": "2025-06-26" }, - "doc": "The abs() CSS function returns the absolute value of the argument, as the same type as the input.", + "doc": "The abs() CSS function returns the absolute value of the argument, as the same type as the input.", "formalSyntax": "abs( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "acos": { - "url": "$MDN_URL$/web/css/acos", + "url": "$MDN_URL$/web/css/reference/values/acos", "status": [ "StandardTrack" ], @@ -3608,11 +3643,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The acos() CSS function is a trigonometric function that returns the inverse cosine of a number between -1 and 1. The function contains a single calculation that returns the number of radians representing an <angle> between 0deg and 180deg.", + "doc": "The acos() CSS function is a trigonometric function that returns the inverse cosine of a number between -1 and 1. The function contains a single calculation that returns an <angle> between 0deg and 180deg.", "formalSyntax": "acos( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "anchor": { - "url": "$MDN_URL$/web/css/anchor", + "url": "$MDN_URL$/web/css/reference/values/anchor", "status": [ "StandardTrack" ], @@ -3620,18 +3655,21 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The anchor() CSS function can be used within an anchor-positioned element's inset property values, returning a length value relative to the position of the edges of its associated anchor element.", + "doc": "The anchor() CSS function can be used within an anchor-positioned element's inset property values, returning a length value relative to the position of the edges of its associated anchor element.", "formalSyntax": "anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <length-percentage> = <length> | <percentage>" }, "anchor-size": { - "url": "$MDN_URL$/web/css/anchor-size", + "url": "$MDN_URL$/web/css/reference/values/anchor-size", "status": [ "StandardTrack" ], @@ -3639,18 +3677,21 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The anchor-size() CSS function enables setting anchor-positioned element's size, position, and margins relative to the dimensions of anchor elements. It returns the <length> of a specified side of the target anchor element. anchor-size() is only valid when used within the value of anchor-positioned elements' sizing, inset, and margin properties.\n

For detailed information on anchor features and usage, see the CSS anchor positioning module landing page and the Using CSS anchor positioning guide.", + "doc": "The anchor-size() CSS function enables setting anchor-positioned element's size, position, and margins relative to the dimensions of anchor elements. It returns the <length> of a specified side of the target anchor element. anchor-size() is only valid when used within the value of anchor-positioned elements' sizing, inset, and margin properties.\n

For detailed information on anchor features and usage, see the CSS anchor positioning module and the Using CSS anchor positioning guide.", "formalSyntax": "anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <length-percentage> = <length> | <percentage>" }, "asin": { - "url": "$MDN_URL$/web/css/asin", + "url": "$MDN_URL$/web/css/reference/values/asin", "status": [ "StandardTrack" ], @@ -3669,11 +3710,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The asin() CSS function is a trigonometric function that returns the inverse sine of a number between -1 and 1. The function contains a single calculation that returns the number of radians representing an <angle> between -90deg and 90deg.", + "doc": "The asin() CSS function is a trigonometric function that returns the inverse sine of a number between -1 and 1. The function contains a single calculation that returns an <angle> between -90deg and 90deg.", "formalSyntax": "asin( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "atan": { - "url": "$MDN_URL$/web/css/atan", + "url": "$MDN_URL$/web/css/reference/values/atan", "status": [ "StandardTrack" ], @@ -3692,11 +3733,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The atan() CSS function is a trigonometric function that returns the inverse tangent of a number between -∞ and +∞. The function contains a single calculation that returns the number of radians representing an <angle> between -90deg and 90deg.", + "doc": "The atan() CSS function is a trigonometric function that returns the inverse tangent of a number between -∞ and +∞. The function contains a single calculation that returns an <angle> between -90deg and 90deg.", "formalSyntax": "atan( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "atan2": { - "url": "$MDN_URL$/web/css/atan2", + "url": "$MDN_URL$/web/css/reference/values/atan2", "status": [ "StandardTrack" ], @@ -3715,11 +3756,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The atan2() CSS function is a trigonometric function that returns the inverse tangent of two values between -infinity and infinity. The function accepts two arguments and returns the number of radians representing an <angle> between -180deg and 180deg.", + "doc": "The atan2() CSS function is a trigonometric function that returns the inverse tangent of two values between -infinity and infinity. The function accepts two arguments and returns an <angle> between -180deg and 180deg, without implying any specific unit such as radians.", "formalSyntax": "atan2( <calc-sum> , <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "attr": { - "url": "$MDN_URL$/web/css/attr", + "url": "$MDN_URL$/web/css/reference/values/attr", "status": [ "StandardTrack" ], @@ -3738,11 +3779,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

\n

Note:\nThe attr() function can be used with any CSS property, but support for properties other than content is experimental.\n

\n

The attr() CSS function is used to retrieve the value of an attribute of the selected element and use it in a property value, similar to how the var() function substitutes a custom property value. It can also be used with pseudo-elements, in which case the attribute's value on the pseudo-element's originating element is returned.", + "doc": "

\n

Note:\nThe attr() function can be used with any CSS property, but support for properties other than content is experimental.\n

\n

The attr() CSS function is used to retrieve the value of an attribute of the selected element and use it in a property value, similar to how the var() function substitutes a custom property value. It can also be used with pseudo-elements, in which case the attribute's value on the pseudo-element's originating element is returned.", "formalSyntax": "attr( <attr-name> <attr-type>? , <declaration-value>? )\n  <attr-name> = [ <ident-token>? '|' ]? <ident-token>\n  <attr-type> = type( <syntax> ) | raw-string | number | <attr-unit>\n  <syntax> = '*' | <syntax-component> [ <syntax-combinator> <syntax-component> ]* | <syntax-string>\n  <syntax-component> = <syntax-single-component> <syntax-multiplier>? | '<' transform-list '>'\n  <syntax-combinator> = '|'\n  <syntax-string> = <string>\n  <syntax-single-component> = '<' <syntax-type-name> '>' | <ident>\n  <syntax-multiplier> = '#' | '+'\n  <syntax-type-name> = angle | color | custom-ident | image | integer | length | length-percentage | number | percentage | resolution | string | time | url | transform-function" }, "blur": { - "url": "$MDN_URL$/web/css/filter-function/blur", + "url": "$MDN_URL$/web/css/reference/values/filter-function/blur", "status": [ "StandardTrack" ], @@ -3761,11 +3802,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The blur() CSS function applies a Gaussian blur to the input image. Its result is a <filter-function>.", + "doc": "The blur() CSS function applies a Gaussian blur to the input image. Its result is a <filter-function>.", "formalSyntax": "blur( <length>? )" }, "brightness": { - "url": "$MDN_URL$/web/css/filter-function/brightness", + "url": "$MDN_URL$/web/css/reference/values/filter-function/brightness", "status": [ "StandardTrack" ], @@ -3784,14 +3825,14 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The brightness() CSS <filter-function> applies a linear multiplier value on an element or an input image, making the image appear brighter or darker.", + "doc": "The brightness() CSS <filter-function> applies a linear multiplier value on an element or an input image, making the image appear brighter or darker.", "formalSyntax": "brightness( [ <number> | <percentage> ]? )", "values": { - "amount": "Brightness specified as a <number> or a <percentage>. A value less than 100% darkens the input image or element, while a value over 100% brightens it. A value of 0% creates a completely black image or element, while a value of 100% leaves the input unchanged. Other values between 0% to 100% have a linear multiplier effect. Values greater than 100% are allowed, providing brighter results. The initial value for interpolation is 1. Negative values are not allowed. The default value is 1." + "amount": "Brightness specified as a <number> or a <percentage>. A value less than 100% darkens the input image or element, while a value over 100% brightens it. A value of 0% creates a completely black image or element, while a value of 100% leaves the input unchanged. Other values between 0% to 100% have a linear multiplier effect. Values greater than 100% are allowed, providing brighter results. The initial value for interpolation is 1. Negative values are not allowed. The default value is 1." } }, "calc": { - "url": "$MDN_URL$/web/css/calc", + "url": "$MDN_URL$/web/css/reference/values/calc", "status": [ "StandardTrack" ], @@ -3810,11 +3851,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used with <length>, <frequency>, <angle>, <time>, <percentage>, <number>, <integer>, and <color-function> values.", + "doc": "The calc() CSS function lets you perform calculations when specifying CSS property values. It can be used with <length>, <frequency>, <angle>, <time>, <percentage>, <number>, <integer>, and <color-function> values.", "formalSyntax": "calc( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "calc-size": { - "url": "$MDN_URL$/web/css/calc-size", + "url": "$MDN_URL$/web/css/reference/values/calc-size", "status": [ "Experimental", "StandardTrack" @@ -3828,11 +3869,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The calc-size() CSS function allows you to perform calculations on intrinsic size values such as auto, fit-content, and max-content; this is not supported by the regular calc() function.\n

calc-size() return values can also be interpolated, enabling size keyword values to be used in animations and transitions. In effect, including calc-size() in a property value automatically applies interpolate-size: allow-keywords to the selection.\n

Note however that interpolate-size is inherited, therefore applying it to an element enables interpolation of intrinsic size keywords for every property applied to that element and its children. As a result, interpolate-size is the preferred solution for enabling intrinsic size animations. You should only use calc-size() to enable intrinsic size animations if they also require calculations.", + "doc": "

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

\n

The calc-size() CSS function allows you to perform calculations on intrinsic size values such as auto, fit-content, and max-content; this is not supported by the regular calc() function.\n

calc-size() return values can also be interpolated, enabling size keyword values to be used in animations and transitions. In effect, including calc-size() in a property value automatically applies interpolate-size: allow-keywords to the selection.\n

Note however that interpolate-size is inherited, therefore applying it to an element enables interpolation of intrinsic size keywords for every property applied to that element and its children. As a result, interpolate-size is the preferred solution for enabling intrinsic size animations. You should only use calc-size() to enable intrinsic size animations if they also require calculations.", "formalSyntax": "calc-size( <calc-size-basis> , <calc-sum> )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "circle": { - "url": "$MDN_URL$/web/css/basic-shape/circle", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/circle", "status": [ "StandardTrack" ], @@ -3851,15 +3892,15 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The circle() CSS function defines a circle using a radius and a position. It is one of the <basic-shape> data types.", + "doc": "The circle() CSS function defines a circle using a radius and a position. It is one of the <basic-shape> data types.", "formalSyntax": "circle( <radial-size>? [ at <position> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <length-percentage> = <length> | <percentage>", "values": { - "<shape-radius>": "This may be a <length>, or a <percentage> or values closest-side and farthest-side.\n

\n
closest-side
\n
\n

Uses the length from the center of the shape to the closest side of the reference box. For circles, this is the closest side in any dimension.\n

\n
farthest-side
\n
\n

Uses the length from the center of the shape to the farthest side of the reference box. For circles, this is the farthest side in any dimension.\n

\n
", - "<position>": "Moves the center of the circle. May be a <length>, or a <percentage>, or a values such as left. The <position> value defaults to center if omitted." + "<shape-radius>": "This may be a <length>, or a <percentage> or values closest-side and farthest-side.\n
\n
closest-side
\n
\n

Uses the length from the center of the shape to the closest side of the reference box. For circles, this is the closest side in any dimension.\n

\n
farthest-side
\n
\n

Uses the length from the center of the shape to the farthest side of the reference box. For circles, this is the farthest side in any dimension.\n

\n
", + "<position>": "Moves the center of the circle. May be a <length>, or a <percentage>, or a values such as left. The <position> value defaults to center if omitted." } }, "clamp": { - "url": "$MDN_URL$/web/css/clamp", + "url": "$MDN_URL$/web/css/reference/values/clamp", "status": [ "StandardTrack" ], @@ -3878,11 +3919,11 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The clamp() CSS function clamps a value within a range of values between a defined minimum bound and a maximum bound. The function takes three parameters: a minimum value, a preferred value, and a maximum allowed value.", + "doc": "The clamp() CSS function clamps a value within a range of values between a defined minimum bound and a maximum bound. The function takes three parameters: a minimum value, a preferred value, and a maximum allowed value.", "formalSyntax": "clamp( [ <calc-sum> | none ] , <calc-sum> , [ <calc-sum> | none ] )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "color": { - "url": "$MDN_URL$/web/css/color_value/color", + "url": "$MDN_URL$/web/css/reference/values/color_value/color", "status": [ "StandardTrack" ], @@ -3897,20 +3938,21 @@ "SafariIOS": "15" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "The color() functional notation allows a color to be specified in a particular, specified color space rather than the implicit sRGB color space that most of the other color functions operate in.\n

Support for a particular color space can be detected with the color-gamut CSS media feature.", + "doc": "The color() functional notation allows a color to be specified in a particular, specified color space rather than the implicit sRGB color space that most of the other color functions operate in.\n

Support for a particular color space can be detected with the color-gamut CSS media feature.", "formalSyntax": "color( <colorspace-params> [ / [ <alpha-value> | none ] ]? )\n  <colorspace-params> = <predefined-rgb-params> | <xyz-params>\n  <alpha-value> = <number> | <percentage>\n  <predefined-rgb-params> = <predefined-rgb> [ <number> | <percentage> | none ]{3}\n  <xyz-params> = <xyz-space> [ <number> | <percentage> | none ]{3}\n  <predefined-rgb> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | rec2100-pq | rec2100-hlg | rec2100-linear\n  <xyz-space> = xyz | xyz-d50 | xyz-d65", "values": { - "colorspace": "An <ident> denoting one of the predefined color spaces: srgb, srgb-linear, display-p3, a98-rgb, prophoto-rgb, rec2020, xyz, xyz-d50, or xyz-d65.

An <ident> denoting the color space of the output color, generally one of the predefined color spaces: srgb, srgb-linear, display-p3, a98-rgb, prophoto-rgb, rec2020, xyz, xyz-d50, or xyz-d65.", - "c1, c2, c3": "Each value can be written as a <number>, a <percentage>, or the keyword none (equivalent to 0 in this case). These values represent the component values for the colorspace. When using a <number> value, generally, 0 to 1 represents the bounds of the color space. Values outside of that range are permitted but will be out of gamut for the given color space. When using a percentage value, 100% represents 1 and 0% represents 0.

Each value can be written as a <number>, a <percentage>, or the keyword none (equivalent to 0 in this case). These values represent the component values for the output color. When using a <number> value, generally 0 to 1 represents the bounds of the color space. Values outside of that range are permitted but will be out of gamut for the given color space. Generally, when using a percentage value, 100% represents 1 and 0% represents 0.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "colorspace": "An <ident> denoting one of the predefined color spaces: srgb, srgb-linear, display-p3, a98-rgb, prophoto-rgb, rec2020, xyz, xyz-d50, or xyz-d65.

An <ident> denoting the color space of the output color, generally one of the predefined color spaces: srgb, srgb-linear, display-p3, a98-rgb, prophoto-rgb, rec2020, xyz, xyz-d50, or xyz-d65.", + "c1, c2, c3": "Each value can be written as a <number>, a <percentage>, or the keyword none (equivalent to 0 in this case). These values represent the component values for the colorspace. When using a <number> value, generally, 0 to 1 represents the bounds of the color space. Values outside of that range are permitted but will be out of gamut for the given color space. When using a percentage value, 100% represents 1 and 0% represents 0.

Each value can be written as a <number>, a <percentage>, or the keyword none (equivalent to 0 in this case). These values represent the component values for the output color. When using a <number> value, generally 0 to 1 represents the bounds of the color space. Values outside of that range are permitted but will be out of gamut for the given color space. Generally, when using a percentage value, 100% represents 1 and 0% represents 0.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "color-mix": { - "url": "$MDN_URL$/web/css/color_value/color-mix", + "url": "$MDN_URL$/web/css/reference/values/color_value/color-mix", "status": [ "StandardTrack" ], @@ -3925,14 +3967,15 @@ "SafariIOS": "16.2" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "The color-mix() functional notation takes two <color> values and returns the result of mixing them in a given colorspace by a given amount.", + "doc": "The color-mix() functional notation takes two <color> values and returns the result of mixing them in a given colorspace by a given amount.", "formalSyntax": "color-mix( <color-interpolation-method>? , [ <color> && <percentage [0,100]>? ]# )\n  <color-interpolation-method> = in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <xyz-space> = xyz | xyz-d50 | xyz-d65" }, "conic-gradient": { - "url": "$MDN_URL$/web/css/gradient/conic-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/conic-gradient", "status": [ "StandardTrack" ], @@ -3951,17 +3994,17 @@ "lowDate": "2020-11-17", "highDate": "2023-05-17" }, - "doc": "The conic-gradient() CSS function creates an image consisting of a gradient with color transitions rotated around a center point (rather than radiating from the center). Example conic gradients include pie charts and color wheels. The result of the conic-gradient() function is an object of the <gradient> data type, which is a special kind of <image>.", + "doc": "The conic-gradient() CSS function creates an image consisting of a gradient with color transitions rotated around a center point (rather than radiating from the center). Example conic gradients include pie charts and color wheels. The result of the conic-gradient() function is an object of the <gradient> data type, which is a special kind of <image>.", "formalSyntax": "conic-gradient( [ <conic-gradient-syntax> ] )\n  <conic-gradient-syntax> = [ [ [ from [ <angle> | <zero> ] ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <angular-color-stop-list>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <color-interpolation-method> = in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <angular-color-stop-list> = <angular-color-stop> , [ <angular-color-hint>? , <angular-color-stop> ]#?\n  <length-percentage> = <length> | <percentage>\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <angular-color-stop> = <color> <color-stop-angle>?\n  <angular-color-hint> = <angle-percentage> | <zero>\n  <xyz-space> = xyz | xyz-d50 | xyz-d65\n  <color-stop-angle> = [ <angle-percentage> | <zero> ]{1,2}\n  <angle-percentage> = <angle> | <percentage>", "values": { "<angle>": "Preceded by the from keyterm, and taking an angle as its value, defines the gradient rotation in clockwise direction.", - "<position>": "Using the same length, order, and keyterm values as the background-position property, the position value defines center of the gradient. If not specified, the value used for position by default is center, meaning the gradient will be centered.", - "<angular-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis).", + "<position>": "Using the same length, order, and keyterm values as the background-position property, the position value defines center of the gradient. If not specified, the value used for position by default is center, meaning the gradient will be centered.", + "<angular-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis).", "<color-hint>": "An interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops." } }, "contrast": { - "url": "$MDN_URL$/web/css/filter-function/contrast", + "url": "$MDN_URL$/web/css/reference/values/filter-function/contrast", "status": [ "StandardTrack" ], @@ -3980,29 +4023,30 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The contrast() CSS function adjusts the contrast of the input image. Its result is a <filter-function>.", + "doc": "The contrast() CSS function adjusts the contrast of the input image. Its result is a <filter-function>.", "formalSyntax": "contrast( [ <number> | <percentage> ]? )", "values": { - "amount": "The contrast of the result, specified as a <number> or a <percentage>. A value under 100% decreases the contrast, while a value over 100% increases it. A value of 0 or 0% will create an image that is completely gray, while a value of 1 or 100% leaves the input unchanged. Negative values are not allowed. The initial value for interpolation is 1. The default value is 1." + "amount": "The contrast of the result, specified as a <number> or a <percentage>. A value under 100% decreases the contrast, while a value over 100% increases it. A value of 0 or 0% will create an image that is completely gray, while a value of 1 or 100% leaves the input unchanged. Negative values are not allowed. The initial value for interpolation is 1. The default value is 1." } }, "contrast-color": { - "url": "$MDN_URL$/web/css/color_value/contrast-color", + "url": "$MDN_URL$/web/css/reference/values/color_value/contrast-color", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Firefox": "146", + "FirefoxAndroid": "146", "Safari": "26", "SafariIOS": "26" }, "baseline": { "level": "NONE" }, - "doc": "

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

\n

The contrast-color() CSS function takes a color value and returns a contrasting color. The function commonly ensures the WCAG AA minimum contrast. The browsers may use different and better algorithms.\n

contrast-color() makes it easy, for example, to specify a text color and automatically generate a contrasting background color, or vice versa. It avoids the need to maintain background-text color pairs." + "doc": "The contrast-color() CSS function takes a color value and returns a contrasting color. The function commonly ensures the WCAG AA minimum contrast. The browsers may use different and better algorithms.\n

The contrast-color() function enables specifying a text color and automatically generating a contrasting background color, or vice versa. It avoids the need to maintain background-text color pairs." }, "cos": { - "url": "$MDN_URL$/web/css/cos", + "url": "$MDN_URL$/web/css/reference/values/cos", "status": [ "StandardTrack" ], @@ -4021,11 +4065,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The cos() CSS function is a trigonometric function that returns the cosine of a number, which is a value between -1 and 1. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians. That is, cos(45deg), cos(0.125turn), and cos(3.14159 / 4) all represent the same value, approximately 0.707.", + "doc": "The cos() CSS function is a trigonometric function that returns the cosine of a number, which is a value between -1 and 1. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians. That is, cos(45deg), cos(0.125turn), and cos(3.14159 / 4) all represent the same value, approximately 0.707.", "formalSyntax": "cos( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "counter": { - "url": "$MDN_URL$/web/css/counter", + "url": "$MDN_URL$/web/css/reference/values/counter", "status": [ "StandardTrack" ], @@ -4044,15 +4088,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The counter() CSS function returns a string representing the current value of the named counter, if there is one.\n

The counter() function is generally used within pseudo-element through the content property but, theoretically, it can be used wherever a <string> value is supported.", - "formalSyntax": "counter( <counter-name> , <counter-style>? )\n  <counter-style> = <counter-style-name> | <symbols()>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "doc": "The counter() CSS function returns a string representing the current value of the named counter, if there is one.\n

The counter() function is generally used within pseudo-element through the content property but, theoretically, it can be used wherever a <string> value is supported.", + "formalSyntax": "counter( <counter-name> , <counter-style>? )\n  <counter-name> = <custom-ident>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <counter-style-name> = <custom-ident>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<counter-name>": "A <custom-ident> identifying the counter, which is the same case-sensitive name used with the counter-reset and counter-increment property values. The counter name cannot start with two dashes and can't be none, unset, initial, or inherit.", - "<counter-style>": "A <list-style-type> name, <@counter-style> name or symbols() function, where a counter style name is a numeric, alphabetic, or symbolic predefined counter style, a complex longhand east Asian or Ethiopic predefined counter style, or other predefined counter style. If omitted, the counter-style defaults to decimal." + "<counter-name>": "A <custom-ident> identifying the counter, which is the same case-sensitive name used with the counter-reset and counter-increment property values. The counter name cannot start with two dashes and can't be none, unset, initial, or inherit.", + "<counter-style>": "A <list-style-type> name, <@counter-style> name or symbols() function, where a counter style name is a numeric, alphabetic, or symbolic predefined counter style, a complex longhand east Asian or Ethiopic predefined counter style, or other predefined counter style. If omitted, the counter-style defaults to decimal." } }, "counters": { - "url": "$MDN_URL$/web/css/counters", + "url": "$MDN_URL$/web/css/reference/values/counters", "status": [ "StandardTrack" ], @@ -4071,16 +4115,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The counters() CSS function enables combining markers when nesting counters. The function returns a string that concatenates the current values of the named and nested counters, if any are present, with the string provided. The third, optional parameter enables defining the list style.\n

The counters() function is generally used within pseudo-element through the content property, but theoretically, it can be used wherever a <string> value is supported.\n

The counters() function has two forms: counters(<name>, <string>) and counters(<name>, <string>, <style>). The generated text is the value of all counters with the given <name>, arranged from the outermost to the innermost, and separated by the specified <string>. The counters are rendered in the <style> indicated, defaulting to decimal if no <style> is specified.", - "formalSyntax": "counters( <counter-name> , <string> , <counter-style>? )\n  <counter-style> = <counter-style-name> | <symbols()>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "doc": "The counters() CSS function enables combining markers when nesting counters. The function returns a string that concatenates the current values of the named and nested counters, if any are present, with the string provided. The third, optional parameter enables defining the list style.\n

The counters() function is generally used within pseudo-element through the content property, but theoretically, it can be used wherever a <string> value is supported.\n

The counters() function has two forms: counters(<name>, <string>) and counters(<name>, <string>, <style>). The generated text is the value of all counters with the given <name>, arranged from the outermost to the innermost, and separated by the specified <string>. The counters are rendered in the <style> indicated, defaulting to decimal if no <style> is specified.", + "formalSyntax": "counters( <counter-name> , <string> , <counter-style>? )\n  <counter-name> = <custom-ident>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <counter-style-name> = <custom-ident>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<counter-name>": "A <custom-ident> identifying the counters, which is the same case-sensitive name used for the counter-reset and counter-increment properties. The name cannot start with two dashes and can't be none, unset, initial, or inherit. Alternatively, for inline, single-use counters, the symbols() function can be used instead of a named counter in browsers that support symbols().", + "<counter-name>": "A <custom-ident> identifying the counters, which is the same case-sensitive name used for the counter-reset and counter-increment properties. The name cannot start with two dashes and can't be none, unset, initial, or inherit. Alternatively, for inline, single-use counters, the symbols() function can be used instead of a named counter in browsers that support symbols().", "<string>": "Any number of text characters. Non-Latin characters must be encoded using their Unicode escape sequences: for example, \\000A9 represents the copyright symbol.", - "<counter-style>": "A counter style name or a symbols() function. The counter style name can be a predefined style such as numeric, alphabetic, or symbolic, a complex longhand predefined style such as East Asian or Ethiopic, or another predefined counter style. If omitted, the counter-style defaults to decimal." + "<counter-style>": "A counter style name or a symbols() function. The counter style name can be a predefined style such as numeric, alphabetic, or symbolic, a complex longhand predefined style such as East Asian or Ethiopic, or another predefined counter style. If omitted, the counter-style defaults to decimal." } }, "cross-fade": { - "url": "$MDN_URL$/web/css/cross-fade", + "url": "$MDN_URL$/web/css/reference/values/cross-fade", "status": [ "StandardTrack" ], @@ -4091,11 +4135,11 @@ "baseline": { "level": "NONE" }, - "doc": "The cross-fade() CSS function can be used to blend two or more images at a defined transparency.\nIt can be used for many basic image manipulations, such as tinting an image with a solid color or highlighting a particular area of the page by combining an image with a radial gradient.", + "doc": "The cross-fade() CSS function can be used to blend two or more images at a defined transparency.\nIt can be used for many basic image manipulations, such as tinting an image with a solid color or highlighting a particular area of the page by combining an image with a radial gradient.", "formalSyntax": "cross-fade( <cf-image># )\n  <cf-image> = [ <image> | <color> ] &&<percentage [0,100]>?\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )" }, "cubic-bezier": { - "url": "$MDN_URL$/web/css/easing-function/cubic-bezier", + "url": "$MDN_URL$/web/css/reference/values/easing-function/cubic-bezier", "status": [ "StandardTrack" ], @@ -4114,21 +4158,20 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The cubic-bezier() CSS function creates a smooth transition using a cubic Bézier curve.\nAs an <easing-function>, it can be used to smooth out the start and end of the interpolation.", + "doc": "The cubic-bezier() CSS function creates a smooth transition using a cubic Bézier curve.\nAs an <easing-function>, it can be used to smooth out the start and end of the interpolation.", "formalSyntax": "cubic-bezier( [ <number [0,1]> , <number> ]#{2} )" }, "device-cmyk": { - "url": "$MDN_URL$/web/css/color_value/device-cmyk", - "doc": "The device-cmyk() functional notation is used to express CMYK colors in a device dependent way, specifying the cyan, magenta, yellow, and black components.\n

This approach to color is useful when creating material to be output to a particular printer, when the output for particular ink combinations is known. CSS processors may attempt to approximate the color, however, the end result is likely to be different from the printed result.", + "url": "$MDN_URL$/web/css/reference/values/color_value/device-cmyk", + "doc": "The device-cmyk() functional notation is used to express CMYK colors in a device dependent way, specifying the cyan, magenta, yellow, and black components.\n

This approach to color is useful when creating material to be output to a particular printer, when the output for particular ink combinations is known. CSS processors may attempt to approximate the color for other media; however, the end result is likely to be different from the printed result without knowing the precise output colorimetry. A @color-profile declaration for device-cmyk can specify the exact color profile for conversion.", "formalSyntax": "<legacy-device-cmyk-syntax> | <modern-device-cmyk-syntax>\n  <legacy-device-cmyk-syntax> = device-cmyk( <number>#{4} )\n  <modern-device-cmyk-syntax> = device-cmyk( <cmyk-component>{4} [ / [ <alpha-value> | none ] ]? )\n  <cmyk-component> = <number> | <percentage> | none\n  <alpha-value> = <number> | <percentage>", "values": { - "C, M, Y, K": "<number> or <percentage> values providing the cyan, magenta, yellow, and black components of CMYK color.", - "A": "An <alpha-value>, where the number 1 corresponds to 100% (full opacity).", - "color": "An optional fallback <color> to use if the user agent does not know how to translate the CMYK color to RGB." + "C, M, Y, K": "Each a <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none providing the cyan, magenta, yellow, and black components of CMYK color.\n

\n

Note:\nSee Missing color components for more information on the effect of none.\n

", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel." } }, "drop-shadow": { - "url": "$MDN_URL$/web/css/filter-function/drop-shadow", + "url": "$MDN_URL$/web/css/reference/values/filter-function/drop-shadow", "status": [ "StandardTrack" ], @@ -4147,11 +4190,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The drop-shadow() CSS function applies a drop shadow effect to the input image. Its result is a <filter-function>.", + "doc": "The drop-shadow() CSS function applies a drop shadow effect to the input image. Its result is a <filter-function>.", "formalSyntax": "drop-shadow( [ <color>? && <length>{2,3} ] )" }, "dynamic-range-limit-mix": { - "url": "$MDN_URL$/web/css/dynamic-range-limit-mix", + "url": "$MDN_URL$/web/css/reference/values/dynamic-range-limit-mix", "status": [ "Experimental", "StandardTrack" @@ -4162,11 +4205,11 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

\n

The dynamic-range-limit-mix() CSS function creates a custom maximum luminance limit by mixing different dynamic-range-limit keywords in specified amounts.", + "doc": "

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

\n

The dynamic-range-limit-mix() CSS function creates a custom maximum luminance limit by mixing different dynamic-range-limit keywords in specified amounts.", "formalSyntax": "dynamic-range-limit-mix( [ <'dynamic-range-limit'> && <percentage [0,100]> ]#{2,} )\n  <dynamic-range-limit> = standard | no-limit | constrained | <dynamic-range-limit-mix()>" }, "element": { - "url": "$MDN_URL$/web/css/element", + "url": "$MDN_URL$/web/css/reference/values/element", "status": [ "Experimental", "StandardTrack" @@ -4175,11 +4218,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The element() CSS function defines an <image> value generated from an arbitrary HTML element. This image is live, meaning that if the HTML element is changed, the CSS properties using the resulting value are automatically updated.\n

A particularly useful scenario for using this would be to render an image in an HTML <canvas> element, then use that as a background.\n

On Gecko browsers, you can use the non-standard document.mozSetImageElement() method to change the element being used as the background for a given CSS background element.", + "doc": "

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

\n

The element() CSS function defines an <image> value generated from an arbitrary HTML element. This image is live, meaning that if the HTML element is changed, the CSS properties using the resulting value are automatically updated.\n

A particularly useful scenario for using this would be to render an image in an HTML <canvas> element, then use that as a background.\n

On Gecko browsers, you can use the non-standard document.mozSetImageElement() method to change the element being used as the background for a given CSS background element.", "formalSyntax": "element( <id-selector> )\n  <id-selector> = <hash-token>" }, "ellipse": { - "url": "$MDN_URL$/web/css/basic-shape/ellipse", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/ellipse", "status": [ "StandardTrack" ], @@ -4198,15 +4241,15 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The ellipse() CSS function is one of the <basic-shape> data types.", + "doc": "The ellipse() CSS function is one of the <basic-shape> data types.", "formalSyntax": "ellipse( <radial-size>? [ at <position> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <length-percentage> = <length> | <percentage>", "values": { - "<shape-radius>": "Two radii, x and y in that order. These may be a <length>, or a <percentage> or values closest-side and farthest-side.\n

\n
closest-side
\n
\n

Uses the length from the center of the shape to the closest side of the reference box. For ellipses, this is the closest side in the radius dimension.\n

\n
farthest-side
\n
\n

Uses the length from the center of the shape to the farthest side of the reference box. For ellipses, this is the farthest side in the radius dimension.\n

\n
", - "<position>": "Moves the center of the ellipse. May be a <length>, or a <percentage>, or a values such as left. The <position> value defaults to center if omitted." + "<shape-radius>": "Two radii, x and y in that order. These may be a <length>, or a <percentage> or values closest-side and farthest-side.\n
\n
closest-side
\n
\n

Uses the length from the center of the shape to the closest side of the reference box. For ellipses, this is the closest side in the radius dimension.\n

\n
farthest-side
\n
\n

Uses the length from the center of the shape to the farthest side of the reference box. For ellipses, this is the farthest side in the radius dimension.\n

\n
", + "<position>": "Moves the center of the ellipse. May be a <length>, or a <percentage>, or a values such as left. The <position> value defaults to center if omitted." } }, "env": { - "url": "$MDN_URL$/web/css/env", + "url": "$MDN_URL$/web/css/reference/values/env", "status": [ "StandardTrack" ], @@ -4225,11 +4268,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The env() CSS function can be used to insert the value of a user-agent defined environment variable into your CSS.", - "formalSyntax": "env( <custom-ident> <integer [0,∞]>* , <declaration-value>? )" + "doc": "The env() CSS function can be used to insert the value of a user-agent defined environment variable into your CSS.", + "formalSyntax": "env( <custom-ident> <integer [0,∞]>* , <declaration-value>? )\n  <integer> = <number-token>" }, "exp": { - "url": "$MDN_URL$/web/css/exp", + "url": "$MDN_URL$/web/css/reference/values/exp", "status": [ "StandardTrack" ], @@ -4247,11 +4290,11 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The exp() CSS function is an exponential function that takes a number as an argument and returns the mathematical constant e raised to the power of the given number.\n

The mathematical constant e is the base of natural logarithms, and is approximately 2.718281828459045.\n

The exp(number) function contains a calculation which returns the same value as pow(e, number).", + "doc": "The exp() CSS function is an exponential function that takes a number as an argument and returns the mathematical constant e raised to the power of the given number.\n

The mathematical constant e is the base of natural logarithms, and is approximately 2.718281828459045.\n

The exp(number) function contains a calculation which returns the same value as pow(e, number).", "formalSyntax": "exp( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "fit-content": { - "url": "$MDN_URL$/web/css/fit-content_function", + "url": "$MDN_URL$/web/css/reference/values/fit-content_function", "status": [ "StandardTrack" ], @@ -4268,7 +4311,7 @@ }, "support_of_fit-content_function": {} }, - "doc": "The fit-content() CSS function clamps a given size to an available size according to the formula min(maximum size, max(minimum size, argument)).", + "doc": "The fit-content() CSS function clamps a given size to an available size according to the formula min(maximum size, max(minimum size, argument)).", "formalSyntax": "fit-content( <length-percentage> )\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "An absolute length.", @@ -4276,7 +4319,7 @@ } }, "grayscale": { - "url": "$MDN_URL$/web/css/filter-function/grayscale", + "url": "$MDN_URL$/web/css/reference/values/filter-function/grayscale", "status": [ "StandardTrack" ], @@ -4295,11 +4338,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The grayscale() CSS function converts the input image to grayscale. Its result is a <filter-function>.", + "doc": "The grayscale() CSS function converts the input image to grayscale. Its result is a <filter-function>.", "formalSyntax": "grayscale( [ <number> | <percentage> ]? )" }, "hsl": { - "url": "$MDN_URL$/web/css/color_value/hsl", + "url": "$MDN_URL$/web/css/reference/values/color_value/hsl", "status": [ "StandardTrack" ], @@ -4321,15 +4364,15 @@ "doc": "

\n

Note:\nThe hsla() functional notation is an alias for hsl(). They are exactly equivalent. It is recommended to use hsl().\n

\n

The hsl() functional notation expresses a color in the sRGB color space according to its hue, saturation, and lightness components. An optional alpha component represents the color's transparency.", "formalSyntax": "<legacy-hsl-syntax> | <modern-hsl-syntax>\n  <legacy-hsl-syntax> = hsl( <hue> , <percentage> , <percentage> , <alpha-value>? )\n  <modern-hsl-syntax> = hsl( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>", "values": { - "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the <hue> reference page for more detail and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the output color's <hue> angle.", - "S": "A <percentage> or the keyword none (equivalent to 0% in this case). This value represents the color's saturation. Here 100% is completely saturated, while 0% is completely unsaturated (gray).

A <percentage> or the keyword none (equivalent to 0% in this case). This represents the saturation of the output color. Here 100% is completely saturated, while 0% is completely unsaturated (gray).", - "L": "A <percentage> or the keyword none (equivalent to 0% in this case). This value represents the color's lightness. Here 100% is white, 0% is black, and 50% is \"normal\".

A <percentage> or the keyword none (equivalent to 0% in this case). This represents the lightness of the output color. Here 100% is white, 0% is black, and 50% is \"normal\".", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the <hue> reference page for more detail and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the output color's <hue> angle.", + "S": "A <percentage> or the keyword none (equivalent to 0% in this case). This value represents the color's saturation. Here 100% is completely saturated, while 0% is completely unsaturated (gray).

A <percentage> or the keyword none (equivalent to 0% in this case). This represents the saturation of the output color. Here 100% is completely saturated, while 0% is completely unsaturated (gray).", + "L": "A <percentage> or the keyword none (equivalent to 0% in this case). This value represents the color's lightness. Here 100% is white, 0% is black, and 50% is \"normal\".

A <percentage> or the keyword none (equivalent to 0% in this case). This represents the lightness of the output color. Here 100% is white, 0% is black, and 50% is \"normal\".", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "hue-rotate": { - "url": "$MDN_URL$/web/css/filter-function/hue-rotate", + "url": "$MDN_URL$/web/css/reference/values/filter-function/hue-rotate", "status": [ "StandardTrack" ], @@ -4348,14 +4391,14 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The hue-rotate() CSS function rotates the hue of an element and its contents. Its result is a <filter-function>.\n

\n

Note:\nhue-rotate() is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the saturation or lightness of the original color, especially for saturated colors.\n

", + "doc": "The hue-rotate() CSS function rotates the hue of an element and its contents. Its result is a <filter-function>.\n
\n

Note:\nhue-rotate() is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the saturation or lightness of the original color, especially for saturated colors.\n

", "formalSyntax": "hue-rotate( [ <angle> | <zero> ]? )", "values": { - "angle": "The relative change in hue of the input sample, specified as an <angle>. A value of 0deg leaves the input unchanged. A positive hue rotation increases the hue value, while a negative rotation decreases the hue value. The initial value for interpolation is 0. There is no minimum or maximum value. The effect of values above 360deg are, given hue-rotate(Ndeg), evaluates to N modulo 360. The default value is 0deg." + "angle": "The relative change in hue of the input sample, specified as an <angle>. A value of 0deg leaves the input unchanged. A positive hue rotation increases the hue value, while a negative rotation decreases the hue value. The initial value for interpolation is 0. There is no minimum or maximum value. The effect of values above 360deg are, given hue-rotate(Ndeg), evaluates to N modulo 360. The default value is 0deg." } }, "hwb": { - "url": "$MDN_URL$/web/css/color_value/hwb", + "url": "$MDN_URL$/web/css/reference/values/color_value/hwb", "status": [ "StandardTrack" ], @@ -4378,7 +4421,7 @@ "formalSyntax": "hwb( [ <hue> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>" }, "hypot": { - "url": "$MDN_URL$/web/css/hypot", + "url": "$MDN_URL$/web/css/reference/values/hypot", "status": [ "StandardTrack" ], @@ -4396,11 +4439,11 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The hypot() CSS function is an exponential function that returns the square root of the sum of squares of its parameters.\n

While pow() and sqrt() only work on unitless numbers, hypot() accepts values with units, but they all must have the same type.", + "doc": "The hypot() CSS function is an exponential function that returns the square root of the sum of squares of its parameters.\n

While pow() and sqrt() only work on unitless numbers, hypot() accepts values with units, but they all must have the same type.", "formalSyntax": "hypot( <calc-sum># )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "if": { - "url": "$MDN_URL$/web/css/if", + "url": "$MDN_URL$/web/css/reference/values/if", "status": [ "Experimental", "StandardTrack" @@ -4414,20 +4457,20 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The if() CSS function allows different values to be set for a property depending on the result of a conditional test. The test can be based on a style query, a media query, or a feature query." + "doc": "

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

\n

The if() CSS function allows different values to be set for a property depending on the result of a conditional test. The test can be based on a style query, a media query, or a feature query." }, "image": { - "url": "$MDN_URL$/web/css/image/image", - "doc": "The image() CSS function defines an <image> in a similar fashion to the url() function, but with added functionality including specifying the image's directionality, displaying just a part of that image defined by a media fragment, and specifying a solid color as a fallback in case none of the specified images are able to be rendered.\n

\n

Note:\nThe CSS image() function should not confused with Image(), the HTMLImageElement constructor.\n

", + "url": "$MDN_URL$/web/css/reference/values/image/image", + "doc": "The image() CSS function defines an <image> in a similar fashion to the url() function, but with added functionality including specifying the image's directionality, displaying just a part of that image defined by a media fragment, and specifying a solid color as a fallback in case none of the specified images are able to be rendered.\n
\n

Note:\nThe CSS image() function should not confused with Image(), the HTMLImageElement constructor.\n

", "formalSyntax": "image( <image-tags>? [ <image-src>? , <color>? ]! )\n  <image-tags> = ltr | rtl\n  <image-src> = <url> | <string>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "image-tags": "The directionality of the image, either ltr for left-to-right or rtl for right-to-left.", - "image-src": "Zero or more <url>s or <string>s specifying the image sources, with optional image fragment identifiers.", + "image-src": "Zero or more <url>s or <string>s specifying the image sources, with optional image fragment identifiers.", "color": "A color, specifying a solid background color to use as a fallback if no image-src is found, supported, or declared." } }, "image-set": { - "url": "$MDN_URL$/web/css/image/image-set", + "url": "$MDN_URL$/web/css/reference/values/image/image-set", "status": [ "StandardTrack" ], @@ -4445,17 +4488,17 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The image-set() CSS functional notation is a method of letting the browser pick the most appropriate CSS image from a given set, primarily for high pixel density screens.\n

Resolution and bandwidth differ by device and network access. The image-set() function delivers the most appropriate image resolution for a user's device, providing a set of image options — each with an associated resolution declaration — from which the browser picks the most appropriate for the device and settings. Resolution can be used as a proxy for filesize — a user agent on a slow mobile connection with a high-resolution screen may prefer to receive lower-resolution images rather than waiting for a higher resolution image to load.\n

image-set() allows the author to provide options rather than determining what each individual user needs.", + "doc": "The image-set() CSS functional notation is a method of letting the browser pick the most appropriate CSS image from a given set, primarily for high pixel density screens.\n

Resolution and bandwidth differ by device and network access. The image-set() function delivers the most appropriate image resolution for a user's device, providing a set of image options — each with an associated resolution declaration — from which the browser picks the most appropriate for the device and settings. Resolution can be used as a proxy for filesize — a user agent on a slow mobile connection with a high-resolution screen may prefer to receive lower-resolution images rather than waiting for a higher resolution image to load.\n

image-set() allows the author to provide options rather than determining what each individual user needs.", "formalSyntax": "image-set( <image-set-option># )\n  <image-set-option> = [ <image> | <string> ] [ <resolution> || type( <string> ) ]?\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<image>": "The <image> can be any image type except for an image set. The image-set() function may not be nested inside another image-set() function.", + "<image>": "The <image> can be any image type except for an image set. The image-set() function may not be nested inside another image-set() function.", "<string>": "A URL to an image.", - "<resolution>": "<resolution> units include x or dppx, for dots per pixel unit, dpi, for dots per inch, and dpcm for dots per centimeter. Every image within an image-set() must have a unique resolution.", + "<resolution>": "<resolution> units include x or dppx, for dots per pixel unit, dpi, for dots per inch, and dpcm for dots per centimeter. Every image within an image-set() must have a unique resolution.", "type(<string>)": "A valid MIME type string, for example \"image/jpeg\"." } }, "inset": { - "url": "$MDN_URL$/web/css/basic-shape/inset", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/inset", "status": [ "StandardTrack" ], @@ -4474,15 +4517,15 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The inset() CSS function defines a rectangle at the specified inset distances from each side of the reference box. It is a basic shape function used to define one of the <basic-shape> data types.", + "doc": "The inset() CSS function defines a rectangle at the specified inset distances from each side of the reference box. It is a basic shape function used to define one of the <basic-shape> data types.", "formalSyntax": "inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <length-percentage> = <length> | <percentage>\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?", "values": { - "<length-percentage>{1,4}": "When all of the four arguments are supplied they represent the top, right, bottom, and left offsets from the reference box inward that define the positions of the edges of the inset rectangle. These arguments follow the syntax of the margin shorthand, which let you set all\nfour insets with one, two, or four values.\n

If a pair of insets for a dimension adds up to more than 100% of that dimension, both values are proportionally reduced so their sum equals 100%. For example, the value inset(90% 10% 60% 10%) has a top inset of 90% and a bottom inset of 60%. These values are reduced proportionally to inset(60% 10% 40% 10%). Shapes such as this, that enclose no area and have no shape-margin, do not affect wrapping.", - "<border-radius>": "The optional <border-radius> argument(s) define rounded corners for the inset rectangle using the border-radius shorthand syntax." + "<length-percentage>{1,4}": "When all of the four arguments are supplied they represent the top, right, bottom, and left offsets from the reference box inward that define the positions of the edges of the inset rectangle. These arguments follow the syntax of the margin shorthand, which let you set all\nfour insets with one, two, or four values.\n

If a pair of insets for a dimension adds up to more than 100% of that dimension, both values are proportionally reduced so their sum equals 100%. For example, the value inset(90% 10% 60% 10%) has a top inset of 90% and a bottom inset of 60%. These values are reduced proportionally to inset(60% 10% 40% 10%). Shapes such as this, that enclose no area and have no shape-margin, do not affect wrapping.", + "<border-radius>": "The optional <border-radius> argument(s) define rounded corners for the inset rectangle using the border-radius shorthand syntax." } }, "invert": { - "url": "$MDN_URL$/web/css/filter-function/invert", + "url": "$MDN_URL$/web/css/reference/values/filter-function/invert", "status": [ "StandardTrack" ], @@ -4501,11 +4544,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The invert() CSS function inverts the color samples in the input image. Its result is a <filter-function>.", + "doc": "The invert() CSS function inverts the color samples in the input image. Its result is a <filter-function>.", "formalSyntax": "invert( [ <number> | <percentage> ]? )" }, "lab": { - "url": "$MDN_URL$/web/css/color_value/lab", + "url": "$MDN_URL$/web/css/reference/values/color_value/lab", "status": [ "StandardTrack" ], @@ -4520,21 +4563,22 @@ "SafariIOS": "15" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The lab() functional notation expresses a given color in the CIE L*a*b* color space.\n

Lab represents the entire range of colors that humans can see by specifying the color's lightness, a red/green axis value, a blue/yellow axis value, and an optional alpha transparency value.", "formalSyntax": "lab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <alpha-value> = <number> | <percentage>", "values": { - "L": "A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's lightness. Here the number 0 corresponds to 0% (black) and the number 100 corresponds to 100% (white).

A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case) This value represents the lightness of the output color. Here the number 0 corresponds to 0% (black) and the number 100 corresponds to 100% (white).", - "a": "A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the a axis, which defines how green (moving towards -125) or red (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.

A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the a axis, which defines how green (moving towards -125) or red (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.", - "b": "A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the b axis, which defines how blue (moving towards -125) or yellow ( moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.

A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the b axis, which defines how blue (moving towards -125) or yellow (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "L": "A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's lightness. Here the number 0 corresponds to 0% (black) and the number 100 corresponds to 100% (white).

A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case) This value represents the lightness of the output color. Here the number 0 corresponds to 0% (black) and the number 100 corresponds to 100% (white).", + "a": "A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the a axis, which defines how green (moving towards -125) or red (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.

A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the a axis, which defines how green (moving towards -125) or red (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.", + "b": "A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the b axis, which defines how blue (moving towards -125) or yellow ( moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.

A <number> between -125 and 125, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the b axis, which defines how blue (moving towards -125) or yellow (moving towards +125) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±125 (±100%) limits. In practice, values cannot exceed ±160.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "lch": { - "url": "$MDN_URL$/web/css/color_value/lch", + "url": "$MDN_URL$/web/css/reference/values/color_value/lch", "status": [ "StandardTrack" ], @@ -4549,21 +4593,22 @@ "SafariIOS": "15" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "The lch() functional notation expresses a given color using the LCH color space, which represents lightness, chroma, and hue. It uses the same L axis as the lab() color function of the CIELab color space, but it uses the polar coordinates C (Chroma) and H (Hue).", + "doc": "The lch() functional notation expresses a given color using the LCH color space, which represents lightness, chroma, and hue. It uses the same L axis as the lab() color function of the CIELab color space, but it uses the polar coordinates C (Chroma) and H (Hue).", "formalSyntax": "lch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>", "values": { - "L": "A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0%). The number 0 corresponds to 0% (black), and the number 100 corresponds to 100% (white). This value specifies the color's brightness in the CIELab color space.\n

\n

Note:\nThe L in lch() is the perceived lightness, which refers to the \"brightness\" we visually perceive with our eyes. This is different from the L in hsl(), where it represents lightness as compared to other colors.\n

A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0%). The number 0 corresponds to 0% (black), and the number 100 corresponds to 100% (white). This value specifies the color's brightness in the CIELab color space.", - "C": "A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value is a measure of the color's chroma (roughly representing the \"amount of color\"). Its minimum useful value is 0%, or 0, while its maximum is theoretically unbounded (but in practice does not exceed 230), with 100% being equivalent to 150.

A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value represents the output color's chroma value (roughly representing the \"amount of color\"). Its minimum useful value is 0%, or 0, while its maximum is theoretically unbounded (but in practice does not exceed 230), with 100% being equivalent to 150.", - "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the hues in LCH example below and the <hue> reference page for more detail and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg) representing the output color's <hue> angle. See the hue example below.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "L": "A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0%). The number 0 corresponds to 0% (black), and the number 100 corresponds to 100% (white). This value specifies the color's brightness in the CIELab color space.\n

\n

Note:\nThe L in lch() is the perceived lightness, which refers to the \"brightness\" we visually perceive with our eyes. This is different from the L in hsl(), where it represents lightness as compared to other colors.\n

A <number> between 0 and 100, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0%). The number 0 corresponds to 0% (black), and the number 100 corresponds to 100% (white). This value specifies the color's brightness in the CIELab color space.", + "C": "A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value is a measure of the color's chroma (roughly representing the \"amount of color\"). Its minimum useful value is 0%, or 0, while its maximum is theoretically unbounded (but in practice does not exceed 230), with 100% being equivalent to 150.

A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value represents the output color's chroma value (roughly representing the \"amount of color\"). Its minimum useful value is 0%, or 0, while its maximum is theoretically unbounded (but in practice does not exceed 230), with 100% being equivalent to 150.", + "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the hues in LCH example below and the <hue> reference page for more detail and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg) representing the output color's <hue> angle. See the hue example below.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "light-dark": { - "url": "$MDN_URL$/web/css/color_value/light-dark", + "url": "$MDN_URL$/web/css/reference/values/color_value/light-dark", "status": [ "StandardTrack" ], @@ -4581,15 +4626,15 @@ "level": "LOW", "lowDate": "2024-05-13" }, - "doc": "The light-dark() CSS <color> function enables setting two colors for a property - returning one of the two colors options by detecting if the developer has set a light or dark color scheme or the user has requested light or dark color theme - without needing to encase the theme colors within a prefers-color-scheme media feature query.\nUsers are able to indicate their color-scheme preference through their operating system settings (e.g., light or dark mode) or their user agent settings. The light-dark() function enables providing two color values where any <color> value is accepted. The light-dark() CSS color function returns the first value if the user's preference is set to light or if no preference is set and the second value if the user's preference is set to dark.\n

To enable support for the light-dark() color function, the color-scheme must have a value of light dark, usually set on the :root pseudo-class.\n

\n```css\n:root {\n  color-scheme: light dark;\n}\nbody {\n  color: light-dark(#333b3c, #efefec);\n  background-color: light-dark(#efedea, #223a2c);\n}\n```\n
", + "doc": "The light-dark() CSS <color> function enables setting two colors for a property - returning one of the two colors options by detecting if the developer has set a light or dark color scheme or the user has requested light or dark color theme - without needing to encase the theme colors within a prefers-color-scheme media feature query.\nUsers are able to indicate their color-scheme preference through their operating system settings (e.g., light or dark mode) or their user agent settings. The light-dark() function enables providing two color values where any <color> value is accepted. The light-dark() CSS color function returns the first value if the user's preference is set to light or if no preference is set and the second value if the user's preference is set to dark.\n

To enable support for the light-dark() color function, the color-scheme must have a value of light dark, usually set on the :root pseudo-class.\n

\n```css\n:root {\n  color-scheme: light dark;\n}\nbody {\n  color: light-dark(#333b3c, #efefec);\n  background-color: light-dark(#efedea, #223a2c);\n}\n```\n
", "formalSyntax": "light-dark( <color> , <color> )", "values": { - "light-color": "<color> value to be set for light color-scheme.", - "dark-color": "<color> value to be set for dark color-scheme." + "light-color": "<color> value to be set for light color-scheme.", + "dark-color": "<color> value to be set for dark color-scheme." } }, "linear": { - "url": "$MDN_URL$/web/css/easing-function/linear", + "url": "$MDN_URL$/web/css/reference/values/easing-function/linear", "status": [ "StandardTrack" ], @@ -4607,11 +4652,11 @@ "level": "LOW", "lowDate": "2023-12-11" }, - "doc": "The linear() CSS function creates a transition curve that progresses uniformly between points.\nAs an <easing-function>, it creates transitions where the interpolation occurs at a constant rate from beginning to end.", + "doc": "The linear() CSS function creates a transition curve that progresses uniformly between points.\nAs an <easing-function>, it creates transitions where the interpolation occurs at a constant rate from beginning to end.", "formalSyntax": "linear( [ <number> && <percentage>{0,2} ]# )" }, "linear-gradient": { - "url": "$MDN_URL$/web/css/gradient/linear-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/linear-gradient", "status": [ "StandardTrack" ], @@ -4630,17 +4675,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The linear-gradient() CSS function creates an image consisting of a progressive transition between two or more colors along a straight line. Its result is an object of the <gradient> data type, which is a special kind of <image>.", + "doc": "The linear-gradient() CSS function creates an image consisting of a progressive transition between two or more colors along a straight line. Its result is an object of the <gradient> data type, which is a special kind of <image>.", "formalSyntax": "linear-gradient( [ <linear-gradient-syntax> ] )\n  <linear-gradient-syntax> = [ <angle> | <zero> | to <side-or-corner> ]? , <color-stop-list>\n  <side-or-corner> = [ left | right ] || [ top | bottom ]\n  <color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?\n  <linear-color-stop> = <color> <length-percentage>?\n  <linear-color-hint> = <length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { "<side-or-corner>": "The position of the gradient line's starting point. If specified, it consists of the word to and up to two keywords: one indicates the horizontal side (left or right), and the other the vertical side (top or bottom). The order of the side keywords does not matter. If unspecified, it defaults to to bottom.\n

The values to top, to bottom, to left, and to right are equivalent to the angles 0deg, 180deg, 270deg, and 90deg, respectively. The other values are translated into an angle.", "<angle>": "The gradient line's angle of direction. A value of 0deg is equivalent to to top; increasing values rotate clockwise from there.", - "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis).", + "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis).", "<color-hint>": "An interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops." } }, "log": { - "url": "$MDN_URL$/web/css/log", + "url": "$MDN_URL$/web/css/reference/values/log", "status": [ "StandardTrack" ], @@ -4658,11 +4703,11 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The log() CSS function is an exponential function that returns the logarithm of a number.\n

Logarithm is the inverse of exponentiation. It is the number that a fixed base has to be raised to in order to yield the number passed as the first parameter.\n

In CSS, when a single parameter is passed, the natural logarithm e, or approximately 2.7182818, is used, though the base can be set to any value with an optional second parameter.", + "doc": "The log() CSS function is an exponential function that returns the logarithm of a number.\n

Logarithm is the inverse of exponentiation. It is the number that a fixed base has to be raised to in order to yield the number passed as the first parameter.\n

In CSS, when a single parameter is passed, the natural logarithm e, or approximately 2.7182818, is used, though the base can be set to any value with an optional second parameter.", "formalSyntax": "log( <calc-sum> , <calc-sum>? )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "matrix": { - "url": "$MDN_URL$/web/css/transform-function/matrix", + "url": "$MDN_URL$/web/css/reference/values/transform-function/matrix", "status": [ "StandardTrack" ], @@ -4681,15 +4726,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The matrix() CSS function defines a homogeneous 2D transformation matrix. Its result is\na <transform-function> data type.\n

\n

Note:\nThe matrix(a, b, c, d, tx, ty) function is a shorthand for matrix3d(a, b, 0, 0, c, d, 0, 0, 0, 0, 1, 0, tx, ty, 0, 1).\n

", + "doc": "The matrix() CSS function defines a homogeneous 2D transformation matrix. Its result is\na <transform-function> data type.\n
\n

Note:\nThe matrix(a, b, c, d, tx, ty) function is a shorthand for matrix3d(a, b, 0, 0, c, d, 0, 0, 0, 0, 1, 0, tx, ty, 0, 1).\n

", "formalSyntax": "matrix( <number>#{6} )", "values": { - "a b c d": "Are <number>s describing the linear transformation.", - "tx ty": "Are <number>s describing the translation to apply." + "a b c d": "Are <number>s describing the linear transformation.", + "tx ty": "Are <number>s describing the translation to apply." } }, "matrix3d": { - "url": "$MDN_URL$/web/css/transform-function/matrix3d", + "url": "$MDN_URL$/web/css/reference/values/transform-function/matrix3d", "status": [ "StandardTrack" ], @@ -4708,15 +4753,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The matrix3d() CSS function defines a 3D transformation as a 4x4 homogeneous matrix.\nIts result is a <transform-function> data type.", + "doc": "The matrix3d() CSS function defines a 3D transformation as a 4x4 homogeneous matrix.\nIts result is a <transform-function> data type.", "formalSyntax": "matrix3d( <number>#{16} )", "values": { - "a1 b1 c1 d1 a2 b2 c2 d2\na3 b3 c3 d3": "Are <number>s describing the linear transformation.", - "a4 b4 c4 d4": "Are <number>s describing the translation to apply." + "a1 b1 c1 d1 a2 b2 c2 d2\na3 b3 c3 d3": "Are <number>s describing the linear transformation.", + "a4 b4 c4 d4": "Are <number>s describing the translation to apply." } }, "max": { - "url": "$MDN_URL$/web/css/max", + "url": "$MDN_URL$/web/css/reference/values/max", "status": [ "StandardTrack" ], @@ -4735,11 +4780,11 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The max() CSS function lets you set the largest (most positive) value from a list of comma-separated expressions as the value of a CSS property value. The max() function can be used anywhere a <length>, <frequency>, <angle>, <time>, <percentage>, <number>, or <integer> is allowed.", + "doc": "The max() CSS function lets you set the largest (most positive) value from a list of comma-separated expressions as the value of a CSS property value. The max() function can be used anywhere a <length>, <frequency>, <angle>, <time>, <percentage>, <number>, or <integer> is allowed.", "formalSyntax": "max( <calc-sum># )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "min": { - "url": "$MDN_URL$/web/css/min", + "url": "$MDN_URL$/web/css/reference/values/min", "status": [ "StandardTrack" ], @@ -4758,11 +4803,11 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The min() CSS function lets you set the smallest (most negative) value from a list of comma-separated expressions as the value of a CSS property value. The min() function can be used anywhere a <length>, <frequency>, <angle>, <time>, <percentage>, <number>, or <integer> is allowed.", + "doc": "The min() CSS function lets you set the smallest (most negative) value from a list of comma-separated expressions as the value of a CSS property value. The min() function can be used anywhere a <length>, <frequency>, <angle>, <time>, <percentage>, <number>, or <integer> is allowed.", "formalSyntax": "min( <calc-sum># )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "minmax": { - "url": "$MDN_URL$/web/css/minmax", + "url": "$MDN_URL$/web/css/reference/values/minmax", "status": [ "StandardTrack" ], @@ -4781,7 +4826,7 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The minmax() CSS function defines a size range greater than or equal to min and less than or equal to max. It is used with CSS grids.", + "doc": "The minmax() CSS function defines a size range greater than or equal to min and less than or equal to max. It is used with CSS grids.", "formalSyntax": "minmax( min , max )", "values": { "<length>": "A non-negative length.", @@ -4789,11 +4834,11 @@ "<flex>": "A non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor.", "max-content": "Represents the largest max-content contribution of the grid items occupying the grid track.", "min-content": "Represents the largest min-content contribution of the grid items occupying the grid track.", - "auto": "As min, it represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.\nAs max, it is identical to max-content. However, unlike max-content, it allows expansion of the track by the align-content and justify-content property values like normal and stretch." + "auto": "As min, it represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.\nAs max, it is identical to max-content. However, unlike max-content, it allows expansion of the track by the align-content and justify-content property values like normal and stretch." } }, "mod": { - "url": "$MDN_URL$/web/css/mod", + "url": "$MDN_URL$/web/css/reference/values/mod", "status": [ "StandardTrack" ], @@ -4811,11 +4856,11 @@ "level": "LOW", "lowDate": "2024-05-17" }, - "doc": "The mod() CSS function returns a modulus left over when the first parameter is divided by the second parameter, similar to the JavaScript remainder operator (%). The modulus is the value left over when one operand, the dividend, is divided by a second operand, the divisor. It always takes the sign of the divisor.\n

The calculation is a - (Math.floor(a / b) * b). For example, the CSS mod(21, -4) function returns the remainder of -3. The full calculation is 21 - (Math.floor(21 / -4) * -4). When dividing 21 by -4, the result is -5.25. This is floored to -6. Multiplying -6 by -4 is 24. Subtracting this 24 from the original 21, the remainder is -3.", + "doc": "The mod() CSS function returns a modulus left over when the first parameter is divided by the second parameter, similar to the JavaScript remainder operator (%). The modulus is the value left over when one operand, the dividend, is divided by a second operand, the divisor. It always takes the sign of the divisor.\n

The calculation is a - (Math.floor(a / b) * b). For example, the CSS mod(21, -4) function returns the remainder of -3. The full calculation is 21 - (Math.floor(21 / -4) * -4). When dividing 21 by -4, the result is -5.25. This is floored to -6. Multiplying -6 by -4 is 24. Subtracting this 24 from the original 21, the remainder is -3.", "formalSyntax": "mod( <calc-sum> , <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "oklab": { - "url": "$MDN_URL$/web/css/color_value/oklab", + "url": "$MDN_URL$/web/css/reference/values/color_value/oklab", "status": [ "StandardTrack" ], @@ -4830,21 +4875,22 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "The oklab() functional notation expresses a given color in the Oklab color space, which attempts to mimic how color is perceived by the human eye.\n

Oklab is a perceptual color space and is useful to:\n

\n

oklab() works with a Cartesian coordinate system on the Oklab color space — a- and b-axes. It can represent a wider range of colors than RGB, including wide-gamut and P3 colors. If you want a polar color system, chroma and hue, use oklch().", + "doc": "The oklab() functional notation expresses a given color in the Oklab color space, which attempts to mimic how color is perceived by the human eye.\n

Oklab is a perceptual color space and is useful to:\n

\n

oklab() works with a Cartesian coordinate system on the Oklab color space — a- and b-axes. It can represent a wider range of colors than RGB, including wide-gamut and P3 colors. If you want a polar color system, chroma and hue, use oklch().", "formalSyntax": "oklab( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ / [ <alpha-value> | none ] ]? )\n  <alpha-value> = <number> | <percentage>", "values": { - "L": "A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's perceived lightness. The number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).

A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the lightness of the output color. The number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).", - "a": "A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the a axis in the Oklab color space, which defines how green (moving towards -0.4) or red (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.

A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the a axis in the Oklab color space, which defines how green (moving towards -0.4) or red (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.", - "b": "A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the b axis in the Oklab color space, which defines how blue (moving towards -0.4) or yellow (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.

A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the b axis in the Oklab color space, which defines how blue (moving towards -0.4) or yellow (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "L": "A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's perceived lightness. The number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).

A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the lightness of the output color. The number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).", + "a": "A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the a axis in the Oklab color space, which defines how green (moving towards -0.4) or red (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.

A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the a axis in the Oklab color space, which defines how green (moving towards -0.4) or red (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.", + "b": "A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value specifies the color's distance along the b axis in the Oklab color space, which defines how blue (moving towards -0.4) or yellow (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.

A <number> between -0.4 and 0.4, a <percentage> between -100% and 100%, or the keyword none (equivalent to 0% in this case). This value represents the output color's distance along the b axis in the Oklab color space, which defines how blue (moving towards -0.4) or yellow (moving towards +0.4) the color is. Note that these values are signed (allowing both positive and negative values) and theoretically unbounded, meaning that you can set values outside the ±0.4 (±100%) limits. In practice, values cannot exceed ±0.5.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color. This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "oklch": { - "url": "$MDN_URL$/web/css/color_value/oklch", + "url": "$MDN_URL$/web/css/reference/values/color_value/oklch", "status": [ "StandardTrack" ], @@ -4859,21 +4905,22 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "The oklch() functional notation expresses a given color in the Oklab color space. oklch() is the cylindrical form of oklab(), using the same L axis, but with polar Chroma (C) and Hue (h) coordinates.", + "doc": "The oklch() functional notation expresses a given color in the Oklab color space. oklch() is the cylindrical form of oklab(), using the same L axis, but with polar Chroma (C) and Hue (h) coordinates.", "formalSyntax": "oklch( [ <percentage> | <number> | none ] [ <percentage> | <number> | none ] [ <hue> | none ] [ / [ <alpha-value> | none ] ]? )\n  <hue> = <number> | <angle>\n  <alpha-value> = <number> | <percentage>", "values": { - "L": "A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). In this case, the number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white). This value specifies the color's perceived lightness, or \"brightness\".\n

\n

Note:\nThe L in oklch() is the perceived lightness, which refers to the \"brightness\" we visually perceive with our eyes. This is different from the L in hsl(), where it represents lightness as compared to other colors.\n

A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This represents the lightness value of the output color. Here the number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).", - "C": "A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value is a measure of the color's chroma (roughly representing the \"amount of color\"). Its minimum useful value is 0, while the maximum is theoretically unbounded (but in practice does not exceed 0.5). In this case, 0% is 0 and 100% is the number 0.4.

A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value represents the output color's chroma value (roughly representing the \"amount of color\"). Its minimum useful value is 0, while its maximum is theoretically unbounded (but in practice does not exceed 0.5). In this case, 0% is 0 and 100% is the number 0.4.", - "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the Hues in oklch() example below and the <hue> reference page for more details and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the output color's <hue> angle. See a sample of different hues in the Examples section below.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color: This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "L": "A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). In this case, the number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white). This value specifies the color's perceived lightness, or \"brightness\".\n

\n

Note:\nThe L in oklch() is the perceived lightness, which refers to the \"brightness\" we visually perceive with our eyes. This is different from the L in hsl(), where it represents lightness as compared to other colors.\n

A <number> between 0 and 1, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). This represents the lightness value of the output color. Here the number 0 corresponds to 0% (black) and the number 1 corresponds to 100% (white).", + "C": "A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value is a measure of the color's chroma (roughly representing the \"amount of color\"). Its minimum useful value is 0, while the maximum is theoretically unbounded (but in practice does not exceed 0.5). In this case, 0% is 0 and 100% is the number 0.4.

A <number>, a <percentage>, or the keyword none (equivalent to 0% in this case). This value represents the output color's chroma value (roughly representing the \"amount of color\"). Its minimum useful value is 0, while its maximum is theoretically unbounded (but in practice does not exceed 0.5). In this case, 0% is 0 and 100% is the number 0.4.", + "H": "A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the color's <hue> angle.\n

\n

Note:\nThe angles corresponding to particular hues differ across the sRGB (used by hsl() and hwb()), CIELAB (used by lch()), and Oklab (used by oklch()) color spaces. See the Hues in oklch() example below and the <hue> reference page for more details and examples.\n

A <number>, an <angle>, or the keyword none (equivalent to 0deg in this case) representing the output color's <hue> angle. See a sample of different hues in the Examples section below.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color: This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "opacity": { - "url": "$MDN_URL$/web/css/filter-function/opacity", + "url": "$MDN_URL$/web/css/reference/values/filter-function/opacity", "status": [ "StandardTrack" ], @@ -4892,11 +4939,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The opacity() CSS function applies transparency to the samples in the input image. Its result is a <filter-function>.", + "doc": "The opacity() CSS function applies transparency to the samples in the input image. Its result is a <filter-function>.", "formalSyntax": "opacity( [ <number> | <percentage> ]? )" }, "paint": { - "url": "$MDN_URL$/web/css/image/paint", + "url": "$MDN_URL$/web/css/reference/values/image/paint", "status": [ "StandardTrack" ], @@ -4909,11 +4956,11 @@ "baseline": { "level": "NONE" }, - "doc": "The paint() CSS function defines an <image> value generated with a PaintWorklet.", + "doc": "The paint() CSS function defines an <image> value generated with a PaintWorklet.", "formalSyntax": "paint( <ident> , <declaration-value>? )" }, "path": { - "url": "$MDN_URL$/web/css/basic-shape/path", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/path", "status": [ "StandardTrack" ], @@ -4932,11 +4979,11 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The path() CSS function accepts an SVG path string, and is used in the CSS shapes and CSS motion path modules to enable a shape to be drawn. The path() function is a <basic-shape> data type value. It can be used in the CSS offset-path and clip-path properties and in the SVG d attribute.\n

There are some limitations to using the path() function. The path has to be defined as a single string, so a custom path can't be created using variables (var() functions). Also, all the lengths in the path are implicitly defined in pixel (px) units; other units can't be used. The shape() function offers more flexibility than the path() function.", + "doc": "The path() CSS function accepts an SVG path string, and is used in the CSS shapes and CSS motion path modules to enable a shape to be drawn. The path() function is a <basic-shape> data type value. It can be used in the CSS offset-path and clip-path properties and in the SVG d attribute.\n

There are some limitations to using the path() function. The path has to be defined as a single string, so a custom path can't be created using variables (var() functions). Also, all the lengths in the path are implicitly defined in pixel (px) units; other units can't be used. The shape() function offers more flexibility than the path() function.", "formalSyntax": "path( <'fill-rule'>? , <string> )\n  <fill-rule> = nonzero | evenodd" }, "perspective": { - "url": "$MDN_URL$/web/css/transform-function/perspective", + "url": "$MDN_URL$/web/css/reference/values/transform-function/perspective", "status": [ "StandardTrack" ], @@ -4955,14 +5002,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The perspective() CSS function defines a transformation that sets the distance between the\nuser and the z=0 plane, the perspective from which the viewer would be if the 2-dimensional interface were\n3-dimensional. Its result is a <transform-function> data type.", + "doc": "The perspective() CSS function defines a transformation that sets the distance between the\nuser and the z=0 plane, the perspective from which the viewer would be if the 2-dimensional interface were\n3-dimensional. Its result is a <transform-function> data type.", "formalSyntax": "perspective( [ <length [0,∞]> | none ] )", "values": { - "d": "Is a <length> representing the distance from the user to the z=0 plane. The z=0 plane is the plane where everything appears in a 2-dimensional view, or the screen. Values smaller than 1px (including zero) are clamped to 1px. Negative values are syntax errors.\n

Values other than none cause elements with positive z positions to appear larger, and elements with negative z positions to appear smaller. Elements with z positions equal to or larger than the perspective value disappear as though they are behind the user. Large values of perspective represent a small transformation; small values of perspective() represent a large transformation; perspective(none) represents perspective from infinite distance and no transformation." + "d": "Is a <length> representing the distance from the user to the z=0 plane. The z=0 plane is the plane where everything appears in a 2-dimensional view, or the screen. Values smaller than 1px (including zero) are clamped to 1px. Negative values are syntax errors.\n

Values other than none cause elements with positive z positions to appear larger, and elements with negative z positions to appear smaller. Elements with z positions equal to or larger than the perspective value disappear as though they are behind the user. Large values of perspective represent a small transformation; small values of perspective() represent a large transformation; perspective(none) represents perspective from infinite distance and no transformation." } }, "polygon": { - "url": "$MDN_URL$/web/css/basic-shape/polygon", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/polygon", "status": [ "StandardTrack" ], @@ -4981,11 +5028,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The polygon() CSS function is one of the <basic-shape> data types. It's used to draw a polygon by providing one or more pairs of coordinates, each of which represents a vertex of the shape.", + "doc": "The polygon() CSS function is one of the <basic-shape> data types. It's used to draw a polygon by providing one or more pairs of coordinates, each of which represents a vertex of the shape.", "formalSyntax": "polygon( <'fill-rule'>? [ round <length> ]? , [ <length-percentage> <length-percentage> ]# )\n  <fill-rule> = nonzero | evenodd\n  <length-percentage> = <length> | <percentage>" }, "pow": { - "url": "$MDN_URL$/web/css/pow", + "url": "$MDN_URL$/web/css/reference/values/pow", "status": [ "StandardTrack" ], @@ -5003,26 +5050,30 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The pow() CSS function is an exponential function that returns the value of a base raised to the power of a number.\n

The exp() function is a special case of pow() where the value of the base is the mathematical constant e.", + "doc": "The pow() CSS function is an exponential function that returns the value of a base raised to the power of a number.\n

The exp() function is a special case of pow() where the value of the base is the mathematical constant e.", "formalSyntax": "pow( <calc-sum> , <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "progress": { - "url": "$MDN_URL$/web/css/progress", + "url": "$MDN_URL$/web/css/reference/values/progress", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "138", "ChromeAndroid": "138", "Edge": "138", - "Opera": "122" + "Opera": "122", + "Safari": "26", + "SafariIOS": "26" }, - "doc": "

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

\n

The progress() CSS function returns a <number> value representing the position of one value (the progress value) relative to two other values (the progress start and end values).", + "baseline": { + "level": "NONE" + }, + "doc": "The progress() CSS function returns a <number> value representing the position of one value (the progress value) relative to two other values (the progress start and end values).", "formalSyntax": "progress( <calc-sum> , <calc-sum> , <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "radial-gradient": { - "url": "$MDN_URL$/web/css/gradient/radial-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/radial-gradient", "status": [ "StandardTrack" ], @@ -5041,18 +5092,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The radial-gradient() CSS function creates an image consisting of a progressive transition between two or more colors that radiate from an origin. Its shape may be a circle or an ellipse. The function's result is an object of the <gradient> data type, which is a special kind of <image>.", + "doc": "The radial-gradient() CSS function creates an image consisting of a progressive transition between two or more colors that radiate from an origin. Its shape may be a circle or an ellipse. The function's result is an object of the <gradient> data type, which is a special kind of <image>.", "formalSyntax": "radial-gradient( [ <radial-gradient-syntax> ] )\n  <radial-gradient-syntax> = [ <radial-shape> || <radial-size> ]? [ at <position> ]? , <color-stop-list>\n  <radial-shape> = circle | ellipse\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <length-percentage> = <length> | <percentage>\n  <linear-color-stop> = <color> <length-percentage>?\n  <linear-color-hint> = <length-percentage>", "values": { - "<position>": "The position of the gradient, interpreted in the same way as background-position or transform-origin. If unspecified, it defaults to center.", + "<position>": "The position of the gradient, interpreted in the same way as background-position or transform-origin. If unspecified, it defaults to center.", "<ending-shape>": "The gradient's ending-shape. The value can be circle (meaning that the gradient's shape is a circle with a constant radius) or ellipse (meaning that the shape is an axis-aligned ellipse). If unspecified, it defaults to ellipse.", - "<size>": "Determines the size of the gradient's ending shape. If omitted it defaults to farthest-corner. It can be given explicitly or by keyword. For the purpose of the keyword definitions, consider the gradient box edges as extending infinitely in both directions, rather than being finite line segments.\n

Both circle and ellipse gradients accept the following keywords for their <size>:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
KeywordDescription
closest-sideThe gradient's ending shape meets the side of the box closest to its center (for circles) or meets both the vertical and horizontal sides closest to the center (for ellipses).
closest-cornerThe gradient's ending shape is sized so that it exactly meets the closest corner of the box from its center.
farthest-sideSimilar to closest-side, except the ending shape is sized to meet the side of the box farthest from its center (or vertical and horizontal sides).
farthest-cornerThe default value, the gradient's ending shape is sized so that it exactly meets the farthest corner of the box from its center.
\n

If <ending-shape> is specified as circle, the size may be given explicitly as a <length>, which provides an explicit circle radius. Negative values are invalid.\n

If <ending-shape> is specified as ellipse, the size may be given as a <length-percentage> with two values to provide an explicit ellipse size. The first value represents the horizontal radius and the second is the vertical radius. Percentage values are relative to the corresponding dimension of the gradient box. Negative values are invalid.\n

When the <ending-shape> keyword is omitted, the gradient shape is determined by the size given. One <length> value provides a circle, while two values in <length-percentage> units provide an ellipse. A single <percentage> value is not valid.", - "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions (either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the center of the gradient; the value 100% represents the intersection of the ending shape with the virtual gradient ray. Percentage values in between are linearly positioned on the gradient ray. Including two stop positions is equivalent to declaring two color stops with the same color at the two positions.", + "<size>": "Determines the size of the gradient's ending shape. If omitted it defaults to farthest-corner. It can be given explicitly or by keyword. For the purpose of the keyword definitions, consider the gradient box edges as extending infinitely in both directions, rather than being finite line segments.\n

Both circle and ellipse gradients accept the following keywords for their <size>:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
KeywordDescription
closest-sideThe gradient's ending shape meets the side of the box closest to its center (for circles) or meets both the vertical and horizontal sides closest to the center (for ellipses).
closest-cornerThe gradient's ending shape is sized so that it exactly meets the closest corner of the box from its center.
farthest-sideSimilar to closest-side, except the ending shape is sized to meet the side of the box farthest from its center (or vertical and horizontal sides).
farthest-cornerThe default value, the gradient's ending shape is sized so that it exactly meets the farthest corner of the box from its center.
\n

If <ending-shape> is specified as circle, the size may be given explicitly as a <length>, which provides an explicit circle radius. Negative values are invalid.\n

If <ending-shape> is specified as ellipse, the size may be given as a <length-percentage> with two values to provide an explicit ellipse size. The first value represents the horizontal radius and the second is the vertical radius. Percentage values are relative to the corresponding dimension of the gradient box. Negative values are invalid.\n

When the <ending-shape> keyword is omitted, the gradient shape is determined by the size given. One <length> value provides a circle, while two values in <length-percentage> units provide an ellipse. A single <percentage> value is not valid.", + "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions (either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the center of the gradient; the value 100% represents the intersection of the ending shape with the virtual gradient ray. Percentage values in between are linearly positioned on the gradient ray. Including two stop positions is equivalent to declaring two color stops with the same color at the two positions.", "<color-hint>": "The color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops." } }, "ray": { - "url": "$MDN_URL$/web/css/ray", + "url": "$MDN_URL$/web/css/reference/values/ray", "status": [ "StandardTrack" ], @@ -5070,11 +5121,11 @@ "level": "LOW", "lowDate": "2024-01-23" }, - "doc": "The ray() CSS function defines the offset-path line segment that an animated element can follow. The line segment is referred to as \"ray\". The ray begins from an offset-position and extends in the direction of the specified angle. The length of a ray can be constrained by specifying a size and using the contain keyword.", + "doc": "The ray() CSS function defines the offset-path line segment that an animated element can follow. The line segment is referred to as \"ray\". The ray begins from an offset-position and extends in the direction of the specified angle. The length of a ray can be constrained by specifying a size and using the contain keyword.", "formalSyntax": "ray( <angle> &&<ray-size>? &&contain? &&[ at <position> ]? )\n  <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>" }, "rect": { - "url": "$MDN_URL$/web/css/basic-shape/rect", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/rect", "status": [ "StandardTrack" ], @@ -5092,16 +5143,16 @@ "level": "LOW", "lowDate": "2024-01-23" }, - "doc": "The rect() CSS function creates a rectangle at the specified distance from the top and left edges of the containing block. It is a basic shape function of the <basic-shape> data type. You can use the rect() function in CSS properties such as offset-path to create the rectangular path along which an element moves and in clip-path to define the shape of the clipping region.", + "doc": "The rect() CSS function creates a rectangle at the specified distance from the top and left edges of the containing block. It is a basic shape function of the <basic-shape> data type. You can use the rect() function in CSS properties such as offset-path to create the rectangular path along which an element moves and in clip-path to define the shape of the clipping region.", "formalSyntax": "rect( <top> , <right> , <bottom> , <left> )", "values": { - "<length-percentage>": "Specifies the <length-percentage> value of the distance of the top, right, bottom, or left edge of the rectangle from the top or left edge of the containing block. The first (top) and third (bottom) values are distances from the top edge of the containing block, and the second (right) and fourth (left) values are distances from the left edge of the containing block. The second (right) and third (bottom) values are clamped by the fourth (left) and first (top) values, respectively, to prevent the bottom edge from crossing over the top edge and right edge from crossing over the left edge. For example, rect(10px 0 0 20px) is clamped to rect(10px 20px 10px 20px).", + "<length-percentage>": "Specifies the <length-percentage> value of the distance of the top, right, bottom, or left edge of the rectangle from the top or left edge of the containing block. The first (top) and third (bottom) values are distances from the top edge of the containing block, and the second (right) and fourth (left) values are distances from the left edge of the containing block. The second (right) and third (bottom) values are clamped by the fourth (left) and first (top) values, respectively, to prevent the bottom edge from crossing over the top edge and right edge from crossing over the left edge. For example, rect(10px 0 0 20px) is clamped to rect(10px 20px 10px 20px).", "auto": "Makes the edge for which this value is used to coincide with the corresponding edge of the containing block. If auto is used for the first (top) or fourth (left) value, the value of auto is 0, and if used for the second (right) or third (bottom) value, the value of auto is 100%.", - "round <'border-radius'>": "Specifies the radius of the rounded corners of the rectangle using the same syntax as the CSS border-radius shorthand property. This parameter is optional." + "round <'border-radius'>": "Specifies the radius of the rounded corners of the rectangle using the same syntax as the CSS border-radius shorthand property. This parameter is optional." } }, "rem": { - "url": "$MDN_URL$/web/css/rem", + "url": "$MDN_URL$/web/css/reference/values/rem", "status": [ "StandardTrack" ], @@ -5119,11 +5170,11 @@ "level": "LOW", "lowDate": "2024-05-17" }, - "doc": "The rem() CSS function returns a remainder left over when the first parameter is divided by the second parameter, similar to the JavaScript remainder operator (%). The remainder is the value left over when one operand, the dividend, is divided by a second operand, the divisor. It always takes the sign of the dividend.\n

\n

Note:\nTo read about the unit rem, see the <length> page.\n

\n

For example, the CSS rem(27, 5) function returns the remainder of 2. When dividing 27 by 5, the result is 5 with a remainder of 2. The full calculation is 27 / 5 = 5 * 5 + 2.", + "doc": "The rem() CSS function returns a remainder left over when the first parameter is divided by the second parameter, similar to the JavaScript remainder operator (%). The remainder is the value left over when one operand, the dividend, is divided by a second operand, the divisor. It always takes the sign of the dividend.\n

\n

Note:\nTo read about the unit rem, see the <length> page.\n

\n

For example, the CSS rem(27, 5) function returns the remainder of 2. When dividing 27 by 5, the result is 5 with a remainder of 2. The full calculation is 27 / 5 = 5 * 5 + 2.", "formalSyntax": "rem( <calc-sum> , <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "repeat": { - "url": "$MDN_URL$/web/css/repeat", + "url": "$MDN_URL$/web/css/reference/values/repeat", "status": [ "StandardTrack" ], @@ -5142,16 +5193,16 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The repeat() CSS function represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form.", - "formalSyntax": "repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <fixed-breadth> = <length-percentage [0,∞]>", + "doc": "The repeat() CSS function represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form.", + "formalSyntax": "repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <integer> = <number-token>\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <fixed-breadth> = <length-percentage [0,∞]>", "values": { - "<fixed-size>": "One of the following forms:\n

", + "<fixed-size>": "One of the following forms:\n", "<flex>": "A non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor.", "<length>": "A positive integer length.", - "<line-names>": "Zero or more <custom-ident> values, space-separated and enclosed in square brackets, like this: [first header-start].", + "<line-names>": "Zero or more <custom-ident> values, space-separated and enclosed in square brackets, like this: [first header-start].", "<percentage>": "A non-negative percentage relative to the inline size of the grid container in column grid tracks, and the block size of the grid container in row grid tracks. If the size of the grid container depends on the size of its tracks, then the <percentage> must be treated as auto. The user-agent may adjust the intrinsic size contributions of the track to the size of the grid container and increase the final size of the track by the minimum amount that would result in honoring the percentage.", - "<track-size>": "One of the following forms:\n", - "auto": "As a maximum, identical to max-content. As a minimum it represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.", + "<track-size>": "One of the following forms:\n", + "auto": "As a maximum, identical to max-content. As a minimum it represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.", "auto-fill": "If the grid container has a definite or maximal size in the relevant axis, then the number of repetitions is the largest possible positive integer that does not cause the grid to overflow its grid container. Treating each track as its maximal track sizing function (each independent value used to define grid-template-rows or grid-template-columns), if that is definite. Otherwise, as its minimum track sizing function, and taking grid-gap into account. If any number of repetitions would overflow, then the repetition is 1. Otherwise, if the grid container has a definite minimal size in the relevant axis, the number of repetitions is the smallest possible positive integer that fulfills that minimum requirement. Otherwise, the specified track list repeats only once.", "auto-fit": "Behaves the same as auto-fill, except that after placing the grid items any empty repeated tracks are collapsed. An empty track is one with no in-flow grid items placed into or spanning across it. (This can result in all tracks being collapsed, if they're all empty.)\n

A collapsed track is treated as having a single fixed track sizing function of 0px, and the gutters on either side of it collapse.\n

For the purpose of finding the number of auto-repeated tracks, the user agent floors the track size to a user agent specified value (e.g., 1px), to avoid division by zero.", "max-content": "Represents the largest max-content contribution of the grid items occupying the grid track.", @@ -5159,7 +5210,7 @@ } }, "repeating-conic-gradient": { - "url": "$MDN_URL$/web/css/gradient/repeating-conic-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/repeating-conic-gradient", "status": [ "StandardTrack" ], @@ -5178,17 +5229,17 @@ "lowDate": "2020-11-17", "highDate": "2023-05-17" }, - "doc": "The repeating-conic-gradient() CSS function creates an image consisting of a repeating gradient (rather than a single gradient) with color transitions rotated around a center point (rather than radiating from the center).", + "doc": "The repeating-conic-gradient() CSS function creates an image consisting of a repeating gradient (rather than a single gradient) with color transitions rotated around a center point (rather than radiating from the center).", "formalSyntax": "repeating-conic-gradient( [ <conic-gradient-syntax> ] )\n  <conic-gradient-syntax> = [ [ [ from [ <angle> | <zero> ] ]? [ at <position> ]? ] || <color-interpolation-method> ]? , <angular-color-stop-list>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <color-interpolation-method> = in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <angular-color-stop-list> = <angular-color-stop> , [ <angular-color-hint>? , <angular-color-stop> ]#?\n  <length-percentage> = <length> | <percentage>\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <angular-color-stop> = <color> <color-stop-angle>?\n  <angular-color-hint> = <angle-percentage> | <zero>\n  <xyz-space> = xyz | xyz-d50 | xyz-d65\n  <color-stop-angle> = [ <angle-percentage> | <zero> ]{1,2}\n  <angle-percentage> = <angle> | <percentage>", "values": { "<angle>": "Preceded by the from keyterm, and taking an angle as its value, defines the gradient rotation in clockwise direction.", - "<position>": "Using the same length, order and keyterm values as the background-position property, the position defines center of the gradient. If omitted, the default value is center, meaning the gradient will be centered.", - "<angular-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis). The last color stop minus the first color-stop angle defines the size of the repeating gradient.", + "<position>": "Using the same length, order and keyterm values as the background-position property, the position defines center of the gradient. If omitted, the default value is center, meaning the gradient will be centered.", + "<angular-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis). The last color stop minus the first color-stop angle defines the size of the repeating gradient.", "<color-hint>": "An interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops." } }, "repeating-linear-gradient": { - "url": "$MDN_URL$/web/css/gradient/repeating-linear-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/repeating-linear-gradient", "status": [ "StandardTrack" ], @@ -5207,17 +5258,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The repeating-linear-gradient() CSS function creates an image consisting of repeating linear gradients. It is similar to linear-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container. The function's result is an object of the <gradient> data type, which is a special kind of <image>.", + "doc": "The repeating-linear-gradient() CSS function creates an image consisting of repeating linear gradients. It is similar to linear-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container. The function's result is an object of the <gradient> data type, which is a special kind of <image>.", "formalSyntax": "repeating-linear-gradient( [ <linear-gradient-syntax> ] )\n  <linear-gradient-syntax> = [ <angle> | <zero> | to <side-or-corner> ]? , <color-stop-list>\n  <side-or-corner> = [ left | right ] || [ top | bottom ]\n  <color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?\n  <linear-color-stop> = <color> <length-percentage>?\n  <linear-color-hint> = <length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { "<side-or-corner>": "The position of the gradient line's starting point. If specified, it consists of the word to and up to two keywords: one indicates the horizontal side (left or right), and the other the vertical side (top or bottom). The order of the side keywords does not matter. If unspecified, it defaults to to bottom.\n

The values to top, to bottom, to left, and to right are equivalent to the angles 0deg, 180deg, 270deg, and 90deg respectively. The other values are translated into an angle.", "<angle>": "The gradient line's angle of direction. A value of 0deg is equivalent to to top; increasing values rotate clockwise from there.", - "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the start of the gradient; the value 100% is 100% of the image size, meaning the gradient will not repeat.", + "<linear-color-stop>": "A color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the start of the gradient; the value 100% is 100% of the image size, meaning the gradient will not repeat.", "<color-hint>": "The color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. The length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. If omitted, the midpoint of the color transition is the midpoint between two color stops." } }, "repeating-radial-gradient": { - "url": "$MDN_URL$/web/css/gradient/repeating-radial-gradient", + "url": "$MDN_URL$/web/css/reference/values/gradient/repeating-radial-gradient", "status": [ "StandardTrack" ], @@ -5236,17 +5287,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The repeating-radial-gradient() CSS function creates an image consisting of repeating gradients that radiate from an origin. It is similar to radial-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container, similar to repeating-linear-gradient(). The function's result is an object of the <gradient> data type, which is a special kind of <image>.", + "doc": "The repeating-radial-gradient() CSS function creates an image consisting of repeating gradients that radiate from an origin. It is similar to radial-gradient() and takes the same arguments, but it repeats the color stops infinitely in all directions so as to cover its entire container, similar to repeating-linear-gradient(). The function's result is an object of the <gradient> data type, which is a special kind of <image>.", "formalSyntax": "repeating-radial-gradient( [ <radial-gradient-syntax> ] )\n  <radial-gradient-syntax> = [ <radial-shape> || <radial-size> ]? [ at <position> ]? , <color-stop-list>\n  <radial-shape> = circle | ellipse\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <length-percentage> = <length> | <percentage>\n  <linear-color-stop> = <color> <length-percentage>?\n  <linear-color-hint> = <length-percentage>", "values": { - "<position>": "The position of the gradient, interpreted in the same way as background-position or transform-origin. If unspecified, it defaults to center.", + "<position>": "The position of the gradient, interpreted in the same way as background-position or transform-origin. If unspecified, it defaults to center.", "<shape>": "The gradient's shape. The value can be circle (meaning that the gradient's shape is a circle with constant radius) or ellipse (meaning that the shape is an axis-aligned ellipse). If unspecified, it defaults to ellipse.", "<extent-keyword>": "A keyword describing how big the ending shape must be. The possible values are:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
KeywordDescription
closest-sideThe gradient's ending shape meets the side of the box closest to its center (for circles) or meets both the vertical and horizontal sides closest to the center (for ellipses).
closest-cornerThe gradient's ending shape is sized so that it exactly meets the closest corner of the box from its center.
farthest-sideSimilar to closest-side, except the ending shape is sized to meet the side of the box farthest from its center (or vertical and horizontal sides).
farthest-cornerThe gradient's ending shape is sized so that it exactly meets the farthest corner of the box from its center.
\n
\n

Note:\nEarly implementations of this function included other keywords (cover and contain) as synonyms of the standard farthest-corner and closest-side, respectively. Use the standard keywords only, as some implementations have already dropped those older variants.\n

", - "<color-stop>": "A color-stop's <color> value, followed by an optional stop position (either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the center of the gradient; the value 100% represents the intersection of the ending shape with the virtual gradient ray. Percentage values in between are linearly positioned on the virtual gradient ray." + "<color-stop>": "A color-stop's <color> value, followed by an optional stop position (either a <percentage> or a <length> along the gradient's axis). A percentage of 0%, or a length of 0, represents the center of the gradient; the value 100% represents the intersection of the ending shape with the virtual gradient ray. Percentage values in between are linearly positioned on the virtual gradient ray." } }, "rgb": { - "url": "$MDN_URL$/web/css/color_value/rgb", + "url": "$MDN_URL$/web/css/reference/values/color_value/rgb", "status": [ "StandardTrack" ], @@ -5268,13 +5319,13 @@ "doc": "
\n

Note:\nThe rgba() functional notation is an alias for rgb(). They are exactly equivalent. It is recommended to use rgb().\n

\n

The rgb() functional notation expresses a color in the sRGB color space according to its red, green, and blue components. An optional alpha component represents the color's transparency.", "formalSyntax": "<legacy-rgb-syntax> | <modern-rgb-syntax>\n  <legacy-rgb-syntax> = rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )\n  <modern-rgb-syntax> = rgb( [ <number> | <percentage> | none ]{3} [ / [ <alpha-value> | none ] ]? )\n  <alpha-value> = <number> | <percentage>", "values": { - "R, G, B": "Each value can be represented as a <number> between 0 and 255, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). These values represent the red, green, and blue channels, respectively.

Each value can be represented as a <number> between 0 and 255, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). These values represent the red, green, and blue channel values of the output color, respectively.", - "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", - "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color: This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." + "R, G, B": "Each value can be represented as a <number> between 0 and 255, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). These values represent the red, green, and blue channels, respectively.

Each value can be represented as a <number> between 0 and 255, a <percentage> between 0% and 100%, or the keyword none (equivalent to 0% in this case). These values represent the red, green, and blue channel values of the output color, respectively.", + "A": "An <alpha-value> representing the alpha channel value of the color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to 100%. If included, the value is preceded by a slash (/).

An <alpha-value> representing the alpha channel value of the output color, where the number 0 corresponds to 0% (fully transparent) and 1 corresponds to 100% (fully opaque). Additionally, the keyword none can be used to explicitly specify no alpha channel. If the A channel value is not explicitly specified, it defaults to the alpha channel value of the origin color. If included, the value is preceded by a slash (/).", + "from <color>": "The keyword from is always included when defining a relative color, followed by a <color> value representing the origin color: This is the original color that the relative color is based on. The origin color can be any valid <color> syntax, including another relative color." } }, "rotate": { - "url": "$MDN_URL$/web/css/transform-function/rotate", + "url": "$MDN_URL$/web/css/reference/values/transform-function/rotate", "status": [ "StandardTrack" ], @@ -5293,14 +5344,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rotate() CSS function defines a transformation that rotates an element around a\nfixed point on the 2D plane, without deforming it. Its result is a <transform-function> data\ntype.", + "doc": "The rotate() CSS function defines a transformation that rotates an element around a\nfixed point on the 2D plane, without deforming it. Its result is a <transform-function> data\ntype.", "formalSyntax": "rotate( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle of the rotation. The direction of rotation depends on the writing direction.\nIn a left-to-right context, a positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In a right-to-left context,\na positive angle denotes a counter-clockwise rotation, a negative angle a clockwise one. A rotation by 180° is called point reflection." + "a": "Is an <angle> representing the angle of the rotation. The direction of rotation depends on the writing direction.\nIn a left-to-right context, a positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In a right-to-left context,\na positive angle denotes a counter-clockwise rotation, a negative angle a clockwise one. A rotation by 180° is called point reflection." } }, "rotate3d": { - "url": "$MDN_URL$/web/css/transform-function/rotate3d", + "url": "$MDN_URL$/web/css/reference/values/transform-function/rotate3d", "status": [ "StandardTrack" ], @@ -5319,17 +5370,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rotate3d() CSS function defines a transformation that rotates an element around a\nfixed axis in 3D space, without deforming it. Its result is a <transform-function> data type.", + "doc": "The rotate3d() CSS function defines a transformation that rotates an element around a\nfixed axis in 3D space, without deforming it. Its result is a <transform-function> data type.", "formalSyntax": "rotate3d( <number> , <number> , <number> , [ <angle> | <zero> ] )", "values": { - "x": "Is a <number> describing the x-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", - "y": "Is a <number> describing the y-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", - "z": "Is a <number> describing the z-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", - "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." + "x": "Is a <number> describing the x-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", + "y": "Is a <number> describing the y-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", + "z": "Is a <number> describing the z-coordinate of the vector denoting the axis of rotation which\ncan be a positive or negative number.", + "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." } }, "rotatex": { - "url": "$MDN_URL$/web/css/transform-function/rotatex", + "url": "$MDN_URL$/web/css/reference/values/transform-function/rotatex", "status": [ "StandardTrack" ], @@ -5348,14 +5399,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rotateX() CSS function defines a transformation that rotates an element around the\nx-axis (horizontal) without deforming it. Its result is a <transform-function> data type.", + "doc": "The rotateX() CSS function defines a transformation that rotates an element around the\nx-axis (horizontal) without deforming it. Its result is a <transform-function> data type.", "formalSyntax": "rotateX( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." + "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." } }, "rotatey": { - "url": "$MDN_URL$/web/css/transform-function/rotatey", + "url": "$MDN_URL$/web/css/reference/values/transform-function/rotatey", "status": [ "StandardTrack" ], @@ -5374,14 +5425,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rotateY() CSS function defines a transformation that rotates an element around the\ny-axis (vertical) without deforming it. Its result is a <transform-function> data type.", + "doc": "The rotateY() CSS function defines a transformation that rotates an element around the\ny-axis (vertical) without deforming it. Its result is a <transform-function> data type.", "formalSyntax": "rotateY( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." + "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." } }, "rotatez": { - "url": "$MDN_URL$/web/css/transform-function/rotatez", + "url": "$MDN_URL$/web/css/reference/values/transform-function/rotatez", "status": [ "StandardTrack" ], @@ -5400,14 +5451,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rotateZ() CSS function defines a transformation that rotates an element around the\nz-axis without deforming it. Its result is a <transform-function> data type.", + "doc": "The rotateZ() CSS function defines a transformation that rotates an element around the\nz-axis without deforming it. Its result is a <transform-function> data type.", "formalSyntax": "rotateZ( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." + "a": "Is an <angle> representing the angle of the rotation. A positive angle denotes a clockwise\nrotation, a negative angle a counter-clockwise one." } }, "round": { - "url": "$MDN_URL$/web/css/round", + "url": "$MDN_URL$/web/css/reference/values/round", "status": [ "StandardTrack" ], @@ -5425,11 +5476,11 @@ "level": "LOW", "lowDate": "2024-05-17" }, - "doc": "The round() CSS function returns a rounded number based on a selected rounding strategy.\n

Authors should use a custom CSS property (e.g., --my-property) for the rounding value, interval, or both; using the round() function is redundant if these have known values.", + "doc": "The round() CSS function returns a rounded number based on a selected rounding strategy.\n

Authors should use a custom CSS property (e.g., --my-property) for the rounding value, interval, or both; using the round() function is redundant if these have known values.", "formalSyntax": "round( <rounding-strategy>? , <calc-sum> , <calc-sum>? )\n  <rounding-strategy> = nearest | up | down | to-zero\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "saturate": { - "url": "$MDN_URL$/web/css/filter-function/saturate", + "url": "$MDN_URL$/web/css/reference/values/filter-function/saturate", "status": [ "StandardTrack" ], @@ -5448,11 +5499,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The saturate() CSS function super-saturates or desaturates the input image. Its result is a <filter-function>.\n

\n

Note:\nsaturate() is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the hue or lightness of the original color.\n

", + "doc": "The saturate() CSS function super-saturates or desaturates the input image. Its result is a <filter-function>.\n
\n

Note:\nsaturate() is specified as a matrix operation on the RGB color. It does not actually convert the color to the HSL model, which is a non-linear operation. Therefore, it may not preserve the hue or lightness of the original color.\n

", "formalSyntax": "saturate( [ <number> | <percentage> ]? )" }, "scale": { - "url": "$MDN_URL$/web/css/transform-function/scale", + "url": "$MDN_URL$/web/css/reference/values/transform-function/scale", "status": [ "StandardTrack" ], @@ -5471,15 +5522,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scale() CSS function defines a transformation that resizes an element on the 2D\nplane. Because the amount of scaling is defined by a vector [sx, sy], it can resize the horizontal and vertical dimensions at\ndifferent scales. Its result is a <transform-function> data type.", + "doc": "The scale() CSS function defines a transformation that resizes an element on the 2D\nplane. Because the amount of scaling is defined by a vector [sx, sy], it can resize the horizontal and vertical dimensions at\ndifferent scales. Its result is a <transform-function> data type.", "formalSyntax": "scale( [ <number> | <percentage> ]#{1,2} )", "values": { - "sx": "A <number> or <percentage> representing the abscissa (horizontal, x-component) of the scaling vector.", - "sy": "A <number> or <percentage> representing the ordinate (vertical, y-component) of the scaling vector.\nIf not defined, its default value is sx, resulting in a uniform scaling that preserves the element's aspect ratio." + "sx": "A <number> or <percentage> representing the abscissa (horizontal, x-component) of the scaling vector.", + "sy": "A <number> or <percentage> representing the ordinate (vertical, y-component) of the scaling vector.\nIf not defined, its default value is sx, resulting in a uniform scaling that preserves the element's aspect ratio." } }, "scale3d": { - "url": "$MDN_URL$/web/css/transform-function/scale3d", + "url": "$MDN_URL$/web/css/reference/values/transform-function/scale3d", "status": [ "StandardTrack" ], @@ -5498,16 +5549,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scale3d() CSS function defines a transformation that resizes an element in 3D space.\nBecause the amount of scaling is defined by a vector [sx, sy, sz], it can resize different dimensions at different scales. Its\nresult is a <transform-function> data type.", + "doc": "The scale3d() CSS function defines a transformation that resizes an element in 3D space.\nBecause the amount of scaling is defined by a vector [sx, sy, sz], it can resize different dimensions at different scales. Its\nresult is a <transform-function> data type.", "formalSyntax": "scale3d( [ <number> | <percentage> ]#{3} )", "values": { - "sx": "Is a <number> representing the abscissa (horizontal, x-component) of the scaling vector.", - "sy": "Is a <number> representing the ordinate (vertical, y-component) of the scaling vector.", - "sz": "Is a <number> representing the z-component of the scaling vector." + "sx": "Is a <number> representing the abscissa (horizontal, x-component) of the scaling vector.", + "sy": "Is a <number> representing the ordinate (vertical, y-component) of the scaling vector.", + "sz": "Is a <number> representing the z-component of the scaling vector." } }, "scalex": { - "url": "$MDN_URL$/web/css/transform-function/scalex", + "url": "$MDN_URL$/web/css/reference/values/transform-function/scalex", "status": [ "StandardTrack" ], @@ -5526,14 +5577,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scaleX() CSS function defines a transformation that resizes an element along the\nx-axis (horizontally). Its result is a <transform-function> data type.", + "doc": "The scaleX() CSS function defines a transformation that resizes an element along the\nx-axis (horizontally). Its result is a <transform-function> data type.", "formalSyntax": "scaleX( [ <number> | <percentage> ] )", "values": { - "s": "Is a <number> representing the scaling factor to apply on the abscissa (horizontal, x-coordinate) of each point of the\nelement." + "s": "Is a <number> representing the scaling factor to apply on the abscissa (horizontal, x-coordinate) of each point of the\nelement." } }, "scaley": { - "url": "$MDN_URL$/web/css/transform-function/scaley", + "url": "$MDN_URL$/web/css/reference/values/transform-function/scaley", "status": [ "StandardTrack" ], @@ -5552,14 +5603,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scaleY() CSS function defines a transformation that resizes an element along the\ny-axis (vertically). Its result is a <transform-function> data type.", + "doc": "The scaleY() CSS function defines a transformation that resizes an element along the\ny-axis (vertically). Its result is a <transform-function> data type.", "formalSyntax": "scaleY( [ <number> | <percentage> ] )", "values": { - "s": "Is a <number> representing the scaling factor to apply on the ordinate (vertical, y-coordinate) of each point of the\nelement." + "s": "Is a <number> representing the scaling factor to apply on the ordinate (vertical, y-coordinate) of each point of the\nelement." } }, "scalez": { - "url": "$MDN_URL$/web/css/transform-function/scalez", + "url": "$MDN_URL$/web/css/reference/values/transform-function/scalez", "status": [ "StandardTrack" ], @@ -5578,14 +5629,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scaleZ() CSS function defines a transformation that resizes an element along the\nz-axis. Its result is a <transform-function> data type.", + "doc": "The scaleZ() CSS function defines a transformation that resizes an element along the\nz-axis. Its result is a <transform-function> data type.", "formalSyntax": "scaleZ( [ <number> | <percentage> ] )", "values": { - "s": "Is a <number> representing the scaling factor to apply on the z-coordinate of each point of\nthe element." + "s": "Is a <number> representing the scaling factor to apply on the z-coordinate of each point of\nthe element." } }, "sepia": { - "url": "$MDN_URL$/web/css/filter-function/sepia", + "url": "$MDN_URL$/web/css/reference/values/filter-function/sepia", "status": [ "StandardTrack" ], @@ -5604,11 +5655,11 @@ "lowDate": "2016-09-07", "highDate": "2019-03-07" }, - "doc": "The sepia() CSS function converts the input image to sepia, giving it a warmer, more yellow/brown appearance. Its result is a <filter-function>.", + "doc": "The sepia() CSS function converts the input image to sepia, giving it a warmer, more yellow/brown appearance. Its result is a <filter-function>.", "formalSyntax": "sepia( [ <number> | <percentage> ]? )" }, "shape": { - "url": "$MDN_URL$/web/css/basic-shape/shape", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/shape", "status": [ "StandardTrack" ], @@ -5624,13 +5675,12 @@ "baseline": { "level": "NONE" }, - "doc": "The shape() CSS function is used to define a shape for the clip-path and offset-path properties. It combines an initial starting point with a series of shape commands that define the path of the shape. The shape() function is a member of the <basic-shape> data type.", + "doc": "The shape() CSS function is used to define a shape for the clip-path and offset-path properties. It combines an initial starting point with a series of shape commands that define the path of the shape. The shape() function is a member of the <basic-shape> data type.", "formalSyntax": "shape( <'fill-rule'>? from <position> , <shape-command># )\n  <fill-rule> = nonzero | evenodd\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <shape-command> = <move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>\n  <length-percentage> = <length> | <percentage>\n  <move-command> = move <command-end-point>\n  <line-command> = line <command-end-point>\n  <horizontal-line-command> = hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]\n  <vertical-line-command> = vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]\n  <curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]\n  <smooth-command> = smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]\n  <arc-command> = arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [ rotate <angle> ]? ]\n  <command-end-point> = to <position> | by <coordinate-pair>\n  <control-point> = <position> | <relative-control-point>\n  <coordinate-pair> = <length-percentage>{2}\n  <relative-control-point> = <coordinate-pair> [ from [ start | end | origin ] ]?\n  <arc-sweep> = cw | ccw\n  <arc-size> = large | small" }, "sibling-count": { - "url": "$MDN_URL$/web/css/sibling-count", + "url": "$MDN_URL$/web/css/reference/values/sibling-count", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { @@ -5638,17 +5688,17 @@ "ChromeAndroid": "138", "Edge": "138", "Opera": "122", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

\n

The sibling-count() CSS function returns an integer representing the total number of sibling DOM elements (direct children of the parent) of the element on which it is used, including itself.\n

\n

Note:\nThe counter() function provides a similar result but it returns a <string> (which is more suitable for generated content, while sibling-count() returns an <integer> (which can be used for calculations).\n

" + "doc": "The sibling-count() CSS function returns an integer representing the total number of sibling DOM elements (direct children of the parent) of the element on which it is used, including itself.\n
\n

Note:\nThe counter() function provides a similar result but it returns a <string> (which is more suitable for generated content, while sibling-count() returns an <integer> (which can be used for calculations).\n

" }, "sibling-index": { - "url": "$MDN_URL$/web/css/sibling-index", + "url": "$MDN_URL$/web/css/reference/values/sibling-index", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { @@ -5656,15 +5706,16 @@ "ChromeAndroid": "138", "Edge": "138", "Opera": "122", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

\n

The sibling-index() CSS function returns an integer representing the position of the current element in the DOM tree relative to all its sibling elements. The returned value is the index number of the contextual child's position among all the sibling elements within a parent element, with the first child returning 1 and the last child, returning the length of Element.children.\n

\n

Note:\nLike the :nth-child() pseudo-class, sibling-index() starts from 1, not 0.\n

\n
\n

Note:\nThe counter() function provides a similar result but it returns a <string> (which is more suitable for generated content, while sibling-index() returns an <integer> (which can be used for calculations).\n

" + "doc": "The sibling-index() CSS function returns an integer representing the position of the current element in the DOM tree relative to all its sibling elements. The returned value is the index number of the contextual child's position among all the sibling elements within a parent element, with the first child returning 1 and the last child, returning the length of Element.children.\n
\n

Note:\nLike the :nth-child() pseudo-class, sibling-index() starts from 1, not 0.\n

\n
\n

Note:\nThe counter() function provides a similar result but it returns a <string> (which is more suitable for generated content, while sibling-index() returns an <integer> (which can be used for calculations).\n

" }, "sign": { - "url": "$MDN_URL$/web/css/sign", + "url": "$MDN_URL$/web/css/reference/values/sign", "status": [ "StandardTrack" ], @@ -5682,11 +5733,11 @@ "level": "LOW", "lowDate": "2025-06-26" }, - "doc": "The sign() CSS function contains one calculation, and returns -1 if the numeric value of the argument is negative, +1 if the numeric value of the argument is positive, 0⁺ if the numeric value of the argument is 0⁺, and 0⁻ if the numeric value of the argument is 0⁻.\n
\n

Note:\nWhile abs() returns the absolute value of the argument, sign() returns the sign of the argument.\n

", + "doc": "The sign() CSS function contains one calculation, and returns -1 if the numeric value of the argument is negative, +1 if the numeric value of the argument is positive, 0⁺ if the numeric value of the argument is 0⁺, and 0⁻ if the numeric value of the argument is 0⁻.\n
\n

Note:\nWhile abs() returns the absolute value of the argument, sign() returns the sign of the argument.\n

", "formalSyntax": "sign( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "sin": { - "url": "$MDN_URL$/web/css/sin", + "url": "$MDN_URL$/web/css/reference/values/sin", "status": [ "StandardTrack" ], @@ -5705,11 +5756,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The sin() CSS function is a trigonometric function that returns the sine of a number, which is a value between -1 and 1. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians. That is, sin(45deg), sin(0.125turn), and sin(3.14159 / 4) all represent the same value, approximately 0.707.", + "doc": "The sin() CSS function is a trigonometric function that returns the sine of a number, which is a value between -1 and 1. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians. That is, sin(45deg), sin(0.125turn), and sin(3.14159 / 4) all represent the same value, approximately 0.707.", "formalSyntax": "sin( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "skew": { - "url": "$MDN_URL$/web/css/transform-function/skew", + "url": "$MDN_URL$/web/css/reference/values/transform-function/skew", "status": [ "StandardTrack" ], @@ -5728,15 +5779,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The skew() CSS function defines a transformation that skews an element on the 2D\nplane. Its result is a <transform-function> data type.", + "doc": "The skew() CSS function defines a transformation that skews an element on the 2D\nplane. Its result is a <transform-function> data type.", "formalSyntax": "skew( [ <angle> | <zero> ] , [ <angle> | <zero> ]? )", "values": { - "ax": "Is an <angle> representing the angle to use to distort the element along the x-axis.", - "ay": "Is an <angle> representing the angle to use to distort the element along the y-axis. If not defined, its default value is 0, resulting in a purely horizontal skewing." + "ax": "Is an <angle> representing the angle to use to distort the element along the x-axis.", + "ay": "Is an <angle> representing the angle to use to distort the element along the y-axis. If not defined, its default value is 0, resulting in a purely horizontal skewing." } }, "skewx": { - "url": "$MDN_URL$/web/css/transform-function/skewx", + "url": "$MDN_URL$/web/css/reference/values/transform-function/skewx", "status": [ "StandardTrack" ], @@ -5755,14 +5806,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The skewX() CSS function defines a transformation that skews an element in the\nhorizontal direction on the 2D plane. Its result is a <transform-function> data type.", + "doc": "The skewX() CSS function defines a transformation that skews an element in the\nhorizontal direction on the 2D plane. Its result is a <transform-function> data type.", "formalSyntax": "skewX( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle to use to distort the element along the abscissa (horizontal, x-coordinate)." + "a": "Is an <angle> representing the angle to use to distort the element along the abscissa (horizontal, x-coordinate)." } }, "skewy": { - "url": "$MDN_URL$/web/css/transform-function/skewy", + "url": "$MDN_URL$/web/css/reference/values/transform-function/skewy", "status": [ "StandardTrack" ], @@ -5781,14 +5832,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The skewY() CSS function defines a transformation that skews an element in the vertical\ndirection on the 2D plane. Its result is a <transform-function> data type.", + "doc": "The skewY() CSS function defines a transformation that skews an element in the vertical\ndirection on the 2D plane. Its result is a <transform-function> data type.", "formalSyntax": "skewY( [ <angle> | <zero> ] )", "values": { - "a": "Is an <angle> representing the angle to use to distort the element along the ordinate (vertical, y-coordinate)." + "a": "Is an <angle> representing the angle to use to distort the element along the ordinate (vertical, y-coordinate)." } }, "sqrt": { - "url": "$MDN_URL$/web/css/sqrt", + "url": "$MDN_URL$/web/css/reference/values/sqrt", "status": [ "StandardTrack" ], @@ -5806,11 +5857,11 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The sqrt() CSS function is an exponential function that returns the square root of a number.\n

The function pow(x, 0.5) is equivalent to sqrt(x).", + "doc": "The sqrt() CSS function is an exponential function that returns the square root of a number.\n

The function pow(x, 0.5) is equivalent to sqrt(x).", "formalSyntax": "sqrt( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "steps": { - "url": "$MDN_URL$/web/css/easing-function/steps", + "url": "$MDN_URL$/web/css/reference/values/easing-function/steps", "status": [ "StandardTrack" ], @@ -5829,11 +5880,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The steps() CSS function defines a transition that divides the input time into a specified number of intervals that are equal in length. This subclass of step functions are sometimes also called staircase functions.", - "formalSyntax": "steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end" + "doc": "The steps() CSS function defines a transition that divides the input time into a specified number of intervals that are equal in length. This subclass of step functions are sometimes also called staircase functions.", + "formalSyntax": "steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end" }, "superellipse": { - "url": "$MDN_URL$/web/css/superellipse", + "url": "$MDN_URL$/web/css/reference/values/superellipse", "status": [ "Experimental", "StandardTrack" @@ -5847,11 +5898,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The superellipse() CSS function defines the curvature of an ellipse, and is used to specify corner shapes either directly, or via <corner-shape-value> keywords.", - "formalSyntax": "superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

\n

The superellipse() CSS function defines the curvature of an ellipse, and is used to specify corner shapes either directly, or via <corner-shape-value> keywords.", + "formalSyntax": "superellipse( <number> | infinity | -infinity )" }, "symbols": { - "url": "$MDN_URL$/web/css/symbols", + "url": "$MDN_URL$/web/css/reference/values/symbols", "status": [ "StandardTrack" ], @@ -5862,11 +5913,11 @@ "baseline": { "level": "NONE" }, - "doc": "The symbols() CSS function enables defining counter styles inline, directly as a value of properties such as list-style, providing a less powerful but simpler alternative to the @counter-style method of defining a counter style.\n

Unlike @counter-style, which defines a reusable counter style, symbols() is anonymous (i.e., it can only be used once). This function accepts strings and images as values. In comparison, the @counter-style's symbols descriptor also accepts identifiers.", + "doc": "The symbols() CSS function enables defining counter styles inline, directly as a value of properties such as list-style, providing a less powerful but simpler alternative to the @counter-style method of defining a counter style.\n

Unlike @counter-style, which defines a reusable counter style, symbols() is anonymous (i.e., it can only be used once). This function accepts strings and images as values. In comparison, the @counter-style's symbols descriptor also accepts identifiers.", "formalSyntax": "symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )" }, "tan": { - "url": "$MDN_URL$/web/css/tan", + "url": "$MDN_URL$/web/css/reference/values/tan", "status": [ "StandardTrack" ], @@ -5885,11 +5936,11 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The tan() CSS function is a trigonometric function that returns the tangent of a number, which is a value between −infinity and infinity. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians.", + "doc": "The tan() CSS function is a trigonometric function that returns the tangent of a number, which is a value between −infinity and infinity. The function contains a single calculation that must resolve to either a <number> or an <angle> by interpreting the result of the argument as radians.", "formalSyntax": "tan( <calc-sum> )\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "translate": { - "url": "$MDN_URL$/web/css/transform-function/translate", + "url": "$MDN_URL$/web/css/reference/values/transform-function/translate", "status": [ "StandardTrack" ], @@ -5908,15 +5959,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The translate() CSS function repositions an element in the horizontal and/or vertical\ndirections. Its result is a <transform-function> data type.", + "doc": "The translate() CSS function repositions an element in the horizontal and/or vertical\ndirections. Its result is a <transform-function> data type.", "formalSyntax": "translate( <length-percentage> , <length-percentage>? )\n  <length-percentage> = <length> | <percentage>", "values": { - "Single <length-percentage> values": "This value is a <length> or <percentage> representing the abscissa\n(horizontal, x-component) of the translating vector [tx, 0]. The ordinate (vertical, y-component) of the translating\nvector will be set to 0. For example, translate(2px) is equivalent to\ntranslate(2px, 0). A percentage value refers to the width of the reference box defined by the\ntransform-box property.", - "Double <length-percentage> values": "This value describes two <length> or <percentage> values representing\nboth the abscissa (horizontal, x-component) and the ordinate (vertical, y-component) of the translating vector [tx, ty]. A percentage as first\nvalue refers to the width, as second part to the height of the reference box defined by the\ntransform-box property." + "Single <length-percentage> values": "This value is a <length> or <percentage> representing the abscissa\n(horizontal, x-component) of the translating vector [tx, 0]. The ordinate (vertical, y-component) of the translating\nvector will be set to 0. For example, translate(2px) is equivalent to\ntranslate(2px, 0). A percentage value refers to the width of the reference box defined by the\ntransform-box property.", + "Double <length-percentage> values": "This value describes two <length> or <percentage> values representing\nboth the abscissa (horizontal, x-component) and the ordinate (vertical, y-component) of the translating vector [tx, ty]. A percentage as first\nvalue refers to the width, as second part to the height of the reference box defined by the\ntransform-box property." } }, "translate3d": { - "url": "$MDN_URL$/web/css/transform-function/translate3d", + "url": "$MDN_URL$/web/css/reference/values/transform-function/translate3d", "status": [ "StandardTrack" ], @@ -5935,16 +5986,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The translate3d() CSS function repositions an element in 3D space. Its result is a\n<transform-function> data type.", + "doc": "The translate3d() CSS function repositions an element in 3D space. Its result is a\n<transform-function> data type.", "formalSyntax": "translate3d( <length-percentage> , <length-percentage> , <length> )\n  <length-percentage> = <length> | <percentage>", "values": { - "tx": "Is a <length> or <percentage> representing the abscissa (horizontal, x-component) of the\ntranslating vector [tx, ty, tz].", - "ty": "Is a <length> or <percentage> representing the ordinate (vertical, y-component)of the\ntranslating vector [tx, ty, tz].", - "tz": "Is a <length> representing the z-component of the translating vector. It can't be a\n<percentage> value; in that case the property containing the transform is considered invalid [tx, ty, tz]." + "tx": "Is a <length> or <percentage> representing the abscissa (horizontal, x-component) of the\ntranslating vector [tx, ty, tz].", + "ty": "Is a <length> or <percentage> representing the ordinate (vertical, y-component)of the\ntranslating vector [tx, ty, tz].", + "tz": "Is a <length> representing the z-component of the translating vector. It can't be a\n<percentage> value; in that case the property containing the transform is considered invalid [tx, ty, tz]." } }, "translatex": { - "url": "$MDN_URL$/web/css/transform-function/translatex", + "url": "$MDN_URL$/web/css/reference/values/transform-function/translatex", "status": [ "StandardTrack" ], @@ -5963,14 +6014,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The translateX() CSS function repositions an element horizontally on the 2D plane. Its\nresult is a <transform-function> data type.", + "doc": "The translateX() CSS function repositions an element horizontally on the 2D plane. Its\nresult is a <transform-function> data type.", "formalSyntax": "translateX( <length-percentage> )\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Is a <length> or <percentage> representing the abscissa (horizontal, x-component) of the\ntranslating vector [tx, 0]. In Cartesian coordinate system it represents shift along x-axis. A percentage value refers to the width of the reference box defined by the\ntransform-box property." + "<length-percentage>": "Is a <length> or <percentage> representing the abscissa (horizontal, x-component) of the\ntranslating vector [tx, 0]. In Cartesian coordinate system it represents shift along x-axis. A percentage value refers to the width of the reference box defined by the\ntransform-box property." } }, "translatey": { - "url": "$MDN_URL$/web/css/transform-function/translatey", + "url": "$MDN_URL$/web/css/reference/values/transform-function/translatey", "status": [ "StandardTrack" ], @@ -5989,14 +6040,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The translateY() CSS function repositions an element vertically on the 2D plane. Its result\nis a <transform-function> data type.", + "doc": "The translateY() CSS function repositions an element vertically on the 2D plane. Its result\nis a <transform-function> data type.", "formalSyntax": "translateY( <length-percentage> )\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "The value is a <length> or <percentage> representing the ordinate (vertical, y-coordinate) of the\ntranslating vector [0, ty]. In Cartesian coordinate system it represents shift along y-axis. A percentage value refers to the height of the reference box defined by the\ntransform-box property." + "<length-percentage>": "The value is a <length> or <percentage> representing the ordinate (vertical, y-coordinate) of the\ntranslating vector [0, ty]. In Cartesian coordinate system it represents shift along y-axis. A percentage value refers to the height of the reference box defined by the\ntransform-box property." } }, "translatez": { - "url": "$MDN_URL$/web/css/transform-function/translatez", + "url": "$MDN_URL$/web/css/reference/values/transform-function/translatez", "status": [ "StandardTrack" ], @@ -6015,14 +6066,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The translateZ() CSS function repositions an element along the z-axis in 3D space, i.e.,\ncloser to or farther away from the viewer. Its result is a <transform-function> data type.", + "doc": "The translateZ() CSS function repositions an element along the z-axis in 3D space, i.e.,\ncloser to or farther away from the viewer. Its result is a <transform-function> data type.", "formalSyntax": "translateZ( <length> )", "values": { - "tz": "A <length> representing the z-component of the translating vector [0, 0, tz]. In Cartesian coordinate system it represents shift along z-axis. A positive value moves the\nelement towards the viewer, and a negative value farther away." + "tz": "A <length> representing the z-component of the translating vector [0, 0, tz]. In Cartesian coordinate system it represents shift along z-axis. A positive value moves the\nelement towards the viewer, and a negative value farther away." } }, "type": { - "url": "$MDN_URL$/web/css/type", + "url": "$MDN_URL$/web/css/reference/values/type", "status": [ "Experimental", "StandardTrack" @@ -6036,11 +6087,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

\n

The type() CSS function allows you to specify a particular data type, and is used by the following CSS features:\n

\n
\n

Note:\nThe @property at-rule syntax descriptor value uses the same <syntax> to define the permitted data types for registered custom properties, however, this always takes the form of a string.\n

", + "doc": "

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

\n

The type() CSS function allows you to specify a particular data type, and is used by the following CSS features:\n

\n
\n

Note:\nThe @property at-rule syntax descriptor value uses the same <syntax> to define the permitted data types for registered custom properties, however, this always takes the form of a string.\n

", "formalSyntax": "type( <string> )" }, "url": { - "url": "$MDN_URL$/web/css/url_function", + "url": "$MDN_URL$/web/css/reference/values/url_function", "status": [ "StandardTrack" ], @@ -6059,7 +6110,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The url() CSS function is used to include a file. The parameter is an absolute URL, a relative URL, a blob URL, or a data URL. The url() function can be passed as a parameter of another CSS function, like the attr() function. Depending on the property for which it is a value, the resource sought can be an image, font, or a stylesheet. The url() functional notation is the value for the <url> data type.\n
\n

Note:\nThere is a difference between a URI and a URL. A URI identifies a resource. A URL is a type of URI, and describes the location of a resource. A URI can be either a URL or a name (URN) of a resource.\n

In CSS Level 1, the url() functional notation described only true URLs. In CSS Level 2, the definition of url() was extended to describe any URI, whether a URL or a URN. Confusingly, this meant that url() could be used to create a <uri> CSS data type. This change was not only awkward but, debatably, unnecessary, since URNs are almost never used in actual CSS. To alleviate the confusion, CSS Level 3 returned to the narrower, initial definition. Now, url() denotes only true <url>s.\n

\n

Relative URLs, if used, are relative to the URL of the stylesheet (not to the URL of the web page).\n

The url() function can be included as a value for\nbackground, background-image, border, border-image, border-image-source, content, cursor, filter, list-style, list-style-image, mask, mask-image, offset-path, clip-path,\nsrc as part of a @font-face block, and @counter-style/symbol", + "doc": "The url() CSS function is used to include a file. The parameter is an absolute URL, a relative URL, a blob URL, or a data URL. The url() function can be passed as a parameter of another CSS function, like the attr() function. Depending on the property for which it is a value, the resource sought can be an image, font, or a stylesheet. The url() functional notation is the value for the <url> data type.\n

\n

Note:\nThere is a difference between a URI and a URL. A URI identifies a resource. A URL is a type of URI, and describes the location of a resource. A URI can be either a URL or a name (URN) of a resource.\n

In CSS Level 1, the url() functional notation described only true URLs. In CSS Level 2, the definition of url() was extended to describe any URI, whether a URL or a URN. Confusingly, this meant that url() could be used to create a <uri> CSS data type. This change was not only awkward but, debatably, unnecessary, since URNs are almost never used in actual CSS. To alleviate the confusion, CSS Level 3 returned to the narrower, initial definition. Now, url() denotes only true <url>s.\n

\n

Relative URLs, if used, are relative to the URL of the stylesheet (not to the URL of the web page).\n

The url() function can be included as a value for\nbackground, background-image, border, border-image, border-image-source, content, cursor, filter, list-style, list-style-image, mask, mask-image, offset-path, clip-path,\nsrc as part of a @font-face block, and @counter-style/symbol", "formalSyntax": "url( <string> <url-modifier>* ) | <url-token>", "values": { "<string>": "A string specifying a URL, which is a relative or absolute address, or pointer, to the web resource to be included, or a data URL. You can also use a hash URL to reference the ID of an SVG shape or an SVG filter.\n

The quotes are generally optional—they are required if the URL includes parentheses, whitespace, or quotes (unless these characters are escaped), or if the address includes control characters above 0x7e. Normal string syntax rules apply: double quotes cannot occur inside double quotes and single quotes cannot occur inside single quotes unless escaped.", @@ -6067,7 +6118,7 @@ } }, "var": { - "url": "$MDN_URL$/web/css/var", + "url": "$MDN_URL$/web/css/reference/values/var", "status": [ "StandardTrack" ], @@ -6086,15 +6137,15 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The var() CSS function can be used to insert the value of a custom property (sometimes called a \"CSS variable\") instead of any part of a value of another property.", + "doc": "The var() CSS function can be used to insert the value of a custom property (sometimes called a \"CSS variable\") instead of any part of a value of another property.", "formalSyntax": "var( <custom-property-name> , <declaration-value>? )", "values": { "<custom-property-name>": "A custom property's name represented by an identifier that starts with two dashes. Custom properties are solely for use by authors and users; CSS will never give them a meaning beyond what is presented here.", - "<declaration-value>": "The custom property's fallback value, which is used in case the custom property is not defined or equals a CSS-wide keyword. This value may contain any character except some characters with special meaning like newlines, unmatched closing brackets, i.e., ), ], or }, top-level semicolons, or exclamation marks. The fallback value can itself be a custom property using the var() syntax. If the fallback value is omitted, and the custom property is not defined, the var() function resolves to an invalid value.\n

\n

Note:\nvar(--a,) is valid, specifying that if the --a custom property is not defined or equals a CSS-wide keyword, the var() should be replaced with nothing.\n

" + "<declaration-value>": "The custom property's fallback value, which is used in case the custom property is not defined or equals a CSS-wide keyword. This value may contain any character except some characters with special meaning like newlines, unmatched closing brackets, i.e., ), ], or }, top-level semicolons, or exclamation marks. The fallback value can itself be a custom property using the var() syntax. If the fallback value is omitted, and the custom property is not defined, the var() function resolves to an invalid value.\n
\n

Note:\nvar(--a,) is valid, specifying that if the --a custom property is not defined or equals a CSS-wide keyword, the var() should be replaced with nothing.\n

" } }, "xywh": { - "url": "$MDN_URL$/web/css/basic-shape/xywh", + "url": "$MDN_URL$/web/css/reference/values/basic-shape/xywh", "status": [ "StandardTrack" ], @@ -6112,18 +6163,18 @@ "level": "LOW", "lowDate": "2024-01-23" }, - "doc": "The xywh() CSS function creates a rectangle using the specified distances from the left (x) and top (y) edges of the containing block and the specified width (w) and height (h) of the rectangle. It is a basic shape function of the <basic-shape> data type. You can use the xywh() function in CSS properties such as offset-path to create the rectangular path along which an element moves and in clip-path to define the shape of the clipping region.", + "doc": "The xywh() CSS function creates a rectangle using the specified distances from the left (x) and top (y) edges of the containing block and the specified width (w) and height (h) of the rectangle. It is a basic shape function of the <basic-shape> data type. You can use the xywh() function in CSS properties such as offset-path to create the rectangular path along which an element moves and in clip-path to define the shape of the clipping region.", "formalSyntax": "xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <length-percentage> = <length> | <percentage>\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?", "values": { - "<length-percentage>": "Specifies the <length-percentage> values for the x and y coordinates of the rectangle.", - "<length-percentage [0,∞]>": "Specifies non-negative <length-percentage> values for the width and height of the rectangle. The minimum value can be zero, and the maximum value has no limit.", - "round <'border-radius'>": "Specifies the radius of the rounded corners of the rectangle using the same syntax as the CSS border-radius shorthand property. This parameter is optional." + "<length-percentage>": "Specifies the <length-percentage> values for the x and y coordinates of the rectangle.", + "<length-percentage [0,∞]>": "Specifies non-negative <length-percentage> values for the width and height of the rectangle. The minimum value can be zero, and the maximum value has no limit.", + "round <'border-radius'>": "Specifies the radius of the rounded corners of the rectangle using the same syntax as the CSS border-radius shorthand property. This parameter is optional." } } }, "properties": { "--_star_": { - "url": "$MDN_URL$/web/css/--_star_", + "url": "$MDN_URL$/web/css/reference/properties/--_star_", "status": [ "StandardTrack" ], @@ -6142,10 +6193,10 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "Property names that are prefixed with --, like --example-name, represent custom properties that contain a value that can be used in other declarations using the var() function.\n

Custom properties are scoped to the element(s) they are declared on, and participate in the cascade: the value of such a custom property is that from the declaration decided by the cascading algorithm.\n

Initial valuesee prose
Applies toall elements
Inheritedyes
Computed valueas specified with variables substituted
Animation typediscrete
" + "doc": "Property names that are prefixed with --, like --example-name, represent custom properties that contain a value that can be used in other declarations using the var() function.\n

Custom properties are scoped to the element(s) they are declared on, and participate in the cascade: the value of such a custom property is that from the declaration decided by the cascading algorithm.\n

Initial valuesee prose
Applies toall elements
Inheritedyes
Computed valueas specified with variables substituted
Animation typediscrete
" }, "-moz-float-edge": { - "url": "$MDN_URL$/web/css/-moz-float-edge", + "url": "$MDN_URL$/web/css/reference/properties/-moz-float-edge", "status": [ "Deprecated" ], @@ -6161,7 +6212,7 @@ } }, "-moz-force-broken-image-icon": { - "url": "$MDN_URL$/web/css/-moz-force-broken-image-icon", + "url": "$MDN_URL$/web/css/reference/properties/-moz-force-broken-image-icon", "status": [ "Deprecated" ], @@ -6170,13 +6221,13 @@ "FirefoxAndroid": "4" }, "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n

The -moz-force-broken-image-icon extended CSS property can be used to force the broken image icon to be shown even when a broken image has an alt attribute.", - "formalSyntax": "<integer>", + "formalSyntax": "<integer>\n  <integer> = <number-token>", "values": { "<integer>": "A value of 1 means that the broken image icon is shown even if the image has an alt attribute. When the value 0 is used, the image will act as usual and only display the alt attribute." } }, "-moz-orient": { - "url": "$MDN_URL$/web/css/-moz-orient", + "url": "$MDN_URL$/web/css/reference/properties/-moz-orient", "compatibility": { "Firefox": "6", "FirefoxAndroid": "6" @@ -6191,7 +6242,7 @@ } }, "-moz-user-focus": { - "url": "$MDN_URL$/web/css/-moz-user-focus", + "url": "$MDN_URL$/web/css/reference/properties/-moz-user-focus", "status": [ "Deprecated" ], @@ -6205,7 +6256,7 @@ } }, "-moz-user-input": { - "url": "$MDN_URL$/web/css/-moz-user-input", + "url": "$MDN_URL$/web/css/reference/properties/-moz-user-input", "status": [ "Deprecated" ], @@ -6214,11 +6265,11 @@ "formalSyntax": "auto | none", "values": { "auto": "The element will respond to user input if it normally takes user input, such as a <textarea>.", - "none": "The element does not respond to user input, and it does not become :active." + "none": "The element does not respond to user input, and it does not become :active." } }, "-webkit-border-before": { - "url": "$MDN_URL$/web/css/-webkit-border-before", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-border-before", "compatibility": { "Chrome": "8", "ChromeAndroid": "", @@ -6230,13 +6281,13 @@ "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The -webkit-border-before CSS property is a shorthand property for setting the individual logical block start border property values in a single place in the style sheet.", "formalSyntax": "<'border-width'> || <'border-style'> || <color>\n  <border-width> = <'border-top-width'>{1,4}\n  <border-style> = <'border-top-style'>{1,4}\n  <border-top-width> = <line-width>\n  <border-top-style> = <line-style>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "See border-width", - "<'border-style'>": "See border-style", - "<'color'>": "See color" + "<'border-width'>": "See border-width", + "<'border-style'>": "See border-style", + "<'color'>": "See color" } }, "-webkit-box-reflect": { - "url": "$MDN_URL$/web/css/-webkit-box-reflect", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-box-reflect", "compatibility": { "Chrome": "4", "ChromeAndroid": "", @@ -6254,7 +6305,7 @@ } }, "-webkit-mask-box-image": { - "url": "$MDN_URL$/web/css/-webkit-mask-box-image", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-box-image", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -6263,12 +6314,12 @@ "Safari": "3.1", "SafariIOS": "2" }, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The non-standard prefixed -webkit-mask-box-image shorthand property sets the mask image for an element's border box.\n

\n

Note:\nThis property is not standard and is not on any standards track. Consider using the mask-border property instead.\n

", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The non-standard prefixed -webkit-mask-box-image shorthand property sets the mask image for an element's border box.\n

\n

Note:\nThis property is not standard and is not on any standards track. Consider using the mask-border property instead.\n

", "formalSyntax": "<mask-image-source> [ <mask-image-offset>{4} <mask-border-repeat>{1,2} ]", "values": { - "<image>": "The location of the image resource to be used as a mask image, <gradient>, or other <image> value.", + "<image>": "The location of the image resource to be used as a mask image, <gradient>, or other <image> value.", "none": "Used to specify that a border box is to have no mask image.", - "<length>": "The size of the mask image's offset. See <length> for possible units.", + "<length>": "The size of the mask image's offset. See <length> for possible units.", "<percentage>": "The mask image's offset has a percentage value relative to the border box's corresponding dimension (width or height).", "<number>": "The size of the mask image's offset in pixels.", "repeat": "The mask image is repeated as many times as is necessary to span the border box. May include a partial image if the mask image does not divide evenly into the border box.", @@ -6278,7 +6329,7 @@ } }, "-webkit-mask-composite": { - "url": "$MDN_URL$/web/css/-webkit-mask-composite", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-composite", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -6287,7 +6338,7 @@ "Safari": "3.1", "SafariIOS": "2" }, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The -webkit-mask-composite property specifies the manner in which multiple mask images applied to the same element are composited with one another. Mask images are composited in the opposite order that they are declared with the -webkit-mask-image property.\n

\n

Note:\nThere is a standardized mask-composite property covering parts of this non-standard property using different keywords.\n

", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The -webkit-mask-composite property specifies the manner in which multiple mask images applied to the same element are composited with one another. Mask images are composited in the opposite order that they are declared with the -webkit-mask-image property.\n

\n

Note:\nThere is a standardized mask-composite property covering parts of this non-standard property using different keywords.\n

", "formalSyntax": "<composite-style>#", "values": { "clear": "Overlapping pixels in the source mask image and the destination mask image are cleared.", @@ -6304,7 +6355,7 @@ } }, "-webkit-mask-position-x": { - "url": "$MDN_URL$/web/css/-webkit-mask-position-x", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-position-x", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -6325,7 +6376,7 @@ } }, "-webkit-mask-position-y": { - "url": "$MDN_URL$/web/css/-webkit-mask-position-y", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-position-y", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -6346,31 +6397,31 @@ } }, "-webkit-mask-repeat-x": { - "url": "$MDN_URL$/web/css/-webkit-mask-repeat-x", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-repeat-x", "compatibility": {}, "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The -webkit-mask-repeat-x property specifies whether and how a mask image is repeated (tiled) horizontally.", "formalSyntax": "[ repeat | no-repeat | space | round ]#", "values": { "repeat": "The mask image is repeated both horizontally and vertically.

The mask image is repeated both horizontally and vertically.", "no-repeat": "The mask image is not repeated; only one copy of the mask image is drawn. The remainder of the masked element's content is not displayed.", - "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images. The mask-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.", + "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images. The mask-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.", "round": "As the allowed space increases in size, the repeated images will stretch (leaving no gaps) until there is room for another one to be added. When the next image is added, all of the current ones compress to allow room. Example: An image with an original width of 260px, repeated three times, might stretch until each repetition is 300px wide, and then another image will be added. They will then compress to 225px." } }, "-webkit-mask-repeat-y": { - "url": "$MDN_URL$/web/css/-webkit-mask-repeat-y", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-mask-repeat-y", "compatibility": {}, "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

The -webkit-mask-repeat-y property sets whether and how a mask image is repeated (tiled) vertically.", "formalSyntax": "[ repeat | no-repeat | space | round ]#", "values": { "repeat": "The mask image is repeated vertically.

The mask image is repeated vertically.", "no-repeat": "The mask image is not repeated vertically; only one copy of the mask image is drawn in vertical direction. The vertical remainder of the masked element's content is not displayed.", - "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to the top and bottom edge of the element, and whitespace is distributed evenly between the images. The mask-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.", + "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to the top and bottom edge of the element, and whitespace is distributed evenly between the images. The mask-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.", "round": "As the allowed vertical space increases in size, the repeated images will stretch (leaving no gaps) until there is room for another one to be added. When the next image is added, all of the current ones compress to allow room. Example: An image with an original height of 260px, repeated three times, might stretch until each repetition is 300px high, and then another image will be added. They will then compress to a height of 225px." } }, "-webkit-tap-highlight-color": { - "url": "$MDN_URL$/web/css/-webkit-tap-highlight-color", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-tap-highlight-color", "compatibility": { "Chrome": "16", "ChromeAndroid": "", @@ -6382,7 +6433,7 @@ "formalSyntax": "<color>" }, "-webkit-text-fill-color": { - "url": "$MDN_URL$/web/css/-webkit-text-fill-color", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-text-fill-color", "status": [ "StandardTrack" ], @@ -6401,14 +6452,14 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The -webkit-text-fill-color CSS property specifies the fill color of characters of text. If this property is not set, the value of the color property is used.", + "doc": "The -webkit-text-fill-color CSS property specifies the fill color of characters of text. If this property is not set, the value of the color property is used.", "formalSyntax": "<color>", "values": { "<color>": "The foreground fill color of the element's text content." } }, "-webkit-text-security": { - "url": "$MDN_URL$/web/css/-webkit-text-security", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-text-security", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -6423,7 +6474,7 @@ "formalSyntax": "circle | disc | square | none" }, "-webkit-text-stroke": { - "url": "$MDN_URL$/web/css/-webkit-text-stroke", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-text-stroke", "status": [ "StandardTrack" ], @@ -6442,7 +6493,7 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The -webkit-text-stroke CSS property specifies the width and color of strokes for text characters. This is a shorthand property for the longhand properties -webkit-text-stroke-width and -webkit-text-stroke-color.", + "doc": "The -webkit-text-stroke CSS property specifies the width and color of strokes for text characters. This is a shorthand property for the longhand properties -webkit-text-stroke-width and -webkit-text-stroke-color.", "formalSyntax": "<line-width> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { "<length>": "The width of the stroke.", @@ -6450,7 +6501,7 @@ } }, "-webkit-text-stroke-color": { - "url": "$MDN_URL$/web/css/-webkit-text-stroke-color", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-text-stroke-color", "status": [ "StandardTrack" ], @@ -6469,14 +6520,14 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The -webkit-text-stroke-color CSS property specifies the stroke color of characters of text. If this property is not set, the value of the color property is used.", + "doc": "The -webkit-text-stroke-color CSS property specifies the stroke color of characters of text. If this property is not set, the value of the color property is used.", "formalSyntax": "<color>", "values": { "<color>": "The color of the stroke." } }, "-webkit-text-stroke-width": { - "url": "$MDN_URL$/web/css/-webkit-text-stroke-width", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-text-stroke-width", "status": [ "StandardTrack" ], @@ -6502,7 +6553,7 @@ } }, "-webkit-touch-callout": { - "url": "$MDN_URL$/web/css/-webkit-touch-callout", + "url": "$MDN_URL$/web/css/reference/properties/-webkit-touch-callout", "compatibility": { "SafariIOS": "2" }, @@ -6514,7 +6565,7 @@ } }, "accent-color": { - "url": "$MDN_URL$/web/css/accent-color", + "url": "$MDN_URL$/web/css/reference/properties/accent-color", "status": [ "StandardTrack" ], @@ -6536,7 +6587,7 @@ } }, "align-content": { - "url": "$MDN_URL$/web/css/align-content", + "url": "$MDN_URL$/web/css/reference/properties/align-content", "status": [ "StandardTrack" ], @@ -6585,7 +6636,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The CSS align-content property sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n

The interactive example below uses grid layout to demonstrate some of the values of this property.", + "doc": "The CSS align-content property sets the distribution of space between and around content items along a flexbox's cross axis, or a grid or block-level element's block axis.\n

This property has no effect on single line flex containers (i.e., ones with flex-wrap: nowrap).\n

The interactive example below uses grid layout to demonstrate some of the values of this property.", "formalSyntax": "normal | <baseline-position> | <content-distribution> | <overflow-position>? <content-position>\n  <baseline-position> = [ first | last ]? &&baseline\n  <content-distribution> = space-between | space-around | space-evenly | stretch\n  <overflow-position> = unsafe | safe\n  <content-position> = center | start | end | flex-start | flex-end", "values": { "normal": "The items are packed in their default position as if no align-content value was set.", @@ -6598,13 +6649,13 @@ "space-between": "The items are evenly distributed within the alignment container along the cross axis. The spacing between each pair of adjacent items is the same. The first item is flush with the start edge of the alignment container in the cross axis, and the last item is flush with the end edge of the alignment container in the cross axis.", "space-around": "The items are evenly distributed within the alignment container along the cross axis. The spacing between each pair of adjacent items is the same. The empty space before the first and after the last item equals half of the space between each pair of adjacent items.", "space-evenly": "The items are evenly distributed within the alignment container along the cross axis. The spacing between each pair of adjacent items, the start edge and the first item, and the end edge and the last item, are all exactly the same.", - "stretch": "If the combined size of the items along the cross axis is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container along the cross axis.", + "stretch": "If the combined size of the items along the cross axis is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container along the cross axis.", "safe": "Used alongside an alignment keyword. If the chosen keyword means that the item overflows the alignment container causing data loss, the item is instead aligned as if the alignment mode were start.", "unsafe": "Used alongside an alignment keyword. Regardless of the relative sizes of the item and alignment container and whether overflow which causes data loss might happen, the given alignment value is honored." } }, "align-items": { - "url": "$MDN_URL$/web/css/align-items", + "url": "$MDN_URL$/web/css/reference/properties/align-items", "status": [ "StandardTrack" ], @@ -6635,8 +6686,8 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The CSS align-items property sets the align-self value on all direct children as a group. In flexbox, it controls the alignment of items on the cross axis. In grid layout, it controls the alignment of items on the block axis within their grid areas.", - "formalSyntax": "normal | stretch | <baseline-position> | [ <overflow-position>? <self-position> ] | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "doc": "The CSS align-items property sets the align-self value on all direct children as a group. In flexbox, it controls the alignment of items on the cross axis. In grid layout, it controls the alignment of items on the block axis within their grid areas.\n

The interactive example below uses grid layout to demonstrate some of the values of this property.", + "formalSyntax": "normal | stretch | <baseline-position> | <overflow-position>? <self-position> | anchor-center\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", "values": { "normal": "The effect of this keyword is dependent of the layout mode we are in:\n

", "center": "The flex items' margin boxes are centered within the line on the cross-axis. If the cross-size of an item is larger than the flex container, it will overflow equally in both directions.", @@ -6645,8 +6696,8 @@ "self-start": "The items are packed flush to the edge of the alignment container's start side of the item, in the appropriate axis.", "self-end": "The items are packed flush to the edge of the alignment container's end side of the item, in the appropriate axis.", "baseline
\nfirst baseline
\nlast baseline": "All flex items are aligned such that their flex container baselines align. The item with the largest distance between its cross-start margin edge and its baseline is flushed with the cross-start edge of the line.", - "stretch": "If the item's cross-size is auto, the used size is set to the length necessary to be as close to filling the container as possible, respecting the item's width and height limits. If the item is not auto-sized, this value falls back to flex-start, and to self-start or self-end if the container's align-content is first baseline (or baseline) or last baseline.", - "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the block direction. See Centering on the anchor using anchor-center.", + "stretch": "If the item's cross-size is auto, the used size is set to the length necessary to be as close to filling the container as possible, respecting the item's width and height limits. If the item is not auto-sized, this value falls back to flex-start, and to self-start or self-end if the container's align-content is first baseline (or baseline) or last baseline.", + "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the block direction. See Centering on the anchor using anchor-center.", "safe": "Used alongside an alignment keyword. If the chosen keyword means that the item overflows the alignment container causing data loss, the item is instead aligned as if the alignment mode were start.", "unsafe": "Used alongside an alignment keyword. Regardless of the relative sizes of the item and alignment container and whether overflow which causes data loss might happen, the given alignment value is honored.", "flex-start": "Used in flex layout only, aligns the flex items flush against the flex container's main-start or cross-start side. When used outside of a flex formatting context, this value behaves as start.", @@ -6654,7 +6705,7 @@ } }, "align-self": { - "url": "$MDN_URL$/web/css/align-self", + "url": "$MDN_URL$/web/css/reference/properties/align-self", "status": [ "StandardTrack" ], @@ -6693,10 +6744,10 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The align-self CSS property overrides a grid or flex item's align-items value. In grid, it aligns the item inside the grid area. In flexbox, it aligns the item on the cross axis.", - "formalSyntax": "auto | normal | stretch | <baseline-position> | <overflow-position>? <self-position> | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "doc": "The align-self CSS property overrides a grid or flex item's align-items value. In grid, it aligns the item inside the grid area. In flexbox, it aligns the item on the cross axis.\n

The property doesn't apply to block-level boxes, or to table cells. If a flexbox item's cross-axis margin is auto, then align-self is ignored.", + "formalSyntax": "auto | <overflow-position>? [ normal | <self-position> ] | stretch | <baseline-position> | anchor-center\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end\n  <baseline-position> = [ first | last ]? &&baseline", "values": { - "auto": "Computes to the parent's align-items value.", + "auto": "Computes to the parent's align-items value.", "normal": "The effect of this keyword is dependent of the layout mode we are in:\n

", "self-start": "Aligns the items to be flush with the edge of the alignment container corresponding to the item's start side in the cross axis.", "self-end": "Aligns the items to be flush with the edge of the alignment container corresponding to the item's end side in the cross axis.", @@ -6704,14 +6755,14 @@ "flex-end": "The cross-end margin edge of the flex item is flushed with the cross-end edge of the line.", "center": "The flex item's margin box is centered within the line on the cross-axis. If the cross-size of the item is larger than the flex container, it will overflow equally in both directions.", "baseline
\nfirst baseline
\nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", - "stretch": "If the item's cross-size is auto, the used size is set to the length necessary to be as close to filling the container as possible, respecting the item's width and height limits. If the item is not auto-sized, this value falls back to flex-start, and to self-start or self-end if the container's align-content is first baseline (or baseline) or last baseline.", - "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the block direction. See Centering on the anchor using anchor-center.", + "stretch": "If the item's cross-size is auto, the used size is set to the length necessary to be as close to filling the container as possible, respecting the item's width and height limits. If the item is not auto-sized, this value falls back to flex-start, and to self-start or self-end if the container's align-content is first baseline (or baseline) or last baseline.", + "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the block direction. See Centering on the anchor using anchor-center.", "safe": "If the size of the item overflows the alignment container, the item is instead aligned as if the alignment mode were start.", "unsafe": "Regardless of the relative sizes of the item and alignment container, the given alignment value is honored." } }, "alignment-baseline": { - "url": "$MDN_URL$/web/css/alignment-baseline", + "url": "$MDN_URL$/web/css/reference/properties/alignment-baseline", "status": [ "StandardTrack" ], @@ -6729,18 +6780,18 @@ "doc": "The alignment-baseline CSS property specifies the specific baseline used to align the box's text and inline-level contents. Baseline alignment is the relationship among the baselines of multiple alignment subjects within an alignment context. When performing baseline alignment, the alignment-baseline property value specifies which baseline of the box is aligned to the corresponding baseline of its alignment context.\n
\n

Note:\nThe alignment-baseline property only has an effect on inline-level boxes, flex items, grid items, table cells, and the <text>, <textPath>, and <tspan> SVG elements. If present, it overrides the shape's alignment-baseline attribute.\n

\n

In an inline formatting context, inline-level box fragments and glyphs share an alignment context established by their parent inline box fragment along its inline axis. In SVG text layout, these values instead specify the baseline that is aligned to the SVG current text position.", "formalSyntax": "baseline | text-bottom | alphabetic | ideographic | middle | central | mathematical | text-top", "values": { - "baseline": "Use the dominant-baseline value of the parent.", + "baseline": "Use the dominant-baseline value of the parent.", "alphabetic": "Used in writing Latin, Cyrillic, Greek, and many other scripts; matches the box's alphabetic baseline to that of its parent, corresponding to the bottom of most, but not all characters.", "central": "Matches the box's central baseline to the central baseline of its parent, corresponding to the ideographic central baseline, halfway between the ideographic-under and ideographic-over baselines.", "ideographic": "Matches the box's ideographic character face under-side baseline to that of its parent, with the derived baseline-table constructed using the ideographic baseline-table in the font.", "mathematical": "Matches the box's mathematical baseline to that of its parent, corresponding to the center baseline around which mathematical characters are designed.", - "middle": "Aligns the vertical midpoint of the box with the baseline of the parent box plus half the x-height of the parent. Uses the x-middle baselines; except under text-orientation: upright; (where the alphabetic and x-height baselines are essentially meaningless), in which case it uses the central baseline instead.", + "middle": "Aligns the vertical midpoint of the box with the baseline of the parent box plus half the x-height of the parent. Uses the x-middle baselines; except under text-orientation: upright; (where the alphabetic and x-height baselines are essentially meaningless), in which case it uses the central baseline instead.", "text-bottom": "Matches the bottom of the box to the top of the parent's content area, using the line-under edge of an inline's content box.", "text-top": "Matches the top of the box to the top of the parent's content area; the line-over edge of an inline's content box." } }, "all": { - "url": "$MDN_URL$/web/css/all", + "url": "$MDN_URL$/web/css/reference/properties/all", "status": [ "StandardTrack" ], @@ -6759,18 +6810,18 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The all shorthand CSS property resets all of an element's properties except unicode-bidi, direction, and CSS Custom Properties. It can set properties to their initial or inherited values, or to the values specified in another cascade layer or stylesheet origin.", - "formalSyntax": "initial | inherit | unset | revert | revert-layer", + "doc": "The all shorthand CSS property resets all of an element's properties except unicode-bidi, direction, and CSS Custom Properties. It can set properties to their initial or inherited values, or to the values specified in another cascade layer or stylesheet origin.", + "formalSyntax": "initial | inherit | unset | revert | revert-layer | revert-rule", "values": { - "initial": "Specifies that all the element's properties should be changed to their initial values.", - "inherit": "Specifies that all the element's properties should be changed to their inherited values.", + "initial": "Specifies that all the element's properties should be changed to their initial values.", + "inherit": "Specifies that all the element's properties should be changed to their inherited values.", "unset": "Specifies that all the element's properties should be changed to their inherited values if they inherit by default, or to their initial values if not.", - "revert": "Specifies behavior that depends on the stylesheet origin to which the declaration belongs:\n

", - "revert-layer": "Specifies that all the element's properties should roll back the cascade to a previous cascade layer, if one exists. If no other cascade layer exists, the element's properties will roll back to the matching rule, if one exists, in the current layer or to a previous style origin." + "revert": "Specifies behavior that depends on the stylesheet origin to which the declaration belongs:\n", + "revert-layer": "Specifies that all the element's properties should roll back the cascade to a previous cascade layer, if one exists. If no other cascade layer exists, the element's properties will roll back to the matching rule, if one exists, in the current layer or to a previous style origin." } }, "anchor-name": { - "url": "$MDN_URL$/web/css/anchor-name", + "url": "$MDN_URL$/web/css/reference/properties/anchor-name", "status": [ "StandardTrack" ], @@ -6778,22 +6829,52 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The anchor-name CSS property enables defining an element as an anchor element by giving it one or more identifying anchor names. Each name can then be set as the value of a positioned element's position-anchor property to associate it with the anchor.", - "formalSyntax": "none | <dashed-ident>#", + "doc": "The anchor-name CSS property enables defining an element as an anchor element by giving it one or more identifying anchor names. Each name can then be set as the value of a positioned element's position-anchor property to associate it with the anchor.", + "formalSyntax": "none | <anchor-name>#\n  <anchor-name> = <dashed-ident>", "values": { "none": "The default value. Setting anchor-name: none on an element means that it is not defined as an anchor element. If the element was previously defined as an anchor and associated with a positioned element, setting anchor-name: none disassociates the two.", - "<dashed-ident>": "One or more comma-separated arbitrary custom identifiers defining the name or names of the anchor, which can then be referenced in a position-anchor property." + "<dashed-ident>": "One or more comma-separated arbitrary custom identifiers defining the name or names of the anchor, which can then be referenced in a position-anchor property." + } + }, + "anchor-scope": { + "url": "$MDN_URL$/web/css/reference/properties/anchor-scope", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "131", + "ChromeAndroid": "131", + "Edge": "131", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "116", + "Safari": "26", + "SafariIOS": "26" + }, + "baseline": { + "level": "LOW", + "lowDate": "2026-01-13" + }, + "doc": "The anchor-scope CSS property can be used to limit the scope in which a positioned element can be associated with anchor elements to a particular subtree.", + "formalSyntax": "none | all | <anchor-name>#\n  <anchor-name> = <dashed-ident>", + "values": { + "none": "No anchor scope limiting happens on an element. This is the default value.", + "all": "Sets the scope so that any anchor-name values set in the subtree can only be bound to by positioned elements in the same subtree.", + "<dashed-ident>#": "One or more comma-separated <dashed-ident>s representing anchor names. Sets the scope so that the specified anchor-name values, when set in the subtree, can only be bound to by positioned elements in the same subtree." } }, "animation": { - "url": "$MDN_URL$/web/css/animation", + "url": "$MDN_URL$/web/css/reference/properties/animation", "status": [ "StandardTrack" ], @@ -6812,18 +6893,18 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation shorthand CSS property applies an animation between styles. It is a shorthand for animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction, animation-fill-mode, animation-play-state, and animation-timeline.", - "formalSyntax": "<single-animation>#\n  <single-animation> = <time [0s,∞]> || <easing-function> || <time> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ]\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <single-animation-iteration-count> = infinite | <number [0,∞]>\n  <single-animation-direction> = normal | reverse | alternate | alternate-reverse\n  <single-animation-fill-mode> = none | forwards | backwards | both\n  <single-animation-play-state> = running | paused\n  <keyframes-name> = <custom-ident> | <string>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", + "doc": "The animation shorthand CSS property applies an animation between styles. It is a shorthand for animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction, animation-fill-mode, animation-play-state, and animation-timeline.", + "formalSyntax": "<single-animation>#\n  <single-animation> = <time [0s,∞]> || <easing-function> || <time> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ]\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <single-animation-iteration-count> = infinite | <number [0,∞]>\n  <single-animation-direction> = normal | reverse | alternate | alternate-reverse\n  <single-animation-fill-mode> = none | forwards | backwards | both\n  <single-animation-play-state> = running | paused\n  <keyframes-name> = <custom-ident> | <string>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", "values": { - "<single-easing-function>": "Determines the type of transition. The value must be one of those available in <easing-function>.", - "<single-animation-iteration-count>": "The number of times the animation is played. The value must be one of those available in animation-iteration-count.", - "<single-animation-direction>": "The direction in which the animation is played. The value must be one of those available in animation-direction.", - "<single-animation-fill-mode>": "Determines how styles should be applied to the animation's target before and after its execution. The value must be one of those available in animation-fill-mode.", - "<single-animation-play-state>": "Determines whether the animation is playing or not. The value must be one of those available in animation-play-state." + "<single-easing-function>": "Determines the type of transition. The value must be one of those available in <easing-function>.", + "<single-animation-iteration-count>": "The number of times the animation is played. The value must be one of those available in animation-iteration-count.", + "<single-animation-direction>": "The direction in which the animation is played. The value must be one of those available in animation-direction.", + "<single-animation-fill-mode>": "Determines how styles should be applied to the animation's target before and after its execution. The value must be one of those available in animation-fill-mode.", + "<single-animation-play-state>": "Determines whether the animation is playing or not. The value must be one of those available in animation-play-state." } }, "animation-composition": { - "url": "$MDN_URL$/web/css/animation-composition", + "url": "$MDN_URL$/web/css/reference/properties/animation-composition", "status": [ "StandardTrack" ], @@ -6838,8 +6919,9 @@ "SafariIOS": "16" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The animation-composition CSS property specifies the composite operation to use when multiple animations affect the same property simultaneously.", "formalSyntax": "<single-animation-composition>#\n  <single-animation-composition> = replace | add | accumulate", @@ -6850,7 +6932,7 @@ } }, "animation-delay": { - "url": "$MDN_URL$/web/css/animation-delay", + "url": "$MDN_URL$/web/css/reference/properties/animation-delay", "status": [ "StandardTrack" ], @@ -6869,14 +6951,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-delay CSS property specifies the amount of time to wait from applying the animation to an element before beginning to perform the animation. The animation can start later, immediately from its beginning, or immediately and partway through the animation.", + "doc": "The animation-delay CSS property specifies the amount of time to wait from applying the animation to an element before beginning to perform the animation. The animation can start later, immediately from its beginning, or immediately and partway through the animation.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "<time>#", "values": { "<time>": "The time offset, from the moment at which the animation is applied to the element, at which the animation should begin. This may be specified in either seconds (s) or milliseconds (ms). The unit is required.\n

A positive value indicates that the animation should begin after the specified amount of time has elapsed. A value of 0s, which is the default, indicates that the animation should begin as soon as it's applied.\n

A negative value causes the animation to begin immediately, but partway through its cycle. For example, if you specify -1s as the animation delay time, the animation will begin immediately but will start 1 second into the animation sequence. If you specify a negative value for the animation delay, but the starting value is implicit, the starting value is taken from the moment the animation is applied to the element." } }, "animation-direction": { - "url": "$MDN_URL$/web/css/animation-direction", + "url": "$MDN_URL$/web/css/reference/properties/animation-direction", "status": [ "StandardTrack" ], @@ -6895,7 +6977,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-direction CSS property sets whether an animation should play forward, backward, or alternate back and forth between playing the sequence forward and backward.", + "doc": "The animation-direction CSS property sets whether an animation should play forward, backward, or alternate back and forth between playing the sequence forward and backward.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "<single-animation-direction>#\n  <single-animation-direction> = normal | reverse | alternate | alternate-reverse", "values": { "normal": "The animation plays forwards each cycle. In other words, each time the animation cycles, the animation will reset to the beginning state and start over again. This is the default value.", @@ -6905,7 +6987,7 @@ } }, "animation-duration": { - "url": "$MDN_URL$/web/css/animation-duration", + "url": "$MDN_URL$/web/css/reference/properties/animation-duration", "status": [ "StandardTrack" ], @@ -6924,15 +7006,15 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-duration CSS property sets the length of time that an animation takes to complete one cycle.", + "doc": "The animation-duration CSS property sets the length of time that an animation takes to complete one cycle.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "<time [0s,∞]>#", "values": { - "auto": "For time-based animations, auto is equivalent to a value of 0s (see below). For CSS scroll-driven animations, auto fills the entire timeline with the animation.", - "<time>": "The time that an animation takes to complete one cycle. This may be specified in either seconds (s) or milliseconds (ms). The value must be positive or zero and the unit is required.\n

If no value is provided, the default value of 0s is used, in which case the animation still executes (the animationStart and animationEnd events are fired). Whether or not the animation will be visible when the duration is 0s will depend on the value of animation-fill-mode, as explained below:\n

" + "auto": "For time-based animations, auto is equivalent to a value of 0s (see below). For CSS scroll-driven animations, auto fills the entire timeline with the animation.", + "<time>": "The time that an animation takes to complete one cycle. This may be specified in either seconds (s) or milliseconds (ms). The value must be positive or zero and the unit is required.\n

If no value is provided, the default value of 0s is used, in which case the animation still executes (the animationStart and animationEnd events are fired). Whether or not the animation will be visible when the duration is 0s will depend on the value of animation-fill-mode, as explained below:\n

" } }, "animation-fill-mode": { - "url": "$MDN_URL$/web/css/animation-fill-mode", + "url": "$MDN_URL$/web/css/reference/properties/animation-fill-mode", "status": [ "StandardTrack" ], @@ -6951,17 +7033,17 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-fill-mode CSS property sets how a CSS animation applies styles to its target before and after its execution.", + "doc": "The animation-fill-mode CSS property sets how a CSS animation applies styles to its target before and after its execution.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "<single-animation-fill-mode>#\n  <single-animation-fill-mode> = none | forwards | backwards | both", "values": { "none": "The animation will not apply any styles to the target when it's not executing. The element will instead be displayed using any other CSS rules applied to it. This is the default value.", - "forwards": "The target will retain the computed values set by the last keyframe encountered during execution. The last keyframe depends on the value of animation-direction and animation-iteration-count:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
animation-directionanimation-iteration-countlast keyframe encountered
normaleven or odd100% or to
reverseeven or odd0% or from
alternateeven0% or from
alternateodd100% or to
alternate-reverseeven100% or to
alternate-reverseodd0% or from
\n

Animated properties behave as if included in a set will-change property value. If a new stacking context was created during the animation, the target element retains the stacking context after the animation has finished.", - "backwards": "The animation will apply the values defined in the first relevant keyframe as soon as it is applied to the target, and retain this during the animation-delay period. The first relevant keyframe depends on the value of animation-direction:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
animation-directionfirst relevant keyframe
normal or alternate0% or from
reverse or alternate-reverse100% or to
", + "forwards": "The target will retain the computed values set by the last keyframe encountered during execution. The last keyframe depends on the value of animation-direction and animation-iteration-count:\n
\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
animation-directionanimation-iteration-countlast keyframe encountered
normaleven or odd100% or to
reverseeven or odd0% or from
alternateeven0% or from
alternateodd100% or to
alternate-reverseeven100% or to
alternate-reverseodd0% or from
\n

Animated properties behave as if included in a set will-change property value. If a new stacking context was created during the animation, the target element retains the stacking context after the animation has finished.", + "backwards": "The animation will apply the values defined in the first relevant keyframe as soon as it is applied to the target, and retain this during the animation-delay period. The first relevant keyframe depends on the value of animation-direction:\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
animation-directionfirst relevant keyframe
normal or alternate0% or from
reverse or alternate-reverse100% or to
", "both": "The animation will follow the rules for both forwards and backwards, thus extending the animation properties in both directions." } }, "animation-iteration-count": { - "url": "$MDN_URL$/web/css/animation-iteration-count", + "url": "$MDN_URL$/web/css/reference/properties/animation-iteration-count", "status": [ "StandardTrack" ], @@ -6980,7 +7062,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-iteration-count CSS property sets the number of times an animation sequence should be played before stopping.", + "doc": "The animation-iteration-count CSS property sets the number of times an animation sequence should be played before stopping.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "<single-animation-iteration-count>#\n  <single-animation-iteration-count> = infinite | <number [0,∞]>", "values": { "infinite": "The animation will repeat forever.", @@ -6988,7 +7070,7 @@ } }, "animation-name": { - "url": "$MDN_URL$/web/css/animation-name", + "url": "$MDN_URL$/web/css/reference/properties/animation-name", "status": [ "StandardTrack" ], @@ -7007,16 +7089,16 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-name CSS property specifies the names of one or more @keyframes at-rules that describe the animation to apply to an element. Multiple @keyframes at-rules are specified as a comma-separated list of names. If the specified name does not match any @keyframes at-rule, no properties are animated.", + "doc": "The animation-name CSS property specifies the names of one or more @keyframes at-rules that describe the animation to apply to an element. Multiple @keyframes at-rules are specified as a comma-separated list of names. If the specified name does not match any @keyframes at-rule, no properties are animated.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", "formalSyntax": "[ none | <keyframes-name> ]#\n  <keyframes-name> = <custom-ident> | <string>", "values": { "none": "A special keyword denoting no keyframes. It can be used to deactivate an animation without changing the ordering of the other identifiers, or to deactivate animations coming from the cascade.", "<custom-ident>": "An unquoted name identifying the animation. This identifier is composed of a combination of case-sensitive letters a to z, numbers 0 to 9, underscores (_), and/or dashes (-). The first non-dash character must be a letter. Also, two dashes are forbidden at the beginning of the identifier. Furthermore, the identifier can't be none, unset, initial, or inherit.", - "<string>": "A series of characters following the same rules as custom identifiers, as described above, except that they are surrounded by either double (\") or single (') quotes. If using a quoted string for both the animation-name and the corresponding @keyframes at-rule name, none, global keywords, and names starting with an underscore or double dashes are valid, though not recommended." + "<string>": "A series of characters following the same rules as custom identifiers, as described above, except that they are surrounded by either double (\") or single (') quotes. If using a quoted string for both the animation-name and the corresponding @keyframes at-rule name, none, global keywords, and names starting with an underscore or double dashes are valid, though not recommended." } }, "animation-play-state": { - "url": "$MDN_URL$/web/css/animation-play-state", + "url": "$MDN_URL$/web/css/reference/properties/animation-play-state", "status": [ "StandardTrack" ], @@ -7035,7 +7117,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-play-state CSS property sets whether an animation is running or paused.", + "doc": "The animation-play-state CSS property sets whether an animation is running or paused.\n

Resuming a paused animation will start the animation from where it left off at the time it was paused, rather than starting over from the beginning of the animation sequence.", "formalSyntax": "<single-animation-play-state>#\n  <single-animation-play-state> = running | paused", "values": { "running": "The animation is currently playing.", @@ -7043,7 +7125,7 @@ } }, "animation-range": { - "url": "$MDN_URL$/web/css/animation-range", + "url": "$MDN_URL$/web/css/reference/properties/animation-range", "status": [ "StandardTrack" ], @@ -7058,17 +7140,15 @@ "baseline": { "level": "NONE" }, - "doc": "The animation-range CSS shorthand property is used to set the start and end of an animation's attachment range along its timeline, i.e., where along the timeline an animation will start and end.", + "doc": "The animation-range CSS shorthand property is used to set the start and end of an animation's attachment range along its timeline, i.e., where along the timeline an animation will start and end.", "formalSyntax": "[ <'animation-range-start'> <'animation-range-end'>? ]#\n  <animation-range-start> = [ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <animation-range-end> = [ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <length-percentage> = <length> | <percentage>", "values": { - "normal": "Represents the start of the timeline in the case of animation-range-start and the end of the timeline in the case of animation-range-end. This is the default value.", - "<length-percentage>": "A length or percentage value measured from the beginning of the timeline.", - "<timeline-range-name>": "A specific named timeline range inside the overall timeline. Possible values are:\n

\n
cover
\n
\n

Represents the full range of a named view progress timeline (see CSS scroll-driven animations for more details), from the point where the subject element first starts to enter the scroll port's view progress visibility range (0% progress) to the point where it has completely left it (100% progress).\n

\n
contain
\n
\n

Represents the range of a named view progress timeline where the subject element is fully contained by, or fully contains, the scroll port's view progress visibility range.\n

    \n
  • If the subject element is smaller than the scrollport, it ranges from the point where the subject element is first completely contained by the scroll port (0% progress), to the point where it is no longer completely contained by the scroll port (100% progress).
  • \n
  • If the subject element is larger than the scrollport, it ranges from the point where the subject element first completely covers the scroll port (0% progress), to the point where it no longer completely covers the scroll port (100% progress).
  • \n
\n
\n
entry
\n
\n

Represents the range of a named view progress timeline from the point where the subject element first starts to enter the scroll port (0% progress), to the point where it has completely entered the scroll port (100%).\n

\n
exit
\n
\n

Represents the range of a named view progress timeline from the point where the subject element first starts to exit the scroll port (0% progress), to the point where it has completely exited the scroll port (100%).\n

\n
entry-crossing
\n
\n

Represents the range of a named view progress timeline from the point where the subject element first starts to cross the scroll port's starting edge (0% progress), to the point where it has completely crossed the scroll port's starting edge (100%).\n

\n
exit-crossing
\n
\n

Represents the range of a named view progress timeline from the point where the subject element first starts to cross the scroll port's end edge (0% progress), to the point where it has completely crossed the scroll port's end edge (100%).\n

\n
\n

In the case of <timeline-range-name> values that do not include a <length-percentage>, the percentage defaults to 0% if it is an animation-range-start value, and 100% if it is an animation-range-end value.\n

\n

Note:\nIt is quite hard to visualize what these values mean from the descriptions above. Fortunately, the View Timeline Ranges Visualizer shows exactly what they mean in an easy visual format.\n

", - "<timeline-range-name> <length-percentage>": "A combination value that equals the specified percentage or distance through the specified named timeline range, measured from the start of that timeline range." + "<animation-range-start>": "The keyword normal, a <length-percentage>, a timeline-range-name, or a <timeline-range-name> <length-percentage> pair, representing the animation-range-start. If a <timeline-range-name> is set without a <length-percentage>, the <length-percentage> defaults to 0%.", + "<animation-range-end>": "The keyword normal, a <length-percentage>, a <timeline-range-name>, or a <timeline-range-name> <length-percentage> pair, representing the animation-range-end. If a <timeline-range-name> is set without a <length-percentage>, the <length-percentage> defaults to 100%." } }, "animation-range-end": { - "url": "$MDN_URL$/web/css/animation-range-end", + "url": "$MDN_URL$/web/css/reference/properties/animation-range-end", "status": [ "StandardTrack" ], @@ -7083,11 +7163,17 @@ "baseline": { "level": "NONE" }, - "doc": "The animation-range-end CSS property is used to set the end of an animation's attachment range along its timeline, i.e., where along the timeline an animation will end.\n

The animation-range-end and animation-range-start properties can also be set using the animation-range shorthand property.\n

\n

Note:\nanimation-range-end is included in the animation shorthand as a reset-only value. This means that including animation resets a previously-declared animation-range-end value to normal, but a specific value cannot be set via animation. When creating CSS scroll-driven animations, you need to declare animation-range-end after declaring any animation shorthand for it to take effect.\n

", - "formalSyntax": "[ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <length-percentage> = <length> | <percentage>" + "doc": "The animation-range-end CSS property sets the point on the timeline where an animation should end.", + "formalSyntax": "[ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <length-percentage> = <length> | <percentage>", + "values": { + "normal": "Represents the end of the timeline. This is the default value.", + "<length-percentage>": "Specifies a length or percentage value measured from the beginning of the timeline.", + "timeline-range-name": "Specifies a named timeline range within the overall timeline. The range starts at 0%.", + "<timeline-range-name> <length-percentage>": "Specifies a length or percentage value measured from the beginning of the specified named timeline range." + } }, "animation-range-start": { - "url": "$MDN_URL$/web/css/animation-range-start", + "url": "$MDN_URL$/web/css/reference/properties/animation-range-start", "status": [ "StandardTrack" ], @@ -7102,11 +7188,17 @@ "baseline": { "level": "NONE" }, - "doc": "The animation-range-start CSS property is used to set the start of an animation's attachment range along its timeline, i.e., where along the timeline an animation will start.\n

The animation-range-start and animation-range-end properties can also be set using the animation-range shorthand property.\n

\n

Note:\nanimation-range-start is included in the animation shorthand as a reset-only value. This means that including animation resets a previously-declared animation-range-start value to normal, but a specific value cannot be set via animation. When creating CSS scroll-driven animations, you need to declare animation-range-start after declaring any animation shorthand for it to take effect.\n

", - "formalSyntax": "[ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <length-percentage> = <length> | <percentage>" + "doc": "The animation-range-start CSS property sets the point on the timeline where an animation should start.", + "formalSyntax": "[ normal | <length-percentage> | <timeline-range-name> <length-percentage>? ]#\n  <length-percentage> = <length> | <percentage>", + "values": { + "normal": "Represents the start of the timeline. This is the default value.", + "<length-percentage>": "Specifies a length or percentage value measured from the beginning of the timeline.", + "timeline-range-name": "Specifies a named timeline range within the overall timeline. The range starts at 0%.", + "<timeline-range-name> <length-percentage>": "Specifies a length or percentage value measured from the beginning of the specified named timeline range." + } }, "animation-timeline": { - "url": "$MDN_URL$/web/css/animation-timeline", + "url": "$MDN_URL$/web/css/reference/properties/animation-timeline", "status": [ "StandardTrack" ], @@ -7121,18 +7213,18 @@ "baseline": { "level": "NONE" }, - "doc": "The animation-timeline CSS property specifies the timeline that is used to control the progress of a CSS animation.\n

The following types of timelines can be set via animation-timeline:\n

\n
\n

Note:\nanimation-timeline is included in the animation shorthand as a reset-only value. This means that including animation resets a previously-declared animation-timeline value to auto, but a specific value cannot be set via animation. When creating CSS scroll-driven animations, you need to declare animation-timeline after declaring any animation shorthand for it to take effect.\n

", + "doc": "The animation-timeline CSS property specifies the timeline used to control the progress of a CSS animation.", "formalSyntax": "<single-animation-timeline>#\n  <single-animation-timeline> = auto | none | <dashed-ident> | <scroll()> | <view()>\n  <scroll()> = scroll( [ <scroller> || <axis> ]? )\n  <view()> = view( [ <axis> || <'view-timeline-inset'> ]? )\n  <scroller> = root | nearest | self\n  <axis> = block | inline | x | y\n  <view-timeline-inset> = [ [ auto | <length-percentage> ]{1,2} ]#\n  <length-percentage> = <length> | <percentage>", "values": { - "none": "The animation is not associated with a timeline.", - "auto": "The animation's timeline is the document's default DocumentTimeline.", - "scroll()": "An anonymous scroll progress timeline is provided by some ancestor scroller of the current element. The function parameters allow you to select the scroller, and the scrolling axis the timeline will be measured along.\n

See scroll() for more information.", - "view()": "An anonymous view progress timeline is provided by the subject that animation-timeline: view(); is set on. The function parameters allow you to select the scrollbar axis along which timeline progress will be tracked and an inset that adjusts the position of the box in which the subject is deemed to be visible.\n

See view() for more information.", - "<dashed-ident>": "A <dashed-ident> identifying a named timeline previously declared with the scroll-timeline-name or view-timeline-name property (or the scroll-timeline or view-timeline shorthand property).\n

\n

Note:\nIf two or more timelines share the same name, the last declared within the cascade will be used. Also, if no timeline is found that matches the given name, the animation is not associated with a timeline.\n

\n
\n

Note:\nThe <dashed-ident> values must start with --. This helps avoid name clashes with standard CSS keywords.\n

" + "none": "The animation is not associated with a timeline, and no animation occurs.", + "auto": "The animation's timeline is the document's default DocumentTimeline. This is the default value.", + "scroll()": "Defines the root element, nearest scroller, or self as an anonymous scroll progress timeline, and optionally the scroll direction of the scroller.", + "view()": "Defines the nearest ancestor scroll container as an anonymous view progress timeline, optionally overriding the default baseline axis direction and the auto start and ending insets.", + "<dashed-ident>": "The name of a scroll-driven or view-progress timeline, as defined by the scroll container's scroll-timeline-name or view-timeline-name property (or the scroll-timeline or view-timeline shorthand property)." } }, "animation-timing-function": { - "url": "$MDN_URL$/web/css/animation-timing-function", + "url": "$MDN_URL$/web/css/reference/properties/animation-timing-function", "status": [ "StandardTrack" ], @@ -7151,14 +7243,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The animation-timing-function CSS property sets how an animation progresses through the duration of each cycle.", - "formalSyntax": "<easing-function>#\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", + "doc": "The animation-timing-function CSS property sets how an animation progresses through the duration of each cycle.\n

It is often convenient to use the shorthand property animation to set all animation properties at once.", + "formalSyntax": "<easing-function>#\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", "values": { - "<easing-function>": "The easing function that corresponds to a given animation, as determined by animation-name.\n

The non-step keyword values (ease, linear, ease-in-out, etc.) each represent cubic Bézier curves with fixed four-point values, while the cubic-bezier() function value allows non-predefined values to be specified. The steps() easing function divides the input time into a specified number of equal-length intervals. Its parameters include a number of steps and a step position.\n

\n
linear
\n
\n

Equal to cubic-bezier(0.0, 0.0, 1.0, 1.0), animates at an even speed.\n

\n
ease
\n
\n

Equal to cubic-bezier(0.25, 0.1, 0.25, 1.0), the default value, increases in velocity towards the middle of the animation, slowing back down at the end.\n

\n
ease-in
\n
\n

Equal to cubic-bezier(0.42, 0, 1.0, 1.0), starts off slowly, with the speed of the transition of the animating property increasing until complete.\n

\n
ease-out
\n
\n

Equal to cubic-bezier(0, 0, 0.58, 1.0), starts quickly, slowing down the animation continues.\n

\n
ease-in-out
\n
\n

Equal to cubic-bezier(0.42, 0, 0.58, 1.0), with the animating properties slowly transitioning, speeding up, and then slowing down again.\n

\n
cubic-bezier(<number [0,1]> , <number> , <number [0,1]> , <number>)
\n
\n

An author defined cubic-bezier curve, where the first and third values must be in the range of 0 to 1.\n

\n
linear(<number> <percentage>{1,2}, …)
\n
\n

The function interpolates linearly between the provided easing stop points. A stop point is a pair of an output progress and an input percentage. The input percentage is optional and is inferred if not specified. If an input percentage is not provided then the first and last stop points are set to 0% and 100% respectively, and the stop points in the middle receive percentage values derived by linearly interpolating between the closest previous and next points that have a percentage value.\n

\n
steps(<integer>, <step-position>)
\n
\n

Displays an animation iteration along n stops along the transition, displaying each stop for equal lengths of time. For example, if n is 5, there are 5 steps. Whether the animation holds temporarily at 0%, 20%, 40%, 60% and 80%, on the 20%, 40%, 60%, 80% and 100%, or makes 5 stops between the 0% and 100% along the animation, or makes 5 stops including the 0% and 100% marks (on the 0%, 25%, 50%, 75%, and 100%) depends on which of the following step position is used:\n

\n
jump-start
\n
\n

Denotes a left-continuous function, so that the first jump happens when the animation begins.\n

\n
jump-end
\n
\n

Denotes a right-continuous function, so that the last jump happens when the animation ends. This is the default.\n

\n
jump-none
\n
\n

There is no jump on either end, effectively removing a step during the interpolation iteration. Instead, it holds at both the 0% mark and the 100% mark, each for 1/n of the duration.\n

\n
jump-both
\n
\n

Includes pauses at both the 0% and 100% marks, effectively adding a step during the animation iteration.\n

\n
start
\n
\n

Same as jump-start.\n

\n
end
\n
\n

Same as jump-end.\n

\n
\n
\n
step-start
\n
\n

Equal to steps(1, jump-start)\n

\n
step-end
\n
\n

Equal to steps(1, jump-end)\n

\n
" + "<easing-function>": "The easing function that corresponds to a given animation, as determined by animation-name.\n

The non-step keyword values (ease, linear, ease-in-out, etc.) each represent cubic Bézier curves with fixed four-point values, while the cubic-bezier() function value allows non-predefined values to be specified. The steps() easing function divides the input time into a specified number of equal-length intervals. Its parameters include a number of steps and a step position.\n

\n
linear
\n
\n

Equal to cubic-bezier(0.0, 0.0, 1.0, 1.0), animates at an even speed.\n

\n
ease
\n
\n

Equal to cubic-bezier(0.25, 0.1, 0.25, 1.0), the default value, increases in velocity towards the middle of the animation, slowing back down at the end.\n

\n
ease-in
\n
\n

Equal to cubic-bezier(0.42, 0, 1.0, 1.0), starts off slowly, with the speed of the transition of the animating property increasing until complete.\n

\n
ease-out
\n
\n

Equal to cubic-bezier(0, 0, 0.58, 1.0), starts quickly, slowing down the animation continues.\n

\n
ease-in-out
\n
\n

Equal to cubic-bezier(0.42, 0, 0.58, 1.0), with the animating properties slowly transitioning, speeding up, and then slowing down again.\n

\n
cubic-bezier(<number [0,1]> , <number> , <number [0,1]> , <number>)
\n
\n

An author defined cubic-bezier curve, where the first and third values must be in the range of 0 to 1.\n

\n
linear(<number> <percentage>{1,2}, …)
\n
\n

The function interpolates linearly between the provided easing stop points. A stop point is a pair of an output progress and an input percentage. The input percentage is optional and is inferred if not specified. If an input percentage is not provided then the first and last stop points are set to 0% and 100% respectively, and the stop points in the middle receive percentage values derived by linearly interpolating between the closest previous and next points that have a percentage value.\n

\n
steps(<integer>, <step-position>)
\n
\n

Displays an animation iteration along n stops along the transition, displaying each stop for equal lengths of time. For example, if n is 5, there are 5 steps. Whether the animation holds temporarily at 0%, 20%, 40%, 60% and 80%, on the 20%, 40%, 60%, 80% and 100%, or makes 5 stops between the 0% and 100% along the animation, or makes 5 stops including the 0% and 100% marks (on the 0%, 25%, 50%, 75%, and 100%) depends on which of the following step position is used:\n

\n
jump-start
\n
\n

Denotes a left-continuous function, so that the first jump happens when the animation begins.\n

\n
jump-end
\n
\n

Denotes a right-continuous function, so that the last jump happens when the animation ends. This is the default.\n

\n
jump-none
\n
\n

There is no jump on either end, effectively removing a step during the interpolation iteration. Instead, it holds at both the 0% mark and the 100% mark, each for 1/n of the duration.\n

\n
jump-both
\n
\n

Includes pauses at both the 0% and 100% marks, effectively adding a step during the animation iteration.\n

\n
start
\n
\n

Same as jump-start.\n

\n
end
\n
\n

Same as jump-end.\n

\n
\n
\n
step-start
\n
\n

Equal to steps(1, jump-start)\n

\n
step-end
\n
\n

Equal to steps(1, jump-end)\n

\n
" } }, "appearance": { - "url": "$MDN_URL$/web/css/appearance", + "url": "$MDN_URL$/web/css/reference/properties/appearance", "status": [ "StandardTrack" ], @@ -7182,15 +7274,15 @@ "values": { "none": "Gives the widget a primitive appearance, making it stylable via CSS, while maintaining the widget's native functionality. This value does not affect non-widgets.", "auto": "Sets interactive widgets to render with their OS-native appearance. Behaves as none on elements with no OS-native styling.", - "base-select": "Only relevant to the <select> element and ::picker(select) pseudo-element, allowing them to be styled.", + "base-select": "Only relevant to the <select> element and ::picker(select) pseudo-element, allowing them to be styled.", "<compat-special>": "Has an effect similar to auto on certain elements.\n
\n
textfield
\n
\n

Causes the appearance of certain <input> types to match the appearance of the text type.\n

\n
menulist-button
\n
\n

When set on the <select> element, the drop-down picker's style matches that of its default state.\n

\n
", "<compat-auto>": "Included for backwards compatibility; possible values include button, checkbox, listbox, menulist, meter, progress-bar, push-button, radio, searchfield, slider-horizontal, square-button, and textarea. The values all behave as auto: use auto instead.", - "slider-vertical": "Makes the slider vertical when applied to <input type=\"range\"> elements. To create a vertical slider you should instead set the writing-mode to vertical-lr and the direction to rtl.", + "slider-vertical": "Makes the slider vertical when applied to <input type=\"range\"> elements. To create a vertical slider you should instead set the writing-mode to vertical-lr and the direction to rtl.", "-apple-pay-button": "Displays the Apple Pay logo when set on a <button>, <a>, or <input> element of type button or reset." } }, "aspect-ratio": { - "url": "$MDN_URL$/web/css/aspect-ratio", + "url": "$MDN_URL$/web/css/reference/properties/aspect-ratio", "status": [ "StandardTrack" ], @@ -7218,7 +7310,7 @@ } }, "attribute_selectors": { - "url": "$MDN_URL$/web/css/attribute_selectors", + "url": "$MDN_URL$/web/css/reference/selectors/attribute_selectors", "status": [ "StandardTrack" ], @@ -7239,13 +7331,13 @@ }, "doc": "The CSS attribute selector matches elements based on the element having a given attribute explicitly set, with options for defining an attribute value or substring value match.", "values": { - "<attr>": "An <ident>, that is, the unquoted name of the attribute. This can be any valid language-specific attribute (SVG, HTML, XML, etc), a data-* attribute, or an author-created attribute.", - "<value>": "An <ident> or <string>, representing the attribute value. The value must be quoted if it contains spaces or special characters.", + "<attr>": "An <ident>, that is, the unquoted name of the attribute. This can be any valid language-specific attribute (SVG, HTML, XML, etc), a data-* attribute, or an author-created attribute.", + "<value>": "An <ident> or <string>, representing the attribute value. The value must be quoted if it contains spaces or special characters.", "s or i": "Case sensitivity or insensitivity flag. If included before the closing bracket (]), makes the value case sensitive or insensitive, irrespective of the markup language." } }, "backdrop-filter": { - "url": "$MDN_URL$/web/css/backdrop-filter", + "url": "$MDN_URL$/web/css/reference/properties/backdrop-filter", "status": [ "StandardTrack" ], @@ -7267,11 +7359,11 @@ "formalSyntax": "none | <filter-value-list>\n  <filter-value-list> = [ <filter-function> | <url> ]+\n  <filter-function> = <blur()> | <brightness()> | <contrast()> | <drop-shadow()> | <grayscale()> | <hue-rotate()> | <invert()> | <opacity()> | <sepia()> | <saturate()>\n  <url> = <url()> | <src()>\n  <blur()> = blur( <length>? )\n  <brightness()> = brightness( [ <number> | <percentage> ]? )\n  <contrast()> = contrast( [ <number> | <percentage> ]? )\n  <drop-shadow()> = drop-shadow( [ <color>? && <length>{2,3} ] )\n  <grayscale()> = grayscale( [ <number> | <percentage> ]? )\n  <hue-rotate()> = hue-rotate( [ <angle> | <zero> ]? )\n  <invert()> = invert( [ <number> | <percentage> ]? )\n  <opacity()> = opacity( [ <number> | <percentage> ]? )\n  <sepia()> = sepia( [ <number> | <percentage> ]? )\n  <saturate()> = saturate( [ <number> | <percentage> ]? )\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "No filter is applied to the backdrop.", - "<filter-value-list>": "A space-separated list of <filter-function>s or an SVG filter that will be applied to the backdrop. CSS <filter-function>s include blur(), brightness(), contrast(), drop-shadow(), grayscale(), hue-rotate(), invert(), opacity(), saturate(), and sepia()." + "<filter-value-list>": "A space-separated list of <filter-function>s or an SVG filter that will be applied to the backdrop. CSS <filter-function>s include blur(), brightness(), contrast(), drop-shadow(), grayscale(), hue-rotate(), invert(), opacity(), saturate(), and sepia()." } }, "backface-visibility": { - "url": "$MDN_URL$/web/css/backface-visibility", + "url": "$MDN_URL$/web/css/reference/properties/backface-visibility", "status": [ "StandardTrack" ], @@ -7290,7 +7382,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The backface-visibility CSS property sets whether the back face of an element is visible when turned towards the user.", + "doc": "The backface-visibility CSS property sets whether the back face of an element is visible when turned towards the user.\n

An element's back face is a mirror image of its front face. Though invisible in 2D, the back face can become visible when a transformation causes the element to be rotated in 3D space. (This property has no effect on 2D transforms, which have no perspective.)", "formalSyntax": "visible | hidden", "values": { "visible": "The back face is visible when turned towards the user.", @@ -7298,7 +7390,7 @@ } }, "background": { - "url": "$MDN_URL$/web/css/background", + "url": "$MDN_URL$/web/css/reference/properties/background", "status": [ "StandardTrack" ], @@ -7317,20 +7409,20 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The background shorthand CSS property sets all background style properties at once, such as color, image, origin and size, or repeat method. Component properties not set in the background shorthand property value declaration are set to their default values.", + "doc": "The background shorthand CSS property sets all background style properties at once, such as color, image, origin, size, and repeat method.", "formalSyntax": "<bg-layer>#? , <final-bg-layer>\n  <bg-layer> = <bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <visual-box>\n  <final-bg-layer> = <bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <visual-box> || <'background-color'>\n  <bg-image> = <image> | none\n  <bg-position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]\n  <bg-size> = [ <length-percentage [0,∞]> | auto ]{1,2} | cover | contain\n  <repeat-style> = repeat-x | repeat-y | [ repeat | space | round | no-repeat ]{1,2}\n  <attachment> = scroll | fixed | local\n  <visual-box> = content-box | padding-box | border-box\n  <background-color> = <color>\n  <image> = <url> | <gradient>\n  <length-percentage> = <length> | <percentage>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<attachment>": "See background-attachment. Default: scroll.", - "<visual-box>": "See background-clip and background-origin. Default: border-box and padding-box respectively.", - "<'background-color'>": "See background-color. Default: transparent.", - "<bg-image>": "See background-image. Default: none.", - "<bg-position>": "See background-position. Default: 0% 0%.", - "<repeat-style>": "See background-repeat. Default: repeat.", - "<bg-size>": "See background-size. Default: auto." + "<attachment>": "See background-attachment. Default: scroll.", + "<visual-box>": "See background-clip and background-origin. Default: border-box and padding-box respectively.", + "<'background-color'>": "See background-color. Default: transparent.", + "<bg-image>": "See background-image. Default: none.", + "<bg-position>": "See background-position. Default: 0% 0%.", + "<repeat-style>": "See background-repeat. Default: repeat.", + "<bg-size>": "See background-size. Default: auto." } }, "background-attachment": { - "url": "$MDN_URL$/web/css/background-attachment", + "url": "$MDN_URL$/web/css/reference/properties/background-attachment", "status": [ "StandardTrack" ], @@ -7358,7 +7450,7 @@ } }, "background-blend-mode": { - "url": "$MDN_URL$/web/css/background-blend-mode", + "url": "$MDN_URL$/web/css/reference/properties/background-blend-mode", "status": [ "StandardTrack" ], @@ -7377,14 +7469,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The background-blend-mode CSS property sets how an element's background images should blend with each other and with the element's background color.", - "formalSyntax": "<mix-blend-mode>#", + "doc": "The background-blend-mode CSS property sets how an element's background images should blend with each other and with the element's background color.\n

Blending modes should be defined in the same order as the background-image property. If the blending modes' and background images' list lengths are not equal, it will be repeated and/or truncated until lengths match.", + "formalSyntax": "<'mix-blend-mode'>#\n  <mix-blend-mode> = <blend-mode> | plus-lighter\n  <blend-mode> = normal | darken | multiply | color-burn | lighten | screen | color-dodge | overlay | soft-light | hard-light | difference | exclusion | hue | saturation | color | luminosity", "values": { "<blend-mode>": "The blending mode to be applied. There can be several values, separated by commas." } }, "background-clip": { - "url": "$MDN_URL$/web/css/background-clip", + "url": "$MDN_URL$/web/css/reference/properties/background-clip", "status": [ "StandardTrack" ], @@ -7410,11 +7502,11 @@ "padding-box": "The background extends to the outside edge of the padding. No background is drawn beneath the border.", "content-box": "The background is painted within (clipped to) the content box.", "text": "The background is painted within (clipped to) the foreground text.", - "border-area": "The background is painted within (clipped to) the area painted by the border, taking border-width and border-style into account but ignoring any transparency introduced by border-color." + "border-area": "The background is painted within (clipped to) the area painted by the border, taking border-width and border-style into account but ignoring any transparency introduced by border-color." } }, "background-color": { - "url": "$MDN_URL$/web/css/background-color", + "url": "$MDN_URL$/web/css/reference/properties/background-color", "status": [ "StandardTrack" ], @@ -7436,11 +7528,11 @@ "doc": "The background-color CSS property sets the background color of an element.", "formalSyntax": "<color>", "values": { - "<color>": "The uniform color of the background. It is rendered behind any background-image that is specified, although the color will still be visible through any transparency in the image." + "<color>": "The uniform color of the background. It is rendered behind any background-image that is specified, although the color will still be visible through any transparency in the image." } }, "background-image": { - "url": "$MDN_URL$/web/css/background-image", + "url": "$MDN_URL$/web/css/reference/properties/background-image", "status": [ "StandardTrack" ], @@ -7463,11 +7555,11 @@ "formalSyntax": "<bg-image>#\n  <bg-image> = <image> | none\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "Is a keyword denoting the absence of images.", - "<image>": "Is an <image> denoting the image to display. There can be several of them, separated by commas, as multiple backgrounds are supported." + "<image>": "Is an <image> denoting the image to display. There can be several of them, separated by commas, as multiple backgrounds are supported." } }, "background-origin": { - "url": "$MDN_URL$/web/css/background-origin", + "url": "$MDN_URL$/web/css/reference/properties/background-origin", "status": [ "StandardTrack" ], @@ -7486,7 +7578,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The background-origin CSS property sets the background's origin: from the border start, inside the border, or inside the padding.", + "doc": "The background-origin CSS property sets the background's origin: from the border start, inside the border, or inside the padding.\n

Note that background-origin is ignored when background-attachment is fixed.", "formalSyntax": "<visual-box>#\n  <visual-box> = content-box | padding-box | border-box", "values": { "border-box": "The background is positioned relative to the border box.", @@ -7495,7 +7587,7 @@ } }, "background-position": { - "url": "$MDN_URL$/web/css/background-position", + "url": "$MDN_URL$/web/css/reference/properties/background-position", "status": [ "StandardTrack" ], @@ -7514,14 +7606,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin.", + "doc": "The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin.", "formalSyntax": "<bg-position>#\n  <bg-position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ center | [ left | right ] <length-percentage>? ] && [ center | [ top | bottom ] <length-percentage>? ]\n  <length-percentage> = <length> | <percentage>", "values": { - "<position>": "A <position>. A position defines an x/y coordinate, to place an item relative to the edges of an element's box. It can be defined using one to four values. If two non-keyword values are used, the first value represents the horizontal position and the second represents the vertical position. If only one value is specified, the second value is assumed to be center. If three or four values are used, the length-percentage values are offsets for the preceding keyword value(s).\n

1-value syntax: The value may be:\n

\n

2-value syntax: One value defines X and the other defines Y. Each value may be:\n

\n

3-value syntax: Two values are keyword values, and the third is the offset for the preceding value:\n

\n

4-value syntax: The first and third values are keyword values defining X and Y. The second and fourth values are offsets for the preceding X and Y keyword values:\n

" + "<position>": "A <position>. A position defines an x/y coordinate, to place an item relative to the edges of an element's box. It can be defined using one to four values. If two non-keyword values are used, the first value represents the horizontal position and the second represents the vertical position. If only one value is specified, the second value is assumed to be center. If three or four values are used, the length-percentage values are offsets for the preceding keyword value(s).\n

1-value syntax: The value may be:\n

\n

2-value syntax: One value defines X and the other defines Y. Each value may be:\n

\n

3-value syntax: Two values are keyword values, and the third is the offset for the preceding value:\n

\n

4-value syntax: The first and third values are keyword values defining X and Y. The second and fourth values are offsets for the preceding X and Y keyword values:\n

" } }, "background-position-x": { - "url": "$MDN_URL$/web/css/background-position-x", + "url": "$MDN_URL$/web/css/reference/properties/background-position-x", "status": [ "StandardTrack" ], @@ -7540,7 +7632,7 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The background-position-x CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by background-origin.", + "doc": "The background-position-x CSS property sets the initial horizontal position for each background image. The position is relative to the position layer set by background-origin.\n

The value of this property is overridden by any declaration of the background or background-position shorthand properties applied to the element after it.", "formalSyntax": "[ center | [ [ left | right | x-start | x-end ]? <length-percentage>? ]! ]#\n  <length-percentage> = <length> | <percentage>", "values": { "left": "Aligns the left edge of the background image with the left edge of the background position layer.", @@ -7551,7 +7643,7 @@ } }, "background-position-y": { - "url": "$MDN_URL$/web/css/background-position-y", + "url": "$MDN_URL$/web/css/reference/properties/background-position-y", "status": [ "StandardTrack" ], @@ -7570,7 +7662,7 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The background-position-y CSS property sets the initial vertical position for each background image. The position is relative to the position layer set by background-origin.", + "doc": "The background-position-y CSS property sets the initial vertical position for each background image. The position is relative to the position layer set by background-origin.\n

The value of this property is overridden by any declaration of the background or background-position shorthand properties applied to the element after it.", "formalSyntax": "[ center | [ [ top | bottom | y-start | y-end ]? <length-percentage>? ]! ]#\n  <length-percentage> = <length> | <percentage>", "values": { "top": "Aligns the top edge of the background image with the top edge of the background position layer.", @@ -7581,7 +7673,7 @@ } }, "background-repeat": { - "url": "$MDN_URL$/web/css/background-repeat", + "url": "$MDN_URL$/web/css/reference/properties/background-repeat", "status": [ "StandardTrack" ], @@ -7604,15 +7696,15 @@ "formalSyntax": "<repeat-style>#\n  <repeat-style> = repeat-x | repeat-y | [ repeat | space | round | no-repeat ]{1,2}", "values": { "repeat": "The default value. The image is repeated as many times as needed to cover the entire background image painting area, with the edge image being clipped if the dimension of the painting area is not a multiple of the dimension of your background image.repeat repeat", - "no-repeat": "The image is not repeated (and hence the background image painting area will not necessarily be entirely covered). The position of the non-repeated background image is defined by the background-position CSS property.no-repeat no-repeat", - "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images. The background-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.space space", + "no-repeat": "The image is not repeated (and hence the background image painting area will not necessarily be entirely covered). The position of the non-repeated background image is defined by the background-position CSS property.no-repeat no-repeat", + "space": "The image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images. The background-position property is ignored unless only one image can be displayed without clipping. The only case where clipping happens using space is when there isn't enough room to display one image.space space", "round": "As the allowed space increases in size, the repeated images will stretch (leaving no gaps) until there is room for another one to be added. This is the only <repeat-style> value that can lead to the distortion of the background image's aspect ratio, which will occur if the aspect ratio of the background image differs from the aspect ratio of the background paint area.round round", "repeat-x": "Shorthand for repeat no-repeat, the background image repeats horizontally only, with the edge image being clipped if the width of the paint area is not a multiple of the background image's width.repeat no-repeat", "repeat-y": "Shorthand for no-repeat repeat, the background image repeats vertically only, with the edge image being clipped if the height of the paint area is not a multiple of the background image's height.no-repeat repeat" } }, "background-size": { - "url": "$MDN_URL$/web/css/background-size", + "url": "$MDN_URL$/web/css/reference/properties/background-size", "status": [ "StandardTrack" ], @@ -7631,18 +7723,42 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The background-size CSS property sets the size of the element's background image.\nThe image can be left to its natural size, stretched, or constrained to fit the available space.", + "doc": "The background-size CSS property sets the size of the element's background image.\nThe image can be left to its natural size, stretched, or constrained to fit the available space.\n

Spaces not covered by a background image are filled with the background-color property, and the background color will be visible behind background images that have transparency/translucency.", "formalSyntax": "<bg-size>#\n  <bg-size> = [ <length-percentage [0,∞]> | auto ]{1,2} | cover | contain\n  <length-percentage> = <length> | <percentage>", "values": { - "contain": "Scales the image as large as possible within its container without cropping or stretching the image.\nIf the container is larger than the image, this will result in image tiling, unless the background-repeat property is set to no-repeat.", + "contain": "Scales the image as large as possible within its container without cropping or stretching the image.\nIf the container is larger than the image, this will result in image tiling, unless the background-repeat property is set to no-repeat.", "cover": "Scales the image (while preserving its ratio) to the smallest possible size to fill the container (that is: both its height and width completely cover the container), leaving no empty space.\nIf the proportions of the background differ from the element, the image is cropped either vertically or horizontally.", "auto": "Scales the background image in the corresponding direction such that its intrinsic proportions are maintained.", "<length>": "Stretches the image in the corresponding dimension to the specified length. Negative values are not allowed.", - "<percentage>": "Stretches the image in the corresponding dimension to the specified percentage of the background positioning area.\nThe background positioning area is determined by the value of background-origin (by default, the padding box).\nHowever, if the background's background-attachment value is fixed, the positioning area is instead the entire viewport.\nNegative values are not allowed." + "<percentage>": "Stretches the image in the corresponding dimension to the specified percentage of the background positioning area.\nThe background positioning area is determined by the value of background-origin (by default, the padding box).\nHowever, if the background's background-attachment value is fixed, the positioning area is instead the entire viewport.\nNegative values are not allowed." + } + }, + "baseline-source": { + "url": "$MDN_URL$/web/css/reference/properties/baseline-source", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "111", + "ChromeAndroid": "111", + "Edge": "111", + "Firefox": "115", + "FirefoxAndroid": "115", + "Opera": "97" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The baseline-source CSS property defines which baseline to use when inline-level boxes have multiple possible baselines, such as multi-line inline blocks or inline flex containers.\nThe values allow for choosing between aligning to the box's first baseline, last baseline, or letting the browser decide automatically based on the box type.", + "formalSyntax": "auto | first | last", + "values": { + "auto": "Specifies last baseline alignment for inline-block, first baseline alignment for everything else.", + "first": "Specifies first baseline alignment.", + "last": "Specifies last baseline alignment." } }, "block-size": { - "url": "$MDN_URL$/web/css/block-size", + "url": "$MDN_URL$/web/css/reference/properties/block-size", "status": [ "StandardTrack" ], @@ -7661,11 +7777,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The block-size CSS property defines the size of an element's block along the block axis. If the writing-mode is horizontal, it corresponds to the height; if the writing mode is vertical, it corresponds to the width. A related property is inline-size, which defines the other dimension of the element.", + "doc": "The block-size CSS property defines the size of an element's block along the block axis. If the writing-mode is horizontal, it corresponds to the height; if the writing mode is vertical, it corresponds to the width. A related property is inline-size, which defines the other dimension of the element.", "formalSyntax": "<'width'>\n  <width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "border": { - "url": "$MDN_URL$/web/css/border", + "url": "$MDN_URL$/web/css/reference/properties/border", "status": [ "StandardTrack" ], @@ -7684,16 +7800,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border shorthand CSS property sets an element's border. It sets the values of border-width, border-style, and border-color.", + "doc": "The border shorthand CSS property sets an element's border. It sets the values of border-width, border-style, and border-color.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<line-width>": "Sets the thickness of the border. Defaults to medium if absent. See border-width.", - "<line-style>": "Sets the style of the border. Defaults to none if absent. See border-style.", - "<color>": "Sets the color of the border. Defaults to currentColor if absent. See border-color." + "<line-width>": "Sets the thickness of the border. Defaults to medium if absent. See border-width.", + "<line-style>": "Sets the style of the border. Defaults to none if absent. See border-style.", + "<color>": "Sets the color of the border. Defaults to currentColor if absent. See border-color." } }, "border-block": { - "url": "$MDN_URL$/web/css/border-block", + "url": "$MDN_URL$/web/css/reference/properties/border-block", "status": [ "StandardTrack" ], @@ -7712,16 +7828,16 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-block CSS property is a shorthand property for setting the individual logical block border property values in a single place in the style sheet.", + "doc": "The border-block CSS property is a shorthand property for setting the individual logical block border property values in a single place in the style sheet.", "formalSyntax": "<'border-block-start'>\n  <border-block-start> = <line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-block-color": { - "url": "$MDN_URL$/web/css/border-block-color", + "url": "$MDN_URL$/web/css/reference/properties/border-block-color", "status": [ "StandardTrack" ], @@ -7740,14 +7856,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-block-color CSS property defines the color of the logical block borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color, or border-right-color and border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-color CSS property defines the color of the logical block borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color, or border-right-color and border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.\n

The border color in the other dimension can be set with border-inline-color which sets border-inline-start-color, and border-inline-end-color.", "formalSyntax": "<'border-top-color'>{1,2}\n  <border-top-color> = <color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-block-end": { - "url": "$MDN_URL$/web/css/border-block-end", + "url": "$MDN_URL$/web/css/reference/properties/border-block-end", "status": [ "StandardTrack" ], @@ -7766,16 +7882,16 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-end CSS property is a shorthand property for setting the individual logical block-end border property values in a single place in the style sheet.", + "doc": "The border-block-end CSS property is a shorthand property for setting the individual logical block-end border property values in a single place in the style sheet.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-block-end-color": { - "url": "$MDN_URL$/web/css/border-block-end-color", + "url": "$MDN_URL$/web/css/reference/properties/border-block-end-color", "status": [ "StandardTrack" ], @@ -7794,14 +7910,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-end-color CSS property defines the color of the logical block-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-end-color CSS property defines the color of the logical block-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-block-end-style": { - "url": "$MDN_URL$/web/css/border-block-end-style", + "url": "$MDN_URL$/web/css/reference/properties/border-block-end-style", "status": [ "StandardTrack" ], @@ -7820,14 +7936,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-end-style CSS property defines the style of the logical block-end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-end-style CSS property defines the style of the logical block-end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-block-end-width": { - "url": "$MDN_URL$/web/css/border-block-end-width", + "url": "$MDN_URL$/web/css/reference/properties/border-block-end-width", "status": [ "StandardTrack" ], @@ -7846,14 +7962,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-end-width CSS property defines the width of the logical block-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-end-width CSS property defines the width of the logical block-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-block-start": { - "url": "$MDN_URL$/web/css/border-block-start", + "url": "$MDN_URL$/web/css/reference/properties/border-block-start", "status": [ "StandardTrack" ], @@ -7872,16 +7988,16 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-start CSS property is a shorthand property for setting the individual logical block-start border property values in a single place in the style sheet.", + "doc": "The border-block-start CSS property is a shorthand property for setting the individual logical block-start border property values in a single place in the style sheet.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-block-start-color": { - "url": "$MDN_URL$/web/css/border-block-start-color", + "url": "$MDN_URL$/web/css/reference/properties/border-block-start-color", "status": [ "StandardTrack" ], @@ -7900,14 +8016,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-start-color CSS property defines the color of the logical block-start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-start-color CSS property defines the color of the logical block-start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-block-start-style": { - "url": "$MDN_URL$/web/css/border-block-start-style", + "url": "$MDN_URL$/web/css/reference/properties/border-block-start-style", "status": [ "StandardTrack" ], @@ -7926,14 +8042,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-start-style CSS property defines the style of the logical block start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-start-style CSS property defines the style of the logical block start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-block-start-width": { - "url": "$MDN_URL$/web/css/border-block-start-width", + "url": "$MDN_URL$/web/css/reference/properties/border-block-start-width", "status": [ "StandardTrack" ], @@ -7952,14 +8068,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-block-start-width CSS property defines the width of the logical block-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-start-width CSS property defines the width of the logical block-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-block-style": { - "url": "$MDN_URL$/web/css/border-block-style", + "url": "$MDN_URL$/web/css/reference/properties/border-block-style", "status": [ "StandardTrack" ], @@ -7978,14 +8094,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-block-style CSS property defines the style of the logical block borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style, or border-left-style and border-right-style properties depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-style CSS property defines the style of the logical block borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style, or border-left-style and border-right-style properties depending on the values defined for writing-mode, direction, and text-orientation.\n

The border style in the other dimension can be set with border-inline-style, which sets border-inline-start-style, and border-inline-end-style.", "formalSyntax": "<'border-top-style'>{1,2}\n  <border-top-style> = <line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-block-width": { - "url": "$MDN_URL$/web/css/border-block-width", + "url": "$MDN_URL$/web/css/reference/properties/border-block-width", "status": [ "StandardTrack" ], @@ -8004,14 +8120,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-block-width CSS property defines the width of the logical block borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width, or border-left-width, and border-right-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-block-width CSS property defines the width of the logical block borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width, or border-left-width, and border-right-width property depending on the values defined for writing-mode, direction, and text-orientation.\n

The border width in the other dimension can be set with border-inline-width, which sets border-inline-start-width, and border-inline-end-width.", "formalSyntax": "<'border-top-width'>{1,2}\n  <border-top-width> = <line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-bottom": { - "url": "$MDN_URL$/web/css/border-bottom", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom", "status": [ "StandardTrack" ], @@ -8030,16 +8146,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-bottom shorthand CSS property sets an element's bottom border. It sets the values of border-bottom-width, border-bottom-style and border-bottom-color.", + "doc": "The border-bottom shorthand CSS property sets an element's bottom border. It sets the values of border-bottom-width, border-bottom-style and border-bottom-color.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<br-width>": "See border-bottom-width.", - "<br-style>": "See border-bottom-style.", - "<color>": "See border-bottom-color." + "<br-width>": "See border-bottom-width.", + "<br-style>": "See border-bottom-style.", + "<color>": "See border-bottom-color." } }, "border-bottom-color": { - "url": "$MDN_URL$/web/css/border-bottom-color", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom-color", "status": [ "StandardTrack" ], @@ -8058,14 +8174,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-bottom-color CSS property sets the color of an element's bottom border. It can also be set with the shorthand CSS properties border-color or border-bottom.", + "doc": "The border-bottom-color CSS property sets the color of an element's bottom border. It can also be set with the shorthand CSS properties border-color or border-bottom.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the bottom border." } }, "border-bottom-left-radius": { - "url": "$MDN_URL$/web/css/border-bottom-left-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom-left-radius", "status": [ "StandardTrack" ], @@ -8085,13 +8201,13 @@ "highDate": "2018-01-29" }, "doc": "The border-bottom-left-radius CSS property rounds the bottom-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-bottom-right-radius": { - "url": "$MDN_URL$/web/css/border-bottom-right-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom-right-radius", "status": [ "StandardTrack" ], @@ -8111,13 +8227,13 @@ "highDate": "2018-01-29" }, "doc": "The border-bottom-right-radius CSS property rounds the bottom-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-bottom-style": { - "url": "$MDN_URL$/web/css/border-bottom-style", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom-style", "status": [ "StandardTrack" ], @@ -8136,11 +8252,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-bottom-style CSS property sets the line style of an element's bottom border.", + "doc": "The border-bottom-style CSS property sets the line style of an element's bottom border.\n

\n

Note:\nThe specification doesn't define how borders of different styles connect in the corners.\n

", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset" }, "border-bottom-width": { - "url": "$MDN_URL$/web/css/border-bottom-width", + "url": "$MDN_URL$/web/css/reference/properties/border-bottom-width", "status": [ "StandardTrack" ], @@ -8162,11 +8278,11 @@ "doc": "The border-bottom-width CSS property sets the width of the bottom border of an element.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" + "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" } }, "border-collapse": { - "url": "$MDN_URL$/web/css/border-collapse", + "url": "$MDN_URL$/web/css/reference/properties/border-collapse", "status": [ "StandardTrack" ], @@ -8185,7 +8301,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-collapse CSS property sets whether cells inside a <table> have shared or separate borders.", + "doc": "The border-collapse CSS property sets whether cells inside a <table> have shared or separate borders.\n

When cells are collapsed, the border-style value of inset behaves like ridge, and outset behaves like groove.\n

When cells are separated, the distance between cells is defined by the border-spacing property.", "formalSyntax": "separate | collapse", "values": { "collapse": "Adjacent cells have shared borders (the collapsed-border table rendering model).", @@ -8193,7 +8309,7 @@ } }, "border-color": { - "url": "$MDN_URL$/web/css/border-color", + "url": "$MDN_URL$/web/css/reference/properties/border-color", "status": [ "StandardTrack" ], @@ -8212,14 +8328,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-color shorthand CSS property sets the color of an element's border.", + "doc": "The border-color shorthand CSS property sets the color of an element's border.", "formalSyntax": "[ <color> | <image-1D> ]{1,4}\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "Defines the color of the border." } }, "border-end-end-radius": { - "url": "$MDN_URL$/web/css/border-end-end-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-end-end-radius", "status": [ "StandardTrack" ], @@ -8238,14 +8354,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The border-end-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "doc": "The border-end-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.\n

This property affects the corner between the block-end and the inline-end sides of the element. For instance, in a horizontal-tb writing mode with ltr direction, it corresponds to the border-bottom-right-radius property.", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-end-start-radius": { - "url": "$MDN_URL$/web/css/border-end-start-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-end-start-radius", "status": [ "StandardTrack" ], @@ -8264,14 +8380,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The border-end-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "doc": "The border-end-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.\n

This property affects the corner between the block-end and the inline-start sides of the element. For instance, in a horizontal-tb writing mode with ltr direction, it corresponds to the border-bottom-left-radius property.", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-image": { - "url": "$MDN_URL$/web/css/border-image", + "url": "$MDN_URL$/web/css/reference/properties/border-image", "status": [ "StandardTrack" ], @@ -8290,18 +8406,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-image CSS property draws an image around a given element. It replaces the element's regular border.", + "doc": "The border-image CSS property draws an image around a given element. It replaces the element's regular border.\n

\n

Note:\nYou should specify a separate border-style in case the border image fails to load. Although the specification doesn't strictly require it, some browsers don't render the border image if border-style is none or border-width is 0.\n

", "formalSyntax": "<'border-image-source'> || <'border-image-slice'> [ / <'border-image-width'> | / <'border-image-width'>? / <'border-image-outset'> ]? || <'border-image-repeat'>\n  <border-image-source> = none | <image>\n  <border-image-slice> = [ <number [0,∞]> | <percentage [0,∞]> ]{1,4} &&fill?\n  <border-image-width> = [ <length-percentage [0,∞]> | <number [0,∞]> | auto ]{1,4}\n  <border-image-outset> = [ <length [0,∞]> | <number [0,∞]> ]{1,4}\n  <border-image-repeat> = [ stretch | repeat | round | space ]{1,2}\n  <image> = <url> | <gradient>\n  <length-percentage> = <length> | <percentage>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<'border-image-source'>": "The source image. See border-image-source.", - "<'border-image-slice'>": "The dimensions for slicing the source image into regions. Up to four values may be specified. See border-image-slice.", - "<'border-image-width'>": "The width of the border image. Up to four values may be specified. See border-image-width.", - "<'border-image-outset'>": "The distance of the border image from the element's outside edge. Up to four values may be specified. See border-image-outset.", - "<'border-image-repeat'>": "Defines how the edge regions of the source image are adjusted to fit the dimensions of the border image. Up to two values may be specified. See border-image-repeat." + "<'border-image-source'>": "The source image. See border-image-source.", + "<'border-image-slice'>": "The dimensions for slicing the source image into regions. Up to four values may be specified. See border-image-slice.", + "<'border-image-width'>": "The width of the border image. Up to four values may be specified. See border-image-width.", + "<'border-image-outset'>": "The distance of the border image from the element's outside edge. Up to four values may be specified. See border-image-outset.", + "<'border-image-repeat'>": "Defines how the edge regions of the source image are adjusted to fit the dimensions of the border image. Up to two values may be specified. See border-image-repeat." } }, "border-image-outset": { - "url": "$MDN_URL$/web/css/border-image-outset", + "url": "$MDN_URL$/web/css/reference/properties/border-image-outset", "status": [ "StandardTrack" ], @@ -8320,15 +8436,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-image-outset CSS property sets the distance by which an element's border image is set out from its border box.\n

The parts of the border image that are rendered outside the element's border box with border-image-outset do not trigger overflow scrollbars and don't capture mouse events.", + "doc": "The border-image-outset CSS property sets the distance by which an element's border image is set out from its border box.\n

The parts of the border image that are rendered outside the element's border box with border-image-outset do not trigger overflow scrollbars and don't capture mouse events.", "formalSyntax": "[ <length [0,∞]> | <number [0,∞]> ]{1,4}", "values": { "<length>": "The size of the border-image outset as a dimension — a number with a unit.", - "<number>": "The size of the border-image outset as a multiple of the element's corresponding border-widths. For example, if an element has border-width: 1em 2px 0 1.5rem, and border-image-outset: 2, the final border-image-outset would be calculated as 2em 4px 0 3rem." + "<number>": "The size of the border-image outset as a multiple of the element's corresponding border-widths. For example, if an element has border-width: 1em 2px 0 1.5rem, and border-image-outset: 2, the final border-image-outset would be calculated as 2em 4px 0 3rem." } }, "border-image-repeat": { - "url": "$MDN_URL$/web/css/border-image-repeat", + "url": "$MDN_URL$/web/css/reference/properties/border-image-repeat", "status": [ "StandardTrack" ], @@ -8347,7 +8463,7 @@ "lowDate": "2016-03-21", "highDate": "2018-09-21" }, - "doc": "The border-image-repeat CSS property defines how the images for the sides and the middle part of the border image are scaled and tiled. The middle region can be displayed by using the keyword \"fill\" in the border-image-slice property.", + "doc": "The border-image-repeat CSS property defines how the images for the sides and the middle part of the border image are scaled and tiled. The middle region can be displayed by using the keyword \"fill\" in the border-image-slice property.", "formalSyntax": "[ stretch | repeat | round | space ]{1,2}", "values": { "stretch": "The source image's edge regions are stretched to fill the gap between each border.", @@ -8357,7 +8473,7 @@ } }, "border-image-slice": { - "url": "$MDN_URL$/web/css/border-image-slice", + "url": "$MDN_URL$/web/css/reference/properties/border-image-slice", "status": [ "StandardTrack" ], @@ -8376,16 +8492,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-image-slice CSS property divides the image specified by border-image-source into regions. These regions form the components of an element's border image.", + "doc": "The border-image-slice CSS property divides the image specified by border-image-source into regions. These regions form the components of an element's border image.", "formalSyntax": "[ <number [0,∞]> | <percentage [0,∞]> ]{1,4} &&fill?", "values": { "<number>": "Represents an edge offset in pixels for raster images and coordinates for vector images. For vector images, the number is relative to the element's size, not the size of the source image, so percentages are generally preferable in these cases.", "<percentage>": "Represents an edge offset as a percentage of the source image's size: the width of the image for horizontal offsets, the height for vertical offsets.", - "fill": "Preserves the middle image region and displays it like a background image, but stacked above the actual background. Its width and height are sized to match the top and left image regions, respectively." + "fill": "Preserves the middle image region and displays it like a background image, but stacked above the actual background. Its width and height are sized to match the top and left image regions, respectively." } }, "border-image-source": { - "url": "$MDN_URL$/web/css/border-image-source", + "url": "$MDN_URL$/web/css/reference/properties/border-image-source", "status": [ "StandardTrack" ], @@ -8404,15 +8520,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-image-source CSS property sets the source image used to create an element's border image.", + "doc": "The border-image-source CSS property sets the source image used to create an element's border image.\n

The border-image-slice property is used to divide the source image into regions, which are then dynamically applied to the final border image.", "formalSyntax": "none | <image>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "none": "No border image is used. The appearance defined by border-style is displayed instead.", + "none": "No border image is used. The appearance defined by border-style is displayed instead.", "<image>": "Image reference to use for the border." } }, "border-image-width": { - "url": "$MDN_URL$/web/css/border-image-width", + "url": "$MDN_URL$/web/css/reference/properties/border-image-width", "status": [ "StandardTrack" ], @@ -8431,16 +8547,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-image-width CSS property sets the width of an element's border image.", + "doc": "The border-image-width CSS property sets the width of an element's border image.\n

If this property's value is greater than the element's border-width, the border image will extend beyond the padding (and/or content) edge.", "formalSyntax": "[ <length-percentage [0,∞]> | <number [0,∞]> | auto ]{1,4}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "The width of the border, specified as a <length> or a <percentage>. Percentages are relative to the width of the border image area for horizontal offsets and the height of the border image area for vertical offsets. Must not be negative.", - "<number>": "The width of the border, specified as a multiple of the corresponding border-width. Must not be negative.", - "auto": "The width of the border is made equal to the intrinsic width or height (whichever is applicable) of the corresponding border-image-slice. If the image does not have the required intrinsic dimension, the corresponding border-width is used instead." + "<length-percentage>": "The width of the border, specified as a <length> or a <percentage>. Percentages are relative to the width of the border image area for horizontal offsets and the height of the border image area for vertical offsets. Must not be negative.", + "<number>": "The width of the border, specified as a multiple of the corresponding border-width. Must not be negative.", + "auto": "The width of the border is made equal to the intrinsic width or height (whichever is applicable) of the corresponding border-image-slice. If the image does not have the required intrinsic dimension, the corresponding border-width is used instead." } }, "border-inline": { - "url": "$MDN_URL$/web/css/border-inline", + "url": "$MDN_URL$/web/css/reference/properties/border-inline", "status": [ "StandardTrack" ], @@ -8459,16 +8575,16 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-inline CSS property is a shorthand property for setting the individual logical inline border property values in a single place in the style sheet.", + "doc": "The border-inline CSS property is a shorthand property for setting the individual logical inline border property values in a single place in the style sheet.", "formalSyntax": "<'border-block-start'>\n  <border-block-start> = <line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-inline-color": { - "url": "$MDN_URL$/web/css/border-inline-color", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-color", "status": [ "StandardTrack" ], @@ -8487,14 +8603,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-inline-color CSS property defines the color of the logical inline borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color, or border-right-color and border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-color CSS property defines the color of the logical inline borders of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color and border-bottom-color, or border-right-color and border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.\n

The border color in the other dimension can be set with border-block-color which sets border-block-start-color, and border-block-end-color.", "formalSyntax": "<'border-top-color'>{1,2}\n  <border-top-color> = <color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-inline-end": { - "url": "$MDN_URL$/web/css/border-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-end", "status": [ "StandardTrack" ], @@ -8513,16 +8629,16 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-end CSS property is a shorthand property for setting the individual logical inline-end border property values in a single place in the style sheet.", + "doc": "The border-inline-end CSS property is a shorthand property for setting the individual logical inline-end border property values in a single place in the style sheet.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-inline-end-color": { - "url": "$MDN_URL$/web/css/border-inline-end-color", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-end-color", "status": [ "StandardTrack" ], @@ -8541,14 +8657,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-end-color CSS property defines the color of the logical inline-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-end-color CSS property defines the color of the logical inline-end border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-inline-end-style": { - "url": "$MDN_URL$/web/css/border-inline-end-style", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-end-style", "status": [ "StandardTrack" ], @@ -8567,14 +8683,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-end-style CSS property defines the style of the logical inline end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-end-style CSS property defines the style of the logical inline end border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-inline-end-width": { - "url": "$MDN_URL$/web/css/border-inline-end-width", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-end-width", "status": [ "StandardTrack" ], @@ -8593,14 +8709,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-end-width CSS property defines the width of the logical inline-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-end-width CSS property defines the width of the logical inline-end border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-inline-start": { - "url": "$MDN_URL$/web/css/border-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-start", "status": [ "StandardTrack" ], @@ -8619,16 +8735,16 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-start CSS property is a shorthand property for setting the individual logical inline-start border property values in a single place in the style sheet.", + "doc": "The border-inline-start CSS property is a shorthand property for setting the individual logical inline-start border property values in a single place in the style sheet.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-width'>": "The width of the border. See border-width.", - "<'border-style'>": "The line style of the border. See border-style.", + "<'border-width'>": "The width of the border. See border-width.", + "<'border-style'>": "The line style of the border. See border-style.", "<color>": "The color of the border." } }, "border-inline-start-color": { - "url": "$MDN_URL$/web/css/border-inline-start-color", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-start-color", "status": [ "StandardTrack" ], @@ -8647,14 +8763,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-start-color CSS property defines the color of the logical inline start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-start-color CSS property defines the color of the logical inline start border of an element, which maps to a physical border color depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-color, border-right-color, border-bottom-color, or border-left-color property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the border." } }, "border-inline-start-style": { - "url": "$MDN_URL$/web/css/border-inline-start-style", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-start-style", "status": [ "StandardTrack" ], @@ -8673,14 +8789,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-start-style CSS property defines the style of the logical inline start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-start-style CSS property defines the style of the logical inline start border of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style, border-right-style, border-bottom-style, or border-left-style property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-inline-start-width": { - "url": "$MDN_URL$/web/css/border-inline-start-width", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-start-width", "status": [ "StandardTrack" ], @@ -8699,14 +8815,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The border-inline-start-width CSS property defines the width of the logical inline-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-start-width CSS property defines the width of the logical inline-start border of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width, border-right-width, border-bottom-width, or border-left-width property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-inline-style": { - "url": "$MDN_URL$/web/css/border-inline-style", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-style", "status": [ "StandardTrack" ], @@ -8725,14 +8841,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-inline-style CSS property defines the style of the logical inline borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style, or border-left-style and border-right-style properties depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-style CSS property defines the style of the logical inline borders of an element, which maps to a physical border style depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-style and border-bottom-style, or border-left-style and border-right-style properties depending on the values defined for writing-mode, direction, and text-orientation.\n

The border style in the other dimension can be set with border-block-style, which sets border-block-start-style, and border-block-end-style.", "formalSyntax": "<'border-top-style'>{1,2}\n  <border-top-style> = <line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<'border-style'>": "The line style of the border. See border-style." + "<'border-style'>": "The line style of the border. See border-style." } }, "border-inline-width": { - "url": "$MDN_URL$/web/css/border-inline-width", + "url": "$MDN_URL$/web/css/reference/properties/border-inline-width", "status": [ "StandardTrack" ], @@ -8751,14 +8867,14 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The border-inline-width CSS property defines the width of the logical inline borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width, or border-left-width, and border-right-width property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The border-inline-width CSS property defines the width of the logical inline borders of an element, which maps to a physical border width depending on the element's writing mode, directionality, and text orientation. It corresponds to the border-top-width and border-bottom-width, or border-left-width, and border-right-width property depending on the values defined for writing-mode, direction, and text-orientation.\n

The border width in the other dimension can be set with border-block-width, which sets border-block-start-width, and border-block-end-width.", "formalSyntax": "<'border-top-width'>{1,2}\n  <border-top-width> = <line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<'border-width'>": "The width of the border. See border-width." + "<'border-width'>": "The width of the border. See border-width." } }, "border-left": { - "url": "$MDN_URL$/web/css/border-left", + "url": "$MDN_URL$/web/css/reference/properties/border-left", "status": [ "StandardTrack" ], @@ -8777,16 +8893,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-left shorthand CSS property sets all the properties of an element's left border.", + "doc": "The border-left shorthand CSS property sets all the properties of an element's left border.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<br-width>": "See border-left-width.", - "<br-style>": "See border-left-style.", - "<color>": "See border-left-color." + "<br-width>": "See border-left-width.", + "<br-style>": "See border-left-style.", + "<color>": "See border-left-color." } }, "border-left-color": { - "url": "$MDN_URL$/web/css/border-left-color", + "url": "$MDN_URL$/web/css/reference/properties/border-left-color", "status": [ "StandardTrack" ], @@ -8805,14 +8921,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-left-color CSS property sets the color of an element's left border. It can also be set with the shorthand CSS properties border-color or border-left.", + "doc": "The border-left-color CSS property sets the color of an element's left border. It can also be set with the shorthand CSS properties border-color or border-left.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the left border." } }, "border-left-style": { - "url": "$MDN_URL$/web/css/border-left-style", + "url": "$MDN_URL$/web/css/reference/properties/border-left-style", "status": [ "StandardTrack" ], @@ -8831,11 +8947,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-left-style CSS property sets the line style of an element's left border.", + "doc": "The border-left-style CSS property sets the line style of an element's left border.\n

\n

Note:\nThe specification doesn't define how borders of different styles connect in the corners.\n

", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset" }, "border-left-width": { - "url": "$MDN_URL$/web/css/border-left-width", + "url": "$MDN_URL$/web/css/reference/properties/border-left-width", "status": [ "StandardTrack" ], @@ -8857,11 +8973,11 @@ "doc": "The border-left-width CSS property sets the width of the left border of an element.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" + "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" } }, "border-radius": { - "url": "$MDN_URL$/web/css/border-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-radius", "status": [ "StandardTrack" ], @@ -8883,19 +8999,19 @@ "doc": "The border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners.", "formalSyntax": "<length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?\n  <length-percentage> = <length> | <percentage>", "values": { - "radius": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in each corner of the border. It is used only in the\none-value syntax.", - "top-left-and-bottom-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-left and bottom-right corners of the element's\nbox. It is used only in the two-value syntax.", - "top-right-and-bottom-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-right and bottom-left corners of the element's\nbox. It is used only in the two- and three-value syntaxes.", - "top-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-left corner of the element's box. It is used\nonly in the three- and four-value syntaxes.", - "top-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-right corner of the element's box. It is used\nonly in the four-value syntax.", - "bottom-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the bottom-right corner of the element's box. It is\nused only in the three- and four-value syntaxes.", - "bottom-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the bottom-left corner of the element's box. It is\nused only in the four-value syntax.", + "radius": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in each corner of the border. It is used only in the\none-value syntax.", + "top-left-and-bottom-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-left and bottom-right corners of the element's\nbox. It is used only in the two-value syntax.", + "top-right-and-bottom-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-right and bottom-left corners of the element's\nbox. It is used only in the two- and three-value syntaxes.", + "top-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-left corner of the element's box. It is used\nonly in the three- and four-value syntaxes.", + "top-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the top-right corner of the element's box. It is used\nonly in the four-value syntax.", + "bottom-right": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the bottom-right corner of the element's box. It is\nused only in the three- and four-value syntaxes.", + "bottom-left": "Is a\n<length>\nor a\n<percentage>\ndenoting a radius to use\nfor the border in the bottom-left corner of the element's box. It is\nused only in the four-value syntax.", "<length>": "Denotes the size of the circle radius, or the semi-major and semi-minor axes of the ellipse, using length values. Negative values are invalid.", "<percentage>": "Denotes the size of the circle radius, or the semi-major and semi-minor axes of the ellipse, using percentage values. Percentages for the horizontal axis refer to the width of the box; percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-right": { - "url": "$MDN_URL$/web/css/border-right", + "url": "$MDN_URL$/web/css/reference/properties/border-right", "status": [ "StandardTrack" ], @@ -8914,16 +9030,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-right shorthand CSS property sets all the properties of an element's right border.", + "doc": "The border-right shorthand CSS property sets all the properties of an element's right border.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<br-width>": "See border-right-width.", - "<br-style>": "See border-right-style.", - "<color>": "See border-right-color." + "<br-width>": "See border-right-width.", + "<br-style>": "See border-right-style.", + "<color>": "See border-right-color." } }, "border-right-color": { - "url": "$MDN_URL$/web/css/border-right-color", + "url": "$MDN_URL$/web/css/reference/properties/border-right-color", "status": [ "StandardTrack" ], @@ -8942,14 +9058,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-right-color CSS property sets the color of an element's right border. It can also be set with the shorthand CSS properties border-color or border-right.", + "doc": "The border-right-color CSS property sets the color of an element's right border. It can also be set with the shorthand CSS properties border-color or border-right.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the right border." } }, "border-right-style": { - "url": "$MDN_URL$/web/css/border-right-style", + "url": "$MDN_URL$/web/css/reference/properties/border-right-style", "status": [ "StandardTrack" ], @@ -8968,11 +9084,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-right-style CSS property sets the line style of an element's right border.", + "doc": "The border-right-style CSS property sets the line style of an element's right border.\n
\n

Note:\nThe specification doesn't define how borders of different styles connect in the corners.\n

", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset" }, "border-right-width": { - "url": "$MDN_URL$/web/css/border-right-width", + "url": "$MDN_URL$/web/css/reference/properties/border-right-width", "status": [ "StandardTrack" ], @@ -8994,11 +9110,11 @@ "doc": "The border-right-width CSS property sets the width of the right border of an element.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" + "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" } }, "border-spacing": { - "url": "$MDN_URL$/web/css/border-spacing", + "url": "$MDN_URL$/web/css/reference/properties/border-spacing", "status": [ "StandardTrack" ], @@ -9017,14 +9133,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-spacing CSS property sets the distance between the borders of adjacent cells in a <table>. This property applies only when border-collapse is separate.", + "doc": "The border-spacing CSS property sets the distance between the borders of adjacent cells in a <table>. This property applies only when border-collapse is separate.", "formalSyntax": "<length>{1,2}", "values": { "<length>": "The size of the spacing as a fixed value." } }, "border-start-end-radius": { - "url": "$MDN_URL$/web/css/border-start-end-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-start-end-radius", "status": [ "StandardTrack" ], @@ -9043,14 +9159,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The border-start-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "doc": "The border-start-end-radius CSS property defines a logical border radius on an element, which maps to a physical border radius depending on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.\n

This property affects the corner between the block-start and the inline-end sides of the element. For instance, in a horizontal-tb writing mode with ltr direction, it corresponds to the border-top-right-radius property.", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-start-start-radius": { - "url": "$MDN_URL$/web/css/border-start-start-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-start-start-radius", "status": [ "StandardTrack" ], @@ -9069,14 +9185,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The border-start-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "doc": "The border-start-start-radius CSS property defines a logical border radius on an element, which maps to a physical border radius that depends on the element's writing-mode, direction, and text-orientation. This is useful when building styles to work regardless of the text orientation and writing mode.\n

This property affects the corner between the block-start and the inline-start sides of the element. For instance, in a horizontal-tb writing mode with ltr direction, it corresponds to the border-top-left-radius property.", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-style": { - "url": "$MDN_URL$/web/css/border-style", + "url": "$MDN_URL$/web/css/reference/properties/border-style", "status": [ "StandardTrack" ], @@ -9095,14 +9211,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-style shorthand CSS property sets the line style for all four sides of an element's border.", + "doc": "The border-style shorthand CSS property sets the line style for all four sides of an element's border.", "formalSyntax": "<'border-top-style'>{1,4}\n  <border-top-style> = <line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<line-style>": "Describes the style of the border. It can have the following values:\n

\n
none
\n
\n

Like the hidden keyword, displays no border. Unless a background-image is set, the computed value of the same side's border-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the none value has the lowest priority: if any other conflicting border is set, it will be displayed.\n

\n
hidden
\n
\n

Like the none keyword, displays no border. Unless a background-image is set, the computed value of the same side's border-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the hidden value has the highest priority: if any other conflicting border is set, it won't be displayed.\n

\n
dotted
\n
\n

Displays a series of rounded dots. The spacing of the dots is not defined by the specification and is implementation-specific. The radius of the dots is half the computed value of the same side's border-width.\n

\n
dashed
\n
\n

Displays a series of short square-ended dashes or line segments. The exact size and length of the segments are not defined by the specification and are implementation-specific.\n

\n
solid
\n
\n

Displays a single, straight, solid line.\n

\n
double
\n
\n

Displays two straight lines that add up to the pixel size defined by border-width.\n

\n
groove
\n
\n

Displays a border with a carved appearance. It is the opposite of ridge.\n

\n
ridge
\n
\n

Displays a border with an extruded appearance. It is the opposite of groove.\n

\n
inset
\n
\n

Displays a border that makes the element appear embedded. It is the opposite of outset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge.\n

\n
outset
\n
\n

Displays a border that makes the element appear embossed. It is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like groove.\n

\n
" + "<line-style>": "Describes the style of the border. It can have the following values:\n
\n
none
\n
\n

Like the hidden keyword, displays no border. Unless a background-image is set, the computed value of the same side's border-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the none value has the lowest priority: if any other conflicting border is set, it will be displayed.\n

\n
hidden
\n
\n

Like the none keyword, displays no border. Unless a background-image is set, the computed value of the same side's border-width will be 0, even if the specified value is something else. In the case of table cell and border collapsing, the hidden value has the highest priority: if any other conflicting border is set, it won't be displayed.\n

\n
dotted
\n
\n

Displays a series of rounded dots. The spacing of the dots is not defined by the specification and is implementation-specific. The radius of the dots is half the computed value of the same side's border-width.\n

\n
dashed
\n
\n

Displays a series of short square-ended dashes or line segments. The exact size and length of the segments are not defined by the specification and are implementation-specific.\n

\n
solid
\n
\n

Displays a single, straight, solid line.\n

\n
double
\n
\n

Displays two straight lines that add up to the pixel size defined by border-width.\n

\n
groove
\n
\n

Displays a border with a carved appearance. It is the opposite of ridge.\n

\n
ridge
\n
\n

Displays a border with an extruded appearance. It is the opposite of groove.\n

\n
inset
\n
\n

Displays a border that makes the element appear embedded. It is the opposite of outset. When applied to a table cell with border-collapse set to collapsed, this value behaves like ridge.\n

\n
outset
\n
\n

Displays a border that makes the element appear embossed. It is the opposite of inset. When applied to a table cell with border-collapse set to collapsed, this value behaves like groove.\n

\n
" } }, "border-top": { - "url": "$MDN_URL$/web/css/border-top", + "url": "$MDN_URL$/web/css/reference/properties/border-top", "status": [ "StandardTrack" ], @@ -9121,16 +9237,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-top shorthand CSS property sets all the properties of an element's top border.", + "doc": "The border-top shorthand CSS property sets all the properties of an element's top border.", "formalSyntax": "<line-width> || <line-style> || <color>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { - "<br-width>": "See border-top-width.", - "<br-style>": "See border-top-style.", - "<color>": "See border-top-color." + "<br-width>": "See border-top-width.", + "<br-style>": "See border-top-style.", + "<color>": "See border-top-color." } }, "border-top-color": { - "url": "$MDN_URL$/web/css/border-top-color", + "url": "$MDN_URL$/web/css/reference/properties/border-top-color", "status": [ "StandardTrack" ], @@ -9149,14 +9265,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-top-color CSS property sets the color of an element's top border. It can also be set with the shorthand CSS properties border-color or border-top.", + "doc": "The border-top-color CSS property sets the color of an element's top border. It can also be set with the shorthand CSS properties border-color or border-top.", "formalSyntax": "<color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the top border." } }, "border-top-left-radius": { - "url": "$MDN_URL$/web/css/border-top-left-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-top-left-radius", "status": [ "StandardTrack" ], @@ -9176,13 +9292,13 @@ "highDate": "2018-01-29" }, "doc": "The border-top-left-radius CSS property rounds the top-left corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-top-right-radius": { - "url": "$MDN_URL$/web/css/border-top-right-radius", + "url": "$MDN_URL$/web/css/reference/properties/border-top-right-radius", "status": [ "StandardTrack" ], @@ -9202,13 +9318,13 @@ "highDate": "2018-01-29" }, "doc": "The border-top-right-radius CSS property rounds the top-right corner of an element by specifying the radius (or the radius of the semi-major and semi-minor axes) of the ellipse defining the curvature of the corner.", - "formalSyntax": "<length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "<border-radius>\n  <border-radius> = <slash-separated-border-radius-syntax> | <legacy-border-radius-syntax>\n  <slash-separated-border-radius-syntax> = <length-percentage [0,∞]> [ / <length-percentage [0,∞]> ]?\n  <legacy-border-radius-syntax> = <length-percentage [0,∞]>{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." + "<length-percentage>": "Denotes the size of the circle radius or the semi-major and semi-minor axes of the ellipse. As absolute length it can be expressed in any unit allowed by the CSS <length> data type. Percentages for the horizontal axis refer to the width of the box, percentages for the vertical axis refer to the height of the box. Negative values are invalid." } }, "border-top-style": { - "url": "$MDN_URL$/web/css/border-top-style", + "url": "$MDN_URL$/web/css/reference/properties/border-top-style", "status": [ "StandardTrack" ], @@ -9227,11 +9343,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-top-style CSS property sets the line style of an element's top border.", + "doc": "The border-top-style CSS property sets the line style of an element's top border.\n
\n

Note:\nThe specification doesn't define how borders of different styles connect in the corners.\n

", "formalSyntax": "<line-style>\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset" }, "border-top-width": { - "url": "$MDN_URL$/web/css/border-top-width", + "url": "$MDN_URL$/web/css/reference/properties/border-top-width", "status": [ "StandardTrack" ], @@ -9253,11 +9369,11 @@ "doc": "The border-top-width CSS property sets the width of the top border of an element.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" + "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" } }, "border-width": { - "url": "$MDN_URL$/web/css/border-width", + "url": "$MDN_URL$/web/css/reference/properties/border-width", "status": [ "StandardTrack" ], @@ -9276,14 +9392,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The border-width shorthand CSS property sets the width of an element's border.", + "doc": "The border-width shorthand CSS property sets the width of an element's border.", "formalSyntax": "<'border-top-width'>{1,4}\n  <border-top-width> = <line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { - "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" + "<line-width>": "Defines the width of the border, either as an explicit nonnegative <length> or a keyword. If it's a keyword, it must be one of the following values:\n" } }, "bottom": { - "url": "$MDN_URL$/web/css/bottom", + "url": "$MDN_URL$/web/css/reference/properties/bottom", "status": [ "StandardTrack" ], @@ -9302,21 +9418,21 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The bottom CSS property participates in setting the vertical position of a positioned element. This inset property has no effect on non-positioned elements.", + "doc": "The bottom CSS property participates in setting the vertical position of a positioned element. This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "A negative, null, or positive <length>:\n", - "<percentage>": "A <percentage> of the containing block's height.", - "auto": "Specifies that:\n" + "<length>": "A negative, null, or positive <length>:\n", + "<percentage>": "A <percentage> of the containing block's height.", + "auto": "Specifies that:\n" } }, "box-align": { - "url": "$MDN_URL$/web/css/box-align", + "url": "$MDN_URL$/web/css/reference/properties/box-align", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard.\n

\n

The box-align CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box.\n

See flexbox for information about the current standard.\n

The direction of layout depends on the element's orientation: horizontal or vertical.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard.\n

\n

The box-align CSS property specifies how an element aligns its contents across its layout in a perpendicular direction. The effect of the property is only visible if there is extra space in the box.\n

See flexbox for information about the current standard.\n

The direction of layout depends on the element's orientation: horizontal or vertical.", "formalSyntax": "start | center | end | baseline | stretch", "values": { "start": "The box aligns contents at the start, leaving any extra space at the end.", @@ -9327,7 +9443,7 @@ } }, "box-decoration-break": { - "url": "$MDN_URL$/web/css/box-decoration-break", + "url": "$MDN_URL$/web/css/reference/properties/box-decoration-break", "status": [ "StandardTrack" ], @@ -9342,20 +9458,20 @@ "baseline": { "level": "NONE" }, - "doc": "The box-decoration-break CSS property specifies how an element's fragments should be rendered when broken across multiple lines, columns, or pages.", + "doc": "The box-decoration-break CSS property specifies how an element's fragments should be rendered when broken across multiple lines, columns, or pages.", "formalSyntax": "slice | clone", "values": { "slice": "The element is initially rendered as if its box were not fragmented, after which the rendering for this hypothetical box is sliced into pieces for each line/column/page. Note that the hypothetical box can be different for each fragment since it uses its own height if the break occurs in the inline direction, and its own width if the break occurs in the block direction. See the CSS specification for details.", - "clone": "Each box fragment is rendered independently with the specified border, padding, and margin wrapping each fragment. The border-radius, border-image, and box-shadow are applied to each fragment independently. The background is also drawn independently for each fragment, which means that a background image with background-repeat: no-repeat may nevertheless repeat multiple times." + "clone": "Each box fragment is rendered independently with the specified border, padding, and margin wrapping each fragment. The border-radius, border-image, and box-shadow are applied to each fragment independently. The background is also drawn independently for each fragment, which means that a background image with background-repeat: no-repeat may nevertheless repeat multiple times." } }, "box-direction": { - "url": "$MDN_URL$/web/css/box-direction", + "url": "$MDN_URL$/web/css/reference/properties/box-direction", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. The -moz-box-direction will only be used for XUL while the previous standard box-direction has been replaced by flex-direction. See flexbox for information about the current standard.\n

\n

The box-direction CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge).", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. The -moz-box-direction will only be used for XUL while the previous standard box-direction has been replaced by flex-direction. See flexbox for information about the current standard.\n

\n

The box-direction CSS property specifies whether a box lays out its contents normally (from the top or left edge), or in reverse (from the bottom or right edge).", "formalSyntax": "normal | reverse", "values": { "normal": "The box lays out its contents from the start (the left or top edge).", @@ -9363,30 +9479,30 @@ } }, "box-flex": { - "url": "$MDN_URL$/web/css/box-flex", + "url": "$MDN_URL$/web/css/reference/properties/box-flex", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property for controlling parts of the XUL box model. It does not match either the old CSS flexible box layout Module drafts for box-flex (which were based on this property) or the behavior of -webkit-box-flex (which is based on those drafts). See flexbox for information about the current standard.\n

\n

The -moz-box-flex and -webkit-box-flex CSS properties specify how a -moz-box or -webkit-box grows to fill the box that contains it, in the direction of the containing box's layout.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property for controlling parts of the XUL box model. It does not match either the old CSS flexible box layout Module drafts for box-flex (which were based on this property) or the behavior of -webkit-box-flex (which is based on those drafts). See flexbox for information about the current standard.\n

\n

The -moz-box-flex and -webkit-box-flex CSS properties specify how a -moz-box or -webkit-box grows to fill the box that contains it, in the direction of the containing box's layout.", "formalSyntax": "<number>" }, "box-flex-group": { - "url": "$MDN_URL$/web/css/box-flex-group", + "url": "$MDN_URL$/web/css/reference/properties/box-flex-group", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-flex-group CSS property assigns the flexbox's child elements to a flex group.\n

For flexible elements assigned to flex groups, the first flex group is 1 and higher values specify subsequent flex groups. The initial value is 1. When dividing up the box's extra space, the browser first considers all elements within the first flex group. Each element within that group is given extra space based on the ratio of that element's flexibility compared to the flexibility of other elements within the same flex group. If the space of all flexible children within the group has been increased to the maximum, the process repeats for the children within the next flex group, using any space left over from the previous flex group. Once there are no more flex groups, and there is still space remaining, the extra space is divided within the containing box according to the box-pack property.\n

If the box would overflow after the preferred space of the children has been computed, then space is removed from flexible elements in a manner similar to that used when adding extra space. Each flex group is examined in turn and space is removed according to the ratio of the flexibility of each element. Elements do not shrink below their minimum widths.", - "formalSyntax": "<integer>" + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-flex-group CSS property assigns the flexbox's child elements to a flex group.\n

For flexible elements assigned to flex groups, the first flex group is 1 and higher values specify subsequent flex groups. The initial value is 1. When dividing up the box's extra space, the browser first considers all elements within the first flex group. Each element within that group is given extra space based on the ratio of that element's flexibility compared to the flexibility of other elements within the same flex group. If the space of all flexible children within the group has been increased to the maximum, the process repeats for the children within the next flex group, using any space left over from the previous flex group. Once there are no more flex groups, and there is still space remaining, the extra space is divided within the containing box according to the box-pack property.\n

If the box would overflow after the preferred space of the children has been computed, then space is removed from flexible elements in a manner similar to that used when adding extra space. Each flex group is examined in turn and space is removed according to the ratio of the flexibility of each element. Elements do not shrink below their minimum widths.", + "formalSyntax": "<integer>\n  <integer> = <number-token>" }, "box-lines": { - "url": "$MDN_URL$/web/css/box-lines", + "url": "$MDN_URL$/web/css/reference/properties/box-lines", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-lines CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes).\n

By default a horizontal box will lay out its children in a single row, and a vertical box will lay out its children in a single column. This behavior can be changed using the box-lines property. The default value is single, which means that all elements will be placed in a single row or column, and any elements that don't fit will be considered overflow.\n

If a value of multiple is specified, however, then the box is allowed to expand to multiple lines (that is, multiple rows or columns) in order to accommodate all of its children. The box must attempt to fit its children on as few lines as possible by shrinking all elements down to their minimum widths or heights if necessary.\n

If the children in a horizontal box still do not fit on a line after being reduced to their minimum widths, then children are moved one by one onto a new line, until the elements remaining on the previous line fit. This process can repeat to an arbitrary number of lines. If a line contains only a single element that doesn't fit, then the element should stay on that line and overflow out of the box. The later lines are placed below the earlier lines in normal direction boxes and above in reverse direction boxes. The height of a line is the height of the largest child in that line. No additional space appears between the lines apart from the margins on the largest elements in each line. For calculating the height of a line, margins with a computed value of auto should be treated as having a value of 0.\n

A similar process occurs for children in a vertical box. Later lines in normal direction boxes are placed to the right of earlier lines and to the left in reverse direction boxes.\n

Once the number of lines has been determined, elements with a computed value for box-flex other than 0 stretch as necessary in an attempt to fill the remaining space on the lines. Each line computes flexes independently, so only elements on that line are considered when evaluating box-flex and box-flex-group. The packing of elements in a line, as specified by the box-pack property, is also computed independently for each line.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-lines CSS property determines whether the box may have a single or multiple lines (rows for horizontally oriented boxes, columns for vertically oriented boxes).\n

By default a horizontal box will lay out its children in a single row, and a vertical box will lay out its children in a single column. This behavior can be changed using the box-lines property. The default value is single, which means that all elements will be placed in a single row or column, and any elements that don't fit will be considered overflow.\n

If a value of multiple is specified, however, then the box is allowed to expand to multiple lines (that is, multiple rows or columns) in order to accommodate all of its children. The box must attempt to fit its children on as few lines as possible by shrinking all elements down to their minimum widths or heights if necessary.\n

If the children in a horizontal box still do not fit on a line after being reduced to their minimum widths, then children are moved one by one onto a new line, until the elements remaining on the previous line fit. This process can repeat to an arbitrary number of lines. If a line contains only a single element that doesn't fit, then the element should stay on that line and overflow out of the box. The later lines are placed below the earlier lines in normal direction boxes and above in reverse direction boxes. The height of a line is the height of the largest child in that line. No additional space appears between the lines apart from the margins on the largest elements in each line. For calculating the height of a line, margins with a computed value of auto should be treated as having a value of 0.\n

A similar process occurs for children in a vertical box. Later lines in normal direction boxes are placed to the right of earlier lines and to the left in reverse direction boxes.\n

Once the number of lines has been determined, elements with a computed value for box-flex other than 0 stretch as necessary in an attempt to fill the remaining space on the lines. Each line computes flexes independently, so only elements on that line are considered when evaluating box-flex and box-flex-group. The packing of elements in a line, as specified by the box-pack property, is also computed independently for each line.", "formalSyntax": "single | multiple", "values": { "single": "Box elements lay out in a single row or column.", @@ -9394,21 +9510,21 @@ } }, "box-ordinal-group": { - "url": "$MDN_URL$/web/css/box-ordinal-group", + "url": "$MDN_URL$/web/css/reference/properties/box-ordinal-group", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-ordinal-group CSS property assigns the flexbox's child elements to an ordinal group.\n

Ordinal groups may be used in conjunction with the box-direction property to control the order in which the direct children of a box appear. When the computed box-direction is normal, a box will display its elements starting from the lowest numbered ordinal group and ensure that those elements appear to the left (for horizontal boxes) or at the top (for vertical boxes) of the container. Elements with the same ordinal group are flowed in the order they appear in the source document tree. In the reverse direction, the ordinal groups are examined in the same order, except the elements appear reversed.", - "formalSyntax": "<integer>" + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft. It has been replaced in the specification. See flexbox for information about the current standard.\n

\n

The box-ordinal-group CSS property assigns the flexbox's child elements to an ordinal group.\n

Ordinal groups may be used in conjunction with the box-direction property to control the order in which the direct children of a box appear. When the computed box-direction is normal, a box will display its elements starting from the lowest numbered ordinal group and ensure that those elements appear to the left (for horizontal boxes) or at the top (for vertical boxes) of the container. Elements with the same ordinal group are flowed in the order they appear in the source document tree. In the reverse direction, the ordinal groups are examined in the same order, except the elements appear reversed.", + "formalSyntax": "<integer>\n  <integer> = <number-token>" }, "box-orient": { - "url": "$MDN_URL$/web/css/box-orient", + "url": "$MDN_URL$/web/css/reference/properties/box-orient", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. See flexbox for information about the current standard.\n

\n

The box-orient CSS property sets whether an element lays out its contents horizontally or vertically.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. See flexbox for information about the current standard.\n

\n

The box-orient CSS property sets whether an element lays out its contents horizontally or vertically.", "formalSyntax": "horizontal | vertical | inline-axis | block-axis", "values": { "horizontal": "The box lays out its contents horizontally.", @@ -9418,12 +9534,12 @@ } }, "box-pack": { - "url": "$MDN_URL$/web/css/box-pack", + "url": "$MDN_URL$/web/css/reference/properties/box-pack", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. See flexbox for information about the current standard.\n

\n

The -moz-box-pack and -webkit-box-pack CSS properties specify how a -moz-box or -webkit-box packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box.\n

The direction of layout depends on the element's orientation: horizontal or vertical.", + "doc": "

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

\n

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.

\n
\n

Warning:\nThis is a property of the original CSS flexible box layout Module draft, and has been replaced by a newer standard. See flexbox for information about the current standard.\n

\n

The -moz-box-pack and -webkit-box-pack CSS properties specify how a -moz-box or -webkit-box packs its contents in the direction of its layout. The effect of this is only visible if there is extra space in the box.\n

The direction of layout depends on the element's orientation: horizontal or vertical.", "formalSyntax": "start | center | end | justify", "values": { "start": "The box packs contents at the start, leaving any extra space at the end.", @@ -9433,7 +9549,7 @@ } }, "box-shadow": { - "url": "$MDN_URL$/web/css/box-shadow", + "url": "$MDN_URL$/web/css/reference/properties/box-shadow", "status": [ "StandardTrack" ], @@ -9453,15 +9569,15 @@ "highDate": "2018-01-29" }, "doc": "The box-shadow CSS property adds shadow effects around an element's frame. You can set multiple effects separated by commas. A box shadow is described by X and Y offsets relative to the element, blur and spread radius, and color.", - "formalSyntax": "<spread-shadow>#\n  <spread-shadow> = <'box-shadow-color'>? &&[ <'box-shadow-offset'> [ <'box-shadow-blur'> <'box-shadow-spread'>? ]? ] &&<'box-shadow-position'>?\n  <box-shadow-color> = <color>#\n  <box-shadow-offset> = [ none | <length>{2} ]#\n  <box-shadow-blur> = <length [0,∞]>#\n  <box-shadow-spread> = <length>#\n  <box-shadow-position> = [ outset | inset ]#", + "formalSyntax": "<spread-shadow>#\n  <spread-shadow> = <'box-shadow-color'>? &&[ [ none | <length>{2} ] [ <'box-shadow-blur'> <'box-shadow-spread'>? ]? ] &&<'box-shadow-position'>?\n  <box-shadow-color> = <color>#\n  <box-shadow-blur> = <length [0,∞]>#\n  <box-shadow-spread> = <length>#\n  <box-shadow-position> = [ outset | inset ]#", "values": { - "<color>": "Specifies color for the shadow. See <color> values for possible keywords and notations.\nIf not specified, the value of the color property defined in the parent element is used.", + "<color>": "Specifies color for the shadow. See <color> values for possible keywords and notations.\nIf not specified, the value of the color property defined in the parent element is used.", "<length>": "Specifies the offset length of the shadow. This parameter accepts two, three, or four values. Third and fourth values are optional. They are interpreted as follows:\n

", "inset": "Changes the shadow from an outer box-shadow to an inner box-shadow (as if the content is pressed into the box). Inset shadows are drawn inside the box's border (even if the border is transparent), and they appear above the background but below the content. By default, the shadow behaves like a drop shadow, giving the appearance that the box is elevated above its content. This is the default behavior when inset is not specified." } }, "box-sizing": { - "url": "$MDN_URL$/web/css/box-sizing", + "url": "$MDN_URL$/web/css/reference/properties/box-sizing", "status": [ "StandardTrack" ], @@ -9483,12 +9599,12 @@ "doc": "The box-sizing CSS property sets how the total width and height of an element is calculated.", "formalSyntax": "content-box | border-box", "values": { - "content-box": "This is the initial and default value as specified by the CSS standard. The width and height properties include the content, but does not include the padding, border, or margin. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 370px wide.\n

Here, the dimensions of the element are calculated as: width = width of the content, and height = height of the content. (Borders and padding are not included in the calculation.)", - "border-box": "The width and height properties include the content, padding, and border, but do not include the margin. Note that padding and border will be inside of the box. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 350px wide, with the area for content being 330px wide. The content box can't be negative and is floored to 0, making it impossible to use border-box to make the element disappear.\n

Here the dimensions of the element are calculated as: width = border + padding + width of the content, and height = border + padding + height of the content." + "content-box": "This is the initial and default value as specified by the CSS standard. The width and height properties include the content, but does not include the padding, border, or margin. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 370px wide.\n

Here, the dimensions of the element are calculated as: width = width of the content, and height = height of the content. (Borders and padding are not included in the calculation.)", + "border-box": "The width and height properties include the content, padding, and border, but do not include the margin. Note that padding and border will be inside of the box. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 350px wide, with the area for content being 330px wide. The content box can't be negative and is floored to 0, making it impossible to use border-box to make the element disappear.\n

Here the dimensions of the element are calculated as: width = border + padding + width of the content, and height = border + padding + height of the content." } }, "break-after": { - "url": "$MDN_URL$/web/css/break-after", + "url": "$MDN_URL$/web/css/reference/properties/break-after", "status": [ "StandardTrack" ], @@ -9535,7 +9651,7 @@ } }, "break-before": { - "url": "$MDN_URL$/web/css/break-before", + "url": "$MDN_URL$/web/css/reference/properties/break-before", "status": [ "StandardTrack" ], @@ -9582,7 +9698,7 @@ } }, "break-inside": { - "url": "$MDN_URL$/web/css/break-inside", + "url": "$MDN_URL$/web/css/reference/properties/break-inside", "status": [ "StandardTrack" ], @@ -9612,7 +9728,7 @@ } }, "caption-side": { - "url": "$MDN_URL$/web/css/caption-side", + "url": "$MDN_URL$/web/css/reference/properties/caption-side", "status": [ "StandardTrack" ], @@ -9631,7 +9747,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The caption-side CSS property puts the content of a table's <caption> on the specified side. The values are relative to the writing-mode of the table.", + "doc": "The caption-side CSS property puts the content of a table's <caption> on the specified side. The values are relative to the writing-mode of the table.", "formalSyntax": "top | bottom", "values": { "top": "The caption box should be positioned at the block start side of the table.", @@ -9639,8 +9755,8 @@ } }, "caret": { - "url": "$MDN_URL$/web/css/caret", - "doc": "

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

\n

The caret shorthand CSS property sets the appearance and behavior of the insertion caret in a single declaration.", + "url": "$MDN_URL$/web/css/reference/properties/caret", + "doc": "

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

\n

The caret shorthand CSS property sets the appearance and behavior of the insertion caret in a single declaration.", "formalSyntax": "<'caret-color'> || <'caret-animation'> || <'caret-shape'>\n  <caret-color> = auto | <color>\n  <caret-animation> = auto | manual\n  <caret-shape> = auto | bar | block | underscore", "values": { "caret-color": "Sets the color of the caret.", @@ -9649,7 +9765,7 @@ } }, "caret-animation": { - "url": "$MDN_URL$/web/css/caret-animation", + "url": "$MDN_URL$/web/css/reference/properties/caret-animation", "status": [ "Experimental", "StandardTrack" @@ -9668,7 +9784,7 @@ } }, "caret-color": { - "url": "$MDN_URL$/web/css/caret-color", + "url": "$MDN_URL$/web/css/reference/properties/caret-color", "status": [ "StandardTrack" ], @@ -9690,17 +9806,21 @@ "doc": "The caret-color CSS property sets the color of the insertion caret, sometimes referred to as the text input cursor. This is the visible marker appearing at the insertion point where the next character typed will be added or where the next character deleted will be removed.", "formalSyntax": "auto | <color>", "values": { - "auto": "Generally resolves to currentColor, the color of the text that will be modified.", + "auto": "Generally resolves to currentColor, the color of the text that will be modified.", "<color>": "The color of the caret." } }, "caret-shape": { - "url": "$MDN_URL$/web/css/caret-shape", + "url": "$MDN_URL$/web/css/reference/properties/caret-shape", "status": [ "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "baseline": { "level": "NONE" }, @@ -9714,7 +9834,7 @@ } }, "child_combinator": { - "url": "$MDN_URL$/web/css/child_combinator", + "url": "$MDN_URL$/web/css/reference/selectors/child_combinator", "status": [ "StandardTrack" ], @@ -9733,10 +9853,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The child combinator (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.\n

\n```css\n/* List items that are children of the \"my-things\" list */\nul.my-things > li {\n  margin: 2em;\n}\n```\n
\n

Elements matched by the second selector must be the immediate children of the elements matched by the first selector. This is stricter than the descendant combinator, which matches all elements matched by the second selector for which there exists an ancestor element matched by the first selector, regardless of the number of \"hops\" up the DOM." + "doc": "The child combinator (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.\n

\n```css\n/* List items that are children of the \"my-things\" list */\nul.my-things > li {\n  margin: 2em;\n}\n```\n
\n

Elements matched by the second selector must be the immediate children of the elements matched by the first selector. This is stricter than the descendant combinator, which matches all elements matched by the second selector for which there exists an ancestor element matched by the first selector, regardless of the number of \"hops\" up the DOM." }, "class_selectors": { - "url": "$MDN_URL$/web/css/class_selectors", + "url": "$MDN_URL$/web/css/reference/selectors/class_selectors", "status": [ "StandardTrack" ], @@ -9758,7 +9878,7 @@ "doc": "The CSS class selector matches elements based on the contents of their class attribute.\n

\n```css\n/* All elements with class=\"spacious\" */\n.spacious {\n  margin: 2em;\n}\n/* All 
  •  elements with class=\"spacious\" */\nli.spacious {\n  margin: 2em;\n}\n/* All 
  •  elements with a class list that includes both \"spacious\" and \"elegant\" */\n/* For example, class=\"elegant retro spacious\" */\nli.spacious.elegant {\n  margin: 2em;\n}\n```\n
  • " }, "clear": { - "url": "$MDN_URL$/web/css/clear", + "url": "$MDN_URL$/web/css/reference/properties/clear", "status": [ "StandardTrack" ], @@ -9777,7 +9897,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The clear CSS property sets whether an element must be moved below (cleared) floating elements that precede it. The clear property applies to floating and non-floating elements.", + "doc": "The clear CSS property sets whether an element must be moved below (cleared) floating elements that precede it. The clear property applies to floating and non-floating elements.", "formalSyntax": "inline-start | inline-end | block-start | block-end | left | right | top | bottom | both-inline | both-block | both | none", "values": { "none": "Is a keyword indicating that the element is not moved down to clear past floating elements.", @@ -9789,7 +9909,7 @@ } }, "clip": { - "url": "$MDN_URL$/web/css/clip", + "url": "$MDN_URL$/web/css/reference/properties/clip", "status": [ "StandardTrack", "Deprecated" @@ -9804,15 +9924,15 @@ "Safari": "", "SafariIOS": "" }, - "doc": "

    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.

    \n
    \n

    Warning:\nAuthors are encouraged to use the clip-path property instead.\n

    \n

    The clip CSS property defines a visible portion of an element. The clip property applies only to absolutely positioned elements — that is, elements with position:absolute or position:fixed.", + "doc": "

    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.

    \n
    \n

    Warning:\nAuthors are encouraged to use the clip-path property instead.\n

    \n

    The clip CSS property defines a visible portion of an element. The clip property applies only to absolutely positioned elements — that is, elements with position:absolute or position:fixed.", "formalSyntax": "<rect()> | auto\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )", "values": { - "rect()": "A rectangle defined using a rect() function of the form rect(<top>, <right>, <bottom>, <left>). The <top> and <bottom> values are offsets from the inside top border edge of the box, while <right> and <left> are offsets from the inside left border edge of the box — that is, the extent of the padding box.\n

    The <top>, <right>, <bottom>, and <left> values may be either a <length> or auto. If any side's value is auto, the element is clipped to that side's inside border edge.", + "rect()": "A rectangle defined using a rect() function of the form rect(<top>, <right>, <bottom>, <left>). The <top> and <bottom> values are offsets from the inside top border edge of the box, while <right> and <left> are offsets from the inside left border edge of the box — that is, the extent of the padding box.\n

    The <top>, <right>, <bottom>, and <left> values may be either a <length> or auto. If any side's value is auto, the element is clipped to that side's inside border edge.", "auto": "The element does not clip (default). This is different from rect(auto, auto, auto, auto), which clips to the element's inside border edges." } }, "clip-path": { - "url": "$MDN_URL$/web/css/clip-path", + "url": "$MDN_URL$/web/css/reference/properties/clip-path", "status": [ "StandardTrack" ], @@ -9832,16 +9952,16 @@ "highDate": "2022-07-15" }, "doc": "The clip-path CSS property creates a clipping region that sets what part of an element should be shown. Parts that are inside the region are shown, while those outside are hidden.", - "formalSyntax": "<clip-source> | [ <basic-shape> || <geometry-box> ] | none\n  <clip-source> = <url>\n  <geometry-box> = <shape-box> | fill-box | stroke-box | view-box\n  <url> = <url()> | <src()>\n  <shape-box> = <visual-box> | margin-box | half-border-box\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <visual-box> = content-box | padding-box | border-box", + "formalSyntax": "<clip-source> | [ <basic-shape> || <geometry-box> ] | none\n  <clip-source> = <url>\n  <basic-shape> = <basic-shape-rect> | <circle()> | <ellipse()> | <polygon()> | <path()> | <shape()>\n  <geometry-box> = <shape-box> | fill-box | stroke-box | view-box\n  <url> = <url()> | <src()>\n  <basic-shape-rect> = <inset()> | <rect()> | <xywh()>\n  <circle()> = circle( <radial-size>? [ at <position> ]? )\n  <ellipse()> = ellipse( <radial-size>? [ at <position> ]? )\n  <polygon()> = polygon( <'fill-rule'>? [ round <length> ]? , [ <length-percentage> <length-percentage> ]# )\n  <path()> = path( <'fill-rule'>? , <string> )\n  <shape()> = shape( <'fill-rule'>? from <position> , <shape-command># )\n  <shape-box> = <visual-box> | margin-box | half-border-box\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )\n  <xywh()> = xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <fill-rule> = nonzero | evenodd\n  <length-percentage> = <length> | <percentage>\n  <shape-command> = <move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>\n  <visual-box> = content-box | padding-box | border-box\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <move-command> = move <command-end-point>\n  <line-command> = line <command-end-point>\n  <horizontal-line-command> = hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]\n  <vertical-line-command> = vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]\n  <curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]\n  <smooth-command> = smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]\n  <arc-command> = arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [ rotate <angle> ]? ]\n  <command-end-point> = to <position> | by <coordinate-pair>\n  <control-point> = <position> | <relative-control-point>\n  <coordinate-pair> = <length-percentage>{2}\n  <relative-control-point> = <coordinate-pair> [ from [ start | end | origin ] ]?\n  <arc-sweep> = cw | ccw\n  <arc-size> = large | small", "values": { - "<clip-source>": "A <url> referencing an SVG <clipPath> element.", - "<basic-shape>": "A shape whose size and position is defined by the <geometry-box> value. If no geometry box is specified, the border-box will be used as the reference box. One of:\n

    \n
    inset()
    \n
    \n

    Defines an inset rectangle.\n

    \n
    circle()
    \n
    \n

    Defines a circle using a radius and a position.\n

    \n
    ellipse()
    \n
    \n

    Defines an ellipse using two radii and a position.\n

    \n
    polygon()
    \n
    \n

    Defines a polygon using an SVG filling rule and a set of vertices.\n

    \n
    path()
    \n
    \n

    Defines a shape using an optional SVG filling rule and an SVG path definition.\n

    \n
    rect()
    \n
    \n

    Defines a rectangle using the specified distances from the edges of the reference box.\n

    \n
    shape()
    \n
    \n

    Defines a shape using an optional SVG filling rule and shape commands for lines, curves, and arcs.\n

    \n
    xywh()
    \n
    \n

    Defines a rectangle using the specified distances from the top and left edges of the reference box and the specified width and height of the rectangle.\n

    \n
    ", - "<geometry-box>": "If specified in combination with a <basic-shape>, this value defines the reference box for the basic shape. If specified by itself, it causes the edges of the specified box, including any corner shaping (such as a border-radius), to be the clipping path. The geometry box can be one of the following values:\n
    \n
    margin-box
    \n
    \n

    Uses the margin box as the reference box.\n

    \n
    border-box
    \n
    \n

    Uses the border box as the reference box.\n

    \n
    padding-box
    \n
    \n

    Uses the padding box as the reference box.\n

    \n
    content-box
    \n
    \n

    Uses the content box as the reference box.\n

    \n
    fill-box
    \n
    \n

    Uses the object bounding box as the reference box.\n

    \n
    stroke-box
    \n
    \n

    Uses the stroke bounding box as the reference box.\n

    \n
    view-box
    \n
    \n

    Uses the nearest SVG viewport as the reference box. If a viewBox attribute is specified for the element creating the SVG viewport, the reference box is positioned at the origin of the coordinate system established by the viewBox attribute and the dimension of the size of the reference box is set to the width and height values of the viewBox attribute.\n

    \n
    ", + "<clip-source>": "A <url> referencing an SVG <clipPath> element.", + "<basic-shape>": "A shape whose size and position is defined by the <geometry-box> value. If no geometry box is specified, the border-box will be used as the reference box. One of:\n
    \n
    inset()
    \n
    \n

    Defines an inset rectangle.\n

    \n
    circle()
    \n
    \n

    Defines a circle using a radius and a position.\n

    \n
    ellipse()
    \n
    \n

    Defines an ellipse using two radii and a position.\n

    \n
    polygon()
    \n
    \n

    Defines a polygon using an SVG filling rule and a set of vertices.\n

    \n
    path()
    \n
    \n

    Defines a shape using an optional SVG filling rule and an SVG path definition.\n

    \n
    rect()
    \n
    \n

    Defines a rectangle using the specified distances from the edges of the reference box.\n

    \n
    shape()
    \n
    \n

    Defines a shape using an optional SVG filling rule and shape commands for lines, curves, and arcs.\n

    \n
    xywh()
    \n
    \n

    Defines a rectangle using the specified distances from the top and left edges of the reference box and the specified width and height of the rectangle.\n

    \n
    ", + "<geometry-box>": "If specified in combination with a <basic-shape>, this value defines the reference box for the basic shape. If specified by itself, it causes the edges of the specified box, including any corner shaping (such as a border-radius), to be the clipping path. The geometry box can be one of the following values:\n
    \n
    margin-box
    \n
    \n

    Uses the margin box as the reference box.\n

    \n
    border-box
    \n
    \n

    Uses the border box as the reference box.\n

    \n
    padding-box
    \n
    \n

    Uses the padding box as the reference box.\n

    \n
    content-box
    \n
    \n

    Uses the content box as the reference box.\n

    \n
    fill-box
    \n
    \n

    Uses the object bounding box as the reference box.\n

    \n
    stroke-box
    \n
    \n

    Uses the stroke bounding box as the reference box.\n

    \n
    view-box
    \n
    \n

    Uses the nearest SVG viewport as the reference box. If a viewBox attribute is specified for the element creating the SVG viewport, the reference box is positioned at the origin of the coordinate system established by the viewBox attribute and the dimension of the size of the reference box is set to the width and height values of the viewBox attribute.\n

    \n
    ", "none": "No clipping path is created." } }, "clip-rule": { - "url": "$MDN_URL$/web/css/clip-rule", + "url": "$MDN_URL$/web/css/reference/properties/clip-rule", "status": [ "StandardTrack" ], @@ -9860,7 +9980,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The clip-rule CSS property determines, when parts of the path overlap other parts, which pixels in a mask's box are inside the clipping shape defined by a clip path and which are outside.\n

    The clip-rule property only applies to SVG elements that are contained within a <clipPath> element, overriding the element's clip-rule attribute value if present. The clip-rule property basically works as the fill-rule property, except that it applies to <clipPath> definitions. It does not have any effect on CSS <basic-shape>s.", + "doc": "The clip-rule CSS property determines, when parts of the path overlap other parts, which pixels in a mask's box are inside the clipping shape defined by a clip path and which are outside.\n

    The clip-rule property only applies to SVG elements that are contained within a <clipPath> element, overriding the element's clip-rule attribute value if present. The clip-rule property basically works as the fill-rule property, except that it applies to <clipPath> definitions. It does not have any effect on CSS <basic-shape>s.", "formalSyntax": "nonzero | evenodd", "values": { "nonzero": "For every point in the clipping mask's box, a ray is drawn in a random direction. Every time the ray intersects with any part of the clipping path, a tally is increased by one if the clipping path's part is moving from left to right across the ray, whereas it is decreased by one if the path part is moving right to left across the ray. If the final total of the tally is zero, the point is outside the path's shape. Otherwise, it's inside the path's shape.", @@ -9868,7 +9988,7 @@ } }, "color": { - "url": "$MDN_URL$/web/css/color", + "url": "$MDN_URL$/web/css/reference/properties/color", "status": [ "StandardTrack" ], @@ -9887,7 +10007,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The color CSS property sets the foreground color value of an element's text and text decorations, and sets the currentColor value. currentColor may be used as an indirect value on other properties and is the default for other color properties, such as border-color.", + "doc": "The color CSS property sets the foreground color value of an element's text and text decorations, and sets the currentColor value. currentColor may be used as an indirect value on other properties and is the default for other color properties, such as border-color.\n

    For an overview of using color in HTML, see Applying color to HTML elements using CSS.", "formalSyntax": "<color>", "values": { "<color>": "Sets the color of the textual and decorative parts of the element.", @@ -9895,7 +10015,7 @@ } }, "color-interpolation": { - "url": "$MDN_URL$/web/css/color-interpolation", + "url": "$MDN_URL$/web/css/reference/properties/color-interpolation", "status": [ "StandardTrack" ], @@ -9923,7 +10043,7 @@ } }, "color-interpolation-filters": { - "url": "$MDN_URL$/web/css/color-interpolation-filters", + "url": "$MDN_URL$/web/css/reference/properties/color-interpolation-filters", "status": [ "StandardTrack" ], @@ -9951,7 +10071,7 @@ } }, "color-scheme": { - "url": "$MDN_URL$/web/css/color-scheme", + "url": "$MDN_URL$/web/css/reference/properties/color-scheme", "status": [ "StandardTrack" ], @@ -9970,7 +10090,7 @@ "lowDate": "2022-01-11", "highDate": "2024-07-11" }, - "doc": "The color-scheme CSS property allows an element to indicate which color schemes it can comfortably be rendered in. User agents change the following aspects of the UI chrome to match the used color scheme:\n

    \n

    Component authors must use the prefers-color-scheme media feature to support the color schemes on the rest of the elements.\n

    Common choices for operating system color schemes are \"light\" and \"dark\", or \"day mode\" and \"night mode\". When a user selects one of these color schemes, the operating system makes adjustments to the user interface. This includes form controls, scrollbars, and the used values of CSS system colors.", + "doc": "The color-scheme CSS property allows an element to indicate which color schemes it can comfortably be rendered in. User agents change the following aspects of the UI chrome to match the used color scheme:\n

    \n

    Component authors must use the prefers-color-scheme media feature to support the color schemes on the rest of the elements.\n

    Common choices for operating system color schemes are \"light\" and \"dark\", or \"day mode\" and \"night mode\". When a user selects one of these color schemes, the operating system makes adjustments to the user interface. This includes form controls, scrollbars, and the used values of CSS system colors.", "formalSyntax": "normal | [ light | dark | <custom-ident> ]+ && only?", "values": { "normal": "Indicates that the element can be rendered using the page's color scheme settings. If the page does not have a color scheme set, the element is rendered using the page's default color settings.", @@ -9980,7 +10100,7 @@ } }, "column-count": { - "url": "$MDN_URL$/web/css/column-count", + "url": "$MDN_URL$/web/css/reference/properties/column-count", "status": [ "StandardTrack" ], @@ -10000,14 +10120,14 @@ "highDate": "2019-09-07" }, "doc": "The column-count CSS property breaks an element's content into the specified number of columns.", - "formalSyntax": "auto | <integer [1,∞]>", + "formalSyntax": "auto | <integer [1,∞]>\n  <integer> = <number-token>", "values": { - "auto": "The number of columns is determined by other CSS properties, such as column-width.", - "<integer>": "Is a strictly positive <integer> describing the ideal number of columns into which the content of the element will be flowed. If the column-width is also set to a non-auto value, it merely indicates the maximum allowed number of columns." + "auto": "The number of columns is determined by other CSS properties, such as column-width.", + "<integer>": "Is a strictly positive <integer> describing the ideal number of columns into which the content of the element will be flowed. If the column-width is also set to a non-auto value, it merely indicates the maximum allowed number of columns." } }, "column-fill": { - "url": "$MDN_URL$/web/css/column-fill", + "url": "$MDN_URL$/web/css/reference/properties/column-fill", "status": [ "StandardTrack" ], @@ -10030,11 +10150,11 @@ "formalSyntax": "auto | balance | balance-all", "values": { "auto": "Columns are filled sequentially. Content takes up only the room it needs, possibly resulting in some columns remaining empty.", - "balance": "Content is equally divided between columns. In fragmented contexts, such as paged media, only the last fragment is balanced. Therefore in paged media, only the last page would be balanced." + "balance": "Content is equally divided between columns. In fragmented contexts, such as paged media, only the last fragment is balanced. Therefore in paged media, only the last page would be balanced." } }, "column-gap": { - "url": "$MDN_URL$/web/css/column-gap", + "url": "$MDN_URL$/web/css/reference/properties/column-gap", "status": [ "StandardTrack" ], @@ -10075,16 +10195,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The column-gap CSS property sets the size of the gap (gutter) between an element's columns.\n

    Initially a part of Multi-column Layout, the definition of column-gap has been broadened to include multiple layout methods. Now specified in CSS box alignment, it may be used in multi-column, flexible box, and grid layouts.\n

    Early versions of the specification called this property grid-column-gap, and to maintain compatibility with legacy websites, browsers will still accept grid-column-gap as an alias for column-gap.", + "doc": "The column-gap CSS property sets the size of the gap (gutter) between an element's columns.\n

    Initially a part of Multi-column Layout, the definition of column-gap has been broadened to include multiple layout methods. Now specified in CSS box alignment, it may be used in multi-column, flexible box, and grid layouts.\n

    Early versions of the specification called this property grid-column-gap, and to maintain compatibility with legacy websites, browsers will still accept grid-column-gap as an alias for column-gap.", "formalSyntax": "normal | <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "normal": "The browser's default spacing is used between columns. For multi-column layout this is specified as 1em. For all other layout types it is 0.", - "<length>": "The size of the gap between columns, defined as a <length>. The <length> property's value must be non-negative.", - "<percentage>": "The size of the gap between columns, defined as a <percentage>. The <percentage> property's value must be non-negative." + "<length>": "The size of the gap between columns, defined as a <length>. The <length> property's value must be non-negative.", + "<percentage>": "The size of the gap between columns, defined as a <percentage>. The <percentage> property's value must be non-negative." } }, "column-rule": { - "url": "$MDN_URL$/web/css/column-rule", + "url": "$MDN_URL$/web/css/reference/properties/column-rule", "status": [ "StandardTrack" ], @@ -10103,16 +10223,16 @@ "lowDate": "2017-03-07", "highDate": "2019-09-07" }, - "doc": "The column-rule shorthand CSS property sets the width, style, and color of the line drawn between columns in a multi-column layout.", - "formalSyntax": "<gap-rule-list> | <gap-auto-rule-list>\n  <gap-rule-list> = <gap-rule-or-repeat>#\n  <gap-auto-rule-list> = <gap-rule-or-repeat>#? , <gap-auto-repeat-rule> , <gap-rule-or-repeat>#?\n  <gap-rule-or-repeat> = <gap-rule> | <gap-repeat-rule>\n  <gap-auto-repeat-rule> = repeat( auto , <gap-rule># )\n  <gap-rule> = <line-width> || <line-style> || <color>\n  <gap-repeat-rule> = repeat( <integer [1,∞]> , <gap-rule># )\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset", + "doc": "The column-rule shorthand CSS property sets the width, style, and color of the line drawn between columns in a multi-column layout.", + "formalSyntax": "<gap-rule-list> | <gap-auto-rule-list>\n  <gap-rule-list> = <gap-rule-or-repeat>#\n  <gap-auto-rule-list> = <gap-rule-or-repeat>#? , <gap-auto-repeat-rule> , <gap-rule-or-repeat>#?\n  <gap-rule-or-repeat> = <gap-rule> | <gap-repeat-rule>\n  <gap-auto-repeat-rule> = repeat( auto , <gap-rule># )\n  <gap-rule> = <line-width> || <line-style> || <color>\n  <gap-repeat-rule> = repeat( <integer [1,∞]> , <gap-rule># )\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset\n  <integer> = <number-token>", "values": { - "<'column-rule-width'>": "Is a <length> or one of the three keywords, thin, medium, or thick. See border-width for details.", - "<'column-rule-style'>": "See border-style for possible values and details.", - "<'column-rule-color'>": "Is a <color> value." + "<'column-rule-width'>": "Is a <length> or one of the three keywords, thin, medium, or thick. See border-width for details.", + "<'column-rule-style'>": "See border-style for possible values and details.", + "<'column-rule-color'>": "Is a <color> value." } }, "column-rule-color": { - "url": "$MDN_URL$/web/css/column-rule-color", + "url": "$MDN_URL$/web/css/reference/properties/column-rule-color", "status": [ "StandardTrack" ], @@ -10132,13 +10252,13 @@ "highDate": "2019-09-07" }, "doc": "The column-rule-color CSS property sets the color of the line drawn between columns in a multi-column layout.", - "formalSyntax": "<line-color-list> | <auto-line-color-list>\n  <line-color-list> = [ <line-color-or-repeat> ]+\n  <auto-line-color-list> = [ <line-color-or-repeat> ]* <auto-repeat-line-color> [ <line-color-or-repeat> ]*\n  <line-color-or-repeat> = <color> | <repeat-line-color>\n  <auto-repeat-line-color> = repeat( auto , [ <color> ]+ )\n  <repeat-line-color> = repeat( [ <integer [1,∞]> ] , [ <color> ]+ )", + "formalSyntax": "<line-color-list> | <auto-line-color-list>\n  <line-color-list> = <line-color-or-repeat>#\n  <auto-line-color-list> = <line-color-or-repeat>#? , <auto-repeat-line-color> , <line-color-or-repeat>#?\n  <line-color-or-repeat> = <color> | <repeat-line-color>\n  <auto-repeat-line-color> = repeat( auto , [ <color> ]# )\n  <repeat-line-color> = repeat( [ <integer [1,∞]> ] , [ <color> ]# )\n  <integer> = <number-token>", "values": { "<color>": "The color of the rule that separates columns." } }, "column-rule-style": { - "url": "$MDN_URL$/web/css/column-rule-style", + "url": "$MDN_URL$/web/css/reference/properties/column-rule-style", "status": [ "StandardTrack" ], @@ -10158,13 +10278,13 @@ "highDate": "2019-09-07" }, "doc": "The column-rule-style CSS property sets the style of the line drawn between columns in a multi-column layout.", - "formalSyntax": "<line-style-list> | <auto-line-style-list>\n  <line-style-list> = [ <line-style-or-repeat> ]+\n  <auto-line-style-list> = [ <line-style-or-repeat> ]* <auto-repeat-line-style> [ <line-style-or-repeat> ]*\n  <line-style-or-repeat> = <line-style> | <repeat-line-style>\n  <auto-repeat-line-style> = repeat( auto , [ <line-style> ]+ )\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset\n  <repeat-line-style> = repeat( [ <integer [1,∞]> ] , [ <line-style> ]+ )", + "formalSyntax": "<line-style-list> | <auto-line-style-list>\n  <line-style-list> = <line-style-or-repeat>#\n  <auto-line-style-list> = <line-style-or-repeat>#? , <auto-repeat-line-style> , <line-style-or-repeat>#?\n  <line-style-or-repeat> = <line-style> | <repeat-line-style>\n  <auto-repeat-line-style> = repeat( auto , [ <line-style> ]# )\n  <line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset\n  <repeat-line-style> = repeat( [ <integer [1,∞]> ] , [ <line-style> ]# )\n  <integer> = <number-token>", "values": { - "<'border-style'>": "Is a keyword defined by border-style describing the style of the rule. The styling must be interpreted as in the collapsing border model." + "<'border-style'>": "Is a keyword defined by border-style describing the style of the rule. The styling must be interpreted as in the collapsing border model." } }, "column-rule-width": { - "url": "$MDN_URL$/web/css/column-rule-width", + "url": "$MDN_URL$/web/css/reference/properties/column-rule-width", "status": [ "StandardTrack" ], @@ -10184,13 +10304,13 @@ "highDate": "2019-09-07" }, "doc": "The column-rule-width CSS property sets the width of the line drawn between columns in a multi-column layout.", - "formalSyntax": "<line-width-list> | <auto-line-width-list>\n  <line-width-list> = [ <line-width-or-repeat> ]+\n  <auto-line-width-list> = [ <line-width-or-repeat> ]* <auto-repeat-line-width> [ <line-width-or-repeat> ]*\n  <line-width-or-repeat> = <line-width> | <repeat-line-width>\n  <auto-repeat-line-width> = repeat( auto , [ <line-width> ]+ )\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <repeat-line-width> = repeat( [ <integer [1,∞]> ] , [ <line-width> ]+ )", + "formalSyntax": "<line-width-list> | <auto-line-width-list>\n  <line-width-list> = <line-width-or-repeat>#\n  <auto-line-width-list> = <line-width-or-repeat>#? , <auto-repeat-line-width> , <line-width-or-repeat>#?\n  <line-width-or-repeat> = <line-width> | <repeat-line-width>\n  <auto-repeat-line-width> = repeat( auto , [ <line-width> ]# )\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <repeat-line-width> = repeat( [ <integer [1,∞]> ] , [ <line-width> ]# )\n  <integer> = <number-token>", "values": { - "<'border-width'>": "Is a keyword defined by border-width describing the width of the rule. It may be either a <length> or one of the thin, medium, or thick keywords." + "<'border-width'>": "Is a keyword defined by border-width describing the width of the rule. It may be either a <length> or one of the thin, medium, or thick keywords." } }, "column-span": { - "url": "$MDN_URL$/web/css/column-span", + "url": "$MDN_URL$/web/css/reference/properties/column-span", "status": [ "StandardTrack" ], @@ -10209,15 +10329,15 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The column-span CSS property makes it possible for an element to span across all columns when its value is set to all.", - "formalSyntax": "none | <integer [1,∞]> | all | auto", + "doc": "The column-span CSS property makes it possible for an element to span across all columns when its value is set to all.\n

    An element that spans more than one column is called a spanning element.", + "formalSyntax": "none | <integer [1,∞]> | all | auto\n  <integer> = <number-token>", "values": { "none": "The element does not span multiple columns.", "all": "The element spans across all columns. Content in the normal flow that appears before the element is automatically balanced across all columns before the element appears. The element establishes a new block formatting context." } }, "column-width": { - "url": "$MDN_URL$/web/css/column-width", + "url": "$MDN_URL$/web/css/reference/properties/column-width", "status": [ "StandardTrack" ], @@ -10236,15 +10356,15 @@ "lowDate": "2016-11-15", "highDate": "2019-05-15" }, - "doc": "The column-width CSS property sets the ideal column width in a multi-column layout. The container will have as many columns as can fit without any of them having a width less than the column-width value. If the width of the container is narrower than the specified value, the single column's width will be smaller than the declared column width.", + "doc": "The column-width CSS property sets the ideal column width in a multi-column layout. The container will have as many columns as can fit without any of them having a width less than the column-width value. If the width of the container is narrower than the specified value, the single column's width will be smaller than the declared column width.\n

    This property can help you create responsive designs that fit different screen sizes. Especially in the presence of the column-count property (which has precedence), you must specify all related length values to achieve an exact column width. In horizontal text these are width, column-width, column-gap, and column-rule-width.", "formalSyntax": "auto | <length [0,∞]> | min-content | max-content | fit-content( <length-percentage> )\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "Indicates the optimal column width. The actual column width may differ from the specified value: it may be wider when necessary to fill available space, and narrower when the available space is too small. The value must be strictly positive or the declaration is invalid. Percentage values are also invalid.", - "auto": "The width of the column is determined by other CSS properties, such as column-count." + "auto": "The width of the column is determined by other CSS properties, such as column-count." } }, "columns": { - "url": "$MDN_URL$/web/css/columns", + "url": "$MDN_URL$/web/css/reference/properties/columns", "status": [ "StandardTrack" ], @@ -10264,14 +10384,18 @@ "highDate": "2019-09-07" }, "doc": "The columns CSS shorthand property sets the number of columns to use when drawing an element's contents, as well as those columns' widths.", - "formalSyntax": "[ <'column-width'> || <'column-count'> ] [ / <'column-height'> ]?\n  <column-width> = auto | <length [0,∞]> | min-content | max-content | fit-content( <length-percentage> )\n  <column-count> = auto | <integer [1,∞]>\n  <column-height> = auto | <length [0,∞]>\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "[ <'column-width'> || <'column-count'> ] [ / <'column-height'> ]?\n  <column-width> = auto | <length [0,∞]> | min-content | max-content | fit-content( <length-percentage> )\n  <column-count> = auto | <integer [1,∞]>\n  <column-height> = auto | <length [0,∞]>\n  <length-percentage> = <length> | <percentage>\n  <integer> = <number-token>", "values": { - "<'column-width'>": "The ideal column width, defined as a <length> or the keyword auto. The actual width may be wider or narrower to fit the available space. See column-width.", - "<'column-count'>": "The ideal number of columns into which the element's content should be flowed, defined as an <integer> or the keyword auto. If neither this value nor the column's width are auto, it merely indicates the maximum allowable number of columns. See column-count." + "<'column-width'>": "The ideal column width, defined as a <length> or the keyword auto. The actual width may be wider or narrower to fit the available space. See column-width.", + "<'column-count'>": "The ideal number of columns into which the element's content should be flowed, defined as an <integer> or the keyword auto. If neither this value nor the column's width are auto, it merely indicates the maximum allowable number of columns. See column-count." } }, + "combinators": { + "url": "$MDN_URL$/web/css/reference/selectors/combinators", + "doc": "CSS combinators define relationships between selectors. They allow you to select elements based on their relationship to other elements in the document tree.\n

    For example, to style only paragraph elements that are direct children of a <div>, you can use the child combinator (>):\n

    \n```css\n/* Set top margin on 

     elements that are direct children of 

     */\ndiv > p {\n  margin-top: 0;\n}\n```\n
    " + }, "contain": { - "url": "$MDN_URL$/web/css/contain", + "url": "$MDN_URL$/web/css/reference/properties/contain", "status": [ "StandardTrack" ], @@ -10291,7 +10415,7 @@ "highDate": "2024-09-14" }, "doc": "The contain CSS property indicates that an element and its contents are, as much as possible, independent from the rest of the document tree.\nContainment enables isolating a subsection of the DOM, providing performance benefits by limiting calculations of layout, style, paint, size, or any combination to a DOM subtree rather than the entire page. Containment can also be used to scope CSS counters and quotes.", - "formalSyntax": "none | strict | content | [ [ size | inline-size ] || layout || style || paint ] | view-transition", + "formalSyntax": "none | strict | content | [ [ size | inline-size ] || layout || style || paint ]", "values": { "none": "The element renders as normal, with no containment applied.", "strict": "All containment rules are applied to the element. This is equivalent to contain: size layout paint style.", @@ -10304,7 +10428,7 @@ } }, "contain-intrinsic-block-size": { - "url": "$MDN_URL$/web/css/contain-intrinsic-block-size", + "url": "$MDN_URL$/web/css/reference/properties/contain-intrinsic-block-size", "status": [ "StandardTrack" ], @@ -10322,16 +10446,16 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The contain-intrinsic-block-size CSS logical property defines the block size of an element that a browser can use for layout when the element is subject to size containment.\n

    Block size is the size of an element in the dimension perpendicular to the flow of text within a line. In a horizontal writing mode like standard English, block size is the vertical dimension (height); in a vertical writing mode, block size is the horizontal dimension.", - "formalSyntax": "auto? [ none | <length [0,∞]> ]", + "doc": "The contain-intrinsic-block-size CSS logical property defines the block size of an element that a browser can use for layout when the element is subject to size containment.\n

    Block size is the size of an element in the dimension perpendicular to the flow of text within a line. In a horizontal writing mode like standard English, block size is the vertical dimension (height); in a vertical writing mode, block size is the horizontal dimension.", + "formalSyntax": "[ auto | from-element ]? [ none | <length [0,∞]> ]", "values": { "none": "The element has no intrinsic block size.", - "<length>": "The element has the specified block size, expressed using the (<length>) data type.", + "<length>": "The element has the specified block size, expressed using the (<length>) data type.", "auto <length>": "When the element is in size containment and skipping its contents (for example, when it is offscreen and content-visibility: auto is set) the block size is remembered from the actual size of the element when it was last able to render its child elements.\nIf the element has never rendered its child elements and hence has no remembered value for the normally rendered element size, or if it is not skipping its contents, the block size is the specified <length>." } }, "contain-intrinsic-height": { - "url": "$MDN_URL$/web/css/contain-intrinsic-height", + "url": "$MDN_URL$/web/css/reference/properties/contain-intrinsic-height", "status": [ "StandardTrack" ], @@ -10349,16 +10473,16 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The contain-intrinsic-height CSS property sets the height of an element that a browser can use for layout when the element is subject to size containment.", - "formalSyntax": "auto? [ none | <length [0,∞]> ]", + "doc": "The contain-intrinsic-height CSS property sets the height of an element that a browser can use for layout when the element is subject to size containment.", + "formalSyntax": "[ auto | from-element ]? [ none | <length [0,∞]> ]", "values": { "none": "The element has no intrinsic height.", - "<length>": "The element has the specified height (<length>).", + "<length>": "The element has the specified height (<length>).", "auto <length>": "A remembered value of the \"normally rendered\" element height if one exists and the element is skipping its contents (for example, when it is offscreen); otherwise the specified <length>." } }, "contain-intrinsic-inline-size": { - "url": "$MDN_URL$/web/css/contain-intrinsic-inline-size", + "url": "$MDN_URL$/web/css/reference/properties/contain-intrinsic-inline-size", "status": [ "StandardTrack" ], @@ -10376,16 +10500,16 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The contain-intrinsic-inline-size CSS logical property defines the inline-size of an element that a browser can use for layout when the element is subject to size containment.\n

    Inline-size is the size of the element in the dimension parallel to the flow of text within a line.\nIn a horizontal writing mode like standard English, inline size is the horizontal dimension (width); for a vertical writing mode, inline size is the vertical dimension.", - "formalSyntax": "auto? [ none | <length [0,∞]> ]", + "doc": "The contain-intrinsic-inline-size CSS logical property defines the inline-size of an element that a browser can use for layout when the element is subject to size containment.\n

    Inline-size is the size of the element in the dimension parallel to the flow of text within a line.\nIn a horizontal writing mode like standard English, inline size is the horizontal dimension (width); for a vertical writing mode, inline size is the vertical dimension.", + "formalSyntax": "[ auto | from-element ]? [ none | <length [0,∞]> ]", "values": { "none": "The element has no intrinsic inline-size.", - "<length>": "The element has the specified inline-size (<length>).", + "<length>": "The element has the specified inline-size (<length>).", "auto <length>": "When the element is in size containment and skipping its contents (for example, when it is offscreen and content-visibility: auto is set) the inline size is remembered from the actual size of the element when it was last able to render its child elements.\nIf the element has never rendered its child elements and hence has no remembered value for the normally rendered element size, or if it is not skipping its contents, the inline size is the specified <length>." } }, "contain-intrinsic-size": { - "url": "$MDN_URL$/web/css/contain-intrinsic-size", + "url": "$MDN_URL$/web/css/reference/properties/contain-intrinsic-size", "status": [ "StandardTrack" ], @@ -10403,16 +10527,16 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The contain-intrinsic-size CSS shorthand property sets the size of an element that a browser will use for layout when the element is subject to size containment.", - "formalSyntax": "[ auto? [ none | <length> ] ]{1,2}", + "doc": "The contain-intrinsic-size CSS shorthand property sets the size of an element that a browser will use for layout when the element is subject to size containment.", + "formalSyntax": "[ [ auto | from-element ]? [ none | <length [0,∞]> ] ]{1,2}", "values": { "none": "The element has no intrinsic size in the given dimension(s).", - "<length>": "The element has the specified <length> in the given dimension(s).", + "<length>": "The element has the specified <length> in the given dimension(s).", "auto [<length> | none]": "A remembered value of the \"normally rendered\" element size if one exists and the element is skipping its contents (for example, when it is offscreen); otherwise the specified <length>.\nThe none keyword may be used in place of <length> where 0px fixed lengths behave differently than none (such as in multi column, or grid layouts)." } }, "contain-intrinsic-width": { - "url": "$MDN_URL$/web/css/contain-intrinsic-width", + "url": "$MDN_URL$/web/css/reference/properties/contain-intrinsic-width", "status": [ "StandardTrack" ], @@ -10430,16 +10554,16 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The contain-intrinsic-width CSS property sets the width of an element that a browser will use for layout when the element is subject to size containment.", - "formalSyntax": "auto? [ none | <length [0,∞]> ]", + "doc": "The contain-intrinsic-width CSS property sets the width of an element that a browser will use for layout when the element is subject to size containment.", + "formalSyntax": "[ auto | from-element ]? [ none | <length [0,∞]> ]", "values": { "none": "The element has no intrinsic width.", - "<length>": "The element has the specified width (<length>).", + "<length>": "The element has the specified width (<length>).", "auto <length>": "A remembered value of the \"normally rendered\" element width if one exists and the element is skipping its contents (for example, when it is offscreen); otherwise the specified <length>." } }, "container": { - "url": "$MDN_URL$/web/css/container", + "url": "$MDN_URL$/web/css/reference/properties/container", "status": [ "StandardTrack" ], @@ -10458,15 +10582,15 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The container shorthand CSS property establishes the element as a query container and specifies the name and type of the containment context used in a container query.", + "doc": "The container shorthand CSS property establishes the element as a query container and specifies the name and type of the containment context used in a container query.", "formalSyntax": "<'container-name'> [ / <'container-type'> ]?\n  <container-name> = none | <custom-ident>+\n  <container-type> = normal | [ [ size | inline-size ] || scroll-state ]", "values": { - "<container-name>": "A case-sensitive name for the containment context.\nMore details on the syntax are covered in the container-name property page.", - "<container-type>": "The type of containment context.\nMore details on the syntax are covered in the container-type property page." + "<container-name>": "A case-sensitive name for the containment context.\nMore details on the syntax are covered in the container-name property page.", + "<container-type>": "The type of containment context.\nMore details on the syntax are covered in the container-type property page." } }, "container-name": { - "url": "$MDN_URL$/web/css/container-name", + "url": "$MDN_URL$/web/css/reference/properties/container-name", "status": [ "StandardTrack" ], @@ -10485,7 +10609,7 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The container-name CSS property specifies a list of query container names used by the @container at-rule in a container query.\nA container query will apply styles to elements based on the size or scroll-state of the nearest ancestor with a containment context.\nWhen a containment context is given a name, it can be specifically targeted using the @container at-rule instead of the nearest ancestor with containment.", + "doc": "The container-name CSS property specifies a list of query container names used by the @container at-rule in a container query.\nA container query will apply styles to elements based on the size or scroll-state of the nearest ancestor with a containment context.\nWhen a containment context is given a name, it can be specifically targeted using the @container at-rule instead of the nearest ancestor with containment.", "formalSyntax": "none | <custom-ident>+", "values": { "none": "Default value. The query container has no name.", @@ -10493,7 +10617,7 @@ } }, "container-type": { - "url": "$MDN_URL$/web/css/container-type", + "url": "$MDN_URL$/web/css/reference/properties/container-type", "status": [ "StandardTrack" ], @@ -10512,17 +10636,17 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "An element can be established as a query container using the container-type CSS property. container-type is used to define the type of container context used in a container query. The available container contexts are:\n

    ", + "doc": "An element can be established as a query container using the container-type CSS property. container-type is used to define the type of container context used in a container query. The available container contexts are:\n", "formalSyntax": "normal | [ [ size | inline-size ] || scroll-state ]", "values": { - "inline-size": "Establishes a query container for dimensional queries on the inline axis of the container.\nApplies style and inline-size containment to the element. The inline size of the element can be computed in isolation, ignoring the child elements (see Using CSS containment).", - "normal": "Default value. The element is not a query container for any container size queries, but remains a query container for container style queries.", + "inline-size": "Establishes a query container for dimensional queries on the inline axis of the container.\nApplies style and inline-size containment to the element. The inline size of the element can be computed in isolation, ignoring the child elements (see Using CSS containment).", + "normal": "Default value. The element is not a query container for any container size queries, but remains a query container for container style queries.", "scroll-state": "Establishes a query container for scroll-state queries on the container. In this case, the size of the element is not computed in isolation; no containment is applied.", - "size": "Establishes a query container for container size queries in both the inline and block dimensions.\nApplies style and size containment to the element. Size containment is applied to the element in both the inline and block directions. The size of the element can be computed in isolation, ignoring the child elements." + "size": "Establishes a query container for container size queries in both the inline and block dimensions.\nApplies style and size containment to the element. Size containment is applied to the element in both the inline and block directions. The size of the element can be computed in isolation, ignoring the child elements." } }, "content": { - "url": "$MDN_URL$/web/css/content", + "url": "$MDN_URL$/web/css/reference/properties/content", "status": [ "StandardTrack" ], @@ -10542,22 +10666,22 @@ "highDate": "2018-01-29" }, "doc": "The content CSS property replaces content with a generated value. It can be used to define what is rendered inside an element or pseudo-element. For elements, the content property specifies whether the element renders normally (normal or none) or is replaced with an image (and associated \"alt\" text). For pseudo-elements and margin boxes, content defines the content as images, text, both, or none, which determines whether the element renders at all.\n

    Objects inserted using the content property are anonymous replaced elements.", - "formalSyntax": "normal | none | [ <content-replacement> | <content-list> ] [ / [ <string> | <counter> | <attr()> ]+ ]? | <element()>\n  <content-replacement> = <image>\n  <content-list> = [ <string> | <counter()> | <counters()> | <content()> | <attr()> ]+\n  <counter> = <counter()> | <counters()>\n  <attr()> = attr( <attr-name> <attr-type>? , <declaration-value>? )\n  <element()> = element( <id-selector> )\n  <image> = <url> | <gradient>\n  <counter()> = counter( <counter-name> , <counter-style>? )\n  <counters()> = counters( <counter-name> , <string> , <counter-style>? )\n  <content()> = content( [ text | before | after | first-letter | marker ]? )\n  <attr-name> = [ <ident-token>? '|' ]? <ident-token>\n  <attr-type> = type( <syntax> ) | raw-string | number | <attr-unit>\n  <id-selector> = <hash-token>\n  <url> = <url()> | <src()>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <syntax> = '*' | <syntax-component> [ <syntax-combinator> <syntax-component> ]* | <syntax-string>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <syntax-component> = <syntax-single-component> <syntax-multiplier>? | '<' transform-list '>'\n  <syntax-combinator> = '|'\n  <syntax-string> = <string>\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <syntax-single-component> = '<' <syntax-type-name> '>' | <ident>\n  <syntax-multiplier> = '#' | '+'\n  <syntax-type-name> = angle | color | custom-ident | image | integer | length | length-percentage | number | percentage | resolution | string | time | url | transform-function", + "formalSyntax": "normal | none | [ <content-replacement> | <content-list> ] [ / [ <string> | <counter> | <attr()> ]+ ]? | <element()>\n  <content-replacement> = <image>\n  <content-list> = [ <string> | <counter()> | <counters()> | <content()> | <attr()> ]+\n  <counter> = <counter()> | <counters()>\n  <attr()> = attr( <attr-name> <attr-type>? , <declaration-value>? )\n  <element()> = element( <id-selector> )\n  <image> = <url> | <gradient>\n  <counter()> = counter( <counter-name> , <counter-style>? )\n  <counters()> = counters( <counter-name> , <string> , <counter-style>? )\n  <content()> = content( [ text | before | after | first-letter | marker ]? )\n  <attr-name> = [ <ident-token>? '|' ]? <ident-token>\n  <attr-type> = type( <syntax> ) | raw-string | number | <attr-unit>\n  <id-selector> = <hash-token>\n  <url> = <url()> | <src()>\n  <counter-name> = <custom-ident>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <syntax> = '*' | <syntax-component> [ <syntax-combinator> <syntax-component> ]* | <syntax-string>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <counter-style-name> = <custom-ident>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <syntax-component> = <syntax-single-component> <syntax-multiplier>? | '<' transform-list '>'\n  <syntax-combinator> = '|'\n  <syntax-string> = <string>\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <syntax-single-component> = '<' <syntax-type-name> '>' | <ident>\n  <syntax-multiplier> = '#' | '+'\n  <syntax-type-name> = angle | color | custom-ident | image | integer | length | length-percentage | number | percentage | resolution | string | time | url | transform-function", "values": { "none": "When applied to a pseudo-element, the pseudo-element is not generated.\nWhen applied to an element, the value has no effect.", - "normal": "For the ::before and ::after pseudo-elements, this value computes to none . For other pseudo-elements such as ::marker, ::placeholder, or ::file-selector-button, it produces the element's initial (or normal) content. For regular elements or page margin boxes, it computes to the element's descendants. This is the default value.", + "normal": "For the ::before and ::after pseudo-elements, this value computes to none . For other pseudo-elements such as ::marker, ::placeholder, or ::file-selector-button, it produces the element's initial (or normal) content. For regular elements or page margin boxes, it computes to the element's descendants. This is the default value.", "<string>": "A sequence of characters enclosed in matching single or double quotes. Multiple string values will be concatenated (there is no concatenation operator in CSS).", - "<image>": "An <image>, representing an image to display. This can be equal to a <url>, image-set(), or <gradient> data type, or a part of the webpage itself, defined by the element() function.", - "<counter>": "The <counter> value is a CSS counter, generally a number produced by computations defined by <counter-reset> and <counter-increment> properties. It can be displayed using either the counter() or counters() function.\n

    \n
    counter()
    \n
    \n

    The counter() function has two forms: 'counter(name)' or 'counter(name, style)'. The generated text is the value of the innermost counter of the given name in scope at the given pseudo-element. It is formatted in the specified <list-style-type> (decimal by default).\n

    \n
    counters()
    \n
    \n

    The counters() function also has two forms: 'counters(name, string)' or 'counters(name, string, style)'. The generated text is the value of all counters with the given name in scope at the given pseudo-element, from outermost to innermost, separated by the specified string. The counters are rendered in the indicated <list-style-type> (decimal by default).\n

    \n
    ", - "<quote>": "The <quote> data type includes language- and position-dependent keywords:\n
    \n
    open-quote and close-quote
    \n
    \n

    These values are replaced by the appropriate string from the quotes property.\n

    \n
    no-open-quote and no-close-quote
    \n
    \n

    Introduces no content, but increments (decrements) the level of nesting for quotes.\n

    \n
    ", + "<image>": "An <image>, representing an image to display. This can be equal to a <url>, image-set(), or <gradient> data type, or a part of the webpage itself, defined by the element() function.", + "<counter>": "The <counter> value is a CSS counter, generally a number produced by computations defined by <counter-reset> and <counter-increment> properties. It can be displayed using either the counter() or counters() function.\n
    \n
    counter()
    \n
    \n

    The counter() function has two forms: 'counter(name)' or 'counter(name, style)'. The generated text is the value of the innermost counter of the given name in scope at the given pseudo-element. It is formatted in the specified <list-style-type> (decimal by default).\n

    \n
    counters()
    \n
    \n

    The counters() function also has two forms: 'counters(name, string)' or 'counters(name, string, style)'. The generated text is the value of all counters with the given name in scope at the given pseudo-element, from outermost to innermost, separated by the specified string. The counters are rendered in the indicated <list-style-type> (decimal by default).\n

    \n
    ", + "<quote>": "The <quote> data type includes language- and position-dependent keywords:\n
    \n
    open-quote and close-quote
    \n
    \n

    These values are replaced by the appropriate string from the quotes property.\n

    \n
    no-open-quote and no-close-quote
    \n
    \n

    Introduces no content, but increments (decrements) the level of nesting for quotes.\n

    \n
    ", "<target>": "The <target> data type includes three target functions, <target-counter()>, <target-counters()>, and <target-text()> that create cross-references obtained from the target end of a link. See Formal syntax.", "<leader()>": "The <leader()> data type includes a leader function: leader( <leader-type> ). This function accepts the keyword values dotted, solid, or space (equal to leader(\".\"), leader(\"_\"), and leader(\" \"), respectively), or a <string> as a parameter. When supported and used as a value for content, the leader-type provided will be inserted as a repeating pattern, visually connecting content across a horizontal line.", "attr(x)": "The attr(x) CSS function retrieves the value of an attribute of the selected element, or the pseudo-element's originating element. The value of the element's attribute x is an unparsed string representing the attribute name. If there is no attribute x, an empty string is returned. The case sensitivity of the attribute name parameter depends on the document language.", - "alternative text: / <string> | <counter>": "Alternative text may be specified for an image or any <content-list> items, by appending a forward slash and then a string of text or a counter. The alternative text is intended for speech output by screen-readers, but may also be displayed in some browsers. The / <string> or / <counter> data types specify the \"alt text\" for the element." + "alternative text: / <string> | <counter> | attr()": "Alternative text may be specified for an image or any <content-list> items, by appending a forward slash and then a combination of strings, counters, and attr() functions. The alternative text is intended for speech output by screen-readers, but may also be displayed in some browsers." } }, "content-visibility": { - "url": "$MDN_URL$/web/css/content-visibility", + "url": "$MDN_URL$/web/css/reference/properties/content-visibility", "status": [ "StandardTrack" ], @@ -10579,12 +10703,12 @@ "formalSyntax": "visible | auto | hidden", "values": { "visible": "No effect. The element's contents are laid out and rendered as normal. This is the default value.", - "hidden": "The element skips its contents. The skipped contents must not be accessible to user-agent features, such as find-in-page, tab-order navigation, etc., nor be selectable or focusable. This is similar to giving the contents display: none.", - "auto": "The element turns on layout containment, style containment, and paint containment. If the element is not relevant to the user, it also skips its contents. Unlike hidden, the skipped contents must still be available as normal to user-agent features such as find-in-page, tab order navigation, etc., and must be focusable and selectable as normal." + "hidden": "The element skips its contents. The skipped contents must not be accessible to user-agent features, such as find-in-page, tab-order navigation, etc., nor be selectable or focusable. This is similar to giving the contents display: none.", + "auto": "The element turns on layout containment, style containment, and paint containment. If the element is not relevant to the user, it also skips its contents. Unlike hidden, the skipped contents must still be available as normal to user-agent features such as find-in-page, tab order navigation, etc., and must be focusable and selectable as normal." } }, "corner-block-end-shape": { - "url": "$MDN_URL$/web/css/corner-block-end-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-block-end-shape", "status": [ "Experimental", "StandardTrack" @@ -10598,11 +10722,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-block-end-shape CSS property specifies the shape of both the corners on a box's block-end edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-block-end-shape CSS property specifies the shape of both the corners on a box's block-end edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-block-start-shape": { - "url": "$MDN_URL$/web/css/corner-block-start-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-block-start-shape", "status": [ "Experimental", "StandardTrack" @@ -10616,11 +10740,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-block-start-shape CSS property specifies the shape of both the corners on a box's block-start edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-block-start-shape CSS property specifies the shape of both the corners on a box's block-start edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-bottom-left-shape": { - "url": "$MDN_URL$/web/css/corner-bottom-left-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-bottom-left-shape", "status": [ "Experimental", "StandardTrack" @@ -10634,11 +10758,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-bottom-left-shape CSS property specifies the shape of a box's bottom-left corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-bottom-left-shape CSS property specifies the shape of a box's bottom-left corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-bottom-right-shape": { - "url": "$MDN_URL$/web/css/corner-bottom-right-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-bottom-right-shape", "status": [ "Experimental", "StandardTrack" @@ -10652,11 +10776,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-bottom-right-shape CSS property specifies the shape of a box's bottom-right corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-bottom-right-shape CSS property specifies the shape of a box's bottom-right corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-bottom-shape": { - "url": "$MDN_URL$/web/css/corner-bottom-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-bottom-shape", "status": [ "Experimental", "StandardTrack" @@ -10670,11 +10794,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-bottom-shape CSS property specifies the shape of both the corners on a box's bottom edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-bottom-shape CSS property specifies the shape of both the corners on a box's bottom edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-end-end-shape": { - "url": "$MDN_URL$/web/css/corner-end-end-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-end-end-shape", "status": [ "Experimental", "StandardTrack" @@ -10688,11 +10812,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-end-end-shape CSS property specifies the shape of a box's block-end and inline-end corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-end-end-shape CSS property specifies the shape of a box's block-end and inline-end corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-end-start-shape": { - "url": "$MDN_URL$/web/css/corner-end-start-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-end-start-shape", "status": [ "Experimental", "StandardTrack" @@ -10706,11 +10830,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-end-start-shape CSS property specifies the shape of a box's block-end and inline-start corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-end-start-shape CSS property specifies the shape of a box's block-end and inline-start corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-inline-end-shape": { - "url": "$MDN_URL$/web/css/corner-inline-end-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-inline-end-shape", "status": [ "Experimental", "StandardTrack" @@ -10724,11 +10848,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-inline-end-shape CSS property specifies the shape of both the corners on a box's inline-end edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-inline-end-shape CSS property specifies the shape of both the corners on a box's inline-end edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-inline-start-shape": { - "url": "$MDN_URL$/web/css/corner-inline-start-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-inline-start-shape", "status": [ "Experimental", "StandardTrack" @@ -10742,11 +10866,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-inline-start-shape CSS property specifies the shape of both the corners on a box's inline-start edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-inline-start-shape CSS property specifies the shape of both the corners on a box's inline-start edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-left-shape": { - "url": "$MDN_URL$/web/css/corner-left-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-left-shape", "status": [ "Experimental", "StandardTrack" @@ -10760,11 +10884,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-left-shape CSS property specifies the shape of both the corners on a box's left-hand edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-left-shape CSS property specifies the shape of both the corners on a box's left-hand edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-right-shape": { - "url": "$MDN_URL$/web/css/corner-right-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-right-shape", "status": [ "Experimental", "StandardTrack" @@ -10778,11 +10902,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-right-shape CSS property specifies the shape of both the corners on a box's right-hand edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-right-shape CSS property specifies the shape of both the corners on a box's right-hand edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-shape": { - "url": "$MDN_URL$/web/css/corner-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-shape", "status": [ "Experimental", "StandardTrack" @@ -10796,14 +10920,14 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-shape shorthand CSS property specifies the shape of a box's corners, within the area specified by its border-radius property value.", - "formalSyntax": "<'corner-top-left-shape'>{1,4}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )", + "doc": "

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

    \n

    The corner-shape shorthand CSS property specifies the shape of a box's corners, within the area specified by its border-radius property value.", + "formalSyntax": "<'corner-top-left-shape'>{1,4}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )", "values": { - "<corner-shape-value>": "A superellipse() or keyword equivalent describing the shape of the corner." + "<corner-shape-value>": "A superellipse() or keyword equivalent describing the shape of the corner." } }, "corner-start-end-shape": { - "url": "$MDN_URL$/web/css/corner-start-end-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-start-end-shape", "status": [ "Experimental", "StandardTrack" @@ -10817,11 +10941,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-start-end-shape CSS property specifies the shape of a box's block-start and inline-end corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-start-end-shape CSS property specifies the shape of a box's block-start and inline-end corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-start-start-shape": { - "url": "$MDN_URL$/web/css/corner-start-start-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-start-start-shape", "status": [ "Experimental", "StandardTrack" @@ -10835,11 +10959,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-start-start-shape CSS property specifies the shape of a box's block-start and inline-start corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-start-start-shape CSS property specifies the shape of a box's block-start and inline-start corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-top-left-shape": { - "url": "$MDN_URL$/web/css/corner-top-left-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-top-left-shape", "status": [ "Experimental", "StandardTrack" @@ -10853,11 +10977,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-top-left-shape CSS property specifies the shape of a box's top-left corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-top-left-shape CSS property specifies the shape of a box's top-left corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-top-right-shape": { - "url": "$MDN_URL$/web/css/corner-top-right-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-top-right-shape", "status": [ "Experimental", "StandardTrack" @@ -10871,11 +10995,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-top-right-shape CSS property specifies the shape of a box's top-right corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-top-right-shape CSS property specifies the shape of a box's top-right corner, within its border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "corner-top-shape": { - "url": "$MDN_URL$/web/css/corner-top-shape", + "url": "$MDN_URL$/web/css/reference/properties/corner-top-shape", "status": [ "Experimental", "StandardTrack" @@ -10889,11 +11013,11 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The corner-top-shape CSS property specifies the shape of both the corners on a box's top edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", - "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number [-∞,∞]> | infinity | -infinity )" + "doc": "

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

    \n

    The corner-top-shape CSS property specifies the shape of both the corners on a box's top edge, within their border-radius area.\n

    For a full description of corner shape behavior and multiple examples, see the corner-shape shorthand property page.", + "formalSyntax": "<'corner-top-left-shape'>{1,2}\n  <corner-top-left-shape> = <corner-shape-value>\n  <corner-shape-value> = round | scoop | bevel | notch | square | squircle | <superellipse()>\n  <superellipse()> = superellipse( <number> | infinity | -infinity )" }, "counter-increment": { - "url": "$MDN_URL$/web/css/counter-increment", + "url": "$MDN_URL$/web/css/reference/properties/counter-increment", "status": [ "StandardTrack" ], @@ -10912,8 +11036,8 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The counter-increment CSS property can be used to increase or decrease the value of the named CSS counters by the specified values, or to prevent all counters or an individual counter's value from being changed.\n

    If a named counter in the list of space-separated counters and values doesn't exist, it will be created. If no value is provided for a counter in the list of counters, the counter will be increased by 1.\n

    The counter's value can be reset to any integer value with the counter-reset CSS property.", - "formalSyntax": "[ <counter-name> <integer>? ]+ | none", + "doc": "The counter-increment CSS property can be used to increase or decrease the value of the named CSS counters by the specified values, or to prevent all counters or an individual counter's value from being changed.\n

    If a named counter in the list of space-separated counters and values doesn't exist, it will be created. If no value is provided for a counter in the list of counters, the counter will be increased by 1.\n

    The counter's value can be reset to any integer value with the counter-reset CSS property.", + "formalSyntax": "[ <counter-name> <integer>? ]+ | none\n  <counter-name> = <custom-ident>\n  <integer> = <number-token>", "values": { "<custom-ident>": "Specifies the name of the counter to increase or decrease.", "<integer>": "Specifies the value to add to the counter. If the integer is preceded by a - sign, the value will be subtracted from the counter. Defaults to 1 if no value is specified.", @@ -10921,7 +11045,7 @@ } }, "counter-reset": { - "url": "$MDN_URL$/web/css/counter-reset", + "url": "$MDN_URL$/web/css/reference/properties/counter-reset", "status": [ "StandardTrack" ], @@ -10940,16 +11064,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The counter-reset CSS property creates named CSS counters and initializes them to a specific value. It supports creating counters that count up from one to the number of elements, as well as those that count down from the number of elements to one.", - "formalSyntax": "[ <counter-name> <integer>? | <reversed-counter-name> <integer>? ]+ | none\n  <reversed-counter-name> = reversed( <counter-name> )", + "doc": "The counter-reset CSS property creates named CSS counters and initializes them to a specific value. It supports creating counters that count up from one to the number of elements, as well as those that count down from the number of elements to one.", + "formalSyntax": "[ <counter-name> <integer>? | <reversed-counter-name> <integer>? ]+ | none\n  <counter-name> = <custom-ident>\n  <integer> = <number-token>\n  <reversed-counter-name> = reversed( <counter-name> )", "values": { - "<custom-ident>": "Specifies the counter name to create and initialize using the <custom-ident> format. The reversed() functional notation can be used to mark the counter reversed.", + "<custom-ident>": "Specifies the counter name to create and initialize using the <custom-ident> format. The reversed() functional notation can be used to mark the counter reversed.", "<integer>": "The initial value to set on the newly created counter.\nDefaults to 0 if not specified.", "none": "Specifies that no counter initialization should occur.\nThis value is useful for overriding counter-reset values in less specific rules." } }, "counter-set": { - "url": "$MDN_URL$/web/css/counter-set", + "url": "$MDN_URL$/web/css/reference/properties/counter-set", "status": [ "StandardTrack" ], @@ -10967,8 +11091,8 @@ "level": "LOW", "lowDate": "2023-12-11" }, - "doc": "The counter-set CSS property sets CSS counters on the element to the given values.\n

    If the counters don't exist the counter-set property creates a new counter for each named counter in the list of space-separated counter and value pairs. However, to create a new counter it is recommended to use the counter-reset CSS property.\n

    If a named counter in the list is missing a value, the value of the counter will be set to 0.", - "formalSyntax": "[ <counter-name> <integer>? ]+ | none", + "doc": "The counter-set CSS property sets CSS counters on the element to the given values.\n

    If the counters don't exist the counter-set property creates a new counter for each named counter in the list of space-separated counter and value pairs. However, to create a new counter it is recommended to use the counter-reset CSS property.\n

    If a named counter in the list is missing a value, the value of the counter will be set to 0.\n

    \n

    Note:\nThe counter's value can be incremented or decremented using the counter-increment CSS property.\n

    ", + "formalSyntax": "[ <counter-name> <integer>? ]+ | none\n  <counter-name> = <custom-ident>\n  <integer> = <number-token>", "values": { "<custom-ident>": "The name of the counter to set.", "<integer>": "The value to set the counter to on each occurrence of the element. Defaults to 0 if not specified. If there isn't currently a counter of the given name on the element, the element will create a new counter of the given name with a starting value of 0 (though it may then immediately set or increment that value to something different).", @@ -10976,7 +11100,7 @@ } }, "cursor": { - "url": "$MDN_URL$/web/css/cursor", + "url": "$MDN_URL$/web/css/reference/properties/cursor", "status": [ "StandardTrack" ], @@ -10996,15 +11120,15 @@ "highDate": "2024-06-07" }, "doc": "The cursor CSS property sets the mouse cursor, if any, to show when the mouse pointer is over an element.\n

    The cursor setting should inform users of the mouse operations that can be performed at the current location, including: text selection, activating help or context menus, copying content, resizing tables, and so on.\nYou can specify either the type of cursor using a keyword, or load a specific icon to use (with optional fallback images and mandatory keyword as a final fallback).", - "formalSyntax": "<cursor-image>#? <cursor-predefined>\n  <cursor-image> = [ <url> | <url-set> ] [ <number>{2} ]?\n  <cursor-predefined> = auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "formalSyntax": "[ <cursor-image> , ]* <cursor-predefined>\n  <cursor-image> = [ <url> | <url-set> ] [ <number>{2} ]?\n  <cursor-predefined> = auto | default | none | context-menu | help | pointer | progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | grab | grabbing | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<url>": "A url() or a comma separated list url(), url(), …, pointing to an image file.\nMore than one <url> may be provided as fallbacks, in case some cursor image types are not supported.\nA non-URL fallback (one or more of the keyword values) must be at the end of the fallback list.", + "<url>": "A url() or a comma separated list url(), url(), …, pointing to an image file.\nMore than one <url> may be provided as fallbacks, in case some cursor image types are not supported.\nA non-URL fallback (one or more of the keyword values) must be at the end of the fallback list.", "<x>, <y>": "Optional x- and y-coordinates indicating the cursor hotspot; the precise position within the cursor that is being pointed to.\n

    The numbers are in units of image pixels.\nThey are relative to the top left corner of the image, which corresponds to 0 0, and are clamped within the boundaries of the cursor image.\nIf these values are not specified, they may be read from the file itself, and will otherwise default to the top-left corner of the image.", "keyword": "A keyword value must be specified, indicating either the type of cursor to use, or the fallback cursor to use if all specified icons fail to load.\n

    The available keywords are listed in the table below. Other than none, which means no cursor, there is an image showing how the cursors used to be rendered. You can hover your mouse over the table rows to see the effect of the different cursor keyword values on your browser today.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    CategoryKeywordExampleDescription
    Generalauto\nThe UA will determine the cursor to display based on the current context. E.g., equivalent to text when hovering text.\n
    defaultThe platform-dependent default cursor. Typically an arrow.
    noneNo cursor is rendered.
    Links & statuscontext-menuA context menu is available.
    helpHelp information is available.
    pointer\nThe cursor is a pointer that indicates a link. Typically an image of a pointing hand.\n
    progress\nThe program is busy in the background, but the user can still interact\nwith the interface (in contrast to wait).\n
    wait\nThe program is busy, and the user can't interact with the interface (in contrast to progress).\nSometimes an image of an hourglass or a watch.\n
    SelectioncellThe table cell or set of cells can be selected.
    crosshairCross cursor, often used to indicate selection in a bitmap.
    textThe text can be selected. Typically the shape of an I-beam.
    vertical-text\nThe vertical text can be selected. Typically the shape of a sideways I-beam.\n
    Drag & dropaliasAn alias or shortcut is to be created.
    copySomething is to be copied.
    moveSomething is to be moved.
    no-drop\nAn item may not be dropped at the current location.
    Firefox bug 275173:\nOn Windows and macOS, no-drop is the same as not-allowed.\n
    not-allowedThe requested action will not be carried out.
    grabSomething can be grabbed (dragged to be moved).
    grabbingSomething is being grabbed (dragged to be moved).
    \nResizing & scrolling\nall-scroll\nSomething can be scrolled in any direction (panned).
    Firefox bug 275174:\nOn Windows, all-scroll is the same as move.\n
    col-resize\nThe item/column can be resized horizontally.\nOften rendered as arrows pointing left and right with a vertical bar separating them.\n
    row-resize\nThe item/row can be resized vertically.\nOften rendered as arrows pointing up and down with a horizontal bar separating them.\n
    n-resize\nSome edge is to be moved. For example, the se-resize cursor is used when the movement starts from the south-east corner of the box.
    \nIn some environments, an equivalent bidirectional resize cursor is shown.\nFor example, n-resize and s-resize are the same as ns-resize.\n
    e-resize
    s-resize
    w-resize
    ne-resize
    nw-resize
    se-resize
    sw-resize
    ew-resizeBidirectional resize cursor.
    ns-resize
    nesw-resize
    nwse-resize
    Zoomingzoom-in\n

    Something can be zoomed (magnified) in or out.\n

    zoom-out
    " } }, "cx": { - "url": "$MDN_URL$/web/css/cx", + "url": "$MDN_URL$/web/css/reference/properties/cx", "status": [ "StandardTrack" ], @@ -11026,12 +11150,12 @@ "doc": "The cx CSS property defines the x-axis center point of an SVG <circle> or <ellipse> element. If present, it overrides the element's cx attribute.\n
    \n

    Note:\nWhile SVG the cx attribute is relevant to the SVG <radialGradient> element, the cx property only applies to <circle> and <ellipse> elements nested in an <svg>. It doesn't apply to <radialGradient> or other SVG elements nor to HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", + "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", "<percentage>": "Percentages refer to the width of the current SVG viewport." } }, "cy": { - "url": "$MDN_URL$/web/css/cy", + "url": "$MDN_URL$/web/css/reference/properties/cy", "status": [ "StandardTrack" ], @@ -11053,12 +11177,12 @@ "doc": "The cy CSS property defines the y-axis center point of an SVG <circle> or <ellipse> elements. If present, it overrides the element's cy attribute.\n
    \n

    Note:\nWhile the SVG <radialGradient> element supports the cy attribute, the cy property only applies to <circle> and <ellipse> elements nested in an <svg>. This attribute does not apply to <radialGradient> or other SVG elements nor to HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", + "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", "<percentage>": "Percentages refer to the height of the current SVG viewport." } }, "d": { - "url": "$MDN_URL$/web/css/d", + "url": "$MDN_URL$/web/css/reference/properties/d", "status": [ "StandardTrack" ], @@ -11081,7 +11205,7 @@ } }, "descendant_combinator": { - "url": "$MDN_URL$/web/css/descendant_combinator", + "url": "$MDN_URL$/web/css/reference/selectors/descendant_combinator", "status": [ "StandardTrack" ], @@ -11103,7 +11227,7 @@ "doc": "The descendant combinator — typically represented by a single space (\" \") character — combines two selectors such that elements matched by the second selector are selected if they have an ancestor (parent, parent's parent, parent's parent's parent, etc.) element matching the first selector. Selectors that utilize a descendant combinator are called descendant selectors.\n
    \n```css\n/* List items that are descendants of the \"my-things\" list */\nul.my-things li {\n  margin: 2em;\n}\n```\n
    \n

    The descendant combinator is technically one or more CSS white space characters — the space character and/or one of four control characters: carriage return, form feed, new line, and tab characters — between two selectors in the absence of another combinator. Additionally, the white space characters of which the combinator is comprised may contain any number of CSS comments." }, "direction": { - "url": "$MDN_URL$/web/css/direction", + "url": "$MDN_URL$/web/css/reference/properties/direction", "status": [ "StandardTrack" ], @@ -11122,7 +11246,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    \n

    Warning:\nWhere possible, authors are encouraged to avoid using the direction CSS property and use the HTML dir global attribute instead.\n

    \n

    The direction CSS property sets the direction of text, table and grid columns, and horizontal overflow. Use rtl for languages written from right to left (like Hebrew or Arabic), and ltr for those written from left to right (like English and most other languages).", + "doc": "

    \n

    Warning:\nWhere possible, authors are encouraged to avoid using the direction CSS property and use the HTML dir global attribute instead.\n

    \n

    The direction CSS property sets the direction of text, table and grid columns, and horizontal overflow. Use rtl for languages written from right to left (like Hebrew or Arabic), and ltr for those written from left to right (like English and most other languages).\n

    Note that text direction is usually defined within a document (e.g., with HTML's dir attribute) rather than through direct use of the direction property.", "formalSyntax": "ltr | rtl", "values": { "ltr": "Text and other elements go from left to right. This is the default value.", @@ -11130,7 +11254,7 @@ } }, "display": { - "url": "$MDN_URL$/web/css/display", + "url": "$MDN_URL$/web/css/reference/properties/display", "status": [ "StandardTrack" ], @@ -11149,11 +11273,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The display CSS property sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex.\n

    Formally, the display property sets an element's inner and outer display types. The outer type sets an element's participation in flow layout; the inner type sets the layout of children. Some values of display are fully defined in their own individual specifications; for example the detail of what happens when display: flex is declared is defined in the CSS Flexible Box Model specification.", - "formalSyntax": "[ <display-outside> || <display-inside> ] | <display-listitem> | <display-internal> | <display-box> | <display-legacy> | <display-outside> || [ <display-inside> | math ]\n  <display-outside> = block | inline | run-in\n  <display-inside> = flow | flow-root | table | flex | grid | ruby\n  <display-listitem> = <display-outside>? &&[ flow | flow-root ]? &&list-item\n  <display-internal> = table-row-group | table-header-group | table-footer-group | table-row | table-cell | table-column-group | table-column | table-caption | ruby-base | ruby-text | ruby-base-container | ruby-text-container\n  <display-box> = contents | none\n  <display-legacy> = inline-block | inline-table | inline-flex | inline-grid" + "doc": "The display CSS property sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex.\n

    Formally, the display property sets an element's inner and outer display types. The outer type sets an element's participation in flow layout; the inner type sets the layout of children. Some values of display are fully defined in their own individual specifications; for example the detail of what happens when display: flex is declared is defined in the CSS Flexible Box Model specification.", + "formalSyntax": "[ <display-outside> || <display-inside> ] | <display-listitem> | <display-internal> | <display-box> | <display-legacy> | ruby | ruby-base | ruby-text | ruby-base-container | ruby-text-container | <display-outside> || [ <display-inside> | math ]\n  <display-outside> = block | inline | run-in\n  <display-inside> = flow | flow-root | table | flex | grid | ruby\n  <display-listitem> = <display-outside>? &&[ flow | flow-root ]? &&list-item\n  <display-internal> = table-row-group | table-header-group | table-footer-group | table-row | table-cell | table-column-group | table-column | table-caption | ruby-base | ruby-text | ruby-base-container | ruby-text-container\n  <display-box> = contents | none\n  <display-legacy> = inline-block | inline-table | inline-flex | inline-grid" }, "dominant-baseline": { - "url": "$MDN_URL$/web/css/dominant-baseline", + "url": "$MDN_URL$/web/css/reference/properties/dominant-baseline", "status": [ "StandardTrack" ], @@ -11176,18 +11300,18 @@ "formalSyntax": "auto | text-bottom | alphabetic | ideographic | middle | central | mathematical | hanging | text-top", "values": { "auto": "If this property is applied to a <text> element, then the computed value depends on the value of the writing-mode attribute.\n

    If the writing-mode is horizontal, then the value of the dominant-baseline component is alphabetic. Otherwise, if the writing-mode is vertical, then the value of the dominant-baseline component is central.\n

    If this property is applied to a <tspan>, or <textPath> element, then the dominant-baseline and the baseline-table components remain the same as those of the parent text content element.\n

    If the computed baseline-shift value actually shifts the baseline, then the baseline-table font-size component is set to the value of the font-size attribute on the element on which the dominant-baseline attribute occurs, otherwise the baseline-table font-size remains the same as that of the element.\n

    If there is no parent text content element, the scaled-baseline-table value is constructed as for <text> elements.", - "alphabetic": "The baseline-identifier for the dominant-baseline is set to be alphabetic, the derived baseline-table is constructed using the alphabetic baseline-table in the font, and the baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", - "central": "The baseline-identifier for the dominant-baseline is set to be central. The derived baseline-table is constructed from the defined baselines in the font's baseline-table. That font baseline-table is chosen using the following priority order of baseline-table names: ideographic, alphabetic, hanging, mathematical. The baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", - "hanging": "The baseline-identifier for the dominant-baseline is set to be hanging, the derived baseline-table is constructed using the hanging baseline-table in the font, and the baseline-table font-size is changed to the value of the font-size SVG attribute of font-size CSS property on this element.", - "ideographic": "The baseline-identifier for the dominant-baseline is set to be ideographic, the derived baseline-table is constructed using the ideographic baseline-table in the font, and the baseline-table font-size is changed to the value of the value of the element's font-size SVG attribute or the CSS font-size, if set.", - "mathematical": "The baseline-identifier for the dominant-baseline is set to be mathematical, the derived baseline-table is constructed using the mathematical baseline-table in the font, and the baseline-table font-size is changed to the value of the value of the element's font-size SVG attribute or the CSS font-size, if set.", - "middle": "The baseline-identifier for the dominant-baseline is set to be middle. The derived baseline-table is constructed from the defined baselines in a baseline-table in the font. That font baseline-table is chosen using the following priority order of baseline-table names: ideographic, alphabetic, hanging, mathematical. The baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", + "alphabetic": "The baseline-identifier for the dominant-baseline is set to be alphabetic, the derived baseline-table is constructed using the alphabetic baseline-table in the font, and the baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", + "central": "The baseline-identifier for the dominant-baseline is set to be central. The derived baseline-table is constructed from the defined baselines in the font's baseline-table. That font baseline-table is chosen using the following priority order of baseline-table names: ideographic, alphabetic, hanging, mathematical. The baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", + "hanging": "The baseline-identifier for the dominant-baseline is set to be hanging, the derived baseline-table is constructed using the hanging baseline-table in the font, and the baseline-table font-size is changed to the value of the font-size SVG attribute of font-size CSS property on this element.", + "ideographic": "The baseline-identifier for the dominant-baseline is set to be ideographic, the derived baseline-table is constructed using the ideographic baseline-table in the font, and the baseline-table font-size is changed to the value of the value of the element's font-size SVG attribute or the CSS font-size, if set.", + "mathematical": "The baseline-identifier for the dominant-baseline is set to be mathematical, the derived baseline-table is constructed using the mathematical baseline-table in the font, and the baseline-table font-size is changed to the value of the value of the element's font-size SVG attribute or the CSS font-size, if set.", + "middle": "The baseline-identifier for the dominant-baseline is set to be middle. The derived baseline-table is constructed from the defined baselines in a baseline-table in the font. That font baseline-table is chosen using the following priority order of baseline-table names: ideographic, alphabetic, hanging, mathematical. The baseline-table font-size is changed to the value of the element's font-size SVG attribute or the CSS font-size, if set.", "text-bottom": "The line-under edge is used as the baseline, which is usually the bottom edge of the font's em box.", "text-top": "The line-over edge is used as the baseline, which is usually the top edge of the font's em box." } }, "dynamic-range-limit": { - "url": "$MDN_URL$/web/css/dynamic-range-limit", + "url": "$MDN_URL$/web/css/reference/properties/dynamic-range-limit", "status": [ "StandardTrack" ], @@ -11208,7 +11332,7 @@ } }, "empty-cells": { - "url": "$MDN_URL$/web/css/empty-cells", + "url": "$MDN_URL$/web/css/reference/properties/empty-cells", "status": [ "StandardTrack" ], @@ -11227,7 +11351,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The empty-cells CSS property sets whether borders and backgrounds appear around <table> cells that have no visible content.", + "doc": "The empty-cells CSS property sets whether borders and backgrounds appear around <table> cells that have no visible content.\n

    This property has an effect only when the border-collapse property is separate.", "formalSyntax": "show | hide", "values": { "show": "Borders and backgrounds are drawn like in normal cells.", @@ -11235,9 +11359,8 @@ } }, "field-sizing": { - "url": "$MDN_URL$/web/css/field-sizing", + "url": "$MDN_URL$/web/css/reference/properties/field-sizing", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { @@ -11245,12 +11368,13 @@ "ChromeAndroid": "123", "Edge": "123", "Opera": "109", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The field-sizing CSS property enables you to control the sizing behavior of elements that are given a default preferred size, such as form control elements. This property enables you to override the default sizing behavior, allowing form controls to adjust in size to fit their contents.\n

    This property is typically used to style text <input> and <textarea> elements to allow them to shrinkwrap their content as well as grow when more text is entered into the form control.", + "doc": "The field-sizing CSS property enables you to control the sizing behavior of elements that are given a default preferred size, such as form control elements. This property enables you to override the default sizing behavior, allowing form controls to adjust in size to fit their contents.\n

    This property is typically used to style text <input> and <textarea> elements to allow them to shrinkwrap their content as well as grow when more text is entered into the form control.", "formalSyntax": "fixed | content", "values": { "content": "Allows the element to adjust its size to fit its contents.", @@ -11258,7 +11382,7 @@ } }, "fill": { - "url": "$MDN_URL$/web/css/fill", + "url": "$MDN_URL$/web/css/reference/properties/fill", "status": [ "StandardTrack" ], @@ -11277,18 +11401,18 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The fill CSS property defines how SVG text content and the interior canvas of SVG shapes are filled or painted. If present, it overrides the element's fill attribute.\n

    The areas inside the outline of the SVG shape or text are painted. What is \"inside\" a shape may not always be clear. The paths defining a shape may overlap. The areas considered \"inside\" these complex shapes are clarified by the fill-rule property or attribute.\n

    If subpaths are open, fill closes the path before painting, as if a \"closepath\" command were included connecting the last point of the subpath with the first point of the subpath. In other words, fill applies to open subpaths within path elements (i.e., subpaths without a closepath command) and polyline elements.\n

    \n

    Note:\nThe fill property only applies to <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textPath>, and <tspan> elements nested in an <svg>. It doesn't apply other SVG, HTML, or pseudo-elements.\n

    ", - "formalSyntax": "<paint>\n  <paint> = none | <image> | <svg-paint>\n  <image> = <url> | <gradient>\n  <svg-paint> = child | child( <integer> )\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "doc": "The fill CSS property defines how SVG text content and the interior canvas of SVG shapes are filled or painted. If present, it overrides the element's fill attribute.\n

    The areas inside the outline of the SVG shape or text are painted. What is \"inside\" a shape may not always be clear. The paths defining a shape may overlap. The areas considered \"inside\" these complex shapes are clarified by the fill-rule property or attribute.\n

    If subpaths are open, fill closes the path before painting, as if a \"closepath\" command were included connecting the last point of the subpath with the first point of the subpath. In other words, fill applies to open subpaths within path elements (i.e., subpaths without a closepath command) and polyline elements.\n

    \n

    Note:\nThe fill property only applies to <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textPath>, and <tspan> elements nested in an <svg>. It doesn't apply other SVG, HTML, or pseudo-elements.\n

    ", + "formalSyntax": "<paint>\n  <paint> = none | <image> | <svg-paint>\n  <image> = <url> | <gradient>\n  <svg-paint> = child | child( <integer> )\n  <url> = <url()> | <src()>\n  <integer> = <number-token>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "No fill is painted; the areas inside the stroke, if any, are transparent.", "context-fill": "Uses the paint value of fill from a context element.", "context-stroke": "Uses the paint value of stroke from a context element.", - "<color>": "The color of the fill as any valid CSS <color> value.", + "<color>": "The color of the fill as any valid CSS <color> value.", "<url>": "A URL reference to an SVG paint server element, such as a <linearGradient>, <radialGradient>, or <pattern>. The resource reference can optionally be followed by a <color> or none, which will be used as a fallback if the referenced paint server doesn't resolve." } }, "fill-opacity": { - "url": "$MDN_URL$/web/css/fill-opacity", + "url": "$MDN_URL$/web/css/reference/properties/fill-opacity", "status": [ "StandardTrack" ], @@ -11315,7 +11439,7 @@ } }, "fill-rule": { - "url": "$MDN_URL$/web/css/fill-rule", + "url": "$MDN_URL$/web/css/reference/properties/fill-rule", "status": [ "StandardTrack" ], @@ -11334,7 +11458,7 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The fill-rule CSS property defines the rule used to determine which parts of the SVG shape's canvas are included inside a shape to be filled. If present, it overrides the element's fill-rule attribute.\n

    The fill-rule clarifies which areas of a shape should be considered \"inside\" the shape. It provides two values you can set to tell the browser how the inside of a shape should be determined. For shapes that don't have intersecting paths, like a circle, the bounds of what is inside a shape to be filled are intuitively clear. With complex shapes that include intersecting paths (such as a Venn diagram) or paths enclosing other paths (such as a donut), the interpretation of which sections of the shape are \"inside\" the shape and should be filled by the fill property, may not be obvious.\n

    \n

    Note:\nThe fill-rule property only applies to <path>, <polygon>, <polyline>, <text>, <textPath>, and <tspan> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", + "doc": "The fill-rule CSS property defines the rule used to determine which parts of the SVG shape's canvas are included inside a shape to be filled. If present, it overrides the element's fill-rule attribute.\n

    The fill-rule clarifies which areas of a shape should be considered \"inside\" the shape. It provides two values you can set to tell the browser how the inside of a shape should be determined. For shapes that don't have intersecting paths, like a circle, the bounds of what is inside a shape to be filled are intuitively clear. With complex shapes that include intersecting paths (such as a Venn diagram) or paths enclosing other paths (such as a donut), the interpretation of which sections of the shape are \"inside\" the shape and should be filled by the fill property, may not be obvious.\n

    \n

    Note:\nThe fill-rule property only applies to <path>, <polygon>, <polyline>, <text>, <textPath>, and <tspan> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "nonzero | evenodd", "values": { "nonzero": "For every point in the shape, a ray is drawn in a random direction to beyond the shape's outer edges. Each ray is examined to determine the places where the ray crosses the shape. Starting with a count of zero, add one each time a path segment crosses the ray from left to right and subtract one each time a path segment crosses the ray from right to left. After counting the crossings, if the result is zero then the point is outside the path. Otherwise, it is inside.", @@ -11342,7 +11466,7 @@ } }, "filter": { - "url": "$MDN_URL$/web/css/filter", + "url": "$MDN_URL$/web/css/reference/properties/filter", "status": [ "StandardTrack" ], @@ -11365,7 +11489,7 @@ "formalSyntax": "none | <filter-value-list>\n  <filter-value-list> = [ <filter-function> | <url> ]+\n  <filter-function> = <blur()> | <brightness()> | <contrast()> | <drop-shadow()> | <grayscale()> | <hue-rotate()> | <invert()> | <opacity()> | <sepia()> | <saturate()>\n  <url> = <url()> | <src()>\n  <blur()> = blur( <length>? )\n  <brightness()> = brightness( [ <number> | <percentage> ]? )\n  <contrast()> = contrast( [ <number> | <percentage> ]? )\n  <drop-shadow()> = drop-shadow( [ <color>? && <length>{2,3} ] )\n  <grayscale()> = grayscale( [ <number> | <percentage> ]? )\n  <hue-rotate()> = hue-rotate( [ <angle> | <zero> ]? )\n  <invert()> = invert( [ <number> | <percentage> ]? )\n  <opacity()> = opacity( [ <number> | <percentage> ]? )\n  <sepia()> = sepia( [ <number> | <percentage> ]? )\n  <saturate()> = saturate( [ <number> | <percentage> ]? )\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )" }, "fit-content": { - "url": "$MDN_URL$/web/css/fit-content", + "url": "$MDN_URL$/web/css/reference/values/fit-content", "status": [ "StandardTrack" ], @@ -11384,10 +11508,10 @@ "lowDate": "2021-11-02", "highDate": "2024-05-02" }, - "doc": "The fit-content sizing keyword represents an element size that adapts to its content while staying within the limits of its container.\nThe keyword ensures that the element is never smaller than its minimum intrinsic size (min-content) or larger than its maximum intrinsic size (max-content).\n
    \n

    Note:\nThis keyword is different from the fit-content() function. The function is used for grid track sizing (for example in grid-template-columns and grid-auto-rows) and for laid-out box sizing for properties such as width, height, min-width, and max-height.\n

    " + "doc": "The fit-content sizing keyword represents an element size that adapts to its content while staying within the limits of its container.\nThe keyword ensures that the element is never smaller than its minimum intrinsic size (min-content) or larger than its maximum intrinsic size (max-content).\n
    \n

    Note:\nThis keyword is different from the fit-content() function. The function is used for grid track sizing (for example in grid-template-columns and grid-auto-rows) and for laid-out box sizing for properties such as width, height, min-width, and max-height.\n

    " }, "flex": { - "url": "$MDN_URL$/web/css/flex", + "url": "$MDN_URL$/web/css/reference/properties/flex", "status": [ "StandardTrack" ], @@ -11406,17 +11530,17 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The flex CSS shorthand property sets how a flex item will grow or shrink to fit the space available in its flex container.", + "doc": "The flex CSS shorthand property sets how a flex item will grow or shrink to fit the space available in its flex container.", "formalSyntax": "none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]\n  <flex-grow> = <number [0,∞]>\n  <flex-shrink> = <number [0,∞]>\n  <flex-basis> = content | <'width'>\n  <width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { - "<'flex-grow'>": "Defines the flex-grow of the flex item. Negative values are considered invalid. Defaults to 1 when omitted. (initial is 0)", - "<'flex-shrink'>": "Defines the flex-shrink of the flex item. Negative values are considered invalid. Defaults to 1 when omitted. (initial is 1)", - "<'flex-basis'>": "Defines the flex-basis of the flex item. Defaults to 0% when omitted. The initial value is auto.", + "<'flex-grow'>": "Defines the flex-grow of the flex item. Negative values are considered invalid. Defaults to 1 when omitted. (initial is 0)", + "<'flex-shrink'>": "Defines the flex-shrink of the flex item. Negative values are considered invalid. Defaults to 1 when omitted. (initial is 1)", + "<'flex-basis'>": "Defines the flex-basis of the flex item. Defaults to 0% when omitted. The initial value is auto.", "none": "The item is sized according to its width and height properties. It is fully inflexible: it neither shrinks nor grows in relation to the flex container. This is equivalent to setting flex: 0 0 auto." } }, "flex-basis": { - "url": "$MDN_URL$/web/css/flex-basis", + "url": "$MDN_URL$/web/css/reference/properties/flex-basis", "status": [ "StandardTrack" ], @@ -11435,15 +11559,15 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The flex-basis CSS property sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing.\n
    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-basis on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", + "doc": "The flex-basis CSS property sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing.\n
    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-basis on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", "formalSyntax": "content | <'width'>\n  <width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "content": "Indicates automatic sizing, based on the flex item's content.", - "<'width'>": "Any of the following units:\n" + "<'width'>": "Any of the following units:\n" } }, "flex-direction": { - "url": "$MDN_URL$/web/css/flex-direction", + "url": "$MDN_URL$/web/css/reference/properties/flex-direction", "status": [ "StandardTrack" ], @@ -11472,7 +11596,7 @@ } }, "flex-flow": { - "url": "$MDN_URL$/web/css/flex-flow", + "url": "$MDN_URL$/web/css/reference/properties/flex-flow", "status": [ "StandardTrack" ], @@ -11491,11 +11615,11 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The flex-flow CSS shorthand property specifies the direction of a flex container, as well as its wrapping behavior.", + "doc": "The flex-flow CSS shorthand property specifies the direction of a flex container, as well as its wrapping behavior.", "formalSyntax": "<'flex-direction'> || <'flex-wrap'>\n  <flex-direction> = row | row-reverse | column | column-reverse\n  <flex-wrap> = nowrap | wrap | wrap-reverse" }, "flex-grow": { - "url": "$MDN_URL$/web/css/flex-grow", + "url": "$MDN_URL$/web/css/reference/properties/flex-grow", "status": [ "StandardTrack" ], @@ -11514,14 +11638,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The flex-grow CSS property sets the flex grow factor, which specifies how much of the flex container's positive free space, if any, should be assigned to the flex item's main size.\n

    When the flex-container's main size is larger than the combined main sizes of its flex items, this positive free space can be distributed among the flex items, with each item's growth being their growth factor value as a proportion of the sum total of all the flex items' flex grow factors.\n

    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-grow on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", + "doc": "The flex-grow CSS property sets the flex grow factor, which specifies how much of the flex container's positive free space, if any, should be assigned to the flex item's main size.\n

    When the flex-container's main size is larger than the combined main sizes of its flex items, this positive free space can be distributed among the flex items, with each item's growth being their growth factor value as a proportion of the sum total of all the flex items' flex grow factors.\n

    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-grow on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", "formalSyntax": "<number [0,∞]>", "values": { - "<number>": "See <number>. Negative values are invalid. Defaults to 0, which prevents the flex item from growing." + "<number>": "See <number>. Negative values are invalid. Defaults to 0, which prevents the flex item from growing." } }, "flex-shrink": { - "url": "$MDN_URL$/web/css/flex-shrink", + "url": "$MDN_URL$/web/css/reference/properties/flex-shrink", "status": [ "StandardTrack" ], @@ -11540,14 +11664,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The flex-shrink CSS property sets the flex shrink factor of a flex item. If the size of all flex items is larger than the flex container, the flex items can shrink to fit according to their flex-shrink value. Each flex line's negative free space is distributed between the line's flex items that have a flex-shrink value greater than 0.\n
    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-basis on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", + "doc": "The flex-shrink CSS property sets the flex shrink factor of a flex item. If the size of all flex items is larger than the flex container, the flex items can shrink to fit according to their flex-shrink value. Each flex line's negative free space is distributed between the line's flex items that have a flex-shrink value greater than 0.\n
    \n

    Note:\nIt is recommended to use the flex shorthand with a keyword value like auto or initial instead of setting flex-shrink on its own. The keyword values expand to reliable combinations of flex-grow, flex-shrink, and flex-basis, which help to achieve the commonly desired flex behaviors.\n

    ", "formalSyntax": "<number [0,∞]>", "values": { - "<number>": "See <number>. Negative values are invalid. Defaults to 1." + "<number>": "See <number>. Negative values are invalid. Defaults to 1." } }, "flex-wrap": { - "url": "$MDN_URL$/web/css/flex-wrap", + "url": "$MDN_URL$/web/css/reference/properties/flex-wrap", "status": [ "StandardTrack" ], @@ -11569,13 +11693,13 @@ "doc": "The flex-wrap CSS property sets whether flex items are forced onto one line or can wrap onto multiple lines. If wrapping is allowed, it sets the direction that lines are stacked.", "formalSyntax": "nowrap | wrap | wrap-reverse", "values": { - "nowrap": "The flex items are laid out in a single line which may cause the flex container to overflow. The cross-start is the equivalent of inline-start or block-start, depending on the flex-direction value. This is the default value.", - "wrap": "The flex items break into multiple lines. The cross-start is the equivalent of inline-start or block-start, depending on the current writing mode, and the flex-direction value.", + "nowrap": "The flex items are laid out in a single line which may cause the flex container to overflow. The cross-start is the equivalent of inline-start or block-start, depending on the flex-direction value. This is the default value.", + "wrap": "The flex items break into multiple lines. The cross-start is the equivalent of inline-start or block-start, depending on the current writing mode, and the flex-direction value.", "wrap-reverse": "Behaves the same as wrap, but cross-start and cross-end are inverted." } }, "float": { - "url": "$MDN_URL$/web/css/float", + "url": "$MDN_URL$/web/css/reference/properties/float", "status": [ "StandardTrack" ], @@ -11594,7 +11718,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The float CSS property places an element on the left or right side of its container, allowing text and inline elements to wrap around it. The element is removed from the normal flow of the page, though still remaining a part of the flow (in contrast to absolute positioning).", + "doc": "The float CSS property places an element on the left or right side of its container, allowing text and inline elements to wrap around it. The element is removed from the normal flow of the page, though still remaining a part of the flow (in contrast to absolute positioning).", "formalSyntax": "block-start | block-end | inline-start | inline-end | snap-block | <snap-block()> | snap-inline | <snap-inline()> | left | right | top | bottom | none | footnote\n  <snap-block()> = snap-block( <length> , [ start | end | near ]? )\n  <snap-inline()> = snap-inline( <length> , [ left | right | near ]? )", "values": { "left": "The element must float on the left side of its containing block.", @@ -11605,7 +11729,7 @@ } }, "flood-color": { - "url": "$MDN_URL$/web/css/flood-color", + "url": "$MDN_URL$/web/css/reference/properties/flood-color", "status": [ "StandardTrack" ], @@ -11627,11 +11751,11 @@ "doc": "The flood-color CSS property defines the color of the current filter primitive subregion in <feFlood> and <feDropShadow> elements within a <filter>. If present, it overrides the element's flood-color attribute.\n
    \n

    Note:\nThe flood-color property only applies to <feFlood> and <feDropShadow> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "<color>", "values": { - "<color>": "The flood's color. This can be any valid CSS <color> value." + "<color>": "The flood's color. This can be any valid CSS <color> value." } }, "flood-opacity": { - "url": "$MDN_URL$/web/css/flood-opacity", + "url": "$MDN_URL$/web/css/reference/properties/flood-opacity", "status": [ "StandardTrack" ], @@ -11650,7 +11774,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The flood-opacity CSS property defines the opacity of the current filter primitive subregion in <feFlood> and <feDropShadow> elements within a <filter>. If present, it overrides the element's flood-opacity attribute.\n

    The property value impacts the flood-color's alpha channel; it can increase the transparency of a flood-color but can not make the color defined by the flood-color property more opaque.\n

    \n

    Note:\nThe flood-opacity property only applies to <feFlood> and <feDropShadow> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", + "doc": "The flood-opacity CSS property defines the opacity of the current filter primitive subregion in <feFlood> and <feDropShadow> elements within a <filter>. If present, it overrides the element's flood-opacity attribute.\n

    The property value impacts the flood-color's alpha channel; it can increase the transparency of a flood-color but can not make the color defined by the flood-color property more opaque.\n

    \n

    Note:\nThe flood-opacity property only applies to <feFlood> and <feDropShadow> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "<'opacity'>\n  <opacity> = <opacity-value>\n  <opacity-value> = <number> | <percentage>", "values": { "<number>": "A numeric value between 0 and 1, inclusive.", @@ -11658,7 +11782,7 @@ } }, "font": { - "url": "$MDN_URL$/web/css/font", + "url": "$MDN_URL$/web/css/reference/properties/font", "status": [ "StandardTrack" ], @@ -11677,16 +11801,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font CSS shorthand property sets all the different properties of an element's font. Alternatively, it sets an element's font to a system font.", - "formalSyntax": "[ [ <'font-style'> || <font-variant-css2> || <'font-weight'> || <font-width-css3> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'># ] | <system-family-name>\n  <font-style> = normal | italic | left | right | oblique <angle [-90deg,90deg]>?\n  <font-variant-css2> = normal | small-caps\n  <font-weight> = <font-weight-absolute> | bolder | lighter\n  <font-width-css3> = normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded\n  <font-size> = <absolute-size> | <relative-size> | <length-percentage [0,∞]> | math\n  <line-height> = normal | <number [0,∞]> | <length-percentage [0,∞]>\n  <font-family> = [ <family-name> | <generic-family> ]#\n  <system-family-name> = caption | icon | menu | message-box | small-caption | status-bar\n  <font-weight-absolute> = normal | bold | <number [1,1000]>\n  <length-percentage> = <length> | <percentage>\n  <family-name> = <string> | <custom-ident>+\n  <generic-family> = <generic-script-specific> | <generic-complete> | <generic-incomplete>\n  <generic-script-specific> = generic( fangsong ) | generic( kai ) | generic( khmer-mul ) | generic( nastaliq )\n  <generic-complete> = serif | sans-serif | system-ui | cursive | fantasy | math | monospace\n  <generic-incomplete> = ui-serif | ui-sans-serif | ui-monospace | ui-rounded", + "doc": "The font CSS shorthand property sets all the different properties of an element's font. Alternatively, it sets an element's font to a system font.", + "formalSyntax": "[ [ <'font-style'> || <font-variant-css2> || <'font-weight'> || <font-width-css3> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'># ] | <system-family-name>\n  <font-style> = normal | italic | left | right | oblique <angle [-90deg,90deg]>?\n  <font-variant-css2> = normal | small-caps\n  <font-weight> = <font-weight-absolute> | bolder | lighter\n  <font-width-css3> = normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded\n  <font-size> = <absolute-size> | <relative-size> | <length-percentage [0,∞]> | math\n  <line-height> = normal | <number [0,∞]> | <length-percentage [0,∞]>\n  <font-family> = [ <family-name> | <generic-family> ]#\n  <system-family-name> = caption | icon | menu | message-box | small-caption | status-bar\n  <font-weight-absolute> = normal | bold | <number [1,1000]>\n  <absolute-size> = xx-small | x-small | small | medium | large | x-large | xx-large | xxx-large\n  <relative-size> = larger | smaller\n  <length-percentage> = <length> | <percentage>\n  <family-name> = <string> | <custom-ident>+\n  <generic-family> = <generic-script-specific> | <generic-complete> | <generic-incomplete>\n  <generic-script-specific> = generic( fangsong ) | generic( kai ) | generic( khmer-mul ) | generic( nastaliq )\n  <generic-complete> = serif | sans-serif | system-ui | cursive | fantasy | math | monospace\n  <generic-incomplete> = ui-serif | ui-sans-serif | ui-monospace | ui-rounded", "values": { - "<'font-style'>": "See the font-style CSS property.", - "<'font-variant'>": "See the font-variant CSS property.", - "<'font-weight'>": "See the font-weight CSS property.", - "<'font-stretch'>": "See the font-stretch CSS property.", - "<'font-size'>": "See the font-size CSS property.", - "<'line-height'>": "See the line-height CSS property.", - "<'font-family'>": "See the font-family CSS property.", + "<'font-style'>": "See the font-style CSS property.", + "<'font-variant'>": "See the font-variant CSS property.", + "<'font-weight'>": "See the font-weight CSS property.", + "<'font-stretch'>": "See the font-stretch CSS property.", + "<'font-size'>": "See the font-size CSS property.", + "<'line-height'>": "See the line-height CSS property.", + "<'font-family'>": "See the font-family CSS property.", "caption": "The system font used for captioned controls (e.g., buttons, drop-downs, etc.).", "icon": "The system font used to label icons.", "menu": "The system font used in menus (e.g., dropdown menus and menu lists).", @@ -11697,7 +11821,7 @@ } }, "font-family": { - "url": "$MDN_URL$/web/css/font-family", + "url": "$MDN_URL$/web/css/reference/properties/font-family", "status": [ "StandardTrack" ], @@ -11719,12 +11843,12 @@ "doc": "The font-family CSS property specifies a prioritized list of one or more font family names and/or generic family names for the selected element.", "formalSyntax": "[ <family-name> | <generic-family> ]#\n  <family-name> = <string> | <custom-ident>+\n  <generic-family> = <generic-script-specific> | <generic-complete> | <generic-incomplete>\n  <generic-script-specific> = generic( fangsong ) | generic( kai ) | generic( khmer-mul ) | generic( nastaliq )\n  <generic-complete> = serif | sans-serif | system-ui | cursive | fantasy | math | monospace\n  <generic-incomplete> = ui-serif | ui-sans-serif | ui-monospace | ui-rounded", "values": { - "<family-name>": "The name of a font family. This must be either a single <string> value or a space-separated sequence of <custom-ident> values. String values must be quoted but may contain any Unicode character. Custom identifiers are not quoted, but certain characters must be escaped.\n

    It is good practice to quote font family names that contain white space, digits, or punctuation characters other than hyphens.\n

    See also Valid family names.", - "<generic-name>": "Generic font families are a fallback mechanism, a means of preserving some of the style sheet author's intent when none of the specified fonts are available. Generic family names are keywords and must not be quoted. A generic font family should be the last item in the list of font family names. The following keywords are defined:\n

    \n
    serif
    \n
    \n

    Glyphs have finishing strokes, flared or tapering ends, or have actual serifed endings.\n

    For example: Lucida Bright, Lucida Fax, Palatino, Palatino Linotype, Palladio, URW Palladio, serif.\n

    \n
    sans-serif
    \n
    \n

    Glyphs have stroke endings that are plain.\n

    For example: Open Sans, Fira Sans, Lucida Sans, Lucida Sans Unicode, Trebuchet MS, Liberation Sans, Nimbus Sans L, sans-serif.\n

    \n
    monospace
    \n
    \n

    All glyphs have the same fixed width.\n

    For example: Fira Mono, DejaVu Sans Mono, Menlo, Consolas, Liberation Mono, Monaco, Lucida Console, monospace.\n

    \n
    cursive
    \n
    \n

    Glyphs in cursive fonts generally have either joining strokes or other cursive characteristics beyond those of italic typefaces. The glyphs are partially or completely connected, and the result looks more like handwritten pen or brush writing than printed letter work.\n

    For example: Brush Script MT, Brush Script Std, Lucida Calligraphy, Lucida Handwriting, Apple Chancery, cursive.\n

    \n
    fantasy
    \n
    \n

    Fantasy fonts are primarily decorative fonts that contain playful representations of characters.\n

    For example: Papyrus, Herculanum, Party LET, Curlz MT, Harrington, fantasy.\n

    \n
    system-ui
    \n
    \n

    Glyphs are taken from the default user interface font on a given platform. Because typographic traditions vary widely across the world, this generic is provided for typefaces that don't map cleanly into the other generics.\n

    \n

    Note:\nAs the name implies, system-ui is intended to make UI elements look like native apps, and not for typesetting large paragraphs of text. It may cause the displayed typeface to be undesirable for some users—for example, the default Windows CJK font may render Latin scripts poorly, and the lang attribute may not affect the displayed font. Some operating systems do not allow customizing system-ui, while browsers generally allow customizing the sans-serif font family. For large paragraphs, use sans-serif or some other non-UI font family instead.\n

    \n
    \n
    ui-serif
    \n
    \n

    The default user interface serif font.\n

    \n
    ui-sans-serif
    \n
    \n

    The default user interface sans-serif font.\n

    \n
    ui-monospace
    \n
    \n

    The default user interface monospace font.\n

    \n
    ui-rounded
    \n
    \n

    The default user interface font that has rounded features.\n

    \n
    math
    \n
    \n

    This is for the particular stylistic concerns of representing mathematics: superscript and subscript, brackets that cross several lines, nesting expressions, and double struck glyphs with distinct meanings.\n

    \n
    fangsong
    \n
    \n

    A particular style of Chinese characters that are between serif-style Song and cursive-style Kai forms. This style is often used for government documents.\n

    \n
    " + "<family-name>": "The name of a font family. This must be either a single <string> value or a space-separated sequence of <custom-ident> values. String values must be quoted but may contain any Unicode character. Custom identifiers are not quoted, but certain characters must be escaped.\n

    It is good practice to quote font family names that contain white space, digits, or punctuation characters other than hyphens.\n

    See also Valid family names.", + "<generic-name>": "Generic font families are a fallback mechanism, a means of preserving some of the style sheet author's intent when none of the specified fonts are available. Generic family names are keywords and must not be quoted. A generic font family should be the last item in the list of font family names. The following keywords are defined:\n

    \n
    serif
    \n
    \n

    Glyphs have finishing strokes, flared or tapering ends, or have actual serifed endings.\n

    For example: Lucida Bright, Lucida Fax, Palatino, Palatino Linotype, Palladio, URW Palladio, serif.\n

    \n
    sans-serif
    \n
    \n

    Glyphs have stroke endings that are plain.\n

    For example: Open Sans, Fira Sans, Lucida Sans, Lucida Sans Unicode, Trebuchet MS, Liberation Sans, Nimbus Sans L, sans-serif.\n

    \n
    monospace
    \n
    \n

    All glyphs have the same fixed width.\n

    For example: Fira Mono, DejaVu Sans Mono, Menlo, Consolas, Liberation Mono, Monaco, Lucida Console, monospace.\n

    \n
    cursive
    \n
    \n

    Glyphs in cursive fonts generally have either joining strokes or other cursive characteristics beyond those of italic typefaces. The glyphs are partially or completely connected, and the result looks more like handwritten pen or brush writing than printed letter work.\n

    For example: Brush Script MT, Brush Script Std, Lucida Calligraphy, Lucida Handwriting, Apple Chancery, cursive.\n

    \n
    fantasy
    \n
    \n

    Fantasy fonts are primarily decorative fonts that contain playful representations of characters.\n

    For example: Papyrus, Herculanum, Party LET, Curlz MT, Harrington, fantasy.\n

    \n
    system-ui
    \n
    \n

    Glyphs are taken from the default user interface font on a given platform. Because typographic traditions vary widely across the world, this generic is provided for typefaces that don't map cleanly into the other generics.\n

    \n

    Note:\nAs the name implies, system-ui is intended to make UI elements look like native apps, and not for typesetting large paragraphs of text. It may cause the displayed typeface to be undesirable for some users—for example, the default Windows CJK font may render Latin scripts poorly, and the lang attribute may not affect the displayed font. Some operating systems do not allow customizing system-ui, while browsers generally allow customizing the sans-serif font family. For large paragraphs, use sans-serif or some other non-UI font family instead.\n

    \n
    \n
    ui-serif
    \n
    \n

    The default user interface serif font.\n

    \n
    ui-sans-serif
    \n
    \n

    The default user interface sans-serif font.\n

    \n
    ui-monospace
    \n
    \n

    The default user interface monospace font.\n

    \n
    ui-rounded
    \n
    \n

    The default user interface font that has rounded features.\n

    \n
    math
    \n
    \n

    This is for the particular stylistic concerns of representing mathematics: superscript and subscript, brackets that cross several lines, nesting expressions, and double struck glyphs with distinct meanings.\nUA stylesheets may set math { font-family: math } so that the <math> element uses appropriate fonts by default.\n

    \n
    fangsong
    \n
    \n

    A particular style of Chinese characters that are between serif-style Song and cursive-style Kai forms. This style is often used for government documents.\n

    \n
    " } }, "font-feature-settings": { - "url": "$MDN_URL$/web/css/font-feature-settings", + "url": "$MDN_URL$/web/css/reference/properties/font-feature-settings", "status": [ "StandardTrack" ], @@ -11744,14 +11868,14 @@ "highDate": "2019-10-05" }, "doc": "The font-feature-settings CSS property controls advanced typographic features in OpenType fonts.", - "formalSyntax": "normal | <feature-tag-value>#\n  <feature-tag-value> = <opentype-tag> [ <integer [0,∞]> | on | off ]?\n  <opentype-tag> = <string>", + "formalSyntax": "normal | <feature-tag-value>#\n  <feature-tag-value> = <opentype-tag> [ <integer [0,∞]> | on | off ]?\n  <opentype-tag> = <string>\n  <integer> = <number-token>", "values": { "normal": "Indicates that text is laid out using default font settings. This is the default value.", - "<feature-tag-value>": "Represents a space-separated tuple consisting of a tag name and an optional value.\n

    The tag name is always a <string> of four ASCII characters. If the tag name has more or fewer characters or if it contains characters outside the U+20 – U+7E code point range, the descriptor is invalid.\n

    The optional value can be a positive integer or the keyword on or off. The keywords on and off are synonyms for the values 1 and 0, respectively. If no value is set, the default is 1. For non-boolean OpenType features (e.g., stylistic alternates), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off." + "<feature-tag-value>": "Represents a space-separated tuple consisting of a tag name and an optional value.\n

    The tag name is always a <string> of four ASCII characters. If the tag name has more or fewer characters or if it contains characters outside the U+20 – U+7E code point range, the descriptor is invalid.\n

    The optional value can be a positive integer or the keyword on or off. The keywords on and off are synonyms for the values 1 and 0, respectively. If no value is set, the default is 1. For non-boolean OpenType features (e.g., stylistic alternates), the value implies a particular glyph to be selected; for boolean features, the value turns the feature on or off." } }, "font-kerning": { - "url": "$MDN_URL$/web/css/font-kerning", + "url": "$MDN_URL$/web/css/reference/properties/font-kerning", "status": [ "StandardTrack" ], @@ -11779,11 +11903,14 @@ } }, "font-language-override": { - "url": "$MDN_URL$/web/css/font-language-override", + "url": "$MDN_URL$/web/css/reference/properties/font-language-override", "status": [ "StandardTrack" ], "compatibility": { + "Chrome": "143", + "ChromeAndroid": "143", + "Edge": "143", "Firefox": "34", "FirefoxAndroid": "34" }, @@ -11798,7 +11925,7 @@ } }, "font-optical-sizing": { - "url": "$MDN_URL$/web/css/font-optical-sizing", + "url": "$MDN_URL$/web/css/reference/properties/font-optical-sizing", "status": [ "StandardTrack" ], @@ -11825,7 +11952,7 @@ } }, "font-palette": { - "url": "$MDN_URL$/web/css/font-palette", + "url": "$MDN_URL$/web/css/reference/properties/font-palette", "status": [ "StandardTrack" ], @@ -11844,18 +11971,18 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The font-palette CSS property allows specifying one of the many palettes contained in a color font that a user agent may use for the font. Users can also override the values in a palette or create a new palette by using the @font-palette-values at-rule.\n

    \n

    Note:\nA font-palette palette takes precedence when coloring a font. The color property will not override a font palette, even if specified with !important.\n

    ", - "formalSyntax": "normal | light | dark | <palette-identifier> | <palette-mix()>\n  <palette-mix()> = palette-mix( <color-interpolation-method> , [ [ normal | light | dark | <palette-identifier> | <palette-mix()> ] && <percentage [0,100]>? ]#{2} )\n  <color-interpolation-method> = in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <xyz-space> = xyz | xyz-d50 | xyz-d65", + "doc": "The font-palette CSS property allows specifying one of the many palettes contained in a color font that a user agent may use for the font. Users can also override the values in a palette or create a new palette by using the @font-palette-values at-rule.\n
    \n

    Note:\nA font-palette palette takes precedence when coloring a font. The color property will not override a font palette, even if specified with !important.\n

    ", + "formalSyntax": "normal | light | dark | <palette-identifier> | <palette-mix()>\n  <palette-identifier> = <dashed-ident>\n  <palette-mix()> = palette-mix( <color-interpolation-method> , [ [ normal | light | dark | <palette-identifier> | <palette-mix()> ] && <percentage [0,100]>? ]#{2} )\n  <color-interpolation-method> = in [ <rectangular-color-space> | <polar-color-space> <hue-interpolation-method>? ]\n  <rectangular-color-space> = srgb | srgb-linear | display-p3 | display-p3-linear | a98-rgb | prophoto-rgb | rec2020 | lab | oklab | <xyz-space>\n  <polar-color-space> = hsl | hwb | lch | oklch\n  <hue-interpolation-method> = [ shorter | longer | increasing | decreasing ] hue\n  <xyz-space> = xyz | xyz-d50 | xyz-d65", "values": { "normal": "Specifies the default color palette or the default glyph colorization (set by the font maker) to be used for the font. With this setting, the palette in the font at index 0 is rendered.", "light": "Specifies the first palette in the font that matches 'light' to be used for the font. Some fonts contain metadata that identify a palette as applicable for a light (close to white) background. If a font does not have this metadata, the light value behaves as normal.", "dark": "Specifies the first palette in the font that matches 'dark' to be used for the font. Some fonts contain metadata that identify a palette as applicable for a dark (close to black) background. If a font does not have this metadata, the value behaves as normal.", - "<palette-identifier>": "Allows you to specify your own values for the font palette by using the @font-palette-values at-rule. This value is specified using the <dashed-ident> format.", + "<palette-identifier>": "Allows you to specify your own values for the font palette by using the @font-palette-values at-rule. This value is specified using the <dashed-ident> format.", "palette-mix()": "Creates a new font-palette value by blending together two font-palette values by specified percentages and color interpolation methods." } }, "font-size": { - "url": "$MDN_URL$/web/css/font-size", + "url": "$MDN_URL$/web/css/reference/properties/font-size", "status": [ "StandardTrack" ], @@ -11874,18 +12001,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-size CSS property sets the size of the font. Changing the font size also updates the sizes of the font size-relative <length> units, such as em, ex, and so forth.", - "formalSyntax": "<absolute-size> | <relative-size> | <length-percentage [0,∞]> | math\n  <length-percentage> = <length> | <percentage>", + "doc": "The font-size CSS property sets the size of the font. Changing the font size also updates the sizes of the font size-relative <length> units, such as em, ex, and so forth.", + "formalSyntax": "<absolute-size> | <relative-size> | <length-percentage [0,∞]> | math\n  <absolute-size> = xx-small | x-small | small | medium | large | x-large | xx-large | xxx-large\n  <relative-size> = larger | smaller\n  <length-percentage> = <length> | <percentage>", "values": { - "xx-small
    \nx-small
    \nsmall
    \nmedium
    \nlarge
    \nx-large
    \nxx-large
    \nxxx-large": "Absolute-size keywords, based on the user's default font size (which is medium).", - "larger, smaller": "Relative-size keywords. The font will be larger or smaller relative to the parent element's font size, roughly by the ratio used to separate the absolute-size keywords above.", - "<length>": "A positive <length> value. For most font-relative units (such as em and ex), the font size is relative to the parent element's font size.\n

    For font-relative units that are root-based (such as rem), the font size is relative to the size of the font used by the <html> (root) element.", - "<percentage>": "A positive <percentage> value, relative to the parent element's font size.\n

    \n

    Note:\nTo maximize accessibility, it is generally best to use values that are relative to the user's default font size.\n

    ", - "math": "Scaling rules are applied when determining the computed value of the font-size property for math elements relative to the font-size of the containing parent.\nSee the math-depth property for more information." + "xx-small
    \nx-small
    \nsmall
    \nmedium
    \nlarge
    \nx-large
    \nxx-large
    \nxxx-large": "Absolute-size keywords, based on the user's default font size (which is medium).", + "larger, smaller": "Relative-size keywords. The font will be larger or smaller relative to the parent element's font size, roughly by the ratio used to separate the absolute-size keywords above.", + "<length>": "A positive <length> value. For most font-relative units (such as em and ex), the font size is relative to the parent element's font size.\n

    For font-relative units that are root-based (such as rem), the font size is relative to the size of the font used by the <html> (root) element.", + "<percentage>": "A positive <percentage> value, relative to the parent element's font size.\n

    \n

    Note:\nTo maximize accessibility, it is generally best to use values that are relative to the user's default font size.\n

    ", + "math": "Scaling rules are applied when determining the computed value of the font-size property for math elements relative to the font-size of the containing parent.\nSee the math-depth property for more information." } }, "font-size-adjust": { - "url": "$MDN_URL$/web/css/font-size-adjust", + "url": "$MDN_URL$/web/css/reference/properties/font-size-adjust", "status": [ "StandardTrack" ], @@ -11903,7 +12030,7 @@ "level": "LOW", "lowDate": "2024-07-25" }, - "doc": "The font-size-adjust CSS property provides a way to modify the size of lowercase letters relative to the size of uppercase letters, which defines the overall font-size. This property is useful for situations where font fallback can occur.\n

    Legibility can become an issue when the first-choice font-family is unavailable and its replacement fallback font has a significantly different aspect value (height of lowercase letters divided by font size). Legibility of fonts, especially at small font sizes, is determined more by the size of lowercase letters than by the size of uppercase letters. The font-size-adjust property is useful for adjusting the font size of fallback fonts to keep the aspect value across fonts consistent, ensuring that the text appears similar regardless of the font used.", + "doc": "The font-size-adjust CSS property provides a way to modify the size of lowercase letters relative to the size of uppercase letters, which defines the overall font-size. This property is useful for situations where font fallback can occur.\n

    Legibility can become an issue when the first-choice font-family is unavailable and its replacement fallback font has a significantly different aspect value (height of lowercase letters divided by font size). Legibility of fonts, especially at small font sizes, is determined more by the size of lowercase letters than by the size of uppercase letters. The font-size-adjust property is useful for adjusting the font size of fallback fonts to keep the aspect value across fonts consistent, ensuring that the text appears similar regardless of the font used.", "formalSyntax": "none | <number [0,∞]>", "values": { "none": "No adjustment is applied to the font-size value for the fallback font.", @@ -11913,38 +12040,42 @@ } }, "font-smooth": { - "url": "$MDN_URL$/web/css/font-smooth", + "url": "$MDN_URL$/web/css/reference/properties/font-smooth", "compatibility": {}, "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The font-smooth CSS property controls the application of anti-aliasing when fonts are rendered.", - "formalSyntax": "auto | never | always | <absolute-size> | <length>" + "formalSyntax": "auto | never | always | <absolute-size> | <length>\n  <absolute-size> = xx-small | x-small | small | medium | large | x-large | xx-large | xxx-large" }, "font-stretch": { - "url": "$MDN_URL$/web/css/font-stretch", + "url": "$MDN_URL$/web/css/reference/properties/font-stretch", "status": [ - "StandardTrack", - "Deprecated" + "StandardTrack" ], "compatibility": { "Chrome": "60", "ChromeAndroid": "60", - "Edge": "", + "Edge": "12", "Firefox": "9", "FirefoxAndroid": "9", "Opera": "47", "Safari": "11", "SafariIOS": "11" }, - "doc": "

    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.

    \n
    \n

    Note:\nThe font-stretch property has now been renamed to font-width in the specifications. The name font-stretch has been kept as an alias for the font-width property.\nThe new name font-width is not yet supported by any browsers.\n

    \n

    The font-stretch CSS property selects a normal, condensed, or expanded face from a font.", + "baseline": { + "level": "HIGH", + "lowDate": "2017-09-19", + "highDate": "2020-03-19" + }, + "doc": "

    \n

    Note:\nThe font-stretch property was renamed to font-width in the CSS Fonts specification. To preserve compatibility, the specification retains font-stretch as an alias for the font-width property.\n

    \n

    The font-stretch CSS property selects a normal, condensed, or expanded face from a font.", "formalSyntax": "normal | <percentage [0,∞]> | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded", "values": { "normal": "Specifies a normal font face.", "semi-condensed
    \ncondensed
    \nextra-condensed
    \nultra-condensed": "Specifies a more condensed font face than normal, with ultra-condensed as the most condensed.", "semi-expanded
    \nexpanded
    \nextra-expanded
    \nultra-expanded": "Specifies a more expanded font face than normal, with ultra-expanded as the most expanded.", - "<percentage>": "A <percentage> value between 50% and 200% (inclusive). Negative values are not allowed for this property." + "<percentage>": "A <percentage> value between 50% and 200% (inclusive). Negative values are not allowed for this property." } }, "font-style": { - "url": "$MDN_URL$/web/css/font-style", + "url": "$MDN_URL$/web/css/reference/properties/font-style", "status": [ "StandardTrack" ], @@ -11963,17 +12094,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-style CSS property sets whether a font should be styled with a normal, italic, or oblique face from its font-family.", + "doc": "The font-style CSS property sets whether a font should be styled with a normal, italic, or oblique face from its font-family.", "formalSyntax": "normal | italic | left | right | oblique <angle [-90deg,90deg]>?", "values": { - "normal": "Selects a font that is classified as normal within a font-family.", + "normal": "Selects a font that is classified as normal within a font-family.", "italic": "Selects a font that is classified as italic. If no italic version of the face is available, one classified as oblique is used instead. If neither is available, the style is artificially simulated.", "oblique": "Selects a font that is classified as oblique. If no oblique version of the face is available, one classified as italic is used instead. If neither is available, the style is artificially simulated.", "oblique <angle>": "Selects a font classified as oblique, and additionally specifies an angle for the slant of the text. If one or more oblique faces are available in the chosen font family, the one that most closely matches the specified angle is chosen. If no oblique faces are available, the browser will synthesize an oblique version of the font by slanting a normal face by the specified amount. Valid values are degree values of -90deg to 90deg inclusive. If an angle is not specified, an angle of 14 degrees is used. Positive values are slanted to the end of the line, while negative values are slanted towards the beginning.\n

    In general, for a requested angle of 14 degrees or greater, larger angles are preferred; otherwise, smaller angles are preferred (see the spec's font matching section for the precise algorithm)." } }, "font-synthesis": { - "url": "$MDN_URL$/web/css/font-synthesis", + "url": "$MDN_URL$/web/css/reference/properties/font-synthesis", "status": [ "StandardTrack" ], @@ -11992,18 +12123,18 @@ "lowDate": "2022-01-06", "highDate": "2024-07-06" }, - "doc": "The font-synthesis shorthand CSS property lets you specify whether or not the browser may synthesize the bold, italic, small-caps, and/or subscript and superscript typefaces when they are missing in the specified font-family.", + "doc": "The font-synthesis shorthand CSS property lets you specify whether or not the browser may synthesize the bold, italic, small-caps, and/or subscript and superscript typefaces when they are missing in the specified font-family.", "formalSyntax": "none | [ weight || style || small-caps || position ]", "values": { "none": "Indicates that no bold, italic, or small-caps typeface may be synthesized by the browser.", "weight": "Indicates that the missing bold typeface may be synthesized by the browser if needed.", "style": "Indicates that the italic typeface may be synthesized by the browser if needed.", "small-caps": "Indicates that the small-caps typeface may be synthesized by the browser if needed.", - "position": "Indicates that the subscript and superscript typeface may be synthesized by the browser, if needed, when using font-variant-position." + "position": "Indicates that the subscript and superscript typeface may be synthesized by the browser, if needed, when using font-variant-position." } }, "font-synthesis-position": { - "url": "$MDN_URL$/web/css/font-synthesis-position", + "url": "$MDN_URL$/web/css/reference/properties/font-synthesis-position", "status": [ "Experimental", "StandardTrack" @@ -12015,7 +12146,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The font-synthesis-position CSS property lets you specify whether or not a browser may synthesize the subscript and superscript \"position\" typefaces when they are missing in a font family, while using font-variant-position to set the positions.\n

    The font-synthesis-position property has no effect when using the <sup> and <sub> elements.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", + "doc": "

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

    \n

    The font-synthesis-position CSS property lets you specify whether or not a browser may synthesize the subscript and superscript \"position\" typefaces when they are missing in a font family, while using font-variant-position to set the positions.\n

    The font-synthesis-position property has no effect when using the <sup> and <sub> elements.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", "formalSyntax": "auto | none", "values": { "auto": "Indicates that a missing position typeface may be synthesized by the browser if needed.", @@ -12023,7 +12154,7 @@ } }, "font-synthesis-small-caps": { - "url": "$MDN_URL$/web/css/font-synthesis-small-caps", + "url": "$MDN_URL$/web/css/reference/properties/font-synthesis-small-caps", "status": [ "StandardTrack" ], @@ -12042,7 +12173,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The font-synthesis-small-caps CSS property lets you specify whether or not the browser may synthesize small-caps typeface when it is missing in a font family. Small-caps glyphs typically use the form of uppercase letters but are reduced to the size of lowercase letters.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", + "doc": "The font-synthesis-small-caps CSS property lets you specify whether or not the browser may synthesize small-caps typeface when it is missing in a font family. Small-caps glyphs typically use the form of uppercase letters but are reduced to the size of lowercase letters.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", "formalSyntax": "auto | none", "values": { "auto": "Indicates that the missing small-caps typeface may be synthesized by the browser if needed.", @@ -12050,7 +12181,7 @@ } }, "font-synthesis-style": { - "url": "$MDN_URL$/web/css/font-synthesis-style", + "url": "$MDN_URL$/web/css/reference/properties/font-synthesis-style", "status": [ "StandardTrack" ], @@ -12069,7 +12200,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The font-synthesis-style CSS property lets you specify whether or not the browser may synthesize the oblique typeface when it is missing in a font family.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", + "doc": "The font-synthesis-style CSS property lets you specify whether or not the browser may synthesize the oblique typeface when it is missing in a font family.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", "formalSyntax": "auto | none | oblique-only", "values": { "auto": "Indicates that the missing oblique typeface may be synthesized by the browser if needed.", @@ -12078,7 +12209,7 @@ } }, "font-synthesis-weight": { - "url": "$MDN_URL$/web/css/font-synthesis-weight", + "url": "$MDN_URL$/web/css/reference/properties/font-synthesis-weight", "status": [ "StandardTrack" ], @@ -12097,7 +12228,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The font-synthesis-weight CSS property lets you specify whether or not the browser may synthesize the bold typeface when it is missing in a font family.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", + "doc": "The font-synthesis-weight CSS property lets you specify whether or not the browser may synthesize the bold typeface when it is missing in a font family.\n

    It is often convenient to use the shorthand property font-synthesis to control all typeface synthesis values.", "formalSyntax": "auto | none", "values": { "auto": "Indicates that the missing bold typeface may be synthesized by the browser if needed.", @@ -12105,7 +12236,7 @@ } }, "font-variant": { - "url": "$MDN_URL$/web/css/font-variant", + "url": "$MDN_URL$/web/css/reference/properties/font-variant", "status": [ "StandardTrack" ], @@ -12124,22 +12255,22 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-variant CSS shorthand property allows you to set all the font variants for a font.\n

    You can also set the <font-variant-css2> values of font-variant defined in CSS Level 2.1, (that is, normal or small-caps), by using the font shorthand.", + "doc": "The font-variant CSS shorthand property allows you to set all the font variants for a font.\n

    You can also set the <font-variant-css2> values of font-variant defined in CSS Level 2.1, (that is, normal or small-caps), by using the font shorthand.", "formalSyntax": "normal | none | [ [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <contextual-alt-values> ] || [ small-caps | all-small-caps | petite-caps | all-petite-caps | unicase | titling-caps ] || [ stylistic( <feature-value-name> ) || historical-forms || styleset( <feature-value-name># ) || character-variant( <feature-value-name># ) || swash( <feature-value-name> ) || ornaments( <feature-value-name> ) || annotation( <feature-value-name> ) ] || [ <numeric-figure-values> || <numeric-spacing-values> || <numeric-fraction-values> || ordinal || slashed-zero ] || [ <east-asian-variant-values> || <east-asian-width-values> || ruby ] || [ sub | super ] || [ text | emoji | unicode ] ]\n  <common-lig-values> = common-ligatures | no-common-ligatures\n  <discretionary-lig-values> = discretionary-ligatures | no-discretionary-ligatures\n  <historical-lig-values> = historical-ligatures | no-historical-ligatures\n  <contextual-alt-values> = contextual | no-contextual\n  <feature-value-name> = <ident>\n  <numeric-figure-values> = lining-nums | oldstyle-nums\n  <numeric-spacing-values> = proportional-nums | tabular-nums\n  <numeric-fraction-values> = diagonal-fractions | stacked-fractions\n  <east-asian-variant-values> = jis78 | jis83 | jis90 | jis04 | simplified | traditional\n  <east-asian-width-values> = full-width | proportional-width", "values": { "normal": "Specifies a normal font face. Each longhand property has an initial value of normal.", - "none": "Sets the value of the font-variant-ligatures as none and the values of the other longhand properties as normal, their initial value.", - "<common-lig-values>
    \n<discretionary-lig-values>
    \n<historical-lig-values>
    \n<contextual-alt-values>": "Specifies the keywords related to the font-variant-ligatures longhand property. The possible values are common-ligatures, no-common-ligatures, discretionary-ligatures, no-discretionary-ligatures, historical-ligatures, no-historical-ligatures, contextual, and no-contextual.", - "stylistic(), historical-forms, styleset(), character-variant(), swash(), ornaments(), annotation()": "Specifies the keywords and functions related to the font-variant-ligatures longhand property.", - "small-caps
    \nall-small-caps
    \npetite-caps
    \nall-petite-caps
    \nunicase
    \ntitling-caps": "Specifies the keywords and functions related to the font-variant-caps longhand property. The small-caps value is the only non-normal font variant valid within the font shorthand property.", - "<numeric-figure-values>
    \n<numeric-spacing-values>
    \n<numeric-fraction-values>
    \nordinal
    \nslashed-zero": "Specifies the keywords related to the font-variant-numeric longhand property. The possible values are lining-nums, oldstyle-nums, proportional-nums, tabular-nums, diagonal-fractions, stacked-fractions, ordinal, and slashed-zero.", - "<east-asian-variant-values>
    \n<east-asian-width-values>
    \nruby": "Specifies the keywords related to the font-variant-east-asian longhand property. The possible values are jis78, jis83, jis90, jis04, simplified, traditional, full-width, proportional-width, and ruby.", - "sub, super": "Specifies the keywords and functions related to the font-variant-position longhand property.", - "text, emoji, unicode": "Specifies the keywords and functions related to the font-variant-emoji longhand property." + "none": "Sets the value of the font-variant-ligatures as none and the values of the other longhand properties as normal, their initial value.", + "<common-lig-values>
    \n<discretionary-lig-values>
    \n<historical-lig-values>
    \n<contextual-alt-values>": "Specifies the keywords related to the font-variant-ligatures longhand property. The possible values are common-ligatures, no-common-ligatures, discretionary-ligatures, no-discretionary-ligatures, historical-ligatures, no-historical-ligatures, contextual, and no-contextual.", + "stylistic(), historical-forms, styleset(), character-variant(), swash(), ornaments(), annotation()": "Specifies the keywords and functions related to the font-variant-ligatures longhand property.", + "small-caps
    \nall-small-caps
    \npetite-caps
    \nall-petite-caps
    \nunicase
    \ntitling-caps": "Specifies the keywords and functions related to the font-variant-caps longhand property. The small-caps value is the only non-normal font variant valid within the font shorthand property.", + "<numeric-figure-values>
    \n<numeric-spacing-values>
    \n<numeric-fraction-values>
    \nordinal
    \nslashed-zero": "Specifies the keywords related to the font-variant-numeric longhand property. The possible values are lining-nums, oldstyle-nums, proportional-nums, tabular-nums, diagonal-fractions, stacked-fractions, ordinal, and slashed-zero.", + "<east-asian-variant-values>
    \n<east-asian-width-values>
    \nruby": "Specifies the keywords related to the font-variant-east-asian longhand property. The possible values are jis78, jis83, jis90, jis04, simplified, traditional, full-width, proportional-width, and ruby.", + "sub, super": "Specifies the keywords and functions related to the font-variant-position longhand property.", + "text, emoji, unicode": "Specifies the keywords and functions related to the font-variant-emoji longhand property." } }, "font-variant-alternates": { - "url": "$MDN_URL$/web/css/font-variant-alternates", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-alternates", "status": [ "StandardTrack" ], @@ -12158,7 +12289,7 @@ "lowDate": "2023-03-13", "highDate": "2025-09-13" }, - "doc": "The font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values.\n

    The @font-feature-values at-rule can be used to associate, for a given font face, a human-readable name with a numeric index that controls a particular OpenType font feature. For features that select alternative glyphs (stylistic, styleset, character-variant, swash, ornament or annotation), the font-variant-alternates property can then reference the human-readable name in order to apply the associated feature.\n

    This allows CSS rules to enable alternative glyphs without needing to know the specific index values that a particular font uses to control them.", + "doc": "The font-variant-alternates CSS property controls the usage of alternate glyphs. These alternate glyphs may be referenced by alternative names defined in @font-feature-values.\n

    The @font-feature-values at-rule can be used to associate, for a given font face, a human-readable name with a numeric index that controls a particular OpenType font feature. For features that select alternative glyphs (stylistic, styleset, character-variant, swash, ornament or annotation), the font-variant-alternates property can then reference the human-readable name in order to apply the associated feature.\n

    This allows CSS rules to enable alternative glyphs without needing to know the specific index values that a particular font uses to control them.", "formalSyntax": "normal | [ stylistic( <feature-value-name> ) || historical-forms || styleset( <feature-value-name># ) || character-variant( <feature-value-name># ) || swash( <feature-value-name> ) || ornaments( <feature-value-name> ) || annotation( <feature-value-name> ) ]\n  <feature-value-name> = <ident>", "values": { "normal": "This keyword deactivates alternate glyphs.", @@ -12172,7 +12303,7 @@ } }, "font-variant-caps": { - "url": "$MDN_URL$/web/css/font-variant-caps", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-caps", "status": [ "StandardTrack" ], @@ -12204,7 +12335,7 @@ } }, "font-variant-east-asian": { - "url": "$MDN_URL$/web/css/font-variant-east-asian", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-east-asian", "status": [ "StandardTrack" ], @@ -12233,7 +12364,7 @@ } }, "font-variant-emoji": { - "url": "$MDN_URL$/web/css/font-variant-emoji", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-emoji", "status": [ "StandardTrack" ], @@ -12258,7 +12389,7 @@ } }, "font-variant-ligatures": { - "url": "$MDN_URL$/web/css/font-variant-ligatures", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-ligatures", "status": [ "StandardTrack" ], @@ -12289,7 +12420,7 @@ } }, "font-variant-numeric": { - "url": "$MDN_URL$/web/css/font-variant-numeric", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-numeric", "status": [ "StandardTrack" ], @@ -12320,13 +12451,17 @@ } }, "font-variant-position": { - "url": "$MDN_URL$/web/css/font-variant-position", + "url": "$MDN_URL$/web/css/reference/properties/font-variant-position", "status": [ "StandardTrack" ], "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", "Firefox": "34", "FirefoxAndroid": "34", + "Opera": "103", "Safari": "9.1", "SafariIOS": "9.3" }, @@ -12342,7 +12477,7 @@ } }, "font-variation-settings": { - "url": "$MDN_URL$/web/css/font-variation-settings", + "url": "$MDN_URL$/web/css/reference/properties/font-variation-settings", "status": [ "StandardTrack" ], @@ -12361,15 +12496,15 @@ "lowDate": "2018-09-05", "highDate": "2021-03-05" }, - "doc": "The font-variation-settings CSS property provides low-level control over variable font characteristics by letting you specify the four letter axis names of the characteristics you want to vary along with their values.", + "doc": "The font-variation-settings CSS property provides low-level control over variable font characteristics by letting you specify the four letter axis names of the characteristics you want to vary along with their values.", "formalSyntax": "normal | [ <opentype-tag> <number> ]#\n  <opentype-tag> = <string>", "values": { "normal": "Text is laid out using default settings.", - "<string> <number>": "When rendering text, the list of variable font axis names is passed to the text layout engine to enable or disable font features. Each setting is always one or more pairs consisting of a <string> of 4 ASCII characters followed by a <number> indicating the axis value to set. If the <string> has more or fewer characters or contains characters outside the U+20 - U+7E code point range, the whole property is invalid. The <number> can be fractional or negative, depending on the value range available in your font, as defined by the font designer." + "<string> <number>": "When rendering text, the list of variable font axis names is passed to the text layout engine to enable or disable font features. Each setting is always one or more pairs consisting of a <string> of 4 ASCII characters followed by a <number> indicating the axis value to set. If the <string> has more or fewer characters or contains characters outside the U+20 - U+7E code point range, the whole property is invalid. The <number> can be fractional or negative, depending on the value range available in your font, as defined by the font designer." } }, "font-weight": { - "url": "$MDN_URL$/web/css/font-weight", + "url": "$MDN_URL$/web/css/reference/properties/font-weight", "status": [ "StandardTrack" ], @@ -12388,18 +12523,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-weight CSS property sets the weight (or boldness) of the font. The weights available depend on the font-family that is currently set.", + "doc": "The font-weight CSS property sets the weight (or boldness) of the font. The weights available depend on the font-family that is currently set.", "formalSyntax": "<font-weight-absolute> | bolder | lighter\n  <font-weight-absolute> = normal | bold | <number [1,1000]>", "values": { "normal": "Normal font weight. Same as 400.", "bold": "Bold font weight. Same as 700.", - "<number>": "A <number> value between 1 and 1000, both values included. Higher numbers represent weights that are bolder than (or as bold as) lower numbers. This allows fine-grain control for variable fonts. For non-variable fonts, if the exact specified weight is unavailable, a fallback weight algorithm is used — numeric values that are divisible by 100 correspond to common weight names, as described in the Common weight name mapping section below.", + "<number>": "A <number> value between 1 and 1000, both values included. Higher numbers represent weights that are bolder than (or as bold as) lower numbers. This allows fine-grain control for variable fonts. For non-variable fonts, if the exact specified weight is unavailable, a fallback weight algorithm is used — numeric values that are divisible by 100 correspond to common weight names, as described in the Common weight name mapping section below.", "lighter": "One relative font weight lighter than the parent element. Note that only four font weights are considered for relative weight calculation; see the Meaning of relative weights section below.", "bolder": "One relative font weight heavier than the parent element. Note that only four font weights are considered for relative weight calculation; see the Meaning of relative weights section below." } }, "forced-color-adjust": { - "url": "$MDN_URL$/web/css/forced-color-adjust", + "url": "$MDN_URL$/web/css/reference/properties/forced-color-adjust", "status": [ "StandardTrack" ], @@ -12419,11 +12554,15 @@ "values": { "auto": "The element's colors are adjusted by the user agent in forced colors mode. This is the default value.", "none": "The element's colors are not automatically adjusted by the user agent in forced colors mode.", - "preserve-parent-color": "In forced colors mode, if the color property inherits from its parent (i.e., there is no cascaded value or the cascaded value is currentColor, inherit, or another keyword that inherits from the parent), then it computes to the used color of its parent's color property. In all other cases, it behaves the same as none." + "preserve-parent-color": "In forced colors mode, if the color property inherits from its parent (i.e., there is no cascaded value or the cascaded value is currentColor, inherit, or another keyword that inherits from the parent), then it computes to the used color of its parent's color property. In all other cases, it behaves the same as none." } }, + "functions": { + "url": "$MDN_URL$/web/css/reference/values/functions", + "doc": "CSS value functions are statements that invoke special data processing or calculations to return a CSS value for a CSS property. CSS value functions represent more complex data types and they may take some input arguments to calculate the return value." + }, "gap": { - "url": "$MDN_URL$/web/css/gap", + "url": "$MDN_URL$/web/css/reference/properties/gap", "status": [ "StandardTrack" ], @@ -12464,7 +12603,7 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The gap CSS shorthand property sets the gaps (also called gutters) between rows and columns. This property applies to multi-column, flex, and grid containers.", + "doc": "The gap CSS shorthand property sets the gaps (also called gutters) between rows and columns. This property applies to multi-column, flex, and grid containers.", "formalSyntax": "<'row-gap'> <'column-gap'>?\n  <row-gap> = normal | <length-percentage [0,∞]>\n  <column-gap> = normal | <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "Specifies the width of the gutter separating columns, flex items, flex lines, and grid lines.", @@ -12472,7 +12611,7 @@ } }, "grid": { - "url": "$MDN_URL$/web/css/grid", + "url": "$MDN_URL$/web/css/reference/properties/grid", "status": [ "StandardTrack" ], @@ -12491,16 +12630,16 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The grid CSS property is a shorthand property that sets all of the explicit and implicit grid properties in a single declaration.\n

    Using grid you specify one axis using grid-template-rows or grid-template-columns, you then specify how content should auto-repeat in the other axis using the implicit grid properties: grid-auto-rows, grid-auto-columns, and grid-auto-flow.", - "formalSyntax": "<'grid-template'> | <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? | [ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>\n  <grid-template> = none | [ <'grid-template-rows'> / <'grid-template-columns'> ] | [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?\n  <grid-template-rows> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <grid-auto-columns> = <track-size>+\n  <grid-auto-rows> = <track-size>+\n  <grid-template-columns> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <explicit-track-list> = [ <line-names>? <track-size> ]+ <line-names>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <fixed-breadth> = <length-percentage [0,∞]>", + "doc": "The grid CSS property is a shorthand property that sets all of the explicit and implicit grid properties in a single declaration.\n

    Using grid you specify one axis using grid-template-rows or grid-template-columns, you then specify how content should auto-repeat in the other axis using the implicit grid properties: grid-auto-rows, grid-auto-columns, and grid-auto-flow.", + "formalSyntax": "<'grid-template'> | <'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>? | [ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>\n  <grid-template> = none | [ <'grid-template-rows'> / <'grid-template-columns'> ] | [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?\n  <grid-template-rows> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <grid-auto-columns> = <track-size>+\n  <grid-auto-rows> = <track-size>+\n  <grid-template-columns> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <explicit-track-list> = [ <line-names>? <track-size> ]+ <line-names>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <integer> = <number-token>\n  <fixed-breadth> = <length-percentage [0,∞]>", "values": { - "<'grid-template'>": "Defines the grid-template including grid-template-columns, grid-template-rows and grid-template-areas.", - "<'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>?": "Sets up an auto-flow by setting the row tracks explicitly via the grid-template-rows property (and the grid-template-columns property to none) and specifying how to auto-repeat the column tracks via grid-auto-columns (and setting grid-auto-rows to auto). grid-auto-flow is also set to column accordingly, with dense if it's specified.\n

    All other grid sub-properties are reset to their initial values.", - "[ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>": "Sets up an auto-flow by setting the column tracks explicitly via the grid-template-columns property (and the grid-template-rows property to none) and specifying how to auto-repeat the row tracks via grid-auto-rows (and setting grid-auto-columns to auto). grid-auto-flow is also set to row accordingly, with dense if it's specified.\n

    All other grid sub-properties are reset to their initial values." + "<'grid-template'>": "Defines the grid-template including grid-template-columns, grid-template-rows and grid-template-areas.", + "<'grid-template-rows'> / [ auto-flow && dense? ] <'grid-auto-columns'>?": "Sets up an auto-flow by setting the row tracks explicitly via the grid-template-rows property (and the grid-template-columns property to none) and specifying how to auto-repeat the column tracks via grid-auto-columns (and setting grid-auto-rows to auto). grid-auto-flow is also set to column accordingly, with dense if it's specified.\n

    All other grid sub-properties are reset to their initial values.", + "[ auto-flow && dense? ] <'grid-auto-rows'>? / <'grid-template-columns'>": "Sets up an auto-flow by setting the column tracks explicitly via the grid-template-columns property (and the grid-template-rows property to none) and specifying how to auto-repeat the row tracks via grid-auto-rows (and setting grid-auto-columns to auto). grid-auto-flow is also set to row accordingly, with dense if it's specified.\n

    All other grid sub-properties are reset to their initial values." } }, "grid-area": { - "url": "$MDN_URL$/web/css/grid-area", + "url": "$MDN_URL$/web/css/reference/properties/grid-area", "status": [ "StandardTrack" ], @@ -12519,17 +12658,17 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The grid-area CSS shorthand property specifies a grid item's size and location within a grid by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the edges of its grid area.", - "formalSyntax": "<grid-line> [ / <grid-line> ]{0,3}\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "doc": "The grid-area CSS shorthand property specifies a grid item's size and location within a grid by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the edges of its grid area.", + "formalSyntax": "<grid-line> [ / <grid-line> ]{0,3}\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Is a keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement or a default span of 1.", "<custom-ident>": "If there is a named line with the name <custom-ident>-start or <custom-ident>-end, it contributes the first such line to the grid item's placement.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-area: foo; will choose the start/end edge of that named grid area (unless another line named foo-start/foo-end was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the n-th grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", - "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the corresponding edge of the grid item's grid area is n lines from the opposite edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid." + "<integer> && <custom-ident>?": "Contributes the n-th grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the corresponding edge of the grid item's grid area is n lines from the opposite edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid." } }, "grid-auto-columns": { - "url": "$MDN_URL$/web/css/grid-auto-columns", + "url": "$MDN_URL$/web/css/reference/properties/grid-auto-columns", "status": [ "StandardTrack" ], @@ -12552,17 +12691,17 @@ "formalSyntax": "<track-size>+\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "Is a non-negative length.", - "<percentage>": "Is a non-negative <percentage> value relative to the block size of the grid container. If the block size of the grid container is indefinite, the percentage value is treated like auto.", + "<percentage>": "Is a non-negative <percentage> value relative to the block size of the grid container. If the block size of the grid container is indefinite, the percentage value is treated like auto.", "<flex>": "Is a non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor.\n

    When appearing outside a minmax() notation, it implies an automatic minimum (i.e., minmax(auto, <flex>)).", "max-content": "Is a keyword representing the largest maximal content contribution of the grid items occupying the grid track.", "min-content": "Is a keyword representing the largest minimal content contribution of the grid items occupying the grid track.", "minmax(min, max)": "Is a functional notation that defines a size range greater than or equal to min and less than or equal to max. If max is smaller than min, then max is ignored and the function is treated as min. As a maximum, a <flex> value sets the track's flex factor. As a minimum, it is treated as zero (or minimal content, if the grid container is sized under a minimal content constraint).", "fit-content( [ <length> | <percentage> ] )": "Represents the formula min(max-content, max(auto, argument)), which is calculated similar to auto (i.e., minmax(auto, max-content)), except that the track size is clamped at argument if it is greater than the auto minimum.", - "auto": "As a maximum represents the largest max-content size of the items in that track.\n

    As a minimum represents the largest minimum size of items in that track (specified by the min-width/min-height of the items). This is often, though not always, the min-content size.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum described above. This behaves similarly to minmax(min-content,max-content) in most cases.\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore by default, an auto sized track will take up any remaining space in the grid container.\n

    " + "auto": "As a maximum represents the largest max-content size of the items in that track.\n

    As a minimum represents the largest minimum size of items in that track (specified by the min-width/min-height of the items). This is often, though not always, the min-content size.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum described above. This behaves similarly to minmax(min-content,max-content) in most cases.\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore by default, an auto sized track will take up any remaining space in the grid container.\n

    " } }, "grid-auto-flow": { - "url": "$MDN_URL$/web/css/grid-auto-flow", + "url": "$MDN_URL$/web/css/reference/properties/grid-auto-flow", "status": [ "StandardTrack" ], @@ -12590,7 +12729,7 @@ } }, "grid-auto-rows": { - "url": "$MDN_URL$/web/css/grid-auto-rows", + "url": "$MDN_URL$/web/css/reference/properties/grid-auto-rows", "status": [ "StandardTrack" ], @@ -12613,17 +12752,17 @@ "formalSyntax": "<track-size>+\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "Is a non-negative length.", - "<percentage>": "Is a non-negative <percentage> value relative to the block size of the grid container. If the block size of the grid container is indefinite, the percentage value is treated like auto.", + "<percentage>": "Is a non-negative <percentage> value relative to the block size of the grid container. If the block size of the grid container is indefinite, the percentage value is treated like auto.", "<flex>": "Is a non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor.\n

    When appearing outside a minmax() notation, it implies an automatic minimum (i.e., minmax(auto, <flex>)).", "max-content": "Is a keyword representing the largest maximal content contribution of the grid items occupying the grid track.", "min-content": "Is a keyword representing the largest minimal content contribution of the grid items occupying the grid track.", "minmax(min, max)": "Is a functional notation that defines a size range greater than or equal to min and less than or equal to max. If max is smaller than min, then max is ignored and the function is treated as min. As a maximum, a <flex> value sets the track's flex factor. As a minimum, it is treated as zero (or minimal content, if the grid container is sized under a minimal content constraint).", "fit-content( [ <length> | <percentage> ] )": "Represents the formula min(max-content, max(auto, argument)), which is calculated similar to auto (i.e., minmax(auto, max-content)), except that the track size is clamped at argument if it is greater than the auto minimum.", - "auto": "As a maximum represents the largest max-content size of the items in that track.\n

    As a minimum represents the largest minimum size of items in that track (specified by the min-width/min-height of the items). This is often, though not always, the min-content size.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum described above. This behaves similarly to minmax(min-content,max-content) in most cases.\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore by default, an auto sized track will take up any remaining space in the grid container.\n

    " + "auto": "As a maximum represents the largest max-content size of the items in that track.\n

    As a minimum represents the largest minimum size of items in that track (specified by the min-width/min-height of the items). This is often, though not always, the min-content size.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum described above. This behaves similarly to minmax(min-content,max-content) in most cases.\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore by default, an auto sized track will take up any remaining space in the grid container.\n

    " } }, "grid-column": { - "url": "$MDN_URL$/web/css/grid-column", + "url": "$MDN_URL$/web/css/reference/properties/grid-column", "status": [ "StandardTrack" ], @@ -12642,17 +12781,17 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The grid-column CSS shorthand property specifies a grid item's size and location within a grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area.", - "formalSyntax": "<grid-line> [ / <grid-line> ]?\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "doc": "The grid-column CSS shorthand property specifies a grid item's size and location within a grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area.", + "formalSyntax": "<grid-line> [ / <grid-line> ]?\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Is a keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1.", "<custom-ident>": "If there is a named line with the name <custom-ident>-start/<custom-ident>-end, it contributes the first such line to the grid item's placement.\n
    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-column: foo; will choose the start/end edge of that named grid area (unless another line named foo-start/foo-end was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the corresponding edge of the grid item's grid area is n lines from the opposite edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid." } }, "grid-column-end": { - "url": "$MDN_URL$/web/css/grid-column-end", + "url": "$MDN_URL$/web/css/reference/properties/grid-column-end", "status": [ "StandardTrack" ], @@ -12672,16 +12811,16 @@ "highDate": "2020-04-17" }, "doc": "The grid-column-end CSS property specifies a grid item's end position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the block-end edge of its grid area.", - "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1. This is the default value.", "<custom-ident>": "Contributes the first line to the grid item's placement if there is a named line with the name <custom-ident>-end.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-column-end: foo; will choose the end edge of that named grid area (unless another line named foo-end was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the column end edge of the grid item's grid area is n lines from the start edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid.\n

    The <custom-ident> cannot take the span and auto values." } }, "grid-column-start": { - "url": "$MDN_URL$/web/css/grid-column-start", + "url": "$MDN_URL$/web/css/reference/properties/grid-column-start", "status": [ "StandardTrack" ], @@ -12701,16 +12840,16 @@ "highDate": "2020-04-17" }, "doc": "The grid-column-start CSS property specifies a grid item's start position within the grid column by contributing a line, a span, or nothing (automatic) to its grid placement. This start position defines the block-start edge of the grid area.", - "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "A keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1.", "<custom-ident>": "If there is a named line with the name <custom-ident>-start, it contributes the first such line to the grid item's placement.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-column-start: foo; will choose the start edge of that named grid area (unless another line named foo-start was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement, such that the column start edge of the grid item's grid area is n lines from the end edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers and 0 are invalid.\n

    The <custom-ident> cannot take the span and auto values." } }, "grid-row": { - "url": "$MDN_URL$/web/css/grid-row", + "url": "$MDN_URL$/web/css/reference/properties/grid-row", "status": [ "StandardTrack" ], @@ -12729,17 +12868,17 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The grid-row CSS shorthand property specifies a grid item's size and location within a grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area.", - "formalSyntax": "<grid-line> [ / <grid-line> ]?\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "doc": "The grid-row CSS shorthand property specifies a grid item's size and location within a grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start and inline-end edge of its grid area.", + "formalSyntax": "<grid-line> [ / <grid-line> ]?\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Is a keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1.", "<custom-ident>": "If there is a named line with the name <custom-ident>-start/<custom-ident>-end, it contributes the first such line to the grid item's placement.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-row: foo; will choose the start/end edge of that named grid area (unless another line named foo-start/foo-end was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the corresponding edge of the grid item's grid area is n lines from the opposite edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid." } }, "grid-row-end": { - "url": "$MDN_URL$/web/css/grid-row-end", + "url": "$MDN_URL$/web/css/reference/properties/grid-row-end", "status": [ "StandardTrack" ], @@ -12759,16 +12898,16 @@ "highDate": "2020-04-17" }, "doc": "The grid-row-end CSS property specifies a grid item's end position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-end edge of its grid area.", - "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Is a keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1.", "<custom-ident>": "If there is a named line with the name '<custom-ident>-end', it contributes the first such line to the grid item's placement.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-row-end: foo; will choose the end edge of that named grid area (unless another line named foo-end was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.\n

    The <custom-ident> cannot take the span and auto values.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement such that the row end edge of the grid item's grid area is n lines from the start edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid corresponding to the search direction are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid." } }, "grid-row-start": { - "url": "$MDN_URL$/web/css/grid-row-start", + "url": "$MDN_URL$/web/css/reference/properties/grid-row-start", "status": [ "StandardTrack" ], @@ -12788,16 +12927,16 @@ "highDate": "2020-04-17" }, "doc": "The grid-row-start CSS property specifies a grid item's start position within the grid row by contributing a line, a span, or nothing (automatic) to its grid placement, thereby specifying the inline-start edge of its grid area.", - "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]", + "formalSyntax": "<grid-line>\n  <grid-line> = auto | <custom-ident> | [ [ <integer [-∞,-1]> | <integer [1,∞]> ] && <custom-ident>? ] | [ span && [ <integer [1,∞]> || <custom-ident> ] ]\n  <integer> = <number-token>", "values": { "auto": "Is a keyword indicating that the property contributes nothing to the grid item's placement, indicating auto-placement, an automatic span, or a default span of 1.", "<custom-ident>": "If there is a named line with the name '<custom-ident>-start', it contributes the first such line to the grid item's placement.\n

    \n

    Note:\nNamed grid areas automatically generate implicit named lines of this form, so specifying grid-row-start: foo; will choose the start edge of that named grid area (unless another line named foo-start was explicitly specified before it).\n

    \n

    Otherwise, this is treated as if the integer 1 had been specified along with the <custom-ident>.", - "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", + "<integer> && <custom-ident>?": "Contributes the nth grid line to the grid item's placement. If a negative integer is given, it instead counts in reverse, starting from the end edge of the explicit grid.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines are assumed to have that name for the purpose of finding this position.\n

    An <integer> value of 0 is invalid.", "span && [ <integer> || <custom-ident> ]": "Contributes a grid span to the grid item's placement; such that the row start edge of the grid item's grid area is n lines from the end edge.\n

    If a name is given as a <custom-ident>, only lines with that name are counted. If not enough lines with that name exist, all implicit grid lines on the side of the explicit grid, corresponding to the search direction, are assumed to have that name for the purpose of counting this span.\n

    If the <integer> is omitted, it defaults to 1. Negative integers or 0 are invalid.\n

    The <custom-ident> cannot take the span and auto values." } }, "grid-template": { - "url": "$MDN_URL$/web/css/grid-template", + "url": "$MDN_URL$/web/css/reference/properties/grid-template", "status": [ "StandardTrack" ], @@ -12816,16 +12955,16 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The grid-template CSS property is a shorthand property for defining grid columns, grid rows, and grid areas.", - "formalSyntax": "none | [ <'grid-template-rows'> / <'grid-template-columns'> ] | [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?\n  <grid-template-rows> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <grid-template-columns> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <explicit-track-list> = [ <line-names>? <track-size> ]+ <line-names>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <fixed-breadth> = <length-percentage [0,∞]>", + "doc": "The grid-template CSS property is a shorthand property for defining grid columns, grid rows, and grid areas.", + "formalSyntax": "none | [ <'grid-template-rows'> / <'grid-template-columns'> ] | [ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?\n  <grid-template-rows> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <grid-template-columns> = none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <explicit-track-list> = [ <line-names>? <track-size> ]+ <line-names>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <integer> = <number-token>\n  <fixed-breadth> = <length-percentage [0,∞]>", "values": { - "none": "Sets all three longhand properties to none, meaning there is no explicit grid. There are no named grid areas. Rows and columns will be implicitly generated; their size will be determined by the grid-auto-rows and grid-auto-columns properties. This is the default value.", - "<'grid-template-rows'> / <'grid-template-columns'>": "Sets grid-template-rows and grid-template-columns to the specified values, and sets grid-template-areas to none.", - "[ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?": "Sets grid-template-areas to the strings listed, grid-template-rows to the track sizes following each string (filling in auto for any missing sizes), and splicing in the named lines defined before/after each size, and grid-template-columns to the track listing specified after the slash (or none, if not specified).\n

    \n

    Note:\nThe repeat() function isn't allowed in these track listings, as the tracks are intended to visually line up one-to-one with the rows/columns in the \"ASCII art\".\n

    " + "none": "Sets all three longhand properties to none, meaning there is no explicit grid. There are no named grid areas. Rows and columns will be implicitly generated; their size will be determined by the grid-auto-rows and grid-auto-columns properties. This is the default value.", + "<'grid-template-rows'> / <'grid-template-columns'>": "Sets grid-template-rows and grid-template-columns to the specified values, and sets grid-template-areas to none.", + "[ <line-names>? <string> <track-size>? <line-names>? ]+ [ / <explicit-track-list> ]?": "Sets grid-template-areas to the strings listed, grid-template-rows to the track sizes following each string (filling in auto for any missing sizes), and splicing in the named lines defined before/after each size, and grid-template-columns to the track listing specified after the slash (or none, if not specified).\n
    \n

    Note:\nThe repeat() function isn't allowed in these track listings, as the tracks are intended to visually line up one-to-one with the rows/columns in the \"ASCII art\".\n

    " } }, "grid-template-areas": { - "url": "$MDN_URL$/web/css/grid-template-areas", + "url": "$MDN_URL$/web/css/reference/properties/grid-template-areas", "status": [ "StandardTrack" ], @@ -12852,7 +12991,7 @@ } }, "grid-template-columns": { - "url": "$MDN_URL$/web/css/grid-template-columns", + "url": "$MDN_URL$/web/css/reference/properties/grid-template-columns", "status": [ "StandardTrack" ], @@ -12872,25 +13011,25 @@ "highDate": "2020-04-17" }, "doc": "The grid-template-columns CSS property defines the line names and track sizing functions of the grid columns.", - "formalSyntax": "none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <fixed-breadth> = <length-percentage [0,∞]>", + "formalSyntax": "none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <integer> = <number-token>\n  <fixed-breadth> = <length-percentage [0,∞]>", "values": { - "none": "Indicates that there is no explicit grid. Any columns will be implicitly generated and their size will be determined by the grid-auto-columns property.", - "[line-name]": "A <custom-ident> specifying a name for the line in that location. The ident may be any valid string other than the reserved words span and auto. Lines may have multiple names separated by a space inside the square brackets, for example [line-name-a line-name-b].", + "none": "Indicates that there is no explicit grid. Any columns will be implicitly generated and their size will be determined by the grid-auto-columns property.", + "[line-name]": "A <custom-ident> specifying a name for the line in that location. The ident may be any valid string other than the reserved words span and auto. Lines may have multiple names separated by a space inside the square brackets, for example [line-name-a line-name-b].", "<length>": "A non-negative length, giving the width of the column.", - "<percentage>": "A non-negative <percentage> value relative to the inline size of the grid container. If the size of the grid container depends on the size of its tracks, the browser treats the percentage as auto.\nThe browser may adjust the intrinsic size contributions of the track to the size of the grid container and may increase the final size of the track by the minimum amount that would result in honoring the percentage.", + "<percentage>": "A non-negative <percentage> value relative to the inline size of the grid container. If the size of the grid container depends on the size of its tracks, the browser treats the percentage as auto.\nThe browser may adjust the intrinsic size contributions of the track to the size of the grid container and may increase the final size of the track by the minimum amount that would result in honoring the percentage.", "<flex>": "Is a non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor.\n

    When appearing outside a minmax() notation, it implies an automatic minimum (i.e., minmax(auto, <flex>)).", "max-content": "Is a keyword representing the largest maximal content contribution of the grid items occupying the grid track. For example, if the first element of the grid track contains the sentence \"Repetitio est mater studiorum\" and the second element contains the sentence \"Dum spiro, spero\", maximal content contribution will be defined by the size of the largest sentence among all of the grid elements - \"Repetitio est mater studiorum\".", "min-content": "Is a keyword representing the largest minimal content contribution of the grid items occupying the grid track. For example, if the first element of the grid track contains the sentence \"Repetitio est mater studiorum\" and the second element contains the sentence \"Dum spiro, spero\", minimal content contribution will be defined by the size of the largest word among all of the sentences in the grid elements - \"studiorum\".", "minmax(min, max)": "Is a functional notation that defines a size range greater than or equal to min and less than or equal to max. If max is smaller than min, then max is ignored and the function is treated as min. As a maximum, a <flex> value sets the track's flex factor. It is invalid as a minimum.", - "auto": "As a maximum value, it represents the largest max-content size of the items in that track.\n

    As a minimum value, it represents the largest minimum size of items in that track (specified by the min-width/min-height properties of the items). This often corresponds to the min-content size, but not always.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum values described above. In most cases, this behaves similarly to minmax(min-content,max-content).\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore, by default, an auto-sized track will take up any remaining space in the grid container.\n

    ", - "fit-content( [ <length> | <percentage> ] )": "Represents the formula max(minimum, min(limit, max-content)), where minimum represents an auto minimum (which is often, but not always, equal to a min-content minimum), and limit is the track sizing function passed as an argument to fit-content(). This is essentially calculated as the smaller of minmax(auto, max-content) and minmax(auto, limit).", + "auto": "As a maximum value, it represents the largest max-content size of the items in that track.\n

    As a minimum value, it represents the largest minimum size of items in that track (specified by the min-width/min-height properties of the items). This often corresponds to the min-content size, but not always.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum values described above. In most cases, this behaves similarly to minmax(min-content,max-content).\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore, by default, an auto-sized track will take up any remaining space in the grid container.\n

    ", + "fit-content( [ <length> | <percentage> ] )": "Represents the formula max(minimum, min(limit, max-content)), where minimum represents an auto minimum (which is often, but not always, equal to a min-content minimum), and limit is the track sizing function passed as an argument to fit-content(). This is essentially calculated as the smaller of minmax(auto, max-content) and minmax(auto, limit).", "repeat( [ <positive-integer> | auto-fill | auto-fit ] , <track-list> )": "Represents a repeated fragment of the track list, allowing a large number of columns that exhibit a recurring pattern to be written in a more compact form.", "masonry": "The masonry value indicates that this axis should be laid out according to the masonry algorithm.", "subgrid": "The subgrid value indicates that the grid will adopt the spanned portion of its parent grid in that axis. Rather than being specified explicitly, the sizes of the grid rows/columns will be taken from the parent grid's definition." } }, "grid-template-rows": { - "url": "$MDN_URL$/web/css/grid-template-rows", + "url": "$MDN_URL$/web/css/reference/properties/grid-template-rows", "status": [ "StandardTrack" ], @@ -12910,29 +13049,25 @@ "highDate": "2020-04-17" }, "doc": "The grid-template-rows CSS property defines the line names and track sizing functions of the grid rows.", - "formalSyntax": "none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <fixed-breadth> = <length-percentage [0,∞]>", + "formalSyntax": "none | <track-list> | <auto-track-list> | subgrid <line-name-list>?\n  <track-list> = [ <line-names>? [ <track-size> | <track-repeat> ] ]+ <line-names>?\n  <auto-track-list> = [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>? <auto-repeat> [ <line-names>? [ <fixed-size> | <fixed-repeat> ] ]* <line-names>?\n  <line-name-list> = [ <line-names> | <name-repeat> ]+\n  <line-names> = '[' <custom-ident>* ']'\n  <track-size> = <track-breadth> | minmax( <inflexible-breadth> , <track-breadth> ) | fit-content( <length-percentage [0,∞]> )\n  <track-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <track-size> ]+ <line-names>? )\n  <fixed-size> = <fixed-breadth> | minmax( <fixed-breadth> , <track-breadth> ) | minmax( <inflexible-breadth> , <fixed-breadth> )\n  <fixed-repeat> = repeat( [ <integer [1,∞]> ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <auto-repeat> = repeat( [ auto-fill | auto-fit ] , [ <line-names>? <fixed-size> ]+ <line-names>? )\n  <name-repeat> = repeat( [ <integer [1,∞]> | auto-fill ] , <line-names>+ )\n  <track-breadth> = <length-percentage [0,∞]> | <flex [0,∞]> | min-content | max-content | auto\n  <inflexible-breadth> = <length-percentage [0,∞]> | min-content | max-content | auto\n  <length-percentage> = <length> | <percentage>\n  <integer> = <number-token>\n  <fixed-breadth> = <length-percentage [0,∞]>", "values": { - "none": "A keyword meaning that there is no explicit grid. Any rows will be implicitly generated and their size will be determined by the grid-auto-rows property.", - "[line-name]": "A <custom-ident> specifying a name for the line in that location. The ident may be any valid string other than the reserved words span and auto. Lines may have multiple names separated by a space inside the square brackets, for example [line-name-a line-name-b].", + "none": "A keyword meaning that there is no explicit grid. Any rows will be implicitly generated and their size will be determined by the grid-auto-rows property.", + "[line-name]": "A <custom-ident> specifying a name for the line in that location. The ident may be any valid string other than the reserved words span and auto. Lines may have multiple names separated by a space inside the square brackets, for example [line-name-a line-name-b].", "<length>": "A non-negative length.", - "<percentage>": "A non-negative <percentage> value, relative to the block size of the grid container. If the size of the grid container depends on the size of its tracks, the browser treats the percentage as auto for the purpose of calculating the intrinsic size of the grid container. The percentage is then resolved against the resulting grid container size for laying out the grid and its items. The browser may adjust the intrinsic size contributions of the track to the size of the grid container and may increase the final size of the track by the minimum amount that would result in honoring the percentage.", + "<percentage>": "A non-negative <percentage> value, relative to the block size of the grid container. If the size of the grid container depends on the size of its tracks, the browser treats the percentage as auto for the purpose of calculating the intrinsic size of the grid container. The percentage is then resolved against the resulting grid container size for laying out the grid and its items. The browser may adjust the intrinsic size contributions of the track to the size of the grid container and may increase the final size of the track by the minimum amount that would result in honoring the percentage.", "<flex>": "A non-negative dimension with the unit fr specifying the track's flex factor. Each <flex>-sized track takes a share of the remaining space in proportion to its flex factor. When appearing outside a minmax() notation, it implies an automatic minimum (i.e., minmax(auto, <flex>)).", "max-content": "A keyword representing the largest maximal content contribution of the grid items occupying the grid track.", "min-content": "A keyword representing the largest minimal content contribution of the grid items occupying the grid track.", "minmax(min, max)": "A functional notation that defines a size range, greater than or equal to min, and less than or equal to max. If max is smaller than min, then max is ignored and the function is treated as min. As a maximum, a <flex> value sets the track's flex factor. It is invalid as a minimum.", - "auto": "As a maximum value, it represents the largest max-content size of the items in that track.\n

    As a minimum value, it represents the largest minimum size of items in that track (specified by the min-width/min-height properties of the items). This often corresponds to the min-content size, but not always.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum values described above. In most cases, this behaves similarly to minmax(min-content,max-content).\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore, by default, an auto-sized track will take up any remaining space in the grid container.\n

    ", + "auto": "As a maximum value, it represents the largest max-content size of the items in that track.\n

    As a minimum value, it represents the largest minimum size of items in that track (specified by the min-width/min-height properties of the items). This often corresponds to the min-content size, but not always.\n

    If used outside of minmax() notation, auto represents the range between the minimum and maximum values described above. In most cases, this behaves similarly to minmax(min-content,max-content).\n

    \n

    Note:\nauto track sizes (and only auto track sizes) can be stretched by the align-content and justify-content properties. Therefore, by default, an auto-sized track will take up any remaining space in the grid container.\n

    ", "fit-content( [ <length> | <percentage> ] )": "Represents the formula min(max-content, max(auto, argument)), which is calculated similar to auto (i.e., minmax(auto, max-content)), except that the track size is clamped at argument if it is greater than the auto minimum.", "repeat( [ <positive-integer> | auto-fill | auto-fit ] , <track-list> )": "Represents a repeated fragment of the track list, allowing a large number of rows that exhibit a recurring pattern to be written in a more compact form.", "masonry": "Indicates that this axis should be laid out according to the masonry algorithm.", "subgrid": "Indicates that the grid will adopt the spanned portion of its parent grid in that axis. Rather than being specified explicitly, the sizes of the grid rows/columns will be taken from the parent grid's definition." } }, - "guides": { - "url": "$MDN_URL$/web/css/guides", - "doc": "There are a number of methods that you can use to lay out your web pages and applications. MDN contains a number of in-depth guides to the different methods, and this page provides an overview of them all." - }, "hanging-punctuation": { - "url": "$MDN_URL$/web/css/hanging-punctuation", + "url": "$MDN_URL$/web/css/reference/properties/hanging-punctuation", "status": [ "StandardTrack" ], @@ -12950,7 +13085,7 @@ } }, "height": { - "url": "$MDN_URL$/web/css/height", + "url": "$MDN_URL$/web/css/reference/properties/height", "status": [ "StandardTrack" ], @@ -12969,21 +13104,21 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box, however, it instead determines the height of the border area.", + "doc": "The height CSS property specifies the height of an element. By default, the property defines the height of the content area. If box-sizing is set to border-box, however, it instead determines the height of the border area.", "formalSyntax": "auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the height as a distance value.", - "<percentage>": "Defines the height as a percentage of the containing block's height.", + "<percentage>": "Defines the height as a percentage of the containing block's height.", "auto": "The browser will calculate and select a height for the specified element.", "max-content": "The intrinsic preferred height.", "min-content": "The intrinsic minimum height.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, <length-percentage>)).", - "stretch": "Sets the height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing." + "stretch": "Sets the height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing." } }, "hyphenate-character": { - "url": "$MDN_URL$/web/css/hyphenate-character", + "url": "$MDN_URL$/web/css/reference/properties/hyphenate-character", "status": [ "StandardTrack" ], @@ -13004,12 +13139,12 @@ "doc": "The hyphenate-character CSS property sets the character (or string) used at the end of a line before a hyphenation break.\n

    Both automatic and soft hyphens are displayed according to the specified hyphenate-character value.", "formalSyntax": "auto | <string>", "values": { - "<string>": "The <string> to use at the end of the line before a hyphenation break.\nThe user agent may truncate this value if too many characters are used.", + "<string>": "The <string> to use at the end of the line before a hyphenation break.\nThe user agent may truncate this value if too many characters are used.", "auto": "The user-agent selects an appropriate string based on the content language's typographic conventions.\nThis is the default property value, and only needs to be explicitly set in order to override a different inherited value." } }, "hyphenate-limit-chars": { - "url": "$MDN_URL$/web/css/hyphenate-limit-chars", + "url": "$MDN_URL$/web/css/reference/properties/hyphenate-limit-chars", "status": [ "StandardTrack" ], @@ -13025,7 +13160,7 @@ "level": "NONE" }, "doc": "The hyphenate-limit-chars CSS property specifies the minimum word length to allow hyphenation of words as well as the minimum number of characters before and after the hyphen.\n

    This property provides you with fine-grained control over hyphenation in text. This control enables you to avoid awkward hyphenations and set appropriate hyphenation for different languages, which, in turn, allows for better typography.", - "formalSyntax": "[ auto | <integer> ]{1,3}", + "formalSyntax": "[ auto | <integer> ]{1,3}\n  <integer> = <number-token>", "values": { "<number> <number> <number>": "The first value is the minimum word length before words should be hyphenated. The second value is the minimum number of characters before the hyphen. The third value is the minimum number of characters after the hyphen.", "<number> <number>": "The first value is the minimum word length before words should be hyphenated. The second value is the minimum number of characters before the hyphen. The minimum number of characters after the hyphen will be set equal to the second value.", @@ -13033,7 +13168,7 @@ } }, "hyphens": { - "url": "$MDN_URL$/web/css/hyphens", + "url": "$MDN_URL$/web/css/reference/properties/hyphens", "status": [ "StandardTrack" ], @@ -13060,7 +13195,7 @@ } }, "id_selectors": { - "url": "$MDN_URL$/web/css/id_selectors", + "url": "$MDN_URL$/web/css/reference/selectors/id_selectors", "status": [ "StandardTrack" ], @@ -13082,7 +13217,7 @@ "doc": "The CSS ID selector matches an element based on the value of the element's id attribute. In order for the element to be selected, its id attribute must match exactly the value given in the selector.\n

    \n```css\n/* The element with id=\"demo\" */\n#demo {\n  border: red 2px solid;\n}\n```\n
    " }, "image-orientation": { - "url": "$MDN_URL$/web/css/image-orientation", + "url": "$MDN_URL$/web/css/reference/properties/image-orientation", "status": [ "StandardTrack" ], @@ -13109,7 +13244,7 @@ } }, "image-rendering": { - "url": "$MDN_URL$/web/css/image-rendering", + "url": "$MDN_URL$/web/css/reference/properties/image-rendering", "status": [ "StandardTrack" ], @@ -13138,7 +13273,7 @@ } }, "image-resolution": { - "url": "$MDN_URL$/web/css/image-resolution", + "url": "$MDN_URL$/web/css/reference/properties/image-resolution", "doc": "

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

    \n

    The image-resolution CSS property specifies the intrinsic resolution of all raster images used in or on the element. It affects content images such as replaced elements and generated content, and decorative images such as background-image images.\n

    The image resolution is defined as the number of image pixels per unit length, e.g., pixels per inch. By default, CSS assumes a resolution of one image pixel per CSS px unit; however, the image-resolution property allows a different resolution to be specified.", "formalSyntax": "[ from-image || <resolution> ] &&snap?", "values": { @@ -13148,11 +13283,11 @@ } }, "important": { - "url": "$MDN_URL$/web/css/important", - "doc": "A ! delimiter followed by the important keyword marks the declaration as important. The !important flag alters the rules selecting declarations inside the cascade. A declaration that is not important is called normal.\n

    To mark a declaration important, add the important flag (!important) after the value in the declaration. While white space is allowed between the delimiter and the keyword, the flag is generally written as !important without any white space.\n

    \n```css\nselector {\n  property: value; /* normal declaration */\n  property: value !important; /* important declaration (preferred) */\n  property: value ! important; /* important declaration (not preferred) */\n}\n```\n
    \n

    The !important comes after the value of the property value pair declaration, preceded by zero or more spaces. The important flag must be the last token in the declaration. In other words, there can be white space and comments between the flag and the declaration's ending semicolon, but nothing else." + "url": "$MDN_URL$/web/css/reference/values/important", + "doc": "A ! delimiter followed by the important keyword marks the declaration as important. The !important flag alters the rules selecting declarations inside the cascade. A declaration that is not important is called normal.\n

    To mark a declaration important, add the important flag (!important) after the value in the declaration. While white space is allowed between the delimiter and the keyword, the flag is generally written as !important without any white space.\n

    \n```css\nselector {\n  property: value; /* normal declaration */\n  property: value !important; /* important declaration (preferred) */\n  property: value ! important; /* important declaration (not preferred) */\n}\n```\n
    \n

    The !important comes after the value of the property value pair declaration, preceded by zero or more spaces. The important flag must be the last token in the declaration. In other words, there can be white space and comments between the flag and the declaration's ending semicolon, but nothing else." }, "initial-letter": { - "url": "$MDN_URL$/web/css/initial-letter", + "url": "$MDN_URL$/web/css/reference/properties/initial-letter", "status": [ "StandardTrack" ], @@ -13165,8 +13300,8 @@ "baseline": { "level": "NONE" }, - "doc": "The initial-letter CSS property sets the size and sink for dropped, raised, and sunken initial letters. This property applies to ::first-letter pseudo-elements and inline-level first children of block containers.", - "formalSyntax": "normal | <number [1,∞]> <integer [1,∞]> | <number [1,∞]> && [ drop | raise ]?", + "doc": "The initial-letter CSS property sets the size and sink for dropped, raised, and sunken initial letters. This property applies to ::first-letter pseudo-elements and inline-level first children of block containers.", + "formalSyntax": "normal | <number [1,∞]> <integer [1,∞]> | <number [1,∞]> && [ drop | raise ]?\n  <integer> = <number-token>", "values": { "normal": "No special initial-letter effect. Text behaves as normal.", "<number>": "Defines the size of the initial letter, in terms of how many lines it occupies. Negative values are not allowed.", @@ -13174,7 +13309,7 @@ } }, "inline-size": { - "url": "$MDN_URL$/web/css/inline-size", + "url": "$MDN_URL$/web/css/reference/properties/inline-size", "status": [ "StandardTrack" ], @@ -13193,11 +13328,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The inline-size CSS property defines the size of an element's block along the inline axis. If the writing-mode is horizontal, it corresponds to the width; if the writing mode is vertical, it corresponds to the height. A related property is block-size, which defines the other dimension of the element.", + "doc": "The inline-size CSS property defines the size of an element's block along the inline axis. If the writing-mode is horizontal, it corresponds to the width; if the writing mode is vertical, it corresponds to the height. A related property is block-size, which defines the other dimension of the element.", "formalSyntax": "<'width'>\n  <width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "inset": { - "url": "$MDN_URL$/web/css/inset", + "url": "$MDN_URL$/web/css/reference/properties/inset", "status": [ "StandardTrack" ], @@ -13216,11 +13351,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset CSS property is a shorthand that corresponds to the top, right, bottom, and/or left properties. It has the same multi-value syntax of the margin shorthand.\n

    This inset properties, including inset, have no effect on non-positioned elements.", + "doc": "The inset CSS property is a shorthand that corresponds to the top, right, bottom, and/or left properties. It has the same multi-value syntax of the margin shorthand.\n

    This inset properties, including inset, have no effect on non-positioned elements.", "formalSyntax": "<'top'>{1,4}\n  <top> = auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "inset-block": { - "url": "$MDN_URL$/web/css/inset-block", + "url": "$MDN_URL$/web/css/reference/properties/inset-block", "status": [ "StandardTrack" ], @@ -13239,11 +13374,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-block CSS property defines the logical block start and end offsets of an element, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-block CSS property defines the logical block start and end offsets of an element, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "<'top'>{1,2}\n  <top> = auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "inset-block-end": { - "url": "$MDN_URL$/web/css/inset-block-end", + "url": "$MDN_URL$/web/css/reference/properties/inset-block-end", "status": [ "StandardTrack" ], @@ -13262,11 +13397,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-block-end CSS property defines the logical block end offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-block-end CSS property defines the logical block end offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage>\n  <length-percentage> = <length> | <percentage>" }, "inset-block-start": { - "url": "$MDN_URL$/web/css/inset-block-start", + "url": "$MDN_URL$/web/css/reference/properties/inset-block-start", "status": [ "StandardTrack" ], @@ -13285,11 +13420,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-block-start CSS property defines the logical block start offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-block-start CSS property defines the logical block start offset of an element, which maps to a physical inset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage>\n  <length-percentage> = <length> | <percentage>" }, "inset-inline": { - "url": "$MDN_URL$/web/css/inset-inline", + "url": "$MDN_URL$/web/css/reference/properties/inset-inline", "status": [ "StandardTrack" ], @@ -13308,11 +13443,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-inline CSS property defines the logical start and end offsets of an element in the inline direction, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-inline CSS property defines the logical start and end offsets of an element in the inline direction, which maps to physical offsets depending on the element's writing mode, directionality, and text orientation. It corresponds to the top and bottom, or right and left properties depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "<'top'>{1,2}\n  <top> = auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "inset-inline-end": { - "url": "$MDN_URL$/web/css/inset-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/inset-inline-end", "status": [ "StandardTrack" ], @@ -13331,11 +13466,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-inline-end CSS property defines the logical inline end inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-inline-end CSS property defines the logical inline end inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage>\n  <length-percentage> = <length> | <percentage>" }, "inset-inline-start": { - "url": "$MDN_URL$/web/css/inset-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/inset-inline-start", "status": [ "StandardTrack" ], @@ -13354,17 +13489,18 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The inset-inline-start CSS property defines the logical inline start inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", + "doc": "The inset-inline-start CSS property defines the logical inline start inset of an element, which maps to a physical offset depending on the element's writing mode, directionality, and text orientation. It corresponds to the top, right, bottom, or left property depending on the values defined for writing-mode, direction, and text-orientation.\n

    This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage>\n  <length-percentage> = <length> | <percentage>" }, "interactivity": { - "url": "$MDN_URL$/web/css/interactivity", + "url": "$MDN_URL$/web/css/reference/properties/interactivity", "status": [ "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "135", + "ChromeAndroid": "135", "Edge": "135", "Opera": "120" }, @@ -13378,8 +13514,62 @@ "inert": "Selected elements and their descendants are inert." } }, + "interest-delay": { + "url": "$MDN_URL$/web/css/reference/properties/interest-delay", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "doc": "

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

    \n

    The interest-delay CSS property specifies the delay between the user showing interest in an interest invoker element and the interest event firing, and the delay between the user losing interest and the loseinterest event firing.", + "formalSyntax": "<'interest-delay-start'>{1,2}\n  <interest-delay-start> = normal | <time>", + "values": { + "normal": "Sets the delay to the browser's default delay. This is the initial value.", + "<time>": "Sets the delay to a specific duration. The value must be positive, otherwise the property becomes invalid." + } + }, + "interest-delay-end": { + "url": "$MDN_URL$/web/css/reference/properties/interest-delay-end", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "doc": "

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

    \n

    The interest-delay-end CSS property specifies the delay between the user losing interest in an interest invoker element and the loseinterest event firing.\n

    The interest-delay-end and interest-delay-start properties can both be set using the interest-delay shorthand.", + "formalSyntax": "normal | <time>", + "values": { + "normal": "Sets the delay to the browser's default delay. This is the initial value.", + "<time>": "Sets the delay to a specific duration. The value must be positive, otherwise the property becomes invalid." + } + }, + "interest-delay-start": { + "url": "$MDN_URL$/web/css/reference/properties/interest-delay-start", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "doc": "

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

    \n

    The interest-delay-start CSS property specifies the delay between the user showing interest in an interest invoker element and the interest event firing.\n

    The interest-delay-start and interest-delay-end properties can both be set using the interest-delay shorthand.", + "formalSyntax": "normal | <time>", + "values": { + "normal": "Sets the delay to the browser's default delay. This is the initial value.", + "<time>": "Sets the delay to a specific duration. The value must be positive, otherwise the property becomes invalid." + } + }, "interpolate-size": { - "url": "$MDN_URL$/web/css/interpolate-size", + "url": "$MDN_URL$/web/css/reference/properties/interpolate-size", "status": [ "Experimental", "StandardTrack" @@ -13393,15 +13583,15 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The interpolate-size CSS property allows you to enable animations and transitions between a <length-percentage> value and an intrinsic size value such as auto, fit-content, or max-content.\n

    This property is typically used to animate the width and/or height of a container between a <length-percentage> and the full size of its content (i.e., between \"closed\" and \"open\" or \"hide\" and \"reveal\" states) when animating a non-box-model CSS property, such as transform, is not a viable solution.\n

    \n

    Note:\nThe behavior opted-into by interpolate-size cannot be enabled by default across the web because many sites in the wild use stylesheets that assume intrinsic size values cannot be animated. Enabling it by default would cause several backwards-compatibility issues (see relevant CSS WG discussion).\n

    ", + "doc": "

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

    \n

    The interpolate-size CSS property allows you to enable animations and transitions between a <length-percentage> value and an intrinsic size, fit-content, or max-content.\n

    This property is typically used to animate the width and/or height of a container between a <length-percentage> and the full size of its content (i.e., between \"closed\" and \"open\" or \"hide\" and \"reveal\" states) when animating a non-box-model CSS property, such as transform, is not a viable solution.\n

    \n

    Note:\nThe behavior opted-into by interpolate-size cannot be enabled by default across the web because many sites in the wild use stylesheets that assume intrinsic size values cannot be animated. Enabling it by default would cause several backwards-compatibility issues (see relevant CSS WG discussion).\n

    ", "formalSyntax": "numeric-only | allow-keywords", "values": { - "allow-keywords": "Enables interpolation between a <length-percentage> value and an intrinsic size value, to allow animation between the two.", + "allow-keywords": "Enables interpolation between a <length-percentage> value and an intrinsic size value, to allow animation between the two.", "numeric-only": "The default behavior — intrinsic size values cannot be interpolated." } }, "isolation": { - "url": "$MDN_URL$/web/css/isolation", + "url": "$MDN_URL$/web/css/reference/properties/isolation", "status": [ "StandardTrack" ], @@ -13411,7 +13601,7 @@ "Edge": "79", "Firefox": "36", "FirefoxAndroid": "36", - "Opera": "30", + "Opera": "28", "Safari": "8", "SafariIOS": "8" }, @@ -13428,7 +13618,7 @@ } }, "justify-content": { - "url": "$MDN_URL$/web/css/justify-content", + "url": "$MDN_URL$/web/css/reference/properties/justify-content", "status": [ "StandardTrack" ], @@ -13467,23 +13657,29 @@ "flex-start": "The items are packed flush to each other toward the start edge of the alignment container on the flex container's main-start side.\nThis only applies to flex layout items. For items that are not children of a flex container, this value is treated like start.", "flex-end": "The items are packed flush to each other at the end edge of the alignment container on the flex container's main-end side.\nThis only applies to flex layout items. For items that are not children of a flex container, this value is treated like end.", "center": "The items are packed flush to each other toward the center of the alignment container along the main axis.", - "left": "The items are packed flush to each other toward the left edge of the alignment container. When the property's horizontal axis is not parallel with the inline axis, such as when flex-direction: column; is set, this value behaves like start.", + "left": "The items are packed flush to each other toward the left edge of the alignment container. When the property's horizontal axis is not parallel with the inline axis, such as when flex-direction: column; is set, this value behaves like start.", "right": "The items are packed flush to each other toward the right edge of the alignment container in the appropriate axis. If the property's axis is not parallel with the inline axis (in a grid container) or the main-axis (in a flexbox container), this value behaves like start.", - "normal": "Behaves as stretch, except in the case of multi-column containers with a non-auto column-width, in which case the columns take their specified column-width rather than stretching to fill the container. As stretch behaves as start in flex containers, normal also behaves as start.", + "normal": "Behaves as stretch, except in the case of multi-column containers with a non-auto column-width, in which case the columns take their specified column-width rather than stretching to fill the container. As stretch behaves as start in flex containers, normal also behaves as start.", "space-between": "The items are evenly distributed within the alignment container along the main axis. The spacing between each pair of adjacent items is the same. The first item is flush with the main-start edge, and the last item is flush with the main-end edge.", "space-around": "The items are evenly distributed within the alignment container along the main axis. The spacing between each pair of adjacent items is the same. The empty space before the first and after the last item equals half of the space between each pair of adjacent items. If there is only one item, it will be centered.", "space-evenly": "The items are evenly distributed within the alignment container along the main axis. The spacing between each pair of adjacent items, the main-start edge and the first item, and the main-end edge and the last item, are all exactly the same.", - "stretch": "If the combined size of the items along the main axis is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container along the main axis.\n
    \n

    Note:\nFor flexboxes, the stretch value behaves as flex-start or start. This is because, in flexboxes, stretching is controlled using the flex-grow property.\n

    ", + "stretch": "If the combined size of the items along the main axis is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container along the main axis.\n
    \n

    Note:\nFor flexboxes, the stretch value behaves as flex-start or start. This is because, in flexboxes, stretching is controlled using the flex-grow property.\n

    ", "safe": "If the item overflows the alignment container, then the item is aligned as if the alignment mode is start. The desired alignment will not be implemented.", "unsafe": "Even if the item overflows the alignment container, the desired alignment will be implemented. Unlike safe, which will ignore the desired alignment in favor of preventing overflow." } }, "justify-items": { - "url": "$MDN_URL$/web/css/justify-items", + "url": "$MDN_URL$/web/css/reference/properties/justify-items", "status": [ "StandardTrack" ], "compatibility": { + "block_context": { + "Chrome": "130", + "ChromeAndroid": "130", + "Edge": "130", + "Opera": "115" + }, "flex_context": { "Chrome": "52", "ChromeAndroid": "52", @@ -13510,8 +13706,8 @@ "lowDate": "2016-07-27", "highDate": "2019-01-27" }, - "doc": "The CSS justify-items property defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.", - "formalSyntax": "normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | legacy | legacy && [ left | right | center ] | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "doc": "The CSS justify-items property defines the default justify-self for all items of the box, giving them all a default way of justifying each box along the appropriate axis.", + "formalSyntax": "normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | legacy | legacy && [ left | right | center ] | anchor-center\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", "values": { "normal": "The effect of this keyword is dependent of the layout mode we are in:\n", "start": "The item is packed flush to each other toward the start edge of the alignment container in the appropriate axis.", @@ -13524,19 +13720,25 @@ "left": "The items are packed flush to each other toward the left edge of the alignment container. If the property's axis is not parallel with the inline axis, this value behaves like start.", "right": "The items are packed flush to each other toward the right edge of the alignment container in the appropriate axis. If the property's axis is not parallel with the inline axis, this value behaves like start.", "baseline
    \nfirst baseline
    \nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", - "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", - "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", + "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", + "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", "safe": "If the size of the item overflows the alignment container, the item is instead aligned as if the alignment mode were start.", "unsafe": "Regardless of the relative sizes of the item and alignment container, the given alignment value is honored.", "legacy": "Makes the value inherited by the box descendants. Note that if a descendant has a justify-self: auto value, the legacy keyword is not considered by the descend, only the left, right, or center value associated to it." } }, "justify-self": { - "url": "$MDN_URL$/web/css/justify-self", + "url": "$MDN_URL$/web/css/reference/properties/justify-self", "status": [ "StandardTrack" ], "compatibility": { + "block_context": { + "Chrome": "130", + "ChromeAndroid": "130", + "Edge": "130", + "Opera": "115" + }, "grid_context": { "Chrome": "57", "ChromeAndroid": "57", @@ -13562,7 +13764,7 @@ "highDate": "2020-04-17" }, "doc": "The CSS justify-self property sets the way a box is justified inside its alignment container along the appropriate axis.", - "formalSyntax": "auto | normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "formalSyntax": "auto | <overflow-position>? [ normal | <self-position> | left | right ] | stretch | <baseline-position> | anchor-center\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end\n  <baseline-position> = [ first | last ]? &&baseline", "values": { "auto": "The value used is the value of the justify-items property of the parents box, unless the box has no parent, or is absolutely positioned, in these cases, auto represents normal.", "normal": "The effect of this keyword is dependent of the layout mode we are in:\n", @@ -13576,14 +13778,14 @@ "left": "The items are packed flush to each other toward the left edge of the alignment container. If the property's axis is not parallel with the inline axis, this value behaves like start.", "right": "The items are packed flush to each other toward the right edge of the alignment container in the appropriate axis. If the property's axis is not parallel with the inline axis, this value behaves like start.", "baseline
    \nfirst baseline
    \nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", - "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", - "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", + "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", + "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", "safe": "If the size of the item overflows the alignment container, the item is instead aligned as if the alignment mode were start.", "unsafe": "Regardless of the relative sizes of the item and alignment container, the given alignment value is honored." } }, "left": { - "url": "$MDN_URL$/web/css/left", + "url": "$MDN_URL$/web/css/reference/properties/left", "status": [ "StandardTrack" ], @@ -13602,16 +13804,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The left CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements.", + "doc": "The left CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "A negative, null, or positive <length>:\n", - "<percentage>": "A <percentage> of the containing block's width.", - "auto": "Specifies that:\n" + "<length>": "A negative, null, or positive <length>:\n", + "<percentage>": "A <percentage> of the containing block's width.", + "auto": "Specifies that:\n" } }, "letter-spacing": { - "url": "$MDN_URL$/web/css/letter-spacing", + "url": "$MDN_URL$/web/css/reference/properties/letter-spacing", "status": [ "StandardTrack" ], @@ -13638,7 +13840,7 @@ } }, "lighting-color": { - "url": "$MDN_URL$/web/css/lighting-color", + "url": "$MDN_URL$/web/css/reference/properties/lighting-color", "status": [ "StandardTrack" ], @@ -13660,11 +13862,11 @@ "doc": "The lighting-color CSS property defines the color of the light source for the <feDiffuseLighting> and <feSpecularLighting> SVG lighting filter primitives within an SVG <filter>. If present, it overrides the element's lighting-color attribute.\n
    \n

    Note:\nThe lighting-color property only applies to <feDiffuseLighting> and <feSpecularLighting> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "<color>", "values": { - "<color>": "The lighting's color. This can be any valid CSS <color> value." + "<color>": "The lighting's color. This can be any valid CSS <color> value." } }, "line-break": { - "url": "$MDN_URL$/web/css/line-break", + "url": "$MDN_URL$/web/css/reference/properties/line-break", "status": [ "StandardTrack" ], @@ -13690,11 +13892,11 @@ "loose": "Break text using the least restrictive line break rule. Typically used for short lines, such as in newspapers.", "normal": "Break text using the most common line break rule.", "strict": "Break text using the most stringent line break rule.", - "anywhere": "There is a soft wrap opportunity around every typographic character unit, including around any punctuation character or preserved white spaces, or in the middle of words, disregarding any prohibition against line breaks, even those introduced by characters with the GL, WJ, or ZWJ character class or mandated by the word-break property. The different wrapping opportunities must not be prioritized. Hyphenation is not applied." + "anywhere": "There is a soft wrap opportunity around every typographic character unit, including around any punctuation character or preserved white spaces, or in the middle of words, disregarding any prohibition against line breaks, even those introduced by characters with the GL, WJ, or ZWJ character class or mandated by the word-break property. The different wrapping opportunities must not be prioritized. Hyphenation is not applied." } }, "line-clamp": { - "url": "$MDN_URL$/web/css/line-clamp", + "url": "$MDN_URL$/web/css/reference/properties/line-clamp", "status": [ "StandardTrack" ], @@ -13702,15 +13904,15 @@ "baseline": { "level": "NONE" }, - "doc": "The line-clamp CSS property allows limiting of the contents of a block to the specified number of lines.\n
    \n

    Note:\nFor legacy support, the vendor-prefixed -webkit-line-clamp property only works in combination with the display property set to -webkit-box or -webkit-inline-box and the -webkit-box-orient property set to vertical. Despite these prefixed properties being deprecated, the co-dependency of these three properties is a fully specified behavior and will continue to be supported.\n

    \n

    In most cases you will also want to set overflow to hidden, otherwise the contents won't be clipped but an ellipsis will still be shown after the specified number of lines.\n

    When applied to anchor elements, the truncating can happen in the middle of the text, not necessarily at the end.", - "formalSyntax": "none | [ <integer [1,∞]> || <'block-ellipsis'> ] -webkit-legacy?\n  <block-ellipsis> = no-ellipsis | auto | <string>", + "doc": "The line-clamp CSS property allows limiting of the contents of a block to the specified number of lines.\n

    \n

    Note:\nFor legacy support, the vendor-prefixed -webkit-line-clamp property only works in combination with the display property set to -webkit-box or -webkit-inline-box and the -webkit-box-orient property set to vertical. Despite these prefixed properties being deprecated, the co-dependency of these three properties is a fully specified behavior and will continue to be supported.\n

    \n

    In most cases you will also want to set overflow to hidden, otherwise the contents won't be clipped but an ellipsis will still be shown after the specified number of lines.\n

    When applied to anchor elements, the truncating can happen in the middle of the text, not necessarily at the end.", + "formalSyntax": "none | [ <integer [1,∞]> || <'block-ellipsis'> ] -webkit-legacy?\n  <integer> = <number-token>\n  <block-ellipsis> = no-ellipsis | auto | <string>", "values": { "none": "This value specifies that the content won't be clamped.", "<integer>": "This value specifies the number of lines after which the content will be clamped. It must be greater than 0." } }, "line-height": { - "url": "$MDN_URL$/web/css/line-height", + "url": "$MDN_URL$/web/css/reference/properties/line-height", "status": [ "StandardTrack" ], @@ -13729,25 +13931,25 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The line-height CSS property sets the height of a line box in horizontal writing modes. In vertical writing modes, it sets the width of a line box. It's commonly used to set the distance between lines of text. On block-level elements in horizontal writing modes, it specifies the preferred height of line boxes within the element, and on non-replaced inline elements, it specifies the height that is used to calculate line box height.", + "doc": "The line-height CSS property sets the height of a line box in horizontal writing modes. In vertical writing modes, it sets the width of a line box. It's commonly used to set the distance between lines of text. On block-level elements in horizontal writing modes, it specifies the preferred height of line boxes within the element, and on non-replaced inline elements, it specifies the height that is used to calculate line box height.", "formalSyntax": "normal | <number [0,∞]> | <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "normal": "Depends on the user agent. Desktop browsers (including Firefox) use a default value of roughly 1.2, depending on the element's font-family.", - "<number> (unitless)": "The used value is this unitless <number> multiplied by the element's own font size. The computed value is the same as the specified <number>. In most cases, this is the preferred way to set line-height and avoid unexpected results due to inheritance.", - "<length>": "The specified <length> is used in the calculation of the line box height. Values given in em units may produce unexpected results (see example below).", - "<percentage>": "Relative to the font size of the element itself. The computed value is this <percentage> multiplied by the element's computed font size. Percentage values may produce unexpected results (see the second example below)." + "<number> (unitless)": "The used value is this unitless <number> multiplied by the element's own font size. The computed value is the same as the specified <number>. In most cases, this is the preferred way to set line-height and avoid unexpected results due to inheritance.", + "<length>": "The specified <length> is used in the calculation of the line box height. Values given in em units may produce unexpected results (see example below).", + "<percentage>": "Relative to the font size of the element itself. The computed value is this <percentage> multiplied by the element's computed font size. Percentage values may produce unexpected results (see the second example below)." } }, "line-height-step": { - "url": "$MDN_URL$/web/css/line-height-step", + "url": "$MDN_URL$/web/css/reference/properties/line-height-step", "doc": "

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

    \n

    The line-height-step CSS property sets the step unit for line box heights. When the property is set, line box heights are rounded up to the closest multiple of the unit.", "formalSyntax": "<length [0,∞]>", "values": { - "<length>": "The specified <length> is used in the calculation of the line box height step." + "<length>": "The specified <length> is used in the calculation of the line box height step." } }, "list-style": { - "url": "$MDN_URL$/web/css/list-style", + "url": "$MDN_URL$/web/css/reference/properties/list-style", "status": [ "StandardTrack" ], @@ -13766,17 +13968,17 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The list-style CSS shorthand property allows you to set all the list style properties at once.", - "formalSyntax": "<'list-style-position'> || <'list-style-image'> || <'list-style-type'>\n  <list-style-position> = inside | outside\n  <list-style-image> = <image> | none\n  <list-style-type> = <counter-style> | <string> | none\n  <image> = <url> | <gradient>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <url> = <url()> | <src()>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed", + "doc": "The list-style CSS shorthand property allows you to set all the list style properties at once.", + "formalSyntax": "<'list-style-position'> || <'list-style-image'> || <'list-style-type'>\n  <list-style-position> = inside | outside\n  <list-style-image> = <image> | none\n  <list-style-type> = <counter-style> | <string> | none\n  <image> = <url> | <gradient>\n  <counter-style> = <counter-style-name> | <symbols()>\n  <url> = <url()> | <src()>\n  <counter-style-name> = <custom-ident>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed", "values": { - "list-style-type": "A <counter-style>, <string>, or none. If omitted in the shorthand, the default disc value is used. See list-style-type.", - "list-style-image": "An <image> or none. If omitted, the default none value is used. See list-style-image.", - "list-style-position": "Either inside or outside. If omitted, the default outside value is used. See list-style-position.", + "list-style-type": "A <counter-style>, <string>, or none. If omitted in the shorthand, the default disc value is used. See list-style-type.", + "list-style-image": "An <image> or none. If omitted, the default none value is used. See list-style-image.", + "list-style-position": "Either inside or outside. If omitted, the default outside value is used. See list-style-position.", "none": "No list style is used." } }, "list-style-image": { - "url": "$MDN_URL$/web/css/list-style-image", + "url": "$MDN_URL$/web/css/reference/properties/list-style-image", "status": [ "StandardTrack" ], @@ -13795,15 +13997,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The list-style-image CSS property sets an image to be used as the list item marker.\n

    It is often more convenient to use the shorthand list-style.", + "doc": "The list-style-image CSS property sets an image to be used as the list item marker.\n

    It is often more convenient to use the shorthand list-style.", "formalSyntax": "<image> | none\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "<image>": "A valid image to use as the marker.", - "none": "Specifies that no image is used as the marker. If this value is set, the marker defined in list-style-type will be used instead. This is the default value for list-style." + "none": "Specifies that no image is used as the marker. If this value is set, the marker defined in list-style-type will be used instead. This is the default value for list-style." } }, "list-style-position": { - "url": "$MDN_URL$/web/css/list-style-position", + "url": "$MDN_URL$/web/css/reference/properties/list-style-position", "status": [ "StandardTrack" ], @@ -13822,15 +14024,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The list-style-position CSS property sets the position of the ::marker relative to a list item.", + "doc": "The list-style-position CSS property sets the position of the ::marker relative to a list item.", "formalSyntax": "inside | outside", "values": { - "inside": "The ::marker is the first element among the list item's contents.", - "outside": "The ::marker is outside the principal block box. This is the default value for list-style." + "inside": "The ::marker is the first element among the list item's contents.", + "outside": "The ::marker is outside the principal block box. This is the default value for list-style." } }, "list-style-type": { - "url": "$MDN_URL$/web/css/list-style-type", + "url": "$MDN_URL$/web/css/reference/properties/list-style-type", "status": [ "StandardTrack" ], @@ -13850,9 +14052,9 @@ "highDate": "2018-01-29" }, "doc": "The list-style-type CSS property sets the marker (such as a disc, character, or custom counter style) of a list item element.", - "formalSyntax": "<counter-style> | <string> | none\n  <counter-style> = <counter-style-name> | <symbols()>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "formalSyntax": "<counter-style> | <string> | none\n  <counter-style> = <counter-style-name> | <symbols()>\n  <counter-style-name> = <custom-ident>\n  <symbols()> = symbols( <symbols-type>? [ <string> | <image> ]+ )\n  <symbols-type> = cyclic | numeric | alphabetic | symbolic | fixed\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<custom-ident>": "An identifier matching the value of a @counter-style or one of the predefined styles:", + "<custom-ident>": "An identifier matching the value of a @counter-style or one of the predefined styles:", "symbols()": "Defines an anonymous style of the list.", "<string>": "The specified string will be used as the item's marker.", "none": "No item marker is shown.", @@ -13911,7 +14113,7 @@ } }, "margin": { - "url": "$MDN_URL$/web/css/margin", + "url": "$MDN_URL$/web/css/reference/properties/margin", "status": [ "StandardTrack" ], @@ -13930,16 +14132,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The margin CSS shorthand property sets the margin area on all four sides of an element.", + "doc": "The margin CSS shorthand property sets the margin area on all four sides of an element.", "formalSyntax": "<'margin-top'>{1,4}\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "The size of the margin as a fixed value.\n

    ", - "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", + "<length>": "The size of the margin as a fixed value.\n", + "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", "auto": "The browser selects a suitable margin to use. For example, in certain cases this value can be used to center an element." } }, "margin-block": { - "url": "$MDN_URL$/web/css/margin-block", + "url": "$MDN_URL$/web/css/reference/properties/margin-block", "status": [ "StandardTrack" ], @@ -13958,11 +14160,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The margin-block CSS shorthand property defines the logical block start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.", + "doc": "The margin-block CSS shorthand property defines the logical block start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.", "formalSyntax": "<'margin-top'>{1,2}\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-block-end": { - "url": "$MDN_URL$/web/css/margin-block-end", + "url": "$MDN_URL$/web/css/reference/properties/margin-block-end", "status": [ "StandardTrack" ], @@ -13985,7 +14187,7 @@ "formalSyntax": "<'margin-top'>\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-block-start": { - "url": "$MDN_URL$/web/css/margin-block-start", + "url": "$MDN_URL$/web/css/reference/properties/margin-block-start", "status": [ "StandardTrack" ], @@ -14008,7 +14210,7 @@ "formalSyntax": "<'margin-top'>\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-bottom": { - "url": "$MDN_URL$/web/css/margin-bottom", + "url": "$MDN_URL$/web/css/reference/properties/margin-bottom", "status": [ "StandardTrack" ], @@ -14027,16 +14229,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The margin-bottom CSS property sets the margin area on the bottom of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", + "doc": "The margin-bottom CSS property sets the margin area on the bottom of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", "formalSyntax": "<length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "The size of the margin as a fixed value.\n", - "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", - "auto": "The browser selects a suitable value to use. See margin." + "<length>": "The size of the margin as a fixed value.\n", + "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", + "auto": "The browser selects a suitable value to use. See margin." } }, "margin-inline": { - "url": "$MDN_URL$/web/css/margin-inline", + "url": "$MDN_URL$/web/css/reference/properties/margin-inline", "status": [ "StandardTrack" ], @@ -14055,11 +14257,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The margin-inline CSS shorthand property is a shorthand property that defines both the logical inline start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.", + "doc": "The margin-inline CSS shorthand property is a shorthand property that defines both the logical inline start and end margins of an element, which maps to physical margins depending on the element's writing mode, directionality, and text orientation.", "formalSyntax": "<'margin-top'>{1,2}\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-inline-end": { - "url": "$MDN_URL$/web/css/margin-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/margin-inline-end", "status": [ "StandardTrack" ], @@ -14078,11 +14280,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The margin-inline-end CSS property defines the logical inline end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. In other words, it corresponds to the margin-top, margin-right, margin-bottom or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The margin-inline-end CSS property defines the logical inline end margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. In other words, it corresponds to the margin-top, margin-right, margin-bottom or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<'margin-top'>\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-inline-start": { - "url": "$MDN_URL$/web/css/margin-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/margin-inline-start", "status": [ "StandardTrack" ], @@ -14101,11 +14303,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The margin-inline-start CSS property defines the logical inline start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. It corresponds to the margin-top, margin-right, margin-bottom, or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.", + "doc": "The margin-inline-start CSS property defines the logical inline start margin of an element, which maps to a physical margin depending on the element's writing mode, directionality, and text orientation. It corresponds to the margin-top, margin-right, margin-bottom, or margin-left property depending on the values defined for writing-mode, direction, and text-orientation.", "formalSyntax": "<'margin-top'>\n  <margin-top> = <length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline" }, "margin-left": { - "url": "$MDN_URL$/web/css/margin-left", + "url": "$MDN_URL$/web/css/reference/properties/margin-left", "status": [ "StandardTrack" ], @@ -14124,16 +14326,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The margin-left CSS property sets the margin area on the left side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", + "doc": "The margin-left CSS property sets the margin area on the left side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", "formalSyntax": "<length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "The size of the margin as a fixed value.\n", - "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", - "auto": "The left margin receives a share of the unused horizontal space, as determined mainly by the layout mode that is used. If the values of margin-left and margin-right are both auto, the calculated space is evenly distributed. This table summarizes the different cases:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Value of displayValue of floatValue of positionComputed value of autoComment
    \ninline, inline-block,\ninline-table\nanystatic or relative0Inline layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nanystatic or relative\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the element inside its parent.\nBlock layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nleft or rightstatic or relative0Block layout mode (floating element)
    \nany table-*, except table-caption\nanyany0\nInternal table-* elements don't have margins, use\nborder-spacing instead\n
    \nany, except flex, inline-flex, or table-*\nany\nfixed or absolute\n\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the border area inside the available\nwidth, if fixed.\nAbsolutely positioned layout mode
    flex, inline-flexanyany\n0, except if there is any positive horizontal free space.\nIn this case, it is evenly distributed to all horizontal\nauto margins.\nFlexbox layout mode
    " + "<length>": "The size of the margin as a fixed value.\n", + "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", + "auto": "The left margin receives a share of the unused horizontal space, as determined mainly by the layout mode that is used. If the values of margin-left and margin-right are both auto, the calculated space is evenly distributed. This table summarizes the different cases:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Value of displayValue of floatValue of positionComputed value of autoComment
    \ninline, inline-block,\ninline-table\nanystatic or relative0Inline layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nanystatic or relative\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the element inside its parent.\nBlock layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nleft or rightstatic or relative0Block layout mode (floating element)
    \nany table-*, except table-caption\nanyany0\nInternal table-* elements don't have margins, use\nborder-spacing instead\n
    \nany, except flex, inline-flex, or table-*\nany\nfixed or absolute\n\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the border area inside the available\nwidth, if fixed.\nAbsolutely positioned layout mode
    flex, inline-flexanyany\n0, except if there is any positive horizontal free space.\nIn this case, it is evenly distributed to all horizontal\nauto margins.\nFlexbox layout mode
    " } }, "margin-right": { - "url": "$MDN_URL$/web/css/margin-right", + "url": "$MDN_URL$/web/css/reference/properties/margin-right", "status": [ "StandardTrack" ], @@ -14152,16 +14354,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The margin-right CSS property sets the margin area on the right side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", + "doc": "The margin-right CSS property sets the margin area on the right side of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", "formalSyntax": "<length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "The size of the margin as a fixed value.\n", - "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", - "auto": "The right margin receives a share of the unused horizontal space, as determined mainly by the layout mode that is used. If the values of margin-left and margin-right are both auto, the calculated space is evenly distributed. This table summarizes the different cases:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Value of displayValue of floatValue of positionComputed value of autoComment
    \ninline, inline-block,\ninline-table\nanystatic or relative0Inline layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nanystatic or relative\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the element inside its parent.\nBlock layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nleft or rightstatic or relative0Block layout mode (floating element)
    \nany table-*, except table-caption\nanyany0\nInternal table-* elements don't have margins, use\nborder-spacing instead\n
    \nany, except flex, inline-flex, or table-*\nany\nfixed or absolute\n\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the border area inside the available\nwidth, if fixed.\nAbsolutely positioned layout mode
    flex, inline-flexanyany\n0, except if there is any positive horizontal free space.\nIn this case, it is evenly distributed to all horizontal\nauto margins.\nFlexbox layout mode
    " + "<length>": "The size of the margin as a fixed value.\n", + "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", + "auto": "The right margin receives a share of the unused horizontal space, as determined mainly by the layout mode that is used. If the values of margin-left and margin-right are both auto, the calculated space is evenly distributed. This table summarizes the different cases:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Value of displayValue of floatValue of positionComputed value of autoComment
    \ninline, inline-block,\ninline-table\nanystatic or relative0Inline layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nanystatic or relative\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the element inside its parent.\nBlock layout mode
    \nblock, inline, inline-block,\nblock, table, inline-table,\nlist-item, table-caption\nleft or rightstatic or relative0Block layout mode (floating element)
    \nany table-*, except table-caption\nanyany0\nInternal table-* elements don't have margins, use\nborder-spacing instead\n
    \nany, except flex, inline-flex, or table-*\nany\nfixed or absolute\n\n0, except if both margin-left and\nmargin-right are set to auto. In this case, it\nis set to the value centering the border area inside the available\nwidth, if fixed.\nAbsolutely positioned layout mode
    flex, inline-flexanyany\n0, except if there is any positive horizontal free space.\nIn this case, it is evenly distributed to all horizontal\nauto margins.\nFlexbox layout mode
    " } }, "margin-top": { - "url": "$MDN_URL$/web/css/margin-top", + "url": "$MDN_URL$/web/css/reference/properties/margin-top", "status": [ "StandardTrack" ], @@ -14180,16 +14382,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The margin-top CSS property sets the margin area on the top of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", + "doc": "The margin-top CSS property sets the margin area on the top of an element. A positive value places it farther from its neighbors, while a negative value places it closer.", "formalSyntax": "<length-percentage> | auto | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "The size of the margin as a fixed value.\n", - "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", - "auto": "The browser selects a suitable value to use. See margin." + "<length>": "The size of the margin as a fixed value.\n", + "<percentage>": "The size of the margin as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block.", + "auto": "The browser selects a suitable value to use. See margin." } }, "margin-trim": { - "url": "$MDN_URL$/web/css/margin-trim", + "url": "$MDN_URL$/web/css/reference/properties/margin-trim", "status": [ "Experimental", "StandardTrack" @@ -14214,7 +14416,7 @@ } }, "marker": { - "url": "$MDN_URL$/web/css/marker", + "url": "$MDN_URL$/web/css/reference/properties/marker", "status": [ "StandardTrack" ], @@ -14233,15 +14435,15 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The marker CSS property points to a marker that will be drawn on the first, middle, and last vertices of the element's path; that is, at all of its vertices. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-start, marker, and marker-end attributes in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are in the same place: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not point in the same direction.\n

    For the middle vertices, the direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions.\n

    \n

    Note:\nThe marker property will only have an effect for elements that can use SVG markers. See marker-start for a list.\n

    ", + "doc": "The marker CSS property points to a marker that will be drawn on the first, middle, and last vertices of the element's path; that is, at all of its vertices. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-start, marker, and marker-end attributes in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are in the same place: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not point in the same direction.\n

    For the middle vertices, the direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions.\n

    \n

    Note:\nThe marker property will only have an effect for elements that can use SVG markers. See marker-start for a list.\n

    ", "formalSyntax": "none | <marker-ref>\n  <marker-ref> = <url>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "This means no marker will be drawn at each vertex of the element's path.", - "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at each vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's vertices." + "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at each vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's vertices." } }, "marker-end": { - "url": "$MDN_URL$/web/css/marker-end", + "url": "$MDN_URL$/web/css/reference/properties/marker-end", "status": [ "StandardTrack" ], @@ -14260,15 +14462,15 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The marker-end CSS property points to a marker that will be drawn on the last vertex of the element's path; that is, at its ending vertex. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-end attribute in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are the same point: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not face the same direction.\n

    \n

    Note:\nThe marker-end property will only have an effect for elements that can use SVG markers. See marker-end for a list.\n

    ", + "doc": "The marker-end CSS property points to a marker that will be drawn on the last vertex of the element's path; that is, at its ending vertex. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-end attribute in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are the same point: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not face the same direction.\n

    \n

    Note:\nThe marker-end property will only have an effect for elements that can use SVG markers. See marker-end for a list.\n

    ", "formalSyntax": "none | <marker-ref>\n  <marker-ref> = <url>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "This means no marker will be drawn at the last vertex of the element's path.", - "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at the last vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's last vertex." + "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at the last vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's last vertex." } }, "marker-mid": { - "url": "$MDN_URL$/web/css/marker-mid", + "url": "$MDN_URL$/web/css/reference/properties/marker-mid", "status": [ "StandardTrack" ], @@ -14287,15 +14489,15 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The marker-mid CSS property points to a marker that will be drawn on the middle vertices of the element's path; that is, at each of its vertices between the start and end vertices. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-mid attribute in the SVG.\n

    The direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions.\n

    \n

    Note:\nThe marker-mid property will only have an effect for elements that can use SVG markers. See marker-mid for a list.\n

    ", + "doc": "The marker-mid CSS property points to a marker that will be drawn on the middle vertices of the element's path; that is, at each of its vertices between the start and end vertices. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-mid attribute in the SVG.\n

    The direction each marker points is defined as the direction halfway between the direction at the end of the preceding path segment and the direction of the start of the following path segment. This can be thought of as the cross product of the vectors defined by the two path directions.\n

    \n

    Note:\nThe marker-mid property will only have an effect for elements that can use SVG markers. See marker-mid for a list.\n

    ", "formalSyntax": "none | <marker-ref>\n  <marker-ref> = <url>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "This means no marker will be drawn at each middle vertex of the element's path.", - "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at each middle vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's middle vertices." + "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at each middle vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's middle vertices." } }, "marker-start": { - "url": "$MDN_URL$/web/css/marker-start", + "url": "$MDN_URL$/web/css/reference/properties/marker-start", "status": [ "StandardTrack" ], @@ -14314,15 +14516,15 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The marker-start CSS property points to a marker that will be drawn on the first vertex of the element's path; that is, at its starting vertex. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-start attribute in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are in the same place: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not point in the same direction.\n

    \n

    Note:\nThe marker-start property will only have an effect for elements that can use SVG markers. See marker-start for a list.\n

    ", + "doc": "The marker-start CSS property points to a marker that will be drawn on the first vertex of the element's path; that is, at its starting vertex. The marker must have been defined using an SVG <marker> element, and can only be referenced with a <url> value. The value of the CSS property overrides any values of the marker-start attribute in the SVG.\n

    For many marker-supporting shapes, the first and last vertices are in the same place: for example, the top left corner of a <rect>. In such shapes, if both the first and last markers are defined, two markers will be drawn at that point, though they may not point in the same direction.\n

    \n

    Note:\nThe marker-start property will only have an effect for elements that can use SVG markers. See marker-start for a list.\n

    ", "formalSyntax": "none | <marker-ref>\n  <marker-ref> = <url>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "This means no marker will be drawn at the first vertex of the element's path.", - "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at the first vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's first vertex." + "<marker-ref>": "A <url> that refers to a marker defined by an SVG <marker> element, to be drawn at the first vertex of the element's path. If the URL reference is invalid, no marker will be drawn at the path's first vertex." } }, "mask": { - "url": "$MDN_URL$/web/css/mask", + "url": "$MDN_URL$/web/css/reference/properties/mask", "status": [ "StandardTrack" ], @@ -14340,14 +14542,14 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask CSS shorthand property hides an element (partially or fully) by masking or clipping a specified area of the image. It is a shorthand for all the mask-* properties. The property accepts one or more comma-separated values, where each value corresponds to a <mask-layer>.", + "doc": "The mask CSS shorthand property hides an element (partially or fully) by masking or clipping a specified area of the image. It is a shorthand for all the mask-* properties. The property accepts one or more comma-separated values, where each value corresponds to a <mask-layer>.", "formalSyntax": "<mask-layer>#\n  <mask-layer> = <mask-reference> || <position> [ / <bg-size> ]? || <repeat-style> || <geometry-box> || [ <geometry-box> | no-clip ] || <compositing-operator> || <masking-mode>\n  <mask-reference> = none | <image> | <mask-source>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <bg-size> = [ <length-percentage [0,∞]> | auto ]{1,2} | cover | contain\n  <repeat-style> = repeat-x | repeat-y | [ repeat | space | round | no-repeat ]{1,2}\n  <geometry-box> = <shape-box> | fill-box | stroke-box | view-box\n  <compositing-operator> = add | subtract | intersect | exclude\n  <masking-mode> = alpha | luminance | match-source\n  <image> = <url> | <gradient>\n  <mask-source> = <url>\n  <length-percentage> = <length> | <percentage>\n  <shape-box> = <visual-box> | margin-box | half-border-box\n  <url> = <url()> | <src()>\n  <visual-box> = content-box | padding-box | border-box\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<mask-layer>": "One or more comma-separated mask layers, consisting of the following components:\n
    \n
    <mask-reference>
    \n
    \n

    Sets the mask image source. See mask-image.\n

    \n
    <masking-mode>
    \n
    \n

    Sets the masking mode of the mask image. See mask-mode.\n

    \n
    <position>
    \n
    \n

    Sets the position of the mask image. See mask-position.\n

    \n
    <bg-size>
    \n
    \n

    Sets the size of the mask image. See mask-size.\n

    \n
    <repeat-style>
    \n
    \n

    Sets the repetition of the mask image. See mask-repeat.\n

    \n
    <geometry-box>
    \n
    \n

    If only one <geometry-box> value is given, it sets both the mask-origin and mask-clip property values. If two <geometry-box> values are present, the first defines the mask-origin and the second defines the mask-clip.\n

    \n
    <geometry-box> | no-clip
    \n
    \n

    Sets the area affected by the mask image. See mask-clip.\n

    \n
    <compositing-operator>
    \n
    \n

    Sets the compositing operation used on the current mask layer. See mask-composite.\n

    \n
    " + "<mask-layer>": "One or more comma-separated mask layers, consisting of the following components:\n
    \n
    <mask-reference>
    \n
    \n

    Sets the mask image source. See mask-image.\n

    \n
    <masking-mode>
    \n
    \n

    Sets the masking mode of the mask image. See mask-mode.\n

    \n
    <position>
    \n
    \n

    Sets the position of the mask image. See mask-position.\n

    \n
    <bg-size>
    \n
    \n

    Sets the size of the mask image. See mask-size.\n

    \n
    <repeat-style>
    \n
    \n

    Sets the repetition of the mask image. See mask-repeat.\n

    \n
    <geometry-box>
    \n
    \n

    If only one <geometry-box> value is given, it sets both the mask-origin and mask-clip property values. If two <geometry-box> values are present, the first defines the mask-origin and the second defines the mask-clip.\n

    \n
    <geometry-box> | no-clip
    \n
    \n

    Sets the area affected by the mask image. See mask-clip.\n

    \n
    <compositing-operator>
    \n
    \n

    Sets the compositing operation used on the current mask layer. See mask-composite.\n

    \n
    " } }, "mask-border": { - "url": "$MDN_URL$/web/css/mask-border", + "url": "$MDN_URL$/web/css/reference/properties/mask-border", "status": [ "StandardTrack" ], @@ -14358,20 +14560,20 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border CSS shorthand property lets you create a mask along the edge of an element's border.", + "doc": "The mask-border CSS shorthand property lets you create a mask along the edge of an element's border.", "formalSyntax": "<'mask-border-source'> || <'mask-border-slice'> [ / <'mask-border-width'>? [ / <'mask-border-outset'> ]? ]? || <'mask-border-repeat'> || <'mask-border-mode'>\n  <mask-border-source> = none | <image>\n  <mask-border-slice> = [ <number> | <percentage> ]{1,4} fill?\n  <mask-border-width> = [ <length-percentage> | <number> | auto ]{1,4}\n  <mask-border-outset> = [ <length> | <number> ]{1,4}\n  <mask-border-repeat> = [ stretch | repeat | round | space ]{1,2}\n  <mask-border-mode> = luminance | alpha\n  <image> = <url> | <gradient>\n  <length-percentage> = <length> | <percentage>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { - "<'mask-border-source'>": "The source image. See mask-border-source.", - "<'mask-border-slice'>": "The dimensions for slicing the source image into regions. Up to four values may be specified. See mask-border-slice.", - "<'mask-border-width'>": "The width of the border mask. Up to four values may be specified. See mask-border-width.", - "<'mask-border-outset'>": "The distance of the border mask from the element's outside edge. Up to four values may be specified. See mask-border-outset.", - "<'mask-border-repeat'>": "Defines how the edge regions of the source image are adjusted to fit the dimensions of the border mask. Up to two values may be specified. See mask-border-repeat.", - "<'mask-border-mode'>": "Defines whether the source image is treated as a luminance mask or alpha mask. See mask-border-mode." + "<'mask-border-source'>": "The source image. See mask-border-source.", + "<'mask-border-slice'>": "The dimensions for slicing the source image into regions. Up to four values may be specified. See mask-border-slice.", + "<'mask-border-width'>": "The width of the border mask. Up to four values may be specified. See mask-border-width.", + "<'mask-border-outset'>": "The distance of the border mask from the element's outside edge. Up to four values may be specified. See mask-border-outset.", + "<'mask-border-repeat'>": "Defines how the edge regions of the source image are adjusted to fit the dimensions of the border mask. Up to two values may be specified. See mask-border-repeat.", + "<'mask-border-mode'>": "Defines whether the source image is treated as a luminance mask or alpha mask. See mask-border-mode." } }, "mask-border-mode": { - "url": "$MDN_URL$/web/css/mask-border-mode", - "doc": "The mask-border-mode CSS property specifies the blending mode used in a mask border.", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-mode", + "doc": "The mask-border-mode CSS property specifies the blending mode used in a mask border.", "formalSyntax": "luminance | alpha", "values": { "luminance": "The luminance values of the mask border image are used as the mask values.", @@ -14379,7 +14581,7 @@ } }, "mask-border-outset": { - "url": "$MDN_URL$/web/css/mask-border-outset", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-outset", "status": [ "StandardTrack" ], @@ -14390,15 +14592,15 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border-outset CSS property specifies the distance by which an element's mask border is set out from its border box.", + "doc": "The mask-border-outset CSS property specifies the distance by which an element's mask border is set out from its border box.", "formalSyntax": "[ <length> | <number> ]{1,4}", "values": { "<length>": "The size of the mask border outset as a dimension.", - "<number>": "The size of the mask border outset as a multiple of the corresponding border-width." + "<number>": "The size of the mask border outset as a multiple of the corresponding border-width." } }, "mask-border-repeat": { - "url": "$MDN_URL$/web/css/mask-border-repeat", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-repeat", "status": [ "StandardTrack" ], @@ -14409,7 +14611,7 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border-repeat CSS property specifies how the images for the sides and the middle part of the mask border image are scaled and tiled.", + "doc": "The mask-border-repeat CSS property specifies how the images for the sides and the middle part of the mask border image are scaled and tiled.", "formalSyntax": "[ stretch | repeat | round | space ]{1,2}", "values": { "stretch": "The source image's edge regions are stretched to fill the gap between each border.", @@ -14419,7 +14621,7 @@ } }, "mask-border-slice": { - "url": "$MDN_URL$/web/css/mask-border-slice", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-slice", "status": [ "StandardTrack" ], @@ -14430,7 +14632,7 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border-slice CSS property divides the image set by mask-border-source into regions. These regions are used to form the components of an element's mask border.", + "doc": "The mask-border-slice CSS property divides the image set by mask-border-source into regions. These regions are used to form the components of an element's mask border.", "formalSyntax": "[ <number> | <percentage> ]{1,4} fill?", "values": { "<number>": "Represents an edge offset in pixels for raster images and coordinates for vector images. For vector images, the number is relative to the element's size, not the size of the source image, so percentages are generally preferable in these cases.", @@ -14439,7 +14641,7 @@ } }, "mask-border-source": { - "url": "$MDN_URL$/web/css/mask-border-source", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-source", "status": [ "StandardTrack" ], @@ -14450,7 +14652,7 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border-source CSS property sets the source image used to create an element's mask border.\n

    The mask-border-slice property is used to divide the source image into regions, which are then dynamically applied to the final mask border.", + "doc": "The mask-border-source CSS property sets the source image used to create an element's mask border.\n

    The mask-border-slice property is used to divide the source image into regions, which are then dynamically applied to the final mask border.", "formalSyntax": "none | <image>\n  <image> = <url> | <gradient>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "No mask border is used.", @@ -14458,7 +14660,7 @@ } }, "mask-border-width": { - "url": "$MDN_URL$/web/css/mask-border-width", + "url": "$MDN_URL$/web/css/reference/properties/mask-border-width", "status": [ "StandardTrack" ], @@ -14469,16 +14671,16 @@ "baseline": { "level": "NONE" }, - "doc": "The mask-border-width CSS property sets the width of an element's mask border.", + "doc": "The mask-border-width CSS property sets the width of an element's mask border.", "formalSyntax": "[ <length-percentage> | <number> | auto ]{1,4}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "The width of the mask border, specified as a <length> or a <percentage>. Percentages are relative to the width of the border area for horizontal offsets and the height of the border area for vertical offsets. Must not be negative.", - "<number>": "The width of the mask border, specified as a multiple of the corresponding border-width. Must not be negative.", - "auto": "The width of the mask border is made equal to the intrinsic width or height (whichever is applicable) of the corresponding mask-border-slice. If the image does not have the required intrinsic dimension, the corresponding border-width is used instead." + "<length-percentage>": "The width of the mask border, specified as a <length> or a <percentage>. Percentages are relative to the width of the border area for horizontal offsets and the height of the border area for vertical offsets. Must not be negative.", + "<number>": "The width of the mask border, specified as a multiple of the corresponding border-width. Must not be negative.", + "auto": "The width of the mask border is made equal to the intrinsic width or height (whichever is applicable) of the corresponding mask-border-slice. If the image does not have the required intrinsic dimension, the corresponding border-width is used instead." } }, "mask-clip": { - "url": "$MDN_URL$/web/css/mask-clip", + "url": "$MDN_URL$/web/css/reference/properties/mask-clip", "status": [ "StandardTrack" ], @@ -14513,7 +14715,7 @@ } }, "mask-composite": { - "url": "$MDN_URL$/web/css/mask-composite", + "url": "$MDN_URL$/web/css/reference/properties/mask-composite", "status": [ "StandardTrack" ], @@ -14541,7 +14743,7 @@ } }, "mask-image": { - "url": "$MDN_URL$/web/css/mask-image", + "url": "$MDN_URL$/web/css/reference/properties/mask-image", "status": [ "StandardTrack" ], @@ -14558,16 +14760,16 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask-image CSS property sets the image that is used as the mask layer for an element, hiding sections of the element on which the masking image is set based on the alpha channel of the mask image and, depending on the mask-mode property value, the luminance of the mask image's colors.", + "doc": "The mask-image CSS property sets the image that is used as the mask layer for an element, hiding sections of the element on which the masking image is set based on the alpha channel of the mask image and, depending on the mask-mode property value, the luminance of the mask image's colors.", "formalSyntax": "<mask-reference>#\n  <mask-reference> = none | <image> | <mask-source>\n  <image> = <url> | <gradient>\n  <mask-source> = <url>\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "none": "This keyword is interpreted as a transparent black image layer.", - "<mask-source>": "A <url> reference to a <mask> or to a CSS image.", + "<mask-source>": "A <url> reference to a <mask> or to a CSS image.", "<image>": "An image value used as a mask image layer." } }, "mask-mode": { - "url": "$MDN_URL$/web/css/mask-mode", + "url": "$MDN_URL$/web/css/reference/properties/mask-mode", "status": [ "StandardTrack" ], @@ -14585,16 +14787,16 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask-mode CSS property is set on the element being masked. It sets whether the mask reference defined by the mask-image is treated as a luminance or alpha mask.", + "doc": "The mask-mode CSS property is set on the element being masked. It sets whether the mask reference defined by the mask-image is treated as a luminance or alpha mask.", "formalSyntax": "<masking-mode>#\n  <masking-mode> = alpha | luminance | match-source", "values": { "alpha": "Indicates that the alpha (transparency) values of the mask image should be used.", "luminance": "Indicates that the luminance (brightness) values of the mask image should be used.", - "match-source": "Indicates that the type of mask is determined by the source. This is the default property value.\n

    " + "match-source": "Indicates that the type of mask is determined by the source. This is the default property value.\n" } }, "mask-origin": { - "url": "$MDN_URL$/web/css/mask-origin", + "url": "$MDN_URL$/web/css/reference/properties/mask-origin", "status": [ "StandardTrack" ], @@ -14612,19 +14814,19 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask-origin CSS property sets the origin of a mask. This property determines the mask positioning area: the area within which a mask image is positioned. HTML elements can have masks contained within their content border box, padding box, or content box, whereas SVG elements (which don't have the associated CSS layout boxes) can have masks contained inside their fill, stroke, or view box.\nFor elements rendered as multiple boxes, such as a <span> of text that spans more than one line, the mask-origin property specifies which boxes the box-decoration-break property operates on to determine the mask positioning area.", + "doc": "The mask-origin CSS property sets the origin of a mask. This property determines the mask positioning area: the area within which a mask image is positioned. HTML elements can have masks contained within their content border box, padding box, or content box, whereas SVG elements (which don't have the associated CSS layout boxes) can have masks contained inside their fill, stroke, or view box.\nFor elements rendered as multiple boxes, such as a <span> of text that spans more than one line, the mask-origin property specifies which boxes the box-decoration-break property operates on to determine the mask positioning area.", "formalSyntax": "<coord-box>#\n  <coord-box> = <paint-box> | view-box\n  <paint-box> = <visual-box> | fill-box | stroke-box\n  <visual-box> = content-box | padding-box | border-box", "values": { - "content-box": "The position is relative to the content box.", - "padding-box": "The position is relative to the padding box.", - "border-box": "The position is relative to the border box.", + "content-box": "The position is relative to the content box.", + "padding-box": "The position is relative to the padding box.", + "border-box": "The position is relative to the border box.", "fill-box": "The position is relative to the object bounding box.", "stroke-box": "The position is relative to the stroke bounding box.", "view-box": "Uses the nearest SVG viewport as reference box. If a viewBox attribute is specified for the element creating the SVG viewport, the reference box is positioned at the origin of the coordinate system established by the viewBox attribute and the dimension of the reference box is set to the width and height values of the viewBox attribute." } }, "mask-position": { - "url": "$MDN_URL$/web/css/mask-position", + "url": "$MDN_URL$/web/css/reference/properties/mask-position", "status": [ "StandardTrack" ], @@ -14642,14 +14844,14 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask-position CSS property sets the initial position, relative to the mask position layer set by mask-origin, for each defined mask image.", + "doc": "The mask-position CSS property sets the initial position, relative to the mask position layer set by mask-origin, for each defined mask image.", "formalSyntax": "<position>#\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>", "values": { "<position>": "One, two, or four values representing a 2D position specifying the edges of the element's box. Relative or absolute offsets can be given." } }, "mask-repeat": { - "url": "$MDN_URL$/web/css/mask-repeat", + "url": "$MDN_URL$/web/css/reference/properties/mask-repeat", "status": [ "StandardTrack" ], @@ -14670,16 +14872,16 @@ "doc": "The mask-repeat CSS property sets how mask images are repeated. A mask image can be repeated along the horizontal axis, the vertical axis, both axes, or not repeated at all.", "formalSyntax": "<repeat-style>#\n  <repeat-style> = repeat-x | repeat-y | [ repeat | space | round | no-repeat ]{1,2}", "values": { - "repeat": "The image is repeated as much as needed to cover the whole mask painting area. Mask images along the edges are clipped when the size of the mask origin box is not an exact multiple of the mask image's size.repeat repeat", - "space": "The mask image is repeated as many times as possible without clipping. If the element's origin size is at least twice the size as the mask image's size in the associated dimension, the mask-position property is ignored and the first and last images are positioned at the edges of the mask origin container. If the mask origin box is not an exact multiple of the mask image's size, whitespace is distributed evenly between the repeated mask images.\n

    If the origin box size is less than twice the mask image's size in the given dimension, only one mask image can be displayed. In this case, the image is positioned as defined by the mask-position property, which defaults to 0% 0%. The mask image will only be clipped if the mask image is larger than the mask origin box.space space", + "repeat": "The image is repeated as much as needed to cover the whole mask painting area. Mask images along the edges are clipped when the size of the mask origin box is not an exact multiple of the mask image's size.repeat repeat", + "space": "The mask image is repeated as many times as possible without clipping. If the element's origin size is at least twice the size as the mask image's size in the associated dimension, the mask-position property is ignored and the first and last images are positioned at the edges of the mask origin container. If the mask origin box is not an exact multiple of the mask image's size, whitespace is distributed evenly between the repeated mask images.\n

    If the origin box size is less than twice the mask image's size in the given dimension, only one mask image can be displayed. In this case, the image is positioned as defined by the mask-position property, which defaults to 0% 0%. The mask image will only be clipped if the mask image is larger than the mask origin box.space space", "round": "The mask image is repeated as many times as possible in its original dimensions. If the size of the mask origin box is not an exact multiple of the mask image's size, all mask images will be rescaled, shrinking or stretching to ensure no repetitions are clipped.round round", - "no-repeat": "The mask image is not repeated (and hence the mask painting area will not necessarily be entirely covered). The position of the non-repeated mask image is defined by the mask-position CSS property.no-repeat no-repeat", - "repeat-x": "repeat no-repeat

    The equivalent of repeat no-repeat. The image is repeated in the horizontal direction as many times as needed to cover the width of the mask painting area. Mask images along the right or left edges, or both depending on the mask-position value, will be clipped if the width of the mask origin box is not an exact multiple of the mask image's width.", - "repeat-y": "no-repeat repeat

    The equivalent of no-repeat repeat. The image is repeated in the vertical direction as many times as needed to cover the height of the mask painting area. Mask images along the top or bottom edges, or both depending on the mask-position value, will be clipped if the height of the mask origin box is not an exact multiple of the mask image's height." + "no-repeat": "The mask image is not repeated (and hence the mask painting area will not necessarily be entirely covered). The position of the non-repeated mask image is defined by the mask-position CSS property.no-repeat no-repeat", + "repeat-x": "repeat no-repeat

    The equivalent of repeat no-repeat. The image is repeated in the horizontal direction as many times as needed to cover the width of the mask painting area. Mask images along the right or left edges, or both depending on the mask-position value, will be clipped if the width of the mask origin box is not an exact multiple of the mask image's width.", + "repeat-y": "no-repeat repeat

    The equivalent of no-repeat repeat. The image is repeated in the vertical direction as many times as needed to cover the height of the mask painting area. Mask images along the top or bottom edges, or both depending on the mask-position value, will be clipped if the height of the mask origin box is not an exact multiple of the mask image's height." } }, "mask-size": { - "url": "$MDN_URL$/web/css/mask-size", + "url": "$MDN_URL$/web/css/reference/properties/mask-size", "status": [ "StandardTrack" ], @@ -14700,15 +14902,15 @@ "doc": "The mask-size CSS property specifies the sizes of specified mask images. Mask image sizes can be fully or partially constrained to preserve their intrinsic aspect ratios.", "formalSyntax": "<bg-size>#\n  <bg-size> = [ <length-percentage [0,∞]> | auto ]{1,2} | cover | contain\n  <length-percentage> = <length> | <percentage>", "values": { - "contain": "Scales the mask image up or down, while preserving its aspect-ratio, making the mask as large as possible within its container without cropping or stretching it.\nIf the mask image is smaller than the container, the mask will tile, or repeat, unless the mask-repeat property is set to no-repeat.", + "contain": "Scales the mask image up or down, while preserving its aspect-ratio, making the mask as large as possible within its container without cropping or stretching it.\nIf the mask image is smaller than the container, the mask will tile, or repeat, unless the mask-repeat property is set to no-repeat.", "cover": "Scales the mask image to the smallest possible size to fill the container while preserving its aspect ratio. If the aspect ratio of the mask image differs from the element, it will be cropped vertically or horizontally.", "auto": "Maintains the original aspect ratio of the mask source. When set for both the width and height, the origin size of the mask resource is used. Otherwise, auto scales the mask image in the corresponding direction such that its original aspect ratio is maintained.", "<length>": "Renders the mask image at the specified length in the corresponding dimension (width if set as the first or only value, height if set as the second value). Negative values are not allowed.", - "<percentage>": "Renders the mask image in the corresponding dimension to the specified percentage of the box origin area as defined by the mask-origin property, which defaults to padding-box. Negative values are not allowed." + "<percentage>": "Renders the mask image in the corresponding dimension to the specified percentage of the box origin area as defined by the mask-origin property, which defaults to padding-box. Negative values are not allowed." } }, "mask-type": { - "url": "$MDN_URL$/web/css/mask-type", + "url": "$MDN_URL$/web/css/reference/properties/mask-type", "status": [ "StandardTrack" ], @@ -14727,7 +14929,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The mask-type CSS property applies to the SVG <mask> element. It defines whether to use the luminance (brightness) or alpha (transparency) content of the mask. This property may be overridden by the mask-mode property. The mask-type property has no effect on image or gradient masks.", + "doc": "The mask-type CSS property applies to the SVG <mask> element. It defines whether to use the luminance (brightness) or alpha (transparency) content of the mask. This property may be overridden by the mask-mode property. The mask-type property has no effect on image or gradient masks.", "formalSyntax": "luminance | alpha", "values": { "alpha": "Indicates that the alpha (transparency) values of the <mask> should be used.", @@ -14735,7 +14937,7 @@ } }, "math-depth": { - "url": "$MDN_URL$/web/css/math-depth", + "url": "$MDN_URL$/web/css/reference/properties/math-depth", "status": [ "StandardTrack" ], @@ -14750,30 +14952,34 @@ "baseline": { "level": "NONE" }, - "doc": "The math-depth property describes a notion of depth for each element of a mathematical formula, with respect to the top-level container of that formula. This is used to scale the computed value of the font-size of elements when font-size: math is applied.\n

    \n

    Note:\nfont-size: math is the default for <math> elements in the MathML Core User Agent stylesheet, so it's not necessary to specify it explicitly.\n

    ", - "formalSyntax": "auto-add | add( <integer> ) | <integer>", + "doc": "The math-depth property describes a notion of depth for each element of a mathematical formula, with respect to the top-level container of that formula. This is used to scale the computed value of the font-size of elements when font-size: math is applied.\n
    \n

    Note:\nfont-size: math is the default for <math> elements in the MathML Core User Agent stylesheet, so it's not necessary to specify it explicitly.\n

    ", + "formalSyntax": "auto-add | add( <integer> ) | <integer>\n  <integer> = <number-token>", "values": { - "auto-add": "Set to the inherited math-depth plus 1 when inherited math-style is compact.", + "auto-add": "Set to the inherited math-depth plus 1 when inherited math-style is compact.", "add(<integer>)": "Set to the inherited math-depth plus the specified integer.", "<integer>": "Set to the specified integer." } }, "math-shift": { - "url": "$MDN_URL$/web/css/math-shift", + "url": "$MDN_URL$/web/css/reference/properties/math-shift", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "109", "ChromeAndroid": "109", "Edge": "109", - "Opera": "95" + "Firefox": "146", + "FirefoxAndroid": "146", + "Opera": "95", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, - "doc": "

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

    \n

    The math-shift property indicates whether superscripts inside MathML formulas should be raised by a normal or compact shift.", + "doc": "The math-shift property indicates whether superscripts inside MathML formulas should be raised by a normal or compact shift.", "formalSyntax": "normal | compact", "values": { "normal": "The initial value, indicates normal rendering. Superscripts in MathML formulas use the superscriptShiftUp parameter from the OpenType MATH table.", @@ -14781,7 +14987,7 @@ } }, "math-style": { - "url": "$MDN_URL$/web/css/math-style", + "url": "$MDN_URL$/web/css/reference/properties/math-style", "status": [ "StandardTrack" ], @@ -14807,7 +15013,7 @@ } }, "max-block-size": { - "url": "$MDN_URL$/web/css/max-block-size", + "url": "$MDN_URL$/web/css/reference/properties/max-block-size", "status": [ "StandardTrack" ], @@ -14826,7 +15032,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The max-block-size CSS property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by writing-mode. That is, if the writing direction is horizontal, then max-block-size is equivalent to max-height; if the writing direction is vertical, max-block-size is the same as max-width.\n

    The other dimension's maximum length is specified using the max-inline-size property.\n

    This is useful because the max-width is always used for horizontal sizes and max-height is always used for vertical sizes, and if you need to set lengths based on the size of your text content, you need to be able to do so with the writing direction in mind.\n

    Any time you would normally use max-height or max-width, you should instead use max-block-size to set the maximum \"height\" of the content (even though this may not be a vertical value) and max-inline-size to set the maximum \"width\" of the content (although this may instead be vertical rather than horizontal). See writing-mode examples, which show the different writing modes in action.", + "doc": "The max-block-size CSS property specifies the maximum size of an element in the direction opposite that of the writing direction as specified by writing-mode. That is, if the writing direction is horizontal, then max-block-size is equivalent to max-height; if the writing direction is vertical, max-block-size is the same as max-width.\n

    The other dimension's maximum length is specified using the max-inline-size property.\n

    This is useful because the max-width is always used for horizontal sizes and max-height is always used for vertical sizes, and if you need to set lengths based on the size of your text content, you need to be able to do so with the writing direction in mind.\n

    Any time you would normally use max-height or max-width, you should instead use max-block-size to set the maximum \"height\" of the content (even though this may not be a vertical value) and max-inline-size to set the maximum \"width\" of the content (although this may instead be vertical rather than horizontal). See writing-mode examples, which show the different writing modes in action.", "formalSyntax": "<'max-width'>\n  <max-width> = none | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the max-block-size as an absolute value.", @@ -14834,12 +15040,12 @@ "none": "No limit on the size of the box.", "max-content": "The intrinsic preferred max-block-size.", "min-content": "The intrinsic minimum max-block-size.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, argument))." } }, "max-content": { - "url": "$MDN_URL$/web/css/max-content", + "url": "$MDN_URL$/web/css/reference/values/max-content", "status": [ "StandardTrack" ], @@ -14858,10 +15064,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The max-content sizing keyword represents the maximum intrinsic size of an element.\nThe keyword expands the element to the largest size needed to display its content without any soft wraps.\nFor text content, this keyword does not wrap the content at all, even if it causes overflow.\n

    The interpolate-size property and calc-size() function can be used to enable animations to and from max-content." + "doc": "The max-content sizing keyword represents the maximum intrinsic size of an element.\nThe keyword expands the element to the largest size needed to display its content without any soft wraps.\nFor text content, this keyword does not wrap the content at all, even if it causes overflow.\n

    The interpolate-size property and calc-size() function can be used to enable animations to and from max-content." }, "max-height": { - "url": "$MDN_URL$/web/css/max-height", + "url": "$MDN_URL$/web/css/reference/properties/max-height", "status": [ "StandardTrack" ], @@ -14880,7 +15086,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The max-height CSS property sets the maximum height of an element. It prevents the used value of the height property from becoming larger than the value specified for max-height.", + "doc": "The max-height CSS property sets the maximum height of an element. It prevents the used value of the height property from becoming larger than the value specified for max-height.", "formalSyntax": "none | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the max-height as an absolute value.", @@ -14888,13 +15094,13 @@ "none": "No limit on the size of the box.", "max-content": "The intrinsic preferred max-height.", "min-content": "The intrinsic minimum max-height.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, argument)).", - "stretch": "Limits the maximum height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n

    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " + "stretch": "Limits the maximum height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n
    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " } }, "max-inline-size": { - "url": "$MDN_URL$/web/css/max-inline-size", + "url": "$MDN_URL$/web/css/reference/properties/max-inline-size", "status": [ "StandardTrack" ], @@ -14913,11 +15119,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The max-inline-size CSS property defines the horizontal or vertical maximum size of an element's block, depending on its writing mode. It corresponds to either the max-width or the max-height property, depending on the value of writing-mode.\n

    If the writing mode is vertically oriented, the value of max-inline-size relates to the maximal height of the element; otherwise, it relates to the maximal width of the element. A related property is max-block-size, which defines the other dimension of the element.", + "doc": "The max-inline-size CSS property defines the horizontal or vertical maximum size of an element's block, depending on its writing mode. It corresponds to either the max-width or the max-height property, depending on the value of writing-mode.\n

    If the writing mode is vertically oriented, the value of max-inline-size relates to the maximal height of the element; otherwise, it relates to the maximal width of the element. A related property is max-block-size, which defines the other dimension of the element.", "formalSyntax": "<'max-width'>\n  <max-width> = none | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "max-width": { - "url": "$MDN_URL$/web/css/max-width", + "url": "$MDN_URL$/web/css/reference/properties/max-width", "status": [ "StandardTrack" ], @@ -14936,7 +15142,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The max-width CSS property sets the maximum width of an element. It prevents the used value of the width property from becoming larger than the value specified by max-width.", + "doc": "The max-width CSS property sets the maximum width of an element. It prevents the used value of the width property from becoming larger than the value specified by max-width.", "formalSyntax": "none | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the max-width as an absolute value.", @@ -14944,13 +15150,13 @@ "none": "No limit on the size of the box.", "max-content": "The intrinsic preferred max-width.", "min-content": "The intrinsic minimum max-width.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, argument)).", - "stretch": "Limits the maximum width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n

    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " + "stretch": "Limits the maximum width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n
    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " } }, "min-block-size": { - "url": "$MDN_URL$/web/css/min-block-size", + "url": "$MDN_URL$/web/css/reference/properties/min-block-size", "status": [ "StandardTrack" ], @@ -14969,11 +15175,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The min-block-size CSS property defines the minimum horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode.\n

    If the writing mode is vertically oriented, the value of min-block-size relates to the minimum width of the element; otherwise, it relates to the minimum height of the element. A related property is min-inline-size, which defines the other dimension of the element.", + "doc": "The min-block-size CSS property defines the minimum horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode.\n

    If the writing mode is vertically oriented, the value of min-block-size relates to the minimum width of the element; otherwise, it relates to the minimum height of the element. A related property is min-inline-size, which defines the other dimension of the element.", "formalSyntax": "<'min-width'>\n  <min-width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "min-content": { - "url": "$MDN_URL$/web/css/min-content", + "url": "$MDN_URL$/web/css/reference/values/min-content", "status": [ "StandardTrack" ], @@ -14992,10 +15198,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The min-content sizing keyword represents the minimum intrinsic size of an element.\nThe keyword shrinks the element to the smallest possible size without causing avoidable overflow of its content.\nFor text content, this keyword causes the content to wrap at every opportunity (such as spaces between words), and the element will be only as wide as the longest word.\n

    The interpolate-size property and calc-size() function can be used to enable animations to and from min-content." + "doc": "The min-content sizing keyword represents the minimum intrinsic size of an element.\nThe keyword shrinks the element to the smallest possible size without causing avoidable overflow of its content.\nFor text content, this keyword causes the content to wrap at every opportunity (such as spaces between words), and the element will be only as wide as the longest word.\n

    The interpolate-size property and calc-size() function can be used to enable animations to and from min-content." }, "min-height": { - "url": "$MDN_URL$/web/css/min-height", + "url": "$MDN_URL$/web/css/reference/properties/min-height", "status": [ "StandardTrack" ], @@ -15014,7 +15220,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height.", + "doc": "The min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height.", "formalSyntax": "auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the min-height as an absolute value.", @@ -15022,13 +15228,13 @@ "auto": "The browser will calculate and select a min-height for the specified element.", "max-content": "The intrinsic preferred min-height.", "min-content": "The intrinsic minimum min-height.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, argument)).", - "stretch": "Limits the minimum height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n

    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " + "stretch": "Limits the minimum height of the element's margin box to the height of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n
    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " } }, "min-inline-size": { - "url": "$MDN_URL$/web/css/min-inline-size", + "url": "$MDN_URL$/web/css/reference/properties/min-inline-size", "status": [ "StandardTrack" ], @@ -15047,11 +15253,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The min-inline-size CSS property defines the horizontal or vertical minimal size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode.", + "doc": "The min-inline-size CSS property defines the horizontal or vertical minimal size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode.", "formalSyntax": "<'min-width'>\n  <min-width> = auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN" }, "min-width": { - "url": "$MDN_URL$/web/css/min-width", + "url": "$MDN_URL$/web/css/reference/properties/min-width", "status": [ "StandardTrack" ], @@ -15070,7 +15276,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The min-width CSS property sets the minimum width of an element. It prevents the used value of the width property from becoming smaller than the value specified for min-width.", + "doc": "The min-width CSS property sets the minimum width of an element. It prevents the used value of the width property from becoming smaller than the value specified for min-width.", "formalSyntax": "auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the min-width as an absolute value.", @@ -15078,13 +15284,13 @@ "auto": "The default value. The source of the automatic value for the specified element depends on its display value. For block boxes, inline boxes, inline blocks, and all table layout boxes auto resolves to 0.\n

    For flex items and grid items, the minimum width value is either the specified suggested size, such as the value of the width property, the transferred size, calculated if the element has an aspect-ratio set and the height is a definite size, otherwise, the min-content size is used. If the flex or grid item is a scroll container, or if a grid item spans more than one flexible column track, the automatic minimum size is 0.", "max-content": "The intrinsic preferred min-width.", "min-content": "The intrinsic minimum min-width.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, argument)).", - "stretch": "Limits the minimum width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n

    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " + "stretch": "Limits the minimum width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing.\n
    \n

    Note:\nTo check aliases used by browsers for the stretch value and its implementation status, see the Browser compatibility section.\n

    " } }, "mix-blend-mode": { - "url": "$MDN_URL$/web/css/mix-blend-mode", + "url": "$MDN_URL$/web/css/reference/properties/mix-blend-mode", "status": [ "StandardTrack" ], @@ -15104,7 +15310,7 @@ "highDate": "2022-07-15" }, "doc": "The mix-blend-mode CSS property sets how an element's content should blend with the content of the element's parent and the element's background.", - "formalSyntax": "<blend-mode> | plus-darker | plus-lighter\n  <blend-mode> = normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue | saturation | color | luminosity", + "formalSyntax": "<blend-mode> | plus-lighter\n  <blend-mode> = normal | darken | multiply | color-burn | lighten | screen | color-dodge | overlay | soft-light | hard-light | difference | exclusion | hue | saturation | color | luminosity", "values": { "<blend-mode>": "The blending mode that should be applied.", "plus-darker": "Blending using the plus-darker compositing operator.", @@ -15112,7 +15318,7 @@ } }, "nesting_selector": { - "url": "$MDN_URL$/web/css/nesting_selector", + "url": "$MDN_URL$/web/css/reference/selectors/nesting_selector", "status": [ "StandardTrack" ], @@ -15130,10 +15336,10 @@ "level": "LOW", "lowDate": "2023-12-11" }, - "doc": "The CSS & nesting selector explicitly states the relationship between parent and child rules when using CSS nesting. It makes the nested child rule selectors relative to the parent element. Without the & nesting selector, the child rule selector selects child elements. The child rule selectors have the same specificity weight as if they were within :is().\n
    \n

    Note:\nChild rule does not mean child element selector. A child rule can target parent element or child elements depending on use of the & nesting selector.\n

    \n

    If not used in nested style rule, the & nesting selector represents the scoping root." + "doc": "The CSS & nesting selector explicitly states the relationship between parent and child rules when using CSS nesting. It makes the nested child rule selectors relative to the parent element. Without the & nesting selector, the child rule selector selects child elements. The child rule selectors have the same specificity weight as if they were within :is().\n

    \n

    Note:\nChild rule does not mean child element selector. A child rule can target parent element or child elements depending on use of the & nesting selector.\n

    \n

    If not used in nested style rule, the & nesting selector represents the scoping root." }, "next-sibling_combinator": { - "url": "$MDN_URL$/web/css/next-sibling_combinator", + "url": "$MDN_URL$/web/css/reference/selectors/next-sibling_combinator", "status": [ "StandardTrack" ], @@ -15155,7 +15361,7 @@ "doc": "The next-sibling combinator (+) separates two selectors and matches the second element only if it immediately follows the first element, and both are children of the same parent element.\n

    \n```css\n/* Paragraphs that come immediately after any image */\nimg + p {\n  font-weight: bold;\n}\n```\n
    " }, "object-fit": { - "url": "$MDN_URL$/web/css/object-fit", + "url": "$MDN_URL$/web/css/reference/properties/object-fit", "status": [ "StandardTrack" ], @@ -15174,7 +15380,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The object-fit CSS property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container.\n
    \n

    Note:\nThe object-fit property has no effect on <iframe>, <embed>, and <fencedframe> elements.\n

    \n

    You can alter the alignment of the replaced element's content object within the element's box using the object-position property.", + "doc": "The object-fit CSS property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container.\n

    \n

    Note:\nThe object-fit property has no effect on <iframe>, <embed>, and <fencedframe> elements.\n

    \n

    You can alter the alignment of the replaced element's content object within the element's box using the object-position property.", "formalSyntax": "fill | contain | cover | none | scale-down", "values": { "contain": "The replaced content is scaled to maintain its aspect ratio while fitting within the element's content box. The entire object is made to fill the box, while preserving its aspect ratio, so the object will be \"letterboxed\" or \"pillarboxed\" if its aspect ratio does not match the aspect ratio of the box.", @@ -15185,7 +15391,7 @@ } }, "object-position": { - "url": "$MDN_URL$/web/css/object-position", + "url": "$MDN_URL$/web/css/reference/properties/object-position", "status": [ "StandardTrack" ], @@ -15204,14 +15410,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The object-position CSS property specifies the alignment of the selected replaced element's contents within the element's box. Areas of the box which aren't covered by the replaced element's object will show the element's background.\n

    You can adjust how the replaced element's object's intrinsic size (that is, its natural size) is adjusted to fit within the element's box using the object-fit property.", + "doc": "The object-position CSS property specifies the alignment of the selected replaced element's contents within the element's box. Areas of the box which aren't covered by the replaced element's object will show the element's background.\n

    You can adjust how the replaced element's object's intrinsic size (that is, its natural size) is adjusted to fit within the element's box using the object-fit property.", "formalSyntax": "<position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>", "values": { "<position>": "From one to four values that define the 2D position of the element. Relative or absolute offsets can be used." } }, "object-view-box": { - "url": "$MDN_URL$/web/css/object-view-box", + "url": "$MDN_URL$/web/css/reference/properties/object-view-box", "status": [ "Experimental", "StandardTrack" @@ -15229,11 +15435,11 @@ "formalSyntax": "none | <basic-shape-rect>\n  <basic-shape-rect> = <inset()> | <rect()> | <xywh()>\n  <inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )\n  <xywh()> = xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <length-percentage> = <length> | <percentage>\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?", "values": { "none": "The element does not have a view box. This is the default.", - "<basic-shape-rect>": "A inset(), xywh(), or rect() function specifying a view box for an element with natural dimensions (replaced elements). Resolves to none otherwise." + "<basic-shape-rect>": "An inset(), xywh(), or rect() function specifying a view box for an element with natural dimensions (replaced elements). Resolves to none otherwise." } }, "offset": { - "url": "$MDN_URL$/web/css/offset", + "url": "$MDN_URL$/web/css/reference/properties/offset", "status": [ "StandardTrack" ], @@ -15252,11 +15458,11 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The offset CSS shorthand property sets all the properties required for animating an element along a defined path. The offset properties together help to define an offset transform, a transform that aligns a point in an element (offset-anchor) to an offset position (offset-position) on a path (offset-path) at various points along the path (offset-distance) and optionally rotates the element (offset-rotate) to follow the direction of the path.\n

    \n

    Note:\nEarly versions of the spec called this property motion.\n

    ", - "formalSyntax": "[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> || <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?\n  <offset-position> = normal | auto | <position>\n  <offset-path> = none | <offset-path> || <coord-box>\n  <offset-distance> = <length-percentage>\n  <offset-rotate> = [ auto | reverse ] || <angle>\n  <offset-anchor> = auto | <position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <offset-path> = <ray()> | <url> | <basic-shape>\n  <coord-box> = <paint-box> | view-box\n  <length-percentage> = <length> | <percentage>\n  <ray()> = ray( <angle> &&<ray-size>? &&contain? &&[ at <position> ]? )\n  <url> = <url()> | <src()>\n  <paint-box> = <visual-box> | fill-box | stroke-box\n  <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <visual-box> = content-box | padding-box | border-box" + "doc": "The offset CSS shorthand property sets all the properties required for animating an element along a defined path. The offset properties together help to define an offset transform, a transform that aligns a point in an element (offset-anchor) to an offset position (offset-position) on a path (offset-path) at various points along the path (offset-distance) and optionally rotates the element (offset-rotate) to follow the direction of the path.\n
    \n

    Note:\nEarly versions of the spec called this property motion.\n

    ", + "formalSyntax": "[ <'offset-position'>? [ <'offset-path'> [ <'offset-distance'> || <'offset-rotate'> ]? ]? ]! [ / <'offset-anchor'> ]?\n  <offset-position> = normal | auto | <position>\n  <offset-path> = none | <offset-path> || <coord-box>\n  <offset-distance> = <length-percentage>\n  <offset-rotate> = [ auto | reverse ] || <angle>\n  <offset-anchor> = auto | <position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <offset-path> = <ray()> | <url> | <basic-shape>\n  <coord-box> = <paint-box> | view-box\n  <length-percentage> = <length> | <percentage>\n  <ray()> = ray( <angle> &&<ray-size>? &&contain? &&[ at <position> ]? )\n  <url> = <url()> | <src()>\n  <basic-shape> = <basic-shape-rect> | <circle()> | <ellipse()> | <polygon()> | <path()> | <shape()>\n  <paint-box> = <visual-box> | fill-box | stroke-box\n  <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <basic-shape-rect> = <inset()> | <rect()> | <xywh()>\n  <circle()> = circle( <radial-size>? [ at <position> ]? )\n  <ellipse()> = ellipse( <radial-size>? [ at <position> ]? )\n  <polygon()> = polygon( <'fill-rule'>? [ round <length> ]? , [ <length-percentage> <length-percentage> ]# )\n  <path()> = path( <'fill-rule'>? , <string> )\n  <shape()> = shape( <'fill-rule'>? from <position> , <shape-command># )\n  <visual-box> = content-box | padding-box | border-box\n  <inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )\n  <xywh()> = xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <fill-rule> = nonzero | evenodd\n  <shape-command> = <move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <move-command> = move <command-end-point>\n  <line-command> = line <command-end-point>\n  <horizontal-line-command> = hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]\n  <vertical-line-command> = vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]\n  <curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]\n  <smooth-command> = smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]\n  <arc-command> = arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [ rotate <angle> ]? ]\n  <command-end-point> = to <position> | by <coordinate-pair>\n  <control-point> = <position> | <relative-control-point>\n  <coordinate-pair> = <length-percentage>{2}\n  <relative-control-point> = <coordinate-pair> [ from [ start | end | origin ] ]?\n  <arc-sweep> = cw | ccw\n  <arc-size> = large | small" }, "offset-anchor": { - "url": "$MDN_URL$/web/css/offset-anchor", + "url": "$MDN_URL$/web/css/reference/properties/offset-anchor", "status": [ "StandardTrack" ], @@ -15274,15 +15480,15 @@ "level": "LOW", "lowDate": "2023-08-21" }, - "doc": "The offset-anchor CSS property specifies the point inside the box of an element traveling along an offset-path that is actually moving along the path.", + "doc": "The offset-anchor CSS property specifies the point inside the box of an element traveling along an offset-path that is actually moving along the path.", "formalSyntax": "auto | <position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>", "values": { - "auto": "offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.", - "<position>": "A <position> defines an x/y coordinate, to place an item relative to the edges of an element's box. It can be defined using one to four values. For more specifics, see the <position> and background-position reference pages. Note that the 3-value position syntax does not work for any usage of <position>, except for in background(-position)." + "auto": "offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.", + "<position>": "A <position> defines an x/y coordinate, to place an item relative to the edges of an element's box. It can be defined using one to four values. For more specifics, see the <position> and background-position reference pages. Note that the 3-value position syntax does not work for any usage of <position>, except for in background(-position)." } }, "offset-distance": { - "url": "$MDN_URL$/web/css/offset-distance", + "url": "$MDN_URL$/web/css/reference/properties/offset-distance", "status": [ "StandardTrack" ], @@ -15301,11 +15507,11 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The offset-distance CSS property specifies a position along an offset-path for an element to be placed.", + "doc": "The offset-distance CSS property specifies a position along an offset-path for an element to be placed.", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>" }, "offset-path": { - "url": "$MDN_URL$/web/css/offset-path", + "url": "$MDN_URL$/web/css/reference/properties/offset-path", "status": [ "StandardTrack" ], @@ -15324,16 +15530,16 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The offset-path CSS property specifies a path for an element to follow and determines the element's positioning within the path's parent container or the SVG coordinate system. The path is a line, a curve, or a geometrical shape along which the element gets positioned or moves.\n

    The offset-path property is used in combination with the offset-distance, offset-rotate, and offset-anchor properties to control the position and orientation of the element along a path.", - "formalSyntax": "none | <offset-path> || <coord-box>\n  <offset-path> = <ray()> | <url> | <basic-shape>\n  <coord-box> = <paint-box> | view-box\n  <ray()> = ray( <angle> &&<ray-size>? &&contain? &&[ at <position> ]? )\n  <url> = <url()> | <src()>\n  <paint-box> = <visual-box> | fill-box | stroke-box\n  <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <visual-box> = content-box | padding-box | border-box\n  <length-percentage> = <length> | <percentage>", + "doc": "The offset-path CSS property specifies a path for an element to follow and determines the element's positioning within the path's parent container or the SVG coordinate system. The path is a line, a curve, or a geometrical shape along which the element gets positioned or moves.\n

    The offset-path property is used in combination with the offset-distance, offset-rotate, and offset-anchor properties to control the position and orientation of the element along a path.", + "formalSyntax": "none | <offset-path> || <coord-box>\n  <offset-path> = <ray()> | <url> | <basic-shape>\n  <coord-box> = <paint-box> | view-box\n  <ray()> = ray( <angle> &&<ray-size>? &&contain? &&[ at <position> ]? )\n  <url> = <url()> | <src()>\n  <basic-shape> = <basic-shape-rect> | <circle()> | <ellipse()> | <polygon()> | <path()> | <shape()>\n  <paint-box> = <visual-box> | fill-box | stroke-box\n  <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <basic-shape-rect> = <inset()> | <rect()> | <xywh()>\n  <circle()> = circle( <radial-size>? [ at <position> ]? )\n  <ellipse()> = ellipse( <radial-size>? [ at <position> ]? )\n  <polygon()> = polygon( <'fill-rule'>? [ round <length> ]? , [ <length-percentage> <length-percentage> ]# )\n  <path()> = path( <'fill-rule'>? , <string> )\n  <shape()> = shape( <'fill-rule'>? from <position> , <shape-command># )\n  <visual-box> = content-box | padding-box | border-box\n  <length-percentage> = <length> | <percentage>\n  <inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )\n  <xywh()> = xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <fill-rule> = nonzero | evenodd\n  <shape-command> = <move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <move-command> = move <command-end-point>\n  <line-command> = line <command-end-point>\n  <horizontal-line-command> = hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]\n  <vertical-line-command> = vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]\n  <curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]\n  <smooth-command> = smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]\n  <arc-command> = arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [ rotate <angle> ]? ]\n  <command-end-point> = to <position> | by <coordinate-pair>\n  <control-point> = <position> | <relative-control-point>\n  <coordinate-pair> = <length-percentage>{2}\n  <relative-control-point> = <coordinate-pair> [ from [ start | end | origin ] ]?\n  <arc-sweep> = cw | ccw\n  <arc-size> = large | small", "values": { - "none": "Specifies that the element does not follow any offset path. The none value is equivalent to the element not having any offset transform. The element's movement in this case is determined by its default position properties, such as top and left, instead of an offset path. This is the default value.", - "<offset-path>": "A ray() function, a <url> value, or a <basic-shape> value that specifies the geometrical offset path. If omitted, the path shape for the <coord-box> value is inset(0 round X), where X is the value of border-radius of the element that establishes the containing block.\n

    \n
    ray()
    \n
    \n

    Defines a line starting at a set position, of a set length, and extending at the specified angle. The ray() function accepts up to four parameters – an <angle>, an optional size value, the optional keyword contain, and an optional at <position>.\n

    \n
    <url>
    \n
    \n

    Specifies the ID of an SVG shape element. The path is the shape of the SVG <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, or <rect> element referenced by its id in the url() function. If the URL does not reference a shape element or is otherwise invalid, the resolved value for the offset path is path(\"M0,0\") (which is a valid <basic-shape> value).\n

    \n
    <basic-shape>
    \n
    \n

    Specifies the offset path as the equivalent path of a CSS basic shape function, such as circle(), ellipse(), inset(), path(), polygon(), rect(), or xywh(). For example, if the <basic_shape> is an ellipse() function, then the path is the outline of the ellipse, starting at the rightmost point of the ellipse, proceeding clockwise through a full rotation. For ellipse() and circle(), which accept the at <position> parameter, if the <position> is omitted, the position defaults to center unless the element has an offset-position specified. In this case, the offset-position value is used for the at <position> parameter. More complex shapes can be defined using the shape() function.\n

    \n
    ", - "<coord-box>": "Specifies the size information of the reference box containing the path. The reference box is derived from the element that establishes the containing block for this element. This parameter is optional. If not specified, the default value is border-box in CSS contexts. In SVG contexts, the value is treated as view-box. If ray() or <basic-shape> is used to define the offset path, the <coord-box> value provides the reference box for the ray or the <basic-shape>, respectively. If <url> is used to define the offset path, the <coord-box> value provides the viewport and user coordinate system for the shape element, with the origin (0 0) at the top left corner and size being 1px." + "none": "Specifies that the element does not follow any offset path. The none value is equivalent to the element not having any offset transform. The element's movement in this case is determined by its default position properties, such as top and left, instead of an offset path. This is the default value.", + "<offset-path>": "A ray() function, a <url> value, or a <basic-shape> value that specifies the geometrical offset path. If omitted, the path shape for the <coord-box> value is inset(0 round X), where X is the value of border-radius of the element that establishes the containing block.\n
    \n
    ray()
    \n
    \n

    Defines a line starting at a set position, of a set length, and extending at the specified angle. The ray() function accepts up to four parameters – an <angle>, an optional size value, the optional keyword contain, and an optional at <position>.\n

    \n
    <url>
    \n
    \n

    Specifies the ID of an SVG shape element. The path is the shape of the SVG <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, or <rect> element referenced by its id in the url() function. If the URL does not reference a shape element or is otherwise invalid, the resolved value for the offset path is path(\"M0,0\") (which is a valid <basic-shape> value).\n

    \n
    <basic-shape>
    \n
    \n

    Specifies the offset path as the equivalent path of a CSS basic shape function, such as circle(), ellipse(), inset(), path(), polygon(), rect(), or xywh(). For example, if the <basic_shape> is an ellipse() function, then the path is the outline of the ellipse, starting at the rightmost point of the ellipse, proceeding clockwise through a full rotation. For ellipse() and circle(), which accept the at <position> parameter, if the <position> is omitted, the position defaults to center unless the element has an offset-position specified. In this case, the offset-position value is used for the at <position> parameter. More complex shapes can be defined using the shape() function.\n

    \n
    ", + "<coord-box>": "Specifies the size information of the reference box containing the path. The reference box is derived from the element that establishes the containing block for this element. This parameter is optional. If not specified, the default value is border-box in CSS contexts. In SVG contexts, the value is treated as view-box. If ray() or <basic-shape> is used to define the offset path, the <coord-box> value provides the reference box for the ray or the <basic-shape>, respectively. If <url> is used to define the offset path, the <coord-box> value provides the viewport and user coordinate system for the shape element, with the origin (0 0) at the top left corner and size being 1px." } }, "offset-position": { - "url": "$MDN_URL$/web/css/offset-position", + "url": "$MDN_URL$/web/css/reference/properties/offset-position", "status": [ "StandardTrack" ], @@ -15351,16 +15557,16 @@ "level": "LOW", "lowDate": "2024-01-23" }, - "doc": "The offset-position CSS property defines the initial position of an element along a path. This property is typically used in combination with the offset-path property to create a motion effect. The value of offset-position determines where the element gets placed initially for moving along an offset path if an offset-path function such as path() does not specify its own starting position.\n

    The offset-position property is part of a motion system based on offset constituent properties, including offset-anchor, offset-distance, and offset-path. These properties work together to create various motion effects along a path.", + "doc": "The offset-position CSS property defines the initial position of an element along a path. This property is typically used in combination with the offset-path property to create a motion effect. The value of offset-position determines where the element gets placed initially for moving along an offset path if an offset-path function such as path() does not specify its own starting position.\n

    The offset-position property is part of a motion system based on offset constituent properties, including offset-anchor, offset-distance, and offset-path. These properties work together to create various motion effects along a path.", "formalSyntax": "normal | auto | <position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>", "values": { "normal": "Indicates that the element does not have an offset starting position and places the element at 50% 50% of the containing block. This is the default value.", "auto": "Indicates that the offset starting position is the top-left corner of the element's box.", - "<position>": "Specifies the position as an x/y coordinate to place an element relative to its box edges. The position can be defined using one to four values. If two non-keyword values are used, the first value represents the horizontal position and the second represents the vertical position. If only one value is specified, the second value is assumed to be center. If three or four values are used, the <length-percentage> values are offsets for the preceding keyword value(s). For more explanation of these value types, see background-position." + "<position>": "Specifies the position as an x/y coordinate to place an element relative to its box edges. The position can be defined using one to four values. If two non-keyword values are used, the first value represents the horizontal position and the second represents the vertical position. If only one value is specified, the second value is assumed to be center. If three or four values are used, the <length-percentage> values are offsets for the preceding keyword value(s). For more explanation of these value types, see background-position." } }, "offset-rotate": { - "url": "$MDN_URL$/web/css/offset-rotate", + "url": "$MDN_URL$/web/css/reference/properties/offset-rotate", "status": [ "StandardTrack" ], @@ -15379,11 +15585,11 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The offset-rotate CSS property defines the orientation/direction of the element as it is positioned along the offset-path.", + "doc": "The offset-rotate CSS property defines the orientation/direction of the element as it is positioned along the offset-path.", "formalSyntax": "[ auto | reverse ] || <angle>" }, "opacity": { - "url": "$MDN_URL$/web/css/opacity", + "url": "$MDN_URL$/web/css/reference/properties/opacity", "status": [ "StandardTrack" ], @@ -15405,11 +15611,11 @@ "doc": "The opacity CSS property sets the opacity of an element. Opacity is the degree to which content behind an element is hidden, and is the opposite of transparency.", "formalSyntax": "<opacity-value>\n  <opacity-value> = <number> | <percentage>", "values": { - "<alpha-value>": "A <number> in the range 0.0 to 1.0, inclusive, or a <percentage> in the range 0% to 100%, inclusive, representing the opacity of the channel (that is, the value of its alpha channel). Any value outside the interval, though valid, is clamped to the nearest limit in the range.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ValueMeaning
    0The element is fully transparent (that is, invisible).
    Any <number> strictly between 0 and 1The element is translucent (that is, content behind the element can be seen).
    1 (default value)The element is fully opaque (visually solid).
    " + "<alpha-value>": "A <number> in the range 0.0 to 1.0, inclusive, or a <percentage> in the range 0% to 100%, inclusive, representing the opacity of the channel (that is, the value of its alpha channel). Any value outside the interval, though valid, is clamped to the nearest limit in the range.\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ValueMeaning
    0The element is fully transparent (that is, invisible).
    Any <number> strictly between 0 and 1The element is translucent (that is, content behind the element can be seen).
    1 (default value)The element is fully opaque (visually solid).
    " } }, "order": { - "url": "$MDN_URL$/web/css/order", + "url": "$MDN_URL$/web/css/reference/properties/order", "status": [ "StandardTrack" ], @@ -15429,13 +15635,13 @@ "highDate": "2018-03-30" }, "doc": "The order CSS property sets the order to lay out an item in a flex or grid container. Items in a container are sorted by ascending order value and then by their source code order. Items not given an explicit order value are assigned the default value of 0.", - "formalSyntax": "<integer>", + "formalSyntax": "<integer>\n  <integer> = <number-token>", "values": { "<integer>": "Represents the ordinal group to be used by the item." } }, "orphans": { - "url": "$MDN_URL$/web/css/orphans", + "url": "$MDN_URL$/web/css/reference/properties/orphans", "status": [ "StandardTrack" ], @@ -15450,14 +15656,14 @@ "baseline": { "level": "NONE" }, - "doc": "The orphans CSS property sets the minimum number of lines in a block container that must be shown at the bottom of a page, region, or column.\n

    In typography, an orphan is the first line of a paragraph that appears alone at the bottom of a page. (The paragraph continues on a following page.)", - "formalSyntax": "<integer [1,∞]>", + "doc": "The orphans CSS property sets the minimum number of lines in a block container that must be shown at the bottom of a page, region, or column.\n

    In typography, an orphan is the first line of a paragraph that appears alone at the bottom of a page. (The paragraph continues on a following page.)", + "formalSyntax": "<integer [1,∞]>\n  <integer> = <number-token>", "values": { "<integer>": "The minimum number of lines that can stay by themselves at the bottom of a fragment before a fragmentation break. The value must be positive." } }, "outline": { - "url": "$MDN_URL$/web/css/outline", + "url": "$MDN_URL$/web/css/reference/properties/outline", "status": [ "StandardTrack" ], @@ -15476,16 +15682,16 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The outline CSS shorthand property sets most of the outline properties in a single declaration.", - "formalSyntax": "<'outline-width'> || <'outline-style'> || <'outline-color'>\n  <outline-width> = <line-width>\n  <outline-style> = auto | <outline-line-style>\n  <outline-color> = auto | <color> | <image-1D>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", + "doc": "The outline CSS shorthand property sets most of the outline properties in a single declaration.", + "formalSyntax": "<'outline-width'> || <'outline-style'> || <'outline-color'>\n  <outline-width> = <line-width>\n  <outline-style> = auto | <outline-line-style>\n  <outline-color> = auto | <'border-top-color'>\n  <line-width> = <length [0,∞]> | thin | medium | thick\n  <outline-line-style> = none | auto | dotted | dashed | solid | double | groove | ridge | inset | outset\n  <border-top-color> = <color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { - "<'outline-width'>": "Sets the thickness of the outline. Defaults to medium if absent. See outline-width.", - "<'outline-style'>": "Sets the style of the outline. Defaults to none if absent. See outline-style.", - "<'outline-color'>": "Sets the color of the outline. Defaults to invert for browsers supporting it, currentColor for the others. See outline-color." + "<'outline-width'>": "Sets the thickness of the outline. Defaults to medium if absent. See outline-width.", + "<'outline-style'>": "Sets the style of the outline. Defaults to none if absent. See outline-style.", + "<'outline-color'>": "Sets the color of the outline. Defaults to invert for browsers supporting it, currentColor for the others. See outline-color." } }, "outline-color": { - "url": "$MDN_URL$/web/css/outline-color", + "url": "$MDN_URL$/web/css/reference/properties/outline-color", "status": [ "StandardTrack" ], @@ -15505,13 +15711,13 @@ "highDate": "2018-01-29" }, "doc": "The outline-color CSS property sets the color of an element's outline.", - "formalSyntax": "auto | <color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", + "formalSyntax": "auto | <'border-top-color'>\n  <border-top-color> = <color> | <image-1D>\n  <image-1D> = <stripes()>\n  <stripes()> = stripes( <color-stripe># )\n  <color-stripe> = <color> &&[ <length-percentage> | <flex> ]?\n  <length-percentage> = <length> | <percentage>", "values": { "<color>": "The color of the outline, specified as a <color>." } }, "outline-offset": { - "url": "$MDN_URL$/web/css/outline-offset", + "url": "$MDN_URL$/web/css/reference/properties/outline-offset", "status": [ "StandardTrack" ], @@ -15530,14 +15736,14 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The outline-offset CSS property sets the amount of space between an outline and the edge or border of an element.", + "doc": "The outline-offset CSS property sets the amount of space between an outline and the edge or border of an element.", "formalSyntax": "<length>", "values": { "<length>": "The width of the space between the element and its outline. A negative value places the outline inside the element. A value of 0 places the outline so that there is no space between it and the element." } }, "outline-style": { - "url": "$MDN_URL$/web/css/outline-style", + "url": "$MDN_URL$/web/css/reference/properties/outline-style", "status": [ "StandardTrack" ], @@ -15556,15 +15762,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The outline-style CSS property sets the style of an element's outline. An outline is a line that is drawn around an element, outside the border.", - "formalSyntax": "auto | <outline-line-style>", + "doc": "The outline-style CSS property sets the style of an element's outline. An outline is a line that is drawn around an element, outside the border.", + "formalSyntax": "auto | <outline-line-style>\n  <outline-line-style> = none | auto | dotted | dashed | solid | double | groove | ridge | inset | outset", "values": { "auto": "Permits the user agent to render a custom outline style.", - "none": "No outline is used. The outline-width is 0.", + "none": "No outline is used. The outline-width is 0.", "dotted": "The outline is a series of dots.", "dashed": "The outline is a series of short line segments.", "solid": "The outline is a single line.", - "double": "The outline is two single lines. The outline-width is the sum of the two lines and the space between them.", + "double": "The outline is two single lines. The outline-width is the sum of the two lines and the space between them.", "groove": "The outline looks as though it were carved into the page.", "ridge": "The opposite of groove: the outline looks as though it were extruded from the page.", "inset": "The outline makes the box look as though it were embedded in the page.", @@ -15572,7 +15778,7 @@ } }, "outline-width": { - "url": "$MDN_URL$/web/css/outline-width", + "url": "$MDN_URL$/web/css/reference/properties/outline-width", "status": [ "StandardTrack" ], @@ -15591,7 +15797,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSS outline-width property sets the thickness of an element's outline. An outline is a line that is drawn around an element, outside the border.", + "doc": "The CSS outline-width property sets the thickness of an element's outline. An outline is a line that is drawn around an element, outside the border.", "formalSyntax": "<line-width>\n  <line-width> = <length [0,∞]> | thin | medium | thick", "values": { "<length>": "The width of the outline specified as a <length>.", @@ -15601,7 +15807,7 @@ } }, "overflow": { - "url": "$MDN_URL$/web/css/overflow", + "url": "$MDN_URL$/web/css/reference/properties/overflow", "status": [ "StandardTrack" ], @@ -15620,18 +15826,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The overflow CSS shorthand property sets the desired behavior when content does not fit in the element's padding box (overflows) in the horizontal and/or vertical direction.", + "doc": "The overflow CSS shorthand property sets the desired behavior when content does not fit in the element's padding box (overflows) in the horizontal and/or vertical direction.", "formalSyntax": "<'overflow-block'>{1,2}\n  <overflow-block> = visible | hidden | clip | scroll | auto", "values": { "visible": "Overflow content is not clipped and may be visible outside the element's padding box. The element box is not a scroll container. This is the default value of the overflow property.", "hidden": "Overflow content is clipped at the element's padding box. There are no scroll bars, and the clipped content is not visible (i.e., clipped content is hidden), but the content still exists. User agents do not add scroll bars and also do not allow users to view the content outside the clipped region by actions such as dragging on a touch screen or using the scroll wheel on a mouse. The content can be scrolled programmatically (for example, by linking to anchor text, by tabbing to a hidden yet focusable element, or by setting the value of the scrollLeft property or the scrollTo() method), in which case the element box is a scroll container.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. Overflow content outside the clipped region is not visible, user agents do not add a scroll bar, and programmatic scrolling is also not supported. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. Overflow content outside the clipped region is not visible, user agents do not add a scroll bar, and programmatic scrolling is also not supported. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", "scroll": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view using scroll bars. User agents display scroll bars whether or not any content is overflowing, so in the horizontal and vertical directions if the value applies to both directions. The use of this keyword, therefore, can prevent scroll bars from appearing and disappearing as content changes. Printers may still print overflow content. The element box is a scroll container.", "auto": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view using scroll bars. Unlike scroll, user agents display scroll bars only if the content is overflowing. If content fits inside the element's padding box, it looks the same as with visible but still establishes a new formatting context. The element box is a scroll container." } }, "overflow-anchor": { - "url": "$MDN_URL$/web/css/overflow-anchor", + "url": "$MDN_URL$/web/css/reference/properties/overflow-anchor", "status": [ "StandardTrack" ], @@ -15655,7 +15861,7 @@ } }, "overflow-block": { - "url": "$MDN_URL$/web/css/overflow-block", + "url": "$MDN_URL$/web/css/reference/properties/overflow-block", "status": [ "StandardTrack" ], @@ -15673,18 +15879,18 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "The overflow-block CSS property sets what shows when content overflows the block start and block end edges of a box. This may be nothing, a scroll bar, or the overflow content.\n

    \n

    Note:\nThe overflow-block property maps to overflow-y or overflow-x depending on the writing mode of the document.\n

    ", + "doc": "The overflow-block CSS property sets what shows when content overflows the block start and block end edges of a box. This may be nothing, a scroll bar, or the overflow content.\n
    \n

    Note:\nThe overflow-block property maps to overflow-y or overflow-x depending on the writing mode of the document.\n

    ", "formalSyntax": "visible | hidden | clip | scroll | auto", "values": { "visible": "Content is not clipped and may be rendered outside the padding box's block start and block end edges.", "hidden": "Content is clipped if necessary to fit the block dimension in the padding box. No scrollbars are provided.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property.", "scroll": "Content is clipped if necessary to fit in the block dimension in the padding box. Browsers display scrollbars whether or not any content is actually clipped. (This prevents scrollbars from appearing or disappearing when the content changes.) Printers may still print overflowing content.", "auto": "Depends on the user agent. If content fits inside the padding box, it looks the same as visible, but still establishes a new block-formatting context." } }, "overflow-clip-margin": { - "url": "$MDN_URL$/web/css/overflow-clip-margin", + "url": "$MDN_URL$/web/css/reference/properties/overflow-clip-margin", "status": [ "StandardTrack" ], @@ -15692,11 +15898,11 @@ "baseline": { "level": "NONE" }, - "doc": "The overflow-clip-margin CSS property determines how far outside its bounds an element with overflow: clip may be painted before being clipped. The bound defined by this property is called the overflow clip edge of the box.", + "doc": "The overflow-clip-margin CSS property determines how far outside its bounds an element with overflow: clip may be painted before being clipped. The bound defined by this property is called the overflow clip edge of the box.", "formalSyntax": "<visual-box> || <length [0,∞]>\n  <visual-box> = content-box | padding-box | border-box" }, "overflow-inline": { - "url": "$MDN_URL$/web/css/overflow-inline", + "url": "$MDN_URL$/web/css/reference/properties/overflow-inline", "status": [ "StandardTrack" ], @@ -15714,18 +15920,18 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "The overflow-inline CSS property sets what shows when content overflows the inline start and end edges of a box. This may be nothing, a scroll bar, or the overflow content.\n
    \n

    Note:\nThe overflow-inline property maps to overflow-y or overflow-x depending on the writing mode of the document.\n

    ", + "doc": "The overflow-inline CSS property sets what shows when content overflows the inline start and end edges of a box. This may be nothing, a scroll bar, or the overflow content.\n
    \n

    Note:\nThe overflow-inline property maps to overflow-y or overflow-x depending on the writing mode of the document.\n

    ", "formalSyntax": "visible | hidden | clip | scroll | auto", "values": { "visible": "Content is not clipped and may be rendered outside the padding box's inline start and end edges.", "hidden": "Content is clipped if necessary to fit the inline dimension in the padding box. No scrollbars are provided.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property.", "scroll": "Content is clipped if necessary to fit in the padding box in the inline dimension. Browsers display scrollbars whether or not any content is actually clipped. (This prevents scrollbars from appearing or disappearing when the content changes.) Printers may still print overflowing content.", "auto": "Depends on the user agent. If content fits inside the padding box, it looks the same as visible, but still establishes a new block-formatting context. Desktop browsers provide scrollbars if content overflows." } }, "overflow-wrap": { - "url": "$MDN_URL$/web/css/overflow-wrap", + "url": "$MDN_URL$/web/css/reference/properties/overflow-wrap", "status": [ "StandardTrack" ], @@ -15753,7 +15959,7 @@ } }, "overflow-x": { - "url": "$MDN_URL$/web/css/overflow-x", + "url": "$MDN_URL$/web/css/reference/properties/overflow-x", "status": [ "StandardTrack" ], @@ -15772,18 +15978,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The overflow-x CSS property sets what shows when content overflows a block-level element's left and right edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property.", + "doc": "The overflow-x CSS property sets what shows when content overflows a block-level element's left and right edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property.", "formalSyntax": "visible | hidden | clip | scroll | auto", "values": { "visible": "Overflow content is not clipped and may be visible outside the element's padding box on left and right edges. The element box is not a scroll container.", "hidden": "Overflow content is clipped if necessary to fit horizontally in the elements' padding box. No scroll bars are provided.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. The difference between clip and hidden is that the clip keyword also forbids all scrolling, including programmatic scrolling. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. The difference between clip and hidden is that the clip keyword also forbids all scrolling, including programmatic scrolling. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", "scroll": "Overflow content is clipped if necessary to fit horizontally inside the element's padding box. Browsers display scroll bars in the horizontal direction whether or not any content is actually clipped. (This prevents scroll bars from appearing or disappearing when the content changes.) Printers may still print overflowing content.", "auto": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view. Unlike scroll, user agents display scroll bars only if the content is overflowing and hide scroll bars by default. If content fits inside the element's padding box, it looks the same as with visible, but still establishes a new block-formatting context. Desktop browsers provide scroll bars if content overflows." } }, "overflow-y": { - "url": "$MDN_URL$/web/css/overflow-y", + "url": "$MDN_URL$/web/css/reference/properties/overflow-y", "status": [ "StandardTrack" ], @@ -15802,18 +16008,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The overflow-y CSS property sets what shows when content overflows a block-level element's top and bottom edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property.", + "doc": "The overflow-y CSS property sets what shows when content overflows a block-level element's top and bottom edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property.", "formalSyntax": "visible | hidden | clip | scroll | auto", "values": { "visible": "Overflow content is not clipped and may be visible outside the element's padding box at the top and bottom edges. The element box is not a scroll container.", "hidden": "Overflow content is clipped if necessary to fit vertically in the elements' padding box. No scroll bars are provided.", - "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. The difference between clip and hidden is that the clip keyword also forbids all scrolling, including programmatic scrolling. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", + "clip": "Overflow content is clipped at the element's overflow clip edge that is defined using the overflow-clip-margin property. As a result, content overflows the element's padding box by the <length> value of overflow-clip-margin or by 0px if not set. The difference between clip and hidden is that the clip keyword also forbids all scrolling, including programmatic scrolling. No new formatting context is created. To establish a formatting context, use overflow: clip along with display: flow-root. The element box is not a scroll container.", "scroll": "Overflow content is clipped if necessary to fit vertically inside the element's padding box. Browsers display scroll bars in the vertical direction whether or not any content is actually clipped. (This prevents scroll bars from appearing or disappearing when the content changes.) Printers may still print overflowing content.", "auto": "Overflow content is clipped at the element's padding box, and overflow content can be scrolled into view. Unlike scroll, user agents display scroll bars only if the content is overflowing, hiding scroll bars by default. If content fits inside the element's padding box, it looks the same as with visible, but still establishes a new block-formatting context." } }, "overlay": { - "url": "$MDN_URL$/web/css/overlay", + "url": "$MDN_URL$/web/css/reference/properties/overlay", "status": [ "Experimental", "StandardTrack" @@ -15827,7 +16033,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The overlay CSS property specifies whether an element appearing in the top layer (for example, a shown popover or modal <dialog> element) is actually rendered in the top layer. This property is only relevant within a list of transition-property values, and only if allow-discrete is set as the transition-behavior.\n

    It is important to note that overlay can only be set by the browser — author styles cannot change the overlay value of any element. You can, however, add overlay to the list of transition properties set on an element. This causes its removal from the top layer to be deferred so it can be animated instead of disappearing immediately.\n

    \n

    Note:\nWhen transitioning overlay, you need to set transition-behavior: allow-discrete on the transition so that it will animate. overlay animations differ from normal discrete animations in that the visible (i.e., auto) state will always be shown for the full duration of the transition, regardless of whether it is the start or end state.\n

    ", + "doc": "

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

    \n

    The overlay CSS property specifies whether an element appearing in the top layer (for example, a shown popover or modal <dialog> element) is actually rendered in the top layer. This property is only relevant within a list of transition-property values, and only if allow-discrete is set as the transition-behavior.\n

    It is important to note that overlay can only be set by the browser — author styles cannot change the overlay value of any element. You can, however, add overlay to the list of transition properties set on an element. This causes its removal from the top layer to be deferred so it can be animated instead of disappearing immediately.\n

    \n

    Note:\nWhen transitioning overlay, you need to set transition-behavior: allow-discrete on the transition so that it will animate. overlay animations differ from normal discrete animations in that the visible (i.e., auto) state will always be shown for the full duration of the transition, regardless of whether it is the start or end state.\n

    ", "formalSyntax": "none | auto", "values": { "auto": "The element is rendered in the top layer if it is promoted to the top layer.", @@ -15835,7 +16041,7 @@ } }, "overscroll-behavior": { - "url": "$MDN_URL$/web/css/overscroll-behavior", + "url": "$MDN_URL$/web/css/reference/properties/overscroll-behavior", "status": [ "StandardTrack" ], @@ -15863,7 +16069,7 @@ } }, "overscroll-behavior-block": { - "url": "$MDN_URL$/web/css/overscroll-behavior-block", + "url": "$MDN_URL$/web/css/reference/properties/overscroll-behavior-block", "status": [ "StandardTrack" ], @@ -15882,7 +16088,7 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The overscroll-behavior-block CSS property sets the browser's behavior when the block direction boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", + "doc": "The overscroll-behavior-block CSS property sets the browser's behavior when the block direction boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", "formalSyntax": "contain | none | auto", "values": { "auto": "The default scroll overflow behavior occurs as normal.", @@ -15891,7 +16097,7 @@ } }, "overscroll-behavior-inline": { - "url": "$MDN_URL$/web/css/overscroll-behavior-inline", + "url": "$MDN_URL$/web/css/reference/properties/overscroll-behavior-inline", "status": [ "StandardTrack" ], @@ -15910,7 +16116,7 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The overscroll-behavior-inline CSS property sets the browser's behavior when the inline direction boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", + "doc": "The overscroll-behavior-inline CSS property sets the browser's behavior when the inline direction boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", "formalSyntax": "contain | none | auto", "values": { "auto": "The default scroll overflow behavior occurs as normal.", @@ -15919,7 +16125,7 @@ } }, "overscroll-behavior-x": { - "url": "$MDN_URL$/web/css/overscroll-behavior-x", + "url": "$MDN_URL$/web/css/reference/properties/overscroll-behavior-x", "status": [ "StandardTrack" ], @@ -15938,7 +16144,7 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The overscroll-behavior-x CSS property sets the browser's behavior when the horizontal boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", + "doc": "The overscroll-behavior-x CSS property sets the browser's behavior when the horizontal boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", "formalSyntax": "contain | none | auto", "values": { "auto": "The default scroll overflow behavior occurs as normal.", @@ -15947,7 +16153,7 @@ } }, "overscroll-behavior-y": { - "url": "$MDN_URL$/web/css/overscroll-behavior-y", + "url": "$MDN_URL$/web/css/reference/properties/overscroll-behavior-y", "status": [ "StandardTrack" ], @@ -15966,7 +16172,7 @@ "lowDate": "2022-09-12", "highDate": "2025-03-12" }, - "doc": "The overscroll-behavior-y CSS property sets the browser's behavior when the vertical boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", + "doc": "The overscroll-behavior-y CSS property sets the browser's behavior when the vertical boundary of a scrolling area is reached.\n

    See overscroll-behavior for a full explanation.", "formalSyntax": "contain | none | auto", "values": { "auto": "The default scroll overflow behavior occurs as normal.", @@ -15975,7 +16181,7 @@ } }, "padding": { - "url": "$MDN_URL$/web/css/padding", + "url": "$MDN_URL$/web/css/reference/properties/padding", "status": [ "StandardTrack" ], @@ -15994,15 +16200,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The padding CSS shorthand property sets the padding area on all four sides of an element at once.", + "doc": "The padding CSS shorthand property sets the padding area on all four sides of an element at once.", "formalSyntax": "<'padding-top'>{1,4}\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block." } }, "padding-block": { - "url": "$MDN_URL$/web/css/padding-block", + "url": "$MDN_URL$/web/css/reference/properties/padding-block", "status": [ "StandardTrack" ], @@ -16021,11 +16227,11 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The padding-block CSS shorthand property defines the logical block start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.", + "doc": "The padding-block CSS shorthand property defines the logical block start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.", "formalSyntax": "<'padding-top'>{1,2}\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>" }, "padding-block-end": { - "url": "$MDN_URL$/web/css/padding-block-end", + "url": "$MDN_URL$/web/css/reference/properties/padding-block-end", "status": [ "StandardTrack" ], @@ -16048,11 +16254,11 @@ "formalSyntax": "<'padding-top'>\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-block-start": { - "url": "$MDN_URL$/web/css/padding-block-start", + "url": "$MDN_URL$/web/css/reference/properties/padding-block-start", "status": [ "StandardTrack" ], @@ -16075,11 +16281,11 @@ "formalSyntax": "<'padding-top'>\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline-size (width in a horizontal language) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline-size (width in a horizontal language) of the containing block. Must be nonnegative." } }, "padding-bottom": { - "url": "$MDN_URL$/web/css/padding-bottom", + "url": "$MDN_URL$/web/css/reference/properties/padding-bottom", "status": [ "StandardTrack" ], @@ -16098,15 +16304,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The padding-bottom CSS property sets the height of the padding area on the bottom of an element.", + "doc": "The padding-bottom CSS property sets the height of the padding area on the bottom of an element.", "formalSyntax": "<length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-inline": { - "url": "$MDN_URL$/web/css/padding-inline", + "url": "$MDN_URL$/web/css/reference/properties/padding-inline", "status": [ "StandardTrack" ], @@ -16125,15 +16331,15 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The padding-inline CSS shorthand property defines the logical inline start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.", + "doc": "The padding-inline CSS shorthand property defines the logical inline start and end padding of an element, which maps to physical padding properties depending on the element's writing mode, directionality, and text orientation.", "formalSyntax": "<'padding-top'>{1,2}\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-inline-end": { - "url": "$MDN_URL$/web/css/padding-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/padding-inline-end", "status": [ "StandardTrack" ], @@ -16156,11 +16362,11 @@ "formalSyntax": "<'padding-top'>\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline-size (width in a horizontal language) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline-size (width in a horizontal language) of the containing block. Must be nonnegative." } }, "padding-inline-start": { - "url": "$MDN_URL$/web/css/padding-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/padding-inline-start", "status": [ "StandardTrack" ], @@ -16183,11 +16389,11 @@ "formalSyntax": "<'padding-top'>\n  <padding-top> = <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-left": { - "url": "$MDN_URL$/web/css/padding-left", + "url": "$MDN_URL$/web/css/reference/properties/padding-left", "status": [ "StandardTrack" ], @@ -16206,15 +16412,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The padding-left CSS property sets the width of the padding area to the left of an element.", + "doc": "The padding-left CSS property sets the width of the padding area to the left of an element.", "formalSyntax": "<length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-right": { - "url": "$MDN_URL$/web/css/padding-right", + "url": "$MDN_URL$/web/css/reference/properties/padding-right", "status": [ "StandardTrack" ], @@ -16233,15 +16439,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The padding-right CSS property sets the width of the padding area on the right of an element.", + "doc": "The padding-right CSS property sets the width of the padding area on the right of an element.", "formalSyntax": "<length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "padding-top": { - "url": "$MDN_URL$/web/css/padding-top", + "url": "$MDN_URL$/web/css/reference/properties/padding-top", "status": [ "StandardTrack" ], @@ -16260,15 +16466,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The padding-top CSS property sets the height of the padding area on the top of an element.", + "doc": "The padding-top CSS property sets the height of the padding area on the top of an element.", "formalSyntax": "<length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { "<length>": "The size of the padding as a fixed value. Must be nonnegative.", - "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." + "<percentage>": "The size of the padding as a percentage, relative to the inline size (width in a horizontal language, defined by writing-mode) of the containing block. Must be nonnegative." } }, "page": { - "url": "$MDN_URL$/web/css/page", + "url": "$MDN_URL$/web/css/reference/properties/page", "status": [ "StandardTrack" ], @@ -16287,15 +16493,15 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The page CSS property is used to specify the named page, a specific type of page defined by the @page at-rule.\n

    If there are multiple selectors that are using a named page consecutively then a forced page break using break-after may be needed.", + "doc": "The page CSS property is used to specify the named page, a specific type of page defined by the @page at-rule.\n

    If there are multiple selectors that are using a named page consecutively then a forced page break using break-after may be needed.", "formalSyntax": "auto | <custom-ident>", "values": { "auto": "Default value. Use the value of the nearest ancestor with a non-auto value. If no ancestor has a named page value set, the used value for auto is the empty string.", - "<custom-ident>": "Case-sensitive name defined in a @page at-rule." + "<custom-ident>": "Case-sensitive name defined in a @page at-rule." } }, "page-break-after": { - "url": "$MDN_URL$/web/css/page-break-after", + "url": "$MDN_URL$/web/css/reference/properties/page-break-after", "status": [ "StandardTrack", "Deprecated" @@ -16310,7 +16516,7 @@ "Safari": "1.2", "SafariIOS": "" }, - "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-after property.\n

    \n

    The page-break-after CSS property adjusts page breaks after the current element.", + "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-after property.\n

    \n

    The page-break-after CSS property adjusts page breaks after the current element.", "formalSyntax": "auto | always | avoid | left | right | inherit", "values": { "auto": "Initial value. Automatic page breaks (neither forced nor forbidden).", @@ -16323,7 +16529,7 @@ } }, "page-break-before": { - "url": "$MDN_URL$/web/css/page-break-before", + "url": "$MDN_URL$/web/css/reference/properties/page-break-before", "status": [ "StandardTrack", "Deprecated" @@ -16338,7 +16544,7 @@ "Safari": "1.2", "SafariIOS": "" }, - "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-before property.\n

    \n

    The page-break-before CSS property adjusts page breaks before the current element.\n

    This property applies to block elements that generate a box. It won't apply on an empty <div> that won't generate a box.", + "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-before property.\n

    \n

    The page-break-before CSS property adjusts page breaks before the current element.\n

    This property applies to block elements that generate a box. It won't apply on an empty <div> that won't generate a box.", "formalSyntax": "auto | always | avoid | left | right | inherit", "values": { "auto": "Initial value. Automatic page breaks (neither forced nor forbidden).", @@ -16351,7 +16557,7 @@ } }, "page-break-inside": { - "url": "$MDN_URL$/web/css/page-break-inside", + "url": "$MDN_URL$/web/css/reference/properties/page-break-inside", "status": [ "StandardTrack", "Deprecated" @@ -16366,7 +16572,7 @@ "Safari": "1.3", "SafariIOS": "" }, - "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-inside property.\n

    \n

    The page-break-inside CSS property adjusts page breaks inside the current element.", + "doc": "

    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.

    \n
    \n

    Warning:\nThis property has been replaced by the break-inside property.\n

    \n

    The page-break-inside CSS property adjusts page breaks inside the current element.", "formalSyntax": "avoid | auto | inherit", "values": { "auto": "Initial value. Automatic page breaks (neither forced nor forbidden).", @@ -16374,7 +16580,7 @@ } }, "paint-order": { - "url": "$MDN_URL$/web/css/paint-order", + "url": "$MDN_URL$/web/css/reference/properties/paint-order", "status": [ "StandardTrack" ], @@ -16400,7 +16606,7 @@ } }, "perspective": { - "url": "$MDN_URL$/web/css/perspective", + "url": "$MDN_URL$/web/css/reference/properties/perspective", "status": [ "StandardTrack" ], @@ -16423,11 +16629,11 @@ "formalSyntax": "none | <length [0,∞]>", "values": { "none": "Indicates that no perspective transform is to be applied.", - "<length>": "A <length> giving the distance from the user to the z=0 plane. It is used to apply a perspective transform to the children of the element. Negative values are syntax errors. If the value is smaller than 1px, it is clamped to 1px." + "<length>": "A <length> giving the distance from the user to the z=0 plane. It is used to apply a perspective transform to the children of the element. Negative values are syntax errors. If the value is smaller than 1px, it is clamped to 1px." } }, "perspective-origin": { - "url": "$MDN_URL$/web/css/perspective-origin", + "url": "$MDN_URL$/web/css/reference/properties/perspective-origin", "status": [ "StandardTrack" ], @@ -16446,15 +16652,15 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The perspective-origin CSS property determines the position at which the viewer is looking. It is used as the vanishing point by the perspective property.", + "doc": "The perspective-origin CSS property determines the position at which the viewer is looking. It is used as the vanishing point by the perspective property.", "formalSyntax": "<position>\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <length-percentage> = <length> | <percentage>", "values": { - "x-position": "Indicates the position of the abscissa of the vanishing point. It can have one of the following values:\n

    ", - "y-position": "Indicates the position of the ordinate of the vanishing point. It can have one of the following values:\n" + "x-position": "Indicates the position of the abscissa of the vanishing point. It can have one of the following values:\n", + "y-position": "Indicates the position of the ordinate of the vanishing point. It can have one of the following values:\n" } }, "place-content": { - "url": "$MDN_URL$/web/css/place-content", + "url": "$MDN_URL$/web/css/reference/properties/place-content", "status": [ "StandardTrack" ], @@ -16485,7 +16691,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The place-content CSS shorthand property allows you to align content along both the block and inline directions at once (i.e., the align-content and justify-content properties) in a relevant layout system such as Grid or Flexbox.", + "doc": "The place-content CSS shorthand property allows you to align content along both the block and inline directions at once (i.e., the align-content and justify-content properties) in a relevant layout system such as Grid or Flexbox.", "formalSyntax": "<'align-content'> <'justify-content'>?\n  <align-content> = normal | <baseline-position> | <content-distribution> | <overflow-position>? <content-position>\n  <justify-content> = normal | <content-distribution> | <overflow-position>? [ <content-position> | left | right ]\n  <baseline-position> = [ first | last ]? &&baseline\n  <content-distribution> = space-between | space-around | space-evenly | stretch\n  <overflow-position> = unsafe | safe\n  <content-position> = center | start | end | flex-start | flex-end", "values": { "start": "The items are packed flush to each other toward the start edge of the alignment container in the appropriate axis.", @@ -16499,13 +16705,13 @@ "baseline
    \nfirst baseline
    \nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", "space-around": "The items are evenly distributed within the alignment container. The spacing between each pair of adjacent items is the same. The empty space before the first and after the last item equals half of the space between each pair of adjacent items.", "space-evenly": "The items are evenly distributed within the alignment container. The spacing between each pair of adjacent items, the main-start edge and the first item, and the main-end edge and the last item, are all exactly the same.", - "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container", + "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container", "safe": "Used alongside an alignment keyword. If the chosen keyword means that the item overflows the alignment container causing data loss, the item is instead aligned as if the alignment mode were start.", "unsafe": "Used alongside an alignment keyword. Regardless of the relative sizes of the item and alignment container, and regardless of whether overflow which causes data loss might happen, the given alignment value is honored." } }, "place-items": { - "url": "$MDN_URL$/web/css/place-items", + "url": "$MDN_URL$/web/css/reference/properties/place-items", "status": [ "StandardTrack" ], @@ -16524,8 +16730,8 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The CSS place-items shorthand property aligns items along both the block and inline directions at once. It sets the values of the align-items and justify-items properties. If the second value is not set, the first value is also used for it.", - "formalSyntax": "<'align-items'> <'justify-items'>?\n  <align-items> = normal | stretch | <baseline-position> | [ <overflow-position>? <self-position> ] | anchor-center | dialog\n  <justify-items> = normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | legacy | legacy && [ left | right | center ] | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "doc": "The CSS place-items shorthand property aligns items along both the block and inline directions at once. It sets the values of the align-items and justify-items properties. If the second value is not set, the first value is also used for it.", + "formalSyntax": "<'align-items'> <'justify-items'>?\n  <align-items> = normal | stretch | <baseline-position> | <overflow-position>? <self-position> | anchor-center\n  <justify-items> = normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | legacy | legacy && [ left | right | center ] | anchor-center\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", "values": { "normal": "The effect of this keyword is dependent of the layout mode we are in:\n", "center": "The items are packed flush to each other toward the center of the alignment container.", @@ -16534,8 +16740,8 @@ "self-start": "The item is packed flush to the edge of the alignment container of the start side of the item, in the appropriate axis.", "self-end": "The item is packed flush to the edge of the alignment container of the end side of the item, in the appropriate axis.", "baseline
    \nfirst baseline
    \nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", - "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", - "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", + "stretch": "If the combined size of the items is less than the size of the alignment container, any auto-sized items have their size increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size exactly fills the alignment container.", + "anchor-center": "In the case of anchor-positioned elements, aligns the items to the center of the associated anchor element in the inline direction. See Centering on the anchor using anchor-center.", "safe": "If the size of the item overflows the alignment container, the item is instead aligned as if the alignment mode were start.", "unsafe": "Regardless of the relative sizes of the item and alignment container, the given alignment value is honored.", "flex-start": "For items that are not children of a flex container, this value is treated like start.", @@ -16546,7 +16752,7 @@ } }, "place-self": { - "url": "$MDN_URL$/web/css/place-self", + "url": "$MDN_URL$/web/css/reference/properties/place-self", "status": [ "StandardTrack" ], @@ -16585,10 +16791,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The place-self CSS shorthand property allows you to align an individual item in both the block and inline directions at once (i.e., the align-self and justify-self properties). This property applies to block-level boxes, absolutely-positioned boxes, and grid items. If the second value is not present, the first value is also used for it.", - "formalSyntax": "<'align-self'> <'justify-self'>?\n  <align-self> = auto | normal | stretch | <baseline-position> | <overflow-position>? <self-position> | anchor-center | dialog\n  <justify-self> = auto | normal | stretch | <baseline-position> | <overflow-position>? [ <self-position> | left | right ] | anchor-center | dialog\n  <baseline-position> = [ first | last ]? &&baseline\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end", + "doc": "The place-self CSS shorthand property allows you to align an individual item in both the block and inline directions at once (i.e., the align-self and justify-self properties). This property applies to block-level boxes, absolutely-positioned boxes, and grid items. If the second value is not present, the first value is also used for it.", + "formalSyntax": "<'align-self'> <'justify-self'>?\n  <align-self> = auto | <overflow-position>? [ normal | <self-position> ] | stretch | <baseline-position> | anchor-center\n  <justify-self> = auto | <overflow-position>? [ normal | <self-position> | left | right ] | stretch | <baseline-position> | anchor-center\n  <overflow-position> = unsafe | safe\n  <self-position> = center | start | end | self-start | self-end | flex-start | flex-end\n  <baseline-position> = [ first | last ]? &&baseline", "values": { - "auto": "Computes to the parent's align-items value.", + "auto": "Computes to the parent's align-items value.", "normal": "The effect of this keyword is dependent of the layout mode we are in:\n", "self-start": "Aligns the items to be flush with the edge of the alignment container corresponding to the item's start side in the cross axis.", "self-end": "Aligns the items to be flush with the edge of the alignment container corresponding to the item's end side in the cross axis.", @@ -16596,12 +16802,12 @@ "flex-end": "The cross-end margin edge of the flex item is flushed with the cross-end edge of the line.", "center": "The flex item's margin box is centered within the line on the cross-axis. If the cross-size of the item is larger than the flex container, it will overflow equally in both directions.", "baseline
    \nfirst baseline
    \nlast baseline": "Specifies participation in first- or last-baseline alignment: aligns the alignment baseline of the box's first or last baseline set with the corresponding baseline in the shared first or last baseline set of all the boxes in its baseline-sharing group.\nThe fallback alignment for first baseline is start, the one for last baseline is end.", - "stretch": "If the combined size of the items along the cross axis is less than the size of the alignment container and the item is auto-sized, its size is increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size of all auto-sized items exactly fills the alignment container along the cross axis.", - "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the block and inline direction. See Centering on the anchor using anchor-center." + "stretch": "If the combined size of the items along the cross axis is less than the size of the alignment container and the item is auto-sized, its size is increased equally (not proportionally), while still respecting the constraints imposed by max-height/max-width (or equivalent functionality), so that the combined size of all auto-sized items exactly fills the alignment container along the cross axis.", + "anchor-center": "In the case of anchor-positioned elements, aligns the item to the center of the associated anchor element in the block and inline direction. See Centering on the anchor using anchor-center." } }, "pointer-events": { - "url": "$MDN_URL$/web/css/pointer-events", + "url": "$MDN_URL$/web/css/reference/properties/pointer-events", "status": [ "StandardTrack" ], @@ -16637,7 +16843,7 @@ } }, "position": { - "url": "$MDN_URL$/web/css/position", + "url": "$MDN_URL$/web/css/reference/properties/position", "status": [ "StandardTrack" ], @@ -16656,18 +16862,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The position CSS property sets how an element is positioned in a document. The top, right, bottom, and left physical properties and the inset-block-start, inset-block-end, inset-inline-start, and inset-inline-end flow-relative logical properties can be used to determine the final location of positioned elements.", + "doc": "The position CSS property sets how an element is positioned in a document. The top, right, bottom, and left physical properties and the inset-block-start, inset-block-end, inset-inline-start, and inset-inline-end flow-relative logical properties can be used to determine the final location of positioned elements.", "formalSyntax": "static | relative | absolute | sticky | fixed | <running()>\n  <running()> = running( <custom-ident> )", "values": { - "static": "The element is positioned according to the Normal Flow of the document. The top, right, bottom, left, and z-index properties have no effect. This is the default value.", - "relative": "The element is positioned according to the normal flow of the document, and then offset relative to itself based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements; thus, the space given for the element in the page layout is the same as if position were static.\n

    This value creates a new stacking context when the value of z-index is not auto. Its effect on table-*-group, table-row, table-column, table-cell, and table-caption elements is undefined.", - "absolute": "The element is removed from the normal document flow, and no space is created for the element in the page layout. The element is positioned relative to its closest positioned ancestor (if any) or to the initial containing block. Its final position is determined by the values of top, right, bottom, and left.\n

    This value creates a new stacking context when the value of z-index is not auto. The margins of absolutely positioned boxes do not collapse with other margins.", - "fixed": "The element is removed from the normal document flow, and no space is created for the element in the page layout. The element is positioned relative to its initial containing block, which is the viewport in the case of visual media. Its final position is determined by the values of top, right, bottom, and left.\n

    This value always creates a new stacking context. In printed documents, the element is placed in the same position on every page.", - "sticky": "The element is positioned according to the normal flow of the document, and then offset relative to its nearest scrolling ancestor and containing block (nearest block-level ancestor), including table-related elements, based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements.\n

    This value always creates a new stacking context. Note that a sticky element \"sticks\" to its nearest ancestor that has a \"scrolling mechanism\" (created when overflow is hidden, scroll, auto, or overlay), even if that ancestor isn't the nearest actually scrolling ancestor.\n

    \n

    Note:\nAt least one inset property (top, inset-block-start, right, inset-inline-end, etc.) needs to be set to a non-auto value for the axis on which the element needs to be made sticky. If both inset properties for an axis are set to auto, on that axis the sticky value will behave as relative.\n

    " + "static": "The element is positioned according to the Normal Flow of the document. The top, right, bottom, left, and z-index properties have no effect. This is the default value.", + "relative": "The element is positioned according to the normal flow of the document, and then offset relative to itself based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements; thus, the space given for the element in the page layout is the same as if position were static.\n

    This value creates a new stacking context when the value of z-index is not auto. Its effect on table-*-group, table-row, table-column, table-cell, and table-caption elements is undefined.", + "absolute": "The element is removed from the normal document flow, and no space is created for the element in the page layout. The element is positioned relative to its closest positioned ancestor (if any) or to the initial containing block. Its final position is determined by the values of top, right, bottom, and left.\n

    This value creates a new stacking context when the value of z-index is not auto. The margins of absolutely positioned boxes do not collapse with other margins.", + "fixed": "The element is removed from the normal document flow, and no space is created for the element in the page layout. The element is positioned relative to its initial containing block, which is the viewport in the case of visual media. Its final position is determined by the values of top, right, bottom, and left.\n

    This value always creates a new stacking context. In printed documents, the element is placed in the same position on every page.", + "sticky": "The element is positioned according to the normal flow of the document, and then offset relative to its nearest scrolling ancestor and containing block (nearest block-level ancestor), including table-related elements, based on the values of top, right, bottom, and left. The offset does not affect the position of any other elements.\n

    This value always creates a new stacking context. Note that a sticky element \"sticks\" to its nearest ancestor that has a \"scrolling mechanism\" (created when overflow is hidden, scroll, auto, or overlay), even if that ancestor isn't the nearest actually scrolling ancestor.\n

    \n

    Note:\nAt least one inset property (top, inset-block-start, right, inset-inline-end, etc.) needs to be set to a non-auto value for the axis on which the element needs to be made sticky. If both inset properties for an axis are set to auto, on that axis the sticky value will behave as relative.\n

    " } }, "position-anchor": { - "url": "$MDN_URL$/web/css/position-anchor", + "url": "$MDN_URL$/web/css/reference/properties/position-anchor", "status": [ "StandardTrack" ], @@ -16675,22 +16881,26 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The position-anchor CSS property specifies the anchor name of the anchor element (i.e., an element that has an anchor name set on it via the anchor-name property) a positioned element is associated with.", - "formalSyntax": "auto | <anchor-name>\n  <anchor-name> = <dashed-ident>", + "doc": "The position-anchor CSS property specifies the anchor name of the anchor element (i.e., an element that has an anchor name set on it via the anchor-name property) a positioned element is associated with.", + "formalSyntax": "normal | none | auto | <anchor-name>\n  <anchor-name> = <dashed-ident>", "values": { "auto": "Associates a positioned element with its implicit anchor element, if it has one — for example as set by the non-standard HTML anchor attribute.", - "<dashed-ident>": "The name of the anchor element to associate the positioned element with, as listed in the anchor element's anchor-name property. This is known as the default anchor specifier." + "none": "The initial (default) value. The positioned element is not associated with an anchor element.", + "<dashed-ident>": "The name of the anchor element to associate the positioned element with, as listed in the anchor element's anchor-name property. This is known as the default anchor specifier." } }, "position-area": { - "url": "$MDN_URL$/web/css/position-area", + "url": "$MDN_URL$/web/css/reference/properties/position-area", "status": [ "StandardTrack" ], @@ -16698,14 +16908,17 @@ "Chrome": "129", "ChromeAndroid": "129", "Edge": "129", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "115", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The position-area CSS property enables an anchor-positioned element to be positioned relative to the edges of its associated anchor element by placing the positioned element on one or more tiles of an implicit 3x3 grid, where the anchoring element is the center cell.\n

    position-area provides a convenient alternative to tethering and positioning an element relative to its anchor via inset properties and the anchor() function. The grid-based concept solves the common use-case of positioning the edges of the positioned element's containing block relative to the edges of its default anchor element.\n

    If an element does not have a default anchor element, or is not an absolutely-positioned element, this property has no effect.\n

    \n

    Note:\nThis property was originally named and supported in Chromium browsers as inset-area, with the same property values. Both property names will be supported for a short while, for backwards compatibility purposes.\n

    ", + "doc": "The position-area CSS property enables an anchor-positioned element to be positioned relative to the edges of its associated anchor element by placing the positioned element on one or more tiles of an implicit 3x3 grid, where the anchoring element is the center cell.\n

    position-area provides a convenient alternative to tethering and positioning an element relative to its anchor via inset properties and the anchor() function. The grid-based concept solves the common use-case of positioning the edges of the positioned element's containing block relative to the edges of its default anchor element.\n

    If an element does not have a default anchor element, or is not an absolutely-positioned element, this property has no effect.\n

    \n

    Note:\nThis property was originally named and supported in Chromium browsers as inset-area, with the same property values. Both property names will be supported for a short while, for backwards compatibility purposes.\n

    ", "formalSyntax": "none | <position-area>\n  <position-area> = [ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | self-x-start | self-x-end | span-self-x-start | span-self-x-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | self-y-start | self-y-end | span-self-y-start | span-self-y-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}", "values": { "<position-area>": "Specifies the area of the position area grid on which to place selected positioned elements.", @@ -16713,7 +16926,7 @@ } }, "position-try": { - "url": "$MDN_URL$/web/css/position-try", + "url": "$MDN_URL$/web/css/reference/properties/position-try", "status": [ "StandardTrack" ], @@ -16721,18 +16934,21 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The position-try CSS property is a shorthand that corresponds to the position-try-order and position-try-fallbacks properties.", - "formalSyntax": "<'position-try-order'>? <'position-try-fallbacks'>\n  <position-try-order> = normal | <try-size>\n  <position-try-fallbacks> = none | [ [ <dashed-ident> || <try-tactic> ] | <position-area> ]#\n  <try-size> = most-width | most-height | most-block-size | most-inline-size\n  <try-tactic> = flip-block || flip-inline || flip-start\n  <position-area> = [ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | self-x-start | self-x-end | span-self-x-start | span-self-x-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | self-y-start | self-y-end | span-self-y-start | span-self-y-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}" + "doc": "The position-try CSS property is a shorthand that corresponds to the position-try-order and position-try-fallbacks properties.", + "formalSyntax": "<'position-try-order'>? <'position-try-fallbacks'>\n  <position-try-order> = normal | <try-size>\n  <position-try-fallbacks> = none | [ [ <dashed-ident> || <try-tactic> ] | <position-area> ]#\n  <try-size> = most-width | most-height | most-block-size | most-inline-size\n  <try-tactic> = flip-block || flip-inline || flip-start || flip-x || flip-y\n  <position-area> = [ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | self-x-start | self-x-end | span-self-x-start | span-self-x-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | self-y-start | self-y-end | span-self-y-start | span-self-y-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}" }, "position-try-fallbacks": { - "url": "$MDN_URL$/web/css/position-try-fallbacks", + "url": "$MDN_URL$/web/css/reference/properties/position-try-fallbacks", "status": [ "StandardTrack" ], @@ -16740,24 +16956,27 @@ "Chrome": "128", "ChromeAndroid": "128", "Edge": "128", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "114", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The position-try-fallbacks CSS property enables you to specify a list of one or more alternative position try fallback options for anchor-positioned elements to be placed relative to their associated anchor elements. When the element would otherwise overflow its inset-modified containing block, the browser will try placing the positioned element in these different fallback positions, in the order provided, until it finds a value that stops it from overflowing its container or the viewport.\n
    \n

    Note:\nThe position-try shorthand property can be used to specify position-try-order and position-try-fallbacks values in a single declaration.\n

    \n
    \n

    Note:\nThis property was originally named and supported in Chromium browsers as position-try-options, with the same property values. Until position-try-fallbacks is supported, use the position-try shorthand instead.\n

    ", - "formalSyntax": "none | [ [ <dashed-ident> || <try-tactic> ] | <position-area> ]#\n  <try-tactic> = flip-block || flip-inline || flip-start\n  <position-area> = [ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | self-x-start | self-x-end | span-self-x-start | span-self-x-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | self-y-start | self-y-end | span-self-y-start | span-self-y-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}", + "doc": "The position-try-fallbacks CSS property enables you to specify a list of one or more alternative position try fallback options for anchor-positioned elements to be placed relative to their associated anchor elements. When the element would otherwise overflow its inset-modified containing block, the browser will try placing the positioned element in these different fallback positions, in the order provided, until it finds a value that stops it from overflowing its container or the viewport.\n
    \n

    Note:\nThe position-try shorthand property can be used to specify position-try-order and position-try-fallbacks values in a single declaration.\n

    \n
    \n

    Note:\nThis property was originally named and supported in Chromium browsers as position-try-options, with the same property values. Until position-try-fallbacks is supported, use the position-try shorthand instead.\n

    ", + "formalSyntax": "none | [ [ <dashed-ident> || <try-tactic> ] | <position-area> ]#\n  <try-tactic> = flip-block || flip-inline || flip-start || flip-x || flip-y\n  <position-area> = [ left | center | right | span-left | span-right | x-start | x-end | span-x-start | span-x-end | self-x-start | self-x-end | span-self-x-start | span-self-x-end | span-all ] || [ top | center | bottom | span-top | span-bottom | y-start | y-end | span-y-start | span-y-end | self-y-start | self-y-end | span-self-y-start | span-self-y-end | span-all ] | [ block-start | center | block-end | span-block-start | span-block-end | span-all ] || [ inline-start | center | inline-end | span-inline-start | span-inline-end | span-all ] | [ self-block-start | center | self-block-end | span-self-block-start | span-self-block-end | span-all ] || [ self-inline-start | center | self-inline-end | span-self-inline-start | span-self-inline-end | span-all ] | [ start | center | end | span-start | span-end | span-all ]{1,2} | [ self-start | center | self-end | span-self-start | span-self-end | span-all ]{1,2}", "values": { "none": "The default value. There are no position try fallback options set.", "<try-tactic>": "Predefined fallback options move the positioned element by taking its computed position and transforming it across a particular axis of the anchor, mirroring any margin offsets. Possible values are:\n
    \n
    flip-block
    \n
    \n

    Flips the element's position along the block axis.\n

    \n
    flip-inline
    \n
    \n

    Flips the element's position along the inline axis.\n

    \n
    flip-start
    \n
    \n

    Flips both the inline and block axis values, swapping the start properties with each other, and the end properties with each other.\n

    \n
    ", - "position-area value": "Positions the element relative to the edges of its associated anchor element by placing the positioned element on one or more tiles of an implicit 3x3 position area grid based on the specified <position-area> value; the effect is the same as a custom @position-try fallback option containing only a position-area descriptor.", - "<dashed-ident>": "Adds a custom @position-try option to the fallback options list, the identifying name of which matches the specified dashed-ident. If no custom position option exists with that name, the option is ignored." + "position-area value": "Positions the element relative to the edges of its associated anchor element by placing the positioned element on one or more tiles of an implicit 3x3 position area grid based on the specified <position-area> value; the effect is the same as a custom @position-try fallback option containing only a position-area descriptor.", + "<dashed-ident>": "Adds a custom @position-try option to the fallback options list, the identifying name of which matches the specified dashed-ident. If no custom position option exists with that name, the option is ignored." } }, "position-try-order": { - "url": "$MDN_URL$/web/css/position-try-order", + "url": "$MDN_URL$/web/css/reference/properties/position-try-order", "status": [ "StandardTrack" ], @@ -16765,6 +16984,8 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "111", "Safari": "26", "SafariIOS": "26" @@ -16772,7 +16993,7 @@ "baseline": { "level": "NONE" }, - "doc": "The position-try-order CSS property allows you to specify various fallback options that result in an available position-try fallback being used to set an anchor-positioned element's position, instead of its initial position settings.\n
    \n

    Note:\nThere is also a shorthand property — position-try, which can be used to specify position-try-order and position-try-fallbacks values in a single declaration.\n

    ", + "doc": "The position-try-order CSS property allows you to specify various fallback options that result in an available position-try fallback being used to set an anchor-positioned element's position, instead of its initial position settings.\n
    \n

    Note:\nThere is also a shorthand property — position-try, which can be used to specify position-try-order and position-try-fallbacks values in a single declaration.\n

    ", "formalSyntax": "normal | <try-size>\n  <try-size> = most-width | most-height | most-block-size | most-inline-size", "values": { "normal": "The default. No position-try fallback options will be tried when the element is first displayed.", @@ -16780,21 +17001,25 @@ } }, "position-visibility": { - "url": "$MDN_URL$/web/css/position-visibility", + "url": "$MDN_URL$/web/css/reference/properties/position-visibility", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", - "Opera": "111" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "111", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

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

    \n

    The position-visibility CSS property enables conditionally hiding an anchor-positioned element depending on, for example, whether it is overflowing its containing element or the viewport.", + "doc": "The position-visibility CSS property enables conditionally hiding an anchor-positioned element depending on, for example, whether it is overflowing its containing element or the viewport.", "formalSyntax": "always | [ anchors-valid || anchors-visible || no-overflow ]", "values": { "always": "The positioned element is always displayed.", @@ -16803,7 +17028,7 @@ } }, "print-color-adjust": { - "url": "$MDN_URL$/web/css/print-color-adjust", + "url": "$MDN_URL$/web/css/reference/properties/print-color-adjust", "status": [ "StandardTrack" ], @@ -16828,20 +17053,16 @@ "exact": "The element's content has been specifically and carefully crafted to use colors, images, and styles in a thoughtful and/or important way, such that being altered by the browser might actually make things worse rather than better.\nThe appearance of the content should not be changed except by the user's request.\nFor example, a page might include a list of information with rows whose background colors alternate between white and a light grey.\nRemoving the background color would decrease the legibility of the content." } }, - "properties": { - "url": "$MDN_URL$/web/css/properties", - "doc": "A CSS property is a parameter used in a CSS declaration that lets you style certain aspects of selected elements.\nFor example, the opacity property is used to set the opacity of a selected element, allowing you to control if content behind that element is visible:\n

    \n```css\n/* Set 0.8 opacity on  elements */\nimg {\n  opacity: 0.8;\n}\n```\n
    \n

    Each property has a name (e.g., opacity), a value (e.g., 0.8), and a defined behavior on the rendering of the document.\nCSS also defines shorthand properties, so you can specify multiple related properties in a single declaration.\nFor example, the margin property is a shorthand for margin-top, margin-right, margin-bottom, and margin-left, setting the margin of all four sides of an element:\n

    \n```css\n/* Give  elements 1rem of margin */\nimg {\n  margin: 1rem;\n}\n```\n
    " - }, "pseudo-classes": { - "url": "$MDN_URL$/web/css/pseudo-classes", - "doc": "A CSS pseudo-class is a keyword added to a selector that lets you style a specific state of the selected element(s). For example, the pseudo-class :hover can be used to select a button when a user's pointer hovers over the button and this selected button can then be styled.\n
    \n```css\n/* Any button over which the user's pointer is hovering */\nbutton:hover {\n  color: blue;\n}\n```\n
    \n

    A pseudo-class consists of a colon (:) followed by the pseudo-class name (e.g., :hover). A functional pseudo-class also contains a pair of parentheses to define the arguments (e.g., :dir()). The element that a pseudo-class is attached to is defined as an anchor element (e.g., button in case button:hover).\n

    Pseudo-classes let you apply a style to an element not only in relation to the content of the document tree, but also in relation to external factors like the history of the navigator (:visited, for example), the status of its content (like :checked on certain form elements), or the position of the mouse (like :hover, which lets you know if the mouse is over an element or not).\n

    \n

    Note:\nIn contrast to pseudo-classes, pseudo-elements can be used to style a specific part of an element.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/pseudo-classes", + "doc": "A CSS pseudo-class is a keyword added to a selector that lets you select elements based on information that lies outside of the document tree, such as a specific state of the selected element(s). For example, the pseudo-class :hover can be used to style a button when a user's pointer hovers over it.\n
    \n```css\n/* Any button over which the user's pointer is hovering */\nbutton:hover {\n  color: blue;\n}\n```\n
    \n

    A pseudo-class consists of a colon (:) followed by the pseudo-class name (e.g., :hover). A functional pseudo-class also contains a pair of parentheses to define the arguments (e.g., :dir()). The element that a pseudo-class is attached to is defined as an anchor element (e.g., button in case button:hover).\n

    Pseudo-classes let you apply a style to an element not only in relation to the content of the document tree, but also in relation to external factors like the history of the navigator (:visited, for example), the status of its content (like :checked on certain form elements), or the position of the mouse (like :hover, which lets you know if the mouse is over an element or not).\n

    \n

    Note:\nIn contrast to pseudo-classes, pseudo-elements can be used to style a specific part of an element.\n

    " }, "pseudo-elements": { - "url": "$MDN_URL$/web/css/pseudo-elements", - "doc": "A CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s)." + "url": "$MDN_URL$/web/css/reference/selectors/pseudo-elements", + "doc": "A CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s).\n
    \n

    Note:\nThis page is an index of all pseudo-elements in CSS. The CSS pseudo-elements page introduces the module that defines some, but not all, of these pseudo-elements.\n

    " }, "quotes": { - "url": "$MDN_URL$/web/css/quotes", + "url": "$MDN_URL$/web/css/reference/properties/quotes", "status": [ "StandardTrack" ], @@ -16860,16 +17081,16 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The CSS quotes property sets how the browser should render quotation marks that are automatically added to the HTML <q> element or added using the open-quotes or close-quotes (or omitted using the no-open-quote and no-close-quote) values of the of the CSS content property.", + "doc": "The CSS quotes property sets how the browser should render quotation marks that are automatically added to the HTML <q> element or added using the open-quotes or close-quotes (or omitted using the no-open-quote and no-close-quote) values of the of the CSS content property.", "formalSyntax": "auto | none | match-parent | [ <string> <string> ]+", "values": { - "none": "The open-quote and close-quote values of the content property produce no quotation marks, as if no-open-quote and no-close-quote were set, respectively.", + "none": "The open-quote and close-quote values of the content property produce no quotation marks, as if no-open-quote and no-close-quote were set, respectively.", "auto": "Quotation marks that are typographically appropriate for the inherited language (i.e., via the lang attribute set on the parent or other ancestor).", "<string>": "Defines one or more pairs of quotation mark values for opening and closing quotes. In each pair, the first of each pair of quotes are used as the values for the open-quote and the second of each pair is the close-quote.\n

    The first pair represents the quotation's outer level. The second pair, if present, represents the first nested level. The next pair is used for doubly nested levels, and so on. If the depth of quote nesting is greater than the number of pairs, the last pair in the quotes value is repeated.\n

    Which pair of quotes is used depends on the depth, or nesting level, of quotes: the number of occurrences of <q> quotes or open-quote (or no-open-quote) in all generated text before the current occurrence, minus the number of occurrences of closing quotes, either as </q>, close-quote, or no-close-quote. If the depth is 0, the first pair is used, if the depth is 1, the second pair is used, etc." } }, "r": { - "url": "$MDN_URL$/web/css/r", + "url": "$MDN_URL$/web/css/reference/properties/r", "status": [ "StandardTrack" ], @@ -16891,12 +17112,12 @@ "doc": "The r CSS property defines the radius of a circle. It can only be used with the SVG <circle> element. If present, it overrides the circle's r attribute.\n

    \n

    Note:\nThe r property only applies to <circle> elements nested in an <svg>. It doesn't apply to other SVG elements or HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", + "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", "<percentage>": "Percentages refer to the normalized diagonal of the current SVG viewport, which is calculated as <width>2+<height>22." } }, "reading-flow": { - "url": "$MDN_URL$/web/css/reading-flow", + "url": "$MDN_URL$/web/css/reference/properties/reading-flow", "status": [ "Experimental", "StandardTrack" @@ -16910,10 +17131,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The reading-flow CSS property enables modifying the reading order of child elements of a block, flex, or grid layout. This affects the order in which they are rendered to speech and navigated to when using sequential navigation such as tabbing to links or buttons." + "doc": "

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

    \n

    The reading-flow CSS property enables modifying the reading order of child elements of a block, flex, or grid layout. This affects the order in which they are rendered to speech and navigated to when using sequential navigation such as tabbing to links or buttons." }, "reading-order": { - "url": "$MDN_URL$/web/css/reading-order", + "url": "$MDN_URL$/web/css/reference/properties/reading-order", "status": [ "Experimental", "StandardTrack" @@ -16929,12 +17150,8 @@ }, "doc": "

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

    \n

    The reading-order CSS property enables changing the order in which a child of a reading flow container is read relative to its element siblings." }, - "reference": { - "url": "$MDN_URL$/web/css/reference", - "doc": "Use this CSS reference to browse an alphabetical index of all of the standard CSS properties, pseudo-classes, pseudo-elements, data types, functional notations and at-rules. You can also browse key CSS concepts and a list of selectors organized by type. Also included is a brief DOM-CSS / CSSOM reference." - }, "resize": { - "url": "$MDN_URL$/web/css/resize", + "url": "$MDN_URL$/web/css/reference/properties/resize", "status": [ "StandardTrack" ], @@ -16956,12 +17173,12 @@ "both": "The element displays a mechanism for allowing the user to resize it, which may be resized both horizontally and vertically.", "horizontal": "The element displays a mechanism for allowing the user to resize it in the horizontal direction.", "vertical": "The element displays a mechanism for allowing the user to resize it in the vertical direction.", - "block": "The element displays a mechanism for allowing the user to resize it in the block direction (either horizontally or vertically, depending on the writing-mode and direction value).", - "inline": "The element displays a mechanism for allowing the user to resize it in the inline direction (either horizontally or vertically, depending on the writing-mode and direction value)." + "block": "The element displays a mechanism for allowing the user to resize it in the block direction (either horizontally or vertically, depending on the writing-mode and direction value).", + "inline": "The element displays a mechanism for allowing the user to resize it in the inline direction (either horizontally or vertically, depending on the writing-mode and direction value)." } }, "right": { - "url": "$MDN_URL$/web/css/right", + "url": "$MDN_URL$/web/css/reference/properties/right", "status": [ "StandardTrack" ], @@ -16980,16 +17197,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The right CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements.", + "doc": "The right CSS property participates in specifying the horizontal position of a positioned element. This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "A negative, null, or positive <length>:\n

    ", - "<percentage>": "A <percentage> of the containing block's width.", - "auto": "Specifies that:\n" + "<length>": "A negative, null, or positive <length>:\n", + "<percentage>": "A <percentage> of the containing block's width.", + "auto": "Specifies that:\n" } }, "rotate": { - "url": "$MDN_URL$/web/css/rotate", + "url": "$MDN_URL$/web/css/reference/properties/rotate", "status": [ "StandardTrack" ], @@ -17008,17 +17225,17 @@ "lowDate": "2022-08-05", "highDate": "2025-02-05" }, - "doc": "The rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform property.", + "doc": "The rotate CSS property allows you to specify rotation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform property.", "formalSyntax": "none | <angle> | [ x | y | z | <number>{3} ] && <angle>", "values": { - "angle value": "An <angle> specifying the angle to rotate the affected element through, around the Z axis. Equivalent to a rotate() (2D rotation) function.", - "x
    \ny
    \nor z axis name plus angle value": "The name of the axis you want to rotate the affected element around (x, y, or z), plus an <angle> specifying the angle to rotate the element through. Equivalent to a rotateX()/rotateY()/rotateZ() (3D rotation) function.", - "vector plus angle value": "Three <number>s representing an origin-centered vector that defines a line around which you want to rotate the element, plus an <angle> specifying the angle to rotate the element through. Equivalent to a rotate3d() (3D rotation) function.", + "angle value": "An <angle> specifying the angle to rotate the affected element through, around the Z axis. Equivalent to a rotate() (2D rotation) function.", + "x
    \ny
    \nor z axis name plus angle value": "The name of the axis you want to rotate the affected element around (x, y, or z), plus an <angle> specifying the angle to rotate the element through. Equivalent to a rotateX()/rotateY()/rotateZ() (3D rotation) function.", + "vector plus angle value": "Three <number>s representing an origin-centered vector that defines a line around which you want to rotate the element, plus an <angle> specifying the angle to rotate the element through. Equivalent to a rotate3d() (3D rotation) function.", "none": "Specifies that no rotation should be applied." } }, "row-gap": { - "url": "$MDN_URL$/web/css/row-gap", + "url": "$MDN_URL$/web/css/reference/properties/row-gap", "status": [ "StandardTrack" ], @@ -17052,11 +17269,11 @@ "doc": "The row-gap CSS property sets the size of the gap (gutter) between an element's rows.\n

    Early versions of the specification called this property grid-row-gap, and to maintain compatibility with legacy websites, browsers will still accept grid-row-gap as an alias for row-gap.", "formalSyntax": "normal | <length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Is the width of the gutter separating the rows. <percentage> values are relative to the dimension of the element." + "<length-percentage>": "Is the width of the gutter separating the rows. <percentage> values are relative to the dimension of the element." } }, "ruby-align": { - "url": "$MDN_URL$/web/css/ruby-align", + "url": "$MDN_URL$/web/css/reference/properties/ruby-align", "status": [ "StandardTrack" ], @@ -17084,7 +17301,7 @@ } }, "ruby-overhang": { - "url": "$MDN_URL$/web/css/ruby-overhang", + "url": "$MDN_URL$/web/css/reference/properties/ruby-overhang", "status": [ "StandardTrack" ], @@ -17103,7 +17320,7 @@ } }, "ruby-position": { - "url": "$MDN_URL$/web/css/ruby-position", + "url": "$MDN_URL$/web/css/reference/properties/ruby-position", "status": [ "StandardTrack" ], @@ -17130,8 +17347,12 @@ "inter-character": "When specified, it behaves as over in vertical writing modes. Otherwise, it indicates that the ruby has to be placed between the different characters, appearing on the right of the base in horizontal text and forcing the children of the ruby annotation container to have a vertical-rl writing mode." } }, + "rule-list": { + "url": "$MDN_URL$/web/css/reference/values/rule-list", + "doc": "The <rule-list> CSS data type represents a sequence of zero or more CSS rules. It is used to define places in CSS where multiple rules may appear, such as the top level of a stylesheet or inside grouping at-rules like @media or @supports.\n

    A <rule-list> is not written directly. Instead, it describes how the CSS parser collects and interprets rules inside a block or stylesheet." + }, "rx": { - "url": "$MDN_URL$/web/css/rx", + "url": "$MDN_URL$/web/css/reference/properties/rx", "status": [ "StandardTrack" ], @@ -17152,13 +17373,13 @@ "doc": "The rx CSS property defines the x-axis, or horizontal, radius of an SVG <ellipse> and the horizontal curve of the corners of an SVG <rect> rectangle. If present, it overrides the shape's rx attribute.\n

    \n

    Note:\nThe rx property only applies to <ellipse> and <rect> elements nested in an <svg>. It doesn't apply to other SVG elements or HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage> | auto\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", + "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", "<percentage>": "Percentages refer to the width of the current SVG viewport. The used value for a <rect> is never more than 50% of the width of the rectangle.", - "auto": "When set or defaulting to auto, the rx value equals the absolute length value used for ry. If both rx and ry have a computed value of auto, the used value is 0." + "auto": "When set or defaulting to auto, the rx value equals the absolute length value used for ry. If both rx and ry have a computed value of auto, the used value is 0." } }, "ry": { - "url": "$MDN_URL$/web/css/ry", + "url": "$MDN_URL$/web/css/reference/properties/ry", "status": [ "StandardTrack" ], @@ -17179,13 +17400,13 @@ "doc": "The ry CSS property defines the y-axis, or vertical, radius of an SVG <ellipse> and the vertical curve of the corners of an SVG <rect> rectangle. If present, it overrides the shape's ry attribute.\n
    \n

    Note:\nThe ry property only applies to <ellipse> and <rect> elements nested in an <svg>. It doesn't apply to other SVG elements or HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage> | auto\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", + "<length>": "Absolute or relative lengths can be expressed in any unit allowed by the CSS <length> data type. Negative values are invalid.", "<percentage>": "Percentages refer to the height of the current SVG viewport. The used value for a <rect> is never more than 50% of the height of the rectangle.", - "auto": "When set or defaulting to auto, the ry value equals the absolute length value used for rx. If both ry and rx have a computed value of auto, the used value is 0." + "auto": "When set or defaulting to auto, the ry value equals the absolute length value used for rx. If both ry and rx have a computed value of auto, the used value is 0." } }, "scale": { - "url": "$MDN_URL$/web/css/scale", + "url": "$MDN_URL$/web/css/reference/properties/scale", "status": [ "StandardTrack" ], @@ -17204,17 +17425,17 @@ "lowDate": "2022-08-05", "highDate": "2025-02-05" }, - "doc": "The scale CSS property allows you to specify scale transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.", + "doc": "The scale CSS property allows you to specify scale transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.", "formalSyntax": "none | [ <number> | <percentage> ]{1,3}", "values": { - "Single value": "A <number> or <percentage> specifying a scale factor to make the affected element scale by the same factor along both the X and Y axes. Equivalent to a scale() (2D scaling) function with a single value specified.", - "Two values": "Two <number> or <percentage> values that specify the X and Y axis scaling values (respectively) of a 2D scale. Equivalent to a scale() (2D scaling) function with two values specified.", - "Three values": "Three <number> or <percentage> values that specify the X, Y, and Z axis scaling values (respectively) of a 3D scale. Equivalent to a scale3d() (3D scaling) function.", + "Single value": "A <number> or <percentage> specifying a scale factor to make the affected element scale by the same factor along both the X and Y axes. Equivalent to a scale() (2D scaling) function with a single value specified.", + "Two values": "Two <number> or <percentage> values that specify the X and Y axis scaling values (respectively) of a 2D scale. Equivalent to a scale() (2D scaling) function with two values specified.", + "Three values": "Three <number> or <percentage> values that specify the X, Y, and Z axis scaling values (respectively) of a 3D scale. Equivalent to a scale3d() (3D scaling) function.", "none": "Specifies that no scaling should be applied." } }, "scroll-behavior": { - "url": "$MDN_URL$/web/css/scroll-behavior", + "url": "$MDN_URL$/web/css/reference/properties/scroll-behavior", "status": [ "StandardTrack" ], @@ -17241,7 +17462,7 @@ } }, "scroll-margin": { - "url": "$MDN_URL$/web/css/scroll-margin", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin", "status": [ "StandardTrack" ], @@ -17260,14 +17481,14 @@ "lowDate": "2021-07-13", "highDate": "2024-01-13" }, - "doc": "The scroll-margin shorthand property sets all of the scroll margins of an element at once, assigning values much like the margin property does for margins of an element.", + "doc": "The scroll-margin shorthand property sets all of the scroll margins of an element at once, assigning values much like the margin property does for margins of an element.", "formalSyntax": "<length>{1,4}", "values": { "<length>": "An outset from the corresponding edge of the scroll container." } }, "scroll-margin-block": { - "url": "$MDN_URL$/web/css/scroll-margin-block", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-block", "status": [ "StandardTrack" ], @@ -17286,14 +17507,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The scroll-margin-block shorthand property sets the scroll margins of an element in the block dimension.", + "doc": "The scroll-margin-block shorthand property sets the scroll margins of an element in the block dimension.", "formalSyntax": "<length>{1,2}", "values": { "<length>": "An outset from the corresponding edge of the scroll container." } }, "scroll-margin-block-end": { - "url": "$MDN_URL$/web/css/scroll-margin-block-end", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-block-end", "status": [ "StandardTrack" ], @@ -17319,7 +17540,7 @@ } }, "scroll-margin-block-start": { - "url": "$MDN_URL$/web/css/scroll-margin-block-start", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-block-start", "status": [ "StandardTrack" ], @@ -17345,7 +17566,7 @@ } }, "scroll-margin-bottom": { - "url": "$MDN_URL$/web/css/scroll-margin-bottom", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-bottom", "status": [ "StandardTrack" ], @@ -17371,7 +17592,7 @@ } }, "scroll-margin-inline": { - "url": "$MDN_URL$/web/css/scroll-margin-inline", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-inline", "status": [ "StandardTrack" ], @@ -17390,14 +17611,14 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The scroll-margin-inline shorthand property sets the scroll margins of an element in the inline dimension.", + "doc": "The scroll-margin-inline shorthand property sets the scroll margins of an element in the inline dimension.", "formalSyntax": "<length>{1,2}", "values": { "<length>": "An outset from the corresponding edge of the scroll container." } }, "scroll-margin-inline-end": { - "url": "$MDN_URL$/web/css/scroll-margin-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-inline-end", "status": [ "StandardTrack" ], @@ -17423,7 +17644,7 @@ } }, "scroll-margin-inline-start": { - "url": "$MDN_URL$/web/css/scroll-margin-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-inline-start", "status": [ "StandardTrack" ], @@ -17449,7 +17670,7 @@ } }, "scroll-margin-left": { - "url": "$MDN_URL$/web/css/scroll-margin-left", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-left", "status": [ "StandardTrack" ], @@ -17475,7 +17696,7 @@ } }, "scroll-margin-right": { - "url": "$MDN_URL$/web/css/scroll-margin-right", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-right", "status": [ "StandardTrack" ], @@ -17501,7 +17722,7 @@ } }, "scroll-margin-top": { - "url": "$MDN_URL$/web/css/scroll-margin-top", + "url": "$MDN_URL$/web/css/reference/properties/scroll-margin-top", "status": [ "StandardTrack" ], @@ -17527,29 +17748,30 @@ } }, "scroll-marker-group": { - "url": "$MDN_URL$/web/css/scroll-marker-group", + "url": "$MDN_URL$/web/css/reference/properties/scroll-marker-group", "status": [ "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "135", + "ChromeAndroid": "135", "Edge": "135", "Opera": "120" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The scroll-marker-group CSS property controls whether a scroll container element has a ::scroll-marker-group pseudo-element generated. If present, the property also specifies whether the scroll marker group should be placed before or after the contents of the scroll group container in the default visual and tab order.\n

    \n

    Note:\nTo create a scroll marker group container from an existing element that contains a set of <a> elements, use the scroll-target-group property. Read about the differences in behavior between the two.\n

    ", + "doc": "

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

    \n

    The scroll-marker-group CSS property controls whether a scroll container element has a ::scroll-marker-group pseudo-element generated. If present, the property also specifies whether the scroll marker group should be placed before or after the contents of the scroll group container in the default visual and tab order.\n

    \n

    Note:\nTo create a scroll marker group container from an existing element that contains a set of <a> elements, use the scroll-target-group property. Read about the differences in behavior between the two.\n

    ", "formalSyntax": "none | before | after", "values": { - "after": "A ::scroll-marker-group pseudo-element is generated as a sibling of the scroll container's child DOM elements, immediately preceding them, and any generated ::scroll-button() pseudo-elements. It appears at the end of the container's tab order and layout box order (but not DOM structure).", - "before": "A ::scroll-marker-group pseudo-element is generated as a sibling of the scroll container's child DOM elements, immediately preceding them, and any generated ::scroll-button() pseudo-elements. The scroll marker group appears at the start of the container's tab order and layout box order.", + "after": "A ::scroll-marker-group pseudo-element is generated as a sibling of the scroll container's child DOM elements, immediately preceding them, and any generated ::scroll-button() pseudo-elements. It appears at the end of the container's tab order and layout box order (but not DOM structure).", + "before": "A ::scroll-marker-group pseudo-element is generated as a sibling of the scroll container's child DOM elements, immediately preceding them, and any generated ::scroll-button() pseudo-elements. The scroll marker group appears at the start of the container's tab order and layout box order.", "none": "No ::scroll-marker-group pseudo-element will be generated on the element. This is the default value." } }, "scroll-padding": { - "url": "$MDN_URL$/web/css/scroll-padding", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding", "status": [ "StandardTrack" ], @@ -17568,15 +17790,15 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The scroll-padding shorthand property sets scroll padding on all sides of an element at once, much like the padding property does for padding on an element.", + "doc": "The scroll-padding shorthand property sets scroll padding on all sides of an element at once. It specifies offsets that define the optimal viewing region of a scrollport within a scroll container.", "formalSyntax": "[ auto | <length-percentage [0,∞]> ]{1,4}\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "An inwards offset from the corresponding edge of the scrollport, as a valid <length> or a <percentage>.", + "<length-percentage>": "An inwards offset from the corresponding edge of the scrollport, as a valid <length> or a <percentage>.", "auto": "The offset is determined by the user agent. This will generally be 0px, but the user agent is free to detect and do something else if a non-zero value is more appropriate." } }, "scroll-padding-block": { - "url": "$MDN_URL$/web/css/scroll-padding-block", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-block", "status": [ "StandardTrack" ], @@ -17595,7 +17817,7 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The scroll-padding-block shorthand property sets the scroll padding of an element in the block dimension.", + "doc": "The scroll-padding-block shorthand property sets the scroll padding of an element in the block dimension.", "formalSyntax": "[ auto | <length-percentage [0,∞]> ]{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { "<length-percentage>": "An inwards offset from the corresponding edge of the scrollport, as a valid length or a percentage.", @@ -17603,7 +17825,7 @@ } }, "scroll-padding-block-end": { - "url": "$MDN_URL$/web/css/scroll-padding-block-end", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-block-end", "status": [ "StandardTrack" ], @@ -17630,7 +17852,7 @@ } }, "scroll-padding-block-start": { - "url": "$MDN_URL$/web/css/scroll-padding-block-start", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-block-start", "status": [ "StandardTrack" ], @@ -17657,7 +17879,7 @@ } }, "scroll-padding-bottom": { - "url": "$MDN_URL$/web/css/scroll-padding-bottom", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-bottom", "status": [ "StandardTrack" ], @@ -17684,7 +17906,7 @@ } }, "scroll-padding-inline": { - "url": "$MDN_URL$/web/css/scroll-padding-inline", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-inline", "status": [ "StandardTrack" ], @@ -17703,7 +17925,7 @@ "lowDate": "2021-09-20", "highDate": "2024-03-20" }, - "doc": "The scroll-padding-inline shorthand property sets the scroll padding of an element in the inline dimension.", + "doc": "The scroll-padding-inline shorthand property sets the scroll padding of an element in the inline dimension.", "formalSyntax": "[ auto | <length-percentage [0,∞]> ]{1,2}\n  <length-percentage> = <length> | <percentage>", "values": { "<length-percentage>": "An inwards offset from the corresponding edge of the scrollport, as a valid length or a percentage.", @@ -17711,7 +17933,7 @@ } }, "scroll-padding-inline-end": { - "url": "$MDN_URL$/web/css/scroll-padding-inline-end", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-inline-end", "status": [ "StandardTrack" ], @@ -17738,7 +17960,7 @@ } }, "scroll-padding-inline-start": { - "url": "$MDN_URL$/web/css/scroll-padding-inline-start", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-inline-start", "status": [ "StandardTrack" ], @@ -17765,7 +17987,7 @@ } }, "scroll-padding-left": { - "url": "$MDN_URL$/web/css/scroll-padding-left", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-left", "status": [ "StandardTrack" ], @@ -17792,7 +18014,7 @@ } }, "scroll-padding-right": { - "url": "$MDN_URL$/web/css/scroll-padding-right", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-right", "status": [ "StandardTrack" ], @@ -17819,7 +18041,7 @@ } }, "scroll-padding-top": { - "url": "$MDN_URL$/web/css/scroll-padding-top", + "url": "$MDN_URL$/web/css/reference/properties/scroll-padding-top", "status": [ "StandardTrack" ], @@ -17846,7 +18068,7 @@ } }, "scroll-snap-align": { - "url": "$MDN_URL$/web/css/scroll-snap-align", + "url": "$MDN_URL$/web/css/reference/properties/scroll-snap-align", "status": [ "StandardTrack" ], @@ -17875,7 +18097,7 @@ } }, "scroll-snap-stop": { - "url": "$MDN_URL$/web/css/scroll-snap-stop", + "url": "$MDN_URL$/web/css/reference/properties/scroll-snap-stop", "status": [ "StandardTrack" ], @@ -17902,7 +18124,7 @@ } }, "scroll-snap-type": { - "url": "$MDN_URL$/web/css/scroll-snap-type", + "url": "$MDN_URL$/web/css/reference/properties/scroll-snap-type", "status": [ "StandardTrack" ], @@ -17935,7 +18157,7 @@ } }, "scroll-target-group": { - "url": "$MDN_URL$/web/css/scroll-target-group", + "url": "$MDN_URL$/web/css/reference/properties/scroll-target-group", "status": [ "Experimental", "StandardTrack" @@ -17946,6 +18168,9 @@ "Edge": "140", "Opera": "124" }, + "baseline": { + "level": "NONE" + }, "doc": "

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

    \n

    The scroll-target-group CSS property specifies whether an element is a scroll marker group container.", "formalSyntax": "none | auto", "values": { @@ -17954,7 +18179,7 @@ } }, "scroll-timeline": { - "url": "$MDN_URL$/web/css/scroll-timeline", + "url": "$MDN_URL$/web/css/reference/properties/scroll-timeline", "status": [ "StandardTrack" ], @@ -17969,15 +18194,15 @@ "baseline": { "level": "NONE" }, - "doc": "The scroll-timeline CSS shorthand property is used to define a named scroll progress timeline, which is progressed through by scrolling a scrollable element (scroller) between top and bottom (or left and right). scroll-timeline is set on the scroller that will provide the timeline. The starting scroll position represents 0% progress and the ending scroll position represents 100% progress. If the 0% position and 100% position coincide (i.e., the scroll container has no overflow to scroll), the timeline is inactive.\n

    scroll-timeline can contain two constituent values — a name for the named scroll progress timeline, and an optional scroll axis value.\n

    The name is then referenced in an animation-timeline declaration to indicate the container's element that is used to drive the progress of the animation through the scrolling action.\n

    \n

    Note:\nIf the scroller does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no timeline will be created.\n

    ", + "doc": "The scroll-timeline CSS shorthand property is used to define a named scroll progress timeline, which is progressed through by scrolling a scrollable element (scroller) between top and bottom (or left and right).", "formalSyntax": "[ <'scroll-timeline-name'> <'scroll-timeline-axis'>? ]#\n  <scroll-timeline-name> = [ none | <dashed-ident> ]#\n  <scroll-timeline-axis> = [ block | inline | x | y ]#", "values": { - "<scroll-timeline-name>": "See scroll-timeline-name.", - "<scroll-timeline-axis>": "See scroll-timeline-axis. The default value is block." + "<scroll-timeline-name>": "A <dashed-ident> or the keyword none.", + "<scroll-timeline-axis>": "An axis keyword. The default value is block." } }, "scroll-timeline-axis": { - "url": "$MDN_URL$/web/css/scroll-timeline-axis", + "url": "$MDN_URL$/web/css/reference/properties/scroll-timeline-axis", "status": [ "StandardTrack" ], @@ -17992,17 +18217,14 @@ "baseline": { "level": "NONE" }, - "doc": "The scroll-timeline-axis CSS property is used to specify the scrollbar direction that will be used to provide the timeline for a named scroll progress timeline animation, which is progressed through by scrolling a scrollable element (scroller) between top and bottom (or left and right). scroll-timeline is set on the scroller that will provide the timeline. See CSS scroll-driven animations for more details.\n
    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    \n

    The scroll-timeline-axis and scroll-timeline-name properties can also be set using the scroll-timeline shorthand property.", + "doc": "The scroll-timeline-axis CSS property is used to specify the scrollbar direction that will be used to provide the timeline for a scroll driven animation, which is progressed through by scrolling a scrollable element (scroller).", "formalSyntax": "[ block | inline | x | y ]#", "values": { - "block": "The scrollbar on the block axis of the scroller element, which is the axis in the direction perpendicular to the flow of text within a line. For horizontal writing modes, such as standard English, this is the same as y, while for vertical writing modes, it is the same as x. This is the default value.", - "inline": "The scrollbar on the inline axis of the scroller element, which is the axis in the direction parallel to the flow of text in a line. For horizontal writing modes, this is the same as x, while for vertical writing modes, this is the same as y.", - "y": "The scrollbar on the vertical axis of the scroller element.", - "x": "The scrollbar on the horizontal axis of the scroller element." + "<axis>": "An axis keyword value describing the direction, or axis, of the scrollport that controls the scroll-driven animation. The default value is block." } }, "scroll-timeline-name": { - "url": "$MDN_URL$/web/css/scroll-timeline-name", + "url": "$MDN_URL$/web/css/reference/properties/scroll-timeline-name", "status": [ "StandardTrack" ], @@ -18017,15 +18239,15 @@ "baseline": { "level": "NONE" }, - "doc": "The scroll-timeline-name CSS property is used to define the name of a named scroll progress timeline, which is progressed through by scrolling a scrollable element (scroller) between top and bottom (or left and right). scroll-timeline-name is set on the scroller that will provide the timeline.\n

    The name is then referenced in an animation-timeline declaration to indicate the container's element that is used to drive the progress of the animation through the scrolling action.\n

    \n

    Note:\nIf the element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no timeline will be created.\n

    \n

    The scroll-timeline-axis and scroll-timeline-name properties can also be set using the scroll-timeline shorthand property.", + "doc": "The scroll-timeline-name CSS property is used to define the name of a named scroll progress timeline, which is progressed through by scrolling a scrollable element (scroller) between top and bottom (or left and right). scroll-timeline-name is set on the scroller that will provide the timeline.\n

    The name is then referenced in an animation-timeline declaration to indicate the container's element that is used to drive the progress of the animation through the scrolling action.\n

    \n

    Note:\nIf the element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no timeline will be created.\n

    \n

    The scroll-timeline-axis and scroll-timeline-name properties can also be set using the scroll-timeline shorthand property.", "formalSyntax": "[ none | <dashed-ident> ]#", "values": { "none": "The timeline has no name.", - "<dashed-ident>": "An arbitrary custom identifier defining a name for a scroll progress timeline, which can then be referenced in an animation-timeline property.\n

    \n

    Note:\n<dashed-ident> values must start with --, which helps avoid name clashes with standard CSS keywords.\n

    " + "<dashed-ident>": "An arbitrary custom identifier defining a name for a scroll progress timeline, which can then be referenced in an animation-timeline property.\n
    \n

    Note:\n<dashed-ident> values must start with --, which helps avoid name clashes with standard CSS keywords.\n

    " } }, "scrollbar-color": { - "url": "$MDN_URL$/web/css/scrollbar-color", + "url": "$MDN_URL$/web/css/reference/properties/scrollbar-color", "status": [ "StandardTrack" ], @@ -18035,10 +18257,13 @@ "Edge": "121", "Firefox": "64", "FirefoxAndroid": "64", - "Opera": "107" + "Opera": "107", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The scrollbar-color CSS property sets the color of the scrollbar track and thumb.\n

    The track refers to the background of the scrollbar, which is generally fixed regardless of the scrolling position.\n

    The thumb refers to the moving part of the scrollbar, which usually floats on top of the track.\n

    When scrollbar-color value is set on the document's root element, the values are applied to the viewport scrollbars.", "formalSyntax": "auto | <color>{2}", @@ -18047,7 +18272,7 @@ } }, "scrollbar-gutter": { - "url": "$MDN_URL$/web/css/scrollbar-gutter", + "url": "$MDN_URL$/web/css/reference/properties/scrollbar-gutter", "status": [ "StandardTrack" ], @@ -18074,7 +18299,7 @@ } }, "scrollbar-width": { - "url": "$MDN_URL$/web/css/scrollbar-width", + "url": "$MDN_URL$/web/css/reference/properties/scrollbar-width", "status": [ "StandardTrack" ], @@ -18092,7 +18317,7 @@ "level": "LOW", "lowDate": "2024-12-11" }, - "doc": "The scrollbar-width property allows the author to set the desired thickness of an element's scrollbars when they are shown.\n

    The purpose of the scrollbar-width is to optimize the space occupied by the scrollbar on a page or element; the purpose is not related to scrollbar aesthetics. The scrollbar-width predefined keyword values indicate to the user agent whether a normal or smaller scrollbar should be rendered. Avoid using none, as hiding a scrollbar negatively impacts accessibility.\n

    \n

    Note:\nFor elements that are scrollable only via programmatic means and not by direct user interaction, use the overflow property with a value of hidden rather than scrollbar-width: none.\n

    ", + "doc": "The scrollbar-width property allows the author to set the desired thickness of an element's scrollbars when they are shown.\n

    The purpose of the scrollbar-width is to optimize the space occupied by the scrollbar on a page or element; the purpose is not related to scrollbar aesthetics. The scrollbar-width predefined keyword values indicate to the user agent whether a normal or smaller scrollbar should be rendered. Avoid using none, as hiding a scrollbar negatively impacts accessibility.\n

    \n

    Note:\nFor elements that are scrollable only via programmatic means and not by direct user interaction, use the overflow property with a value of hidden rather than scrollbar-width: none.\n

    ", "formalSyntax": "auto | thin | none", "values": { "auto": "The default scrollbar width for the platform.", @@ -18101,7 +18326,7 @@ } }, "selector_list": { - "url": "$MDN_URL$/web/css/selector_list", + "url": "$MDN_URL$/web/css/reference/selectors/selector_list", "status": [ "StandardTrack" ], @@ -18123,7 +18348,7 @@ "doc": "The CSS selector list (,) selects all the matching nodes. A selector list is a comma-separated list of selectors." }, "shape-image-threshold": { - "url": "$MDN_URL$/web/css/shape-image-threshold", + "url": "$MDN_URL$/web/css/reference/properties/shape-image-threshold", "status": [ "StandardTrack" ], @@ -18142,14 +18367,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The shape-image-threshold CSS property sets the alpha channel threshold used to extract the shape using an image as the value for shape-outside.", + "doc": "The shape-image-threshold CSS property sets the alpha channel threshold used to extract the shape using an image as the value for shape-outside.", "formalSyntax": "<opacity-value>\n  <opacity-value> = <number> | <percentage>", "values": { "<alpha-value>": "Sets the threshold used for extracting a shape from an image. The shape is defined by the pixels whose alpha value is greater than the threshold. Values outside the range 0.0 (fully transparent) to 1.0 (fully opaque) are clamped to this range." } }, "shape-margin": { - "url": "$MDN_URL$/web/css/shape-margin", + "url": "$MDN_URL$/web/css/reference/properties/shape-margin", "status": [ "StandardTrack" ], @@ -18168,14 +18393,14 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The shape-margin CSS property sets a margin for a CSS shape created using shape-outside.", + "doc": "The shape-margin CSS property sets a margin for a CSS shape created using shape-outside.", "formalSyntax": "<length-percentage [0,∞]>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length-percentage>": "Sets the margin of the shape to a <length> value or to a <percentage> of the width of the element's containing block." + "<length-percentage>": "Sets the margin of the shape to a <length> value or to a <percentage> of the width of the element's containing block." } }, "shape-outside": { - "url": "$MDN_URL$/web/css/shape-outside", + "url": "$MDN_URL$/web/css/reference/properties/shape-outside", "status": [ "StandardTrack" ], @@ -18195,16 +18420,16 @@ "highDate": "2022-07-15" }, "doc": "The shape-outside CSS property defines a shape—which may be non-rectangular—around which adjacent inline content should wrap. By default, inline content wraps around its margin box; shape-outside provides a way to customize this wrapping, making it possible to wrap text around complex objects rather than rectangular boxes.", - "formalSyntax": "none | [ <basic-shape> || <shape-box> ] | <image>\n  <shape-box> = <visual-box> | margin-box | half-border-box\n  <image> = <url> | <gradient>\n  <visual-box> = content-box | padding-box | border-box\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "formalSyntax": "none | [ <basic-shape> || <shape-box> ] | <image>\n  <basic-shape> = <basic-shape-rect> | <circle()> | <ellipse()> | <polygon()> | <path()> | <shape()>\n  <shape-box> = <visual-box> | margin-box | half-border-box\n  <image> = <url> | <gradient>\n  <basic-shape-rect> = <inset()> | <rect()> | <xywh()>\n  <circle()> = circle( <radial-size>? [ at <position> ]? )\n  <ellipse()> = ellipse( <radial-size>? [ at <position> ]? )\n  <polygon()> = polygon( <'fill-rule'>? [ round <length> ]? , [ <length-percentage> <length-percentage> ]# )\n  <path()> = path( <'fill-rule'>? , <string> )\n  <shape()> = shape( <'fill-rule'>? from <position> , <shape-command># )\n  <visual-box> = content-box | padding-box | border-box\n  <url> = <url()> | <src()>\n  <inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]? )\n  <rect()> = rect( <top> , <right> , <bottom> , <left> )\n  <xywh()> = xywh( <length-percentage>{2} <length-percentage [0,∞]>{2} [ round <'border-radius'> ]? )\n  <radial-size> = <radial-extent> | <length [0,∞]> | <length-percentage [0,∞]>{2}\n  <position> = [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]\n  <fill-rule> = nonzero | evenodd\n  <length-percentage> = <length> | <percentage>\n  <shape-command> = <move-command> | <line-command> | close | <horizontal-line-command> | <vertical-line-command> | <curve-command> | <smooth-command> | <arc-command>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )\n  <border-radius> = <length-percentage [0,∞]>{1,4} [ / <length-percentage [0,∞]>{1,4} ]?\n  <radial-extent> = closest-corner | closest-side | farthest-corner | farthest-side\n  <move-command> = move <command-end-point>\n  <line-command> = line <command-end-point>\n  <horizontal-line-command> = hline [ to [ <length-percentage> | left | center | right | x-start | x-end ] | by <length-percentage> ]\n  <vertical-line-command> = vline [ to [ <length-percentage> | top | center | bottom | y-start | y-end ] | by <length-percentage> ]\n  <curve-command> = curve [ [ to <position> with <control-point> [ / <control-point> ]? ] | [ by <coordinate-pair> with <relative-control-point> [ / <relative-control-point> ]? ] ]\n  <smooth-command> = smooth [ [ to <position> [ with <control-point> ]? ] | [ by <coordinate-pair> [ with <relative-control-point> ]? ] ]\n  <arc-command> = arc <command-end-point> [ [ of <length-percentage>{1,2} ] && <arc-sweep>? && <arc-size>? && [ rotate <angle> ]? ]\n  <command-end-point> = to <position> | by <coordinate-pair>\n  <control-point> = <position> | <relative-control-point>\n  <coordinate-pair> = <length-percentage>{2}\n  <relative-control-point> = <coordinate-pair> [ from [ start | end | origin ] ]?\n  <arc-sweep> = cw | ccw\n  <arc-size> = large | small", "values": { "none": "The float area is unaffected. Inline content wraps around the element's margin box, like usual.", - "<shape-box>": "The float area is computed according to the shape of a float element's edges (as defined by the CSS box model). This can be margin-box, border-box, padding-box, or content-box. The shape includes any curvature created by the border-radius property (behavior which is similar to background-clip).\n
    \n
    margin-box
    \n
    \n

    Defines the shape enclosed by the outside margin edge. The corner radii of this shape are determined by the corresponding border-radius and margin values. If the border-radius / margin ratio is 1 or more, then the margin box corner radius is border-radius + margin. If the ratio is less than 1, then the margin box corner radius is border-radius + (margin * (1 + (ratio - 1) ^ 3)).\n

    \n
    border-box
    \n
    \n

    Defines the shape enclosed by the outside border edge. The shape follows the normal border radius shaping rules for the outside of the border.\n

    \n
    padding-box
    \n
    \n

    Defines the shape enclosed by the outside padding edge. The shape follows the normal border radius shaping rules for the inside of the border.\n

    \n
    content-box
    \n
    \n

    Defines the shape enclosed by the outside content edge. Each corner radius of this box is the larger of 0 or border-radius - border-width - padding.\n

    \n
    ", - "<basic-shape>": "The float area is computed based on the shape created by an inset(), circle(), ellipse(), or polygon() function; other <basic-shape> functions are invalid. If a <shape-box> is also supplied, it defines the reference box for the <basic-shape> function. Otherwise, the reference box defaults to margin-box.", - "<image>": "The float area is extracted and computed based on the alpha channel of the specified <image> as defined by shape-image-threshold." + "<shape-box>": "The float area is computed according to the shape of a float element's edges (as defined by the CSS box model). This can be margin-box, border-box, padding-box, or content-box. The shape includes any curvature created by the border-radius property (behavior which is similar to background-clip).\n
    \n
    margin-box
    \n
    \n

    Defines the shape enclosed by the outside margin edge. The corner radii of this shape are determined by the corresponding border-radius and margin values. If the border-radius / margin ratio is 1 or more, then the margin box corner radius is border-radius + margin. If the ratio is less than 1, then the margin box corner radius is border-radius + (margin * (1 + (ratio - 1) ^ 3)).\n

    \n
    border-box
    \n
    \n

    Defines the shape enclosed by the outside border edge. The shape follows the normal border radius shaping rules for the outside of the border.\n

    \n
    padding-box
    \n
    \n

    Defines the shape enclosed by the outside padding edge. The shape follows the normal border radius shaping rules for the inside of the border.\n

    \n
    content-box
    \n
    \n

    Defines the shape enclosed by the outside content edge. Each corner radius of this box is the larger of 0 or border-radius - border-width - padding.\n

    \n
    ", + "<basic-shape>": "The float area is computed based on the shape created by an inset(), circle(), ellipse(), or polygon() function; other <basic-shape> functions are invalid. If a <shape-box> is also supplied, it defines the reference box for the <basic-shape> function. Otherwise, the reference box defaults to margin-box.", + "<image>": "The float area is extracted and computed based on the alpha channel of the specified <image> as defined by shape-image-threshold." } }, "shape-rendering": { - "url": "$MDN_URL$/web/css/shape-rendering", + "url": "$MDN_URL$/web/css/reference/properties/shape-rendering", "status": [ "StandardTrack" ], @@ -18233,7 +18458,7 @@ } }, "speak-as": { - "url": "$MDN_URL$/web/css/speak-as", + "url": "$MDN_URL$/web/css/reference/properties/speak-as", "status": [ "Experimental", "StandardTrack" @@ -18245,7 +18470,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The speak-as CSS property is used to define how HTML content is spoken. The one to three enumerated key terms determine the manner by which elements and text get rendered by aural technologies, such as screen readers and digital assistants.\n

    This property applies to all content, including pseudo-elements, with the exception ::marker pseudo-elements constructed via a @counter-style with a defined speak-as descriptor, which takes precedence over any inherited speak-as property value.", + "doc": "

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

    \n

    The speak-as CSS property is used to define how HTML content is spoken. The one to three enumerated key terms determine the manner by which elements and text get rendered by aural technologies, such as screen readers and digital assistants.\n

    This property applies to all content, including pseudo-elements, with the exception ::marker pseudo-elements constructed via a @counter-style with a defined speak-as descriptor, which takes precedence over any inherited speak-as property value.", "formalSyntax": "normal | spell-out || digits || [ literal-punctuation | no-punctuation ]", "values": { "normal": "Normal pronunciation rules with punctuation replaced by pauses. For example, \"Hello, world!\" would be pronounced as \"Hello (pause) world (pause)\". This is the default value.", @@ -18256,7 +18481,7 @@ } }, "stop-color": { - "url": "$MDN_URL$/web/css/stop-color", + "url": "$MDN_URL$/web/css/reference/properties/stop-color", "status": [ "StandardTrack" ], @@ -18278,11 +18503,11 @@ "doc": "The stop-color CSS property defines the color to use for an SVG <stop> element within a gradient. If present, it overrides the element's stop-color attribute.\n

    \n

    Note:\nThe stop-color property only applies to <stop> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "<color>", "values": { - "<color>": "The color of the fill. This can be any valid CSS <color> value." + "<color>": "The color of the fill. This can be any valid CSS <color> value." } }, "stop-opacity": { - "url": "$MDN_URL$/web/css/stop-opacity", + "url": "$MDN_URL$/web/css/reference/properties/stop-opacity", "status": [ "StandardTrack" ], @@ -18301,7 +18526,7 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The stop-opacity CSS property defines the opacity of a given color gradient stop in the SVG <stop> element within an SVG gradient. If present, it overrides the element's stop-opacity attribute.\n

    The property value impacts the stop-color's alpha channel; it can increase the transparency of a <stop>'s color but can not make the color defined by the stop-color property more opaque.\n

    \n

    Note:\nThe stop-opacity property only applies to <stop> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", + "doc": "The stop-opacity CSS property defines the opacity of a given color gradient stop in the SVG <stop> element within an SVG gradient. If present, it overrides the element's stop-opacity attribute.\n

    The property value impacts the stop-color's alpha channel; it can increase the transparency of a <stop>'s color but can not make the color defined by the stop-color property more opaque.\n

    \n

    Note:\nThe stop-opacity property only applies to <stop> elements nested in an <svg>. It doesn't apply to other SVG, HTML, or pseudo-elements.\n

    ", "formalSyntax": "<number> | <percentage>", "values": { "<number>": "A numeric value between 0 and 1, inclusive.", @@ -18309,7 +18534,7 @@ } }, "stroke": { - "url": "$MDN_URL$/web/css/stroke", + "url": "$MDN_URL$/web/css/reference/properties/stroke", "status": [ "StandardTrack" ], @@ -18329,7 +18554,7 @@ "highDate": "≤2019-10-05" }, "doc": "The stroke CSS property defines the color or SVG paint server used to draw an element's stroke. As such, stroke only has an effect on elements that can be given a stroke (for example, <rect> or <ellipse>); see the page on the SVG stroke attribute for a complete list. When declared, the CSS value overrides any value of the element's stroke SVG attribute.\n
    \n

    Note:\nAccording to the 4 April 2017 draft of the CSS Fill and Stroke Module Level 3 specification, the stroke property is a shorthand for a number of other stroke properties. In practice, as of August 2024, browsers do not support the setting of other stroke-related values such as width or dash patterns via the stroke property, treating it instead as a direct analogue of the SVG stroke attribute.\n

    ", - "formalSyntax": "<paint>\n  <paint> = none | <image> | <svg-paint>\n  <image> = <url> | <gradient>\n  <svg-paint> = child | child( <integer> )\n  <url> = <url()> | <src()>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", + "formalSyntax": "<paint>\n  <paint> = none | <image> | <svg-paint>\n  <image> = <url> | <gradient>\n  <svg-paint> = child | child( <integer> )\n  <url> = <url()> | <src()>\n  <integer> = <number-token>\n  <url()> = url( <string> <url-modifier>* ) | <url-token>\n  <src()> = src( <string> <url-modifier>* )", "values": { "<color>": "Sets the painting of the stroke with any valid CSS color value.", "<image>": "Sets the painting of the stroke with what SVG calls a paint server, which in this context is an SVG gradient or pattern. CSS gradients cannot be used with the stroke property.", @@ -18337,7 +18562,7 @@ } }, "stroke-dasharray": { - "url": "$MDN_URL$/web/css/stroke-dasharray", + "url": "$MDN_URL$/web/css/reference/properties/stroke-dasharray", "status": [ "StandardTrack" ], @@ -18366,7 +18591,7 @@ } }, "stroke-dashoffset": { - "url": "$MDN_URL$/web/css/stroke-dashoffset", + "url": "$MDN_URL$/web/css/reference/properties/stroke-dashoffset", "status": [ "StandardTrack" ], @@ -18385,7 +18610,7 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The stroke-dashoffset CSS property defines an offset for the starting point of the rendering of an SVG element's associated dash array. If present, it overrides the element's stroke-dashoffset attribute.\n

    This property applies to any SVG shape or text-content element (see stroke-dashoffset for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.", + "doc": "The stroke-dashoffset CSS property defines an offset for the starting point of the rendering of an SVG element's associated dash array. If present, it overrides the element's stroke-dashoffset attribute.\n

    This property applies to any SVG shape or text-content element (see stroke-dashoffset for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.", "formalSyntax": "<length-percentage> | <number>\n  <length-percentage> = <length> | <percentage>", "values": { "<number>": "A number of SVG units, the size of which defined by the current unit space. The value given, if other than 0, moves the starting point from the start of the dash array to another point within it. Thus, positive values will appear to shift the dash-gap pattern backwards, and negative values will appear to shift the pattern forwards.", @@ -18394,7 +18619,7 @@ } }, "stroke-linecap": { - "url": "$MDN_URL$/web/css/stroke-linecap", + "url": "$MDN_URL$/web/css/reference/properties/stroke-linecap", "status": [ "StandardTrack" ], @@ -18422,7 +18647,7 @@ } }, "stroke-linejoin": { - "url": "$MDN_URL$/web/css/stroke-linejoin", + "url": "$MDN_URL$/web/css/reference/properties/stroke-linejoin", "status": [ "StandardTrack" ], @@ -18448,12 +18673,12 @@ "miter": "Indicates that a sharp corner is to be used to join path segments. The corner is formed by extending the outer edges of the stroke at the tangents of the path segments until they intersect. This is the default value.", "round": "Indicates that a round corner is to be used to join path segments. This is accomplished by cropping the join as per bevel, and then appending a filled arc tangent in order to round the corner.", "arcs": "(Unsupported.) Indicates that an arcs corner is to be used to join path segments. The arc's shape is formed by extending the outer edges of the stroke at the join point with arcs that have the same curvature as the outer edges at the join point.", - "crop": "(Unsupported.) Indicates the corner should extend past the join point by the minimum amount necessary to form a convex corner. This is functionally equivalent to miter (see above) with a stroke-miterlimit value of 1.", - "fallback": "(Unsupported; at risk.) behaves identically to crop bevel when the stroke-miterlimit value is exceeded." + "crop": "(Unsupported.) Indicates the corner should extend past the join point by the minimum amount necessary to form a convex corner. This is functionally equivalent to miter (see above) with a stroke-miterlimit value of 1.", + "fallback": "(Unsupported; at risk.) behaves identically to crop bevel when the stroke-miterlimit value is exceeded." } }, "stroke-miterlimit": { - "url": "$MDN_URL$/web/css/stroke-miterlimit", + "url": "$MDN_URL$/web/css/reference/properties/stroke-miterlimit", "status": [ "StandardTrack" ], @@ -18472,14 +18697,14 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The stroke-miterlimit CSS property defines a limit on the ratio of the miter length to the stroke-width when the shape to be used at the corners of an SVG element's stroked path is a mitered join. If the limit defined by this property is exceeded, the join is converted from miter to bevel, thus making the corner appear truncated.\n

    This property applies to any SVG corner-generating shape or text-content element (see stroke-miterlimit for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes. If present, it overrides the element's stroke-miterlimit attribute.", + "doc": "The stroke-miterlimit CSS property defines a limit on the ratio of the miter length to the stroke-width when the shape to be used at the corners of an SVG element's stroked path is a mitered join. If the limit defined by this property is exceeded, the join is converted from miter to bevel, thus making the corner appear truncated.\n

    This property applies to any SVG corner-generating shape or text-content element (see stroke-miterlimit for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes. If present, it overrides the element's stroke-miterlimit attribute.", "formalSyntax": "<number>", "values": { "<number>": "Any real positive number equal to or greater than 1; values below that are invalid. The initial value is 4." } }, "stroke-opacity": { - "url": "$MDN_URL$/web/css/stroke-opacity", + "url": "$MDN_URL$/web/css/reference/properties/stroke-opacity", "status": [ "StandardTrack" ], @@ -18498,7 +18723,7 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The stroke-opacity CSS property defines the opacity of an SVG shape's stroke. The effect is identical to that of opacity, except it is applied only to the stroke, not to the entire element. If present, it overrides the element's stroke-opacity attribute.\n

    This property applies to SVG shapes and text-content elements (see stroke-opacity for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.\n

    Note that a shape's stroke partially covers the fill of that shape, so a stroke with an opacity less than 1 will show the fill blended with the stroke where they overlap. To avoid this effect, it is possible to apply a global opacity with the opacity property or to put the stroke behind the fill with the paint-order attribute.", + "doc": "The stroke-opacity CSS property defines the opacity of an SVG shape's stroke. The effect is identical to that of opacity, except it is applied only to the stroke, not to the entire element. If present, it overrides the element's stroke-opacity attribute.\n

    This property applies to SVG shapes and text-content elements (see stroke-opacity for a full list), but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.\n

    Note that a shape's stroke partially covers the fill of that shape, so a stroke with an opacity less than 1 will show the fill blended with the stroke where they overlap. To avoid this effect, it is possible to apply a global opacity with the opacity property or to put the stroke behind the fill with the paint-order attribute.", "formalSyntax": "<'opacity'>\n  <opacity> = <opacity-value>\n  <opacity-value> = <number> | <percentage>", "values": { "<number>": "Any real number from 0 to 1, inclusive. A value of 0 makes the stroke completely transparent, and a value of 1 makes it completely opaque. Values outside the range 0 – 1 are clipped to the nearest end of that range; thus, negative values are clipped to 0.", @@ -18506,7 +18731,7 @@ } }, "stroke-width": { - "url": "$MDN_URL$/web/css/stroke-width", + "url": "$MDN_URL$/web/css/reference/properties/stroke-width", "status": [ "StandardTrack" ], @@ -18534,7 +18759,7 @@ } }, "subsequent-sibling_combinator": { - "url": "$MDN_URL$/web/css/subsequent-sibling_combinator", + "url": "$MDN_URL$/web/css/reference/selectors/subsequent-sibling_combinator", "status": [ "StandardTrack" ], @@ -18556,7 +18781,7 @@ "doc": "The subsequent-sibling combinator (~, a tilde) separates two selectors and matches all instances of the second element that follow the first element (not necessarily immediately) and share the same parent element.\n

    In the following example, the subsequent-sibling combinator (~) helps to select and style paragraphs that are both siblings of an image and appear after any image.\n

    \n```css\nimg ~ p {\n  color: red;\n}\n```\n
    " }, "tab-size": { - "url": "$MDN_URL$/web/css/tab-size", + "url": "$MDN_URL$/web/css/reference/properties/tab-size", "status": [ "StandardTrack" ], @@ -18583,7 +18808,7 @@ } }, "table-layout": { - "url": "$MDN_URL$/web/css/table-layout", + "url": "$MDN_URL$/web/css/reference/properties/table-layout", "status": [ "StandardTrack" ], @@ -18606,11 +18831,11 @@ "formalSyntax": "auto | fixed", "values": { "auto": "The automatic table layout algorithm is used. The widths of the table and its cells are adjusted to fit the content. Most browsers use this algorithm by default.", - "fixed": "The fixed table layout algorithm is used. When using this keyword, the table's width needs to be specified explicitly using the width property. If the value of the width property is set to auto or is not specified, the browser uses the automatic table layout algorithm, in which case the fixed value has no effect.
    \nThe fixed table layout algorithm is faster than the automatic layout algorithm because the horizontal layout of the table depends only on the table's width, the width of the columns, and borders or cell spacing. The horizontal layout doesn't depend on the contents of the cells because it depends only on explicitly set widths.\n

    In the fixed table layout algorithm, the width of each column is determined as follows:\n

    \n

    With this algorithm the entire table can be rendered once the first table row has been downloaded and analyzed. This can speed up rendering time over the \"automatic\" layout method, but subsequent cell content might not fit in the column widths provided. Cells use the overflow property to determine whether to clip any overflowing content, but only if the table has a known width; otherwise, they won't overflow the cells." + "fixed": "The fixed table layout algorithm is used. When using this keyword, the table's width needs to be specified explicitly using the width property. If the value of the width property is set to auto or is not specified, the browser uses the automatic table layout algorithm, in which case the fixed value has no effect.
    \nThe fixed table layout algorithm is faster than the automatic layout algorithm because the horizontal layout of the table depends only on the table's width, the width of the columns, and borders or cell spacing. The horizontal layout doesn't depend on the contents of the cells because it depends only on explicitly set widths.\n

    In the fixed table layout algorithm, the width of each column is determined as follows:\n

    \n

    With this algorithm the entire table can be rendered once the first table row has been downloaded and analyzed. This can speed up rendering time over the \"automatic\" layout method, but subsequent cell content might not fit in the column widths provided. Cells use the overflow property to determine whether to clip any overflowing content, but only if the table has a known width; otherwise, they won't overflow the cells." } }, "text-align": { - "url": "$MDN_URL$/web/css/text-align", + "url": "$MDN_URL$/web/css/reference/properties/text-align", "status": [ "StandardTrack" ], @@ -18629,7 +18854,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The text-align CSS property sets the horizontal alignment of the inline-level content inside a block element or table-cell box. This means it works like vertical-align but in the horizontal direction.", + "doc": "The text-align CSS property sets the horizontal alignment of the inline-level content inside a block element or table-cell box. This means it works like vertical-align but in the horizontal direction.", "formalSyntax": "start | end | left | right | center | justify | match-parent | justify-all", "values": { "start": "The same as left if direction is left-to-right and right if direction is right-to-left.", @@ -18638,11 +18863,11 @@ "right": "The inline contents are aligned to the right edge of the line box.", "center": "The inline contents are centered within the line box.", "justify": "The inline contents are justified. Spaces out the content to line up its left and right edges to the left and right edges of the line box, except for the last line.", - "match-parent": "Similar to inherit, but the values start and end are calculated according to the parent's direction and are replaced by the appropriate left or right value." + "match-parent": "Similar to inherit, but the values start and end are calculated according to the parent's direction and are replaced by the appropriate left or right value." } }, "text-align-last": { - "url": "$MDN_URL$/web/css/text-align-last", + "url": "$MDN_URL$/web/css/reference/properties/text-align-last", "status": [ "StandardTrack" ], @@ -18664,7 +18889,7 @@ "doc": "The text-align-last CSS property sets how the last line of a block or a line, right before a forced line break, is aligned.", "formalSyntax": "auto | start | end | left | right | center | justify | match-parent", "values": { - "auto": "The affected line is aligned per the value of text-align, unless text-align is justify, in which case the effect is the same as setting text-align-last to start.", + "auto": "The affected line is aligned per the value of text-align, unless text-align is justify, in which case the effect is the same as setting text-align-last to start.", "start": "The same as left if direction is left-to-right and right if direction is right-to-left.", "end": "The same as right if direction is left-to-right and left if direction is right-to-left.", "left": "The inline contents are aligned to the left edge of the line box.", @@ -18674,7 +18899,7 @@ } }, "text-anchor": { - "url": "$MDN_URL$/web/css/text-anchor", + "url": "$MDN_URL$/web/css/reference/properties/text-anchor", "status": [ "StandardTrack" ], @@ -18693,7 +18918,7 @@ "lowDate": "≤2016-08-02", "highDate": "≤2019-02-02" }, - "doc": "The text-anchor CSS property aligns a box containing a string of text where the wrapping area is determined from the inline-size property, and the text is then placed relative to the anchor point of the element, which is defined using the x and y (or dx and dy) attributes. If present, the value of the CSS property overrides any value of the element's text-anchor attribute.\n

    Each individual text fragment within an element is aligned independently; thus, a multi-line <text> element will have each line of text aligned as per the value of text-anchor. text-anchor values only have an effect on the <text>, <textPath>, and <tspan> SVG elements. text-anchor does not apply to automatically wrapped text; for that, see text-align.", + "doc": "The text-anchor CSS property aligns a box containing a string of text where the wrapping area is determined from the inline-size property, and the text is then placed relative to the anchor point of the element, which is defined using the x and y (or dx and dy) attributes. If present, the value of the CSS property overrides any value of the element's text-anchor attribute.\n

    Each individual text fragment within an element is aligned independently; thus, a multi-line <text> element will have each line of text aligned as per the value of text-anchor. text-anchor values only have an effect on the <text>, <textPath>, and <tspan> SVG elements. text-anchor does not apply to automatically wrapped text; for that, see text-align.", "formalSyntax": "start | middle | end", "values": { "start": "Aligns the text such that the inline start of the text string is aligned with the anchor point. This alignment is relative to the writing direction of the text; thus, for example, in right-to-left top-to-bottom writing, the text will be placed to the left of the anchor point. If the text's inline direction is vertical, as with many Asian languages, the top edge of the text is aligned with the anchor point.", @@ -18702,7 +18927,7 @@ } }, "text-autospace": { - "url": "$MDN_URL$/web/css/text-autospace", + "url": "$MDN_URL$/web/css/reference/properties/text-autospace", "status": [ "StandardTrack" ], @@ -18710,12 +18935,15 @@ "Chrome": "140", "ChromeAndroid": "140", "Edge": "140", + "Firefox": "145", + "FirefoxAndroid": "145", "Opera": "124", "Safari": "18.4", "SafariIOS": "18.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-11-11" }, "doc": "The text-autospace CSS property allows you to specify the space applied between Chinese/Japanese/Korean (CJK) and non-CJK characters.", "formalSyntax": "normal | <autospace> | auto\n  <autospace> = no-autospace | [ ideograph-alpha || ideograph-numeric || punctuation ] || [ insert | replace ]", @@ -18726,7 +18954,7 @@ } }, "text-box": { - "url": "$MDN_URL$/web/css/text-box", + "url": "$MDN_URL$/web/css/reference/properties/text-box", "status": [ "StandardTrack" ], @@ -18741,11 +18969,11 @@ "baseline": { "level": "NONE" }, - "doc": "The text-box CSS property is a shorthand that corresponds to the text-box-trim and text-box-edge properties, which together specify the amount of space to trim from the block-start edge and block-end edge of a text element's block container.", + "doc": "The text-box CSS property is a shorthand that corresponds to the text-box-trim and text-box-edge properties, which together specify the amount of space to trim from the block-start edge and block-end edge of a text element's block container.", "formalSyntax": "normal | <'text-box-trim'> || <'text-box-edge'>\n  <text-box-trim> = none | trim-start | trim-end | trim-both\n  <text-box-edge> = auto | <text-edge>\n  <text-edge> = [ text | ideographic | ideographic-ink ] | [ text | ideographic | ideographic-ink | cap | ex ] [ text | ideographic | ideographic-ink | alphabetic ]" }, "text-box-edge": { - "url": "$MDN_URL$/web/css/text-box-edge", + "url": "$MDN_URL$/web/css/reference/properties/text-box-edge", "status": [ "StandardTrack" ], @@ -18760,11 +18988,11 @@ "baseline": { "level": "NONE" }, - "doc": "The text-box-edge CSS property specifies an amount of space to trim from a text element's block container.\n

    Vertical spacing differs between fonts, making consistent typesetting historically challenging on the web. The text-box-edge property — along with its counterpart property text-box-trim, which specifies which edge(s) to trim space from — makes consistent typesetting easier to achieve. The text-box-edge property has no effect if text-box-trim is not set or is set to none.\n

    \n

    Note:\nThe text-box shorthand property can be used to specify the text-box-edge and text-box-trim values in a single declaration.\n

    ", + "doc": "The text-box-edge CSS property specifies an amount of space to trim from a text element's block container.\n

    Vertical spacing differs between fonts, making consistent typesetting historically challenging on the web. The text-box-edge property — along with its counterpart property text-box-trim, which specifies which edge(s) to trim space from — makes consistent typesetting easier to achieve. The text-box-edge property has no effect if text-box-trim is not set or is set to none.\n

    \n

    Note:\nThe text-box shorthand property can be used to specify the text-box-edge and text-box-trim values in a single declaration.\n

    ", "formalSyntax": "auto | <text-edge>\n  <text-edge> = [ text | ideographic | ideographic-ink ] | [ text | ideographic | ideographic-ink | cap | ex ] [ text | ideographic | ideographic-ink | alphabetic ]" }, "text-box-trim": { - "url": "$MDN_URL$/web/css/text-box-trim", + "url": "$MDN_URL$/web/css/reference/properties/text-box-trim", "status": [ "StandardTrack" ], @@ -18779,11 +19007,11 @@ "baseline": { "level": "NONE" }, - "doc": "The text-box-trim CSS property specifies which of the over and under edges of text content to trim from a text element's block container.\n

    Vertical spacing differs between fonts, making consistent typesetting historically challenging on the web. The text-box-trim property — along with its counterpart property text-box-edge, which specifies how much space to trim — makes consistent vertical spacing of text easier to achieve.\n

    \n

    Note:\nThe text-box shorthand property can be used to specify the text-box-trim and text-box-edge values in a single declaration.\n

    ", + "doc": "The text-box-trim CSS property specifies which of the over and under edges of text content to trim from a text element's block container.\n

    Vertical spacing differs between fonts, making consistent typesetting historically challenging on the web. The text-box-trim property — along with its counterpart property text-box-edge, which specifies how much space to trim — makes consistent vertical spacing of text easier to achieve.\n

    \n

    Note:\nThe text-box shorthand property can be used to specify the text-box-trim and text-box-edge values in a single declaration.\n

    ", "formalSyntax": "none | trim-start | trim-end | trim-both" }, "text-combine-upright": { - "url": "$MDN_URL$/web/css/text-combine-upright", + "url": "$MDN_URL$/web/css/reference/properties/text-combine-upright", "status": [ "StandardTrack" ], @@ -18803,14 +19031,14 @@ "highDate": "2024-09-14" }, "doc": "The text-combine-upright CSS property sets the combination of characters into the space of a single character. If the combined text is wider than 1em, the user agent must fit the contents within 1em. The resulting composition is treated as a single upright glyph for layout and decoration. This property only has an effect in vertical writing modes.\n

    This is used to produce an effect that is known as tate-chū-yoko 縦中横 in Japanese, or as 橫向文字 in Chinese.", - "formalSyntax": "none | all | [ digits <integer [2,4]>? ]", + "formalSyntax": "none | all | [ digits <integer [2,4]>? ]\n  <integer> = <number-token>", "values": { "none": "There is no special processing.", "all": "Attempts to typeset all consecutive characters within the box horizontally, such that they take up the space of a single character within the vertical line of the box." } }, "text-decoration": { - "url": "$MDN_URL$/web/css/text-decoration", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration", "status": [ "StandardTrack" ], @@ -18829,7 +19057,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The text-decoration shorthand CSS property sets the appearance of decorative lines on text. It is a shorthand for text-decoration-line, text-decoration-color, text-decoration-style, and the newer text-decoration-thickness property.", + "doc": "The text-decoration shorthand CSS property sets the appearance of decorative lines on text. It is a shorthand for text-decoration-line, text-decoration-color, text-decoration-style, and the newer text-decoration-thickness property.", "formalSyntax": "<'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'>\n  <text-decoration-line> = none | [ underline || overline || line-through || blink ]\n  <text-decoration-style> = solid | double | dotted | dashed | wavy\n  <text-decoration-color> = <color>", "values": { "text-decoration-line": "Sets the kind of decoration used, such as underline or line-through.", @@ -18839,7 +19067,7 @@ } }, "text-decoration-color": { - "url": "$MDN_URL$/web/css/text-decoration-color", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-color", "status": [ "StandardTrack" ], @@ -18858,14 +19086,31 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The text-decoration-color CSS property sets the color of decorations added to text by text-decoration-line.\n

    The color applies to decorations, such as underlines, overlines, strikethroughs, and wavy lines like those used to mark misspellings, in the scope of the property's value.", + "doc": "The text-decoration-color CSS property sets the color of decorations added to text by text-decoration-line.\n

    The color applies to decorations, such as underlines, overlines, strikethroughs, and wavy lines like those used to mark misspellings, in the scope of the property's value.", "formalSyntax": "<color>", "values": { "<color>": "The color of the line decoration." } }, + "text-decoration-inset": { + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-inset", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Firefox": "146", + "FirefoxAndroid": "146" + }, + "doc": "

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

    \n

    The text-decoration-inset CSS property enables adjusting the start and end points of an element's text decoration so it can be shortened, lengthened, or have its position shifted with respect to the rendered text.", + "formalSyntax": "<length>{1,2} | auto", + "values": { + "<length>": "Specifies the amount to adjust the text decoration position by. Positive values inset the text decoration (make it shorter) while negative values outset the text decoration (make it longer). If one value is specified, it applies to both the text decoration start and end points. If two values are specified, the first one applies to the text decoration start point and the second one applies to the text decoration end point.", + "auto": "The browser chooses a start and end inset amount to ensure that, if two decorated text boxes appear side-by-side, the appearance of a gap is created between their text decorations so they do not appear to have a single text decoration." + } + }, "text-decoration-line": { - "url": "$MDN_URL$/web/css/text-decoration-line", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-line", "status": [ "StandardTrack" ], @@ -18891,13 +19136,13 @@ "underline": "Each line of text has a decorative line beneath it.", "overline": "Each line of text has a decorative line above it.", "line-through": "Each line of text has a decorative line going through its middle.", - "blink": "The text blinks (alternates between visible and invisible). Conforming user agents may not blink the text. This value is deprecated in favor of CSS animations.", + "blink": "The text blinks (alternates between visible and invisible). Conforming user agents may not blink the text. This value is deprecated in favor of CSS animations.", "spelling-error": "Each line of text uses the user agents' method of highlighting spelling mistakes, which is a dotted red line in most browsers.", "grammar-error": "Each line of text uses the user agents' method of highlighting grammar mistakes, which is a dotted green line in most browsers." } }, "text-decoration-skip": { - "url": "$MDN_URL$/web/css/text-decoration-skip", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-skip", "status": [ "Experimental", "StandardTrack" @@ -18909,12 +19154,12 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The text-decoration-skip CSS property sets what parts of an element's content any text decoration affecting the element must skip over. It controls all text decoration lines drawn by the element and also any text decoration lines drawn by its ancestors.\n

    \n

    Note:\nMost other browsers are converging on supporting the simpler text-decoration-skip-ink property.\n

    ", + "doc": "

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

    \n

    The text-decoration-skip CSS property sets what parts of an element's content any text decoration affecting the element must skip over. It controls all text decoration lines drawn by the element and also any text decoration lines drawn by its ancestors.\n

    \n

    Note:\nMost other browsers are converging on supporting the simpler text-decoration-skip-ink property.\n

    ", "formalSyntax": "none | auto", "values": { "none": "Nothing is skipped. Thus, text decoration is drawn for all text content and across atomic inline-level boxes.", "objects": "The entire margin box of the element is skipped if it is an atomic inline such as an image or inline-block.", - "spaces": "All spacing is skipped: all Unicode white space characters and all word separators, plus any adjacent letter-spacing or word-spacing.", + "spaces": "All spacing is skipped: all Unicode white space characters and all word separators, plus any adjacent letter-spacing or word-spacing.", "leading-spaces": "The same as spaces, except that only leading spaces are skipped.", "trailing-spaces": "The same as spaces, except that only trailing spaces are skipped.", "edges": "The start and end of the text decoration is inset slightly (e.g., by half of the line thickness) from the content edge of the decorating box. Thus, adjacent elements receive separate underlines. (This is important in Chinese, where underlining is a form of punctuation.)", @@ -18922,7 +19167,7 @@ } }, "text-decoration-skip-ink": { - "url": "$MDN_URL$/web/css/text-decoration-skip-ink", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-skip-ink", "status": [ "StandardTrack" ], @@ -18950,7 +19195,7 @@ } }, "text-decoration-style": { - "url": "$MDN_URL$/web/css/text-decoration-style", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-style", "status": [ "StandardTrack" ], @@ -18969,7 +19214,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The text-decoration-style CSS property sets the style of the lines specified by text-decoration-line. The style applies to all lines that are set with text-decoration-line.", + "doc": "The text-decoration-style CSS property sets the style of the lines specified by text-decoration-line. The style applies to all lines that are set with text-decoration-line.", "formalSyntax": "solid | double | dotted | dashed | wavy", "values": { "solid": "Draws a single line.", @@ -18977,11 +19222,11 @@ "dotted": "Draws a dotted line.", "dashed": "Draws a dashed line.", "wavy": "Draws a wavy line.", - "-moz-none": "Draws no line. Use text-decoration-line: none instead." + "-moz-none": "Draws no line. Use text-decoration-line: none instead." } }, "text-decoration-thickness": { - "url": "$MDN_URL$/web/css/text-decoration-thickness", + "url": "$MDN_URL$/web/css/reference/properties/text-decoration-thickness", "status": [ "StandardTrack" ], @@ -19005,12 +19250,12 @@ "values": { "auto": "The browser chooses an appropriate width for the text decoration line.", "from-font": "If the font file includes information about a preferred thickness, use that value. If the font file doesn't include this information, behave as if auto was set, with the browser choosing an appropriate thickness.", - "<length>": "Specifies the thickness of the text decoration line as a <length>, overriding the font file suggestion or the browser default.", - "<percentage>": "Specifies the thickness of the text decoration line as a <percentage> of 1em in the current font. A percentage inherits as a relative value, and so therefore scales with changes in the font. The browser must use a minimum of 1 device pixel. For a given application of this property, the thickness is constant across the whole box it is applied to, even if there are child elements with a different font size." + "<length>": "Specifies the thickness of the text decoration line as a <length>, overriding the font file suggestion or the browser default.", + "<percentage>": "Specifies the thickness of the text decoration line as a <percentage> of 1em in the current font. A percentage inherits as a relative value, and so therefore scales with changes in the font. The browser must use a minimum of 1 device pixel. For a given application of this property, the thickness is constant across the whole box it is applied to, even if there are child elements with a different font size." } }, "text-emphasis": { - "url": "$MDN_URL$/web/css/text-emphasis", + "url": "$MDN_URL$/web/css/reference/properties/text-emphasis", "status": [ "StandardTrack" ], @@ -19029,7 +19274,7 @@ "lowDate": "2022-03-03", "highDate": "2024-09-03" }, - "doc": "The text-emphasis CSS property applies emphasis marks to text (except spaces and control characters). It is a shorthand for text-emphasis-style and text-emphasis-color.", + "doc": "The text-emphasis CSS property applies emphasis marks to text (except spaces and control characters). It is a shorthand for text-emphasis-style and text-emphasis-color.", "formalSyntax": "<'text-emphasis-style'> || <'text-emphasis-color'>\n  <text-emphasis-style> = none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>\n  <text-emphasis-color> = <color>", "values": { "none": "No emphasis marks.", @@ -19045,7 +19290,7 @@ } }, "text-emphasis-color": { - "url": "$MDN_URL$/web/css/text-emphasis-color", + "url": "$MDN_URL$/web/css/reference/properties/text-emphasis-color", "status": [ "StandardTrack" ], @@ -19064,14 +19309,14 @@ "lowDate": "2022-03-03", "highDate": "2024-09-03" }, - "doc": "The text-emphasis-color CSS property sets the color of emphasis marks. This value can also be set using the text-emphasis shorthand.", + "doc": "The text-emphasis-color CSS property sets the color of emphasis marks. This value can also be set using the text-emphasis shorthand.", "formalSyntax": "<color>", "values": { "<color>": "Defines the color of the emphasis marks. If no color is present, it defaults to currentColor." } }, "text-emphasis-position": { - "url": "$MDN_URL$/web/css/text-emphasis-position", + "url": "$MDN_URL$/web/css/reference/properties/text-emphasis-position", "status": [ "StandardTrack" ], @@ -19101,7 +19346,7 @@ } }, "text-emphasis-style": { - "url": "$MDN_URL$/web/css/text-emphasis-style", + "url": "$MDN_URL$/web/css/reference/properties/text-emphasis-style", "status": [ "StandardTrack" ], @@ -19120,7 +19365,7 @@ "lowDate": "2022-03-03", "highDate": "2024-09-03" }, - "doc": "The text-emphasis-style CSS property sets the appearance of emphasis marks. It can also be set, and reset, using the text-emphasis shorthand.", + "doc": "The text-emphasis-style CSS property sets the appearance of emphasis marks. It can also be set, and reset, using the text-emphasis shorthand.", "formalSyntax": "none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>", "values": { "none": "No emphasis marks.", @@ -19135,7 +19380,7 @@ } }, "text-indent": { - "url": "$MDN_URL$/web/css/text-indent", + "url": "$MDN_URL$/web/css/reference/properties/text-indent", "status": [ "StandardTrack" ], @@ -19157,36 +19402,39 @@ "doc": "The text-indent CSS property sets the length of empty space (indentation) that is put before lines of text in a block.", "formalSyntax": "[ <length-percentage> ] &&hanging? &&each-line?\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "Indentation is specified as an absolute <length>. Negative values are allowed. See <length> values for possible units.", - "<percentage>": "Indentation is a <percentage> of the containing block's width.", + "<length>": "Indentation is specified as an absolute <length>. Negative values are allowed. See <length> values for possible units.", + "<percentage>": "Indentation is a <percentage> of the containing block's width.", "each-line": "Indentation affects the first line of the block container as well as each line after a forced line break, but does not affect lines after a soft wrap break.", "hanging": "Inverts which lines are indented. All lines except the first line will be indented." } }, "text-justify": { - "url": "$MDN_URL$/web/css/text-justify", + "url": "$MDN_URL$/web/css/reference/properties/text-justify", "status": [ "StandardTrack" ], "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", "Firefox": "55", "FirefoxAndroid": "55" }, "baseline": { "level": "NONE" }, - "doc": "The text-justify CSS property sets what type of justification should be applied to text when text-align: justify; is set on an element.", + "doc": "The text-justify CSS property sets what type of justification should be applied to text when text-align: justify; is set on an element.", "formalSyntax": "auto | none | inter-word | inter-character", "values": { - "none": "The text justification is turned off. This has the same effect as not setting text-align at all, although it is useful if you need to turn justification on and off for some reason.", + "none": "The text justification is turned off. This has the same effect as not setting text-align at all, although it is useful if you need to turn justification on and off for some reason.", "auto": "The browser chooses the best type of justification for the current situation based on a balance between performance and quality, but also on what is most appropriate for the language of the text (e.g., English, CJK languages, etc.). This is the default justification used if text-justify is not set at all.", - "inter-word": "The text is justified by adding space between words (effectively varying word-spacing), which is most appropriate for languages that separate words using spaces, like English or Korean.", - "inter-character": "The text is justified by adding space between characters (effectively varying letter-spacing), which is most appropriate for languages like Japanese.", + "inter-word": "The text is justified by adding space between words (effectively varying word-spacing), which is most appropriate for languages that separate words using spaces, like English or Korean.", + "inter-character": "The text is justified by adding space between characters (effectively varying letter-spacing), which is most appropriate for languages like Japanese.", "distribute": "Exhibits the same behavior as inter-character; this value is kept for backwards compatibility." } }, "text-orientation": { - "url": "$MDN_URL$/web/css/text-orientation", + "url": "$MDN_URL$/web/css/reference/properties/text-orientation", "status": [ "StandardTrack" ], @@ -19205,18 +19453,18 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The text-orientation CSS property sets the orientation of the text characters in a line. It only affects text in vertical mode (when writing-mode is not horizontal-tb). It is useful for controlling the display of languages that use vertical script, and also for making vertical table headers.", + "doc": "The text-orientation CSS property sets the orientation of the text characters in a line. It only affects text in vertical mode (when writing-mode is not horizontal-tb). It is useful for controlling the display of languages that use vertical script, and also for making vertical table headers.", "formalSyntax": "mixed | upright | sideways", "values": { "mixed": "Rotates the characters of horizontal scripts 90° clockwise. Lays out the characters of vertical scripts naturally. Default value.", - "upright": "Lays out the characters of horizontal scripts naturally (upright), as well as the glyphs for vertical scripts. Note that this keyword causes all characters to be considered as left-to-right: the used value of direction is forced to be ltr.", + "upright": "Lays out the characters of horizontal scripts naturally (upright), as well as the glyphs for vertical scripts. Note that this keyword causes all characters to be considered as left-to-right: the used value of direction is forced to be ltr.", "sideways": "Causes characters to be laid out as they would be horizontally, but with the whole line rotated 90° clockwise.", "sideways-right": "An alias to sideways that is kept for compatibility purposes.", "use-glyph-orientation": "On SVG elements, this keyword leads to use the value of the deprecated SVG properties glyph-orientation-vertical and glyph-orientation-horizontal." } }, "text-overflow": { - "url": "$MDN_URL$/web/css/text-overflow", + "url": "$MDN_URL$/web/css/reference/properties/text-overflow", "status": [ "StandardTrack" ], @@ -19238,13 +19486,13 @@ "doc": "The text-overflow CSS property sets how hidden overflow content is signaled to users. It can be clipped, display an ellipsis (…), or display a custom string.", "formalSyntax": "clip | ellipsis", "values": { - "clip": "The default for this property. This keyword value will truncate the text at the limit of the content area, therefore the truncation can happen in the middle of a character. To clip at the transition between characters you can specify text-overflow as an empty string, if that is supported in your target browsers: text-overflow: '';.", - "ellipsis": "This keyword value will display an ellipsis ('…', U+2026 HORIZONTAL ELLIPSIS) to represent clipped text. The ellipsis is displayed inside the content area, decreasing the amount of text displayed. If there is not enough space to display the ellipsis, it is clipped.", - "<string>": "The <string> to be used to represent clipped text. The string is displayed inside the content area, shortening the size of the displayed text. If there is not enough space to display the string itself, it is clipped." + "clip": "The default for this property. This keyword value will truncate the text at the limit of the content area, therefore the truncation can happen in the middle of a character. To clip at the transition between characters you can specify text-overflow as an empty string, if that is supported in your target browsers: text-overflow: '';.", + "ellipsis": "This keyword value will display an ellipsis ('…', U+2026 HORIZONTAL ELLIPSIS) to represent clipped text. The ellipsis is displayed inside the content area, decreasing the amount of text displayed. If there is not enough space to display the ellipsis, it is clipped.", + "<string>": "The <string> to be used to represent clipped text. The string is displayed inside the content area, shortening the size of the displayed text. If there is not enough space to display the string itself, it is clipped." } }, "text-rendering": { - "url": "$MDN_URL$/web/css/text-rendering", + "url": "$MDN_URL$/web/css/reference/properties/text-rendering", "status": [ "StandardTrack" ], @@ -19273,7 +19521,7 @@ } }, "text-shadow": { - "url": "$MDN_URL$/web/css/text-shadow", + "url": "$MDN_URL$/web/css/reference/properties/text-shadow", "status": [ "StandardTrack" ], @@ -19292,16 +19540,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The text-shadow CSS property adds shadows to text. It accepts a comma-separated list of shadows to be applied to the text and any of its decorations. Each shadow is described by some combination of X and Y offsets from the element, blur radius, and color.", - "formalSyntax": "none | [ <color>? && <length>{2,3} ]#", + "doc": "The text-shadow CSS property adds shadows to text. It accepts a comma-separated list of shadows to be applied to the text and any of its text-decoration. Each shadow is described by some combination of X and Y offsets from the element, blur radius, and color.", + "formalSyntax": "none | [ <color>? && [ <length>{2} <length [0,∞]>? ] ]#", "values": { "<color>": "Optional. The color of the shadow. It can be specified either before or after the offset values. If unspecified, the color's value is left up to the user agent, so when consistency across browsers is desired you should define it explicitly.", - "<offset-x> <offset-y>": "Required. These <length> values specify the shadow's distance from the text. <offset-x> specifies the horizontal distance; a negative value places the shadow to the left of the text. <offset-y> specifies the vertical distance; a negative value places the shadow above the text. If both values are 0, the shadow is placed directly behind the text, although it may be partly visible due to the effect of <blur-radius>.", - "<blur-radius>": "Optional. This is a <length> value. The higher the value, the bigger the blur; the shadow becomes wider and lighter. If not specified, it defaults to 0." + "<offset-x> <offset-y>": "Required. These <length> values specify the shadow's distance from the text. <offset-x> specifies the horizontal distance; a negative value places the shadow to the left of the text. <offset-y> specifies the vertical distance; a negative value places the shadow above the text. If both values are 0, the shadow is placed directly behind the text, although it may be partly visible due to the effect of <blur-radius>.", + "<blur-radius>": "Optional. This is a <length> value. The higher the value, the bigger the blur; the shadow becomes wider and lighter. If not specified, it defaults to 0." } }, "text-size-adjust": { - "url": "$MDN_URL$/web/css/text-size-adjust", + "url": "$MDN_URL$/web/css/reference/properties/text-size-adjust", "status": [ "Experimental", "StandardTrack" @@ -19324,7 +19572,7 @@ } }, "text-spacing-trim": { - "url": "$MDN_URL$/web/css/text-spacing-trim", + "url": "$MDN_URL$/web/css/reference/properties/text-spacing-trim", "status": [ "Experimental", "StandardTrack" @@ -19341,11 +19589,11 @@ "doc": "

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

    \n

    The text-spacing-trim CSS property controls the internal spacing set on Chinese/Japanese/Korean (CJK) punctuation characters between adjacent characters (kerning) and at the start or end of text lines.", "formalSyntax": "<spacing-trim> | auto\n  <spacing-trim> = space-all | normal | space-first | trim-start | trim-both | trim-all", "values": { - "<spacing-trim>": "Defines the different spacing trim options. Available values are:\n

    \n
    normal
    \n
    \n

    Sets CJK full-width opening punctuation characters to be full-width at the start of each line. Sets CJK full-width closing punctuation characters to be full-width at the end of each line, or half-width if they do not fit on the line before justification. Collapses spacing between punctuation characters.\n

    \n
    space-all
    \n
    \n

    All CJK full-width punctuation characters are set to be full-width.\n

    \n
    space-first
    \n
    \n

    Behaves as normal, except that CJK full-width opening punctuation characters are set to be full-width at the start of the first line of the text's block container, and the start of every subsequent line coming after an explicit line break such as a newline character.\n

    \n
    trim-start
    \n
    \n

    Behaves as normal, except that CJK full-width opening punctuation characters are set to be half-width at the start of each line.\n

    \n
    \n
    \n

    Note:\nThe CSS Text module also defines trim-both, trim-all, and auto values. However, these are not currently implemented in any browser.\n

    " + "<spacing-trim>": "Defines the different spacing trim options. Available values are:\n
    \n
    normal
    \n
    \n

    Sets CJK full-width opening punctuation characters to be full-width at the start of each line. Sets CJK full-width closing punctuation characters to be full-width at the end of each line, or half-width if they do not fit on the line before justification. Collapses spacing between punctuation characters.\n

    \n
    space-all
    \n
    \n

    All CJK full-width punctuation characters are set to be full-width.\n

    \n
    space-first
    \n
    \n

    Behaves as normal, except that CJK full-width opening punctuation characters are set to be full-width at the start of the first line of the text's block container, and the start of every subsequent line coming after an explicit line break such as a newline character.\n

    \n
    trim-start
    \n
    \n

    Behaves as normal, except that CJK full-width opening punctuation characters are set to be half-width at the start of each line.\n

    \n
    \n
    \n

    Note:\nThe CSS Text module also defines trim-both, trim-all, and auto values. However, these are not currently implemented in any browser.\n

    " } }, "text-transform": { - "url": "$MDN_URL$/web/css/text-transform", + "url": "$MDN_URL$/web/css/reference/properties/text-transform", "status": [ "StandardTrack" ], @@ -19368,7 +19616,7 @@ "formalSyntax": "none | [ capitalize | uppercase | lowercase ] || full-width || full-size-kana" }, "text-underline-offset": { - "url": "$MDN_URL$/web/css/text-underline-offset", + "url": "$MDN_URL$/web/css/reference/properties/text-underline-offset", "status": [ "StandardTrack" ], @@ -19387,16 +19635,16 @@ "lowDate": "2020-11-19", "highDate": "2023-05-19" }, - "doc": "The text-underline-offset CSS property sets the offset distance of an underline text decoration line (applied using text-decoration) from its original position.", + "doc": "The text-underline-offset CSS property sets the offset distance of an underline text decoration line (applied using text-decoration) from its original position.", "formalSyntax": "auto | <length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { "auto": "The browser chooses the appropriate offset for underlines.", - "<length>": "Specifies the offset of underlines as a <length>, overriding the font file suggestion and the browser default. It is recommended to use em units so the offset scales with the font size.", - "<percentage>": "Specifies the offset of underlines as a <percentage> of 1 em in the element's font. A percentage inherits as a relative value, and so therefore scales with changes in the font. For a given application of this property, the offset is constant across the whole box that the underline is applied to, even if there are child elements with different font sizes or vertical alignment." + "<length>": "Specifies the offset of underlines as a <length>, overriding the font file suggestion and the browser default. It is recommended to use em units so the offset scales with the font size.", + "<percentage>": "Specifies the offset of underlines as a <percentage> of 1 em in the element's font. A percentage inherits as a relative value, and so therefore scales with changes in the font. For a given application of this property, the offset is constant across the whole box that the underline is applied to, even if there are child elements with different font sizes or vertical alignment." } }, "text-underline-position": { - "url": "$MDN_URL$/web/css/text-underline-position", + "url": "$MDN_URL$/web/css/reference/properties/text-underline-position", "status": [ "StandardTrack" ], @@ -19415,7 +19663,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The text-underline-position CSS property specifies the position of the underline which is set using the text-decoration property's underline value.", + "doc": "The text-underline-position CSS property specifies the position of the underline which is set using the text-decoration property's underline value.", "formalSyntax": "auto | [ under || [ left | right ] ]", "values": { "auto": "The user agent uses its own algorithm to place the line at or under the alphabetic baseline.", @@ -19426,7 +19674,7 @@ } }, "text-wrap": { - "url": "$MDN_URL$/web/css/text-wrap", + "url": "$MDN_URL$/web/css/reference/properties/text-wrap", "status": [ "StandardTrack" ], @@ -19450,12 +19698,12 @@ "wrap": "Text is wrapped across lines at appropriate characters (for example spaces, in languages like English that use space separators) to minimize overflow. This is the default value.", "nowrap": "Text does not wrap across lines. It will overflow its containing element rather than breaking onto a new line.", "balance": "Text is wrapped in a way that best balances the number of characters on each line, enhancing layout quality and legibility. Because counting characters and balancing them across multiple lines is computationally expensive, this value is only supported for blocks of text spanning a limited number of lines (six or less for Chromium and ten or less for Firefox).", - "pretty": "Results in the same behavior as wrap, except that the user agent will use a slower algorithm that favors better layout over speed. This is intended for body copy where good typography is favored over performance (for example, when the number of orphans should be kept to a minimum).", + "pretty": "Results in the same behavior as wrap, except that the user agent will use a slower algorithm that favors better layout over speed. This is intended for body copy where good typography is favored over performance (for example, when the number of orphans should be kept to a minimum).", "stable": "Results in the same behavior as wrap, except that when the user is editing the content, the lines that come before the lines they are editing remain static rather than the whole block of text re-wrapping." } }, "text-wrap-mode": { - "url": "$MDN_URL$/web/css/text-wrap-mode", + "url": "$MDN_URL$/web/css/reference/properties/text-wrap-mode", "status": [ "StandardTrack" ], @@ -19473,7 +19721,7 @@ "level": "LOW", "lowDate": "2024-10-17" }, - "doc": "The text-wrap-mode CSS property controls whether the text inside an element is wrapped. The different values provide alternate ways of wrapping the content of a block element. It can also be set, and reset, using the text-wrap shorthand or the white-space shorthand.\n
    \n

    Note:\nThe white-space-collapse and text-wrap-mode properties can be declared together using the white-space shorthand property.\n

    \n
    \n

    Note:\nThe name of this property is a placeholder, pending the CSSWG finding a better name.\n

    ", + "doc": "The text-wrap-mode CSS property controls whether the text inside an element is wrapped. The different values provide alternate ways of wrapping the content of a block element. It can also be set, and reset, using the text-wrap shorthand or the white-space shorthand.\n
    \n

    Note:\nThe white-space-collapse and text-wrap-mode properties can be declared together using the white-space shorthand property.\n

    \n
    \n

    Note:\nThe name of this property is a placeholder, pending the CSSWG finding a better name.\n

    ", "formalSyntax": "wrap | nowrap", "values": { "wrap": "Text is wrapped across lines at appropriate characters (for example spaces, in languages like English that use space separators) to minimize overflow. This is the default value.", @@ -19481,7 +19729,7 @@ } }, "text-wrap-style": { - "url": "$MDN_URL$/web/css/text-wrap-style", + "url": "$MDN_URL$/web/css/reference/properties/text-wrap-style", "status": [ "StandardTrack" ], @@ -19499,17 +19747,17 @@ "level": "LOW", "lowDate": "2024-10-17" }, - "doc": "The text-wrap-style CSS property controls how text inside an element is wrapped. The different values provide alternate ways of wrapping the content of a block element. It can also be set, and reset, using the text-wrap shorthand.", + "doc": "The text-wrap-style CSS property controls how text inside an element is wrapped. The different values provide alternate ways of wrapping the content of a block element. It can also be set, and reset, using the text-wrap shorthand.", "formalSyntax": "auto | balance | stable | pretty | avoid-orphans", "values": { "auto": "Text is wrapped in the most performant way for the browser and does not take into account the number of characters.", "balance": "Text is wrapped in a way that best balances the number of characters on each line, enhancing layout quality and legibility. Because counting characters and balancing them across multiple lines is computationally expensive, this value is only supported for blocks of text spanning a limited number of lines (six or less for Chromium and ten or less for Firefox).", - "pretty": "Text is wrapped using a slower algorithm that favors better layout over speed. This is intended for body copy where good typography is favored over performance (for example, when the number of orphans should be kept to a minimum).", + "pretty": "Text is wrapped using a slower algorithm that favors better layout over speed. This is intended for body copy where good typography is favored over performance (for example, when the number of orphans should be kept to a minimum).", "stable": "Text is wrapped such that when the user is editing the content, the lines that come before the lines they are editing remain static rather than the whole block of text re-wrapping." } }, "timeline-scope": { - "url": "$MDN_URL$/web/css/timeline-scope", + "url": "$MDN_URL$/web/css/reference/properties/timeline-scope", "status": [ "StandardTrack" ], @@ -19524,15 +19772,16 @@ "baseline": { "level": "NONE" }, - "doc": "The timeline-scope CSS property modifies the scope of a named animation timeline.\n

    By default, a named timeline (i.e., declared using scroll-timeline-name or view-timeline-name) can only be set as the controlling timeline of a direct descendant element (i.e., by setting animation-timeline on it with the timeline name as its value). This is the timeline's default \"scope\".\n

    timeline-scope is given the name of a timeline defined on a descendant element; this causes the scope of the timeline to be increased to the element that timeline-scope is set on and any of its descendants. In other words, that element and any of its descendant elements can now be controlled using that timeline.\n

    \n

    Note:\nIf no timeline (or more than one timeline) exists with the name given for the timeline-scope value, an inactive timeline with the specified name is created.\n

    ", + "doc": "The timeline-scope CSS property modifies the scope of a named animation timeline.", "formalSyntax": "none | all | <dashed-ident>#", "values": { - "none": "There is no change in timeline scope.", - "<dashed-ident>": "Specifies the name of an existing named timeline (i.e., declared using scroll-timeline-name or view-timeline-name) defined on a descendant element. This causes the timeline scope to be increased to the element that timeline-scope is set on and any of its descendants.\n
    \n

    Note:\n<dashed-ident> values must start with --, which helps to avoid name clashes with standard CSS keywords.\n

    " + "none": "There is no change in timeline scope. This is the default.", + "all": "The names of all timelines defined by descendants are in scope for this element and its descendants.", + "<dashed-ident>": "Specifies the name of an existing named timeline (i.e., declared using scroll-timeline-name or view-timeline-name) defined on a descendant element. This increases the timeline scope to the current element and to any of its descendants." } }, "top": { - "url": "$MDN_URL$/web/css/top", + "url": "$MDN_URL$/web/css/reference/properties/top", "status": [ "StandardTrack" ], @@ -19551,16 +19800,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The top CSS property sets the vertical position of a positioned element. This inset property has no effect on non-positioned elements.", + "doc": "The top CSS property sets the vertical position of a positioned element. This inset property has no effect on non-positioned elements.", "formalSyntax": "auto | <length-percentage> | <anchor()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <anchor()> = anchor( <anchor-name>? &&<anchor-side> , <length-percentage>? )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <anchor-name> = <dashed-ident>\n  <anchor-side> = inside | outside | top | left | right | bottom | start | end | self-start | self-end | <percentage> | center\n  <anchor-size> = width | height | block | inline | self-block | self-inline", "values": { - "<length>": "A negative, null, or positive <length>:\n", - "<percentage>": "A <percentage> of the containing block's height.", - "auto": "Specifies that:\n" + "<length>": "A negative, null, or positive <length>:\n", + "<percentage>": "A <percentage> of the containing block's height.", + "auto": "Specifies that:\n" } }, "touch-action": { - "url": "$MDN_URL$/web/css/touch-action", + "url": "$MDN_URL$/web/css/reference/properties/touch-action", "status": [ "StandardTrack" ], @@ -19592,7 +19841,7 @@ } }, "transform": { - "url": "$MDN_URL$/web/css/transform", + "url": "$MDN_URL$/web/css/reference/properties/transform", "status": [ "StandardTrack" ], @@ -19611,15 +19860,15 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transform CSS property lets you rotate, scale, skew, or translate an element.\nIt modifies the coordinate space of the CSS visual formatting model.\n

    If the property has a value different from none, a stacking context will be created.\nIn that case, the element will act as a containing block for any position: fixed; or position: absolute; elements that it contains.\n

    You can also use the individual transform properties: translate, rotate, and scale. These properties are applied in the order: translate, rotate, scale, and finally transform.\n

    \n

    Warning:\nOnly transformable elements can be transformed.\nThat is, all elements whose layout is governed by the CSS box model except for: non-replaced inline boxes, table-column boxes, and table-column-group boxes.\n

    ", - "formalSyntax": "none | <transform-list>\n  <transform-list> = <transform-function>+", + "doc": "The transform CSS property lets you rotate, scale, skew, or translate an element.\nIt modifies the coordinate space of the CSS visual formatting model.\n

    If the property has a value different from none, a stacking context will be created.\nIn that case, the element will act as a containing block for any position: fixed; or position: absolute; elements that it contains.\n

    You can also use the individual transform properties: translate, rotate, and scale. These properties are applied in the order: translate, rotate, scale, and finally transform.\n

    \n

    Warning:\nOnly transformable elements can be transformed.\nThat is, all elements whose layout is governed by the CSS box model except for: non-replaced inline boxes, table-column boxes, and table-column-group boxes.\n

    ", + "formalSyntax": "none | <transform-list>\n  <transform-list> = <transform-function>+\n  <transform-function> = <scale3d()> | <scale()> | <scaleX()> | <scaleY()> | <scaleZ()> | <translate3d()> | <translate()> | <translateX()> | <translateY()> | <translateZ()> | <rotate3d()> | <rotate()> | <rotateX()> | <rotateY()> | <rotateZ()> | <skew()> | <skewX()> | <skewY()> | <matrix3d()> | <matrix()> | <perspective()>\n  <scale3d()> = scale3d( [ <number> | <percentage> ]#{3} )\n  <scale()> = scale( [ <number> | <percentage> ]#{1,2} )\n  <scaleX()> = scaleX( [ <number> | <percentage> ] )\n  <scaleY()> = scaleY( [ <number> | <percentage> ] )\n  <scaleZ()> = scaleZ( [ <number> | <percentage> ] )\n  <translate3d()> = translate3d( <length-percentage> , <length-percentage> , <length> )\n  <translate()> = translate( <length-percentage> , <length-percentage>? )\n  <translateX()> = translateX( <length-percentage> )\n  <translateY()> = translateY( <length-percentage> )\n  <translateZ()> = translateZ( <length> )\n  <rotate3d()> = rotate3d( <number> , <number> , <number> , [ <angle> | <zero> ] )\n  <rotate()> = rotate( [ <angle> | <zero> ] )\n  <rotateX()> = rotateX( [ <angle> | <zero> ] )\n  <rotateY()> = rotateY( [ <angle> | <zero> ] )\n  <rotateZ()> = rotateZ( [ <angle> | <zero> ] )\n  <skew()> = skew( [ <angle> | <zero> ] , [ <angle> | <zero> ]? )\n  <skewX()> = skewX( [ <angle> | <zero> ] )\n  <skewY()> = skewY( [ <angle> | <zero> ] )\n  <matrix3d()> = matrix3d( <number>#{16} )\n  <matrix()> = matrix( <number>#{6} )\n  <perspective()> = perspective( [ <length [0,∞]> | none ] )\n  <length-percentage> = <length> | <percentage>", "values": { - "<transform-function>": "One or more of the CSS transform functions to be applied.\nThe transform functions are multiplied in order from left to right, meaning that composite transforms are effectively applied in order from right to left.", + "<transform-function>": "One or more of the CSS transform functions to be applied.\nThe transform functions are multiplied in order from left to right, meaning that composite transforms are effectively applied in order from right to left.", "none": "Specifies that no transform should be applied." } }, "transform-box": { - "url": "$MDN_URL$/web/css/transform-box", + "url": "$MDN_URL$/web/css/reference/properties/transform-box", "status": [ "StandardTrack" ], @@ -19638,7 +19887,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The transform-box CSS property defines the layout box to which the transform, individual transform properties translate, scale, and rotate, and transform-origin properties relate.", + "doc": "The transform-box CSS property defines the layout box to which the transform, individual transform properties translate, scale, and rotate, and transform-origin properties relate.", "formalSyntax": "content-box | border-box | fill-box | stroke-box | view-box", "values": { "content-box": "The content box is used as the reference box. The reference box of a <table> is the border box of its table wrapper box, not its table box.", @@ -19649,7 +19898,7 @@ } }, "transform-origin": { - "url": "$MDN_URL$/web/css/transform-origin", + "url": "$MDN_URL$/web/css/reference/properties/transform-origin", "status": [ "StandardTrack" ], @@ -19671,12 +19920,12 @@ "doc": "The transform-origin CSS property sets the origin for an element's transformations.", "formalSyntax": "[ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] <length>? | [ [ center | left | right ] && [ center | top | bottom ] ] <length>?\n  <length-percentage> = <length> | <percentage>", "values": { - "x-offset": "Is a <length> or a <percentage> describing how far from the left edge of the box the origin of the transform is set.", + "x-offset": "Is a <length> or a <percentage> describing how far from the left edge of the box the origin of the transform is set.", "offset-keyword": "Is one of the left, right, top, bottom, or center keyword describing the corresponding offset.", - "y-offset": "Is a <length> or a <percentage> describing how far from the top edge of the box the origin of the transform is set.", + "y-offset": "Is a <length> or a <percentage> describing how far from the top edge of the box the origin of the transform is set.", "x-offset-keyword": "Is one of the left, right, or center keyword describing how far from the left edge of the box the origin of the transform is set.", "y-offset-keyword": "Is one of the top, bottom, or center keyword describing how far from the top edge of the box the origin of the transform is set.", - "z-offset": "Is a <length> (and never a <percentage> which would make the statement invalid) describing how far from the user eye the z=0 origin is set.", + "z-offset": "Is a <length> (and never a <percentage> which would make the statement invalid) describing how far from the user eye the z=0 origin is set.", "left": "0%", "center": "50%", "right": "100%", @@ -19685,7 +19934,7 @@ } }, "transform-style": { - "url": "$MDN_URL$/web/css/transform-style", + "url": "$MDN_URL$/web/css/reference/properties/transform-style", "status": [ "StandardTrack" ], @@ -19712,7 +19961,7 @@ } }, "transition": { - "url": "$MDN_URL$/web/css/transition", + "url": "$MDN_URL$/web/css/reference/properties/transition", "status": [ "StandardTrack" ], @@ -19731,11 +19980,11 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transition CSS property is a shorthand property for transition-property, transition-duration, transition-timing-function, transition-delay, and transition-behavior.", - "formalSyntax": "<single-transition>#\n  <single-transition> = [ none | <single-transition-property> ] || <time> || <easing-function> || <time>\n  <single-transition-property> = all | <custom-ident>\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end" + "doc": "The transition CSS property is a shorthand property for transition-property, transition-duration, transition-timing-function, transition-delay, and transition-behavior.", + "formalSyntax": "<single-transition>#\n  <single-transition> = [ none | <single-transition-property> ] || <time> || <easing-function> || <time>\n  <single-transition-property> = all | <custom-ident>\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end" }, "transition-behavior": { - "url": "$MDN_URL$/web/css/transition-behavior", + "url": "$MDN_URL$/web/css/reference/properties/transition-behavior", "status": [ "StandardTrack" ], @@ -19753,7 +20002,7 @@ "level": "LOW", "lowDate": "2024-08-06" }, - "doc": "The transition-behavior CSS property specifies whether transitions will be started for properties whose animation behavior is discrete.", + "doc": "The transition-behavior CSS property specifies whether transitions will be started for properties whose animation behavior is discrete.", "formalSyntax": "<transition-behavior-value>#\n  <transition-behavior-value> = normal | allow-discrete", "values": { "allow-discrete": "Transitions will be started on the element for discrete animated properties.", @@ -19761,7 +20010,7 @@ } }, "transition-delay": { - "url": "$MDN_URL$/web/css/transition-delay", + "url": "$MDN_URL$/web/css/reference/properties/transition-delay", "status": [ "StandardTrack" ], @@ -19780,14 +20029,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transition-delay CSS property specifies the duration to wait before starting a property's transition effect when its value changes.", + "doc": "The transition-delay CSS property specifies the duration to wait before starting a property's transition effect when its value changes.", "formalSyntax": "<time>#", "values": { "<time>": "Denotes the amount of time to wait between a property's value changing and the start of the transition effect." } }, "transition-duration": { - "url": "$MDN_URL$/web/css/transition-duration", + "url": "$MDN_URL$/web/css/reference/properties/transition-duration", "status": [ "StandardTrack" ], @@ -19809,11 +20058,11 @@ "doc": "The transition-duration CSS property sets the length of time a transition animation should take to complete. By default, the value is 0s, meaning that no animation will occur.", "formalSyntax": "<time [0s,∞]>#", "values": { - "<time>": "Is a <time> denoting the amount of time the transition from the old value of a property to the new value should take. A time of 0s indicates that no transition will happen, that is the switch between the two states will be instantaneous. A negative value for the time renders the declaration invalid." + "<time>": "Is a <time> denoting the amount of time the transition from the old value of a property to the new value should take. A time of 0s indicates that no transition will happen, that is the switch between the two states will be instantaneous. A negative value for the time renders the declaration invalid." } }, "transition-property": { - "url": "$MDN_URL$/web/css/transition-property", + "url": "$MDN_URL$/web/css/reference/properties/transition-property", "status": [ "StandardTrack" ], @@ -19832,7 +20081,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transition-property CSS property sets the CSS properties to which a transition effect should be applied.", + "doc": "The transition-property CSS property sets the CSS properties to which a transition effect should be applied.", "formalSyntax": "none | <single-transition-property>#\n  <single-transition-property> = all | <custom-ident>", "values": { "none": "No properties will transition.", @@ -19841,7 +20090,7 @@ } }, "transition-timing-function": { - "url": "$MDN_URL$/web/css/transition-timing-function", + "url": "$MDN_URL$/web/css/reference/properties/transition-timing-function", "status": [ "StandardTrack" ], @@ -19860,14 +20109,14 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect.", - "formalSyntax": "<easing-function>#\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", + "doc": "The transition-timing-function CSS property sets how intermediate values are calculated for CSS properties being affected by a transition effect.", + "formalSyntax": "<easing-function>#\n  <easing-function> = <linear-easing-function> | <cubic-bezier-easing-function> | <step-easing-function>\n  <linear-easing-function> = linear | <linear()>\n  <cubic-bezier-easing-function> = ease | ease-in | ease-out | ease-in-out | <cubic-bezier()>\n  <step-easing-function> = step-start | step-end | <steps()>\n  <linear()> = linear( [ <number> && <percentage>{0,2} ]# )\n  <cubic-bezier()> = cubic-bezier( [ <number [0,1]> , <number> ]#{2} )\n  <steps()> = steps( <integer> , <step-position>? )\n  <integer> = <number-token>\n  <step-position> = jump-start | jump-end | jump-none | jump-both | start | end", "values": { - "<easing-function>": "Each <easing-function> represents the easing function to link to the corresponding property to transition, as defined in transition-property.\n

    The non-step keyword values (ease, linear, ease-in-out, etc.) each represent cubic Bézier curve with fixed four point values, with the cubic-bezier() function value allowing for a non-predefined value. The step easing functions divide the input time into a specified number of intervals that are equal in length. It is defined by a number of steps and a step position.\n

    \n
    ease
    \n
    \n

    Equal to cubic-bezier(0.25, 0.1, 0.25, 1.0), the default value, increases in velocity towards the middle of the transition, slowing back down at the end.\n

    \n
    linear
    \n
    \n

    Equal to cubic-bezier(0.0, 0.0, 1.0, 1.0), transitions at an even speed.\n

    \n
    ease-in
    \n
    \n

    Equal to cubic-bezier(0.42, 0, 1.0, 1.0), starts off slowly, with the transition speed increasing until complete.\n

    \n
    ease-out
    \n
    \n

    Equal to cubic-bezier(0, 0, 0.58, 1.0), starts transitioning quickly, slowing down as the transition continues.\n

    \n
    ease-in-out
    \n
    \n

    Equal to cubic-bezier(0.42, 0, 0.58, 1.0), starts transitioning slowly, speeds up, and then slows down again.\n

    \n
    cubic-bezier(p1, p2, p3, p4)
    \n
    \n

    An author-defined cubic-Bezier curve, where the p1 and p3 values must be in the range of 0 to 1.\n

    \n
    steps(n, <jump-term>)
    \n
    \n

    Displays the transition along n stops along the transition, displaying each stop for equal lengths of time. For example, if n is 5, there are 5 steps. Whether the transition holds temporarily at 0%, 20%, 40%, 60% and 80%, on the 20%, 40%, 60%, 80% and 100%, or makes 5 stops between the 0% and 100% along the transition, or makes 5 stops including the 0% and 100% marks (on the 0%, 25%, 50%, 75%, and 100%) depends on which of the following jump terms is used:\n

    \n
    jump-start
    \n
    \n

    Denotes a left-continuous function, so that the first jump happens when the transition begins;\n

    \n
    jump-end
    \n
    \n

    Denotes a right-continuous function, so that the last jump happens when the animation ends;\n

    \n
    jump-none
    \n
    \n

    There is no jump on either end. Instead, holding at both the 0% mark and the 100% mark, each for 1/n of the duration\n

    \n
    jump-both
    \n
    \n

    Includes pauses at both the 0% and 100% marks, effectively adding a step during the transition time.\n

    \n
    start
    \n
    \n

    Same as jump-start.\n

    \n
    end
    \n
    \n

    Same as jump-end.\n

    \n
    \n
    \n
    step-start
    \n
    \n

    Equal to steps(1, jump-start)\n

    \n
    step-end
    \n
    \n

    Equal to steps(1, jump-end)\n

    \n
    " + "<easing-function>": "Each <easing-function> represents the easing function to link to the corresponding property to transition, as defined in transition-property.\n

    The non-step keyword values (ease, linear, ease-in-out, etc.) each represent cubic Bézier curve with fixed four point values, with the cubic-bezier() function value allowing for a non-predefined value. The step easing functions divide the input time into a specified number of intervals that are equal in length. It is defined by a number of steps and a step position.\n

    \n
    ease
    \n
    \n

    Equal to cubic-bezier(0.25, 0.1, 0.25, 1.0), the default value, increases in velocity towards the middle of the transition, slowing back down at the end.\n

    \n
    linear
    \n
    \n

    Equal to cubic-bezier(0.0, 0.0, 1.0, 1.0), transitions at an even speed.\n

    \n
    ease-in
    \n
    \n

    Equal to cubic-bezier(0.42, 0, 1.0, 1.0), starts off slowly, with the transition speed increasing until complete.\n

    \n
    ease-out
    \n
    \n

    Equal to cubic-bezier(0, 0, 0.58, 1.0), starts transitioning quickly, slowing down as the transition continues.\n

    \n
    ease-in-out
    \n
    \n

    Equal to cubic-bezier(0.42, 0, 0.58, 1.0), starts transitioning slowly, speeds up, and then slows down again.\n

    \n
    cubic-bezier(p1, p2, p3, p4)
    \n
    \n

    An author-defined cubic-Bezier curve, where the p1 and p3 values must be in the range of 0 to 1.\n

    \n
    steps(n, <jump-term>)
    \n
    \n

    Displays the transition along n stops along the transition, displaying each stop for equal lengths of time. For example, if n is 5, there are 5 steps. Whether the transition holds temporarily at 0%, 20%, 40%, 60% and 80%, on the 20%, 40%, 60%, 80% and 100%, or makes 5 stops between the 0% and 100% along the transition, or makes 5 stops including the 0% and 100% marks (on the 0%, 25%, 50%, 75%, and 100%) depends on which of the following jump terms is used:\n

    \n
    jump-start
    \n
    \n

    Denotes a left-continuous function, so that the first jump happens when the transition begins;\n

    \n
    jump-end
    \n
    \n

    Denotes a right-continuous function, so that the last jump happens when the animation ends;\n

    \n
    jump-none
    \n
    \n

    There is no jump on either end. Instead, holding at both the 0% mark and the 100% mark, each for 1/n of the duration\n

    \n
    jump-both
    \n
    \n

    Includes pauses at both the 0% and 100% marks, effectively adding a step during the transition time.\n

    \n
    start
    \n
    \n

    Same as jump-start.\n

    \n
    end
    \n
    \n

    Same as jump-end.\n

    \n
    \n
    \n
    step-start
    \n
    \n

    Equal to steps(1, jump-start)\n

    \n
    step-end
    \n
    \n

    Equal to steps(1, jump-end)\n

    \n
    " } }, "translate": { - "url": "$MDN_URL$/web/css/translate", + "url": "$MDN_URL$/web/css/reference/properties/translate", "status": [ "StandardTrack" ], @@ -19886,21 +20135,17 @@ "lowDate": "2022-08-05", "highDate": "2025-02-05" }, - "doc": "The translate CSS property allows you to specify translation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.", + "doc": "The translate CSS property allows you to specify translation transforms individually and independently of the transform property. This maps better to typical user interface usage, and saves having to remember the exact order of transform functions to specify in the transform value.", "formalSyntax": "none | <length-percentage> [ <length-percentage> <length>? ]?\n  <length-percentage> = <length> | <percentage>", "values": { - "Single <length-percentage> value": "A <length> or <percentage> that specifies a translation along the X-axis. Equivalent to a translate() (2D translation) function with a single value specified.", - "Two <length-percentage> values": "Two <length> or <percentage> that specify the X and Y axis translation values (respectively) of a 2D translation. Equivalent to a translate() (2D translation) function with two values specified.", - "Three values": "Two <length-percentage> and single <length> values that specify the X, Y, and Z axis translation values (respectively) of a 3D translation. Equivalent to a translate3d() (3D translation) function.", + "Single <length-percentage> value": "A <length> or <percentage> that specifies a translation along the X-axis. Equivalent to a translate() (2D translation) function with a single value specified.", + "Two <length-percentage> values": "Two <length> or <percentage> that specify the X and Y axis translation values (respectively) of a 2D translation. Equivalent to a translate() (2D translation) function with two values specified.", + "Three values": "Two <length-percentage> and single <length> values that specify the X, Y, and Z axis translation values (respectively) of a 3D translation. Equivalent to a translate3d() (3D translation) function.", "none": "Specifies that no translation should be applied." } }, - "tutorials": { - "url": "$MDN_URL$/web/css/tutorials", - "doc": "Learning CSS may be a daunting task.\nIn order to help you, we have written numerous tutorials about CSS.\nSome are aimed at complete beginners, while others present complex features to be used by more experienced users.\n

    This page lists them all, with a short description.\nThey are grouped by complexity so that you can choose the most appropriate for your level." - }, "type_selectors": { - "url": "$MDN_URL$/web/css/type_selectors", + "url": "$MDN_URL$/web/css/reference/selectors/type_selectors", "status": [ "StandardTrack" ], @@ -19919,10 +20164,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSS type selector matches elements by node name. In other words, it selects all elements of the given type within a document.\n

    \n```css\n/* All  elements. */\na {\n  color: red;\n}\n```\n
    \n

    Type selectors can be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML that mixes multiple vocabularies.\n

    " + "doc": "The CSS type selector matches elements by node name. In other words, it selects all elements of the given type within a document.\n
    \n```css\n/* All  elements. */\na {\n  color: red;\n}\n```\n
    \n

    Type selectors can be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML that mixes multiple vocabularies.\n

    " }, "unicode-bidi": { - "url": "$MDN_URL$/web/css/unicode-bidi", + "url": "$MDN_URL$/web/css/reference/properties/unicode-bidi", "status": [ "StandardTrack" ], @@ -19941,19 +20186,19 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The unicode-bidi CSS property, together with the direction property, determines how bidirectional text in a document is handled. For example, if a block of content contains both left-to-right and right-to-left text, the user-agent uses a complex Unicode algorithm to decide how to display the text. The unicode-bidi property overrides this algorithm and allows the developer to control the text embedding.", + "doc": "The unicode-bidi CSS property, together with the direction property, determines how bidirectional text in a document is handled. For example, if a block of content contains both left-to-right and right-to-left text, the user-agent uses a complex Unicode algorithm to decide how to display the text. The unicode-bidi property overrides this algorithm and allows the developer to control the text embedding.", "formalSyntax": "normal | embed | isolate | bidi-override | isolate-override | plaintext", "values": { "normal": "The element does not offer an additional level of embedding with respect to the bidirectional algorithm. For inline elements, implicit reordering works across element boundaries.", - "embed": "If the element is inline, this value opens an additional level of embedding with respect to the bidirectional algorithm. The direction of this embedding level is given by the direction property.", - "bidi-override": "For inline elements this creates an override. For block container elements this creates an override for inline-level descendants not within another block container element. This means that inside the element, reordering is strictly in sequence according to the direction property; the implicit part of the bidirectional algorithm is ignored.", + "embed": "If the element is inline, this value opens an additional level of embedding with respect to the bidirectional algorithm. The direction of this embedding level is given by the direction property.", + "bidi-override": "For inline elements this creates an override. For block container elements this creates an override for inline-level descendants not within another block container element. This means that inside the element, reordering is strictly in sequence according to the direction property; the implicit part of the bidirectional algorithm is ignored.", "isolate": "This keyword indicates that the element's container directionality should be calculated without considering the content of this element. The element is therefore isolated from its siblings. When applying its bidirectional-resolution algorithm, its container element treats it as one or several U+FFFC Object Replacement Character, i.e., like an image.", "isolate-override": "This keyword applies the isolation behavior of the isolate keyword to the surrounding content and the override behavior of the bidi-override keyword to the inner content.", - "plaintext": "This keyword makes the elements directionality calculated without considering its parent bidirectional state or the value of the direction property. The directionality is calculated using the P2 and P3 rules of the Unicode Bidirectional Algorithm.\nThis value allows the display of data that is already formatted using a tool following the Unicode Bidirectional Algorithm." + "plaintext": "This keyword makes the elements directionality calculated without considering its parent bidirectional state or the value of the direction property. The directionality is calculated using the P2 and P3 rules of the Unicode Bidirectional Algorithm.\nThis value allows the display of data that is already formatted using a tool following the Unicode Bidirectional Algorithm." } }, "universal_selectors": { - "url": "$MDN_URL$/web/css/universal_selectors", + "url": "$MDN_URL$/web/css/reference/selectors/universal_selectors", "status": [ "StandardTrack" ], @@ -19972,10 +20217,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSS universal selector (*) matches elements of any type.\n
    \n```css\n/* Selects all elements */\n* {\n  color: green;\n}\n```\n
    \n

    The universal selector is a special type selector and can therefore be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML that mixes multiple vocabularies.\n

    " + "doc": "The CSS universal selector (*) matches elements of any type.\n
    \n```css\n/* Selects all elements */\n* {\n  color: green;\n}\n```\n
    \n

    The universal selector is a special type selector and can therefore be namespaced when using @namespace. This is useful when dealing with documents containing multiple namespaces such as HTML with inline SVG or MathML, or XML that mixes multiple vocabularies.\n

    \n
    \n

    Note:\nThe universal selector (*) matches elements only.\nIt does not directly match pseudo-elements by itself.\n

    To match all ::before pseudo-elements on a page, for example, you would have to use a selector like *::before. This works because the * matches all elements, and the ::before pseudo-element is available on all elements.\n

    " }, "user-modify": { - "url": "$MDN_URL$/web/css/user-modify", + "url": "$MDN_URL$/web/css/reference/properties/user-modify", "status": [ "Deprecated" ], @@ -19990,7 +20235,7 @@ } }, "user-select": { - "url": "$MDN_URL$/web/css/user-select", + "url": "$MDN_URL$/web/css/reference/properties/user-select", "status": [ "StandardTrack" ], @@ -20015,7 +20260,7 @@ } }, "vector-effect": { - "url": "$MDN_URL$/web/css/vector-effect", + "url": "$MDN_URL$/web/css/reference/properties/vector-effect", "status": [ "StandardTrack" ], @@ -20042,7 +20287,7 @@ } }, "vertical-align": { - "url": "$MDN_URL$/web/css/vertical-align", + "url": "$MDN_URL$/web/css/reference/properties/vertical-align", "status": [ "StandardTrack" ], @@ -20065,7 +20310,7 @@ "formalSyntax": "[ first | last ] || <'alignment-baseline'> || <'baseline-shift'>\n  <alignment-baseline> = baseline | text-bottom | alphabetic | ideographic | middle | central | mathematical | text-top\n  <baseline-shift> = <length-percentage> | sub | super | top | center | bottom\n  <length-percentage> = <length> | <percentage>" }, "view-timeline": { - "url": "$MDN_URL$/web/css/view-timeline", + "url": "$MDN_URL$/web/css/reference/properties/view-timeline", "status": [ "StandardTrack" ], @@ -20080,16 +20325,16 @@ "baseline": { "level": "NONE" }, - "doc": "The view-timeline CSS shorthand property is used to define a named view progress timeline, which is progressed through based on the change in visibility of an element (known as the subject) inside a scrollable element (scroller). view-timeline is set on the subject.\n

    The visibility of the subject inside the scroller is tracked — by default, the timeline is at 0% when the subject is first visible at one edge of the scroller and 100% when it reaches the opposite edge.\n

    view-timeline can contain two constituent values — a name for the named view progress timeline and an optional scroll axis value.\nThe name is then referenced in an animation-timeline declaration to indicate the element that will be animated as the timeline progresses. This can be the subject element, but it doesn't have to be — you can animate a different element as the subject moves through the scrolling area.\n

    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    ", + "doc": "The view-timeline CSS shorthand property defines a named view progress timeline's name, direction, and inset values.", "formalSyntax": "[ <'view-timeline-name'> [ <'view-timeline-axis'> || <'view-timeline-inset'> ]? ]#\n  <view-timeline-name> = [ none | <dashed-ident> ]#\n  <view-timeline-axis> = [ block | inline | x | y ]#\n  <view-timeline-inset> = [ [ auto | <length-percentage> ]{1,2} ]#\n  <length-percentage> = <length> | <percentage>", "values": { - "<view-timeline-name>": "See view-timeline-name. The default value is none.", - "<view-timeline-inset>": "See view-timeline-inset. The default value is auto.", - "<view-timeline-axis>": "See view-timeline-axis. The default value is block." + "<view-timeline-name>": "See view-timeline-name. The default value is none.", + "<view-timeline-inset>": "See view-timeline-inset. The default value is auto.", + "<view-timeline-axis>": "See view-timeline-axis. The default value is block." } }, "view-timeline-axis": { - "url": "$MDN_URL$/web/css/view-timeline-axis", + "url": "$MDN_URL$/web/css/reference/properties/view-timeline-axis", "status": [ "StandardTrack" ], @@ -20104,17 +20349,14 @@ "baseline": { "level": "NONE" }, - "doc": "The view-timeline-axis CSS property is used to specify the scrollbar direction that will be used to provide the timeline for a named view progress timeline animation, which is progressed through based on the change in visibility of an element (known as the subject) inside a scrollable element (scroller). view-timeline-axis is set on the subject. See CSS scroll-driven animations for more details.\n
    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    \n

    The view-timeline-axis, view-timeline-inset and view-timeline-name properties can also be set using the view-timeline shorthand property.", + "doc": "The view-timeline-axis CSS property specifies the scroll direction to be used for a named view progress timeline.", "formalSyntax": "[ block | inline | x | y ]#", "values": { - "block": "The scrollbar on the block axis of the scroller element, which is the axis in the direction perpendicular to the flow of text within a line. For horizontal writing modes, such as standard English, this is the same as y, while for vertical writing modes, it is the same as x. This is the default value.", - "inline": "The scrollbar on the inline axis of the scroller element, which is the axis in the direction parallel to the flow of text in a line. For horizontal writing modes, this is the same as x, while for vertical writing modes, this is the same as y.", - "y": "The scrollbar on the vertical axis of the scroller element.", - "x": "The scrollbar on the horizontal axis of the scroller element." + "<axis>": "Specifies the scroll direction used by the view progress timeline. The value can be one of the axis keywords: block, inline, x, or y. The default value is block." } }, "view-timeline-inset": { - "url": "$MDN_URL$/web/css/view-timeline-inset", + "url": "$MDN_URL$/web/css/reference/properties/view-timeline-inset", "status": [ "StandardTrack" ], @@ -20129,15 +20371,15 @@ "baseline": { "level": "NONE" }, - "doc": "The view-timeline-inset CSS property is used to specify one or two values representing an adjustment to the position of the scrollport (see Scroll container for more details) in which the subject element of a named view progress timeline animation is deemed to be visible. Put another way, this allows you to specify start and/or end inset (or outset) values that offset the position of the timeline.\n

    This can be combined with or used instead of animation-range and its longhand properties, which can be used to set the attachment range of an animation along its timeline.\nSee CSS scroll-driven animations for more details.\n

    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    \n

    The view-timeline-inset, view-timeline-axis, and view-timeline-name properties can also be set using the view-timeline shorthand property.", + "doc": "The view-timeline-inset CSS property is used to specify one or two values representing an adjustment to the position of the scrollport (see Scroll container for more details) in which the subject element of a named view progress timeline animation is deemed to be visible. Put another way, this allows you to specify start and/or end inset (or outset) values that offset the position of the timeline.\n

    This can be combined with or used instead of animation-range and its longhand properties, which can be used to set the attachment range of an animation along its timeline.\nSee CSS scroll-driven animations for more details.\n

    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    \n

    The view-timeline-inset, view-timeline-axis, and view-timeline-name properties can also be set using the view-timeline shorthand property.", "formalSyntax": "[ [ auto | <length-percentage> ]{1,2} ]#\n  <length-percentage> = <length> | <percentage>", "values": { - "auto": "If set, the corresponding scroll-padding (or equivalent longhand value) for that edge of the scrollport is used. If this is not set (or set to auto), the value will usually be 0, although some user agents may use heuristics to determine a different default value if appropriate.", + "auto": "If set, the corresponding scroll-padding (or equivalent longhand value) for that edge of the scrollport is used. If this is not set (or set to auto), the value will usually be 0, although some user agents may use heuristics to determine a different default value if appropriate.", "<length-percentage>": "Any valid <length-percentage> value is accepted as an inset/outset value.\n

    " } }, "view-timeline-name": { - "url": "$MDN_URL$/web/css/view-timeline-name", + "url": "$MDN_URL$/web/css/reference/properties/view-timeline-name", "status": [ "StandardTrack" ], @@ -20152,15 +20394,15 @@ "baseline": { "level": "NONE" }, - "doc": "The view-timeline-name CSS property is used to define the name of a named view progress timeline, which is progressed through based on the change in visibility of an element (known as the subject) inside a scrollable element (scroller). view-timeline is set on the subject.\n

    The visibility of the subject inside the scroller is tracked — by default, the timeline is at 0% when the subject is first visible at one edge of the scroller and 100% when it reaches the opposite edge.\nThe name is then referenced in an animation-timeline declaration to indicate the element that will be animated as the timeline progresses. This can be the subject element, but it doesn't have to be — you can animate a different element as the subject moves through the scrolling area.\n

    \n

    Note:\nIf the scroller element does not overflow its container in the axis dimension or if the overflow is hidden or clipped, no scroll progress timeline will be created.\n

    \n

    The view-timeline-name, view-timeline-axis and view-timeline-inset properties can also be set using the view-timeline shorthand property.", + "doc": "The view-timeline-name CSS property specifies the names of one or more named view progress timelines associated with the element.", "formalSyntax": "[ none | <dashed-ident> ]#", "values": { - "none": "The timeline has no name.", - "<dashed-ident>": "An arbitrary custom identifier defining a name for a view progress timeline, which can then be referenced in an animation-timeline property.\n

    \n

    Note:\n<dashed-ident> values must start with --, which helps avoid name clashes with standard CSS keywords.\n

    " + "none": "Indicates that the timeline has no name. This is the default value.", + "<dashed-ident>": "Specifies a comma-separated list of <dashed-ident> custom name identifiers. All <dashed-ident> values must start with --, which helps avoid name clashes with standard CSS keywords." } }, "view-transition-class": { - "url": "$MDN_URL$/web/css/view-transition-class", + "url": "$MDN_URL$/web/css/reference/properties/view-transition-class", "status": [ "StandardTrack" ], @@ -20178,7 +20420,7 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The view-transition-class CSS property provides the selected elements with an identifying class (a <custom-ident>), providing an additional method of styling the view transitions for those elements.", + "doc": "The view-transition-class CSS property provides the selected elements with an identifying class (a <custom-ident>), providing an additional method of styling the view transitions for those elements.", "formalSyntax": "none | <custom-ident>+", "values": { "<custom-ident>": "An identifying name that causes the selected element to participate in a separate view transition from the root view transition. The identifier must be unique. If two rendered elements have the same view-transition-name at the same time, ViewTransition.ready will reject and the transition will be skipped.", @@ -20186,7 +20428,7 @@ } }, "view-transition-name": { - "url": "$MDN_URL$/web/css/view-transition-name", + "url": "$MDN_URL$/web/css/reference/properties/view-transition-name", "status": [ "StandardTrack" ], @@ -20207,13 +20449,13 @@ "doc": "The view-transition-name CSS property specifies the view transition snapshot that selected elements will participate in. This enables you to animate those elements separately from the rest of the page, which uses the default cross-fade animation during a view transition. You can then define custom animation styles for these elements.", "formalSyntax": "none | <custom-ident>", "values": { - "<custom-ident>": "An identifying name that causes the selected element to participate in a separate snapshot from the root snapshot. The <custom-ident> cannot be auto, match-element, none, or a CSS-wide keyword value.", + "<custom-ident>": "An identifying name that causes the selected element to participate in a separate snapshot from the root snapshot. The <custom-ident> cannot be auto, match-element, none, or a CSS-wide keyword value.", "match-element": "The browser automatically assigns a unique name to the selected element. This name is used to snapshot the element separately from all other elements on the page. (This name is internal and cannot be read from the DOM.)", "none": "The selected element will not participate in a separate snapshot, unless it has a parent element with a view-transition-name set, in which case it will be snapshotted as part of that element." } }, "visibility": { - "url": "$MDN_URL$/web/css/visibility", + "url": "$MDN_URL$/web/css/reference/properties/visibility", "status": [ "StandardTrack" ], @@ -20237,11 +20479,11 @@ "values": { "visible": "The element box is visible.", "hidden": "The element box is invisible (not drawn), but still affects layout as normal. Descendants of the element will be visible if they have visibility set to visible. The element cannot receive focus (such as when navigating through tab indexes).", - "collapse": "The collapse keyword has different effects for different elements:\n" + "collapse": "The collapse keyword has different effects for different elements:\n" } }, "white-space": { - "url": "$MDN_URL$/web/css/white-space", + "url": "$MDN_URL$/web/css/reference/properties/white-space", "status": [ "StandardTrack" ], @@ -20263,14 +20505,14 @@ "doc": "The white-space CSS property sets how white space inside an element is handled.", "formalSyntax": "normal | pre | nowrap | pre-wrap | break-spaces | pre-line", "values": { - "normal": "Sequences of white space are collapsed. Newline characters in the source are handled the same as other white spaces. Lines are broken as necessary to fill line boxes. Equivalent to collapse wrap.", + "normal": "Sequences of white space are collapsed. Newline characters in the source are handled the same as other white spaces. Lines are broken as necessary to fill line boxes. Equivalent to collapse wrap.", "pre": "Sequences of white space are preserved. Lines are only broken at newline characters in the source and at <br> elements. Equivalent to preserve nowrap.", "pre-wrap": "Sequences of white space are preserved. Lines are broken at newline characters, at <br>, and as necessary to fill line boxes. Equivalent to preserve wrap.", - "pre-line": "Sequences of white space are collapsed. Lines are broken at newline characters, at <br>, and as necessary to fill line boxes. Equivalent to preserve-breaks wrap." + "pre-line": "Sequences of white space are collapsed. Lines are broken at newline characters, at <br>, and as necessary to fill line boxes. Equivalent to preserve-breaks wrap." } }, "white-space-collapse": { - "url": "$MDN_URL$/web/css/white-space-collapse", + "url": "$MDN_URL$/web/css/reference/properties/white-space-collapse", "status": [ "StandardTrack" ], @@ -20288,18 +20530,18 @@ "level": "LOW", "lowDate": "2024-03-19" }, - "doc": "The white-space-collapse CSS property controls how white space inside an element is collapsed.\n
    \n

    Note:\nThe white-space-collapse and text-wrap-mode properties can be declared together using the white-space shorthand property.\n

    ", + "doc": "The white-space-collapse CSS property controls how white space inside an element is collapsed.\n
    \n

    Note:\nThe white-space-collapse and text-wrap-mode properties can be declared together using the white-space shorthand property.\n

    ", "formalSyntax": "collapse | discard | preserve | preserve-breaks | preserve-spaces | break-spaces", "values": { - "collapse": "White space sequences are collapsed.", + "collapse": "White space sequences are collapsed.", "preserve": "White space sequences and segment break characters are preserved.", "preserve-breaks": "White space sequences are collapsed, while segment break characters are preserved.", "preserve-spaces": "White space sequences are preserved, while tabs and segment break characters are converted to spaces.", - "break-spaces": "The behavior is identical to preserve, except that:\n" + "break-spaces": "The behavior is identical to preserve, except that:\n" } }, "widows": { - "url": "$MDN_URL$/web/css/widows", + "url": "$MDN_URL$/web/css/reference/properties/widows", "status": [ "StandardTrack" ], @@ -20314,14 +20556,14 @@ "baseline": { "level": "NONE" }, - "doc": "The widows CSS property sets the minimum number of lines in a block container that must be shown at the top of a page, region, or column.\n

    In typography, a widow is the last line of a paragraph that appears alone at the top of a page. (The paragraph is continued from a prior page.)", - "formalSyntax": "<integer [1,∞]>", + "doc": "The widows CSS property sets the minimum number of lines in a block container that must be shown at the top of a page, region, or column.\n

    In typography, a widow is the last line of a paragraph that appears alone at the top of a page. (The paragraph is continued from a prior page.)", + "formalSyntax": "<integer [1,∞]>\n  <integer> = <number-token>", "values": { "<integer>": "The minimum number of lines that can stay by themselves at the top of a new fragment after a fragmentation break. The value must be positive." } }, "width": { - "url": "$MDN_URL$/web/css/width", + "url": "$MDN_URL$/web/css/reference/properties/width", "status": [ "StandardTrack" ], @@ -20340,21 +20582,21 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box, it sets the width of the border area.", + "doc": "The width CSS property sets an element's width. By default, it sets the width of the content area, but if box-sizing is set to border-box, it sets the width of the border area.", "formalSyntax": "auto | <length-percentage [0,∞]> | min-content | max-content | fit-content( <length-percentage [0,∞]> ) | <calc-size()> | <anchor-size()>\n  <length-percentage> = <length> | <percentage>\n  <calc-size()> = calc-size( <calc-size-basis> , <calc-sum> )\n  <anchor-size()> = anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )\n  <calc-size-basis> = <size-keyword> | <calc-size()> | any | <calc-sum>\n  <calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*\n  <anchor-name> = <dashed-ident>\n  <anchor-size> = width | height | block | inline | self-block | self-inline\n  <calc-product> = <calc-value> [ [ '*' | / ] <calc-value> ]*\n  <calc-value> = <number> | <dimension> | <percentage> | <calc-keyword> | ( <calc-sum> )\n  <calc-keyword> = e | pi | infinity | -infinity | NaN", "values": { "<length>": "Defines the width as a distance value.", - "<percentage>": "Defines the width as a percentage of the containing block's width.", + "<percentage>": "Defines the width as a percentage of the containing block's width.", "auto": "The browser will calculate and select a width for the specified element.", "max-content": "The intrinsic preferred width.", "min-content": "The intrinsic minimum width.", - "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", + "fit-content": "Use the available space, but not more than max-content, i.e., min(max-content, max(min-content, stretch)).", "fit-content(<length-percentage>)": "Uses the fit-content formula with the available space replaced by the specified argument, i.e., min(max-content, max(min-content, <length-percentage>)).", - "stretch": "Sets the width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing." + "stretch": "Sets the width of the element's margin box to the width of its containing block. It attempts to make the margin box fill the available space in the containing block, so in a way behaving similar to 100% but applying the resulting size to the margin box rather than the box determined by box-sizing." } }, "will-change": { - "url": "$MDN_URL$/web/css/will-change", + "url": "$MDN_URL$/web/css/reference/properties/will-change", "status": [ "StandardTrack" ], @@ -20373,7 +20615,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The will-change CSS property hints to browsers how an element is expected to change. Browsers may set up optimizations before an element is actually changed. These kinds of optimizations can increase the responsiveness of a page by doing potentially expensive work before they are actually required.\n

    \n

    Warning:\nwill-change is intended to be used as a last resort, in order to try to deal with existing performance problems. It should not be used to anticipate performance problems.\n

    \n

    Proper usage of this property can be a bit tricky:\n

    ", + "doc": "The will-change CSS property hints to browsers how an element is expected to change. Browsers may set up optimizations before an element is actually changed. These kinds of optimizations can increase the responsiveness of a page by doing potentially expensive work before they are actually required.\n
    \n

    Warning:\nwill-change is intended to be used as a last resort, in order to try to deal with existing performance problems. It should not be used to anticipate performance problems.\n

    \n

    Proper usage of this property can be a bit tricky:\n

    ", "formalSyntax": "auto | <animateable-feature>#\n  <animateable-feature> = scroll-position | contents | <custom-ident>", "values": { "auto": "This keyword expresses no particular intent; the user agent should apply whatever heuristics and optimizations it normally does.", @@ -20383,7 +20625,7 @@ } }, "word-break": { - "url": "$MDN_URL$/web/css/word-break", + "url": "$MDN_URL$/web/css/reference/properties/word-break", "status": [ "StandardTrack" ], @@ -20409,11 +20651,11 @@ "break-all": "To prevent overflow, word breaks should be inserted between any two characters (excluding Chinese/Japanese/Korean text).", "keep-all": "Word breaks should not be used for Chinese/Japanese/Korean (CJK) text. Non-CJK text behavior is the same as for normal.", "auto-phrase": "Has the same effect as word-break: normal except that language-specific analysis is performed to improve word breaks by not placing them in the middle of natural phrases.", - "break-word": "Has the same effect as overflow-wrap: anywhere combined with word-break: normal, regardless of the actual value of the overflow-wrap property." + "break-word": "Has the same effect as overflow-wrap: anywhere combined with word-break: normal, regardless of the actual value of the overflow-wrap property." } }, "word-spacing": { - "url": "$MDN_URL$/web/css/word-spacing", + "url": "$MDN_URL$/web/css/reference/properties/word-spacing", "status": [ "StandardTrack" ], @@ -20440,7 +20682,7 @@ } }, "writing-mode": { - "url": "$MDN_URL$/web/css/writing-mode", + "url": "$MDN_URL$/web/css/reference/properties/writing-mode", "status": [ "StandardTrack" ], @@ -20476,7 +20718,7 @@ } }, "x": { - "url": "$MDN_URL$/web/css/x", + "url": "$MDN_URL$/web/css/reference/properties/x", "status": [ "StandardTrack" ], @@ -20498,12 +20740,12 @@ "doc": "The x CSS property defines the x-axis coordinate of the top left corner of the SVG <rect> shape, <image> image, <foreignObject> viewport or nested <svg> viewport relative to the nearest <svg> ancestor's user coordinate system. If present, it overrides the element's x attribute.\n
    \n

    Note:\nThe x property only applies to <rect>, <image>, <foreignObject>, and <svg> elements nested in an <svg>. It has no effect on the outermost <svg> elements itself, and does not apply to other SVG elements nor to HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type.", + "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type.", "<percentage>": "Percentages refer to the width of the SVG viewBox, if declared, otherwise, the percentage refers to the width of the current SVG viewport." } }, "y": { - "url": "$MDN_URL$/web/css/y", + "url": "$MDN_URL$/web/css/reference/properties/y", "status": [ "StandardTrack" ], @@ -20525,12 +20767,12 @@ "doc": "The y CSS property defines the y-axis coordinate of the top left corner of the SVG <rect> shape, <image> image, <foreignObject> viewport and nested <svg> viewport relative to the nearest <svg> ancestor's user coordinate system. If present, it overrides the element's y attribute.\n
    \n

    Note:\nThe y property only applies to <rect>, <image>, <foreignObject>, and <svg> elements nested in an <svg>. It has no effect on outermost <svg> elements and does not apply to other SVG elements nor to HTML elements or pseudo-elements.\n

    ", "formalSyntax": "<length-percentage>\n  <length-percentage> = <length> | <percentage>", "values": { - "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type.", + "<length>": "As an absolute or relative length, it can be expressed in any unit allowed by the CSS <length> data type.", "<percentage>": "Percentages refer to the height of the SVG viewBox, if declared, otherwise, the percentage refers to the height of the current SVG viewport." } }, "z-index": { - "url": "$MDN_URL$/web/css/z-index", + "url": "$MDN_URL$/web/css/reference/properties/z-index", "status": [ "StandardTrack" ], @@ -20549,15 +20791,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The z-index CSS property sets the z-order of a positioned element and its descendants or flex and grid items. Overlapping elements with a larger z-index cover those with a smaller one.", - "formalSyntax": "auto | <integer> | inherit", + "doc": "The z-index CSS property sets the z-order of a positioned element and its descendants or flex and grid items. Overlapping elements with a larger z-index cover those with a smaller one.", + "formalSyntax": "auto | <integer> | inherit\n  <integer> = <number-token>", "values": { "auto": "The box does not establish a new local stacking context. The stack level of the generated box in the current stacking context is 0.", - "<integer>": "This <integer> is the stack level of the generated box in the current stacking context. The box also establishes a local stacking context. This means that the z-indexes of descendants are not compared to the z-indexes of elements outside this element." + "<integer>": "This <integer> is the stack level of the generated box in the current stacking context. The box also establishes a local stacking context. This means that the z-indexes of descendants are not compared to the z-indexes of elements outside this element." } }, "zoom": { - "url": "$MDN_URL$/web/css/zoom", + "url": "$MDN_URL$/web/css/reference/properties/zoom", "status": [ "StandardTrack" ], @@ -20575,31 +20817,31 @@ "level": "LOW", "lowDate": "2024-05-14" }, - "doc": "The zoom CSS property can be used to control the magnification level of an element.\ntransform: scale() can be used as an alternative to this property.\n

    The zoom CSS property scales the targeted element, which can affect the page layout.\nWhen scaling, the zoomed element scales from top and center when using the default writing-mode.\n

    In contrast, an element scaled using scale() will not cause layout recalculation or move other elements on the page.\nIf using scale() makes the contents larger than the containing element, then overflow comes into effect.\nAdditionally, elements adjusted using scale() transform from the center by default; this can be changed with the transform-origin CSS property.", + "doc": "The zoom CSS property can be used to control the magnification level of an element.\ntransform: scale() can be used as an alternative to this property.\n

    The zoom CSS property scales the targeted element, which can affect the page layout.\nWhen scaling, the zoomed element scales from top and center when using the default writing-mode.\n

    In contrast, an element scaled using scale() will not cause layout recalculation or move other elements on the page.\nIf using scale() makes the contents larger than the containing element, then overflow comes into effect.\nAdditionally, elements adjusted using scale() transform from the center by default; this can be changed with the transform-origin CSS property.", "formalSyntax": "<number [0,∞]> | <percentage [0,∞]>", "values": { "<percentage>": "Zoom factor. 100% is equivalent to normal. Values larger than 100% zoom in. Values smaller than 100% zoom out.", "<number>": "Zoom factor. Equivalent to the corresponding percentage (1.0 = 100% = normal). Values larger than 1.0 zoom in. Values smaller than 1.0 zoom out.", - "normal": "Render the element at its normal size; equal to zoom: 1. Use the global unset keyword value instead.", + "normal": "Render the element at its normal size; equal to zoom: 1. Use the global unset keyword value instead.", "reset": "Resets the value to zoom: 1 and prevents the element from being (de)magnified if the user applies non-pinch-based zooming (e.g., by pressing Ctrl - - or Ctrl + + keyboard shortcuts) to the document." } } }, "pseudoClasses": { "-moz-broken": { - "url": "$MDN_URL$/web/css/_colon_-moz-broken", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-broken", "status": [ "Deprecated" ], "compatibility": {}, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The :-moz-broken CSS pseudo-class is a Mozilla extension that matches elements representing broken image links.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The :-moz-broken CSS pseudo-class is a Mozilla extension that matches elements representing broken image links.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-drag-over": { - "url": "$MDN_URL$/web/css/_colon_-moz-drag-over", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-drag-over CSS pseudo-class is a Mozilla extension that matches an element when a dragover event is called on it." + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-drag-over", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-drag-over CSS pseudo-class is a Mozilla extension that matches an element when a dragover event is called on it." }, "-moz-first-node": { - "url": "$MDN_URL$/web/css/_colon_-moz-first-node", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-first-node", "status": [ "Experimental" ], @@ -20607,22 +20849,22 @@ "Firefox": "55", "FirefoxAndroid": "55" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The :-moz-first-node CSS pseudo-class is a Mozilla extension that represents any element that is the first child node of some other element. It differs from :first-child because it does not match a first-child element with (non-whitespace) text before it.\n

    \n

    Note:\nAny whitespace at the start of an element is ignored for the determination of :-moz-first-node.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The :-moz-first-node CSS pseudo-class is a Mozilla extension that represents any element that is the first child node of some other element. It differs from :first-child because it does not match a first-child element with (non-whitespace) text before it.\n

    \n

    Note:\nAny whitespace at the start of an element is ignored for the determination of :-moz-first-node.\n

    " }, "-moz-handler-blocked": { - "url": "$MDN_URL$/web/css/_colon_-moz-handler-blocked", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-blocked CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been blocked.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-handler-blocked", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-blocked CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been blocked.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-handler-crashed": { - "url": "$MDN_URL$/web/css/_colon_-moz-handler-crashed", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-crashed CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because the plugin responsible for drawing them has crashed.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-handler-crashed", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-crashed CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because the plugin responsible for drawing them has crashed.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-handler-disabled": { - "url": "$MDN_URL$/web/css/_colon_-moz-handler-disabled", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-disabled CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been disabled by the user.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-handler-disabled", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-handler-disabled CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because their handlers have been disabled by the user.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-last-node": { - "url": "$MDN_URL$/web/css/_colon_-moz-last-node", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-last-node", "status": [ "Experimental" ], @@ -20630,50 +20872,50 @@ "Firefox": "55", "FirefoxAndroid": "55" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The :-moz-last-node CSS pseudo-class is a Mozilla extension that represents any element that is the last child node of some other element. It differs from :last-child because it does not match a last-child element with (non-whitespace) text after it.\n

    \n

    Note:\nAny whitespace at the end of an element is ignored for the determination of :-moz-last-node.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The :-moz-last-node CSS pseudo-class is a Mozilla extension that represents any element that is the last child node of some other element. It differs from :last-child because it does not match a last-child element with (non-whitespace) text after it.\n

    \n

    Note:\nAny whitespace at the end of an element is ignored for the determination of :-moz-last-node.\n

    " }, "-moz-loading": { - "url": "$MDN_URL$/web/css/_colon_-moz-loading", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-loading CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because they have not started loading, such as images that haven't started to arrive yet. Note that images that are in the process of loading are not matched by this pseudo-class.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-loading", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-loading CSS pseudo-class is a Mozilla extension that matches elements that can't be displayed because they have not started loading, such as images that haven't started to arrive yet. Note that images that are in the process of loading are not matched by this pseudo-class.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-locale-dir_ltr": { - "url": "$MDN_URL$/web/css/_colon_-moz-locale-dir_ltr", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-locale-dir(ltr) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed left-to-right. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to \"ltr\".\n

    \n

    Note:\nThis selector is mainly used by extensions and themes to adapt the user interface based on the user's locale. (This can vary from window to window, and even from tab to tab.) It also allows extensions to work even when they don't support the user's default locale, since they can support both left-to-right and right-to-left layouts regardless of locale specifics.\n

    \n
    \n

    Warning:\nThis selector does not work properly from HTML; it always matches, regardless of whether the UI locale is left-to-right or right-to-left.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-locale-dir_ltr", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-locale-dir(ltr) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed left-to-right. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to \"ltr\".\n

    \n

    Note:\nThis selector is mainly used by extensions and themes to adapt the user interface based on the user's locale. (This can vary from window to window, and even from tab to tab.) It also allows extensions to work even when they don't support the user's default locale, since they can support both left-to-right and right-to-left layouts regardless of locale specifics.\n

    \n
    \n

    Warning:\nThis selector does not work properly from HTML; it always matches, regardless of whether the UI locale is left-to-right or right-to-left.\n

    " }, "-moz-locale-dir_rtl": { - "url": "$MDN_URL$/web/css/_colon_-moz-locale-dir_rtl", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-locale-dir(rtl) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed right-to-left. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to \"rtl\".\n

    \n

    Note:\nThis selector is mainly used by extensions and themes to adapt the user interface based on the user's locale. (This can vary from window to window, and even from tab to tab.) It also allows extensions to work even when they don't support the user's default locale, since they can support both left-to-right and right-to-left layouts regardless of locale specifics.\n

    \n
    \n

    Warning:\nThis selector does not work properly from HTML; it never matches, no matter whether the UI locale is left-to-right or right-to-left.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-locale-dir_rtl", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-locale-dir(rtl) CSS pseudo-class is a Mozilla extension that matches an element if the user interface is being displayed right-to-left. This is determined by the preference intl.uidirection.locale (where locale is the current locale) being set to \"rtl\".\n

    \n

    Note:\nThis selector is mainly used by extensions and themes to adapt the user interface based on the user's locale. (This can vary from window to window, and even from tab to tab.) It also allows extensions to work even when they don't support the user's default locale, since they can support both left-to-right and right-to-left layouts regardless of locale specifics.\n

    \n
    \n

    Warning:\nThis selector does not work properly from HTML; it never matches, no matter whether the UI locale is left-to-right or right-to-left.\n

    " }, "-moz-only-whitespace": { - "url": "$MDN_URL$/web/css/_colon_-moz-only-whitespace", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-only-whitespace", "compatibility": { "Firefox": "", "FirefoxAndroid": "4" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n
    \n

    Note:\nIn Selectors Level 4, the :empty selector was changed to act like :-moz-only-whitespace, but no browser currently supports this yet.\n

    \n

    The :-moz-only-whitespace CSS pseudo-class matches elements that only contain text nodes that only contain whitespace. (This includes elements with empty text nodes and elements with no child nodes.)" + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n
    \n

    Note:\nIn Selectors Level 4, the :empty selector was changed to act like :-moz-only-whitespace, but no browser currently supports this yet.\n

    \n

    The :-moz-only-whitespace CSS pseudo-class matches elements that only contain text nodes that only contain whitespace. (This includes elements with empty text nodes and elements with no child nodes.)" }, "-moz-submit-invalid": { - "url": "$MDN_URL$/web/css/_colon_-moz-submit-invalid", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-submit-invalid", "compatibility": {}, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-submit-invalid CSS pseudo-class is a Mozilla extension that represents any submit <button> on forms whose contents aren't valid based on their validation constraints.\n

    By default, no style is applied. You can use this pseudo-class to customize the appearance of the submit button when there are invalid form fields." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-submit-invalid CSS pseudo-class is a Mozilla extension that represents any submit <button> on forms whose contents aren't valid based on their validation constraints.\n

    By default, no style is applied. You can use this pseudo-class to customize the appearance of the submit button when there are invalid form fields." }, "-moz-suppressed": { - "url": "$MDN_URL$/web/css/_colon_-moz-suppressed", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-suppressed CSS pseudo-class is a Mozilla extension that matches elements representing images that were suppressed because loading images from the specified site has been blocked.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-suppressed", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-suppressed CSS pseudo-class is a Mozilla extension that matches elements representing images that were suppressed because loading images from the specified site has been blocked.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-user-disabled": { - "url": "$MDN_URL$/web/css/_colon_-moz-user-disabled", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-user-disabled CSS pseudo-class is a Mozilla extension that matches elements representing images that were not loaded because images have been entirely disabled by the user's preferences.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-user-disabled", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-user-disabled CSS pseudo-class is a Mozilla extension that matches elements representing images that were not loaded because images have been entirely disabled by the user's preferences.\n

    \n

    Note:\nThis selector is mainly intended to be used by theme developers.\n

    " }, "-moz-window-inactive": { - "url": "$MDN_URL$/web/css/_colon_-moz-window-inactive", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_-moz-window-inactive", "compatibility": { "Firefox": "4" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-window-inactive CSS pseudo-class is a Mozilla extension that matches any element while it's in an inactive window.\n

    :-moz-window-inactive works in content HTML documents, too.\n

    \n

    Note:\nPrior to the addition of this pseudo-class, giving different styles to background windows was achieved by setting an attribute (active=\"true\") on the top-level XUL chrome window. This attribute is no longer used.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The :-moz-window-inactive CSS pseudo-class is a Mozilla extension that matches any element while it's in an inactive window.\n

    :-moz-window-inactive works in content HTML documents, too.\n

    \n

    Note:\nPrior to the addition of this pseudo-class, giving different styles to background windows was achieved by setting an attribute (active=\"true\") on the top-level XUL chrome window. This attribute is no longer used.\n

    " }, "active": { - "url": "$MDN_URL$/web/css/_colon_active", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_active", "status": [ "StandardTrack" ], @@ -20692,10 +20934,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :active CSS pseudo-class represents an element (such as a button) that is being activated by the user. When using a mouse, \"activation\" typically starts when the user presses down the primary mouse button." + "doc": "The :active CSS pseudo-class represents an element (such as a button) that is being activated by the user. When using a mouse, \"activation\" typically starts when the user presses down the primary mouse button." }, "active-view-transition": { - "url": "$MDN_URL$/web/css/_colon_active-view-transition", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_active-view-transition", "status": [ "StandardTrack" ], @@ -20713,10 +20955,31 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The :active-view-transition CSS pseudo-class matches the root element of a document when a view transition is in progress (active) and stops matching once the transition has completed." + "doc": "The :active-view-transition CSS pseudo-class matches the root element of a document when a view transition is in progress (active) and stops matching once the transition has completed." + }, + "active-view-transition-type": { + "url": "$MDN_URL$/web/css/reference/selectors/_colon_active-view-transition-type", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "125", + "ChromeAndroid": "125", + "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "111", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "LOW", + "lowDate": "2026-01-13" + }, + "doc": "The functional :active-view-transition-type() CSS pseudo-class matches elements when a view transition with one or more specific types is in progress (is active) and stops matching once the view transition has completed.\n
    \n```css\nhtml:active-view-transition-type(forwards, backwards) {\n  /* ... */\n}\n```\n
    " }, "any-link": { - "url": "$MDN_URL$/web/css/_colon_any-link", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_any-link", "status": [ "StandardTrack" ], @@ -20735,10 +20998,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :any-link CSS pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited. In other words, it matches every <a> or <area> element that has an href attribute. Thus, it matches all elements that match :link or :visited." + "doc": "The :any-link CSS pseudo-class selector represents an element that acts as the source anchor of a hyperlink, independent of whether it has been visited. In other words, it matches every <a> or <area> element that has an href attribute. Thus, it matches all elements that match :link or :visited." }, "autofill": { - "url": "$MDN_URL$/web/css/_colon_autofill", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_autofill", "status": [ "StandardTrack" ], @@ -20757,14 +21020,14 @@ "lowDate": "2023-02-09", "highDate": "2025-08-09" }, - "doc": "The :autofill CSS pseudo-class matches when an <input> element has its value autofilled by the browser. The class stops matching if the user edits the field." + "doc": "The :autofill CSS pseudo-class matches when an <input> element has its value autofilled by the browser. The class stops matching if the user edits the field." }, "blank": { - "url": "$MDN_URL$/web/css/_colon_blank", - "doc": "

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

    \n
    \n

    Note:\nThe :blank selector is considered at risk, as the CSSWG keeps changing it.\n

    See CSSWG issue #1967.\n

    \n

    The :blank CSS pseudo-class selects empty user input elements (e.g., <input> or <textarea>)." + "url": "$MDN_URL$/web/css/reference/selectors/_colon_blank", + "doc": "

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

    \n
    \n

    Note:\nThe :blank selector is considered at risk, as the CSSWG keeps changing it.\n

    See CSSWG issue #1967.\n

    \n

    The :blank CSS pseudo-class selects empty user input elements (e.g., <input> or <textarea>)." }, "buffering": { - "url": "$MDN_URL$/web/css/_colon_buffering", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_buffering", "status": [ "StandardTrack" ], @@ -20775,10 +21038,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :buffering CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when the playable element is buffering a media resource.\n

    An element is considered as buffering when that element cannot continue playing because it is trying to load media data but does not yet have enough data to begin or continue playback.\nFor more information, see the Media buffering, seeking, and time ranges guide.\n

    \n

    Note:\nAn element is still considered to be :playing when it is \"buffering\".\nIf :buffering matches an element, :playing will also match that element.\n

    " + "doc": "The :buffering CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when the playable element is buffering a media resource.\n

    An element is considered as buffering when that element cannot continue playing because it is trying to load media data but does not yet have enough data to begin or continue playback.\nFor more information, see the Media buffering, seeking, and time ranges guide.\n

    \n

    Note:\nAn element is still considered to be :playing when it is \"buffering\".\nIf :buffering matches an element, :playing will also match that element.\n

    " }, "checked": { - "url": "$MDN_URL$/web/css/_colon_checked", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_checked", "status": [ "StandardTrack" ], @@ -20797,14 +21060,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :checked CSS pseudo-class selector represents any radio (<input type=\"radio\">), checkbox (<input type=\"checkbox\">), or option (<option> in a <select> element) that is checked or toggled to an on state." + "doc": "The :checked CSS pseudo-class selector represents any radio (<input type=\"radio\">), checkbox (<input type=\"checkbox\">), or option (<option> in a <select> element) that is checked or toggled to an on state." }, "current": { - "url": "$MDN_URL$/web/css/_colon_current", - "doc": "

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

    \n

    The :current CSS pseudo-class selector is a time-dimensional pseudo-class that represents an element or the ancestor of an element that is currently being displayed. For example, this pseudo-class can be used to represent a video that is being displayed with captions by WebVTT.\n

    \n```css\n:current(p, span) {\n  background-color: yellow;\n}\n```\n
    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_current", + "doc": "

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

    \n

    The :current CSS pseudo-class selector represents an element or the ancestor of an element that is currently being displayed or highlighted." }, "default": { - "url": "$MDN_URL$/web/css/_colon_default", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_default", "status": [ "StandardTrack" ], @@ -20823,10 +21086,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :default CSS pseudo-class selects form elements that are the default in a group of related elements." + "doc": "The :default CSS pseudo-class selects form elements that are the default in a group of related elements." }, "defined": { - "url": "$MDN_URL$/web/css/_colon_defined", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_defined", "status": [ "StandardTrack" ], @@ -20845,10 +21108,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :defined CSS pseudo-class represents any element that has been defined. This includes any standard element built into the browser and custom elements that have been successfully defined (i.e., with the CustomElementRegistry.define() method).\n

    \n```css\n/* Selects any defined element */\n:defined {\n  font-style: italic;\n}\n/* Selects any instance of a specific custom element */\ncustom-element:defined {\n  display: block;\n}\n```\n
    " + "doc": "The :defined CSS pseudo-class represents any element that has been defined. This includes any standard element built into the browser and custom elements that have been successfully defined (i.e., with the CustomElementRegistry.define() method).\n
    \n```css\n/* Selects any defined element */\n:defined {\n  font-style: italic;\n}\n/* Selects any instance of a specific custom element */\ncustom-element:defined {\n  display: block;\n}\n```\n
    " }, "dir": { - "url": "$MDN_URL$/web/css/_colon_dir", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_dir", "status": [ "StandardTrack" ], @@ -20866,10 +21129,10 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The :dir() CSS pseudo-class matches elements based on the directionality of the text contained in them.\n
    \n```css\n/* Selects any element with right-to-left text */\n:dir(rtl) {\n  background-color: red;\n}\n```\n
    \n

    The :dir() pseudo-class uses only the semantic value of the directionality, i.e., the one defined in the document itself. It doesn't account for styling directionality, i.e., the directionality set by CSS properties such as direction.\n

    \n

    Note:\nBe aware that the behavior of the :dir() pseudo-class is not equivalent to the [dir=…] attribute selectors. The latter match the HTML dir attribute, and ignore elements that lack it — even if they inherit a direction from their parent. (Similarly, [dir=rtl] and [dir=ltr] won't match the auto value.) In contrast, :dir() will match the value calculated by the user agent, even if inherited.\n

    \n
    \n

    Note:\nIn HTML, the direction is determined by the dir attribute. Other document types may have different methods.\n

    " + "doc": "The :dir() CSS pseudo-class matches elements based on the directionality of the text contained in them.\n
    \n```css\n/* Selects any element with right-to-left text */\n:dir(rtl) {\n  background-color: red;\n}\n```\n
    \n

    The :dir() pseudo-class uses only the semantic value of the directionality, i.e., the one defined in the document itself. It doesn't account for styling directionality, i.e., the directionality set by CSS properties such as direction.\n

    \n

    Note:\nBe aware that the behavior of the :dir() pseudo-class is not equivalent to the [dir=…] attribute selectors. The latter match the HTML dir attribute, and ignore elements that lack it — even if they inherit a direction from their parent. (Similarly, [dir=rtl] and [dir=ltr] won't match the auto value.) In contrast, :dir() will match the value calculated by the user agent, even if inherited.\n

    \n
    \n

    Note:\nIn HTML, the direction is determined by the dir attribute. Other document types may have different methods.\n

    " }, "disabled": { - "url": "$MDN_URL$/web/css/_colon_disabled", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_disabled", "status": [ "StandardTrack" ], @@ -20888,10 +21151,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :disabled CSS pseudo-class represents any disabled element. An element is disabled if it can't be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has an enabled state, in which it can be activated or accept focus." + "doc": "The :disabled CSS pseudo-class represents any disabled element. An element is disabled if it can't be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has an enabled state, in which it can be activated or accept focus." }, "empty": { - "url": "$MDN_URL$/web/css/_colon_empty", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_empty", "status": [ "StandardTrack" ], @@ -20910,10 +21173,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty." + "doc": "The :empty CSS pseudo-class represents any element that has no children. Children can be either element nodes or text (including whitespace). Comments, processing instructions, and CSS content do not affect whether an element is considered empty." }, "enabled": { - "url": "$MDN_URL$/web/css/_colon_enabled", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_enabled", "status": [ "StandardTrack" ], @@ -20932,10 +21195,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :enabled CSS pseudo-class represents any enabled element. An element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has a disabled state, in which it can't be activated or accept focus." + "doc": "The :enabled CSS pseudo-class represents any enabled element. An element is enabled if it can be activated (selected, clicked on, typed into, etc.) or accept focus. The element also has a disabled state, in which it can't be activated or accept focus." }, "first": { - "url": "$MDN_URL$/web/css/_colon_first", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_first", "status": [ "StandardTrack" ], @@ -20953,10 +21216,10 @@ "level": "LOW", "lowDate": "2023-08-01" }, - "doc": "The :first CSS pseudo-class, used with the @page at-rule, represents the first page of a printed document. (See :first-child for general first element of a node.)\n
    \n```css\n/* Selects the first page when printing */\n@page :first {\n  margin-left: 50%;\n  margin-top: 50%;\n}\n```\n
    \n
    \n

    Note:\nYou can't change all CSS properties with this pseudo-class. You can only change the margins, orphans, widows, and page breaks of the document. Furthermore, you may only use absolute-length units when defining the margins. All other properties will be ignored.\n

    " + "doc": "The :first CSS pseudo-class, used with the @page at-rule, represents the first page of a printed document. (See :first-child for general first element of a node.)\n
    \n```css\n/* Selects the first page when printing */\n@page :first {\n  margin-left: 50%;\n  margin-top: 50%;\n}\n```\n
    \n
    \n

    Note:\nYou can't change all CSS properties with this pseudo-class. You can only change the margins, orphans, widows, and page breaks of the document. Furthermore, you may only use absolute-length units when defining the margins. All other properties will be ignored.\n

    " }, "first-child": { - "url": "$MDN_URL$/web/css/_colon_first-child", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_first-child", "status": [ "StandardTrack" ], @@ -20975,10 +21238,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :first-child CSS pseudo-class represents the first element among a group of sibling elements." + "doc": "The :first-child CSS pseudo-class represents the first element among a group of sibling elements." }, "first-of-type": { - "url": "$MDN_URL$/web/css/_colon_first-of-type", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_first-of-type", "status": [ "StandardTrack" ], @@ -20997,10 +21260,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :first-of-type CSS pseudo-class represents the first element of its type (tag name) among a group of sibling elements." + "doc": "The :first-of-type CSS pseudo-class represents the first element of its type (tag name) among a group of sibling elements." }, "focus": { - "url": "$MDN_URL$/web/css/_colon_focus", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_focus", "status": [ "StandardTrack" ], @@ -21019,10 +21282,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :focus CSS pseudo-class represents an element (such as a form input) that has received focus. It is generally triggered when the user clicks or taps on an element or selects it with the keyboard's Tab key." + "doc": "The :focus CSS pseudo-class represents an element (such as a form input) that has received focus. It is generally triggered when the user clicks or taps on an element or selects it with the keyboard's Tab key." }, "focus-visible": { - "url": "$MDN_URL$/web/css/_colon_focus-visible", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_focus-visible", "status": [ "StandardTrack" ], @@ -21041,10 +21304,10 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the UA (User Agent) determines via heuristics that the focus should be made evident on the element. (Many browsers show a \"focus ring\" by default in this case.)" + "doc": "The :focus-visible pseudo-class applies while an element matches the :focus pseudo-class and the UA (User Agent) determines via heuristics that the focus should be made evident on the element. (Many browsers show a \"focus ring\" by default in this case.)" }, "focus-within": { - "url": "$MDN_URL$/web/css/_colon_focus-within", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_focus-within", "status": [ "StandardTrack" ], @@ -21063,10 +21326,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :focus-within CSS pseudo-class matches an element if the element or any of its descendants are focused. In other words, it represents an element that is itself matched by the :focus pseudo-class or has a descendant that is matched by :focus. (This includes descendants in shadow trees.)" + "doc": "The :focus-within CSS pseudo-class matches an element if the element or any of its descendants are focused. In other words, it represents an element that is itself matched by the :focus pseudo-class or has a descendant that is matched by :focus. (This includes descendants in shadow trees.)" }, "fullscreen": { - "url": "$MDN_URL$/web/css/_colon_fullscreen", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_fullscreen", "status": [ "StandardTrack" ], @@ -21082,10 +21345,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :fullscreen CSS pseudo-class matches every element that is currently in fullscreen mode. If multiple elements have been put into fullscreen mode, this selects them all." + "doc": "The :fullscreen CSS pseudo-class matches every element that is currently in fullscreen mode. If multiple elements have been put into fullscreen mode, this selects them all." }, "future": { - "url": "$MDN_URL$/web/css/_colon_future", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_future", "status": [ "StandardTrack" ], @@ -21100,10 +21363,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :future CSS pseudo-class selector is a time-dimensional pseudo-class that will match for any element which appears entirely after an element that matches :current. For example in a video with captions which are being displayed by WebVTT.\n
    \n```css\n:future(p, span) {\n  display: none;\n}\n```\n
    " + "doc": "The :future CSS pseudo-class selector is a time-dimensional pseudo-class that will match for any element which appears entirely after an element that matches :current. For example in a video with captions which are being displayed by WebVTT.\n
    \n```css\n:future(p, span) {\n  display: none;\n}\n```\n
    " }, "has": { - "url": "$MDN_URL$/web/css/_colon_has", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_has", "status": [ "StandardTrack" ], @@ -21121,28 +21384,24 @@ "level": "LOW", "lowDate": "2023-12-19" }, - "doc": "The functional :has() CSS pseudo-class represents an element if any of the relative selectors that are passed as an argument match at least one element when anchored against this element. This pseudo-class presents a way of selecting a parent element or a previous sibling element with respect to a reference element by taking a relative selector list as an argument.\n
    \n```css\n/* Selects an h1 heading with a\nparagraph element that immediately follows\nthe h1 and applies the style to h1 */\nh1:has(+ p) {\n  margin-bottom: 0;\n}\n```\n
    \n

    The :has() pseudo-class takes on the specificity of the most specific selector in its arguments the same way as :is() and :not() do." + "doc": "The functional :has() CSS pseudo-class represents an element if any of the relative selectors that are passed as an argument match at least one element when anchored against this element. This pseudo-class presents a way of selecting a parent element or a previous sibling element with respect to a reference element by taking a relative selector list as an argument.\n

    \n```css\n/* Selects an h1 heading with a\nparagraph element that immediately follows\nthe h1 and applies the style to h1 */\nh1:has(+ p) {\n  margin-bottom: 0;\n}\n```\n
    \n

    The :has() pseudo-class takes on the specificity of the most specific selector in its arguments the same way as :is() and :not() do." }, "has-slotted": { - "url": "$MDN_URL$/web/css/_colon_has-slotted", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_has-slotted", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "134", - "ChromeAndroid": "134", - "Edge": "134", "Firefox": "136", - "FirefoxAndroid": "136", - "Opera": "119" + "FirefoxAndroid": "136" }, "baseline": { "level": "NONE" }, - "doc": "The :has-slotted CSS pseudo-class matches when the content of a <slot> element is not empty or not using the default value (see Using templates and slots for more information).\n

    \n

    Note:\nEven a single whitespace text node is sufficient to make :has-slotted apply.\n

    \n

    This only works when used inside CSS placed within a shadow DOM.\n

    \n```css\n/* Selects the content of a  element that has content that is not default  */\n:has-slotted {\n  color: green;\n}\n/* Selects the content of a  element that has no content or default  */\n:not(:has-slotted) {\n  color: red;\n}\n```\n
    " + "doc": "The :has-slotted CSS pseudo-class matches when the content of a <slot> element is not empty or not using the default value (see Using templates and slots for more information).\n
    \n

    Note:\nEven a single whitespace text node is sufficient to make :has-slotted apply.\n

    \n

    This only works when used inside CSS placed within a shadow DOM.\n

    \n```css\n/* Selects the content of a  element that has content that is not default  */\n:has-slotted {\n  color: green;\n}\n/* Selects the content of a  element that has no content or default  */\n:not(:has-slotted) {\n  color: red;\n}\n```\n
    " }, "heading": { - "url": "$MDN_URL$/web/css/_colon_heading", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_heading", "status": [ "Experimental", "StandardTrack" @@ -21151,10 +21410,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The :heading CSS pseudo-class matches all heading elements in a document. This allows you to style all headings at once, rather than matching and styling them individually.\n

    This pseudo-class matches only elements that by default are semantically recognized as headings (<h1> through <h6>). Elements with role=\"heading\" are not matched; you can select those by using the [role=\"heading\"] attribute selector.\n

    \n

    Note:\nThe :heading pseudo-class has the same specificity as a class selector, that is, 0-1-0. So :heading would have a specificity of 0-1-0, and section:heading would have a specificity of 0-1-1.\n

    " + "doc": "

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

    \n

    The :heading CSS pseudo-class matches all heading elements in a document." }, "heading()": { - "url": "$MDN_URL$/web/css/_colon_heading_function", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_heading_function", "status": [ "Experimental", "StandardTrack" @@ -21163,10 +21422,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The :heading() CSS pseudo-class function represents all heading elements that match a value calculated using the An+B notation. This allows you to style elements at specific heading levels at once, rather than matching and styling them individually.\n

    \n

    Note:\nThe :heading() functional pseudo-class has the same specificity as a class selector, that is, 0-1-0. So :heading() would have a specificity of 0-1-0, and section:heading() would have a specificity of 0-1-1.\n

    " + "doc": "

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

    \n

    The :heading() CSS pseudo-class function represents all heading elements whose levels match a comma-separated list of integers. This allows you to style elements at specific heading levels at once, rather than matching and styling them individually.\n

    \n

    Note:\nThe :heading() functional pseudo-class has the same specificity as a class selector, that is, 0-1-0. For example, section:heading() has a specificity of 0-1-1.\n

    " }, "host": { - "url": "$MDN_URL$/web/css/_colon_host", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_host", "status": [ "StandardTrack" ], @@ -21185,10 +21444,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :host CSS pseudo-class selects the shadow host of the shadow DOM containing the CSS it is used inside — in other words, this allows you to select a custom element from inside its shadow DOM.\n
    \n

    Note:\nThis has no effect when used outside a shadow DOM.\n

    " + "doc": "The :host CSS pseudo-class selects the shadow host of the shadow DOM containing the CSS it is used inside — in other words, this allows you to select a custom element from inside its shadow DOM.\n
    \n

    Note:\nThis has no effect when used outside a shadow DOM.\n

    " }, "host()": { - "url": "$MDN_URL$/web/css/_colon_host_function", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_host_function", "status": [ "StandardTrack" ], @@ -21207,10 +21466,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :host() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow DOM) — but only if the selector given as the function's parameter matches the shadow host. :host() has no effect when used outside a shadow DOM.\n

    The most obvious use of this is to put a class name only on certain custom element instances, and then include the relevant class selector as the function argument. You can't use this with a descendant selector expression to select only instances of the custom element that are inside a particular ancestor. That's the job of :host-context().\n

    \n

    Note:\nWhile other functional pseudo-classes such as :is() and :not() accept a list of selectors as their parameters, :host() takes a single compound selector as its parameter. In addition, while :is() and :not() only take into account the specificity of their argument, the specificity of :host() is both the specificity of the pseudo-class and the specificity of its argument.\n

    " + "doc": "The :host() CSS pseudo-class function selects the shadow host of the shadow DOM containing the CSS it is used inside (so you can select a custom element from inside its shadow DOM) — but only if the selector given as the function's parameter matches the shadow host. :host() has no effect when used outside a shadow DOM.\n

    The most obvious use of this is to put a class name only on certain custom element instances, and then include the relevant class selector as the function argument. You can't use this with a descendant selector expression to select only instances of the custom element that are inside a particular ancestor. That's the job of :host-context().\n

    \n

    Note:\nWhile other functional pseudo-classes such as :is() and :not() accept a list of selectors as their parameters, :host() takes a single compound selector as its parameter. In addition, while :is() and :not() only take into account the specificity of their argument, the specificity of :host() is both the specificity of the pseudo-class and the specificity of its argument.\n

    " }, "host-context": { - "url": "$MDN_URL$/web/css/_colon_host-context", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_host-context", "status": [ "StandardTrack", "Deprecated" @@ -21221,10 +21480,10 @@ "Edge": "79", "Opera": "41" }, - "doc": "

    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.

    \n

    The :host-context() CSS pseudo-class allows you to style elements within a shadow DOM differently based on the selector of the shadow host (the element that has the shadow root) and its DOM ancestors.\n

    Normally, elements within a shadow DOM are isolated from the DOM outside of it. The :host-context() allows you to \"peek outside\" of this Shadow DOM and check if any of the element's ancestor elements match a certain CSS selector. For example, applying a different text color to elements within a shadow root when a .dark-theme class is applied to <body>.\n

    Think of it like this: Imagine you have a <greenhouse> custom element, that has a <chameleon> living inside. Here, the <greenhouse> is the Shadow DOM host and the <chameleon> element is within the Shadow DOM. The :host-context() lets the <chameleon> change its appearance based on the <greenhouse>'s environment. If the <greenhouse> is in a sunny location (has a \"sunny-theme\" class), the <chameleon> turns yellow. If the <greenhouse> is in a shady spot (a \"shady-theme\" class applied instead), the <chameleon> turns blue.\n

    This selector pierces through all shadow boundaries. It will look for the sunny or shady theme applied directly to the <greenhouse> or on any of the host's ancestors and ancestor DOMs all the way up until it reaches the document root.\n

    To limit the selector to only the <greenhouse> host directly or limit the selection to host's DOM, use the :host or :host() pseudo-class instead.\n

    \n

    Note:\nThis has no effect when used outside a shadow DOM.\n

    \n

    The specificity of :host-context() is that of a pseudo-class, plus the specificity of the selector passed as the function's argument." + "doc": "

    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.

    \n

    The :host-context() CSS pseudo-class allows you to style elements within a shadow DOM differently based on the selector of the shadow host (the element that has the shadow root) and its DOM ancestors.\n

    Normally, elements within a shadow DOM are isolated from the DOM outside of it. The :host-context() allows you to \"peek outside\" of this Shadow DOM and check if any of the element's ancestor elements match a certain CSS selector. For example, applying a different text color to elements within a shadow root when a .dark-theme class is applied to <body>.\n

    Think of it like this: Imagine you have a <greenhouse> custom element, that has a <chameleon> living inside. Here, the <greenhouse> is the Shadow DOM host and the <chameleon> element is within the Shadow DOM. The :host-context() lets the <chameleon> change its appearance based on the <greenhouse>'s environment. If the <greenhouse> is in a sunny location (has a \"sunny-theme\" class), the <chameleon> turns yellow. If the <greenhouse> is in a shady spot (a \"shady-theme\" class applied instead), the <chameleon> turns blue.\n

    This selector pierces through all shadow boundaries. It will look for the sunny or shady theme applied directly to the <greenhouse> or on any of the host's ancestors and ancestor DOMs all the way up until it reaches the document root.\n

    To limit the selector to only the <greenhouse> host directly or limit the selection to host's DOM, use the :host or :host() pseudo-class instead.\n

    \n

    Note:\nThis has no effect when used outside a shadow DOM.\n

    \n

    The specificity of :host-context() is that of a pseudo-class, plus the specificity of the selector passed as the function's argument." }, "hover": { - "url": "$MDN_URL$/web/css/_colon_hover", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_hover", "status": [ "StandardTrack" ], @@ -21243,10 +21502,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :hover CSS pseudo-class matches an element when a user interacts with it using a pointing device. The pseudo-class is generally triggered when the user moves the cursor (mouse pointer) over an element without pressing the mouse button." + "doc": "The :hover CSS pseudo-class matches an element when a user interacts with it using a pointing device. The pseudo-class is generally triggered when the user moves the cursor (mouse pointer) over an element without pressing the mouse button." }, "in-range": { - "url": "$MDN_URL$/web/css/_colon_in-range", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_in-range", "status": [ "StandardTrack" ], @@ -21265,10 +21524,10 @@ "lowDate": "2015-11-12", "highDate": "2018-05-12" }, - "doc": "The :in-range CSS pseudo-class represents an <input> element whose current value is within the range limits specified by the min and max attributes." + "doc": "The :in-range CSS pseudo-class represents an <input> element whose current value is within the range limits specified by the min and max attributes." }, "indeterminate": { - "url": "$MDN_URL$/web/css/_colon_indeterminate", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_indeterminate", "status": [ "StandardTrack" ], @@ -21287,10 +21546,36 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :indeterminate CSS pseudo-class represents any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, radio buttons which are members of a group in which all radio buttons are unchecked, and <progress> elements with no value attribute.\n

    \n```css\n/* Selects any  whose state is indeterminate */\ninput:indeterminate {\n  background: lime;\n}\n```\n
    \n

    Elements targeted by this selector are:\n

    " + "doc": "The :indeterminate CSS pseudo-class represents any form element whose state is indeterminate, such as checkboxes that have been set to an indeterminate state with JavaScript, radio buttons which are members of a group in which all radio buttons are unchecked, and <progress> elements with no value attribute.\n
    \n```css\n/* Selects any  whose state is indeterminate */\ninput:indeterminate {\n  background: lime;\n}\n```\n
    \n

    Elements targeted by this selector are:\n

    " + }, + "interest-source": { + "url": "$MDN_URL$/web/css/reference/selectors/_colon_interest-source", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "doc": "

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

    \n

    The :interest-source CSS pseudo-class represents an interest invoker element when interest is shown on it." + }, + "interest-target": { + "url": "$MDN_URL$/web/css/reference/selectors/_colon_interest-target", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "doc": "

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

    \n

    The :interest-target CSS pseudo-class represents the target element associated with an interest invoker when interest is shown on that invoker." }, "invalid": { - "url": "$MDN_URL$/web/css/_colon_invalid", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_invalid", "status": [ "StandardTrack" ], @@ -21309,10 +21594,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :invalid CSS pseudo-class represents any <form>, <fieldset>, <input> or other <form> element whose contents fail to validate." + "doc": "The :invalid CSS pseudo-class represents any <form>, <fieldset>, <input> or other <form> element whose contents fail to validate." }, "is": { - "url": "$MDN_URL$/web/css/_colon_is", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_is", "status": [ "StandardTrack" ], @@ -21331,10 +21616,10 @@ "lowDate": "2021-01-21", "highDate": "2023-07-21" }, - "doc": "The :is() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. This is useful for writing large selectors in a more compact form.\n

    \n

    Note:\nOriginally named :matches() (and :any()), this selector was renamed to :is() in CSSWG issue #3258.\n

    " + "doc": "The :is() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list. This is useful for writing large selectors in a more compact form.\n
    \n

    Note:\nOriginally named :matches() (and :any()), this selector was renamed to :is() in CSSWG issue #3258.\n

    " }, "lang": { - "url": "$MDN_URL$/web/css/_colon_lang", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_lang", "status": [ "StandardTrack" ], @@ -21353,10 +21638,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :lang() CSS pseudo-class matches elements based on the language they are determined to be in." + "doc": "The :lang() CSS pseudo-class matches elements based on the language they are determined to be in." }, "last-child": { - "url": "$MDN_URL$/web/css/_colon_last-child", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_last-child", "status": [ "StandardTrack" ], @@ -21375,10 +21660,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :last-child CSS pseudo-class represents the last element among a group of sibling elements." + "doc": "The :last-child CSS pseudo-class represents the last element among a group of sibling elements." }, "last-of-type": { - "url": "$MDN_URL$/web/css/_colon_last-of-type", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_last-of-type", "status": [ "StandardTrack" ], @@ -21397,10 +21682,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :last-of-type CSS pseudo-class represents the last element of its type (tag name) among a group of sibling elements." + "doc": "The :last-of-type CSS pseudo-class represents the last element of its type (tag name) among a group of sibling elements." }, "left": { - "url": "$MDN_URL$/web/css/_colon_left", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_left", "status": [ "StandardTrack" ], @@ -21415,10 +21700,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :left CSS pseudo-class, used with the @page at-rule, represents all left-hand pages of a printed document.\n
    \n```css\n/* Selects any left-hand pages when printing */\n@page :left {\n  margin: 2in 3in;\n}\n```\n
    \n

    Whether a given page is \"left\" or \"right\" is determined by the major writing direction of the document. For example, if the first page has a major writing direction of left-to-right then it will be a :right page; if it has a major writing direction of right-to-left then it will be a :left page.\n

    \n

    Note:\nThis pseudo-class can be used to change only the margin, padding, border, and background properties of the page box. All other properties will be ignored, and only the page box, not the document content on the page, will be affected.\n

    " + "doc": "The :left CSS pseudo-class, used with the @page at-rule, represents all left-hand pages of a printed document.\n
    \n```css\n/* Selects any left-hand pages when printing */\n@page :left {\n  margin: 2in 3in;\n}\n```\n
    \n

    Whether a given page is \"left\" or \"right\" is determined by the major writing direction of the document. For example, if the first page has a major writing direction of left-to-right then it will be a :right page; if it has a major writing direction of right-to-left then it will be a :left page.\n

    \n

    Note:\nThis pseudo-class can be used to change only the margin, padding, border, and background properties of the page box. All other properties will be ignored, and only the page box, not the document content on the page, will be affected.\n

    " }, "link": { - "url": "$MDN_URL$/web/css/_colon_link", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_link", "status": [ "StandardTrack" ], @@ -21437,14 +21722,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :link CSS pseudo-class represents an element that has not yet been visited. It matches every unvisited <a> or <area> element that has an href attribute." + "doc": "The :link CSS pseudo-class represents an element that has not yet been visited. It matches every unvisited <a> or <area> element that has an href attribute." }, "local-link": { - "url": "$MDN_URL$/web/css/_colon_local-link", - "doc": "

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

    \n

    The :local-link CSS pseudo-class represents a link to the same document. Therefore an element that is the source anchor of a hyperlink whose target's absolute URL matches the element's own document URL.\n

    \n```css\n/* Selects any  that links to the current document */\na:local-link {\n  color: green;\n}\n```\n
    " + "url": "$MDN_URL$/web/css/reference/selectors/_colon_local-link", + "doc": "

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

    \n

    The :local-link CSS pseudo-class represents a link to the same document. Therefore an element that is the source anchor of a hyperlink whose target's absolute URL matches the element's own document URL.\n

    \n```css\n/* Selects any  that links to the current document */\na:local-link {\n  color: green;\n}\n```\n
    " }, "modal": { - "url": "$MDN_URL$/web/css/_colon_modal", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_modal", "status": [ "StandardTrack" ], @@ -21463,10 +21748,10 @@ "lowDate": "2022-09-02", "highDate": "2025-03-02" }, - "doc": "The :modal CSS pseudo-class matches an element that is in a state in which it excludes all interaction with elements outside it until the interaction has been dismissed. Multiple elements can be selected by the :modal pseudo-class at the same time, but only one of them will be active and able to receive input." + "doc": "The :modal CSS pseudo-class matches an element that is in a state in which it excludes all interaction with elements outside it until the interaction has been dismissed. Multiple elements can be selected by the :modal pseudo-class at the same time, but only one of them will be active and able to receive input." }, "muted": { - "url": "$MDN_URL$/web/css/_colon_muted", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_muted", "status": [ "StandardTrack" ], @@ -21477,10 +21762,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :muted CSS pseudo-class selector represents an element that is capable of making sound, such as <audio> or <video>, but is muted (forced silent).\n

    Muted is different from :volume-locked in that the page author has control over whether a media element can be muted or un-muted.\nUser agents may set media muted value according to use preferences (e.g., remembering the last set value across sessions, on a per-site basis, or otherwise).\nAn element that is :volume-locked cannot be muted, un-muted, or have its volume changed via JavaScript because of an operating system or user agent preference." + "doc": "The :muted CSS pseudo-class selector represents an element that is capable of making sound, such as <audio> or <video>, but is muted (forced silent).\n

    Muted is different from :volume-locked in that the page author has control over whether a media element can be muted or un-muted.\nUser agents may set media muted value according to use preferences (e.g., remembering the last set value across sessions, on a per-site basis, or otherwise).\nAn element that is :volume-locked cannot be muted, un-muted, or have its volume changed via JavaScript because of an operating system or user agent preference." }, "not": { - "url": "$MDN_URL$/web/css/_colon_not", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_not", "status": [ "StandardTrack" ], @@ -21499,10 +21784,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is known as the negation pseudo-class." + "doc": "The :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is known as the negation pseudo-class." }, "nth-child": { - "url": "$MDN_URL$/web/css/_colon_nth-child", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_nth-child", "status": [ "StandardTrack" ], @@ -21521,10 +21806,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :nth-child() CSS pseudo-class matches elements based on the indexes of the elements in the child list of their parents. In other words, the :nth-child() selector selects child elements according to their position among all the sibling elements within a parent element." + "doc": "The :nth-child() CSS pseudo-class matches elements based on the indexes of the elements in the child list of their parents. In other words, the :nth-child() selector selects child elements according to their position among all the sibling elements within a parent element." }, "nth-last-child": { - "url": "$MDN_URL$/web/css/_colon_nth-last-child", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_nth-last-child", "status": [ "StandardTrack" ], @@ -21543,10 +21828,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :nth-last-child() CSS pseudo-class matches elements based on their position among a group of siblings, counting from the end." + "doc": "The :nth-last-child() CSS pseudo-class matches elements based on their position among a group of siblings, counting from the end." }, "nth-last-of-type": { - "url": "$MDN_URL$/web/css/_colon_nth-last-of-type", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_nth-last-of-type", "status": [ "StandardTrack" ], @@ -21565,10 +21850,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :nth-last-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name), counting from the end." + "doc": "The :nth-last-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name), counting from the end." }, "nth-of-type": { - "url": "$MDN_URL$/web/css/_colon_nth-of-type", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_nth-of-type", "status": [ "StandardTrack" ], @@ -21587,10 +21872,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :nth-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name)." + "doc": "The :nth-of-type() CSS pseudo-class matches elements based on their position among siblings of the same type (tag name)." }, "only-child": { - "url": "$MDN_URL$/web/css/_colon_only-child", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_only-child", "status": [ "StandardTrack" ], @@ -21609,10 +21894,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :only-child CSS pseudo-class represents an element without any siblings. This is the same as :first-child:last-child or :nth-child(1):nth-last-child(1), but with a lower specificity." + "doc": "The :only-child CSS pseudo-class represents an element without any siblings. This is the same as :first-child:last-child or :nth-child(1):nth-last-child(1), but with a lower specificity." }, "only-of-type": { - "url": "$MDN_URL$/web/css/_colon_only-of-type", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_only-of-type", "status": [ "StandardTrack" ], @@ -21631,10 +21916,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :only-of-type CSS pseudo-class represents an element that has no siblings of the same type (tag name)." + "doc": "The :only-of-type CSS pseudo-class represents an element that has no siblings of the same type (tag name)." }, "open": { - "url": "$MDN_URL$/web/css/_colon_open", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_open", "status": [ "StandardTrack" ], @@ -21649,10 +21934,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :open CSS pseudo-class represents an element that has open and closed states, only when it is currently in the open state." + "doc": "The :open CSS pseudo-class represents an element that has open and closed states, only when it is currently in the open state." }, "optional": { - "url": "$MDN_URL$/web/css/_colon_optional", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_optional", "status": [ "StandardTrack" ], @@ -21671,10 +21956,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :optional CSS pseudo-class represents any <input>, <select>, or <textarea> element that does not have the required attribute set on it." + "doc": "The :optional CSS pseudo-class represents any <input>, <select>, or <textarea> element that does not have the required attribute set on it." }, "out-of-range": { - "url": "$MDN_URL$/web/css/_colon_out-of-range", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_out-of-range", "status": [ "StandardTrack" ], @@ -21693,10 +21978,10 @@ "lowDate": "2015-11-12", "highDate": "2018-05-12" }, - "doc": "The :out-of-range CSS pseudo-class represents an <input> element whose current value is outside the range limits specified by the min and max attributes." + "doc": "The :out-of-range CSS pseudo-class represents an <input> element whose current value is outside the range limits specified by the min and max attributes." }, "past": { - "url": "$MDN_URL$/web/css/_colon_past", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_past", "status": [ "StandardTrack" ], @@ -21711,10 +21996,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :past CSS pseudo-class selector is a time-dimensional pseudo-class that will match for any element which appears entirely before an element that matches :current. For example in a video with captions which are being displayed by WebVTT.\n

    \n```css\n:past(p, span) {\n  display: none;\n}\n```\n
    " + "doc": "The :past CSS pseudo-class selector is a time-dimensional pseudo-class that will match for any element which appears entirely before an element that matches :current. For example in a video with captions which are being displayed by WebVTT.\n
    \n```css\n:past(p, span) {\n  display: none;\n}\n```\n
    " }, "paused": { - "url": "$MDN_URL$/web/css/_colon_paused", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_paused", "status": [ "StandardTrack" ], @@ -21725,10 +22010,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :paused CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when that element is \"paused\" (i.e., not \"playing\").\n

    A resource is paused if the user explicitly paused it, or if it is in a non-activated or other non-playing state, like \"loaded, hasn't been activated yet\".\nThis is different from :buffering or :stalled, which are states that occur while the resource is considered \"playing\"." + "doc": "The :paused CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when that element is \"paused\" (i.e., not \"playing\").\n

    A resource is paused if the user explicitly paused it, or if it is in a non-activated or other non-playing state, like \"loaded, hasn't been activated yet\".\nThis is different from :buffering or :stalled, which are states that occur while the resource is considered \"playing\"." }, "picture-in-picture": { - "url": "$MDN_URL$/web/css/_colon_picture-in-picture", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_picture-in-picture", "status": [ "StandardTrack" ], @@ -21743,10 +22028,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :picture-in-picture CSS pseudo-class matches the element which is currently in picture-in-picture mode." + "doc": "The :picture-in-picture CSS pseudo-class matches the element which is currently in picture-in-picture mode." }, "placeholder-shown": { - "url": "$MDN_URL$/web/css/_colon_placeholder-shown", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_placeholder-shown", "status": [ "StandardTrack" ], @@ -21765,10 +22050,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :placeholder-shown CSS pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text." + "doc": "The :placeholder-shown CSS pseudo-class represents any <input> or <textarea> element that is currently displaying placeholder text." }, "playing": { - "url": "$MDN_URL$/web/css/_colon_playing", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_playing", "status": [ "StandardTrack" ], @@ -21779,10 +22064,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :playing CSS pseudo-class selector represents the playback state of an element that is playable, such as <audio> or <video>, when that element is \"playing\".\nAn element is considered to be playing if it is currently playing the media resource, or if it has temporarily stopped for reasons other than user intent (such as :buffering or :stalled)." + "doc": "The :playing CSS pseudo-class selector represents the playback state of an element that is playable, such as <audio> or <video>, when that element is \"playing\".\nAn element is considered to be playing if it is currently playing the media resource, or if it has temporarily stopped for reasons other than user intent (such as :buffering or :stalled)." }, "popover-open": { - "url": "$MDN_URL$/web/css/_colon_popover-open", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_popover-open", "status": [ "StandardTrack" ], @@ -21800,10 +22085,10 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "The :popover-open CSS pseudo-class represents a popover element (i.e., one with a popover attribute) that is in the showing state. You can use this to apply style to popover elements only when they are shown." + "doc": "The :popover-open CSS pseudo-class represents a popover element (i.e., one with a popover attribute) that is in the showing state. You can use this to apply style to popover elements only when they are shown." }, "read-only": { - "url": "$MDN_URL$/web/css/_colon_read-only", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_read-only", "status": [ "StandardTrack" ], @@ -21822,10 +22107,10 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The :read-only CSS pseudo-class selects elements (such as certain <input> types and <textarea>) that are not editable by the user. Elements on which the HTML attribute readonly doesn't have an effect (such as <input type=\"radio\">, <input type=\"checkbox\">, and all other non-form elements) are also selected by the :read-only pseudo-class. In fact, :read-only matches anything that :read-write doesn't match, making it equivalent to :not(:read-write)." + "doc": "The :read-only CSS pseudo-class selects elements (such as certain <input> types and <textarea>) that are not editable by the user. Elements on which the HTML attribute readonly doesn't have an effect (such as <input type=\"radio\">, <input type=\"checkbox\">, and all other non-form elements) are also selected by the :read-only pseudo-class. In fact, :read-only matches anything that :read-write doesn't match, making it equivalent to :not(:read-write)." }, "read-write": { - "url": "$MDN_URL$/web/css/_colon_read-write", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_read-write", "status": [ "StandardTrack" ], @@ -21844,10 +22129,10 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The :read-write CSS pseudo-class represents an element (such as input or textarea) that is editable by the user." + "doc": "The :read-write CSS pseudo-class represents an element (such as input or textarea) that is editable by the user." }, "required": { - "url": "$MDN_URL$/web/css/_colon_required", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_required", "status": [ "StandardTrack" ], @@ -21866,10 +22151,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :required CSS pseudo-class represents any <input>, <select>, or <textarea> element that has the required attribute set on it." + "doc": "The :required CSS pseudo-class represents any <input>, <select>, or <textarea> element that has the required attribute set on it." }, "right": { - "url": "$MDN_URL$/web/css/_colon_right", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_right", "status": [ "StandardTrack" ], @@ -21884,10 +22169,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :right CSS pseudo-class, used with the @page at-rule, represents all right-hand pages of a printed document.\n

    \n```css\n/* Selects any right-hand pages when printing */\n@page :right {\n  margin: 2in 3in;\n}\n```\n
    \n

    Whether a given page is \"left\" or \"right\" is determined by the major writing direction of the document. For example, if the first page has a major writing direction of left-to-right then it will be a :right page; if it has a major writing direction of right-to-left then it will be a :left page.\n

    \n

    Note:\nThis pseudo-class can be used to change only the margin, padding, border, and background properties of the page box. All other properties will be ignored, and only the page box, not the document content on the page, will be affected.\n

    " + "doc": "The :right CSS pseudo-class, used with the @page at-rule, represents all right-hand pages of a printed document.\n
    \n```css\n/* Selects any right-hand pages when printing */\n@page :right {\n  margin: 2in 3in;\n}\n```\n
    \n

    Whether a given page is \"left\" or \"right\" is determined by the major writing direction of the document. For example, if the first page has a major writing direction of left-to-right then it will be a :right page; if it has a major writing direction of right-to-left then it will be a :left page.\n

    \n

    Note:\nThis pseudo-class can be used to change only the margin, padding, border, and background properties of the page box. All other properties will be ignored, and only the page box, not the document content on the page, will be affected.\n

    " }, "root": { - "url": "$MDN_URL$/web/css/_colon_root", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_root", "status": [ "StandardTrack" ], @@ -21906,10 +22191,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :root CSS pseudo-class matches the root element of a tree representing the document. In HTML, :root represents the <html> element and is identical to the selector html, except that its specificity is higher.\n
    \n```css\n/* Selects the root element of the document:\n    in the case of HTML */\n:root {\n  background: yellow;\n}\n```\n
    " + "doc": "The :root CSS pseudo-class matches the root element of a tree representing the document. In HTML, :root represents the <html> element and is identical to the selector html, except that its specificity (0-1-0) is higher than html's (0-0-1).\n
    \n```css\n/* Selects the root element of the document:\n    in the case of HTML */\n:root {\n  background: yellow;\n}\n```\n
    " }, "scope": { - "url": "$MDN_URL$/web/css/_colon_scope", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_scope", "status": [ "StandardTrack" ], @@ -21928,10 +22213,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The :scope CSS pseudo-class represents elements that are a reference point, or scope, for selectors to match against.\n
    \n```css\n/* Selects a scoped element */\n:scope {\n  background-color: lime;\n}\n```\n
    \n

    Which element(s) :scope matches depends on the context in which it is used:\n

    " + "doc": "The :scope CSS pseudo-class represents elements that are a reference point, or scope, for selectors to match against.\n
    \n```css\n/* Selects a scoped element */\n:scope {\n  background-color: lime;\n}\n```\n
    \n

    Which element(s) :scope matches depends on the context in which it is used:\n

    " }, "seeking": { - "url": "$MDN_URL$/web/css/_colon_seeking", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_seeking", "status": [ "StandardTrack" ], @@ -21942,10 +22227,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :seeking CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when the playable element is seeking a playback position in the media resource.\nA resource is considered to be seeking if the user has requested playback of a specific position in the media resource, but the media element has not yet reached that position.\n

    Seeking is different from :buffering in that the media element is not currently loading data, but is instead skipping to a new position in the media resource.\nFor more information, see the Media buffering, seeking, and time ranges guide." + "doc": "The :seeking CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when the playable element is seeking a playback position in the media resource.\nA resource is considered to be seeking if the user has requested playback of a specific position in the media resource, but the media element has not yet reached that position.\n

    Seeking is different from :buffering in that the media element is not currently loading data, but is instead skipping to a new position in the media resource.\nFor more information, see the Media buffering, seeking, and time ranges guide." }, "stalled": { - "url": "$MDN_URL$/web/css/_colon_stalled", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_stalled", "status": [ "StandardTrack" ], @@ -21956,10 +22241,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :stalled CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when playback is stalled.\nA resource is considered to be stalled if the user has requested playback of a specific position in the media resource, but it has failed to receive any data for some amount of time.\nThis is different from :buffering in that the media element is unexpectedly not loading data when stalled (e.g., due to a network error) for around 3 seconds (the exact time is user agent dependent).\n

    \n

    Note:\nLike with the :buffering pseudo-class, the element is still considered to be \"playing\" when it is \"stalled\".\nIf :stalled matches an element, :playing will also match that element.\n

    " + "doc": "The :stalled CSS pseudo-class selector represents an element that is playable, such as <audio> or <video>, when playback is stalled.\nA resource is considered to be stalled if the user has requested playback of a specific position in the media resource, but it has failed to receive any data for some amount of time.\nThis is different from :buffering in that the media element is unexpectedly not loading data when stalled (e.g., due to a network error) for around 3 seconds (the exact time is user agent dependent).\n
    \n

    Note:\nLike with the :buffering pseudo-class, the element is still considered to be \"playing\" when it is \"stalled\".\nIf :stalled matches an element, :playing will also match that element.\n

    " }, "state": { - "url": "$MDN_URL$/web/css/_colon_state", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_state", "status": [ "StandardTrack" ], @@ -21977,10 +22262,10 @@ "level": "LOW", "lowDate": "2024-05-17" }, - "doc": "The :state() CSS pseudo-class matches custom elements that have the specified custom state." + "doc": "The :state() CSS pseudo-class matches custom elements that have the specified custom state." }, "target": { - "url": "$MDN_URL$/web/css/_colon_target", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_target", "status": [ "StandardTrack" ], @@ -21999,23 +22284,59 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :target CSS pseudo-class selects the target element of the document. When the document is loaded, the target element is derived using the document's URL fragment identifier.\n
    \n```css\n/* Selects document's target element */\n:target {\n  border: 2px solid black;\n}\n```\n
    \n

    For example, the following URL has a fragment identifier (denoted by the # sign) that marks the element with the id of setup as the document's target element:\n

    http://www.example.com/help/#setup\n
    \n

    The following element would be selected by a :target selector when the current URL is equal to the above:\n

    \n```html\nInstallation instructions\n```\n
    " + "doc": "The :target CSS pseudo-class selects the target element of the document. When the document is loaded, the target element is derived using the document's URL fragment identifier.\n
    \n```css\n/* Selects document's target element */\n:target {\n  border: 2px solid black;\n}\n```\n
    \n

    For example, the following URL has a fragment identifier (denoted by the # sign) that marks the element with the id of setup as the document's target element:\n

    http://www.example.com/help/#setup\n
    \n

    The following element would be selected by a :target selector when the current URL is equal to the above:\n

    \n```html\nInstallation instructions\n```\n
    " + }, + "target-after": { + "url": "$MDN_URL$/web/css/reference/selectors/_colon_target-after", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

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

    \n

    The :target-after CSS pseudo-class selects scroll markers that come after the active scroll marker (the one that currently matches :target-current) within a scroll marker group. You can use this selector to style navigation items that come after the current navigation position within a scroll marker group.\n

    \n

    Note:\nThe :target-after pseudo-class is only valid on ::scroll-marker pseudo-elements and elements that have been designated as scroll markers via the scroll-target-group property.\n

    " + }, + "target-before": { + "url": "$MDN_URL$/web/css/reference/selectors/_colon_target-before", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

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

    \n

    The :target-before CSS pseudo-class selects scroll markers that come before the active scroll marker (the one that currently matches :target-current) within a scroll marker group. You can use this selector to style navigation items that come before the current navigation position within a scroll marker group.\n

    \n

    Note:\nThe :target-before pseudo-class is only valid on ::scroll-marker pseudo-elements and elements that have been designated as scroll markers via the scroll-target-group property.\n

    " }, "target-current": { - "url": "$MDN_URL$/web/css/_colon_target-current", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_target-current", "status": [ "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "135", + "ChromeAndroid": "135", "Edge": "135", "Opera": "120" }, - "doc": "

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

    \n

    The :target-current CSS pseudo-class selects the active scroll marker — the ::scroll-marker pseudo-element of a scroll-marker-group that is currently scrolled to. This selector can be used to style the active navigation position within a scroll marker group.\n

    \n

    Note:\nThe :target-current pseudo-class is only valid on ::scroll-marker pseudo-elements.\n

    " + "baseline": { + "level": "NONE" + }, + "doc": "

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

    \n

    The :target-current CSS pseudo-class selects the active scroll marker — the scroll marker of a scroll-marker-group that is currently scrolled to. This selector can be used to style the active navigation position within a scroll marker group.\n

    \n

    Note:\nThe :target-current pseudo-class is only valid on ::scroll-marker pseudo-elements and elements that have been designated as scroll markers using the scroll-target-group property.\n

    " }, "user-invalid": { - "url": "$MDN_URL$/web/css/_colon_user-invalid", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_user-invalid", "status": [ "StandardTrack" ], @@ -22033,10 +22354,10 @@ "level": "LOW", "lowDate": "2023-11-02" }, - "doc": "The :user-invalid CSS pseudo-class represents any validated form element whose value isn't valid based on their validation constraints, after the user has interacted with it.\n

    The :user-invalid pseudo-class must match an :invalid, :out-of-range, or blank-but :required element between the time the user has attempted to submit the form and before the user has interacted again with the form element." + "doc": "The :user-invalid CSS pseudo-class represents any validated form element whose value isn't valid based on their validation constraints, after the user has interacted with it.\n

    The :user-invalid pseudo-class must match an :invalid, :out-of-range, or blank-but :required element between the time the user has attempted to submit the form and before the user has interacted again with the form element." }, "user-valid": { - "url": "$MDN_URL$/web/css/_colon_user-valid", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_user-valid", "status": [ "StandardTrack" ], @@ -22054,10 +22375,10 @@ "level": "LOW", "lowDate": "2023-11-02" }, - "doc": "The :user-valid CSS pseudo-class represents any validated form element whose value validates correctly based on its validation constraints. However, unlike :valid it only matches once the user has interacted with it.\n

    This pseudo-class is applied if the form control is valid and any of the following has occurred:\n

    \n

    Once this pseudo-class has been applied, the user-agent re-validates whether the control is valid at every keystroke when the control has focus.\n

    \n

    The result is that if the control was valid when the user started interacting with it, the validity styling is changed only when the user shifts focus to another control. However, if the user is trying to correct a previously-flagged value, the control shows immediately when the value becomes valid. Required items are flagged as invalid only if the user changes them or attempts to submit an unchanged invalid value." + "doc": "The :user-valid CSS pseudo-class represents any validated form element whose value validates correctly based on its validation constraints. However, unlike :valid it only matches once the user has interacted with it.\n

    This pseudo-class is applied if the form control is valid and any of the following has occurred:\n

    \n

    Once this pseudo-class has been applied, the user-agent re-validates whether the control is valid at every keystroke when the control has focus.\n

    \n

    The result is that if the control was valid when the user started interacting with it, the validity styling is changed only when the user shifts focus to another control. However, if the user is trying to correct a previously-flagged value, the control shows immediately when the value becomes valid. Required items are flagged as invalid only if the user changes them or attempts to submit an unchanged invalid value." }, "valid": { - "url": "$MDN_URL$/web/css/_colon_valid", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_valid", "status": [ "StandardTrack" ], @@ -22076,10 +22397,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :valid CSS pseudo-class represents any <input> or other <form> element whose contents validate successfully. This allows to easily make valid fields adopt an appearance that helps the user confirm that their data is formatted properly." + "doc": "The :valid CSS pseudo-class represents any <input> or other <form> element whose contents validate successfully. This allows to easily make valid fields adopt an appearance that helps the user confirm that their data is formatted properly." }, "visited": { - "url": "$MDN_URL$/web/css/_colon_visited", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_visited", "status": [ "StandardTrack" ], @@ -22098,10 +22419,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The :visited CSS pseudo-class applies once the link has been visited by the user. For privacy reasons, the styles that can be modified using this selector are very limited. The :visited pseudo-class applies only to <a> and <area> elements that have an href attribute." + "doc": "The :visited CSS pseudo-class applies once the link has been visited by the user. For privacy reasons, the styles that can be modified using this selector are very limited. The :visited pseudo-class applies only to <a> and <area> elements that have an href attribute." }, "volume-locked": { - "url": "$MDN_URL$/web/css/_colon_volume-locked", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_volume-locked", "status": [ "StandardTrack" ], @@ -22112,10 +22433,10 @@ "baseline": { "level": "NONE" }, - "doc": "The :volume-locked CSS pseudo-class selector represents an element that is capable of making sound, such as <audio> or <video>, but the audio volume of the media element is currently \"locked\" by the user.\n

    User agents may set media muted or volume values according to user preferences (e.g., remembering the last set value across sessions, on a per-site basis, or otherwise).\nAn element that is :volume-locked cannot be muted, un-muted, or have its volume changed via JavaScript. The locked status is an operating system or user agent preference." + "doc": "The :volume-locked CSS pseudo-class selector represents an element that is capable of making sound, such as <audio> or <video>, but the audio volume of the media element is currently \"locked\" by the user.\n

    User agents may set media muted or volume values according to user preferences (e.g., remembering the last set value across sessions, on a per-site basis, or otherwise).\nAn element that is :volume-locked cannot be muted, un-muted, or have its volume changed via JavaScript. The locked status is an operating system or user agent preference." }, "where": { - "url": "$MDN_URL$/web/css/_colon_where", + "url": "$MDN_URL$/web/css/reference/selectors/_colon_where", "status": [ "StandardTrack" ], @@ -22134,24 +22455,24 @@ "lowDate": "2021-01-21", "highDate": "2023-07-21" }, - "doc": "The :where() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list.\n

    The difference between :where() and :is() is that :where() always has 0 specificity, whereas :is() takes on the specificity of the most specific selector in its arguments." + "doc": "The :where() CSS pseudo-class function takes a selector list as its argument, and selects any element that can be selected by one of the selectors in that list.\n

    The difference between :where() and :is() is that :where() always has 0 specificity, whereas :is() takes on the specificity of the most specific selector in its arguments." } }, "pseudoElements": { "-moz-color-swatch": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-color-swatch", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-color-swatch", "compatibility": { "Firefox": "27", "FirefoxAndroid": "27" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-color-swatch CSS pseudo-element is a Mozilla extension that represents the color selected in an <input> of type=\"color\".\n

    \n

    Note:\nUsing ::-moz-color-swatch with anything but an <input type=\"color\"> doesn't match anything and has no effect.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-color-swatch CSS pseudo-element is a Mozilla extension that represents the color selected in an <input> of type=\"color\".\n

    \n

    Note:\nUsing ::-moz-color-swatch with anything but an <input type=\"color\"> doesn't match anything and has no effect.\n

    " }, "-moz-focus-inner": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-focus-inner", - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The ::-moz-focus-inner CSS pseudo-element is a Mozilla extension that represents an inner focus ring of the <button> element as well as the button, submit, reset, and color types of the <input> element.\n

    \n

    Note:\nUsing ::-moz-focus-inner with anything than the buttons that support it doesn't match anything and has no effect.\n

    " + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-focus-inner", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The ::-moz-focus-inner CSS pseudo-element is a Mozilla extension that represents an inner focus ring of the <button> element as well as the button, submit, reset, and color types of the <input> element.\n

    \n

    Note:\nUsing ::-moz-focus-inner with anything than the buttons that support it doesn't match anything and has no effect.\n

    " }, "-moz-list-bullet": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-list-bullet", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-list-bullet", "status": [ "Experimental" ], @@ -22159,10 +22480,10 @@ "Firefox": "", "FirefoxAndroid": "4" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-list-bullet CSS pseudo-element is a Mozilla extension that represents the marker (typically a bullet) of a list item (<li>) in an unordered list (<ul>)." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-list-bullet CSS pseudo-element is a Mozilla extension that represents the marker (typically a bullet) of a list item (<li>) in an unordered list (<ul>)." }, "-moz-list-number": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-list-number", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-list-number", "status": [ "Experimental" ], @@ -22170,14 +22491,14 @@ "Firefox": "", "FirefoxAndroid": "4" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-list-number CSS pseudo-element is a Mozilla extension that represents the marker (typically a number) of a list item (<li>) in an ordered list (<ol>)." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-list-number CSS pseudo-element is a Mozilla extension that represents the marker (typically a number) of a list item (<li>) in an ordered list (<ol>)." }, "-moz-meter-bar": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-meter-bar", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-meter-bar", "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-meter-bar CSS pseudo-element represents the meter gauge in a <meter> element. It is used for selecting and applying styles to the gauge inside a meter element.\n

    \n

    Note:\nBy default, the <meter> element uses native styling. To apply your own styles, first set appearance: none on the <meter> element, and then style using ::-moz-meter-bar.\n

    " }, "-moz-progress-bar": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-progress-bar", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-progress-bar", "status": [ "Experimental" ], @@ -22185,34 +22506,34 @@ "Firefox": "6", "FirefoxAndroid": "6" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-progress-bar CSS pseudo-element is a Mozilla extension that represents the progress bar inside a <progress> element. (The bar represents the amount of progress that has been made.)\n

    If you want to select the unfinished part of <progress> in Mozilla, please select the <progress> directly." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The ::-moz-progress-bar CSS pseudo-element is a Mozilla extension that represents the progress bar inside a <progress> element. (The bar represents the amount of progress that has been made.)\n

    If you want to select the unfinished part of <progress> in Mozilla, please select the <progress> directly." }, "-moz-range-progress": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-range-progress", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-range-progress", "compatibility": { "Firefox": "22", "FirefoxAndroid": "22" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-progress CSS pseudo-element is a Mozilla extension that represents the lower portion of the track (i.e., groove) in which the indicator slides in an <input> of type=\"range\". This portion corresponds to values lower than the value currently selected by the thumb (i.e., virtual knob).\n

    \n

    Note:\nUsing ::-moz-range-progress with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-progress CSS pseudo-element is a Mozilla extension that represents the lower portion of the track (i.e., groove) in which the indicator slides in an <input> of type=\"range\". This portion corresponds to values lower than the value currently selected by the thumb (i.e., virtual knob).\n

    \n

    Note:\nUsing ::-moz-range-progress with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " }, "-moz-range-thumb": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-range-thumb", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-range-thumb", "compatibility": { "Firefox": "21", "FirefoxAndroid": "21" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-thumb CSS pseudo-element is a Mozilla extension that represents the thumb (i.e., virtual knob) of an <input> of type=\"range\". The user can move the thumb along the input's track to alter its numerical value.\n

    \n

    Note:\nUsing ::-moz-range-thumb with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-thumb CSS pseudo-element is a Mozilla extension that represents the thumb (i.e., virtual knob) of an <input> of type=\"range\". The user can move the thumb along the input's track to alter its numerical value.\n

    \n

    Note:\nUsing ::-moz-range-thumb with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " }, "-moz-range-track": { - "url": "$MDN_URL$/web/css/_doublecolon_-moz-range-track", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-moz-range-track", "compatibility": { "Firefox": "21", "FirefoxAndroid": "21" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-track CSS pseudo-element is a Mozilla extension that represents the track (i.e., groove) in which the indicator slides in an <input> of type=\"range\".\n

    \n

    Note:\nUsing ::-moz-range-track with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-moz-range-track CSS pseudo-element is a Mozilla extension that represents the track (i.e., groove) in which the indicator slides in an <input> of type=\"range\".\n

    \n

    Note:\nUsing ::-moz-range-track with anything but an <input type=\"range\"> doesn't match anything and has no effect.\n

    " }, "-webkit-inner-spin-button": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-inner-spin-button", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-inner-spin-button", "compatibility": { "Chrome": "6", "ChromeAndroid": "", @@ -22224,7 +22545,7 @@ "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-inner-spin-button CSS pseudo-element is used to style the inner part of the spinner button of number picker input elements." }, "-webkit-meter-bar": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-meter-bar", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-meter-bar", "status": [ "Deprecated" ], @@ -22236,10 +22557,10 @@ "Safari": "5.1", "SafariIOS": "5" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The ::-webkit-meter-bar CSS pseudo-element is a WebKit extension that represents the background of a <meter> element. It is used for selecting and applying styles to the container of a meter gauge." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n

    The ::-webkit-meter-bar CSS pseudo-element is a WebKit extension that represents the background of a <meter> element. It is used for selecting and applying styles to the container of a meter gauge." }, "-webkit-meter-even-less-good-value": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-meter-even-less-good-value", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-meter-even-less-good-value", "compatibility": { "Chrome": "12", "ChromeAndroid": "", @@ -22251,7 +22572,7 @@ "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-meter-even-less-good-value styles the <meter> element when the value and the optimum attributes fall outside the low-high range, but in opposite zones. To illustrate, it applies when value < low < high < optimum or value > high > low > optimum.\n

    Red is the default color." }, "-webkit-meter-inner-element": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-meter-inner-element", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-meter-inner-element", "compatibility": { "Chrome": "23", "ChromeAndroid": "25", @@ -22263,7 +22584,7 @@ "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    ::-webkit-meter-inner-element is a proprietary WebKit CSS pseudo-element for selecting and applying styles to the outer containing element of a <meter> element. Additional markup to render the meter element as read-only." }, "-webkit-meter-optimum-value": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-meter-optimum-value", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-meter-optimum-value", "compatibility": { "Chrome": "12", "ChromeAndroid": "", @@ -22275,7 +22596,7 @@ "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-meter-optimum-value CSS pseudo-element styles the <meter> element when its value is inside the low-high range, or when the value is equivalent to the optimum value.\n

    Green is the default color." }, "-webkit-meter-suboptimum-value": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-meter-suboptimum-value", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-meter-suboptimum-value", "compatibility": { "Chrome": "12", "ChromeAndroid": "", @@ -22287,7 +22608,7 @@ "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-meter-suboptimum-value pseudo-element styles the <meter> element when the value attribute falls outside of the low-high range and is not equivalent to the optimum value.\n

    Yellow is the default color." }, "-webkit-progress-bar": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-progress-bar", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-progress-bar", "compatibility": { "Chrome": "25", "ChromeAndroid": "25", @@ -22296,10 +22617,10 @@ "Safari": "7", "SafariIOS": "7" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-bar CSS pseudo-element represents the entire bar of a <progress> element. Normally it's only visible as the unfilled portion of the bar, since by default it's rendered below the ::-webkit-progress-value pseudo-element. It is a child of the ::-webkit-progress-inner-element pseudo-element and the parent of the ::-webkit-progress-value pseudo-element.\n

    \n

    Note:\nFor ::-webkit-progress-value to take effect, appearance needs to be set to none on the <progress> element.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-bar CSS pseudo-element represents the entire bar of a <progress> element. Normally it's only visible as the unfilled portion of the bar, since by default it's rendered below the ::-webkit-progress-value pseudo-element. It is a child of the ::-webkit-progress-inner-element pseudo-element and the parent of the ::-webkit-progress-value pseudo-element.\n

    \n

    Note:\nFor ::-webkit-progress-value to take effect, appearance needs to be set to none on the <progress> element.\n

    " }, "-webkit-progress-inner-element": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-progress-inner-element", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-progress-inner-element", "compatibility": { "Chrome": "23", "ChromeAndroid": "25", @@ -22308,10 +22629,10 @@ "Safari": "7", "SafariIOS": "7" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-inner-element CSS pseudo-element represents the outermost container of the <progress> element. It is the parent of the ::-webkit-progress-bar pseudo-element.\n

    \n

    Note:\nIn order to let ::-webkit-progress-value take effect, appearance needs to be set to none on the <progress> element.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-inner-element CSS pseudo-element represents the outermost container of the <progress> element. It is the parent of the ::-webkit-progress-bar pseudo-element.\n

    \n

    Note:\nIn order to let ::-webkit-progress-value take effect, appearance needs to be set to none on the <progress> element.\n

    " }, "-webkit-progress-value": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-progress-value", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-progress-value", "compatibility": { "Chrome": "25", "ChromeAndroid": "25", @@ -22320,10 +22641,10 @@ "Safari": "7", "SafariIOS": "7" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-value CSS pseudo-element represents the filled-in portion of the bar of a <progress> element. It is a child of the ::-webkit-progress-bar pseudo-element.\n

    \n

    Note:\nIn order to let ::-webkit-progress-value take effect, appearance needs to be set to none on the <progress> element.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-progress-value CSS pseudo-element represents the filled-in portion of the bar of a <progress> element. It is a child of the ::-webkit-progress-bar pseudo-element.\n

    \n

    Note:\nIn order to let ::-webkit-progress-value take effect, appearance needs to be set to none on the <progress> element.\n

    " }, "-webkit-scrollbar": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-scrollbar", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-scrollbar", "compatibility": { "support_of_-webkit-resizer": { "Chrome": "2", @@ -22377,10 +22698,10 @@ "Safari": "4" } }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-scrollbar CSS pseudo-element affects the style of an element's scrollbar when it has scrollable overflow.\n

    The scrollbar-color and scrollbar-width standard properties may be used as alternatives for browsers that do not support this pseudo-element and the related ::-webkit-scrollbar-* pseudo-elements (see Browser compatibility).\n

    \n

    Note:\nIf scrollbar-color and scrollbar-width are supported and have any value other than auto set, they will override ::-webkit-scrollbar-* styling.\nSee Adding a fallback for scrollbar styles for more details.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-scrollbar CSS pseudo-element affects the style of an element's scrollbar when it has scrollable overflow.\n

    The scrollbar-color and scrollbar-width standard properties may be used as alternatives for browsers that do not support this pseudo-element and the related ::-webkit-scrollbar-* pseudo-elements (see Browser compatibility).\n

    \n

    Note:\nIf scrollbar-color and scrollbar-width are supported and have any value other than auto set, they will override ::-webkit-scrollbar-* styling.\nSee Adding a fallback for scrollbar styles for more details.\n

    " }, "-webkit-search-cancel-button": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-search-cancel-button", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-search-cancel-button", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -22389,10 +22710,10 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-search-cancel-button CSS pseudo-element represents a button (the \"cancel button\") at the edge of an <input> of type=\"search\" which clears away the current value of the <input> element. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The clear button is only shown on non-empty search <input> elements." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-search-cancel-button CSS pseudo-element represents a button (the \"cancel button\") at the edge of an <input> of type=\"search\" which clears away the current value of the <input> element. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The clear button is only shown on non-empty search <input> elements." }, "-webkit-search-results-button": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-search-results-button", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-search-results-button", "compatibility": { "Chrome": "", "ChromeAndroid": "", @@ -22401,10 +22722,10 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-search-results-button CSS pseudo-element represents a button (the \"search results button\") at the left edge of an <input> of type=\"search\" which when clicked displays a menu which allows the user to choose from previous recent search queries. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The search results button is only shown on search <input> elements that have a results attribute." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-search-results-button CSS pseudo-element represents a button (the \"search results button\") at the left edge of an <input> of type=\"search\" which when clicked displays a menu which allows the user to choose from previous recent search queries. This button and pseudo-element are non-standard, supported only in WebKit and Blink, hence the vendor prefix. The search results button is only shown on search <input> elements that have a results attribute." }, "-webkit-slider-runnable-track": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-slider-runnable-track", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-slider-runnable-track", "compatibility": { "Chrome": "26", "ChromeAndroid": "26", @@ -22413,10 +22734,10 @@ "Safari": "18", "SafariIOS": "18" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-slider-runnable-track CSS pseudo-element represents the \"track\" (the groove in which the indicator slides) of an <input type=\"range\">." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-slider-runnable-track CSS pseudo-element represents the \"track\" (the groove in which the indicator slides) of an <input type=\"range\">." }, "-webkit-slider-thumb": { - "url": "$MDN_URL$/web/css/_doublecolon_-webkit-slider-thumb", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_-webkit-slider-thumb", "compatibility": { "Chrome": "32", "ChromeAndroid": "32", @@ -22425,10 +22746,10 @@ "Safari": "18", "SafariIOS": "18" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-slider-thumb CSS pseudo-element represents the \"thumb\" that the user can move within the \"groove\" of an <input> of type=\"range\" to alter its numerical value." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The ::-webkit-slider-thumb CSS pseudo-element represents the \"thumb\" that the user can move within the \"groove\" of an <input> of type=\"range\" to alter its numerical value." }, "after": { - "url": "$MDN_URL$/web/css/_doublecolon_after", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_after", "status": [ "StandardTrack" ], @@ -22447,10 +22768,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default." + "doc": "In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default." }, "backdrop": { - "url": "$MDN_URL$/web/css/_doublecolon_backdrop", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_backdrop", "status": [ "StandardTrack" ], @@ -22469,10 +22790,10 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The ::backdrop CSS pseudo-element is a box the size of the viewport, which is rendered immediately beneath any element being presented in the top layer." + "doc": "The ::backdrop CSS pseudo-element is a box the size of the viewport, which is rendered immediately beneath any element being presented in the top layer." }, "before": { - "url": "$MDN_URL$/web/css/_doublecolon_before", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_before", "status": [ "StandardTrack" ], @@ -22491,27 +22812,27 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default." + "doc": "In CSS, ::before creates a pseudo-element that is the first child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default." }, "checkmark": { - "url": "$MDN_URL$/web/css/_doublecolon_checkmark", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_checkmark", "status": [ "Experimental", "StandardTrack" ], "compatibility": { - "Chrome": "135", - "ChromeAndroid": "135", - "Edge": "135", - "Opera": "120" + "Chrome": "133", + "ChromeAndroid": "133", + "Edge": "133", + "Opera": "118" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::checkmark CSS pseudo-element targets the checkmark placed inside the currently-selected <option> element of a customizable select element. It can be used to provide a visual indication of which option is selected." + "doc": "

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

    \n

    The ::checkmark CSS pseudo-element targets the checkmark placed inside the currently-selected <option> element of a customizable select element. It can be used to provide a visual indication of which option is selected." }, "column": { - "url": "$MDN_URL$/web/css/_doublecolon_column", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_column", "status": [ "Experimental", "StandardTrack" @@ -22525,10 +22846,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::column CSS pseudo-element represents the individual columns generated when a container is set to display its content in multiple columns via CSS multi-column layout. The ::column pseudo-element enables applying styles that do not affect the layout to these generated fragments." + "doc": "

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

    \n

    The ::column CSS pseudo-element represents the individual columns generated when a container is set to display its content in multiple columns via CSS multi-column layout. The ::column pseudo-element enables applying styles that do not affect the layout to these generated fragments." }, "cue": { - "url": "$MDN_URL$/web/css/_doublecolon_cue", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_cue", "status": [ "StandardTrack" ], @@ -22547,10 +22868,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The ::cue CSS pseudo-element matches WebVTT cues within a selected element.\nThis can be used to style captions and other cues in media with VTT tracks." + "doc": "The ::cue CSS pseudo-element matches WebVTT cues within a selected element.\nThis can be used to style captions and other cues in media with VTT tracks." }, "details-content": { - "url": "$MDN_URL$/web/css/_doublecolon_details-content", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_details-content", "status": [ "StandardTrack" ], @@ -22568,10 +22889,10 @@ "level": "LOW", "lowDate": "2025-09-16" }, - "doc": "The ::details-content CSS pseudo-element represents the expandable/collapsible contents of a <details> element." + "doc": "The ::details-content CSS pseudo-element represents the expandable/collapsible contents of a <details> element." }, "file-selector-button": { - "url": "$MDN_URL$/web/css/_doublecolon_file-selector-button", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_file-selector-button", "status": [ "StandardTrack" ], @@ -22590,10 +22911,10 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The ::file-selector-button CSS pseudo-element represents the button of an <input> of type=\"file\"." + "doc": "The ::file-selector-button CSS pseudo-element represents the button of an <input> of type=\"file\"." }, "first-letter": { - "url": "$MDN_URL$/web/css/_doublecolon_first-letter", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_first-letter", "status": [ "StandardTrack" ], @@ -22612,10 +22933,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of a block container, but only when not preceded by other content (such as images or inline tables)." + "doc": "The ::first-letter CSS pseudo-element applies styles to the first letter of the first line of a block container, but only when not preceded by other content (such as images or inline tables)." }, "first-line": { - "url": "$MDN_URL$/web/css/_doublecolon_first-line", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_first-line", "status": [ "StandardTrack" ], @@ -22634,10 +22955,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The ::first-line CSS pseudo-element applies styles to the first line of a block container." + "doc": "The ::first-line CSS pseudo-element applies styles to the first line of a block container." }, "grammar-error": { - "url": "$MDN_URL$/web/css/_doublecolon_grammar-error", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_grammar-error", "status": [ "StandardTrack" ], @@ -22652,10 +22973,10 @@ "baseline": { "level": "NONE" }, - "doc": "The ::grammar-error CSS pseudo-element represents a text segment which the user agent has flagged as grammatically incorrect.\n

    The ::grammar-error pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." + "doc": "The ::grammar-error CSS pseudo-element represents a text segment which the user agent has flagged as grammatically incorrect.\n

    The ::grammar-error pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." }, "highlight": { - "url": "$MDN_URL$/web/css/_doublecolon_highlight", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_highlight", "status": [ "StandardTrack" ], @@ -22670,10 +22991,10 @@ "baseline": { "level": "NONE" }, - "doc": "The ::highlight() CSS pseudo-element applies styles to a custom highlight.\n

    A custom highlight is a collection of Range objects and is registered on a webpage using the HighlightRegistry.\n

    The ::highlight() pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." + "doc": "The ::highlight() CSS pseudo-element applies styles to a custom highlight.\n

    A custom highlight is a collection of Range objects and is registered on a webpage using the HighlightRegistry.\n

    The ::highlight() pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." }, "marker": { - "url": "$MDN_URL$/web/css/_doublecolon_marker", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_marker", "status": [ "StandardTrack" ], @@ -22688,10 +23009,10 @@ "baseline": { "level": "NONE" }, - "doc": "The ::marker CSS pseudo-element selects the marker box of a list item, which typically contains a bullet or number. It works on any element or pseudo-element set to display: list-item, such as the <li> and <summary> elements." + "doc": "The ::marker CSS pseudo-element selects the marker box of a list item, which typically contains a bullet or number. It works on any element or pseudo-element set to display: list-item, such as the <li> and <summary> elements." }, "part": { - "url": "$MDN_URL$/web/css/_doublecolon_part", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_part", "status": [ "StandardTrack" ], @@ -22710,10 +23031,10 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The ::part CSS pseudo-element represents any element within a shadow tree that has a matching part attribute.\n

    \n```css\ncustom-element::part(foo) {\n  /* Styles to apply to the `foo` part */\n}\n```\n
    " + "doc": "The ::part CSS pseudo-element represents any element within a shadow tree that has a matching part attribute.\n
    \n```css\ncustom-element::part(foo) {\n  /* Styles to apply to the `foo` part */\n}\n```\n
    " }, "picker": { - "url": "$MDN_URL$/web/css/_doublecolon_picker", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_picker", "status": [ "Experimental", "StandardTrack" @@ -22727,27 +23048,27 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::picker() CSS pseudo-element targets the picker part of an element, for example the drop-down picker of a customizable select element." + "doc": "

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

    \n

    The ::picker() CSS pseudo-element targets the picker part of an element, for example the drop-down picker of a customizable select element." }, "picker-icon": { - "url": "$MDN_URL$/web/css/_doublecolon_picker-icon", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_picker-icon", "status": [ "Experimental", "StandardTrack" ], "compatibility": { - "Chrome": "135", - "ChromeAndroid": "135", - "Edge": "135", - "Opera": "120" + "Chrome": "133", + "ChromeAndroid": "133", + "Edge": "133", + "Opera": "118" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::picker-icon CSS pseudo-element targets the picker icon inside form controls that have an icon associated with them. In the case of a customizable select element, it selects the arrow icon shown on the <select> element that points down when it is closed." + "doc": "

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

    \n

    The ::picker-icon CSS pseudo-element targets the picker icon inside form controls that have an icon associated with them. In the case of a customizable select element, it selects the arrow icon shown on the <select> element that points down when it is closed." }, "placeholder": { - "url": "$MDN_URL$/web/css/_doublecolon_placeholder", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_placeholder", "status": [ "StandardTrack" ], @@ -22766,10 +23087,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The ::placeholder CSS pseudo-element represents the placeholder text in an <input> or <textarea> element." + "doc": "The ::placeholder CSS pseudo-element represents the placeholder text in an <input> or <textarea> element." }, "scroll-button": { - "url": "$MDN_URL$/web/css/_doublecolon_scroll-button", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_scroll-button", "status": [ "Experimental", "StandardTrack" @@ -22783,10 +23104,10 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::scroll-button() CSS pseudo-element represents a button for controlling the scrolling of a scroll container. They are generated on scroll containers when their content value is not none. The direction of the scrolling is determined by the parameter value." + "doc": "

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

    \n

    The ::scroll-button() CSS pseudo-element represents a button for controlling the scrolling of a scroll container. They are generated on scroll containers when their content value is not none. The direction of the scrolling is determined by the parameter value." }, "scroll-marker": { - "url": "$MDN_URL$/web/css/_doublecolon_scroll-marker", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_scroll-marker", "status": [ "Experimental", "StandardTrack" @@ -22800,26 +23121,40 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::scroll-marker CSS pseudo-element can be generated inside any element and represents its scroll marker. All elements can have a ::scroll-marker pseudo-element, which is placed into the ::scroll-marker-group of the nearest scroll container ancestor. A scroll marker behaves like an anchor (<a> element) whose scroll target is the marker's originating element — and scrolls the scroll container to that element when activated." + "doc": "

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

    \n

    The ::scroll-marker CSS pseudo-element can be generated inside any element and represents its scroll marker. All elements can have a ::scroll-marker pseudo-element, which is placed into the ::scroll-marker-group of the nearest scroll container ancestor. A scroll marker behaves like an anchor (<a> element) whose scroll target is the marker's originating element — and scrolls the scroll container to that element when activated." }, "scroll-marker-group": { - "url": "$MDN_URL$/web/css/_doublecolon_scroll-marker-group", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_scroll-marker-group", "status": [ "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "135", + "ChromeAndroid": "135", "Edge": "135", "Opera": "120" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The ::scroll-marker-group CSS pseudo-element is generated inside a scroll container and contains any ::scroll-marker pseudo-elements generated on descendants of the scroll container." + "doc": "

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

    \n

    The ::scroll-marker-group CSS pseudo-element is generated inside a scroll container and contains any ::scroll-marker pseudo-elements generated on descendants of the scroll container." + }, + "search-text": { + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_search-text", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, + "doc": "The ::search-text CSS pseudo-element applies styles to search results identified by the user agent's \"Find\" or \"Find in page\" text search feature." }, "selection": { - "url": "$MDN_URL$/web/css/_doublecolon_selection", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_selection", "status": [ "StandardTrack" ], @@ -22835,10 +23170,10 @@ "baseline": { "level": "NONE" }, - "doc": "The ::selection CSS pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text).\n

    The ::selection pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." + "doc": "The ::selection CSS pseudo-element applies styles to the part of a document that has been highlighted by the user (such as clicking and dragging the mouse across text).\n

    The ::selection pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." }, "slotted": { - "url": "$MDN_URL$/web/css/_doublecolon_slotted", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_slotted", "status": [ "StandardTrack" ], @@ -22857,10 +23192,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The ::slotted() CSS pseudo-element represents any element that has been placed into a slot inside an HTML template (see Using templates and slots for more information).\n

    This only works when used inside CSS placed within a shadow DOM. Note that this selector won't select a text node placed into a slot; it only targets actual elements." + "doc": "The ::slotted() CSS pseudo-element represents any element that has been placed into a slot inside an HTML template (see Using templates and slots for more information).\n

    This only works when used inside CSS placed within a shadow DOM. Note that this selector won't select a text node placed into a slot; it only targets actual elements." }, "spelling-error": { - "url": "$MDN_URL$/web/css/_doublecolon_spelling-error", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_spelling-error", "status": [ "StandardTrack" ], @@ -22875,10 +23210,10 @@ "baseline": { "level": "NONE" }, - "doc": "The ::spelling-error CSS pseudo-element represents a text segment which the user agent has flagged as incorrectly spelled.\n

    The ::spelling-error pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." + "doc": "The ::spelling-error CSS pseudo-element represents a text segment which the user agent has flagged as incorrectly spelled.\n

    The ::spelling-error pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." }, "target-text": { - "url": "$MDN_URL$/web/css/_doublecolon_target-text", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_target-text", "status": [ "StandardTrack" ], @@ -22896,10 +23231,10 @@ "level": "LOW", "lowDate": "2024-12-11" }, - "doc": "The ::target-text CSS pseudo-element represents the text that has been scrolled to if the browser supports text fragments. It allows authors to choose how to highlight that section of text.\n

    The ::target-text pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." + "doc": "The ::target-text CSS pseudo-element represents the text that has been scrolled to if the browser supports text fragments. It allows authors to choose how to highlight that section of text.\n

    The ::target-text pseudo-element follows a special inheritance model common to all highlight pseudo-elements. For more details on how this inheritance works, see the Highlight pseudo-elements inheritance section." }, "view-transition": { - "url": "$MDN_URL$/web/css/_doublecolon_view-transition", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_view-transition", "status": [ "StandardTrack" ], @@ -22917,10 +23252,10 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ::view-transition CSS pseudo-element represents the root of the view transitions overlay, which contains all view transition snapshot groups and sits over the top of all other page content.\n

    During a view transition, ::view-transition is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is the top-level node of this tree, and has one or more ::view-transition-group()s as children.\n

    ::view-transition is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition {\n  position: fixed;\n  inset: 0;\n}\n```\n
    \n

    All ::view-transition-group() pseudo-elements are positioned relative to the view transition root." + "doc": "The ::view-transition CSS pseudo-element represents the root of the view transitions overlay, which contains all view transition snapshot groups and sits over the top of all other page content.\n

    During a view transition, ::view-transition is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is the top-level node of this tree, and has one or more ::view-transition-group()s as children.\n

    ::view-transition is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition {\n  position: fixed;\n  inset: 0;\n}\n```\n
    \n

    All ::view-transition-group() pseudo-elements are positioned relative to the view transition root." }, "view-transition-group": { - "url": "$MDN_URL$/web/css/_doublecolon_view-transition-group", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_view-transition-group", "status": [ "StandardTrack" ], @@ -22938,10 +23273,10 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ::view-transition-group() CSS pseudo-element represents a single view transition snapshot group.\n

    During a view transition, ::view-transition-group() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of ::view-transition, and has a ::view-transition-image-pair() as a child.\n

    ::view-transition-group() is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition-group(*) {\n  position: absolute;\n  top: 0;\n  left: 0;\n  animation-duration: 0.25s;\n  animation-fill-mode: both;\n}\n```\n
    \n

    By default, selected elements initially mirror the size and position of the ::view-transition-old() pseudo-element representing the \"old\" view state, or the ::view-transition-new() pseudo-element representing the \"new\" view state if there isn't an \"old\" view state.\n

    If there's both an \"old\" and \"new\" view state, styles in the view transition style sheet animate this pseudo-element's width and height from the size of the \"old\" view state's border box to that of the \"new\" view state's border box.\n

    \n

    Note:\nView transition styles are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    \n

    In addition, the element's transform is animated from the \"old\" view state's screen space transform to the new view state's screen space transform. This style is generated dynamically since the values of animated properties are determined at the time that the transition begins." + "doc": "The ::view-transition-group() CSS pseudo-element represents a single view transition snapshot group.\n

    During a view transition, ::view-transition-group() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of ::view-transition, and has a ::view-transition-image-pair() as a child.\n

    ::view-transition-group() is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition-group(*) {\n  position: absolute;\n  top: 0;\n  left: 0;\n  animation-duration: 0.25s;\n  animation-fill-mode: both;\n}\n```\n
    \n

    By default, selected elements initially mirror the size and position of the ::view-transition-old() pseudo-element representing the \"old\" view state, or the ::view-transition-new() pseudo-element representing the \"new\" view state if there isn't an \"old\" view state.\n

    If there's both an \"old\" and \"new\" view state, styles in the view transition style sheet animate this pseudo-element's width and height from the size of the \"old\" view state's border box to that of the \"new\" view state's border box.\n

    \n

    Note:\nView transition styles are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    \n

    In addition, the element's transform is animated from the \"old\" view state's screen space transform to the new view state's screen space transform. This style is generated dynamically since the values of animated properties are determined at the time that the transition begins." }, "view-transition-image-pair": { - "url": "$MDN_URL$/web/css/_doublecolon_view-transition-image-pair", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_view-transition-image-pair", "status": [ "StandardTrack" ], @@ -22959,10 +23294,10 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ::view-transition-image-pair() CSS pseudo-element represents a container for a view transition's \"old\" and \"new\" view states — before and after the transition.\n

    During a view transition, ::view-transition-image-pair() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of a ::view-transition-group(). In terms of children, it can have a ::view-transition-new() or a ::view-transition-old(), or both.\n

    ::view-transition-image-pair() is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition-image-pair(*) {\n  position: absolute;\n  inset: 0;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n```\n
    \n

    During a view transition, ::view-transition-image-pair() has isolation: isolate set on it in the view transition style sheet so that its children can be blended with non-normal blend modes without affecting other visual outputs." + "doc": "The ::view-transition-image-pair() CSS pseudo-element represents a container for a view transition's \"old\" and \"new\" view states — before and after the transition.\n

    During a view transition, ::view-transition-image-pair() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of a ::view-transition-group(). In terms of children, it can have a ::view-transition-new() or a ::view-transition-old(), or both.\n

    ::view-transition-image-pair() is given the following default styling in the UA stylesheet:\n

    \n```css\n:root::view-transition-image-pair(*) {\n  position: absolute;\n  inset: 0;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n```\n
    \n

    During a view transition, ::view-transition-image-pair() has isolation: isolate set on it in the view transition style sheet so that its children can be blended with non-normal blend modes without affecting other visual outputs." }, "view-transition-new": { - "url": "$MDN_URL$/web/css/_doublecolon_view-transition-new", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_view-transition-new", "status": [ "StandardTrack" ], @@ -22980,10 +23315,10 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ::view-transition-new() CSS pseudo-element represents the \"new\" view state of a view transition — a snapshot live representation of the state after the transition.\n

    During a view transition, ::view-transition-new() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of a ::view-transition-image-pair(), and never has any children.\n

    It is a replaced element and therefore can be manipulated with properties such as object-fit and object-position. It has natural dimensions equal to the content's size.\n

    The following default styling is included in the UA stylesheet:\n

    \n```css\n:root::view-transition-old(*),\n:root::view-transition-new(*) {\n  position: absolute;\n  inset-block-start: 0;\n  inline-size: 100%;\n  block-size: auto;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n/* Keyframes for blending when there are 2 images */\n@keyframes -ua-mix-blend-mode-plus-lighter {\n  from {\n    mix-blend-mode: plus-lighter;\n  }\n  to {\n    mix-blend-mode: plus-lighter;\n  }\n}\n@keyframes -ua-view-transition-fade-in {\n  from {\n    opacity: 0;\n  }\n}\n```\n
    \n
    \n

    Note:\nAdditional view transition styles are also setup to animate ::view-transition-new(). These are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    " + "doc": "The ::view-transition-new() CSS pseudo-element represents the \"new\" view state of a view transition — a snapshot live representation of the state after the transition.\n

    During a view transition, ::view-transition-new() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of a ::view-transition-image-pair(), and never has any children.\n

    It is a replaced element and therefore can be manipulated with properties such as object-fit and object-position. It has natural dimensions equal to the content's size.\n

    The following default styling is included in the UA stylesheet:\n

    \n```css\n:root::view-transition-old(*),\n:root::view-transition-new(*) {\n  position: absolute;\n  inset-block-start: 0;\n  inline-size: 100%;\n  block-size: auto;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n/* Keyframes for blending when there are 2 images */\n@keyframes -ua-mix-blend-mode-plus-lighter {\n  from {\n    mix-blend-mode: plus-lighter;\n  }\n  to {\n    mix-blend-mode: plus-lighter;\n  }\n}\n@keyframes -ua-view-transition-fade-in {\n  from {\n    opacity: 0;\n  }\n}\n```\n
    \n
    \n

    Note:\nAdditional view transition styles are also setup to animate ::view-transition-new(). These are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    " }, "view-transition-old": { - "url": "$MDN_URL$/web/css/_doublecolon_view-transition-old", + "url": "$MDN_URL$/web/css/reference/selectors/_doublecolon_view-transition-old", "status": [ "StandardTrack" ], @@ -23001,7 +23336,7 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ::view-transition-old() CSS pseudo-element represents the \"old\" view state of a view transition — a static snapshot of the old view, before the transition.\n

    During a view transition, ::view-transition-old() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree, provided there's an \"old\" view state to represent. It is only ever a child of a ::view-transition-image-pair(), and never has any children.\n

    It is a replaced element and therefore can be manipulated with properties such as object-fit and object-position. It has natural dimensions equal to the content's size.\n

    The following default styling is included in the UA stylesheet:\n

    \n```css\n:root::view-transition-old(*),\n:root::view-transition-new(*) {\n  position: absolute;\n  inset-block-start: 0;\n  inline-size: 100%;\n  block-size: auto;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n/* Keyframes for blending when there are 2 images */\n@keyframes -ua-mix-blend-mode-plus-lighter {\n  from {\n    mix-blend-mode: plus-lighter;\n  }\n  to {\n    mix-blend-mode: plus-lighter;\n  }\n}\n@keyframes -ua-view-transition-fade-out {\n  to {\n    opacity: 0;\n  }\n}\n```\n
    \n
    \n

    Note:\nAdditional view transition styles are also setup to animate ::view-transition-old(). These are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    " + "doc": "The ::view-transition-old() CSS pseudo-element represents the \"old\" view state of a view transition — a static snapshot of the old view, before the transition.\n

    During a view transition, ::view-transition-old() is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree, provided there's an \"old\" view state to represent. It is only ever a child of a ::view-transition-image-pair(), and never has any children.\n

    It is a replaced element and therefore can be manipulated with properties such as object-fit and object-position. It has natural dimensions equal to the content's size.\n

    The following default styling is included in the UA stylesheet:\n

    \n```css\n:root::view-transition-old(*),\n:root::view-transition-new(*) {\n  position: absolute;\n  inset-block-start: 0;\n  inline-size: 100%;\n  block-size: auto;\n  animation-duration: inherit;\n  animation-fill-mode: inherit;\n  animation-delay: inherit;\n}\n/* Keyframes for blending when there are 2 images */\n@keyframes -ua-mix-blend-mode-plus-lighter {\n  from {\n    mix-blend-mode: plus-lighter;\n  }\n  to {\n    mix-blend-mode: plus-lighter;\n  }\n}\n@keyframes -ua-view-transition-fade-out {\n  to {\n    opacity: 0;\n  }\n}\n```\n
    \n
    \n

    Note:\nAdditional view transition styles are also setup to animate ::view-transition-old(). These are dynamically generated during the view transition; see the specification setup transition pseudo-elements and update pseudo-element styles sections for more details.\n

    " } } } \ No newline at end of file diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/DomEvents.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/DomEvents.json index 2cad5a088e72..c0c2ad493dee 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/DomEvents.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/DomEvents.json @@ -200,7 +200,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "The afterprint event is fired after the associated document has started printing or the print preview has been closed.\nThe beforeprint and afterprint events allow pages to change their content before printing starts (perhaps to remove a banner, for example) and then revert those changes after printing has completed. In general, you should prefer the use of a @media print CSS at-rule, but it may be necessary to use these events in some cases." + "doc": "The afterprint event is fired after the associated document has started printing or the print preview has been closed.\nThe beforeprint and afterprint events allow pages to change their content before printing starts (perhaps to remove a banner, for example) and then revert those changes after printing has completed. In general, you should prefer the use of a @media print CSS at-rule, but it may be necessary to use these events in some cases." }, "afterscriptexecute": { "url": "$MDN_URL$/web/api/element/afterscriptexecute_event", @@ -224,7 +224,7 @@ "baseline": { "level": "NONE" }, - "doc": "The animationcancel event is fired when a CSS Animation unexpectedly aborts. In other words, any time it stops running without sending an animationend event. This might happen when the animation-name is changed such that the animation is removed, or when the animating node is hidden using CSS. Therefore, either directly or because any of its containing nodes are hidden.\nAn event handler for this event can be added by setting the onanimationcancel property, or using addEventListener()." + "doc": "The animationcancel event is fired when a CSS Animation unexpectedly aborts. In other words, any time it stops running without sending an animationend event. This might happen when the animation-name is changed such that the animation is removed, or when the animating node is hidden using CSS. Therefore, either directly or because any of its containing nodes are hidden.\nAn event handler for this event can be added by setting the onanimationcancel property, or using addEventListener()." }, "animationend": { "url": "$MDN_URL$/web/api/element/animationend_event", @@ -246,7 +246,7 @@ "lowDate": "2019-12-17", "highDate": "2022-06-17" }, - "doc": "The animationend event is fired when a CSS Animation has completed. If the animation aborts before reaching completion, such as if the element is removed from the DOM or the animation is removed from the element, the animationend event is not fired." + "doc": "The animationend event is fired when a CSS Animation has completed. If the animation aborts before reaching completion, such as if the element is removed from the DOM or the animation is removed from the element, the animationend event is not fired." }, "animationiteration": { "url": "$MDN_URL$/web/api/element/animationiteration_event", @@ -268,7 +268,7 @@ "lowDate": "2019-12-17", "highDate": "2022-06-17" }, - "doc": "The animationiteration event is fired when an iteration of a CSS Animation ends, and another one begins. This event does not occur at the same time as the animationend event, and therefore does not occur for animations with an animation-iteration-count of one." + "doc": "The animationiteration event is fired when an iteration of a CSS Animation ends, and another one begins. This event does not occur at the same time as the animationend event, and therefore does not occur for animations with an animation-iteration-count of one." }, "animationstart": { "url": "$MDN_URL$/web/api/element/animationstart_event", @@ -290,7 +290,7 @@ "lowDate": "2019-12-17", "highDate": "2022-06-17" }, - "doc": "The animationstart event is fired when a CSS Animation has started. If there is an animation-delay, this event will fire once the delay period has expired. A negative delay will cause the event to fire with an elapsedTime equal to the absolute value of the delay (and, correspondingly, the animation will begin playing at that time index into the sequence)." + "doc": "The animationstart event is fired when a CSS Animation has started. If there is an animation-delay, this event will fire once the delay period has expired. A negative delay will cause the event to fire with an elapsedTime equal to the absolute value of the delay (and, correspondingly, the animation will begin playing at that time index into the sequence)." }, "appinstalled": { "url": "$MDN_URL$/web/api/window/appinstalled_event", @@ -424,7 +424,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "The beforeprint event is fired when the associated document is about to be printed or previewed for printing.\nThe afterprint and beforeprint events allow pages to change their content before printing starts (perhaps to remove a banner, for example) and then revert those changes after printing has completed. In general, you should prefer the use of a @media print CSS at-rule, but it may be necessary to use these events in some cases." + "doc": "The beforeprint event is fired when the associated document is about to be printed or previewed for printing.\nThe afterprint and beforeprint events allow pages to change their content before printing starts (perhaps to remove a banner, for example) and then revert those changes after printing has completed. In general, you should prefer the use of a @media print CSS at-rule, but it may be necessary to use these events in some cases." }, "beforescriptexecute": { "url": "$MDN_URL$/web/api/element/beforescriptexecute_event", @@ -465,10 +465,13 @@ "Edge": "79", "Firefox": "93", "FirefoxAndroid": "93", - "Opera": "22" + "Opera": "22", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The beginEvent event of the SVGAnimationElement interface is fired when the element local timeline begins to play. It will be raised each time the element begins the active duration (i.e., when it restarts, but not when it repeats).\nIt may be raised both in the course of normal (i.e., scheduled or interactive) timeline play, as well as in the case that the element was begun with a DOM method.\nThis event is not cancelable and does not bubble." }, @@ -576,7 +579,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The cancel event fires on a <dialog> element when the user instructs the browser that they wish to dismiss the current open dialog. The browser fires this event when the user presses the Esc key.\nThis event is cancelable but can not bubble.\nWhen a <dialog> is dismissed with the Esc key, both the cancel and close events are fired." + "doc": "The cancel event fires on a <dialog> element when the user triggers a close request.\nThe cancel event handler can be used to override the default behavior on receiving a close request, and prevent the dialog from closing.\nIf the default behavior is not prevented, the dialog will close and fire a close event.\nClose requests might be triggered by:\nThis event is cancelable and does not bubble." }, "canplay": { "url": "$MDN_URL$/web/api/htmlmediaelement/canplay_event", @@ -1392,13 +1395,17 @@ "StandardTrack" ], "compatibility": { + "Chrome": "143", + "ChromeAndroid": "143", + "Edge": "143", "Firefox": "89", "FirefoxAndroid": "89", "Safari": "16", "SafariIOS": "16" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-05" }, "doc": "The gamepadconnected event is fired when the browser detects that a gamepad has been connected or the first time a button/axis of the gamepad is used.\nThe event will not fire if disallowed by the document's gamepad Permissions Policy.\nThis event is not cancelable and does not bubble." }, @@ -1408,13 +1415,17 @@ "StandardTrack" ], "compatibility": { + "Chrome": "143", + "ChromeAndroid": "143", + "Edge": "143", "Firefox": "89", "FirefoxAndroid": "89", "Safari": "16", "SafariIOS": "16" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-05" }, "doc": "The gamepaddisconnected event is fired when the browser detects that a gamepad has been disconnected.\nThe event will not fire if disallowed by the document's gamepad Permissions Policy.\nThis event is not cancelable and does not bubble." }, @@ -2577,7 +2588,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The pointermove event is fired when a pointer changes coordinates, and the pointer has not been canceled by a browser touch-action. It's very similar to the mousemove event, but with more features.\nThese events happen whether or not any pointer buttons are pressed. They can fire at a very high rate, depends on how fast the user moves the pointer, how fast the machine is, what other tasks and processes are happening, etc." + "doc": "The pointermove event is fired when a pointer changes coordinates, and the pointer has not been canceled by a browser touch-action. It's very similar to the mousemove event, but with more features.\nThese events happen whether or not any pointer buttons are pressed. They can fire at a very high rate, depends on how fast the user moves the pointer, how fast the machine is, what other tasks and processes are happening, etc." }, "pointerout": { "url": "$MDN_URL$/web/api/element/pointerout_event", @@ -2824,10 +2835,13 @@ "Edge": "79", "Firefox": "93", "FirefoxAndroid": "93", - "Opera": "22" + "Opera": "22", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The repeatEvent event of the SVGAnimationElement interface is fired when the element's local timeline repeats. It will be fired each time the element repeats, after the first iteration.\nThis event is not cancelable and does not bubble." }, @@ -3588,7 +3602,7 @@ "lowDate": "2020-11-19", "highDate": "2023-05-19" }, - "doc": "The transitioncancel event is fired when a CSS transition is canceled." + "doc": "The transitioncancel event is fired when a CSS transition is canceled." }, "transitionend": { "url": "$MDN_URL$/web/api/element/transitionend_event", @@ -3610,7 +3624,7 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "The transitionend event is fired when a CSS transition has completed. In the case where a transition is removed before completion, such as if the transition-property is removed or display is set to none, then the event will not be generated.\nThe transitionend event is fired in both directions - as it finishes transitioning to the transitioned state, and when it fully reverts to the default or non-transitioned state. If there is no transition delay or duration, if both are 0s or neither is declared, there is no transition, and none of the transition events are fired. If the transitioncancel event is fired, the transitionend event will not fire.\nThis event is not cancelable." + "doc": "The transitionend event is fired when a CSS transition has completed. In the case where a transition is removed before completion, such as if the transition-property is removed or display is set to none, then the event will not be generated.\nThe transitionend event is fired in both directions - as it finishes transitioning to the transitioned state, and when it fully reverts to the default or non-transitioned state. If there is no transition delay or duration, if both are 0s or neither is declared, there is no transition, and none of the transition events are fired. If the transitioncancel event is fired, the transitionend event will not fire.\nThis event is not cancelable." }, "transitionrun": { "url": "$MDN_URL$/web/api/element/transitionrun_event", @@ -3632,7 +3646,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "The transitionrun event is fired when a CSS transition is first created, i.e., before any transition-delay has begun.\nThis event is not cancelable." + "doc": "The transitionrun event is fired when a CSS transition is first created, i.e., before any transition-delay has begun.\nThis event is not cancelable." }, "transitionstart": { "url": "$MDN_URL$/web/api/element/transitionstart_event", @@ -3654,7 +3668,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "The transitionstart event is fired when a CSS transition has actually started, i.e., after any transition-delay has ended.\nThis event is not cancelable." + "doc": "The transitionstart event is fired when a CSS transition has actually started, i.e., after any transition-delay has ended.\nThis event is not cancelable." }, "unhandledrejection": { "url": "$MDN_URL$/web/api/window/unhandledrejection_event", @@ -3677,8 +3691,7 @@ "unload": { "url": "$MDN_URL$/web/api/window/unload_event", "status": [ - "StandardTrack", - "Deprecated" + "StandardTrack" ], "compatibility": { "Chrome": "", diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/GlobalObjects.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/GlobalObjects.json index 71dd5ab5f5a1..3ca32cdfa759 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/GlobalObjects.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/GlobalObjects.json @@ -31,7 +31,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The AggregateError object represents an error when several errors need to be wrapped in a single error. It is thrown when multiple errors need to be reported by an operation, for example by Promise.any(), when all promises passed to it reject.\n

    AggregateError is a subclass of Error." + "doc": "The AggregateError object represents an error when several errors need to be wrapped in a single error. It is thrown when multiple errors need to be reported by an operation, for example by Promise.any(), when all promises passed to it reject.\n

    Compared to SuppressedError, AggregateError represents a list of unrelated errors, while SuppressedError represents an error that happened during the handling of another error.\n

    AggregateError is a subclass of Error." }, "aggregateerror.aggregateerror": { "url": "$MDN_URL$/web/javascript/reference/global_objects/aggregateerror/aggregateerror", @@ -1246,8 +1246,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The toReversed() method of Array instances is the copying counterpart of the reverse() method. It returns a new array with the elements in reversed order.", "returns": "A new array containing the elements in reversed order." @@ -1270,8 +1271,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The toSorted() method of Array instances is the copying version of the sort() method. It returns a new array with the elements sorted in ascending order.", "parameters": { @@ -1297,8 +1299,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The toSpliced() method of Array instances is the copying version of the splice() method. It returns a new array with some elements removed and/or replaced at a given index.", "parameters": { @@ -1404,8 +1407,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The with() method of Array instances is the copying version of using the bracket notation to change the value of a given index. It returns a new array with the element at the given index replaced with the given value.", "parameters": { @@ -1988,7 +1992,7 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The AsyncFunction() constructor creates AsyncFunction objects.\n

    Note that AsyncFunction is not a global object. It can be obtained with the following code:\n

    \n```js\nconst AsyncFunction = async function () {}.constructor;\n```\n
    \n

    The AsyncFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to AsyncFunction()." + "doc": "

    \n

    Warning:\nThe arguments passed to this constructor are dynamically parsed and executed as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always passing TrustedScript objects instead of strings and enforcing trusted types.\n

    See Security considerations in the Function() constructor reference for more information.\n

    \n

    The AsyncFunction() constructor creates AsyncFunction objects.\n

    Note that AsyncFunction is not a global object. It can be obtained with the following code:\n

    \n```js\nconst AsyncFunction = async function () {}.constructor;\n```\n
    \n

    The AsyncFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to AsyncFunction()." }, "asyncgenerator": { "url": "$MDN_URL$/web/javascript/reference/global_objects/asyncgenerator", @@ -2144,7 +2148,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The AsyncGeneratorFunction() constructor creates AsyncGeneratorFunction objects.\n

    Note that AsyncGeneratorFunction is not a global object. It could be obtained by evaluating the following code.\n

    \n```js\nconst AsyncGeneratorFunction = async function* () {}.constructor;\n```\n
    \n

    The AsyncGeneratorFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to AsyncGeneratorFunction()." + "doc": "

    \n

    Warning:\nThe arguments passed to this constructor are dynamically parsed and executed as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always passing TrustedScript objects instead of strings and enforcing trusted types.\n

    See Security considerations in the Function() constructor reference for more information.\n

    \n

    The AsyncGeneratorFunction() constructor creates AsyncGeneratorFunction objects.\n

    Note that AsyncGeneratorFunction is not a global object. It could be obtained by evaluating the following code.\n

    \n```js\nconst AsyncGeneratorFunction = async function* () {}.constructor;\n```\n
    \n

    The AsyncGeneratorFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to AsyncGeneratorFunction()." }, "asyncgeneratorfunction.prototype": { "url": "$MDN_URL$/web/javascript/reference/global_objects/asyncgeneratorfunction/prototype", @@ -2172,7 +2176,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "An AsyncIterator object is an object that conforms to the async iterator protocol by providing a next() method that returns a promise fulfilling to an iterator result object. The AsyncIterator.prototype object is a hidden global object that all built-in async iterators inherit from. It provides an [Symbol.asyncIterator]() method that returns the async iterator object itself, making the async iterator also async iterable.\n

    Note that AsyncIterator is not a global object, although it will be in the future with the async iterator helpers proposal. The AsyncIterator.prototype object shared by all built-in async iterators can be obtained with the following code:\n

    \n```js\nconst AsyncIteratorPrototype = Object.getPrototypeOf(\n  Object.getPrototypeOf(Object.getPrototypeOf((async function* () {})())),\n);\n```\n
    " + "doc": "An AsyncIterator object is an object that conforms to the async iterator protocol by providing a next() method that returns a promise fulfilling to an iterator result object. The AsyncIterator.prototype object is a hidden global object that all built-in async iterators inherit from. It provides a [Symbol.asyncIterator]() method that returns the async iterator object itself, making the async iterator also async iterable.\n

    Note that AsyncIterator is not a global object, although it will be in the future with the async iterator helpers proposal. The AsyncIterator.prototype object shared by all built-in async iterators can be obtained with the following code:\n

    \n```js\nconst AsyncIteratorPrototype = Object.getPrototypeOf(\n  Object.getPrototypeOf(Object.getPrototypeOf((async function* () {})())),\n);\n```\n
    " }, "asynciterator.symbol.asyncdispose": { "url": "$MDN_URL$/web/javascript/reference/global_objects/asynciterator/symbol.asyncdispose", @@ -2634,9 +2638,9 @@ "StandardTrack" ], "compatibility": { - "Chrome": "87", - "ChromeAndroid": "89", - "Edge": "87", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "145", "FirefoxAndroid": "145", "Opera": "75", @@ -2646,7 +2650,8 @@ "Deno": "1.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-11-11" }, "doc": "The Atomics.waitAsync() static method verifies that a shared memory location contains a given value, immediately returning an object with the value property containing the string \"not-equal\" if the memory location does not match the given value, or \"timed-out\" if the timeout was set to zero. Otherwise the method returns an object where the value property is a Promise that fulfills with either \"ok\" when Atomics.notify() is called, or \"timed-out\" if the timeout expires.\n

    Atomics.waitAsync() and Atomics.notify() are used together to enable thread synchronization based on a value in shared memory. A thread can proceed immediately if the synchronization value has changed, or it can wait for notification from another thread when it reaches the synchronization point.\n

    This method only works with an Int32Array or BigInt64Array that views a SharedArrayBuffer. It is non-blocking and, unlike Atomics.wait(), can be used on the main thread. Because it does not block the whole thread, you still need to be careful not to access the shared memory before the promise settles.", "parameters": { @@ -2838,7 +2843,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The toLocaleString() method of BigInt values returns a string with a language-sensitive representation of this BigInt. In implementations with Intl.NumberFormat API support, this method delegates to Intl.NumberFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.NumberFormat object and use its format() method, because a NumberFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of BigInt values returns a string with a language-sensitive representation of this BigInt. In implementations with Intl.NumberFormat API support, this method delegates to Intl.NumberFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.NumberFormat object and use its format() method, because a NumberFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.NumberFormat() constructor.\n

    In implementations without Intl.NumberFormat support, this parameter is ignored and the host's locale is usually used.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.NumberFormat() constructor.\n

    In implementations without Intl.NumberFormat support, this parameter is ignored." @@ -3326,6 +3331,7 @@ "Opera": "120", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "24.0.0", "Deno": "1.43" }, "baseline": { @@ -3676,6 +3682,7 @@ "Opera": "120", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "24.0.0", "Deno": "1.43" }, "baseline": { @@ -5133,7 +5140,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The toLocaleDateString() method of Date instances returns a string with a language-sensitive representation of the date portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleDateString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleDateString() method of Date instances returns a string with a language-sensitive representation of the date portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleDateString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored and the host's locale is usually used.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. The timeStyle option must be undefined, or a TypeError would be thrown. If weekday, year, month, and day are all undefined, then year, month, and day will be set to \"numeric\".\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored." @@ -5162,7 +5169,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The toLocaleString() method of Date instances returns a string with a language-sensitive representation of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Date instances returns a string with a language-sensitive representation of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored and the host's locale is usually used.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. If weekday, year, month, day, dayPeriod, hour, minute, second, and fractionalSecondDigits are all undefined, then year, month, day, hour, minute, second will be set to \"numeric\".\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored." @@ -5191,7 +5198,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The toLocaleTimeString() method of Date instances returns a string with a language-sensitive representation of the time portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleTimeString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleTimeString() method of Date instances returns a string with a language-sensitive representation of the time portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleTimeString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored and the host's locale is usually used.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. If dayPeriod, hour, minute, second, and fractionalSecondDigits are all undefined, then hour, minute, second will be set to \"numeric\".\n

    In implementations without Intl.DateTimeFormat support, this parameter is ignored." @@ -5226,10 +5233,12 @@ "date.totemporalinstant": { "url": "$MDN_URL$/web/javascript/reference/global_objects/date/totemporalinstant", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -5237,7 +5246,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toTemporalInstant() method of Date instances returns a new Temporal.Instant object with the same epochMilliseconds value as this date's timestamp.\n

    Use this method to convert legacy Date values to the Temporal API, then further convert it to other Temporal classes as necessary.", + "doc": "The toTemporalInstant() method of Date instances returns a new Temporal.Instant object with the same epochMilliseconds value as this date's timestamp.\n

    Use this method to convert legacy Date values to the Temporal API, then further convert it to other Temporal classes as necessary.", "returns": "A new Temporal.Instant object with the same epochMilliseconds value as this date's timestamp. Its microsecond and nanosecond components are always 0.", "throws": { "RangeError": "Thrown if the date is invalid (it has a timestamp of NaN)." @@ -5807,6 +5816,7 @@ "Firefox": "138", "FirefoxAndroid": "138", "Opera": "119", + "Nodejs": "24.3.0", "Deno": "2.2" }, "baseline": { @@ -5974,11 +5984,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    \n

    Warning:\nExecuting JavaScript from a string is an enormous security risk. It is far too easy for a bad actor to run arbitrary code when you use eval(). See Never use direct eval()!, below.\n

    \n

    The eval() function evaluates JavaScript code represented as a string and returns its completion value. The source is parsed as a script.", + "doc": "

    \n

    Warning:\nThe argument passed to this function is dynamically parsed and executed as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always passing TrustedScript objects instead of strings and enforcing trusted types.\n

    See Security considerations for more information.\n

    \n

    The eval() function evaluates JavaScript code represented as a string and returns its completion value. The source is parsed as a script.", "parameters": { - "script": "A string representing a JavaScript expression, statement, or sequence of statements. The expression can include variables and properties of existing objects. It will be parsed as a script, so import declarations (which can only exist in modules) are not allowed." + "script": "A TrustedScript instance or string representing a JavaScript expression, statement, or sequence of statements. The expression can include variables and properties of existing objects. It will be parsed as a script, so import declarations (which can only exist in modules) are not allowed." }, - "returns": "The completion value of evaluating the given code. If the completion value is empty, undefined is returned. If script is not a string primitive, eval() returns the argument unchanged." + "returns": "The completion value of evaluating the given code. If the completion value is empty, undefined is returned. If script is not a TrustedScript or string primitive, eval() returns the argument unchanged.", + "throws": { + "SyntaxError": "The script parameter cannot be parsed as a script.", + "TypeError": "script is a string when Trusted Types are enforced by a CSP and no default policy is defined." + } }, "evalerror": { "url": "$MDN_URL$/web/javascript/reference/global_objects/evalerror", @@ -6500,10 +6514,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Function() constructor creates Function objects. Calling the constructor directly can create functions dynamically, but suffers from security and similar (but far less significant) performance issues as eval(). However, unlike eval (which may have access to the local scope), the Function constructor creates functions which execute in the global scope only.", + "doc": "

    \n

    Warning:\nThe arguments passed to this constructor are dynamically parsed and executed as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always passing TrustedScript objects instead of strings and enforcing trusted types.\n

    See Security considerations for more information.\n

    \n

    The Function() constructor creates Function objects. Calling the constructor directly can create functions dynamically, but suffers from security and similar (but far less significant) performance issues as eval(). However, unlike eval (which may have access to the local scope), the Function constructor creates functions which execute in the global scope only.", "parameters": { - "arg1, …, argN": "Names to be used by the function as formal argument names. Each must be a string that corresponds to a valid JavaScript parameter (any of plain identifier, rest parameter, or destructured parameter, optionally with a default), or a list of such strings separated with commas.\n

    As the parameters are parsed in the same way as function expressions, whitespace and comments are accepted. For example: \"x\", \"theValue = 42\", \"[a, b] /* numbers */\" — or \"x, theValue = 42, [a, b] /* numbers */\". (\"x, theValue = 42\", \"[a, b]\" is also correct, though very confusing to read.)", - "functionBody": "A string containing the JavaScript statements comprising the function definition." + "arg1, …, argN": "TrustedScript instances or strings specifying names to be used by the function as formal argument names. The value must correspond to a valid JavaScript parameter (any of plain identifier, rest parameter, or destructured parameter, optionally with a default), or a list of such strings separated with commas.\n

    As the parameters are parsed in the same way as function expressions, whitespace and comments are accepted. For example: \"x\", \"theValue = 42\", \"[a, b] /* numbers */\" — or \"x, theValue = 42, [a, b] /* numbers */\". (\"x, theValue = 42\", \"[a, b]\" is also correct, though very confusing to read.)", + "functionBody": "A TrustedScript or a string containing the JavaScript statements comprising the function definition." + }, + "throws": { + "SyntaxError": "Function parameter arguments can't be parsed as a valid parameter list, or the functionBody can't be parsed as valid JavaScript statements.", + "TypeError": "Any parameter is a string when Trusted Types are enforced by a CSP and no default policy is defined." } }, "function.length": { @@ -6584,7 +6602,7 @@ "parameters": { "value": "The object to test. Primitive values always return false." }, - "returns": "true if func.prototype is in the prototype chain of value; otherwise, false. Always returns false if value is not an object or this is not a function. If this is a bound function, returns the result of a instanceof test on value and the underlying target function.", + "returns": "true if func.prototype is in the prototype chain of value; otherwise, false. Always returns false if value is not an object or this is not a function. If this is a bound function, returns the result of an instanceof test on value and the underlying target function.", "throws": { "TypeError": "Thrown if this is not a bound function and this.prototype is not an object." } @@ -6636,7 +6654,7 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The Generator object is returned by a generator function and it conforms to both the iterable protocol and the iterator protocol.\n

    Generator is a subclass of the hidden Iterator class." + "doc": "The Generator object is returned by a generator function and it conforms to both the iterable protocol and the iterator protocol.\n

    Generator is a subclass of the Iterator class." }, "generator.next": { "url": "$MDN_URL$/web/javascript/reference/global_objects/generator/next", @@ -6777,7 +6795,7 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The GeneratorFunction() constructor creates GeneratorFunction objects.\n

    Note that GeneratorFunction is not a global object. It can be obtained with the following code:\n

    \n```js\nconst GeneratorFunction = function* () {}.constructor;\n```\n
    \n

    The GeneratorFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to GeneratorFunction()." + "doc": "

    \n

    Warning:\nThe arguments passed to this constructor are dynamically parsed and executed as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always passing TrustedScript objects instead of strings and enforcing trusted types.\n

    See Security considerations in the Function() constructor reference for more information.\n

    \n

    The GeneratorFunction() constructor creates GeneratorFunction objects.\n

    Note that GeneratorFunction is not a global object. It can be obtained with the following code:\n

    \n```js\nconst GeneratorFunction = function* () {}.constructor;\n```\n
    \n

    The GeneratorFunction() constructor is not intended to be used directly, and all caveats mentioned in the Function() description apply to GeneratorFunction()." }, "generatorfunction.prototype": { "url": "$MDN_URL$/web/javascript/reference/global_objects/generatorfunction/prototype", @@ -7244,10 +7262,10 @@ "hour12": "Whether to use 12-hour time (as opposed to 24-hour time). Possible values are true and false; the default is locale dependent. When true, this option sets hourCycle to either \"h11\" or \"h12\", depending on the locale. When false, it sets hourCycle to \"h23\". hour12 overrides both the hc locale extension tag and the hourCycle option, should either or both of those be present.", "hourCycle": "The hour cycle to use. Possible values are \"h11\", \"h12\", \"h23\", and \"h24\"; the default is inferred from hour12 and locale. This option can also be set through the hc Unicode extension key; if both are provided, this options property takes precedence.", "timeZone": "The time zone to use. Can be any IANA time zone name, including named identifiers such as \"UTC\", \"America/New_York\", and \"Etc/GMT+8\", and offset identifiers such as \"+01:00\", \"-2359\", and \"+23\". The default is the runtime's time zone, the same time zone used by Date.prototype.toString().", - "weekday": "The representation of the weekday. Possible values are:\n

    \n
    \"long\"
    \n
    \n

    E.g., Thursday\n

    \n
    \"short\"
    \n
    \n

    E.g., Thu\n

    \n
    \"narrow\"
    \n
    \n

    E.g., T. Two weekdays may have the same narrow style for some locales (e.g., Tuesday's narrow style is also T).\n

    \n
    ", + "weekday": "The representation of the weekday. Possible values are:\n
    \n
    \"long\"
    \n
    \n

    E.g., Thursday\n

    \n
    \"short\"
    \n
    \n

    E.g., Thu\n

    \n
    \"narrow\"
    \n
    \n

    E.g., T. Two weekdays may have the same narrow style for some locales (e.g., both Tuesday's and Thursday's narrow styles are T in the en-US locale).\n

    \n
    ", "era": "The representation of the era. Possible values are:\n
    \n
    \"long\"
    \n
    \n

    E.g., Anno Domini\n

    \n
    \"short\"
    \n
    \n

    E.g., AD\n

    \n
    \"narrow\"
    \n
    \n

    E.g., A\n

    \n
    ", "year": "The representation of the year. Possible values are \"numeric\" and \"2-digit\".", - "month": "The representation of the month. Possible values are:\n
    \n
    \"numeric\"
    \n
    \n

    E.g., 3\n

    \n
    \"2-digit\"
    \n
    \n

    E.g., 03\n

    \n
    \"long\"
    \n
    \n

    E.g., March\n

    \n
    \"short\"
    \n
    \n

    E.g., Mar\n

    \n
    \"narrow\"
    \n
    \n

    E.g., M). Two months may have the same narrow style for some locales (e.g., May's narrow style is also M).\n

    \n
    ", + "month": "The representation of the month. Possible values are:\n
    \n
    \"numeric\"
    \n
    \n

    E.g., 3\n

    \n
    \"2-digit\"
    \n
    \n

    E.g., 03\n

    \n
    \"long\"
    \n
    \n

    E.g., March\n

    \n
    \"short\"
    \n
    \n

    E.g., Mar\n

    \n
    \"narrow\"
    \n
    \n

    E.g., M. Two months may have the same narrow style for some locales (e.g., both March's and May's narrow styles are M in the en-US locale).\n

    \n
    ", "day": "The representation of the day. Possible values are \"numeric\" and \"2-digit\".", "dayPeriod": "The formatting style used for day periods like \"in the morning\", \"am\", \"noon\", \"n\" etc. Possible values are\n\"narrow\", \"short\", and \"long\".\n
    \n

    Note:\nThis option only has an effect if a 12-hour clock (hourCycle: \"h12\" or hourCycle: \"h11\") is used. Many locales use the same string irrespective of the width specified.\n

    ", "hour": "The representation of the hour. Possible values are \"numeric\" and \"2-digit\".", @@ -7512,7 +7530,7 @@ }, "doc": "The of() method of Intl.DisplayNames instances receives a code and returns a string based on the locale and options provided when instantiating this Intl.DisplayNames object.", "parameters": { - "code": "The code to provide depends on the type:\n" + "code": "The code to provide depends on the type:\n" }, "returns": "A language-specific formatted string, or undefined if there's no data for the input and fallback is \"none\".\n
    \n

    Note:\nfallback is only used if code is structurally valid. See using fallback.\n

    ", "throws": { @@ -8057,6 +8075,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "1.19" }, "baseline": { @@ -8077,6 +8096,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "1.19" }, "baseline": { @@ -8097,6 +8117,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "1.19" }, "baseline": { @@ -8117,6 +8138,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "1.19" }, "baseline": { @@ -8136,7 +8158,8 @@ "Edge": "130", "Opera": "115", "Safari": "17", - "SafariIOS": "17" + "SafariIOS": "17", + "Nodejs": "24.0.0" }, "baseline": { "level": "NONE" @@ -8156,6 +8179,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "1.19" }, "baseline": { @@ -8176,6 +8200,7 @@ "Opera": "115", "Safari": "17", "SafariIOS": "17", + "Nodejs": "24.0.0", "Deno": "2.1" }, "baseline": { @@ -8283,7 +8308,7 @@ "highDate": "2023-03-16" }, "doc": "The maximize() method of Intl.Locale instances gets the\nmost likely values for the language, script, and region of this locale based on\nexisting values.", - "returns": "A Intl.Locale instance whose baseName property returns\nthe result of the Add Likely Subtags algorithm executed against locale.baseName." + "returns": "An Intl.Locale instance whose baseName property returns\nthe result of the Add Likely Subtags algorithm executed against locale.baseName." }, "intl.locale.minimize": { "url": "$MDN_URL$/web/javascript/reference/global_objects/intl/locale/minimize", @@ -8308,7 +8333,7 @@ "highDate": "2023-03-16" }, "doc": "The minimize() method of Intl.Locale instances attempts to\nremove information about this locale that would be added by calling\nmaximize().", - "returns": "A Intl.Locale instance whose baseName property returns\nthe result of the Remove Likely Subtags algorithm\nexecuted against locale.baseName." + "returns": "An Intl.Locale instance whose baseName property returns\nthe result of the Remove Likely Subtags algorithm\nexecuted against locale.baseName." }, "intl.locale.numberingsystem": { "url": "$MDN_URL$/web/javascript/reference/global_objects/intl/locale/numberingsystem", @@ -8438,7 +8463,9 @@ ], "compatibility": { "Firefox": "141", - "FirefoxAndroid": "141" + "FirefoxAndroid": "141", + "Safari": "26", + "SafariIOS": "26" }, "doc": "The variants accessor property of Intl.Locale instances returns the variants associated with this locale, as a string of dash (-) separated identifiers in the originally specified order." }, @@ -8616,7 +8643,7 @@ "currency": "The currency to use in currency formatting. Possible values are the ISO 4217 currency codes, such as \"USD\" for the US dollar, \"EUR\" for the euro, or \"CNY\" for the Chinese RMB — see Intl.supportedValuesOf(). There is no default value; if the style is \"currency\", the currency property must be provided. It is normalized to uppercase.", "currencyDisplay": "How to display the currency in currency formatting.\n
    \n
    \"code\"
    \n
    \n

    Use the ISO currency code.\n

    \n
    \"symbol\" (default)
    \n
    \n

    Use a localized currency symbol such as €.\n

    \n
    \"narrowSymbol\"
    \n
    \n

    Use a narrow format symbol (\"$100\" rather than \"US$100\").\n

    \n
    \"name\"
    \n
    \n

    Use a localized currency name such as \"dollar\".\n

    \n
    ", "currencySign": "In many locales, accounting format means to wrap the number with parentheses instead of appending a minus sign. Possible values are \"standard\" and \"accounting\"; the default is \"standard\".", - "unit": "The unit to use in unit formatting, Possible values are listed in Intl.supportedValuesOf(). Pairs of simple units can be concatenated with \"-per-\" to make a compound unit. There is no default value; if the style is \"unit\", the unit property must be provided.", + "unit": "The unit to use in unit formatting. Possible values are listed in Intl.supportedValuesOf(). Pairs of simple units can be concatenated with \"-per-\" to make a compound unit. There is no default value; if the style is \"unit\", the unit property must be provided.", "unitDisplay": "The unit formatting style to use in unit formatting. Possible values are:\n
    \n
    \"short\" (default)
    \n
    \n

    E.g., 16 l.\n

    \n
    \"narrow\"
    \n
    \n

    E.g., 16l.\n

    \n
    \"long\"
    \n
    \n

    E.g., 16 litres.\n

    \n
    ", "minimumIntegerDigits": "The minimum number of integer digits to use. A value with a smaller number of integer digits than this number will be left-padded with zeros (to the specified length) when formatted. Possible values are from 1 to 21; the default is 1.", "minimumFractionDigits": "The minimum number of fraction digits to use. Possible values are from 0 to 100; the default for plain number and percent formatting is 0; the default for currency formatting is the number of minor unit digits provided by the ISO 4217 currency code list (2 if the list doesn't provide that information). See SignificantDigits/FractionDigits default values for when this default gets applied.", @@ -9370,6 +9397,24 @@ }, "doc": "An Iterator object is an object that conforms to the iterator protocol by providing a next() method that returns an iterator result object. All built-in iterators inherit from the Iterator class. The Iterator class provides a [Symbol.iterator]() method that returns the iterator object itself, making the iterator also iterable. It also provides some helper methods for working with iterators." }, + "iterator.concat": { + "url": "$MDN_URL$/web/javascript/reference/global_objects/iterator/concat", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Firefox": "147", + "FirefoxAndroid": "147" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The Iterator.concat() static method creates a new Iterator object from a list of iterable objects. The new iterator yields the values from each of the input iterables in sequence.", + "parameters": { + "it1, it2, …, itN": "An object that implements the iterable protocol. Iterators which are not also iterable cannot be passed directly to this method; they must first be wrapped using Iterator.from()." + }, + "returns": "A new Iterator object that yields the values from each of the input iterables in sequence." + }, "iterator.drop": { "url": "$MDN_URL$/web/javascript/reference/global_objects/iterator/drop", "status": [ @@ -9764,6 +9809,24 @@ "doc": "The toArray() method of Iterator instances creates a new Array instance populated with the elements yielded from the iterator.", "returns": "A new Array instance containing the elements from the iterator in the order they were produced." }, + "iterator.zip": { + "url": "$MDN_URL$/web/javascript/reference/global_objects/iterator/zip", + "doc": "The Iterator.zip() static method creates a new Iterator object that aggregates elements from multiple iterable objects by yielding arrays containing elements at the same position. It essentially \"zips\" the input iterables together, allowing simultaneous iteration over them.\n

    The Iterator.zipKeyed() method is similar, but yields objects instead of arrays with keys you can specify.", + "parameters": { + "iterables": "An iterable of iterables whose elements are aggregated. It must be iterable and cannot be an iterator. It should be finite, although its elements can be infinite iterables. Each element must implement either the iterable protocol or, failing that, the iterator protocol. Strings are rejected: to zip strings, convert them to iterators explicitly using Iterator.from().", + "options": "An object specifying behavior in case of inconsistent input lengths. It may have the following properties:\n

    \n
    mode Optional
    \n
    \n

    One of the following:\n

      \n
    • \"shortest\" (default): The resulting iterator stops when one input iterable is exhausted.
    • \n
    • \"longest\": The resulting iterator stops when all input iterables are exhausted. Missing values from shorter iterables are filled according to the padding option.
    • \n
    • \"strict\": A TypeError is thrown if not all input iterables finish at the same time.
    • \n
    \n
    \n
    padding Optional
    \n
    \n

    An iterable object (not iterator). Only retrieved and validated when mode is \"longest\". If undefined or absent, missing values from shorter iterables are filled with undefined (which is equivalent to passing an empty iterable). If an iterable is provided, it is iterated for the number of times equal to the number of elements in iterables as soon as Iterator.zip() is called. padding[i] is used for missing values for iterables[i] (assuming padding and iterables are provided as arrays; they don't have to be). If padding is shorter than iterables, undefined is used for the remaining iterables.\n

    \n
    " + }, + "returns": "A new Iterator object. Each of its elements is an array with length equal to the number of input iterables, containing the elements from each input iterable at the corresponding position. If the iterables object is empty, the resulting iterator is created as completed." + }, + "iterator.zipkeyed": { + "url": "$MDN_URL$/web/javascript/reference/global_objects/iterator/zipkeyed", + "doc": "The Iterator.zipKeyed() static method creates a new Iterator object that aggregates elements from multiple iterable objects by yielding objects containing elements at the same position, with keys specified by the input. It essentially \"zips\" the input iterables together, allowing simultaneous iteration over them.\n

    The Iterator.zip() method is similar, but yields arrays instead of objects.", + "parameters": { + "iterables": "An object. Each property's key is used as the key in the resulting objects. The property's value must implement either the iterable protocol or, failing that, the iterator protocol. These iterables may be infinite. Strings are rejected: to zip strings, convert them to iterators explicitly using Iterator.from().", + "options": "An object specifying behavior in case of inconsistent input lengths. It may have the following properties:\n

    \n
    mode Optional
    \n
    \n

    One of the following:\n

      \n
    • \"shortest\" (default): The resulting iterator stops when one input iterable is exhausted.
    • \n
    • \"longest\": The resulting iterator stops when all input iterables are exhausted. Missing values from shorter iterables are filled according to the padding option.
    • \n
    • \"strict\": A TypeError is thrown if not all input iterables finish at the same time.
    • \n
    \n
    \n
    padding Optional
    \n
    \n

    An object. Only retrieved and validated when mode is \"longest\". If undefined or absent, missing values from shorter iterables are filled with undefined (which is equivalent to passing an empty object). If an object is provided, each key of the iterables argument is retrieved as soon as Iterator.zipKeyed() is called. padding[key] is used for missing values for iterables[key]. If the padding object is missing some keys, those keys are filled with undefined.\n

    \n
    " + }, + "returns": "A new Iterator object. Each of its elements is an object with the same keys as the iterables argument, containing the elements from each input iterable at the corresponding position." + }, "json": { "url": "$MDN_URL$/web/javascript/reference/global_objects/json", "status": [ @@ -10066,17 +10129,21 @@ "map.getorinsert": { "url": "$MDN_URL$/web/javascript/reference/global_objects/map/getorinsert", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", "Firefox": "144", - "FirefoxAndroid": "144" + "FirefoxAndroid": "144", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The getOrInsert() method of Map instances returns the value corresponding to the specified key in this Map. If the key is not present, it inserts a new entry with the key and a given default value, and returns the inserted value.\n

    If the computation of the default value is expensive, consider using Map.prototype.getOrInsertComputed() instead, which takes a callback to compute the default value only if it's actually needed.", + "doc": "The getOrInsert() method of Map instances returns the value corresponding to the specified key in this Map. If the key is not present, it inserts a new entry with the key and a given default value, and returns the inserted value.\n

    If the computation of the default value is expensive, consider using Map.prototype.getOrInsertComputed() instead, which takes a callback to compute the default value only if it's actually needed.", "parameters": { "key": "The key of the value to return from the Map object. Object keys are compared by reference, not by value.", "defaultValue": "The value to insert and return if the key is not already present in the Map object." @@ -10086,22 +10153,29 @@ "map.getorinsertcomputed": { "url": "$MDN_URL$/web/javascript/reference/global_objects/map/getorinsertcomputed", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", "Firefox": "144", - "FirefoxAndroid": "144" + "FirefoxAndroid": "144", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The getOrInsertComputed() method of Map instances returns the value corresponding to the specified key in this Map. If the key is not present, it inserts a new entry with the key and a default value computed from a given callback, and returns the inserted value.\n

    Use this method instead of Map.prototype.getOrInsert() when the default value is expensive to compute, and you want to avoid computing it unless it's actually needed.", + "doc": "The getOrInsertComputed() method of Map instances returns the value corresponding to the specified key in this Map. If the key is not present, it inserts a new entry with the key and a default value computed from a given callback, and returns the inserted value.\n

    Use this method instead of Map.prototype.getOrInsert() when the default value is expensive to compute, and you want to avoid computing it unless it's actually needed.", "parameters": { "key": "The key of the element to return from the Map object. Object keys are compared by reference, not by value.", "callback": "A function that returns the value to insert and return if the key is not already present in the Map object. The function is called with the following argument:\n

    \n
    key
    \n
    \n

    The same key that was passed to getOrInsertComputed().\n

    \n
    " }, - "returns": "The value associated with the specified key in the Map object. If the key can't be found, the result of callback(key) is inserted and returned." + "returns": "The value associated with the specified key in the Map object. If the key can't be found, the result of callback(key) is inserted and returned.", + "throws": { + "TypeError": "Thrown if callback isn't callable." + } }, "map.groupby": { "url": "$MDN_URL$/web/javascript/reference/global_objects/map/groupby", @@ -10153,7 +10227,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The has() method of WeakMap instances returns a boolean indicating whether an entry with the specified key exists in this WeakMap or not.", + "doc": "The has() method of Map instances returns a boolean indicating whether an entry with the specified key exists in this Map or not.", "parameters": { "key": "The key of the entry to test for presence in the Map object. Object keys are compared by reference, not by value." }, @@ -10822,6 +10896,7 @@ "Opera": "120", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "24.0.0", "Deno": "1.43" }, "baseline": { @@ -11461,7 +11536,8 @@ "compatibility": { "Firefox": "137", "FirefoxAndroid": "137", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" @@ -11938,7 +12014,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The toLocaleString() method of Number values returns a string with a language-sensitive representation of this number. In implementations with Intl.NumberFormat API support, this method delegates to Intl.NumberFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.NumberFormat object and use its format() method, because a NumberFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Number values returns a string with a language-sensitive representation of this number. In implementations with Intl.NumberFormat API support, this method delegates to Intl.NumberFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.NumberFormat object and use its format() method, because a NumberFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.NumberFormat() constructor.\n

    In implementations without Intl.NumberFormat support, this parameter is ignored and the host's locale is usually used.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.NumberFormat() constructor.\n

    In implementations without Intl.NumberFormat support, this parameter is ignored." @@ -13276,9 +13352,9 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "The finally() method of Promise instances schedules a function to be called when the promise is settled (either fulfilled or rejected). It immediately returns another Promise object, allowing you to chain calls to other promise methods.\n

    This lets you avoid duplicating code in both the promise's then() and catch() handlers.", + "doc": "The finally() method of Promise instances schedules a function to be called when the promise is settled (either fulfilled or rejected). It immediately returns another Promise object, allowing you to chain calls to other promise methods.\n

    Like the finally block, this method is usually intended for cleanup actions, regardless of the promise's outcome. It lets you avoid duplicating code in both the promise's then() and catch() handlers.", "parameters": { - "onFinally": "A function to asynchronously execute when this promise becomes settled. Its return value is ignored unless the returned value is a rejected promise. The function is called with no arguments." + "onFinally": "A function to asynchronously execute when this promise becomes settled. If the function returns a promise, the resulting promise will wait for that promise to settle before continuing. If the returned promise is rejected, the resulting promise is rejected with the same reason. Any other returned value, or the fulfilled value of the returned promise, is ignored." }, "returns": "Returns a new Promise immediately. This new promise is always pending when returned, regardless of the current promise's status. If onFinally throws an error or returns a rejected promise, the new promise will reject with that value. Otherwise, the new promise will settle with the same state as the current promise." }, @@ -16496,7 +16572,7 @@ }, "doc": "

    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.

    \n

    The fontcolor() method of String values creates a string that embeds this string in a <font> element (<font color=\"...\">str</font>), which causes this string to be displayed in the specified font color.\n

    \n

    Note:\nAll HTML wrapper methods are deprecated and only standardized for compatibility purposes. For the case of fontcolor(), the <font> element itself has been removed from the HTML specification and shouldn't be used anymore. Web developers should use CSS properties instead.\n

    ", "parameters": { - "color": "A string expressing the color as a hexadecimal RGB triplet or as a string literal. String literals for color names are listed in the CSS color reference." + "color": "A string expressing the color as a hexadecimal RGB triplet or as a string literal. String literals for color names are listed in the CSS color reference." }, "returns": "A string beginning with a <font color=\"color\"> start tag (double quotes in color are replaced with &quot;), then the text str, and then a </font> end tag." }, @@ -17649,7 +17725,7 @@ "baseline": { "level": "NONE" }, - "doc": "The SuppressedError object represents an error generated while handing another error. It is generated during resource disposal using using or await using.\n

    Compared to AggregateError, SuppressedError is used to represent a single error that is suppressed by another error, while AggregateError represents a list of unrelated errors. It is possible, though, for a SuppressedError to contain a chain of suppressed errors (e.suppressed.suppressed.suppressed...). It is also semantically different from cause because the error is not caused by another error, but happens when handling another error.\n

    SuppressedError is a subclass of Error." + "doc": "The SuppressedError object represents an error generated while handing another error. It is generated during resource disposal using using or await using.\n

    Compared to AggregateError, SuppressedError represents an error that happened during the handling of another error, while AggregateError represents a list of unrelated errors. It is possible, though, for a SuppressedError to contain a chain of suppressed errors (e.suppressed.suppressed.suppressed...). It is also semantically different from cause because the error is not caused by another error, but happens when handling another error.\n

    SuppressedError is a subclass of Error." }, "suppressederror.error": { "url": "$MDN_URL$/web/javascript/reference/global_objects/suppressederror/error", @@ -17776,7 +17852,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The Symbol.asyncIterator static data property represents the well-known symbol Symbol.asyncIterator. The async iterable protocol looks up this symbol for the method that returns the async iterator for an object. In order for an object to be async iterable, it must have an [Symbol.asyncIterator] key." + "doc": "The Symbol.asyncIterator static data property represents the well-known symbol Symbol.asyncIterator. The async iterable protocol looks up this symbol for the method that returns the async iterator for an object. In order for an object to be async iterable, it must have a [Symbol.asyncIterator] key." }, "symbol.description": { "url": "$MDN_URL$/web/javascript/reference/global_objects/symbol/description", @@ -17920,7 +17996,7 @@ "lowDate": "2016-09-20", "highDate": "2019-03-20" }, - "doc": "The Symbol.iterator static data property represents the well-known symbol Symbol.iterator. The iterable protocol looks up this symbol for the method that returns the iterator for an object. In order for an object to be iterable, it must have an [Symbol.iterator] key." + "doc": "The Symbol.iterator static data property represents the well-known symbol Symbol.iterator. The iterable protocol looks up this symbol for the method that returns the iterator for an object. In order for an object to be iterable, it must have a [Symbol.iterator] key." }, "symbol.keyfor": { "url": "$MDN_URL$/web/javascript/reference/global_objects/symbol/keyfor", @@ -18323,25 +18399,29 @@ "temporal": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal object enables date and time management in various scenarios, including built-in time zone and calendar representation, wall-clock time conversions, arithmetics, formatting, and more. It is designed as a full replacement for the Date object." + "doc": "The Temporal object enables date and time management in various scenarios, including built-in time zone and calendar representation, wall-clock time conversions, arithmetics, formatting, and more. It is designed as a full replacement for the Date object." }, "temporal.duration": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18349,15 +18429,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Duration object represents a difference between two time points, which can be used in date/time arithmetic. It is fundamentally represented as a combination of years, months, weeks, days, hours, minutes, seconds, milliseconds, microseconds, and nanoseconds values." + "doc": "The Temporal.Duration object represents a difference between two time points, which can be used in date/time arithmetic. It is fundamentally represented as a combination of years, months, weeks, days, hours, minutes, seconds, milliseconds, microseconds, and nanoseconds values." }, "temporal.duration.abs": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/abs", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18365,23 +18447,25 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The abs() method of Temporal.Duration instances returns a new Temporal.Duration object with the absolute value of this duration (all fields have the same magnitude, but sign becomes positive).", + "doc": "The abs() method of Temporal.Duration instances returns a new Temporal.Duration object with the absolute value of this duration (all fields have the same magnitude, but sign becomes positive).", "returns": "A new Temporal.Duration object with the absolute value of this duration, which is either the same as this duration if it is already positive, or its negation if it is negative." }, "temporal.duration.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.Duration instances returns a new Temporal.Duration object with the sum of this duration and a given duration. The result is balanced.", + "doc": "The add() method of Temporal.Duration instances returns a new Temporal.Duration object with the sum of this duration and a given duration. The result is balanced.", "parameters": { "other": "A string, an object, or a Temporal.Duration instance representing a duration to add to this duration. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -18393,10 +18477,12 @@ "temporal.duration.blank": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/blank", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18404,15 +18490,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The blank accessor property of Temporal.Duration instances returns a boolean that is true if this duration represents a zero duration, and false otherwise. It is equivalent to duration.sign === 0." + "doc": "The blank accessor property of Temporal.Duration instances returns a boolean that is true if this duration represents a zero duration, and false otherwise. It is equivalent to duration.sign === 0." }, "temporal.duration.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18420,7 +18508,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Duration.compare() static method returns a number (-1, 0, or 1) indicating whether the first duration is shorter, equal to, or longer than the second duration.", + "doc": "The Temporal.Duration.compare() static method returns a number (-1, 0, or 1) indicating whether the first duration is shorter, equal to, or longer than the second duration.", "parameters": { "duration1": "A string, an object, or a Temporal.Duration instance representing the first duration to compare. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "duration2": "The second duration to compare, converted to a Temporal.Duration object using the same algorithm as duration1.", @@ -18434,10 +18522,12 @@ "temporal.duration.days": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/days", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18445,15 +18535,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The days accessor property of Temporal.Duration instances returns an integer representing the number of days in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above days, the days absolute value's range depends on the calendar (how many days are in a week or month).\n

    The set accessor of days is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The days accessor property of Temporal.Duration instances returns an integer representing the number of days in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above days, the days absolute value's range depends on the calendar (how many days are in a week or month).\n

    The set accessor of days is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.duration": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/duration", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18461,7 +18553,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Duration() constructor creates Temporal.Duration objects.\n

    This constructor allows you to create instances by directly supplying the underlying data. Like all other Temporal classes, you should usually construct Temporal.Duration objects using the Temporal.Duration.from() static method, which can handle a variety of input types.", + "doc": "The Temporal.Duration() constructor creates Temporal.Duration objects.\n

    This constructor allows you to create instances by directly supplying the underlying data. Like all other Temporal classes, you should usually construct Temporal.Duration objects using the Temporal.Duration.from() static method, which can handle a variety of input types.", "parameters": { "years": "Number of years, or undefined (which is treated as 0).", "months": "Number of months, or undefined (which is treated as 0).", @@ -18482,10 +18574,12 @@ "temporal.duration.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18493,7 +18587,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Duration.from() static method creates a new Temporal.Duration object from another Temporal.Duration object, an object with duration properties, or an ISO 8601 string.", + "doc": "The Temporal.Duration.from() static method creates a new Temporal.Duration object from another Temporal.Duration object, an object with duration properties, or an ISO 8601 string.", "parameters": { "info": "One of the following:\n

    " }, @@ -18506,10 +18600,12 @@ "temporal.duration.hours": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/hours", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18517,15 +18613,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The hours accessor property of Temporal.Duration instances returns an integer representing the number of hours in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above hours, the hours absolute value will be between 0 and 23, inclusive.\n

    The set accessor of hours is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The hours accessor property of Temporal.Duration instances returns an integer representing the number of hours in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above hours, the hours absolute value will be between 0 and 23, inclusive.\n

    The set accessor of hours is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.microseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/microseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18533,15 +18631,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The microseconds accessor property of Temporal.Duration instances returns an integer representing the number of microseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above microseconds, the microseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of microseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The microseconds accessor property of Temporal.Duration instances returns an integer representing the number of microseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above microseconds, the microseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of microseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.milliseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/milliseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18549,15 +18649,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The milliseconds accessor property of Temporal.Duration instances returns an integer representing the number of milliseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above milliseconds, the milliseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of milliseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The milliseconds accessor property of Temporal.Duration instances returns an integer representing the number of milliseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above milliseconds, the milliseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of milliseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.minutes": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/minutes", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18565,15 +18667,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The minutes accessor property of Temporal.Duration instances returns an integer representing the number of minutes in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above minutes, the minutes absolute value will be between 0 and 59, inclusive.\n

    The set accessor of minutes is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The minutes accessor property of Temporal.Duration instances returns an integer representing the number of minutes in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above minutes, the minutes absolute value will be between 0 and 59, inclusive.\n

    The set accessor of minutes is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.months": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/months", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18581,15 +18685,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The months accessor property of Temporal.Duration instances returns an integer representing the number of months in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above months, the months absolute value's range depends on the calendar (how many months are in a year).\n

    The set accessor of months is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The months accessor property of Temporal.Duration instances returns an integer representing the number of months in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above months, the months absolute value's range depends on the calendar (how many months are in a year).\n

    The set accessor of months is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.nanoseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/nanoseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18597,15 +18703,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The nanoseconds accessor property of Temporal.Duration instances returns an integer representing the number of nanoseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above nanoseconds, the nanoseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of nanoseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The nanoseconds accessor property of Temporal.Duration instances returns an integer representing the number of nanoseconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above nanoseconds, the nanoseconds absolute value will be between 0 and 999, inclusive.\n

    The set accessor of nanoseconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.negated": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/negated", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18613,23 +18721,25 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The negated() method of Temporal.Duration instances returns a new Temporal.Duration object with the negated value of this duration (all fields keep the same magnitude, but sign becomes reversed).", + "doc": "The negated() method of Temporal.Duration instances returns a new Temporal.Duration object with the negated value of this duration (all fields keep the same magnitude, but sign becomes reversed).", "returns": "A new Temporal.Duration object, where all fields have the same magnitude as this duration, but the sign is reversed (positive fields become negative, and vice versa)." }, "temporal.duration.round": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/round", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The round() method of Temporal.Duration instances returns a new Temporal.Duration object with the duration rounded to the given smallest unit and/or balanced to the given largest unit.", + "doc": "The round() method of Temporal.Duration instances returns a new Temporal.Duration object with the duration rounded to the given smallest unit and/or balanced to the given largest unit.", "parameters": { "smallestUnit": "A string representing the smallestUnit option. This is a convenience overload, so round(smallestUnit) is equivalent to round({ smallestUnit }), where smallestUnit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    largestUnit Optional
    \n
    \n

    Any of the temporal units: \"years\", \"months\", \"weeks\", \"days\", \"hours\", \"minutes\", \"seconds\", \"milliseconds\", \"microseconds\", \"nanoseconds\", or their singular forms, or the value \"auto\" which means the largest non-zero component of this duration or smallestUnit, whichever is greater. Defaults to \"auto\". The result will not contain units larger than this; for example, if the largest unit is \"minutes\", then \"1 hour 30 minutes\" will become \"90 minutes\".\n

    \n
    relativeTo Optional
    \n
    \n

    A zoned or plain date(time) that provides the time and calendar information to resolve calendar durations (see the link for the general interpretation of this option). Required if either this or other is a calendar duration, or smallestUnit is a calendar unit.\n

    \n
    roundingIncrement Optional
    \n
    \n

    A number (truncated to an integer) representing the rounding increment in the given smallestUnit. Defaults to 1. Must be in the inclusive range of 1 to 1e9. If the smallest unit is hours, minutes, seconds, milliseconds, microseconds, or nanoseconds, the increment must be a divisor of the maximum value of the unit; for example, if the unit is hours, the increment must be a divisor of 24 and must not be 24 itself, which means it can be 1, 2, 3, 4, 6, 8, or 12.\n

    \n
    roundingMode Optional
    \n
    \n

    A string representing the rounding mode specifying to round up or down in various scenarios. See Intl.NumberFormat(). Defaults to \"halfExpand\".\n

    \n
    smallestUnit Optional
    \n
    \n

    Any of the temporal units: \"years\", \"months\", \"weeks\", \"days\", \"hours\", \"minutes\", \"seconds\", \"milliseconds\", \"microseconds\", \"nanoseconds\", or their singular forms. Defaults to \"nanoseconds\". For units larger than \"nanoseconds\", fractional parts of the smallestUnit will be rounded according to the roundingIncrement and roundingMode settings. Must be smaller or equal to largestUnit. At least one of smallestUnit and largestUnit must be provided.\n

    \n
    " @@ -18642,10 +18752,12 @@ "temporal.duration.seconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/seconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18653,15 +18765,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The seconds accessor property of Temporal.Duration instances returns an integer representing the number of seconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above seconds, the seconds absolute value will be between 0 and 59, inclusive.\n

    The set accessor of seconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The seconds accessor property of Temporal.Duration instances returns an integer representing the number of seconds in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above seconds, the seconds absolute value will be between 0 and 59, inclusive.\n

    The set accessor of seconds is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.sign": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/sign", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18669,22 +18783,24 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The sign accessor property of Temporal.Duration instances returns 1 if this duration is positive, -1 if negative, and 0 if zero. Because a duration never has mixed signs, the sign of a duration is determined by the sign of any of its non-zero fields." + "doc": "The sign accessor property of Temporal.Duration instances returns 1 if this duration is positive, -1 if negative, and 0 if zero. Because a duration never has mixed signs, the sign of a duration is determined by the sign of any of its non-zero fields." }, "temporal.duration.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.Duration instances returns a new Temporal.Duration object with the difference between this duration and a given duration. It is equivalent to adding the negated value of the other duration.", + "doc": "The subtract() method of Temporal.Duration instances returns a new Temporal.Duration object with the difference between this duration and a given duration. It is equivalent to adding the negated value of the other duration.", "parameters": { "other": "A string, an object, or a Temporal.Duration instance representing a duration to add to this duration. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -18696,10 +18812,12 @@ "temporal.duration.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18707,23 +18825,25 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.Duration instances returns a string representing this duration in the same ISO 8601 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.Duration instances returns a string representing this duration in the same ISO 8601 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given duration in the ISO 8601 format, with as much subsecond precision as necessary to represent the duration accurately." }, "temporal.duration.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.Duration instances returns a string with a language-sensitive representation of this duration. In implementations with Intl.DurationFormat API support, this method delegates to Intl.DurationFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DurationFormat object and use its format() method, because a DurationFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.Duration instances returns a string with a language-sensitive representation of this duration. In implementations with Intl.DurationFormat API support, this method delegates to Intl.DurationFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DurationFormat object and use its format() method, because a DurationFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DurationFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DurationFormat() constructor." @@ -18733,10 +18853,12 @@ "temporal.duration.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18744,7 +18866,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.Duration instances returns a string representing this duration in the ISO 8601 format.", + "doc": "The toString() method of Temporal.Duration instances returns a string representing this duration in the ISO 8601 format.", "parameters": { "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    fractionalSecondDigits Optional
    \n
    \n

    Either an integer from 0 to 9, or the string \"auto\". The default is \"auto\". If \"auto\", then trailing zeros are removed from the fractional seconds. Otherwise, the fractional part of the second component contains this many digits, padded with zeros or rounded as necessary.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off fractional second digits beyond fractionalSecondDigits. See Intl.NumberFormat(). Defaults to \"trunc\".\n

    \n
    smallestUnit Optional
    \n
    \n

    A string specifying the smallest unit to include in the output. Possible values are \"second\", \"millisecond\", \"microsecond\", and \"nanosecond\", or their plural forms, which are equivalent to fractionalSecondDigits values of 0, 3, 6, 9, respectively. If specified, then fractionalSecondDigits is ignored.\n

    \n
    " }, @@ -18756,17 +18878,19 @@ "temporal.duration.total": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/total", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The total() method of Temporal.Duration instances returns a number representing the total duration in the given unit.", + "doc": "The total() method of Temporal.Duration instances returns a number representing the total duration in the given unit.", "parameters": { "unit": "A string representing the unit option. This is a convenience overload, so total(unit) is equivalent to total({ unit }), where unit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    relativeTo Optional
    \n
    \n

    A zoned or plain date(time) that provides the time and calendar information to resolve calendar durations (see the link for the general interpretation of this option). Required if either this or other is a calendar duration, or unit is a calendar unit.\n

    \n
    unit
    \n
    \n

    Any of the temporal units: \"years\", \"months\", \"weeks\", \"days\", \"hours\", \"minutes\", \"seconds\", \"milliseconds\", \"microseconds\", \"nanoseconds\", or their singular forms.\n

    \n
    " @@ -18779,10 +18903,12 @@ "temporal.duration.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18790,7 +18916,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.Duration instances throws a TypeError, which prevents Temporal.Duration instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.Duration instances throws a TypeError, which prevents Temporal.Duration instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -18799,10 +18925,12 @@ "temporal.duration.weeks": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/weeks", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18810,15 +18938,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The weeks accessor property of Temporal.Duration instances returns an integer representing the number of weeks in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above weeks, the weeks absolute value's range depends on the calendar (how many weeks are in a month or year).\n

    The set accessor of weeks is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The weeks accessor property of Temporal.Duration instances returns an integer representing the number of weeks in the duration.\n

    Unless the duration is balanced, you cannot assume the range of this value, but you can know its sign by checking the duration's sign property. If it is balanced to a unit above weeks, the weeks absolute value's range depends on the calendar (how many weeks are in a month or year).\n

    The set accessor of weeks is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.duration.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18826,7 +18956,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.Duration instances returns a new Temporal.Duration object representing this duration with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the duration's fields.", + "doc": "The with() method of Temporal.Duration instances returns a new Temporal.Duration object representing this duration with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the duration's fields.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.Duration.from(): years, months, weeks, days, hours, minutes, seconds, milliseconds, microseconds, nanoseconds. Unspecified properties use the values from the original duration." }, @@ -18839,10 +18969,12 @@ "temporal.duration.years": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/duration/years", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18850,15 +18982,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The years accessor property of Temporal.Duration instances returns an integer representing the number of years in the duration.\n

    You can know the sign of years by checking the duration's sign property.\n

    The set accessor of years is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." + "doc": "The years accessor property of Temporal.Duration instances returns an integer representing the number of years in the duration.\n

    You can know the sign of years by checking the duration's sign property.\n

    The set accessor of years is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.Duration object with the desired new value." }, "temporal.instant": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18866,15 +19000,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Instant object represents a unique point in time, with nanosecond precision. It is fundamentally represented as the number of nanoseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC), without any time zone or calendar system." + "doc": "The Temporal.Instant object represents a unique point in time, with nanosecond precision. It is fundamentally represented as the number of nanoseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC), without any time zone or calendar system." }, "temporal.instant.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18882,7 +19018,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", + "doc": "The add() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this instant. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -18894,17 +19030,19 @@ "temporal.instant.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Instant.compare() static method returns a number (-1, 0, or 1) indicating whether the first instant comes before, is the same as, or comes after the second instant. It is equivalent to comparing the epochNanoseconds of the two instants.", + "doc": "The Temporal.Instant.compare() static method returns a number (-1, 0, or 1) indicating whether the first instant comes before, is the same as, or comes after the second instant. It is equivalent to comparing the epochNanoseconds of the two instants.", "parameters": { "instant1": "A string or a Temporal.Instant instance representing the first instant to compare. It is converted to a Temporal.Instant object using the same algorithm as Temporal.Instant.from().", "instant2": "The second instant to compare, converted to a Temporal.Instant object using the same algorithm as instant1." @@ -18914,10 +19052,12 @@ "temporal.instant.epochmilliseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/epochmilliseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18925,15 +19065,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The epochMilliseconds accessor property of Temporal.Instant instances returns an integer representing the number of milliseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant. It is equivalent to dividing epochNanoseconds by 1e6 and flooring the result.\n

    The set accessor of epochMilliseconds is undefined. You cannot change this property directly. To create a new Temporal.Instant object with the desired new epochMilliseconds value, use the Temporal.Instant.fromEpochMilliseconds() static method instead." + "doc": "The epochMilliseconds accessor property of Temporal.Instant instances returns an integer representing the number of milliseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant. It is equivalent to dividing epochNanoseconds by 1e6 and flooring the result.\n

    The set accessor of epochMilliseconds is undefined. You cannot change this property directly. To create a new Temporal.Instant object with the desired new epochMilliseconds value, use the Temporal.Instant.fromEpochMilliseconds() static method instead." }, "temporal.instant.epochnanoseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/epochnanoseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18941,15 +19083,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The epochNanoseconds accessor property of Temporal.Instant instances returns a BigInt representing the number of nanoseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant.\n

    The set accessor of epochNanoseconds is undefined. You cannot change this property directly. To create a new Temporal.Instant object with the desired new epochNanoseconds value, use the Temporal.Instant.fromEpochNanoseconds() static method instead.\n

    An instant can only represent ±108 days (about ±273,972.6 years) around the epoch, which is ±8.64e21 nanoseconds. Attempting to set epochNanoseconds beyond this boundary throws a RangeError." + "doc": "The epochNanoseconds accessor property of Temporal.Instant instances returns a BigInt representing the number of nanoseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant.\n

    The set accessor of epochNanoseconds is undefined. You cannot change this property directly. To create a new Temporal.Instant object with the desired new epochNanoseconds value, use the Temporal.Instant.fromEpochNanoseconds() static method instead.\n

    An instant can only represent ±108 days (about ±273,972.6 years) around the epoch, which is ±8.64e21 nanoseconds. Attempting to set epochNanoseconds beyond this boundary throws a RangeError." }, "temporal.instant.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18957,7 +19101,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.Instant instances returns true if this instant is equivalent in value to another instant (in a form convertible by Temporal.Instant.from()), and false otherwise. They are compared by their epochNanoseconds. It is equivalent to Temporal.Instant.compare(this, other) === 0.", + "doc": "The equals() method of Temporal.Instant instances returns true if this instant is equivalent in value to another instant (in a form convertible by Temporal.Instant.from()), and false otherwise. They are compared by their epochNanoseconds. It is equivalent to Temporal.Instant.compare(this, other) === 0.", "parameters": { "other": "A string or a Temporal.Instant instance representing the other instant to compare. It is converted to a Temporal.Instant object using the same algorithm as Temporal.Instant.from()." }, @@ -18966,10 +19110,12 @@ "temporal.instant.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -18977,7 +19123,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Instant.from() static method creates a new Temporal.Instant object from another Temporal.Instant object, or an RFC 9557 string.", + "doc": "The Temporal.Instant.from() static method creates a new Temporal.Instant object from another Temporal.Instant object, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    " }, @@ -18990,10 +19136,12 @@ "temporal.instant.fromepochmilliseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/fromepochmilliseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19001,7 +19149,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Instant.fromEpochMilliseconds() static method creates a new Temporal.Instant object from the number of milliseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC).\n

    To convert a Date object to a Temporal.Instant object, use Date.prototype.toTemporalInstant() instead.", + "doc": "The Temporal.Instant.fromEpochMilliseconds() static method creates a new Temporal.Instant object from the number of milliseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC).\n

    To convert a Date object to a Temporal.Instant object, use Date.prototype.toTemporalInstant() instead.", "parameters": { "epochMilliseconds": "A number representing the number of milliseconds since the Unix epoch. Internally, it is converted to a BigInt and multiplied by 1e6 to get the number of nanoseconds." }, @@ -19013,10 +19161,12 @@ "temporal.instant.fromepochnanoseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/fromepochnanoseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19024,7 +19174,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Instant.fromEpochNanoseconds() static method creates a new Temporal.Instant object from the number of nanoseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC).\n

    To convert a Date object to a Temporal.Instant object, use Date.prototype.toTemporalInstant() instead.", + "doc": "The Temporal.Instant.fromEpochNanoseconds() static method creates a new Temporal.Instant object from the number of nanoseconds since the Unix epoch (midnight at the beginning of January 1, 1970, UTC).\n

    To convert a Date object to a Temporal.Instant object, use Date.prototype.toTemporalInstant() instead.", "parameters": { "epochNanoseconds": "A BigInt representing the number of nanoseconds since the Unix epoch." }, @@ -19059,10 +19209,12 @@ "temporal.instant.round": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/round", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19070,7 +19222,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The round() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant rounded to the given unit.", + "doc": "The round() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant rounded to the given unit.", "parameters": { "smallestUnit": "A string representing the smallestUnit option. This is a convenience overload, so round(smallestUnit) is equivalent to round({ smallestUnit }), where smallestUnit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    roundingIncrement Optional
    \n
    \n

    A number (truncated to an integer) representing the rounding increment in the given smallestUnit. Defaults to 1. The increment and the smallestUnit must evenly divide 24 hours; for example, 45 seconds is a divisor of 86400 seconds, and 100 minutes is a divisor of 3600 minutes. This is slightly less strict than the round() method of the other classes, which all require the increment to be a divisor of the maximum value of the unit.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off the fractional part of smallestUnit. See Intl.NumberFormat(). Defaults to \"halfExpand\".\n

    \n
    smallestUnit
    \n
    \n

    A string representing the smallest unit to include in the output. The value must be one of the following: \"hour\", \"minute\", \"second\", \"millisecond\", \"microsecond\", \"nanosecond\", or their plural forms. For units larger than \"nanosecond\", fractional parts of the smallestUnit will be rounded according to the roundingIncrement and roundingMode settings.\n

    \n
    " @@ -19083,10 +19235,12 @@ "temporal.instant.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19094,7 +19248,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.Instant instances returns a new Temporal.Duration object representing the duration from another instant (in a form convertible by Temporal.Instant.from()) to this instant. The duration is positive if the other instant is before this instant, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.Instant instances returns a new Temporal.Duration object representing the duration from another instant (in a form convertible by Temporal.Instant.from()) to this instant. The duration is positive if the other instant is before this instant, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string or a Temporal.Instant instance representing an instant to subtract from this instant. It is converted to a Temporal.Instant object using the same algorithm as Temporal.Instant.from().", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit only accept the units: \"hours\", \"minutes\", \"seconds\", \"milliseconds\", \"microseconds\", \"nanoseconds\", or their singular forms. For largestUnit, the default value \"auto\" means \"seconds\" or smallestUnit, whichever is greater. For smallestUnit, the default value is \"nanoseconds\"." @@ -19107,10 +19261,12 @@ "temporal.instant.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19118,7 +19274,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two instants and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.Instant instances returns a new Temporal.Instant object representing this instant moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two instants and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this instant. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -19130,10 +19286,12 @@ "temporal.instant.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19141,16 +19299,18 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.Instant instances returns a string representing this instant in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.Instant instances returns a string representing this instant in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given instant in the RFC 9557 format, with as much subsecond precision as necessary to represent the duration accurately, and with the UTC time zone designator Z." }, "temporal.instant.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19158,7 +19318,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.Instant instances returns a string with a language-sensitive representation of this instant. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.Instant instances returns a string with a language-sensitive representation of this instant. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor." @@ -19168,10 +19328,12 @@ "temporal.instant.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19179,7 +19341,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.Instant instances returns a string representing this instant in the RFC 9557 format using the specified time zone.", + "doc": "The toString() method of Temporal.Instant instances returns a string representing this instant in the RFC 9557 format using the specified time zone.", "parameters": { "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    fractionalSecondDigits Optional
    \n
    \n

    Either an integer from 0 to 9, or the string \"auto\". The default is \"auto\". If \"auto\", then trailing zeros are removed from the fractional seconds. Otherwise, the fractional part of the second component contains this many digits, padded with zeros or rounded as necessary.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off fractional second digits beyond fractionalSecondDigits. See Intl.NumberFormat(). Defaults to \"trunc\".\n

    \n
    smallestUnit Optional
    \n
    \n

    A string specifying the smallest unit to include in the output. Possible values are \"minute\", \"second\", \"millisecond\", \"microsecond\", and \"nanosecond\", or their plural forms, which (except \"minute\") are equivalent to fractionalSecondDigits values of 0, 3, 6, 9, respectively. If specified, then fractionalSecondDigits is ignored.\n

    \n
    timeZone Optional
    \n
    \n

    Either a string or a Temporal.ZonedDateTime instance representing the time zone to use. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information). Defaults to \"UTC\".\n

    \n
    " }, @@ -19191,17 +19353,19 @@ "temporal.instant.tozoneddatetimeiso": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/tozoneddatetimeiso", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toZonedDateTimeISO() method of Temporal.Instant instances returns a new Temporal.ZonedDateTime object representing this instant in the specified time zone using the ISO 8601 calendar system.", + "doc": "The toZonedDateTimeISO() method of Temporal.Instant instances returns a new Temporal.ZonedDateTime object representing this instant in the specified time zone using the ISO 8601 calendar system.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to use. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -19214,10 +19378,12 @@ "temporal.instant.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19225,7 +19391,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.Instant instances returns a new Temporal.Duration object representing the duration from this instant to another instant (in a form convertible by Temporal.Instant.from()). The duration is positive if the other instant is after this instant, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.Instant instances returns a new Temporal.Duration object representing the duration from this instant to another instant (in a form convertible by Temporal.Instant.from()). The duration is positive if the other instant is after this instant, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string or a Temporal.Instant instance representing an instant to subtract this instant from. It is converted to a Temporal.Instant object using the same algorithm as Temporal.Instant.from().", "options": "The same options as since()." @@ -19238,10 +19404,12 @@ "temporal.instant.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/instant/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -19249,7 +19417,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.Instant instances throws a TypeError, which prevents Temporal.Instant instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.Instant instances throws a TypeError, which prevents Temporal.Instant instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -19258,48 +19426,54 @@ "temporal.now": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now namespace object contains static methods for getting the current time in various formats." + "doc": "The Temporal.Now namespace object contains static methods for getting the current time in various formats." }, "temporal.now.instant": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/instant", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.instant() static method returns the current time as a Temporal.Instant object.", + "doc": "The Temporal.Now.instant() static method returns the current time as a Temporal.Instant object.", "returns": "A Temporal.Instant object representing the current time, with potentially reduced precision." }, "temporal.now.plaindateiso": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/plaindateiso", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.plainDateISO() static method returns the current date as a Temporal.PlainDate object, in the ISO 8601 calendar and the specified time zone.", + "doc": "The Temporal.Now.plainDateISO() static method returns the current date as a Temporal.PlainDate object, in the ISO 8601 calendar and the specified time zone.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to interpret the system time in. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -19311,17 +19485,19 @@ "temporal.now.plaindatetimeiso": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/plaindatetimeiso", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.plainDateTimeISO() static method returns the current date and time as a Temporal.PlainDateTime object, in the ISO 8601 calendar and the specified time zone.", + "doc": "The Temporal.Now.plainDateTimeISO() static method returns the current date and time as a Temporal.PlainDateTime object, in the ISO 8601 calendar and the specified time zone.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to interpret the system time in. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -19333,17 +19509,19 @@ "temporal.now.plaintimeiso": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/plaintimeiso", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.plainTimeISO() static method returns the current time as a Temporal.PlainTime object, in the specified time zone.\n

    Note that although the method contains \"ISO\" in its name, Temporal.PlainTime objects do not have associated calendars, as the time format is not calendar-dependent.", + "doc": "The Temporal.Now.plainTimeISO() static method returns the current time as a Temporal.PlainTime object, in the specified time zone.\n

    Note that although the method contains \"ISO\" in its name, Temporal.PlainTime objects do not have associated calendars, as the time format is not calendar-dependent.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to interpret the system time in. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -19355,33 +19533,37 @@ "temporal.now.timezoneid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/timezoneid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.timeZoneId() static method returns a time zone identifier representing the system's current time zone. Most systems will return a primary time zone identifier such as \"America/New_York\", though offset time zone identifier such as \"-04:00\" is possible too. The time zone identifier returned is the default time zone used by the other Temporal.Now methods.", + "doc": "The Temporal.Now.timeZoneId() static method returns a time zone identifier representing the system's current time zone. Most systems will return a primary time zone identifier such as \"America/New_York\", though offset time zone identifier such as \"-04:00\" is possible too. The time zone identifier returned is the default time zone used by the other Temporal.Now methods.", "returns": "A valid time zone identifier representing the system's current time zone. The returned time zone identifier is never a non-primary time zone identifier (alias). For example, it would always return \"Asia/Kolkata\" (new name) instead of \"Asia/Calcutta\" (old name). For more information, see time zones and offsets.\n

    If the implementation does not support time zones, the method always returns \"UTC\"." }, "temporal.now.zoneddatetimeiso": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/now/zoneddatetimeiso", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.Now.zonedDateTimeISO() static method returns the current date and time as a Temporal.ZonedDateTime object, in the ISO 8601 calendar and the specified time zone.", + "doc": "The Temporal.Now.zonedDateTimeISO() static method returns the current date and time as a Temporal.ZonedDateTime object, in the ISO 8601 calendar and the specified time zone.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to interpret the system time in. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -19393,32 +19575,36 @@ "temporal.plaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDate object represents a calendar date (a date without a time or time zone); for example, an event on a calendar which happens during the whole day no matter which time zone it's happening in. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system." + "doc": "The Temporal.PlainDate object represents a calendar date (a date without a time or time zone); for example, an event on a calendar which happens during the whole day no matter which time zone it's happening in. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system." }, "temporal.plaindate.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", + "doc": "The add() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this date. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -19431,32 +19617,36 @@ "temporal.plaindate.calendarid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/calendarid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The calendarId accessor property of Temporal.PlainDate instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The calendarId accessor property of Temporal.PlainDate instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDate.compare() static method returns a number (-1, 0, or 1) indicating whether the first date comes before, is the same as, or comes after the second date. Equivalent to comparing the year, month, and day fields of the underlying ISO 8601 dates.", + "doc": "The Temporal.PlainDate.compare() static method returns a number (-1, 0, or 1) indicating whether the first date comes before, is the same as, or comes after the second date. Equivalent to comparing the year, month, and day fields of the underlying ISO 8601 dates.", "parameters": { "date1": "A string, an object, or a Temporal.PlainDate instance representing the first date to compare. It is converted to a Temporal.PlainDate object using the same algorithm as Temporal.PlainDate.from().", "date2": "The second date to compare, converted to a Temporal.PlainDate object using the same algorithm as date1." @@ -19466,107 +19656,121 @@ "temporal.plaindate.day": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/day", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The day accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    It generally starts at 1 and is continuous, but not always. If you want to loop through all the days in a month, first use with() with { day: 1 } (which sets to the beginning of the month, even if the actual number is not 1), then repeatedly use add() with { days: 1 }, until the month changes.\n

    \n

    Note:\nUsually, the day index only changes when transitioning from one calendar system into another, such as from the Julian to the Gregorian calendar. In practice, all currently built-in calendars are proleptic, meaning the calendar system is extended indefinitely into the past and future. Assuming day is non-continuous guards against future introductions of non-proleptic calendars.\n

    \n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The day accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    It generally starts at 1 and is continuous, but not always. If you want to loop through all the days in a month, first use with() with { day: 1 } (which sets to the beginning of the month, even if the actual number is not 1), then repeatedly use add() with { days: 1 }, until the month changes.\n

    \n

    Note:\nUsually, the day index only changes when transitioning from one calendar system into another, such as from the Julian to the Gregorian calendar. In practice, all currently built-in calendars are proleptic, meaning the calendar system is extended indefinitely into the past and future. Assuming day is non-continuous guards against future introductions of non-proleptic calendars.\n

    \n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.dayofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/dayofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfWeek accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent. 1 usually represents Monday in the calendar, even when locales using the calendar may consider a different day as the first day of the week (see Intl.Locale.prototype.getWeekInfo()).\n

    All commonly supported calendars use 7-day weeks, and you could generally expect this property to return the same value for the same date across different calendars.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days." + "doc": "The dayOfWeek accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent. 1 usually represents Monday in the calendar, even when locales using the calendar may consider a different day as the first day of the week (see Intl.Locale.prototype.getWeekInfo()).\n

    All commonly supported calendars use 7-day weeks, and you could generally expect this property to return the same value for the same date across different calendars.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days." }, "temporal.plaindate.dayofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/dayofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfYear accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days." + "doc": "The dayOfYear accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days." }, "temporal.plaindate.daysinmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/daysinmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInMonth accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    Note that the days in month is not always equal to the day of the last day of the month, in the rare case where a month may have a few days skipped.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly." + "doc": "The daysInMonth accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    Note that the days in month is not always equal to the day of the last day of the month, in the rare case where a month may have a few days skipped.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly." }, "temporal.plaindate.daysinweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/daysinweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInWeek accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is always 7, but in other calendar systems it may differ from week to week. All commonly supported calendars use 7-day weeks.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly." + "doc": "The daysInWeek accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is always 7, but in other calendar systems it may differ from week to week. All commonly supported calendars use 7-day weeks.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly." }, "temporal.plaindate.daysinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/daysinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInYear accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is 365, or 366 in a leap year. In other calendar systems, it likely differs, especially in non-solar calendars.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly." + "doc": "The daysInYear accessor property of Temporal.PlainDate instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is 365, or 366 in a leap year. In other calendar systems, it likely differs, especially in non-solar calendars.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly." }, "temporal.plaindate.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.PlainDate instances returns true if this date is equivalent in value to another date (in a form convertible by Temporal.PlainDate.from()), and false otherwise. They are compared both by their date values and their calendars, so two dates from different calendars may be considered equal by Temporal.PlainDate.compare() but not by equals().", + "doc": "The equals() method of Temporal.PlainDate instances returns true if this date is equivalent in value to another date (in a form convertible by Temporal.PlainDate.from()), and false otherwise. They are compared both by their date values and their calendars, so two dates from different calendars may be considered equal by Temporal.PlainDate.compare() but not by equals().", "parameters": { "other": "A string, an object, or a Temporal.PlainDate instance representing the other date to compare. It is converted to a Temporal.PlainDate object using the same algorithm as Temporal.PlainDate.from()." }, @@ -19575,47 +19779,53 @@ "temporal.plaindate.era": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/era", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The era accessor property of Temporal.PlainDate instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent. For Gregorian, it is either \"gregory\" or \"gregory-inverse\".\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value. When setting eras, each code may have some aliases; for example, \"ce\" and \"ad\" are equivalent to \"gregory\", and \"bce\" and \"bc\" are equivalent to \"gregory-inverse\".\n

    \n

    Note:\nThis string is not intended for display to users. Use toLocaleString() with the appropriate options to get a localized string.\n

    " + "doc": "The era accessor property of Temporal.PlainDate instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent. For Gregorian, it is either \"gregory\" or \"gregory-inverse\".\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value. When setting eras, each code may have some aliases; for example, \"ce\" and \"ad\" are equivalent to \"gregory\", and \"bce\" and \"bc\" are equivalent to \"gregory-inverse\".\n

    \n

    Note:\nThis string is not intended for display to users. Use toLocaleString() with the appropriate options to get a localized string.\n

    " }, "temporal.plaindate.erayear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/erayear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The eraYear accessor property of Temporal.PlainDate instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    Unlike year, era and eraYear may change in the middle of a calendar year. For example, Japan started the Reiwa era on May 1, 2019, so dates from 2019-01-01 to 2019-04-30 have { era: \"heisei\", eraYear: 31 }, and dates from 2019-05-01 onwards have { era: \"reiwa\", eraYear: 1 }, but the year is always 2019 (because the Japanese calendar uses the ISO 8601 year as the default year).\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The eraYear accessor property of Temporal.PlainDate instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    Unlike year, era and eraYear may change in the middle of a calendar year. For example, Japan started the Reiwa era on May 1, 2019, so dates from 2019-01-01 to 2019-04-30 have { era: \"heisei\", eraYear: 31 }, and dates from 2019-05-01 onwards have { era: \"reiwa\", eraYear: 1 }, but the year is always 2019 (because the Japanese calendar uses the ISO 8601 year as the default year).\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDate.from() static method creates a new Temporal.PlainDate object from another Temporal.PlainDate object, an object with date properties, or an RFC 9557 string.", + "doc": "The Temporal.PlainDate.from() static method creates a new Temporal.PlainDate object from another Temporal.PlainDate object, an object with date properties, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    ", "options": "An object containing the following property:\n
    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -19629,62 +19839,70 @@ "temporal.plaindate.inleapyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/inleapyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The inLeapYear accessor property of Temporal.PlainDate instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    For the ISO 8601 calendar, a leap year is a year that is evenly divisible by 4, except for years that are evenly divisible by 100, unless the year is also evenly divisible by 400. For the ISO 8601 calendar, leap years have 366 days, while common years have 365 days. For other calendar systems, the rules likely differ, and leap years may have more days added (such as a leap month).\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly." + "doc": "The inLeapYear accessor property of Temporal.PlainDate instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    For the ISO 8601 calendar, a leap year is a year that is evenly divisible by 4, except for years that are evenly divisible by 100, unless the year is also evenly divisible by 400. For the ISO 8601 calendar, leap years have 366 days, while common years have 365 days. For other calendar systems, the rules likely differ, and leap years may have more days added (such as a leap month).\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly." }, "temporal.plaindate.month": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/month", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The month accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    Note that unlike Date.prototype.getMonth(), the index is 1-based. If the calendar has leap months, then the month with the same monthCode may have different month indexes for different years.\n

    \n

    Note:\nDo not use this property to identify the actual month, including its name. Use monthCode for that purpose. Use month only for identifying months within the context of a year, or to figure out their order.\n

    \n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The month accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    Note that unlike Date.prototype.getMonth(), the index is 1-based. If the calendar has leap months, then the month with the same monthCode may have different month indexes for different years.\n

    \n

    Note:\nDo not use this property to identify the actual month, including its name. Use monthCode for that purpose. Use month only for identifying months within the context of a year, or to figure out their order.\n

    \n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.monthcode": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/monthcode", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthCode accessor property of Temporal.PlainDate instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    \n

    Note:\nDon't assume that monthCode is a user-friendly string; use toLocaleString() to format your date instead. Generally, don't cache the name of months in an array or object. Even though monthCode usually maps to the month's name within one calendar, we recommend always computing the month's name using, for example, date.toLocaleString(\"en-US\", { calendar: date.calendarId, month: \"long\" }).\n

    \n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The monthCode accessor property of Temporal.PlainDate instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    \n

    Note:\nDon't assume that monthCode is a user-friendly string; use toLocaleString() to format your date instead. Generally, don't cache the name of months in an array or object. Even though monthCode usually maps to the month's name within one calendar, we recommend always computing the month's name using, for example, date.toLocaleString(\"en-US\", { calendar: date.calendarId, month: \"long\" }).\n

    \n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.monthsinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/monthsinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthsInYear accessor property of Temporal.PlainDate instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is always 12, but in other calendar systems it may differ. For example, in calendars using leap months, leap years will have one more month than common years.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly." + "doc": "The monthsInYear accessor property of Temporal.PlainDate instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    For the ISO 8601 calendar, this is always 12, but in other calendar systems it may differ. For example, in calendars using leap months, leap years will have one more month than common years.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly." }, "temporal.plaindate.plaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/plaindate", @@ -19715,17 +19933,19 @@ "temporal.plaindate.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.PlainDate instances returns a new Temporal.Duration object representing the duration from another date (in a form convertible by Temporal.PlainDate.from()) to this date. The duration is positive if the other date is before this date, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.PlainDate instances returns a new Temporal.Duration object representing the duration from another date (in a form convertible by Temporal.PlainDate.from()) to this date. The duration is positive if the other date is before this date, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainDate instance representing a date to subtract from this date. It is converted to a Temporal.PlainDate object using the same algorithm as Temporal.PlainDate.from(). It must have the same calendar as this.", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit only accept the units: \"years\", \"months\", \"weeks\", \"days\", or their singular forms. For largestUnit, the default value \"auto\" means \"days\" or smallestUnit, whichever is greater. For smallestUnit, the default value is \"days\". The current date is used as the relativeTo option. Note that using units larger than \"days\" may make the duration not portable to other calendars or dates." @@ -19738,17 +19958,19 @@ "temporal.plaindate.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two dates and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two dates and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this date. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -19761,33 +19983,37 @@ "temporal.plaindate.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.PlainDate instances returns a string representing this date in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.PlainDate instances returns a string representing this date in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given date in the RFC 9557 format, with the calendar annotation included if it is not \"iso8601\"." }, "temporal.plaindate.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.PlainDate instances returns a string with a language-sensitive representation of this date. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.PlainDate instances returns a string with a language-sensitive representation of this date. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. If this date's calendar is not \"iso8601\", the calendar option must be provided with the same value; otherwise, if this date's calendar is \"iso8601\", the calendar option can be any value. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -19801,17 +20027,19 @@ "temporal.plaindate.toplaindatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/toplaindatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDateTime() method of Temporal.PlainDate instances returns a new Temporal.PlainDateTime object representing this date and a supplied time in the same calendar system.", + "doc": "The toPlainDateTime() method of Temporal.PlainDate instances returns a new Temporal.PlainDateTime object representing this date and a supplied time in the same calendar system.", "parameters": { "plainTime": "A string, an object, or a Temporal.PlainTime instance representing the time component of the resulting PlainDateTime. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from(). Defaults to \"00:00:00\"." }, @@ -19820,49 +20048,55 @@ "temporal.plaindate.toplainmonthday": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/toplainmonthday", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainMonthDay() method of Temporal.PlainDate instances returns a new Temporal.PlainMonthDay object representing the monthCode and day of this date in the same calendar system.\n

    Note that PlainMonthDay objects do not have a month component, because months with the same name can have different month indexes in different years due to leap months.", + "doc": "The toPlainMonthDay() method of Temporal.PlainDate instances returns a new Temporal.PlainMonthDay object representing the monthCode and day of this date in the same calendar system.\n

    Note that PlainMonthDay objects do not have a month component, because months with the same name can have different month indexes in different years due to leap months.", "returns": "A new Temporal.PlainMonthDay object representing the monthCode and day of this date in the same calendar system." }, "temporal.plaindate.toplainyearmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/toplainyearmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainYearMonth() method of Temporal.PlainDate instances returns a new Temporal.PlainYearMonth object representing the year and month of this date in the same calendar system.", + "doc": "The toPlainYearMonth() method of Temporal.PlainDate instances returns a new Temporal.PlainYearMonth object representing the year and month of this date in the same calendar system.", "returns": "A new Temporal.PlainYearMonth object representing the year and month of this date in the same calendar system." }, "temporal.plaindate.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.PlainDate instances returns a string representing this date in the RFC 9557 format.", + "doc": "The toString() method of Temporal.PlainDate instances returns a string representing this date in the RFC 9557 format.", "parameters": { "options": "An object containing the following property:\n

    \n
    calendarName Optional
    \n
    \n

    Whether to show the calendar annotation ([u-ca=calendar_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Include the calendar annotation if the calendar is not \"iso8601\".\n

    \n
    \"always\"
    \n
    \n

    Always include the calendar annotation.\n

    \n
    \"never\"
    \n
    \n

    Never include the calendar annotation. This makes the returned string not recoverable to the same Temporal.PlainDate instance, although the date value still remains the same.\n

    \n
    \"critical\"
    \n
    \n

    Always include the calendar annotation, and add a critical flag: [!u-ca=calendar_id]. Useful when sending the string to certain systems, but not useful for Temporal itself.\n

    \n
    \n
    \n
    " }, @@ -19875,17 +20109,19 @@ "temporal.plaindate.tozoneddatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/tozoneddatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toZonedDateTime() method of Temporal.PlainDate instances returns a new Temporal.ZonedDateTime object representing this date, a supplied time, and a supplied time zone, in the same calendar system.", + "doc": "The toZonedDateTime() method of Temporal.PlainDate instances returns a new Temporal.ZonedDateTime object representing this date, a supplied time, and a supplied time zone, in the same calendar system.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the timeZone option. This is a convenience overload, so toZonedDateTime(timeZone) is equivalent to toZonedDateTime({ timeZone }), where timeZone is a string or Temporal.ZonedDateTime. This overload is chosen when the first argument is not an object, or the object's timeZone property is undefined (because ZonedDateTime instances have a timeZoneId property instead).", "info": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    plainTime Optional
    \n
    \n

    A string, an object, or a Temporal.PlainTime instance representing the time component of the resulting ZonedDateTime. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from(). Defaults to the first valid time in this time zone on this calendar date, which is usually \"00:00:00\", but may be different if, for example, daylight saving time skips midnight.\n

    \n
    timeZone
    \n
    \n

    Either a string or a Temporal.ZonedDateTime instance representing the time zone to use. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information).\n

    \n
    " @@ -19899,17 +20135,19 @@ "temporal.plaindate.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.PlainDate instances returns a new Temporal.Duration object representing the duration from this date to another date (in a form convertible by Temporal.PlainDate.from()). The duration is positive if the other date is after this date, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.PlainDate instances returns a new Temporal.Duration object representing the duration from this date to another date (in a form convertible by Temporal.PlainDate.from()). The duration is positive if the other date is after this date, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainDate instance representing a date to subtract this date from. It is converted to a Temporal.PlainDate object using the same algorithm as Temporal.PlainDate.from(). It must have the same calendar as this.", "options": "The same options as since()." @@ -19922,17 +20160,19 @@ "temporal.plaindate.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.PlainDate instances throws a TypeError, which prevents Temporal.PlainDate instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.PlainDate instances throws a TypeError, which prevents Temporal.PlainDate instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -19941,32 +20181,36 @@ "temporal.plaindate.weekofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/weekofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The weekOfYear accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    Note that for ISO 8601, the first and last few days of the year may be attributed to the last week of the previous year or the first week of the next year. Namely, if a week crosses two years, then it belongs to the year that has the majority of its days. To get the year that the weekOfYear belongs to, use the yearOfWeek property, not the year property.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks." + "doc": "The weekOfYear accessor property of Temporal.PlainDate instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    Note that for ISO 8601, the first and last few days of the year may be attributed to the last week of the previous year or the first week of the next year. Namely, if a week crosses two years, then it belongs to the year that has the majority of its days. To get the year that the weekOfYear belongs to, use the yearOfWeek property, not the year property.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDate object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks." }, "temporal.plaindate.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date's fields.\n

    To replace the calendarId property, use the withCalendar() method instead.", + "doc": "The with() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date's fields.\n

    To replace the calendarId property, use the withCalendar() method instead.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.PlainDate.from() (except calendar): day, era and eraYear, month, monthCode, year. Unspecified properties use the values from the original date. You only need to provide one of month or monthCode, and one of era and eraYear or year, and the other will be updated accordingly.", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -19980,14 +20224,17 @@ "temporal.plaindate.withcalendar": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/withcalendar", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withCalendar() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date's calendarId property.\n

    To replace the date component properties, use the with() method instead.", + "doc": "The withCalendar() method of Temporal.PlainDate instances returns a new Temporal.PlainDate object representing this date interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date's calendarId property.\n

    To replace the date component properties, use the with() method instead.", "parameters": { "calendar": "A string that corresponds to the calendarId property. See Intl.supportedValuesOf() for a list of commonly supported calendar types." }, @@ -20000,62 +20247,70 @@ "temporal.plaindate.year": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/year", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The year accessor property of Temporal.PlainDate instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    This property has the same function as the era/eraYear pair as a unique identifier of a year in a calendar. Usually year 1 is either the first year of the latest era or the ISO 8601 year 0001. Because year is relative to the start of the epoch year, not the epoch date, if the epoch is in the middle of the year, that year will have the same value before and after the start date of the era.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." + "doc": "The year accessor property of Temporal.PlainDate instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    This property has the same function as the era/eraYear pair as a unique identifier of a year in a calendar. Usually year 1 is either the first year of the latest era or the ISO 8601 year 0001. Because year is relative to the start of the epoch year, not the epoch date, if the epoch is in the middle of the year, that year will have the same value before and after the start date of the era.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDate object with the desired new value." }, "temporal.plaindate.yearofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindate/yearofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The yearOfWeek accessor property of Temporal.PlainDate instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    Usually this is the year of the date, but for ISO 8601, the first and last few days of the year may be attributed to the last week of the previous year or the first week of the next year, causing the yearOfWeek to differ by 1. See weekOfYear for more details.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly." + "doc": "The yearOfWeek accessor property of Temporal.PlainDate instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    Usually this is the year of the date, but for ISO 8601, the first and last few days of the year may be attributed to the last week of the previous year or the first week of the next year, causing the yearOfWeek to differ by 1. See weekOfYear for more details.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly." }, "temporal.plaindatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDateTime object represents a date (calendar date) and time (wall-clock time) without a time zone. It is fundamentally represented as a combination of a date (with an associated calendar system) and a time." + "doc": "The Temporal.PlainDateTime object represents a date (calendar date) and time (wall-clock time) without a time zone. It is fundamentally represented as a combination of a date (with an associated calendar system) and a time." }, "temporal.plaindatetime.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", + "doc": "The add() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this date-time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -20068,32 +20323,36 @@ "temporal.plaindatetime.calendarid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/calendarid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The calendarId accessor property of Temporal.PlainDateTime instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.PlainDateTime object with the desired new value." + "doc": "The calendarId accessor property of Temporal.PlainDateTime instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.PlainDateTime object with the desired new value." }, "temporal.plaindatetime.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDateTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first date-time comes before, is the same as, or comes after the second date-time. Equivalent to first comparing their dates, then comparing their times if the dates are the same.", + "doc": "The Temporal.PlainDateTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first date-time comes before, is the same as, or comes after the second date-time. Equivalent to first comparing their dates, then comparing their times if the dates are the same.", "parameters": { "dateTime1": "A string, an object, or a Temporal.PlainDateTime instance representing the first date-time to compare. It is converted to a Temporal.PlainDateTime object using the same algorithm as Temporal.PlainDateTime.from().", "dateTime2": "The second date-time to compare, converted to a Temporal.PlainDateTime object using the same algorithm as dateTime1." @@ -20103,107 +20362,121 @@ "temporal.plaindatetime.day": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/day", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The day accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day." + "doc": "The day accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day." }, "temporal.plaindatetime.dayofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/dayofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfWeek accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfWeek." + "doc": "The dayOfWeek accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfWeek." }, "temporal.plaindatetime.dayofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/dayofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfYear." + "doc": "The dayOfYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfYear." }, "temporal.plaindatetime.daysinmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/daysinmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInMonth accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." + "doc": "The daysInMonth accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." }, "temporal.plaindatetime.daysinweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/daysinweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInWeek accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInWeek." + "doc": "The daysInWeek accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInWeek." }, "temporal.plaindatetime.daysinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/daysinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." + "doc": "The daysInYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." }, "temporal.plaindatetime.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.PlainDateTime instances returns true if this date-time is equivalent in value to another date-time (in a form convertible by Temporal.PlainDateTime.from()), and false otherwise. They are compared both by their date and time values and their calendars, so two date-times from different calendars may be considered equal by Temporal.PlainDateTime.compare() but not by equals().", + "doc": "The equals() method of Temporal.PlainDateTime instances returns true if this date-time is equivalent in value to another date-time (in a form convertible by Temporal.PlainDateTime.from()), and false otherwise. They are compared both by their date and time values and their calendars, so two date-times from different calendars may be considered equal by Temporal.PlainDateTime.compare() but not by equals().", "parameters": { "other": "A string, an object, or a Temporal.PlainDateTime instance representing the other date-time to compare. It is converted to a Temporal.PlainDateTime object using the same algorithm as Temporal.PlainDateTime.from()." }, @@ -20212,47 +20485,53 @@ "temporal.plaindatetime.era": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/era", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The era accessor property of Temporal.PlainDateTime instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." + "doc": "The era accessor property of Temporal.PlainDateTime instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." }, "temporal.plaindatetime.erayear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/erayear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The eraYear accessor property of Temporal.PlainDateTime instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." + "doc": "The eraYear accessor property of Temporal.PlainDateTime instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." }, "temporal.plaindatetime.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainDateTime.from() static method creates a new Temporal.PlainDateTime object from another Temporal.PlainDateTime object, an object with date and time properties, or an RFC 9557 string.", + "doc": "The Temporal.PlainDateTime.from() static method creates a new Temporal.PlainDateTime object from another Temporal.PlainDateTime object, an object with date and time properties, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    ", "options": "An object containing the following property:\n
    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -20266,137 +20545,155 @@ "temporal.plaindatetime.hour": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/hour", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The hour accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.hour." + "doc": "The hour accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.hour." }, "temporal.plaindatetime.inleapyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/inleapyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The inLeapYear accessor property of Temporal.PlainDateTime instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." + "doc": "The inLeapYear accessor property of Temporal.PlainDateTime instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." }, "temporal.plaindatetime.microsecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/microsecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The microsecond accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.microsecond." + "doc": "The microsecond accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.microsecond." }, "temporal.plaindatetime.millisecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/millisecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The millisecond accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.millisecond." + "doc": "The millisecond accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.millisecond." }, "temporal.plaindatetime.minute": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/minute", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The minute accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.minute." + "doc": "The minute accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.minute." }, "temporal.plaindatetime.month": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/month", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The month accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." + "doc": "The month accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." }, "temporal.plaindatetime.monthcode": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/monthcode", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthCode accessor property of Temporal.PlainDateTime instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." + "doc": "The monthCode accessor property of Temporal.PlainDateTime instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." }, "temporal.plaindatetime.monthsinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/monthsinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthsInYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." + "doc": "The monthsInYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." }, "temporal.plaindatetime.nanosecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/nanosecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The nanosecond accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.nanosecond." + "doc": "The nanosecond accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.nanosecond." }, "temporal.plaindatetime.plaindatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/plaindatetime", @@ -20432,17 +20729,19 @@ "temporal.plaindatetime.round": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/round", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The round() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time rounded to the given unit.", + "doc": "The round() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time rounded to the given unit.", "parameters": { "smallestUnit": "A string representing the smallestUnit option. This is a convenience overload, so round(smallestUnit) is equivalent to round({ smallestUnit }), where smallestUnit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    roundingIncrement Optional
    \n
    \n

    A number (truncated to an integer) representing the rounding increment in the given smallestUnit. Defaults to 1. For all values of smallestUnit except \"day\", the increment must be a divisor of the maximum value of the unit; for example, if the unit is hours, the increment must be a divisor of 24 and must not be 24 itself, which means it can be 1, 2, 3, 4, 6, 8, or 12. For \"day\", the increment must be 1.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off the fractional part of smallestUnit. See Intl.NumberFormat(). Defaults to \"halfExpand\".\n

    \n
    smallestUnit
    \n
    \n

    A string representing the smallest unit to include in the output. The value must be one of the following: \"day\", \"hour\", \"minute\", \"second\", \"millisecond\", \"microsecond\", \"nanosecond\", or their plural forms. For units larger than \"nanosecond\", fractional parts of the smallestUnit will be rounded according to the roundingIncrement and roundingMode settings.\n

    \n
    " @@ -20455,32 +20754,36 @@ "temporal.plaindatetime.second": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/second", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The second accessor property of Temporal.PlainDateTime instances returns a integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.second." + "doc": "The second accessor property of Temporal.PlainDateTime instances returns an integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.second." }, "temporal.plaindatetime.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.PlainDateTime instances returns a new Temporal.Duration object representing the duration from another date-time (in a form convertible by Temporal.PlainDateTime.from()) to this date-time. The duration is positive if the other date-time is before this date-time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.PlainDateTime instances returns a new Temporal.Duration object representing the duration from another date-time (in a form convertible by Temporal.PlainDateTime.from()) to this date-time. The duration is positive if the other date-time is before this date-time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainDateTime instance representing a date-time to subtract from this date-time. It is converted to a Temporal.PlainDateTime object using the same algorithm as Temporal.PlainDateTime.from(). It must have the same calendar as this.", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit accept all possible units. For largestUnit, the default value \"auto\" means \"days\" or smallestUnit, whichever is greater. For smallestUnit, the default value is \"nanoseconds\". The current date is used as the relativeTo option. Note that using units larger than \"days\" may make the duration not portable to other calendars or dates." @@ -20493,17 +20796,19 @@ "temporal.plaindatetime.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two date-times and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two date-times and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this date-time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -20516,33 +20821,37 @@ "temporal.plaindatetime.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.PlainDateTime instances returns a string representing this date-time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.PlainDateTime instances returns a string representing this date-time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given date-time in the RFC 9557 format, with the calendar annotation included if it is not \"iso8601\"." }, "temporal.plaindatetime.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.PlainDateTime instances returns a string with a language-sensitive representation of this date-time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.PlainDateTime instances returns a string with a language-sensitive representation of this date-time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. If this date-time's calendar is not \"iso8601\", the calendar option must be provided with the same value; otherwise, if this date-time's calendar is \"iso8601\", the calendar option can be any value. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -20556,49 +20865,55 @@ "temporal.plaindatetime.toplaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/toplaindate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDate() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDate object representing the date part (year, month, day) of this date-time in the same calendar system.", + "doc": "The toPlainDate() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDate object representing the date part (year, month, day) of this date-time in the same calendar system.", "returns": "A new Temporal.PlainDate object representing the date part (year, month, day) of this date-time in the same calendar system." }, "temporal.plaindatetime.toplaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/toplaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainTime() method of Temporal.PlainDateTime instances returns a new Temporal.PlainTime object representing the time part (hour, minute, second, and subsecond components) of this date-time.", + "doc": "The toPlainTime() method of Temporal.PlainDateTime instances returns a new Temporal.PlainTime object representing the time part (hour, minute, second, and subsecond components) of this date-time.", "returns": "A new Temporal.PlainTime object representing the time part (hour, minute, second, and subsecond components) of this date-time." }, "temporal.plaindatetime.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.PlainDateTime instances returns a string representing this date-time in the RFC 9557 format.", + "doc": "The toString() method of Temporal.PlainDateTime instances returns a string representing this date-time in the RFC 9557 format.", "parameters": { "options": "An object containing the following property:\n

    \n
    calendarName Optional
    \n
    \n

    Whether to show the calendar annotation ([u-ca=calendar_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Include the calendar annotation if the calendar is not \"iso8601\".\n

    \n
    \"always\"
    \n
    \n

    Always include the calendar annotation.\n

    \n
    \"never\"
    \n
    \n

    Never include the calendar annotation. This makes the returned string not recoverable to the same Temporal.PlainDateTime instance, although the date value still remains the same.\n

    \n
    \"critical\"
    \n
    \n

    Always include the calendar annotation, and add a critical flag: [!u-ca=calendar_id]. Useful when sending the string to certain systems, but not useful for Temporal itself.\n

    \n
    \n
    \n
    fractionalSecondDigits Optional
    \n
    \n

    Either an integer from 0 to 9, or the string \"auto\". The default is \"auto\". If \"auto\", then trailing zeros are removed from the fractional seconds. Otherwise, the fractional part of the second component contains this many digits, padded with zeros or rounded as necessary.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off fractional second digits beyond fractionalSecondDigits. See Intl.NumberFormat(). Defaults to \"trunc\".\n

    \n
    smallestUnit Optional
    \n
    \n

    A string specifying the smallest unit to include in the output. Possible values are \"minute\", \"second\", \"millisecond\", \"microsecond\", and \"nanosecond\", or their plural forms, which (except \"minute\") are equivalent to fractionalSecondDigits values of 0, 3, 6, 9, respectively. If specified, then fractionalSecondDigits is ignored.\n

    \n
    " }, @@ -20611,17 +20926,19 @@ "temporal.plaindatetime.tozoneddatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/tozoneddatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toZonedDateTime() method of Temporal.PlainDateTime instances returns a new Temporal.ZonedDateTime instance representing the same date-time as this plain date-time, but in the specified time zone.", + "doc": "The toZonedDateTime() method of Temporal.PlainDateTime instances returns a new Temporal.ZonedDateTime instance representing the same date-time as this plain date-time, but in the specified time zone.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to use. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information).", "options": "An object containing the following property:\n

    \n
    disambiguation Optional
    \n
    \n

    A string specifying what to do when this plain time corresponds to zero or more than one instants in the time zone, usually because of daylight saving time shifts. Possible values are \"compatible\", \"earlier\", \"later\", and \"reject\". Defaults to \"compatible\". For more information about these values, see ambiguity and gaps from local time to UTC time.\n

    \n
    " @@ -20635,17 +20952,19 @@ "temporal.plaindatetime.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.PlainDateTime instances returns a new Temporal.Duration object representing the duration from this date-time to another date-time (in a form convertible by Temporal.PlainDateTime.from()). The duration is positive if the other date-time is after this date-time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.PlainDateTime instances returns a new Temporal.Duration object representing the duration from this date-time to another date-time (in a form convertible by Temporal.PlainDateTime.from()). The duration is positive if the other date-time is after this date-time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainDateTime instance representing a date-time to subtract this date-time from. It is converted to a Temporal.PlainDateTime object using the same algorithm as Temporal.PlainDateTime.from(). It must have the same calendar as this.", "options": "The same options as since()." @@ -20658,17 +20977,19 @@ "temporal.plaindatetime.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.PlainDateTime instances throws a TypeError, which prevents Temporal.PlainDateTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.PlainDateTime instances throws a TypeError, which prevents Temporal.PlainDateTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -20677,32 +20998,36 @@ "temporal.plaindatetime.weekofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/weekofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The weekOfYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks.\n

    For general information and more examples, see Temporal.PlainDate.prototype.weekOfYear." + "doc": "The weekOfYear accessor property of Temporal.PlainDateTime instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.PlainDateTime object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks.\n

    For general information and more examples, see Temporal.PlainDate.prototype.weekOfYear." }, "temporal.plaindatetime.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's fields.\n

    To replace the calendarId property, use the withCalendar() method instead.", + "doc": "The with() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's fields.\n

    To replace the calendarId property, use the withCalendar() method instead.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.PlainDateTime.from() (except calendar): day, era and eraYear, hour, microsecond, millisecond, minute, month, monthCode, nanosecond, second, year. Unspecified properties use the values from the original date-time. You only need to provide one of month or monthCode, and one of era and eraYear or year, and the other will be updated accordingly.", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -20716,14 +21041,17 @@ "temporal.plaindatetime.withcalendar": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/withcalendar", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withCalendar() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's calendarId property.\n

    To replace the date-time component properties, use the with() method instead.", + "doc": "The withCalendar() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's calendarId property.\n

    To replace the date-time component properties, use the with() method instead.", "parameters": { "calendar": "A string that corresponds to the calendarId property. See Intl.supportedValuesOf() for a list of commonly supported calendar types." }, @@ -20736,17 +21064,19 @@ "temporal.plaindatetime.withplaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/withplaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withPlainTime() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time with the time part entirely replaced by the new time (in a form convertible by Temporal.PlainTime.from())\n

    This method will replace all time properties, defaulting to 0 where properties are unspecified. If you only want to replace some of the time properties, use the with() method instead.", + "doc": "The withPlainTime() method of Temporal.PlainDateTime instances returns a new Temporal.PlainDateTime object representing this date-time with the time part entirely replaced by the new time (in a form convertible by Temporal.PlainTime.from())\n

    This method will replace all time properties, defaulting to 0 where properties are unspecified. If you only want to replace some of the time properties, use the with() method instead.", "parameters": { "plainTime": "A string, an object, or a Temporal.PlainTime instance representing the new time. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from(). If not specified, the time part is set to 00:00:00." }, @@ -20755,92 +21085,104 @@ "temporal.plaindatetime.year": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/year", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The year accessor property of Temporal.PlainDateTime instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." + "doc": "The year accessor property of Temporal.PlainDateTime instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." }, "temporal.plaindatetime.yearofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaindatetime/yearofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The yearOfWeek accessor property of Temporal.PlainDateTime instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.yearOfWeek." + "doc": "The yearOfWeek accessor property of Temporal.PlainDateTime instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.yearOfWeek." }, "temporal.plainmonthday": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainMonthDay object represents the month and day of a calendar date, without a year or time zone; for example, an event on a calendar that recurs every year and happens during the whole day. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system. The year is used to disambiguate the month-day in non-ISO calendar systems." + "doc": "The Temporal.PlainMonthDay object represents the month and day of a calendar date, without a year or time zone; for example, an event on a calendar that recurs every year and happens during the whole day. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system. The year is used to disambiguate the month-day in non-ISO calendar systems." }, "temporal.plainmonthday.calendarid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/calendarid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The calendarId accessor property of Temporal.PlainMonthDay instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. There's no obvious way to create a new Temporal.PlainMonthDay object with a different calendar that represents the same month-day, so you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back." + "doc": "The calendarId accessor property of Temporal.PlainMonthDay instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. There's no obvious way to create a new Temporal.PlainMonthDay object with a different calendar that represents the same month-day, so you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back." }, "temporal.plainmonthday.day": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/day", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The day accessor property of Temporal.PlainMonthDay instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainMonthDay object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day." + "doc": "The day accessor property of Temporal.PlainMonthDay instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainMonthDay object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day." }, "temporal.plainmonthday.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.PlainMonthDay instances returns true if this month-day is equivalent in value to another month-day (in a form convertible by Temporal.PlainMonthDay.from()), and false otherwise. They are compared both by their underlying ISO date values and their calendars.\n

    \n

    Note:\nPlainMonthDay objects keep track of a reference ISO year, which is also used in the comparison. This year is automatically set when using the Temporal.PlainMonthDay.from() method, but can be set manually using the Temporal.PlainMonthDay() constructor, causing two equivalent month-days to be considered different if they have different reference years. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", + "doc": "The equals() method of Temporal.PlainMonthDay instances returns true if this month-day is equivalent in value to another month-day (in a form convertible by Temporal.PlainMonthDay.from()), and false otherwise. They are compared both by their underlying ISO date values and their calendars.\n
    \n

    Note:\nPlainMonthDay objects keep track of a reference ISO year, which is also used in the comparison. This year is automatically set when using the Temporal.PlainMonthDay.from() method, but can be set manually using the Temporal.PlainMonthDay() constructor, causing two equivalent month-days to be considered different if they have different reference years. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", "parameters": { "other": "A string, an object, or a Temporal.PlainMonthDay instance representing the other month-day to compare. It is converted to a Temporal.PlainMonthDay object using the same algorithm as Temporal.PlainMonthDay.from()." }, @@ -20849,17 +21191,19 @@ "temporal.plainmonthday.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainMonthDay.from() static method creates a new Temporal.PlainMonthDay object from another Temporal.PlainMonthDay object, an object with month and day properties, or an RFC 9557 string.", + "doc": "The Temporal.PlainMonthDay.from() static method creates a new Temporal.PlainMonthDay object from another Temporal.PlainMonthDay object, an object with month and day properties, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    ", "options": "An object containing the following property:\n
    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -20873,17 +21217,19 @@ "temporal.plainmonthday.monthcode": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/monthcode", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthCode accessor property of Temporal.PlainMonthDay instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    Because month is an index within a year, but PlainMonthDay doesn't have a year, there's no month property for PlainMonthDay. Therefore, monthCode is used to represent the month in a way that is independent of the year.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainMonthDay object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." + "doc": "The monthCode accessor property of Temporal.PlainMonthDay instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    Because month is an index within a year, but PlainMonthDay doesn't have a year, there's no month property for PlainMonthDay. Therefore, monthCode is used to represent the month in a way that is independent of the year.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainMonthDay object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." }, "temporal.plainmonthday.plainmonthday": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/plainmonthday", @@ -20914,33 +21260,37 @@ "temporal.plainmonthday.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.PlainMonthDay instances returns a string representing this month-day in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.PlainMonthDay instances returns a string representing this month-day in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given month-day in the RFC 9557 format, with the year and calendar annotation included if it is not \"iso8601\"." }, "temporal.plainmonthday.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.PlainMonthDay instances returns a string with a language-sensitive representation of this month-day. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.PlainMonthDay instances returns a string with a language-sensitive representation of this month-day. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. The calendar option must be provided with the same value as this month-day's calendar. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -20954,17 +21304,19 @@ "temporal.plainmonthday.toplaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/toplaindate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDate() method of Temporal.PlainMonthDay instances returns a new Temporal.PlainDate object representing this month-day and a supplied year in the same calendar system.", + "doc": "The toPlainDate() method of Temporal.PlainMonthDay instances returns a new Temporal.PlainDate object representing this month-day and a supplied year in the same calendar system.", "parameters": { "yearInfo": "An object representing the year component of the resulting PlainDate, containing the following properties (in the order they are retrieved and validated):\n

    \n
    era and eraYear
    \n
    \n

    A string and an integer that correspond to the era and eraYear properties. Are only used if the calendar system has eras. era and eraYear must be provided simultaneously. If they are not provided, then year must be provided. If all of era, eraYear, and year are provided, they must be consistent.\n

    \n
    year
    \n
    \n

    Corresponds to the year property.\n

    \n
    " }, @@ -20977,17 +21329,19 @@ "temporal.plainmonthday.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.PlainMonthDay instances returns a string representing this month-day in the RFC 9557 format.", + "doc": "The toString() method of Temporal.PlainMonthDay instances returns a string representing this month-day in the RFC 9557 format.", "parameters": { "options": "An object containing the following property:\n

    \n
    calendarName Optional
    \n
    \n

    Whether to show the calendar annotation ([u-ca=calendar_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Include the calendar annotation if the calendar is not \"iso8601\". The reference year is included if the calendar is not \"iso8601\".\n

    \n
    \"always\"
    \n
    \n

    Always include the calendar annotation. The reference year is always included too.\n

    \n
    \"never\"
    \n
    \n

    Never include the calendar annotation. This makes the returned string not recoverable to the same Temporal.PlainMonthDay instance, although the month-day value still remains the same. The reference year is included if the calendar is not \"iso8601\".\n

    \n
    \"critical\"
    \n
    \n

    Always include the calendar annotation, and add a critical flag: [!u-ca=calendar_id]. Useful when sending the string to certain systems, but not useful for Temporal itself. The reference year is always included too.\n

    \n
    \n
    \n
    " }, @@ -21000,17 +21354,19 @@ "temporal.plainmonthday.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.PlainMonthDay instances throws a TypeError, which prevents Temporal.PlainMonthDay instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.PlainMonthDay instances throws a TypeError, which prevents Temporal.PlainMonthDay instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -21019,17 +21375,19 @@ "temporal.plainmonthday.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainmonthday/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.PlainMonthDay instances returns a new Temporal.PlainMonthDay object representing this month-day with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the month-day's fields.\n

    There's no obvious way to create a new Temporal.PlainMonthDay object that represents the same month-day in a different calendar, so to replace its calendarId property, you need to convert it to a Temporal.PlainDate object using toPlainDate(), change the calendar, and then convert it back.", + "doc": "The with() method of Temporal.PlainMonthDay instances returns a new Temporal.PlainMonthDay object representing this month-day with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the month-day's fields.\n

    There's no obvious way to create a new Temporal.PlainMonthDay object that represents the same month-day in a different calendar, so to replace its calendarId property, you need to convert it to a Temporal.PlainDate object using toPlainDate(), change the calendar, and then convert it back.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.PlainMonthDay.from() (except calendar): day, era and eraYear, month, monthCode, year. Unspecified properties use the values from the original month-day. You need to provide the year if and only if you provide month and the calendar is not iso8601. You only need to provide one of month or monthCode, and one of era and eraYear or year, and the other will be updated accordingly.", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21043,10 +21401,12 @@ "temporal.plaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21054,15 +21414,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainTime object represents a time without a date or time zone; for example, a recurring event that happens at the same time every day. It is fundamentally represented as a combination of hour, minute, second, millisecond, microsecond, and nanosecond values." + "doc": "The Temporal.PlainTime object represents a time without a date or time zone; for example, a recurring event that happens at the same time every day. It is fundamentally represented as a combination of hour, minute, second, millisecond, microsecond, and nanosecond values." }, "temporal.plaintime.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21070,7 +21432,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time moved forward by a given duration (in a form convertible by Temporal.Duration.from()), wrapping around the clock if necessary.", + "doc": "The add() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time moved forward by a given duration (in a form convertible by Temporal.Duration.from()), wrapping around the clock if necessary.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -21079,10 +21441,12 @@ "temporal.plaintime.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21090,7 +21454,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first time comes before, is the same as, or comes after the second time. It is equivalent to comparing the hour, minute, second, millisecond, microsecond, and nanosecond fields one by one.", + "doc": "The Temporal.PlainTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first time comes before, is the same as, or comes after the second time. It is equivalent to comparing the hour, minute, second, millisecond, microsecond, and nanosecond fields one by one.", "parameters": { "time1": "A string, an object, or a Temporal.PlainTime instance representing the first time to compare. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from().", "time2": "The second time to compare, converted to a Temporal.PlainTime object using the same algorithm as time1." @@ -21100,10 +21464,12 @@ "temporal.plaintime.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21111,7 +21477,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.PlainTime instances returns true if this time is equivalent in value to another time (in a form convertible by Temporal.PlainTime.from()), and false otherwise. They are compared by their time values. It is equivalent to Temporal.PlainTime.compare(this, other) === 0.", + "doc": "The equals() method of Temporal.PlainTime instances returns true if this time is equivalent in value to another time (in a form convertible by Temporal.PlainTime.from()), and false otherwise. They are compared by their time values. It is equivalent to Temporal.PlainTime.compare(this, other) === 0.", "parameters": { "other": "A string, an object, or a Temporal.PlainTime instance representing the other time to compare. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from()." }, @@ -21120,10 +21486,12 @@ "temporal.plaintime.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21131,7 +21499,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainTime.from() static method creates a new Temporal.PlainTime object from another Temporal.PlainTime object, an object with time properties, or an RFC 9557 string.", + "doc": "The Temporal.PlainTime.from() static method creates a new Temporal.PlainTime object from another Temporal.PlainTime object, an object with time properties, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    ", "options": "An object containing the following property:\n
    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a time component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The time component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the time component is out of range.\n

    \n
    \n
    \n
    " @@ -21145,10 +21513,12 @@ "temporal.plaintime.hour": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/hour", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21156,15 +21526,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The hour accessor property of Temporal.PlainTime instances returns a integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The hour accessor property of Temporal.PlainTime instances returns an integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.microsecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/microsecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21172,15 +21544,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The microsecond accessor property of Temporal.PlainTime instances returns a integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The microsecond accessor property of Temporal.PlainTime instances returns an integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.millisecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/millisecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21188,15 +21562,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The millisecond accessor property of Temporal.PlainTime instances returns a integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The millisecond accessor property of Temporal.PlainTime instances returns an integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.minute": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/minute", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21204,15 +21580,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The minute accessor property of Temporal.PlainTime instances returns a integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The minute accessor property of Temporal.PlainTime instances returns an integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.nanosecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/nanosecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21220,15 +21598,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The nanosecond accessor property of Temporal.PlainTime instances returns a integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The nanosecond accessor property of Temporal.PlainTime instances returns an integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.plaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/plaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21236,7 +21616,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainTime() constructor creates Temporal.PlainTime objects.\n

    This constructor allows you to create instances by directly supplying the underlying data. Like all other Temporal classes, you should usually construct Temporal.PlainTime objects using the Temporal.PlainTime.from() static method, which can handle a variety of input types.", + "doc": "The Temporal.PlainTime() constructor creates Temporal.PlainTime objects.\n

    This constructor allows you to create instances by directly supplying the underlying data. Like all other Temporal classes, you should usually construct Temporal.PlainTime objects using the Temporal.PlainTime.from() static method, which can handle a variety of input types.", "parameters": { "hour": "A number, truncated to an integer, representing the hour component.", "minute": "A number, truncated to an integer, representing the minute component.", @@ -21253,10 +21633,12 @@ "temporal.plaintime.round": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/round", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21264,7 +21646,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The round() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time rounded to the given unit.", + "doc": "The round() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time rounded to the given unit.", "parameters": { "smallestUnit": "A string representing the smallestUnit option. This is a convenience overload, so round(smallestUnit) is equivalent to round({ smallestUnit }), where smallestUnit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    roundingIncrement Optional
    \n
    \n

    A number (truncated to an integer) representing the rounding increment in the given smallestUnit. Defaults to 1. The increment must be a divisor of the maximum value of smallestUnit; for example, if the unit is hours, the increment must be a divisor of 24 and must not be 24 itself, which means it can be 1, 2, 3, 4, 6, 8, or 12.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off the fractional part of smallestUnit. See Intl.NumberFormat(). Defaults to \"halfExpand\".\n

    \n
    smallestUnit
    \n
    \n

    A string representing the smallest unit to include in the output. The value must be one of the following: \"hour\", \"minute\", \"second\", \"millisecond\", \"microsecond\", \"nanosecond\", or their plural forms. For units larger than \"nanosecond\", fractional parts of the smallestUnit will be rounded according to the roundingIncrement and roundingMode settings.\n

    \n
    " @@ -21277,10 +21659,12 @@ "temporal.plaintime.second": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/second", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21288,15 +21672,17 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The second accessor property of Temporal.PlainTime instances returns a integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." + "doc": "The second accessor property of Temporal.PlainTime instances returns an integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainTime object with the desired new value." }, "temporal.plaintime.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21304,7 +21690,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.PlainTime instances returns a new Temporal.Duration object representing the duration from another time (in a form convertible by Temporal.PlainTime.from()) to this time. The duration is positive if the other time is before this time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.PlainTime instances returns a new Temporal.Duration object representing the duration from another time (in a form convertible by Temporal.PlainTime.from()) to this time. The duration is positive if the other time is before this time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainTime instance representing a time to subtract from this time. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from().", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit only accept the units: \"hours\", \"minutes\", \"seconds\", \"milliseconds\", \"microseconds\", \"nanoseconds\", or their singular forms. For largestUnit, the default value \"auto\" means \"hours\". For smallestUnit, the default value is \"nanoseconds\"." @@ -21317,10 +21703,12 @@ "temporal.plaintime.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21328,7 +21716,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time moved backward by a given duration (in a form convertible by Temporal.Duration.from()), wrapping around the clock if necessary.\n

    If you want to subtract two times and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time moved backward by a given duration (in a form convertible by Temporal.Duration.from()), wrapping around the clock if necessary.\n

    If you want to subtract two times and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from()." }, @@ -21337,10 +21725,12 @@ "temporal.plaintime.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21348,23 +21738,25 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.PlainTime instances returns a string representing this time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.PlainTime instances returns a string representing this time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given time in the RFC 9557 format." }, "temporal.plaintime.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.PlainTime instances returns a string with a language-sensitive representation of this time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.PlainTime instances returns a string with a language-sensitive representation of this time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -21378,10 +21770,12 @@ "temporal.plaintime.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21389,7 +21783,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.PlainTime instances returns a string representing this time in the RFC 9557 format.", + "doc": "The toString() method of Temporal.PlainTime instances returns a string representing this time in the RFC 9557 format.", "parameters": { "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    fractionalSecondDigits Optional
    \n
    \n

    Either an integer from 0 to 9, or the string \"auto\". The default is \"auto\". If \"auto\", then trailing zeros are removed from the fractional seconds. Otherwise, the fractional part of the second component contains this many digits, padded with zeros or rounded as necessary.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off fractional second digits beyond fractionalSecondDigits. See Intl.NumberFormat(). Defaults to \"trunc\".\n

    \n
    smallestUnit Optional
    \n
    \n

    A string specifying the smallest unit to include in the output. Possible values are \"minute\", \"second\", \"millisecond\", \"microsecond\", and \"nanosecond\", or their plural forms, which (except \"minute\") are equivalent to fractionalSecondDigits values of 0, 3, 6, 9, respectively. If specified, then fractionalSecondDigits is ignored.\n

    \n
    " }, @@ -21402,10 +21796,12 @@ "temporal.plaintime.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21413,7 +21809,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.PlainTime instances returns a new Temporal.Duration object representing the duration from this time to another time (in a form convertible by Temporal.PlainTime.from()). The duration is positive if the other time is after this time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.PlainTime instances returns a new Temporal.Duration object representing the duration from this time to another time (in a form convertible by Temporal.PlainTime.from()). The duration is positive if the other time is after this time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainTime instance representing a time to subtract this time from. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from(). It must have the same calendar as this.", "options": "The same options as since()." @@ -21426,10 +21822,12 @@ "temporal.plaintime.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21437,7 +21835,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.PlainTime instances throws a TypeError, which prevents Temporal.PlainTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.PlainTime instances throws a TypeError, which prevents Temporal.PlainTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -21446,10 +21844,12 @@ "temporal.plaintime.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plaintime/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139", "Safari": "preview" @@ -21457,7 +21857,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the time's fields.", + "doc": "The with() method of Temporal.PlainTime instances returns a new Temporal.PlainTime object representing this time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the time's fields.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.PlainTime.from(): hour, microsecond, millisecond, minute, nanosecond, second. Unspecified properties use the values from the original time.", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a time component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The time component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the time component is out of range.\n

    \n
    \n
    \n
    " @@ -21471,32 +21871,36 @@ "temporal.plainyearmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainYearMonth object represents the year and month of a calendar date, without a day or time zone; for example, an event on a calendar that happens during the whole month. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system. The day is used to disambiguate the year-month in non-ISO calendar systems." + "doc": "The Temporal.PlainYearMonth object represents the year and month of a calendar date, without a day or time zone; for example, an event on a calendar that happens during the whole month. It is fundamentally represented as an ISO 8601 calendar date, with year, month, and day fields, and an associated calendar system. The day is used to disambiguate the year-month in non-ISO calendar systems." }, "temporal.plainyearmonth.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", + "doc": "The add() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this year-month. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21509,32 +21913,36 @@ "temporal.plainyearmonth.calendarid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/calendarid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The calendarId accessor property of Temporal.PlainYearMonth instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. There's no obvious way to create a new Temporal.PlainYearMonth object with a different calendar that represents the same year-month, so you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back." + "doc": "The calendarId accessor property of Temporal.PlainYearMonth instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. There's no obvious way to create a new Temporal.PlainYearMonth object with a different calendar that represents the same year-month, so you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back." }, "temporal.plainyearmonth.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainYearMonth.compare() static method returns a number (-1, 0, or 1) indicating whether the first year-month comes before, is the same as, or comes after the second year-month. It is equivalent to comparing their underlying ISO 8601 dates. Two year-months from different calendars may be considered equal if they start on the same ISO date.\n

    \n

    Note:\nPlainYearMonth objects keep track of a reference ISO day, which is also used in the comparison. This day is automatically set when using the Temporal.PlainYearMonth.from() method, but can be set manually using the Temporal.PlainYearMonth() constructor, causing two equivalent year-months to be considered different if they have different reference days. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", + "doc": "The Temporal.PlainYearMonth.compare() static method returns a number (-1, 0, or 1) indicating whether the first year-month comes before, is the same as, or comes after the second year-month. It is equivalent to comparing their underlying ISO 8601 dates. Two year-months from different calendars may be considered equal if they start on the same ISO date.\n
    \n

    Note:\nPlainYearMonth objects keep track of a reference ISO day, which is also used in the comparison. This day is automatically set when using the Temporal.PlainYearMonth.from() method, but can be set manually using the Temporal.PlainYearMonth() constructor, causing two equivalent year-months to be considered different if they have different reference days. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", "parameters": { "yearMonth1": "A string, an object, or a Temporal.PlainYearMonth instance representing the first year-month to compare. It is converted to a Temporal.PlainYearMonth object using the same algorithm as Temporal.PlainYearMonth.from().", "yearMonth2": "The second year-month to compare, converted to a Temporal.PlainYearMonth object using the same algorithm as yearMonth1." @@ -21544,47 +21952,53 @@ "temporal.plainyearmonth.daysinmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/daysinmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInMonth accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." + "doc": "The daysInMonth accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." }, "temporal.plainyearmonth.daysinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/daysinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInYear accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." + "doc": "The daysInYear accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." }, "temporal.plainyearmonth.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.PlainYearMonth instances returns true if this year-month is equivalent in value to another year-month (in a form convertible by Temporal.PlainYearMonth.from()), and false otherwise. They are compared both by their underlying ISO date values and their calendars, so two year-months from different calendars may be considered equal by Temporal.PlainYearMonth.compare() but not by equals().\n

    \n

    Note:\nPlainYearMonth objects keep track of a reference ISO day, which is also used in the comparison. This day is automatically set when using the Temporal.PlainYearMonth.from() method, but can be set manually using the Temporal.PlainYearMonth() constructor, causing two equivalent year-months to be considered different if they have different reference days. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", + "doc": "The equals() method of Temporal.PlainYearMonth instances returns true if this year-month is equivalent in value to another year-month (in a form convertible by Temporal.PlainYearMonth.from()), and false otherwise. They are compared both by their underlying ISO date values and their calendars, so two year-months from different calendars may be considered equal by Temporal.PlainYearMonth.compare() but not by equals().\n
    \n

    Note:\nPlainYearMonth objects keep track of a reference ISO day, which is also used in the comparison. This day is automatically set when using the Temporal.PlainYearMonth.from() method, but can be set manually using the Temporal.PlainYearMonth() constructor, causing two equivalent year-months to be considered different if they have different reference days. For this reason, you should avoid using the constructor directly and prefer the from() method.\n

    ", "parameters": { "other": "A string, an object, or a Temporal.PlainYearMonth instance representing the other year-month to compare. It is converted to a Temporal.PlainYearMonth object using the same algorithm as Temporal.PlainYearMonth.from()." }, @@ -21593,47 +22007,53 @@ "temporal.plainyearmonth.era": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/era", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The era accessor property of Temporal.PlainYearMonth instances returns a calendar-specific lowercase string representing the era of this year-month, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." + "doc": "The era accessor property of Temporal.PlainYearMonth instances returns a calendar-specific lowercase string representing the era of this year-month, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." }, "temporal.plainyearmonth.erayear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/erayear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The eraYear accessor property of Temporal.PlainYearMonth instances returns a non-negative integer representing the year of this year-month within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." + "doc": "The eraYear accessor property of Temporal.PlainYearMonth instances returns a non-negative integer representing the year of this year-month within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." }, "temporal.plainyearmonth.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.PlainYearMonth.from() static method creates a new Temporal.PlainYearMonth object from another Temporal.PlainYearMonth object, an object with year and month properties, or an RFC 9557 string.", + "doc": "The Temporal.PlainYearMonth.from() static method creates a new Temporal.PlainYearMonth object from another Temporal.PlainYearMonth object, an object with year and month properties, or an RFC 9557 string.", "parameters": { "info": "One of the following:\n

    ", "options": "An object containing the following property:\n
    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21647,62 +22067,70 @@ "temporal.plainyearmonth.inleapyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/inleapyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The inLeapYear accessor property of Temporal.PlainYearMonth instances returns a boolean indicating whether this year-month is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." + "doc": "The inLeapYear accessor property of Temporal.PlainYearMonth instances returns a boolean indicating whether this year-month is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." }, "temporal.plainyearmonth.month": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/month", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The month accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the 1-based month index in the year of this year-month. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." + "doc": "The month accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the 1-based month index in the year of this year-month. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." }, "temporal.plainyearmonth.monthcode": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/monthcode", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthCode accessor property of Temporal.PlainYearMonth instances returns a calendar-specific string representing the month of this year-month. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." + "doc": "The monthCode accessor property of Temporal.PlainYearMonth instances returns a calendar-specific string representing the month of this year-month. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." }, "temporal.plainyearmonth.monthsinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/monthsinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthsInYear accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." + "doc": "The monthsInYear accessor property of Temporal.PlainYearMonth instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." }, "temporal.plainyearmonth.plainyearmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/plainyearmonth", @@ -21733,17 +22161,19 @@ "temporal.plainyearmonth.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.PlainYearMonth instances returns a new Temporal.Duration object representing the duration from another year-month (in a form convertible by Temporal.PlainYearMonth.from()) to this year-month. The duration is positive if the other month is before this month, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.PlainYearMonth instances returns a new Temporal.Duration object representing the duration from another year-month (in a form convertible by Temporal.PlainYearMonth.from()) to this year-month. The duration is positive if the other month is before this month, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainYearMonth instance representing a year-month to subtract from this year-month. It is converted to a Temporal.PlainYearMonth object using the same algorithm as Temporal.PlainYearMonth.from(). It must have the same calendar as this.", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit only accept the units: \"years\", \"months\", or their singular forms. For largestUnit, the default value \"auto\" means \"years\". For smallestUnit, the default value is \"months\". The current date is used as the relativeTo option." @@ -21756,17 +22186,19 @@ "temporal.plainyearmonth.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two year-months and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two year-months and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this year-month. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21779,33 +22211,37 @@ "temporal.plainyearmonth.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.PlainYearMonth instances returns a string representing this year-month in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.PlainYearMonth instances returns a string representing this year-month in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given date in the RFC 9557 format, with the calendar annotation included if it is not \"iso8601\"." }, "temporal.plainyearmonth.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.PlainYearMonth instances returns a string with a language-sensitive representation of this year-month. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", + "doc": "The toLocaleString() method of Temporal.PlainYearMonth instances returns a string with a language-sensitive representation of this year-month. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context.", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. The calendar option must be provided with the same value as this year-month's calendar. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -21819,17 +22255,19 @@ "temporal.plainyearmonth.toplaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/toplaindate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDate() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainDate object representing this year-month and a supplied day in the same calendar system.", + "doc": "The toPlainDate() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainDate object representing this year-month and a supplied day in the same calendar system.", "parameters": { "dayInfo": "An object representing the day component of the resulting PlainDate, containing the following property:\n

    \n
    day
    \n
    \n

    Corresponds to the day property.\n

    \n
    " }, @@ -21842,17 +22280,19 @@ "temporal.plainyearmonth.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.PlainYearMonth instances returns a string representing this year-month in the RFC 9557 format.", + "doc": "The toString() method of Temporal.PlainYearMonth instances returns a string representing this year-month in the RFC 9557 format.", "parameters": { "options": "An object containing the following property:\n

    \n
    calendarName Optional
    \n
    \n

    Whether to show the calendar annotation ([u-ca=calendar_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Include the calendar annotation if the calendar is not \"iso8601\". The reference day is included if the calendar is not \"iso8601\".\n

    \n
    \"always\"
    \n
    \n

    Always include the calendar annotation. The reference day is always included too.\n

    \n
    \"never\"
    \n
    \n

    Never include the calendar annotation. This makes the returned string not recoverable to the same Temporal.PlainYearMonth instance, although the year-month value still remains the same. The reference day is included if the calendar is not \"iso8601\".\n

    \n
    \"critical\"
    \n
    \n

    Always include the calendar annotation, and add a critical flag: [!u-ca=calendar_id]. Useful when sending the string to certain systems, but not useful for Temporal itself. The reference day is always included too.\n

    \n
    \n
    \n
    " }, @@ -21865,17 +22305,19 @@ "temporal.plainyearmonth.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.PlainYearMonth instances returns a new Temporal.Duration object representing the duration from this year-month to another year-month (in a form convertible by Temporal.PlainYearMonth.from()). The duration is positive if the other month is after this month, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.PlainYearMonth instances returns a new Temporal.Duration object representing the duration from this year-month to another year-month (in a form convertible by Temporal.PlainYearMonth.from()). The duration is positive if the other month is after this month, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string, an object, or a Temporal.PlainYearMonth instance representing a year-month to subtract this year-month from. It is converted to a Temporal.PlainYearMonth object using the same algorithm as Temporal.PlainYearMonth.from(). It must have the same calendar as this.", "options": "The same options as since()." @@ -21888,17 +22330,19 @@ "temporal.plainyearmonth.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.PlainYearMonth instances throws a TypeError, which prevents Temporal.PlainYearMonth instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.PlainYearMonth instances throws a TypeError, which prevents Temporal.PlainYearMonth instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -21907,17 +22351,19 @@ "temporal.plainyearmonth.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the year-month's fields.\n

    There's no obvious way to create a new Temporal.PlainYearMonth object that represents the same year-month in a different calendar, so to replace its calendarId property, you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back.", + "doc": "The with() method of Temporal.PlainYearMonth instances returns a new Temporal.PlainYearMonth object representing this year-month with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the year-month's fields.\n

    There's no obvious way to create a new Temporal.PlainYearMonth object that represents the same year-month in a different calendar, so to replace its calendarId property, you need to convert it to a Temporal.PlainDate object first using toPlainDate(), change the calendar, and then convert it back.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.PlainYearMonth.from() (except calendar): era and eraYear, month, monthCode, year. Unspecified properties use the values from the original year-month. You only need to provide one of month or monthCode, and one of era and eraYear or year, and the other will be updated accordingly.", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21931,47 +22377,53 @@ "temporal.plainyearmonth.year": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/plainyearmonth/year", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The year accessor property of Temporal.PlainYearMonth instances returns an integer representing the number of years of this year-month relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." + "doc": "The year accessor property of Temporal.PlainYearMonth instances returns an integer representing the number of years of this year-month relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.PlainYearMonth object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." }, "temporal.zoneddatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.ZonedDateTime object represents a date and time with a time zone. It is fundamentally represented as a combination of an instant, a time zone, and a calendar system." + "doc": "The Temporal.ZonedDateTime object represents a date and time with a time zone. It is fundamentally represented as a combination of an instant, a time zone, and a calendar system." }, "temporal.zoneddatetime.add": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/add", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The add() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", + "doc": "The add() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time moved forward by a given duration (in a form convertible by Temporal.Duration.from()).", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to add to this date-time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -21984,32 +22436,36 @@ "temporal.zoneddatetime.calendarid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/calendarid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The calendarId accessor property of Temporal.ZonedDateTime instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.ZonedDateTime object with the desired new value." + "doc": "The calendarId accessor property of Temporal.ZonedDateTime instances returns a string representing the calendar used to interpret the internal ISO 8601 date.\n

    See Intl.supportedValuesOf() for a list of commonly supported calendar types.\n

    The set accessor of calendarId is undefined. You cannot change this property directly. Use the withCalendar() method to create a new Temporal.ZonedDateTime object with the desired new value." }, "temporal.zoneddatetime.compare": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/compare", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.ZonedDateTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first date-time comes before, is the same as, or comes after the second date-time. It is equivalent to comparing the epochNanoseconds of the two date-times.", + "doc": "The Temporal.ZonedDateTime.compare() static method returns a number (-1, 0, or 1) indicating whether the first date-time comes before, is the same as, or comes after the second date-time. It is equivalent to comparing the epochNanoseconds of the two date-times.", "parameters": { "dateTime1": "A string, an object, or a Temporal.ZonedDateTime instance representing the first date-time to compare. It is converted to a Temporal.ZonedDateTime object using the same algorithm as Temporal.ZonedDateTime.from().", "dateTime2": "The second date-time to compare, converted to a Temporal.ZonedDateTime object using the same algorithm as dateTime1." @@ -22019,137 +22475,155 @@ "temporal.zoneddatetime.day": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/day", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The day accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day.\n

    For PlainDate, day can only be non-continuous if the calendar skips days. For ZonedDateTime, day can also be non-continuous if the time zone changes its offset by 24 hours; this actually happened. See the example below." + "doc": "The day accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the month of this date, which is the same day number you would see on a calendar. It is calendar-dependent.\n

    The set accessor of day is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.day.\n

    For PlainDate, day can only be non-continuous if the calendar skips days. For ZonedDateTime, day can also be non-continuous if the time zone changes its offset by 24 hours; this actually happened. See the example below." }, "temporal.zoneddatetime.dayofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/dayofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfWeek accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfWeek." + "doc": "The dayOfWeek accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the week of this date. Days in a week are numbered sequentially from 1 to daysInWeek, with each number mapping to its name. It is calendar-dependent.\n

    The set accessor of dayOfWeek is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new dayOfWeek value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfWeek." }, "temporal.zoneddatetime.dayofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/dayofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dayOfYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfYear." + "doc": "The dayOfYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based day index in the year of this date. The first day of this year is 1, and the last day is the daysInYear. It is calendar-dependent.\n

    The set accessor of dayOfYear is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new dayOfYear value, use the add() or subtract() method with the appropriate number of days.\n

    For general information and more examples, see Temporal.PlainDate.prototype.dayOfYear." }, "temporal.zoneddatetime.daysinmonth": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/daysinmonth", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInMonth accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." + "doc": "The daysInMonth accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the month of this date. It is calendar-dependent.\n

    The set accessor of daysInMonth is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInMonth." }, "temporal.zoneddatetime.daysinweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/daysinweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInWeek accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInWeek." + "doc": "The daysInWeek accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the week of this date. It is calendar-dependent.\n

    The set accessor of daysInWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInWeek." }, "temporal.zoneddatetime.daysinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/daysinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The daysInYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." + "doc": "The daysInYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of days in the year of this date. It is calendar-dependent.\n

    The set accessor of daysInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.daysInYear." }, "temporal.zoneddatetime.epochmilliseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/epochmilliseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The epochMilliseconds accessor property of Temporal.ZonedDateTime instances returns an integer representing the number of milliseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant. It is equivalent to dividing epochNanoseconds by 1e6 and flooring the result.\n

    The set accessor of epochMilliseconds is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new epochMilliseconds value, see below." + "doc": "The epochMilliseconds accessor property of Temporal.ZonedDateTime instances returns an integer representing the number of milliseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant. It is equivalent to dividing epochNanoseconds by 1e6 and flooring the result.\n

    The set accessor of epochMilliseconds is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new epochMilliseconds value, see below." }, "temporal.zoneddatetime.epochnanoseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/epochnanoseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The epochNanoseconds accessor property of Temporal.ZonedDateTime instances returns a BigInt representing the number of nanoseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant.\n

    The set accessor of epochNanoseconds is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new epochNanoseconds value, use the new Temporal.ZonedDateTime() constructor instead.\n

    An instant can only represent ±108 days (about ±273,972.6 years) around the epoch, which is ±8.64e21 nanoseconds. Attempting to set epochNanoseconds beyond this boundary throws a RangeError." + "doc": "The epochNanoseconds accessor property of Temporal.ZonedDateTime instances returns a BigInt representing the number of nanoseconds elapsed since the Unix epoch (midnight at the beginning of January 1, 1970, UTC) to this instant.\n

    The set accessor of epochNanoseconds is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new epochNanoseconds value, use the new Temporal.ZonedDateTime() constructor instead.\n

    An instant can only represent ±108 days (about ±273,972.6 years) around the epoch, which is ±8.64e21 nanoseconds. Attempting to set epochNanoseconds beyond this boundary throws a RangeError." }, "temporal.zoneddatetime.equals": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/equals", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The equals() method of Temporal.ZonedDateTime instances returns true if this date-time is equivalent in value to another date-time (in a form convertible by Temporal.ZonedDateTime.from()), and false otherwise. They are compared both by their instant values, time zones, and their calendars, so two date-times from different calendars or time zones may be considered equal by Temporal.ZonedDateTime.compare() but not by equals().", + "doc": "The equals() method of Temporal.ZonedDateTime instances returns true if this date-time is equivalent in value to another date-time (in a form convertible by Temporal.ZonedDateTime.from()), and false otherwise. They are compared both by their instant values, time zones, and their calendars, so two date-times from different calendars or time zones may be considered equal by Temporal.ZonedDateTime.compare() but not by equals().", "parameters": { "other": "A string, an object, or a Temporal.ZonedDateTime instance representing the other date-time to compare. It is converted to a Temporal.ZonedDateTime object using the same algorithm as Temporal.ZonedDateTime.from()." }, @@ -22158,49 +22632,55 @@ "temporal.zoneddatetime.era": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/era", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The era accessor property of Temporal.ZonedDateTime instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." + "doc": "The era accessor property of Temporal.ZonedDateTime instances returns a calendar-specific lowercase string representing the era of this date, or undefined if the calendar does not use eras (e.g., ISO 8601). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of era is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.era." }, "temporal.zoneddatetime.erayear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/erayear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The eraYear accessor property of Temporal.ZonedDateTime instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." + "doc": "The eraYear accessor property of Temporal.ZonedDateTime instances returns a non-negative integer representing the year of this date within the era, or undefined if the calendar does not use eras (e.g., ISO 8601). The year index usually starts from 1 (more common) or 0, and years in an era can decrease with time (e.g., Gregorian BCE). era and eraYear together uniquely identify a year in a calendar, in the same way that year does. It is calendar-dependent.\n

    The set accessor of eraYear is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.eraYear." }, "temporal.zoneddatetime.from": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The Temporal.ZonedDateTime.from() static method creates a new Temporal.ZonedDateTime object from another Temporal.ZonedDateTime object, an object with date, time, and time zone properties, or an RFC 9557 string.", + "doc": "The Temporal.ZonedDateTime.from() static method creates a new Temporal.ZonedDateTime object from another Temporal.ZonedDateTime object, an object with date, time, and time zone properties, or an RFC 9557 string.", "parameters": { - "info": "One of the following:\n

    ", + "info": "One of the following:\n", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n
    \n
    disambiguation Optional
    \n
    \n

    What to do if the local date-time is ambiguous in the given time zone (there are more than one instants with such local time, or the local time does not exist). Possible values are \"compatible\", \"earlier\", \"later\", and \"reject\". Defaults to \"compatible\". For more information about these values, see ambiguity and gaps from local time to UTC time.\n

    \n
    offset Optional
    \n
    \n

    What to do if the offset is explicitly provided in info but the offset is invalid for the given time zone in the given local time. Possible values are \"use\", \"ignore\", \"reject\", and \"prefer\". Defaults to \"reject\". For more information about these values, see offset ambiguity.\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " }, "returns": "A new Temporal.ZonedDateTime object, representing the date and time specified by info in the specified calendar and timeZone.", @@ -22212,17 +22692,19 @@ "temporal.zoneddatetime.gettimezonetransition": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/gettimezonetransition", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The getTimeZoneTransition() method of Temporal.ZonedDateTime instances returns a Temporal.ZonedDateTime object representing the closest instant after or before this instant at which the time zone's UTC offset changes (the returned instant is the first instant after the change), or null if there is no such transition. This is useful for finding out the offset rules of a time zone, such as its daylight saving time pattern.\n

    Note that instants returned about the future may be unreliable, for example due to changes to the time zone definitions.", + "doc": "The getTimeZoneTransition() method of Temporal.ZonedDateTime instances returns a Temporal.ZonedDateTime object representing the closest instant after or before this instant at which the time zone's UTC offset changes (the returned instant is the first instant after the change), or null if there is no such transition. This is useful for finding out the offset rules of a time zone, such as its daylight saving time pattern.\n

    Note that instants returned about the future may be unreliable, for example due to changes to the time zone definitions.", "parameters": { "direction": "A string representing the direction option. This is a convenience overload, so getTimeZoneTransition(direction) is equivalent to getTimeZoneTransition({ direction }), where direction is a string.", "options": "An object containing the following property:\n

    \n
    direction
    \n
    \n

    Whether to search before or after the current instant. Must be one of \"next\" or \"previous\".\n

    \n
    " @@ -22232,197 +22714,223 @@ "temporal.zoneddatetime.hour": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/hour", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The hour accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.hour.\n

    For ZonedDateTime, hour can be non-continuous due to offset changes such as daylight saving time transitions. In this case, the hour may be repeated or skipped." + "doc": "The hour accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 23 representing the hour component of this time.\n

    The set accessor of hour is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.hour.\n

    For ZonedDateTime, hour can be non-continuous due to offset changes such as daylight saving time transitions. In this case, the hour may be repeated or skipped." }, "temporal.zoneddatetime.hoursinday": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/hoursinday", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The hoursInDay accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of hours in the day of this date in the time zone. It may be more or less than 24 in the case of offset changes such as daylight saving time.\n

    Because ZonedDateTime is the only class that's time zone-aware, and hours in a day can only change by offset changes, all other classes assume 24-hour days.\n

    The set accessor of hoursInDay is undefined. You cannot change this property directly." + "doc": "The hoursInDay accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of hours in the day of this date in the time zone. It may be more or less than 24 in the case of offset changes such as daylight saving time.\n

    Because ZonedDateTime is the only class that's time zone-aware, and hours in a day can only change by offset changes, all other classes assume 24-hour days.\n

    The set accessor of hoursInDay is undefined. You cannot change this property directly." }, "temporal.zoneddatetime.inleapyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/inleapyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The inLeapYear accessor property of Temporal.ZonedDateTime instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." + "doc": "The inLeapYear accessor property of Temporal.ZonedDateTime instances returns a boolean indicating whether this date is in a leap year. A leap year is a year that has more days (due to a leap day or leap month) than a common year. It is calendar-dependent.\n

    The set accessor of inLeapYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.inLeapYear." }, "temporal.zoneddatetime.microsecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/microsecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The microsecond accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.microsecond." + "doc": "The microsecond accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 999 representing the microsecond (10-6 second) component of this time.\n

    The set accessor of microsecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.microsecond." }, "temporal.zoneddatetime.millisecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/millisecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The millisecond accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.millisecond." + "doc": "The millisecond accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 999 representing the millisecond (10-3 second) component of this time.\n

    The set accessor of millisecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.millisecond." }, "temporal.zoneddatetime.minute": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/minute", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The minute accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.minute.\n

    For ZonedDateTime, minute can be non-continuous due to offset changes. While much rarer than hour changes (because daylight saving time shifts are usually by whole hours), it can still happen." + "doc": "The minute accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 59 representing the minute component of this time.\n

    The set accessor of minute is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.minute.\n

    For ZonedDateTime, minute can be non-continuous due to offset changes. While much rarer than hour changes (because daylight saving time shifts are usually by whole hours), it can still happen." }, "temporal.zoneddatetime.month": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/month", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The month accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." + "doc": "The month accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based month index in the year of this date. The first month of this year is 1, and the last month is the monthsInYear. It is calendar-dependent.\n

    The set accessor of month is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.month." }, "temporal.zoneddatetime.monthcode": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/monthcode", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthCode accessor property of Temporal.ZonedDateTime instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." + "doc": "The monthCode accessor property of Temporal.ZonedDateTime instances returns a calendar-specific string representing the month of this date. It is calendar-dependent.\n

    Usually it is M plus a two-digit month number. For leap months, it is the previous month's code followed by L (even if it's conceptually a derivative of the following month; for example, in the Hebrew calendar, Adar I has code M05L but Adar II has code M06). If the leap month is the first month of the year, the code is M00L.\n

    The set accessor of monthCode is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthCode." }, "temporal.zoneddatetime.monthsinyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/monthsinyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The monthsInYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." + "doc": "The monthsInYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the number of months in the year of this date. It is calendar-dependent.\n

    The set accessor of monthsInYear is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.monthsInYear." }, "temporal.zoneddatetime.nanosecond": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/nanosecond", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The nanosecond accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.nanosecond." + "doc": "The nanosecond accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 999 representing the nanosecond (10-9 second) component of this time.\n

    The set accessor of nanosecond is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.nanosecond." }, "temporal.zoneddatetime.offset": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/offset", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The offset accessor property of Temporal.ZonedDateTime instances returns a string representing the offset used to interpret the internal instant, in the form ±HH:mm (or ±HH:mm:ss.sssssssss with as much subminute precision as necessary). This offset is guaranteed to be valid for the given instant and time zone at construction time.\n

    The set accessor of offset is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value (usually also changing the date/time), or use the withTimeZone() method to create a new Temporal.ZonedDateTime object in another time zone." + "doc": "The offset accessor property of Temporal.ZonedDateTime instances returns a string representing the offset used to interpret the internal instant, in the form ±HH:mm (or ±HH:mm:ss.sssssssss with as much subminute precision as necessary). This offset is guaranteed to be valid for the given instant and time zone at construction time.\n

    The set accessor of offset is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value (usually also changing the date/time), or use the withTimeZone() method to create a new Temporal.ZonedDateTime object in another time zone." }, "temporal.zoneddatetime.offsetnanoseconds": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/offsetnanoseconds", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The offsetNanoseconds accessor property of Temporal.ZonedDateTime instances returns an integer representing the offset used to interpret the internal instant, as a number of nanoseconds (positive or negative). The value is a safe integer because it's less than a day, which is 8.64e15 nanoseconds.\n

    The set accessor of offsetNanoseconds is undefined. You cannot change this property directly. Change offset to change this property too." + "doc": "The offsetNanoseconds accessor property of Temporal.ZonedDateTime instances returns an integer representing the offset used to interpret the internal instant, as a number of nanoseconds (positive or negative). The value is a safe integer because it's less than a day, which is 8.64e15 nanoseconds.\n

    The set accessor of offsetNanoseconds is undefined. You cannot change this property directly. Change offset to change this property too." }, "temporal.zoneddatetime.round": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/round", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The round() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time rounded to the given unit.", + "doc": "The round() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time rounded to the given unit.", "parameters": { "smallestUnit": "A string representing the smallestUnit option. This is a convenience overload, so round(smallestUnit) is equivalent to round({ smallestUnit }), where smallestUnit is a string.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    roundingIncrement Optional
    \n
    \n

    A number (truncated to an integer) representing the rounding increment in the given smallestUnit. Defaults to 1. For all values of smallestUnit except \"day\", the increment must be a divisor of the maximum value of the unit; for example, if the unit is hours, the increment must be a divisor of 24 and must not be 24 itself, which means it can be 1, 2, 3, 4, 6, 8, or 12. For \"day\", the increment must be 1.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off the fractional part of smallestUnit. See Intl.NumberFormat(). Defaults to \"halfExpand\".\n

    \n
    smallestUnit
    \n
    \n

    A string representing the smallest unit to include in the output. The value must be one of the following: \"day\", \"hour\", \"minute\", \"second\", \"millisecond\", \"microsecond\", \"nanosecond\", or their plural forms. For units larger than \"nanosecond\", fractional parts of the smallestUnit will be rounded according to the roundingIncrement and roundingMode settings.\n

    \n
    " @@ -22435,32 +22943,36 @@ "temporal.zoneddatetime.second": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/second", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The second accessor property of Temporal.ZonedDateTime instances returns a integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.second.\n

    For ZonedDateTime, second can be non-continuous due to offset changes. While much rarer than hour or minute changes (because daylight saving time shifts are usually by whole hours), it can still happen." + "doc": "The second accessor property of Temporal.ZonedDateTime instances returns an integer from 0 to 59 representing the second component of this time.\n

    The set accessor of second is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainTime.prototype.second.\n

    For ZonedDateTime, second can be non-continuous due to offset changes. While much rarer than hour or minute changes (because daylight saving time shifts are usually by whole hours), it can still happen." }, "temporal.zoneddatetime.since": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/since", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The since() method of Temporal.ZonedDateTime instances returns a new Temporal.Duration object representing the duration from another date-time (in a form convertible by Temporal.ZonedDateTime.from()) to this date-time. The duration is positive if the other date-time is before this date-time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", + "doc": "The since() method of Temporal.ZonedDateTime instances returns a new Temporal.Duration object representing the duration from another date-time (in a form convertible by Temporal.ZonedDateTime.from()) to this date-time. The duration is positive if the other date-time is before this date-time, and negative if after.\n

    This method does this - other. To do other - this, use the until() method.", "parameters": { "other": "A string, an object, or a Temporal.ZonedDateTime instance representing a date-time to subtract from this date-time. It is converted to a Temporal.ZonedDateTime object using the same algorithm as Temporal.ZonedDateTime.from(). It must have the same calendar as this.", "options": "An object containing the options for Temporal.Duration.prototype.round(), which includes largestUnit, roundingIncrement, roundingMode, and smallestUnit. largestUnit and smallestUnit accept all possible units. For largestUnit, the default value \"auto\" means \"hours\" or smallestUnit, whichever is greater. For smallestUnit, the default value is \"nanoseconds\". The current date is used as the relativeTo option. Note that using units larger than \"hours\" may make the duration not portable to other calendars, dates, or time zones." @@ -22473,33 +22985,37 @@ "temporal.zoneddatetime.startofday": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/startofday", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The startOfDay() method of Temporal.ZonedDateTime instances returns a Temporal.ZonedDateTime object representing the first instant of this date in the time zone. It usually has a time of 00:00:00, but may be different if the midnight doesn't exist due to offset changes, in which case the first time that exists is returned.\n

    It is equivalent to calling withPlainTime() with no arguments.", + "doc": "The startOfDay() method of Temporal.ZonedDateTime instances returns a Temporal.ZonedDateTime object representing the first instant of this date in the time zone. It usually has a time of 00:00:00, but may be different if the midnight doesn't exist due to offset changes, in which case the first time that exists is returned.\n

    It is equivalent to calling withPlainTime() with no arguments.", "returns": "A Temporal.ZonedDateTime object with instant t, such that:\n

    " }, "temporal.zoneddatetime.subtract": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/subtract", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The subtract() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two date-times and get a duration, use since() or until() instead.", + "doc": "The subtract() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time moved backward by a given duration (in a form convertible by Temporal.Duration.from()).\n

    If you want to subtract two date-times and get a duration, use since() or until() instead.", "parameters": { "duration": "A string, an object, or a Temporal.Duration instance representing a duration to subtract from this date-time. It is converted to a Temporal.Duration object using the same algorithm as Temporal.Duration.from().", "options": "An object containing the following property:\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range. Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -22512,64 +23028,72 @@ "temporal.zoneddatetime.timezoneid": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/timezoneid", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The timeZoneId accessor property of Temporal.ZonedDateTime instances returns a string representing the time zone identifier used to interpret the internal instant. The string is either a named identifier in the preferred case (such as \"America/New_York\"), or an offset in the form \"±hh:mm\". If the time zone has aliases, the timeZoneId is the identifier used to create the ZonedDateTime, without canonicalization to the primary identifier.\n

    The set accessor of timeZoneId is undefined. You cannot change this property directly. Use the withTimeZone() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    \n

    Note:\nThis string is not intended for display to users. Use toLocaleString() with the appropriate options to get a localized string.\n

    " + "doc": "The timeZoneId accessor property of Temporal.ZonedDateTime instances returns a string representing the time zone identifier used to interpret the internal instant. The string is either a named identifier in the preferred case (such as \"America/New_York\"), or an offset in the form \"±hh:mm\". If the time zone has aliases, the timeZoneId is the identifier used to create the ZonedDateTime, without canonicalization to the primary identifier.\n

    The set accessor of timeZoneId is undefined. You cannot change this property directly. Use the withTimeZone() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    \n

    Note:\nThis string is not intended for display to users. Use toLocaleString() with the appropriate options to get a localized string.\n

    " }, "temporal.zoneddatetime.toinstant": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/toinstant", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toInstant() method of Temporal.ZonedDateTime instances returns a new Temporal.Instant object representing the instant of this date-time.", + "doc": "The toInstant() method of Temporal.ZonedDateTime instances returns a new Temporal.Instant object representing the instant of this date-time.", "returns": "A new Temporal.Instant object representing the instant of this date-time." }, "temporal.zoneddatetime.tojson": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/tojson", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toJSON() method of Temporal.ZonedDateTime instances returns a string representing this date-time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", + "doc": "The toJSON() method of Temporal.ZonedDateTime instances returns a string representing this date-time in the same RFC 9557 format as calling toString(). It is intended to be implicitly called by JSON.stringify().", "returns": "A string representing the given date-time in the RFC 9557 format, with the calendar annotation included if it is not \"iso8601\", and the offset and time zone annotation always included." }, "temporal.zoneddatetime.tolocalestring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/tolocalestring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toLocaleString() method of Temporal.ZonedDateTime instances returns a string with a language-sensitive representation of this date-time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat and passes this date-time converted to a Temporal.Instant (because Intl.DateTimeFormat cannot directly format a Temporal.ZonedDateTime).\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create a Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context. However, currently Intl.DateTimeFormat does not support formatting Temporal.ZonedDateTime objects, so you must convert them to Temporal.Instant objects first before passing them to format().", + "doc": "The toLocaleString() method of Temporal.ZonedDateTime instances returns a string with a language-sensitive representation of this date-time. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat and passes this date-time converted to a Temporal.Instant (because Intl.DateTimeFormat cannot directly format a Temporal.ZonedDateTime).\n

    Every time toLocaleString is called, it has to perform a search in a big database of localization strings, which is potentially inefficient. When the method is called many times with the same arguments, it is better to create an Intl.DateTimeFormat object and use its format() method, because a DateTimeFormat object remembers the arguments passed to it and may decide to cache a slice of the database, so future format calls can search for localization strings within a more constrained context. However, currently Intl.DateTimeFormat does not support formatting Temporal.ZonedDateTime objects, so you must convert them to Temporal.Instant objects first before passing them to format().", "parameters": { "locales": "A string with a BCP 47 language tag, or an array of such strings. Corresponds to the locales parameter of the Intl.DateTimeFormat() constructor.", "options": "An object adjusting the output format. Corresponds to the options parameter of the Intl.DateTimeFormat() constructor. If this date-time's calendar is not \"iso8601\", the calendar option must be provided with the same value; otherwise, if this date-time's calendar is \"iso8601\", the calendar option can be any value. The timeZone option must not be provided, as it is automatically set to be the date-time's timeZoneId. Regarding the date-time component options and the style shortcuts (dateStyle and timeStyle), the options should follow one of these forms:\n

    " @@ -22583,65 +23107,73 @@ "temporal.zoneddatetime.toplaindate": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/toplaindate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDate() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainDate object representing the date portion of this date-time.", + "doc": "The toPlainDate() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainDate object representing the date portion of this date-time.", "returns": "A new Temporal.PlainDate object representing the date portion of this date-time." }, "temporal.zoneddatetime.toplaindatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/toplaindatetime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainDateTime() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainDateTime object representing the date and time portions of this date-time. Only the time zone information is removed.\n

    \n

    Warning:\nAfter a Temporal.ZonedDateTime is converted to Temporal.PlainDateTime, it's no longer time-zone-aware. Subsequent operations like arithmetic or with() operations will not adjust for DST and may not yield the same results as equivalent operations with the original Temporal.ZonedDateTime. However, unless you perform those operations across a time zone offset transition, it's impossible to notice the difference. Therefore, be very careful when performing this conversion because subsequent results may be correct most of the time, but only turn out incorrect when moving across offset transitions like when DST starts or ends.\n

    ", + "doc": "The toPlainDateTime() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainDateTime object representing the date and time portions of this date-time. Only the time zone information is removed.\n
    \n

    Warning:\nAfter a Temporal.ZonedDateTime is converted to Temporal.PlainDateTime, it's no longer time-zone-aware. Subsequent operations like arithmetic or with() operations will not adjust for DST and may not yield the same results as equivalent operations with the original Temporal.ZonedDateTime. However, unless you perform those operations across a time zone offset transition, it's impossible to notice the difference. Therefore, be very careful when performing this conversion because subsequent results may be correct most of the time, but only turn out incorrect when moving across offset transitions like when DST starts or ends.\n

    ", "returns": "A new Temporal.PlainDateTime object representing the date and time portions of this date-time." }, "temporal.zoneddatetime.toplaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/toplaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toPlainTime() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainTime object representing the time portion of this date-time.\n

    \n

    Warning:\nAfter a Temporal.ZonedDateTime is converted to Temporal.PlainTime, it's no longer time-zone-aware. Subsequent operations like arithmetic or with() operations will not adjust for DST and may not yield the same results as equivalent operations with the original Temporal.ZonedDateTime. However, unless you perform those operations across a time zone offset transition, it's impossible to notice the difference. Therefore, be very careful when performing this conversion because subsequent results may be correct most of the time, but only turn out incorrect when moving across offset transitions like when DST starts or ends.\n

    ", + "doc": "The toPlainTime() method of Temporal.ZonedDateTime instances returns a new Temporal.PlainTime object representing the time portion of this date-time.\n
    \n

    Warning:\nAfter a Temporal.ZonedDateTime is converted to Temporal.PlainTime, it's no longer time-zone-aware. Subsequent operations like arithmetic or with() operations will not adjust for DST and may not yield the same results as equivalent operations with the original Temporal.ZonedDateTime. However, unless you perform those operations across a time zone offset transition, it's impossible to notice the difference. Therefore, be very careful when performing this conversion because subsequent results may be correct most of the time, but only turn out incorrect when moving across offset transitions like when DST starts or ends.\n

    ", "returns": "A new Temporal.PlainTime object representing the time portion of this date-time." }, "temporal.zoneddatetime.tostring": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/tostring", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The toString() method of Temporal.ZonedDateTime instances returns a string representing this date-time in the RFC 9557 format.", + "doc": "The toString() method of Temporal.ZonedDateTime instances returns a string representing this date-time in the RFC 9557 format.", "parameters": { "options": "An object containing the following property:\n

    \n
    calendarName Optional
    \n
    \n

    Whether to show the calendar annotation ([u-ca=calendar_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Include the calendar annotation if the calendar is not \"iso8601\".\n

    \n
    \"always\"
    \n
    \n

    Always include the calendar annotation.\n

    \n
    \"never\"
    \n
    \n

    Never include the calendar annotation. This makes the returned string not recoverable to the same Temporal.ZonedDateTime instance, although the date value still remains the same.\n

    \n
    \"critical\"
    \n
    \n

    Always include the calendar annotation, and add a critical flag: [!u-ca=calendar_id]. Useful when sending the string to certain systems, but not useful for Temporal itself.\n

    \n
    \n
    \n
    fractionalSecondDigits Optional
    \n
    \n

    Either an integer from 0 to 9, or the string \"auto\". The default is \"auto\". If \"auto\", then trailing zeros are removed from the fractional seconds. Otherwise, the fractional part of the second component contains this many digits, padded with zeros or rounded as necessary.\n

    \n
    roundingMode Optional
    \n
    \n

    A string specifying how to round off fractional second digits beyond fractionalSecondDigits. See Intl.NumberFormat(). Defaults to \"trunc\".\n

    \n
    smallestUnit Optional
    \n
    \n

    A string specifying the smallest unit to include in the output. Possible values are \"minute\", \"second\", \"millisecond\", \"microsecond\", and \"nanosecond\", or their plural forms, which (except \"minute\") are equivalent to fractionalSecondDigits values of 0, 3, 6, 9, respectively. If specified, then fractionalSecondDigits is ignored.\n

    \n
    timeZoneName Optional
    \n
    \n

    Whether to show the time zone name ([time_zone_id]) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Always include the time zone name.\n

    \n
    \"never\"
    \n
    \n

    Never include the time zone name. This makes the returned string not recoverable to the same Temporal.ZonedDateTime instance.\n

    \n
    \"critical\"
    \n
    \n

    Always include the time zone name, and add a critical flag: [!time)zone_id]. Useful when sending the string to certain systems, but not useful for Temporal itself.\n

    \n
    \n
    \n
    offset Optional
    \n
    \n

    Whether to show the offset (±HH:mm) in the return value. Possible values are:\n

    \n
    \"auto\" (default)
    \n
    \n

    Always include the offset.\n

    \n
    \"never\"
    \n
    \n

    Never include the offset. This makes the returned string not recoverable to the same Temporal.ZonedDateTime instance, if the time zone is included but the time is ambiguous, or if the time zone is also not included.\n

    \n
    \n
    \n
    " }, @@ -22654,17 +23186,19 @@ "temporal.zoneddatetime.until": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/until", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The until() method of Temporal.ZonedDateTime instances returns a new Temporal.Duration object representing the duration from this date-time to another date-time (in a form convertible by Temporal.ZonedDateTime.from()). The duration is positive if the other date-time is after this date-time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", + "doc": "The until() method of Temporal.ZonedDateTime instances returns a new Temporal.Duration object representing the duration from this date-time to another date-time (in a form convertible by Temporal.ZonedDateTime.from()). The duration is positive if the other date-time is after this date-time, and negative if before.\n

    This method does other - this. To do this - other, use the since() method.", "parameters": { "other": "A string, an object, or a Temporal.ZonedDateTime instance representing a date-time to subtract this date-time from. It is converted to a Temporal.ZonedDateTime object using the same algorithm as Temporal.ZonedDateTime.from(). It must have the same calendar as this.", "options": "The same options as since()." @@ -22677,17 +23211,19 @@ "temporal.zoneddatetime.valueof": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/valueof", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The valueOf() method of Temporal.ZonedDateTime instances throws a TypeError, which prevents Temporal.ZonedDateTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", + "doc": "The valueOf() method of Temporal.ZonedDateTime instances throws a TypeError, which prevents Temporal.ZonedDateTime instances from being implicitly converted to primitives when used in arithmetic or comparison operations.", "returns": "None.", "throws": { "TypeError": "Always thrown." @@ -22696,32 +23232,36 @@ "temporal.zoneddatetime.weekofyear": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/weekofyear", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The weekOfYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks.\n

    For general information and more examples, see Temporal.PlainDate.prototype.weekOfYear." + "doc": "The weekOfYear accessor property of Temporal.ZonedDateTime instances returns a positive integer representing the 1-based week index in the yearOfWeek of this date, or undefined if the calendar does not have a well-defined week system. The first week of the year is 1. It is calendar-dependent.\n

    The set accessor of weekOfYear is undefined. You cannot change this property directly. To create a new Temporal.ZonedDateTime object with the desired new weekOfYear value, use the add() or subtract() method with the appropriate number of weeks.\n

    For general information and more examples, see Temporal.PlainDate.prototype.weekOfYear." }, "temporal.zoneddatetime.with": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/with", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The with() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's fields.\n

    To replace the calendarId property, use the withCalendar() method. To replace the timeZoneId property, use the withTimeZone() method.", + "doc": "The with() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time with some fields replaced by new values. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's fields.\n

    To replace the calendarId property, use the withCalendar() method. To replace the timeZoneId property, use the withTimeZone() method.", "parameters": { "info": "An object containing at least one of the properties recognized by Temporal.ZonedDateTime.from() (except calendar and timeZone): day, era and eraYear, hour, microsecond, millisecond, minute, month, monthCode, nanosecond, offset, second, year. Unspecified properties use the values from the original date-time. You only need to provide one of month or monthCode, and one of era and eraYear or year, and the other will be updated accordingly.", "options": "An object containing some or all of the following properties (in the order they are retrieved and validated):\n

    \n
    disambiguation Optional
    \n
    \n

    What to do if the local date-time is ambiguous in the given time zone (there are more than one instants with such local time, or the local time does not exist). Possible values are \"compatible\", \"earlier\", \"later\", and \"reject\". Defaults to \"compatible\". For more information about these values, see ambiguity and gaps from local time to UTC time.\n

    \n
    offset Optional
    \n
    \n

    What to do if the offset is explicitly provided in info but the offset is invalid for the given time zone in the given local time. Possible values are \"use\", \"ignore\", \"reject\", and \"prefer\". Defaults to \"prefer\". For more information about these values, see offset ambiguity.\n

    \n
    overflow Optional
    \n
    \n

    A string specifying the behavior when a date component is out of range (when using the object info). Possible values are:\n

    \n
    \"constrain\" (default)
    \n
    \n

    The date component is clamped to the valid range.\n

    \n
    \"reject\"
    \n
    \n

    A RangeError is thrown if the date component is out of range.\n

    \n
    \n
    \n
    " @@ -22735,14 +23275,17 @@ "temporal.zoneddatetime.withcalendar": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/withcalendar", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withCalendar() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's calendarId property.\n

    To replace the date-time component properties, use the with() method. To replace its time zone, use the withTimeZone() method.", + "doc": "The withCalendar() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time interpreted in the new calendar system. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's calendarId property.\n

    To replace the date-time component properties, use the with() method. To replace its time zone, use the withTimeZone() method.", "parameters": { "calendar": "A string that corresponds to the calendarId property. See Intl.supportedValuesOf() for a list of commonly supported calendar types." }, @@ -22755,17 +23298,19 @@ "temporal.zoneddatetime.withplaintime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/withplaintime", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withPlainTime() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time with the time part entirely replaced by the new time (in a form convertible by Temporal.PlainTime.from())\n

    This method will replace all time properties, defaulting to 0 where properties are unspecified. If you only want to replace some of the time properties, use the with() method instead.", + "doc": "The withPlainTime() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing this date-time with the time part entirely replaced by the new time (in a form convertible by Temporal.PlainTime.from())\n

    This method will replace all time properties, defaulting to 0 where properties are unspecified. If you only want to replace some of the time properties, use the with() method instead.", "parameters": { "plainTime": "A string, an object, or a Temporal.PlainTime instance representing the new time. It is converted to a Temporal.PlainTime object using the same algorithm as Temporal.PlainTime.from(). If not specified, the time part is set to the start of the day (which is usually 00:00:00 unless it doesn't exist due to offset transitions). Disambiguation always happens in the \"compatible\" mode; if you want to use a different mode, use the with() method instead." }, @@ -22774,17 +23319,19 @@ "temporal.zoneddatetime.withtimezone": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/withtimezone", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The withTimeZone() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing the same instant as this date-time but in the new time zone. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's timeZoneId property.\n

    To replace the date-time component properties, use the with() method. To replace its calendar, use the withCalendar() method.", + "doc": "The withTimeZone() method of Temporal.ZonedDateTime instances returns a new Temporal.ZonedDateTime object representing the same instant as this date-time but in the new time zone. Because all Temporal objects are designed to be immutable, this method essentially functions as the setter for the date-time's timeZoneId property.\n

    To replace the date-time component properties, use the with() method. To replace its calendar, use the withCalendar() method.", "parameters": { "timeZone": "Either a string or a Temporal.ZonedDateTime instance representing the time zone to use. If a Temporal.ZonedDateTime instance, its time zone is used. If a string, it can be a named time zone identifier, an offset time zone identifier, or a date-time string containing a time zone identifier or an offset (see time zones and offsets for more information)." }, @@ -22797,32 +23344,36 @@ "temporal.zoneddatetime.year": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/year", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The year accessor property of Temporal.ZonedDateTime instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." + "doc": "The year accessor property of Temporal.ZonedDateTime instances returns an integer representing the number of years of this date relative to the start of a calendar-specific epoch year. It is calendar-dependent.\n

    The set accessor of year is undefined. You cannot change this property directly. Use the with() method to create a new Temporal.ZonedDateTime object with the desired new value.\n

    For general information and more examples, see Temporal.PlainDate.prototype.year." }, "temporal.zoneddatetime.yearofweek": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/yearofweek", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "139", "FirefoxAndroid": "139" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The yearOfWeek accessor property of Temporal.ZonedDateTime instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.yearOfWeek." + "doc": "The yearOfWeek accessor property of Temporal.ZonedDateTime instances returns an integer representing the year to be paired with the weekOfYear of this date, or undefined if the calendar does not have a well-defined week system. It is calendar-dependent.\n

    The set accessor of yearOfWeek is undefined. You cannot change this property directly.\n

    For general information and more examples, see Temporal.PlainDate.prototype.yearOfWeek." }, "temporal.zoneddatetime.zoneddatetime": { "url": "$MDN_URL$/web/javascript/reference/global_objects/temporal/zoneddatetime/zoneddatetime", @@ -23874,8 +24425,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The toReversed() method of TypedArray instances is the copying counterpart of the reverse() method. It returns a new typed array with the elements in reversed order. This method has the same algorithm as Array.prototype.toReversed().", "returns": "A new typed array containing the elements in reversed order." @@ -23898,8 +24450,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The toSorted() method of TypedArray instances is the copying version of the sort() method. It returns a new typed array with the elements sorted in ascending order. This method has the same algorithm as Array.prototype.toSorted(), except that it sorts the values numerically instead of as strings by default.", "parameters": { @@ -23975,8 +24528,9 @@ "Deno": "1.31" }, "baseline": { - "level": "LOW", - "lowDate": "2023-07-04" + "level": "HIGH", + "lowDate": "2023-07-04", + "highDate": "2026-01-04" }, "doc": "The with() method of TypedArray instances is the copying version of using the bracket notation to change the value of a given index. It returns a new typed array with the element at the given index replaced with the given value. This method has the same algorithm as Array.prototype.with().", "parameters": { @@ -24196,6 +24750,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24227,6 +24782,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24257,6 +24813,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24288,6 +24845,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24318,6 +24876,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24347,6 +24906,7 @@ "Opera": "124", "Safari": "18.2", "SafariIOS": "18.2", + "Nodejs": "25.0.0", "Deno": "2.5.0" }, "baseline": { @@ -24470,7 +25030,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The undefined global property represents the primitive\nvalue undefined. It is one of JavaScript's\nprimitive types." + "doc": "The undefined global property represents the primitive value undefined. It is one of JavaScript's primitive types." }, "unescape": { "url": "$MDN_URL$/web/javascript/reference/global_objects/unescape", @@ -24633,22 +25193,26 @@ "weakmap.getorinsert": { "url": "$MDN_URL$/web/javascript/reference/global_objects/weakmap/getorinsert", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", "Firefox": "144", - "FirefoxAndroid": "144" + "FirefoxAndroid": "144", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The getOrInsert() method of WeakMap instances returns the value corresponding to the specified key in this WeakMap. If the key is not present, it inserts a new entry with the key and a given default value, and returns the inserted value.\n

    If the computation of the default value is expensive, consider using WeakMap.prototype.getOrInsertComputed() instead, which takes a callback to compute the default value only if it's actually needed.", + "doc": "The getOrInsert() method of WeakMap instances returns the value corresponding to the specified key in this WeakMap. If the key is not present, it inserts a new entry with the key and a given default value, and returns the inserted value.\n

    If the computation of the default value is expensive, consider using WeakMap.prototype.getOrInsertComputed() instead, which takes a callback to compute the default value only if it's actually needed.", "parameters": { "key": "The key of the value to return from the WeakMap object. Must be either an object or a non-registered symbol. Object keys are compared by reference, not by value.", "defaultValue": "The value to insert and return if the key is not already present in the WeakMap object." }, - "returns": "The value associated with the specified key in the WeakMap object. If the key can't be found, undefined is returned.", + "returns": "The value associated with the specified key in the WeakMap object. If the key can't be found, defaultValue is inserted and returned.", "throws": { "TypeError": "Thrown if key is not an object or a non-registered symbol." } @@ -24656,22 +25220,29 @@ "weakmap.getorinsertcomputed": { "url": "$MDN_URL$/web/javascript/reference/global_objects/weakmap/getorinsertcomputed", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", "Firefox": "144", - "FirefoxAndroid": "144" + "FirefoxAndroid": "144", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The getOrInsertComputed() method of WeakMap instances returns the value corresponding to the specified key in this WeakMap. If the key is not present, it inserts a new entry with the key and a default value computed from a given callback, and returns the inserted value.\n

    Use this method instead of WeakMap.prototype.getOrInsert() when the default value is expensive to compute, and you want to avoid computing it unless it's actually needed.", + "doc": "The getOrInsertComputed() method of WeakMap instances returns the value corresponding to the specified key in this WeakMap. If the key is not present, it inserts a new entry with the key and a default value computed from a given callback, and returns the inserted value.\n

    Use this method instead of WeakMap.prototype.getOrInsert() when the default value is expensive to compute, and you want to avoid computing it unless it's actually needed.", "parameters": { "key": "The key of the element to return from the Map object. Must be either an object or a non-registered symbol. Object keys are compared by reference, not by value.", "callback": "A function that returns the value to insert and return if the key is not already present in the Map object. The function is called with the following argument:\n

    \n
    key
    \n
    \n

    The same key that was passed to getOrInsertComputed().\n

    \n
    " }, - "returns": "The value associated with the specified key in the WeakMap object. If the key can't be found, the result of callback(key) is inserted and returned." + "returns": "The value associated with the specified key in the WeakMap object. If the key can't be found, the result of callback(key) is inserted and returned.", + "throws": { + "TypeError": "Thrown in one of the following cases:\n" + } }, "weakmap.has": { "url": "$MDN_URL$/web/javascript/reference/global_objects/weakmap/has", diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Html.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Html.json index e31c13adbd7a..7dabdee8e2f8 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Html.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Html.json @@ -40,7 +40,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The anchor global attribute is used to associate a positioned element with an anchor element. The attribute's value is the id value of the element you want to anchor the positioned element to. The element can then be positioned using CSS anchor positioning.\n

    \n

    Note:\nAlternatively, you can associate a positioned element with an anchor element via CSS, using the anchor-name and position-anchor properties. If both anchoring techniques are used on the same element, the CSS technique takes precedence over the HTML technique.\n

    " + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

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

    \n

    The anchor global attribute is used to associate a positioned element with an anchor element. The attribute's value is the id value of the element you want to anchor the positioned element to. The element can then be positioned using CSS anchor positioning.\n

    \n

    Note:\nAlternatively, you can associate a positioned element with an anchor element via CSS, using the anchor-name and position-anchor properties. If both anchoring techniques are used on the same element, the CSS technique takes precedence over the HTML technique.\n

    " }, "autocapitalize": { "url": "$MDN_URL$/web/html/reference/global_attributes/autocapitalize", @@ -68,7 +68,9 @@ ], "compatibility": { "Firefox": "136", - "FirefoxAndroid": "136" + "FirefoxAndroid": "136", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "NONE" @@ -95,7 +97,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The autofocus global attribute is a Boolean attribute indicating that an element should be focused on page load, or when the <dialog> that it is part of is displayed.\n
    \n```html\n\n```\n
    \n

    No more than one element in the document or dialog may have the autofocus attribute. If applied to multiple elements the first one will receive focus.\n

    \n

    Note:\nThe autofocus attribute applies to all elements, not just form controls. For example, it might be used on a contenteditable area.\n

    " + "doc": "The autofocus global attribute is a Boolean attribute indicating whether the element should be focused on page load or, if it is nested inside a <dialog> or popover element, when the <dialog> or popover is shown.\n
    \n```html\n\n```\n
    \n

    Only one element inside a document, <dialog> element, or popover may have this attribute specified. If applied to multiple elements, the first focusable one will receive focus.\n

    \n

    Note:\nThe autofocus attribute applies to all elements, not just form controls. For example, it might be used on a contenteditable area.\n

    \n
    \n

    Note:\nOn page load, if a URI fragment identifier is specified and identifies an element, the element with the autofocus attribute does not receive focus via the autofocus attribute. Generally, the element indicated by the fragment receives focus instead.\n

    " }, "class": { "url": "$MDN_URL$/web/html/reference/global_attributes/class", @@ -117,7 +119,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The class global attribute is a list of the classes of the element, separated by ASCII whitespace.\n

    Classes allow CSS and JavaScript to select and access specific elements via the class selectors or functions like the document.getElementsByClassName().\n

    Though the specification doesn't put requirements on the name of classes, web developers are encouraged to use names that describe the semantic purpose of the element, rather than the presentation of the element. For example, attribute to describe an attribute rather than italics, although an element of this class may be presented by italics. Semantic names remain logical even if the presentation of the page changes." + "doc": "The class global attribute is a list of the classes of the element, separated by ASCII whitespace.\n

    Classes allow CSS and JavaScript to select and access specific elements via the class selectors or functions like the document.getElementsByClassName().\n

    Though the specification doesn't put requirements on the name of classes, web developers are encouraged to use names that describe the semantic purpose of the element, rather than the presentation of the element. For example, attribute to describe an attribute rather than italics, although an element of this class may be presented by italics. Semantic names remain logical even if the presentation of the page changes." }, "contenteditable": { "url": "$MDN_URL$/web/html/reference/global_attributes/contenteditable", @@ -161,7 +163,7 @@ "lowDate": "≤2017-04-05", "highDate": "≤2019-10-05" }, - "doc": "The dir global attribute is an enumerated attribute that indicates the directionality of the element's text.\n

    It can have the following values:\n

    \n
    \n

    Note:\nThe auto value should be used for data with an unknown directionality, like data coming from user input or external data.\n

    \n

    If unspecified, the value is inherited from the parent element.\n

    This attribute can be overridden by the CSS properties direction and unicode-bidi, if a CSS page is active and the element supports these properties.\n

    As the directionality of the text is semantically related to its content and not to its presentation, it is recommended that web developers use this attribute instead of the related CSS properties when possible. That way, the text will display correctly even on a browser that doesn't support CSS or has the CSS deactivated." + "doc": "The dir global attribute is an enumerated attribute that indicates the directionality of the element's text.\n

    It can have the following values:\n

    \n
    \n

    Note:\nThe auto value should be used for data with an unknown directionality, like data coming from user input or external data.\n

    \n

    If unspecified, the value is inherited from the parent element.\n

    This attribute can be overridden by the CSS properties direction and unicode-bidi, if a CSS page is active and the element supports these properties.\n

    As the directionality of the text is semantically related to its content and not to its presentation, it is recommended that web developers use this attribute instead of the related CSS properties when possible. That way, the text will display correctly even on a browser that doesn't support CSS or has the CSS deactivated." }, "draggable": { "url": "$MDN_URL$/web/html/reference/global_attributes/draggable", @@ -227,7 +229,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The exportparts global attribute allows you to select and style elements existing in nested shadow trees, by exporting their part names.\n

    The shadow tree is an isolated structure where identifiers, classes, and styles cannot be reached by selectors or queries belonging to a regular DOM. There are two HTML attributes that can be applied to shadow tree elements that enable targeting CSS styles from outside to shadow tree: part and exportparts.\n

    The global part attribute makes a shadow tree element visible to its parent DOM. A part name is used as the parameter of the ::part() pseudo-element. In this way, you can apply CSS styles to elements in the shadow tree from outside of it. However, the ::part() pseudo-element is only visible to the parent DOM. This means that when a shadow tree is nested, the parts are not visible to any ancestors other than the direct parent. The exportparts attribute solves this limitation.\n

    The exportparts attribute enables shadow tree parts to be visible outside the shadow DOM. This concept is referred to as \"exporting\". The exportparts attribute is placed on the element's shadow host, which is the element to which the shadow tree is attached. The value of this attribute is a comma-separated list of part names present in the shadow tree. These names are made available to the DOMs outside the current structure.\n

    \n```html\n\n  \n\n```\n
    \n

    When exporting a part, you have the option to assign a different name to the part, as shown in the snippet below. The value of the exportparts attribute is really a comma-separated list of part-name mappings. So the exportparts attribute in the above code snippet is the equivalent of exportparts=\"part1:part1, part2:part2, part5:part5, indicating that each part is exported with the same name. In each mapping, the first string specifies the name of the part within the shadow tree, and the second string specifies the name with which the part will be exposed externally.\n

    \n```html\n\n  \n\n```\n
    " + "doc": "The exportparts global attribute allows you to select and style elements existing in nested shadow trees, by exporting their part names.\n

    The shadow tree is an isolated structure where identifiers, classes, and styles cannot be reached by selectors or queries belonging to a regular DOM. There are two HTML attributes that can be applied to shadow tree elements that enable targeting CSS styles from outside to shadow tree: part and exportparts.\n

    The global part attribute makes a shadow tree element visible to its parent DOM. A part name is used as the parameter of the ::part() pseudo-element. In this way, you can apply CSS styles to elements in the shadow tree from outside of it. However, the ::part() pseudo-element is only visible to the parent DOM. This means that when a shadow tree is nested, the parts are not visible to any ancestors other than the direct parent. The exportparts attribute solves this limitation.\n

    The exportparts attribute enables shadow tree parts to be visible outside the shadow DOM. This concept is referred to as \"exporting\". The exportparts attribute is placed on the element's shadow host, which is the element to which the shadow tree is attached. The value of this attribute is a comma-separated list of part names present in the shadow tree. These names are made available to the DOMs outside the current structure.\n

    \n```html\n\n  \n\n```\n
    \n

    When exporting a part, you have the option to assign a different name to the part, as shown in the snippet below. The value of the exportparts attribute is really a comma-separated list of part-name mappings. So the exportparts attribute in the above code snippet is the equivalent of exportparts=\"part1:part1, part2:part2, part5:part5, indicating that each part is exported with the same name. In each mapping, the first string specifies the name of the part within the shadow tree, and the second string specifies the name with which the part will be exposed externally.\n

    \n```html\n\n  \n\n```\n
    " }, "hidden": { "url": "$MDN_URL$/web/html/reference/global_attributes/hidden", @@ -293,7 +295,7 @@ "lowDate": "2023-04-11", "highDate": "2025-10-11" }, - "doc": "The inert global attribute is a Boolean attribute indicating that the element and all of its flat tree descendants become inert. The inert attribute can be added to sections of content that should not be interactive. When an element is inert, it along with all of the element's descendants, including normally interactive elements such as links, buttons, and form controls are disabled because they cannot receive focus or be clicked. The inert attribute can also be added to elements that should be offscreen or hidden. An inert element, along with its descendants, gets removed from the tab order and accessibility tree.\n

    Modal <dialog>s generated with showModal() escape inertness, meaning that they don't inherit inertness from their ancestors, but can be made inert by having the inert attribute explicitly set on themselves. No other element can escape inertness.\n

    \n

    Note:\nWhile inert is a global attribute and can be applied to any element, it is generally used for sections of content. To make individual controls \"inert\", consider using the disabled attribute, along with CSS :disabled styles, instead.\n

    \n

    Inert HTML elements and their flat tree descendants:\n

    \n

    The following other features can be used to set an element and its descendants to an inert state:\n

    " + "doc": "The inert global attribute is a Boolean attribute indicating that the element and all of its flat tree descendants become inert. The inert attribute can be added to sections of content that should not be interactive. When an element is inert, it along with all of the element's descendants, including normally interactive elements such as links, buttons, and form controls are disabled because they cannot receive focus or be clicked. The inert attribute can also be added to elements that should be offscreen or hidden. An inert element, along with its descendants, gets removed from the tab order and accessibility tree.\n

    Modal <dialog>s generated with showModal() escape inertness, meaning that they don't inherit inertness from their ancestors, but can be made inert by having the inert attribute explicitly set on themselves. No other element can escape inertness.\n

    \n

    Note:\nWhile inert is a global attribute and can be applied to any element, it is generally used for sections of content. To make individual controls \"inert\", consider using the disabled attribute, along with CSS :disabled styles, instead.\n

    \n

    Inert HTML elements and their flat tree descendants:\n

    \n

    The following other features can be used to set an element and its descendants to an inert state:\n

    " }, "inputmode": { "url": "$MDN_URL$/web/html/reference/global_attributes/inputmode", @@ -375,7 +377,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The lang global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user. The attribute contains a single BCP 47 language tag.\n
    \n

    Note:\nThe default value of lang is the empty string, which means that the language is unknown. Therefore, it is recommended to always specify an appropriate value for this attribute.\n

    \n

    If the attribute value is the empty string (lang=\"\"), the language is set to unknown; if the language tag is not valid according to BCP47, it is set to invalid.\n

    Even if the lang attribute is set, it may not be taken into account, as the xml:lang attribute has priority.\n

    For the CSS pseudo-class :lang, two invalid language names are different if their names are different. So while :lang(es) matches both lang=\"es-ES\" and lang=\"es-419\", :lang(xyzzy) would not match lang=\"xyzzy-Zorp!\"." + "doc": "The lang global attribute helps define the language of an element: the language that non-editable elements are written in, or the language that the editable elements should be written in by the user. The attribute contains a single BCP 47 language tag.\n

    \n

    Note:\nThe default value of lang is the empty string, which means that the language is unknown. Therefore, it is recommended to always specify an appropriate value for this attribute.\n

    \n

    If the attribute value is the empty string (lang=\"\"), the language is set to unknown; if the language tag is not valid according to BCP47, it is set to invalid.\n

    Even if the lang attribute is set, it may not be taken into account, as the xml:lang attribute has priority.\n

    For the CSS pseudo-class :lang, two invalid language names are different if their names are different. So while :lang(es) matches both lang=\"es-ES\" and lang=\"es-419\", :lang(xyzzy) would not match lang=\"xyzzy-Zorp!\"." }, "nonce": { "url": "$MDN_URL$/web/html/reference/global_attributes/nonce", @@ -397,7 +399,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The nonce global attribute\nis a content attribute defining a cryptographic nonce (\"number used once\") which can be used by\nContent Security Policy to determine whether or not a given fetch will\nbe allowed to proceed for a given element.\n

    The nonce attribute is useful to allowlist specific elements, such as a particular inline script or style elements.\nIt can help you to avoid using the CSP unsafe-inline directive, which would allowlist all inline scripts or styles.\n

    \n

    Note:\nOnly use nonce for cases where you have no way around using unsafe inline script\nor style contents. If you don't need nonce, don't use it. If your script is static, you could also use a CSP hash instead.\n(See usage notes on unsafe inline script.)\nAlways try to take full advantage of CSP protections and avoid nonces or unsafe inline scripts whenever possible.\n

    " + "doc": "The nonce global attribute\nis a content attribute defining a cryptographic nonce (\"number used once\") which can be used by\nContent Security Policy to determine whether or not a given fetch will\nbe allowed to proceed for a given element.\n

    The nonce attribute is useful to allowlist specific elements, such as a particular inline script or style elements.\nIt can help you to avoid using the CSP unsafe-inline directive, which would allowlist all inline scripts or styles.\n

    \n

    Note:\nOnly use nonce for cases where you have no way around using unsafe inline script\nor style contents. If you don't need nonce, don't use it. If your script is static, you could also use a CSP hash instead.\n(See usage notes on unsafe inline script.)\nAlways try to take full advantage of CSP protections and avoid nonces or unsafe inline scripts whenever possible.\n

    " }, "part": { "url": "$MDN_URL$/web/html/reference/global_attributes/part", @@ -419,7 +421,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The part global attribute contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element.\n

    See the exportparts attribute for a usage example." + "doc": "The part global attribute contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element.\n

    See the exportparts attribute for a usage example." }, "popover": { "url": "$MDN_URL$/web/html/reference/global_attributes/popover", @@ -440,7 +442,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "The popover global attribute is used to designate an element as a popover element.\n

    Popover elements are hidden via display: none until opened via an invoking/control element (i.e., a <button> or <input type=\"button\"> with a popovertarget attribute) or a HTMLElement.showPopover() call.\n

    When open, popover elements will appear above all other elements in the top layer, and won't be influenced by parent elements' position or overflow styling.\n

    Popovers that have the auto state can be shown and hidden using associated controls (designated by the popovertarget attribute) and \"light dismissed\" by clicking outside the popover area, opening another popover, or pressing browser-specific mechanisms such as the Esc key.\n

    Generally only one auto popover can be displayed on-screen at a time — showing a second popover when one is already shown will hide the first one. The exception to this rule is when you have nested auto popovers. See Nested popovers for more details.\n

    They can also be controlled using JavaScript, for example the HTMLElement.togglePopover() method can be used to toggle a popover between shown and hidden.\n

    By contrast, manual popovers must be manually shown and hidden — they don't automatically close other popovers when they are displayed and they can't be light dismissed. This allows for use cases where you want to show multiple popovers at the same time.\n

    hint popovers do not close auto popovers when they are displayed, but will close other hint popovers. They can be light dismissed and will respond to close requests.\n

    Usually hint popovers are shown and hidden in response to non-click JavaScript events such as mouseover/mouseout and focus/blur. Clicking a button to open a hint popover would cause an open auto popover to light-dismiss.\n

    For detailed information on usage, see the Popover API landing page." + "doc": "The popover global attribute is used to designate an element as a popover element.\n

    Popover elements are hidden via display: none until opened via an invoking/control element (i.e., a <button> or <input type=\"button\"> with a popovertarget attribute) or a HTMLElement.showPopover() call.\n

    When open, popover elements will appear above all other elements in the top layer, and won't be influenced by parent elements' position or overflow styling.\n

    Popovers that have the auto state can be shown and hidden using associated controls (designated by the popovertarget attribute) and \"light dismissed\" by clicking outside the popover area, opening another popover, or pressing browser-specific mechanisms such as the Esc key.\n

    Generally only one auto popover can be displayed on-screen at a time — showing a second popover when one is already shown will hide the first one. The exception to this rule is when you have nested auto popovers. See Nested popovers for more details.\n

    They can also be controlled using JavaScript, for example the HTMLElement.togglePopover() method can be used to toggle a popover between shown and hidden.\n

    By contrast, manual popovers must be manually shown and hidden — they don't automatically close other popovers when they are displayed and they can't be light dismissed. This allows for use cases where you want to show multiple popovers at the same time.\n

    hint popovers do not close auto popovers when they are displayed, but will close other hint popovers. They can be light dismissed and will respond to close requests.\n

    Usually hint popovers are shown and hidden in response to non-click JavaScript events such as mouseover/mouseout and focus/blur. Clicking a button to open a hint popover would cause an open auto popover to light-dismiss.\n

    For detailed information on usage, see the Popover API landing page." }, "slot": { "url": "$MDN_URL$/web/html/reference/global_attributes/slot", @@ -459,8 +461,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "The slot global attribute assigns a slot in a shadow DOM shadow tree to an element: An element with a slot attribute is assigned to the slot created by the <slot> element whose name attribute's value matches that slot attribute's value. You can have multiple elements assigned to the same slot by using the same slot name. Elements without a slot attribute are assigned to the unnamed slot, if one exists.\n

    For examples, see our Using templates and slots guide." }, @@ -477,7 +479,7 @@ "FirefoxAndroid": "57", "Opera": "15", "Safari": "5.1", - "SafariIOS": "9.3" + "SafariIOS": "5" }, "baseline": { "level": "HIGH", @@ -528,7 +530,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The tabindex global attribute allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable (usually with the Tab key, hence the name) and determine their relative ordering for sequential focus navigation.\n

    It accepts an integer as a value, with different results depending on the integer's value:\n

    \n

    Note:\nIf an HTML element renders and has tabindex attribute with any valid integer value, the element can be focused with JavaScript (by calling the focus() method) or visually by clicking with the mouse. The particular tabindex value controls whether the element is tabbable (i.e., reachable via sequential keyboard navigation, usually with the Tab key).\n

    \n\n

    Some focusable HTML elements have a default tabindex value of 0 set under the hood by the user agent. These elements are an <a> or <area> with href attribute, <button>, <frame> , <iframe>, <input>, <object>, <select>, <textarea>, and SVG <a> element, or a <summary> element that provides summary for a <details> element. Developers shouldn't add the tabindex attribute to these elements unless it changes the default behavior (for example, including a negative value will remove the element from the focus navigation order).\n

    \n

    Warning:\nThe tabindex attribute must not be used on the <dialog> element.\n

    " + "doc": "The tabindex global attribute allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable (usually with the Tab key, hence the name) and determine their relative ordering for sequential focus navigation.\n

    It accepts an integer as a value, with different results depending on the integer's value:\n

    \n

    Note:\nIf an HTML element renders and has tabindex attribute with any valid integer value, the element can be focused with JavaScript (by calling the focus() method) or visually by clicking with the mouse. The particular tabindex value controls whether the element is tabbable (i.e., reachable via sequential keyboard navigation, usually with the Tab key).\n

    \n\n

    Some focusable HTML elements have a default tabindex value of 0 set under the hood by the user agent. These elements are an <a> or <area> with href attribute, <button>, <frame> , <iframe>, <input>, <object>, <select>, <textarea>, and SVG <a> element, or a <summary> element that provides summary for a <details> element. Developers shouldn't add the tabindex attribute to these elements unless it changes the default behavior (for example, including a negative value will remove the element from the focus navigation order).\n

    \n

    Warning:\nThe tabindex attribute must not be used on the <dialog> element.\n

    " }, "title": { "url": "$MDN_URL$/web/html/reference/global_attributes/title", @@ -659,8 +661,8 @@ "attributionsrc": { "url": "$MDN_URL$/web/html/reference/elements/a#attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -733,7 +735,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "Causes the browser to treat the linked URL as a download. Can be used with or without a filename value:\n\n
    \n

    Note:\n

      \n
    • download only works for same-origin URLs, or the blob: and data: schemes.
    • \n
    • How browsers treat downloads varies by browser, user settings, and other factors. The user may be prompted before a download starts, or the file may be saved automatically, or it may open automatically, either in an external application or in the browser itself.
    • \n
    • If the Content-Disposition header has different information from the download attribute, resulting behavior may differ:\n
        \n
      • If the header specifies a filename, it takes priority over a filename specified in the download attribute.
      • \n
      • If the header specifies a disposition of inline, Chrome and Firefox prioritize the attribute and treat it as a download. Old Firefox versions (before 82) prioritize the header and will display the content inline.
      • \n
      \n
    • \n
    \n
    " + "doc": "Causes the browser to treat the linked URL as a download. Can be used with or without a filename value:\n\n
    \n

    Note:\n

      \n
    • download only works for same-origin URLs, or the blob: and data: schemes.
    • \n
    • How browsers treat downloads varies by browser, user settings, and other factors. The user may be prompted before a download starts, or the file may be saved automatically, or it may open automatically, either in an external application or in the browser itself.
    • \n
    • If the Content-Disposition header has different information from the download attribute, resulting behavior may differ:\n
        \n
      • If the header specifies a filename, it takes priority over a filename specified in the download attribute.
      • \n
      • If the header specifies a disposition of inline, Chrome and Firefox prioritize the attribute and treat it as a download. Old Firefox versions (before 82) prioritize the header and will display the content inline.
      • \n
      \n
    • \n
    \n
    " }, "href": { "url": "$MDN_URL$/web/html/reference/elements/a#href", @@ -793,6 +795,21 @@ "level": "NONE" } }, + "interestfor": { + "url": "$MDN_URL$/web/html/reference/elements/a#interestfor", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "Defines the <a> element as an interest invoker. Its value is the id of the target element, which will be affected in some way (normally shown or hidden) when interest is shown or lost on the invoker element (for example, by hovering/unhovering or focusing/blurring it). See Using interest invokers for more details and examples." + }, "name": { "url": "$MDN_URL$/web/html/reference/elements/a#name", "status": [ @@ -1098,8 +1115,8 @@ "attributionsrc": { "url": "$MDN_URL$/web/html/reference/elements/area#attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -1131,7 +1148,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The coords attribute details the coordinates of the shape attribute in size, shape, and placement of an <area>.\nThis attribute must not be used if shape is set to default.\n\n

    The values are numbers of CSS pixels. Our shape generator can help you generate the coords syntax by selecting points on an image you upload." + "doc": "The coords attribute details the coordinates of the shape attribute in size, shape, and placement of an <area>.\nThis attribute must not be used if shape is set to default.\n

    \n

    The values are numbers of CSS pixels. Our shape generator can help you generate the coords syntax by selecting points on an image you upload." }, "download": { "url": "$MDN_URL$/web/html/reference/elements/area#download", @@ -1177,6 +1194,21 @@ }, "doc": "The hyperlink target for the area.\nIts value is a valid URL.\nThis attribute may be omitted; if so, the <area> element does not represent a hyperlink." }, + "interestfor": { + "url": "$MDN_URL$/web/html/reference/elements/area#interestfor", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "Defines the <area> element as an interest invoker. Its value is the id of the target element, which will be affected in some way (normally shown or hidden) when interest is shown or lost on the invoker element (for example, by hovering/unhovering or focusing/blurring it). See Using interest invokers for more details and examples." + }, "nohref": { "url": "$MDN_URL$/web/html/reference/elements/area#nohref", "status": [ @@ -1590,7 +1622,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <b> HTML element is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance. This was formerly known as the Boldface element, and most browsers still draw the text in boldface. However, you should not use <b> for styling text or granting importance. If you wish to create boldface text, you should use the CSS font-weight property. If you wish to indicate an element is of special importance, you should use the <strong> element.", + "doc": "The <b> HTML element is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance. This was formerly known as the Boldface element, and most browsers still draw the text in boldface. However, you should not use <b> for styling text or granting importance. If you wish to create boldface text, you should use the CSS font-weight property. If you wish to indicate an element is of special importance, you should use the <strong> element.", "details": { "Content categories": "Flow content\n,\nphrasing content\n, palpable content.\n", "Permitted content": "Phrasing content\n.\n", @@ -1698,7 +1730,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The <bdi> HTML element tells the browser's bidirectional algorithm to treat the text it contains in isolation from its surrounding text. It's particularly useful when a website dynamically inserts some text and doesn't know the directionality of the text being inserted.\n

    Bidirectional text is text that may contain both sequences of characters that are arranged left-to-right (LTR) and sequences of characters that are arranged right-to-left (RTL), such as an Arabic quotation embedded in an English string. Browsers implement the Unicode Bidirectional Algorithm to handle this. In this algorithm, characters are given an implicit directionality: for example, Latin characters are treated as LTR while Arabic characters are treated as RTL. Some other characters (such as spaces and some punctuation) are treated as neutral and are assigned directionality based on that of their surrounding characters.\n

    Usually, the bidirectional algorithm will do the right thing without the author having to provide any special markup but, occasionally, the algorithm needs help. That's where <bdi> comes in.\n

    The <bdi> element is used to wrap a span of text and instructs the bidirectional algorithm to treat this text in isolation from its surroundings. This works in two ways:\n

    \n

    For example, consider some text like:\n

    EMBEDDED-TEXT - 1st place\n
    \n

    If EMBEDDED-TEXT is LTR, this works fine. But if EMBEDDED-TEXT is RTL, then - 1 will be treated as RTL text (because it consists of neutral and weak characters). The result will be garbled:\n

    1 - EMBEDDED-TEXTst place\n
    \n

    If you know the directionality of EMBEDDED-TEXT in advance, you can fix this problem by wrapping EMBEDDED-TEXT in a <span> with the dir attribute set to the known directionality. But if you don't know the directionality - for example, because EMBEDDED-TEXT is being read from a database or entered by the user - you should use <bdi> to prevent the directionality of EMBEDDED-TEXT from affecting its surroundings.\n

    Though the same visual effect can be achieved using the CSS rule unicode-bidi: isolate on a <span> or another text-formatting element, HTML authors should not use this approach because it is not semantic and browsers are allowed to ignore CSS styling.\n

    Embedding the characters in <span dir=\"auto\"> has the same effect as using <bdi>, but its semantics are less clear.", + "doc": "The <bdi> HTML element tells the browser's bidirectional algorithm to treat the text it contains in isolation from its surrounding text. It's particularly useful when a website dynamically inserts some text and doesn't know the directionality of the text being inserted.\n

    Bidirectional text is text that may contain both sequences of characters that are arranged left-to-right (LTR) and sequences of characters that are arranged right-to-left (RTL), such as an Arabic quotation embedded in an English string. Browsers implement the Unicode Bidirectional Algorithm to handle this. In this algorithm, characters are given an implicit directionality: for example, Latin characters are treated as LTR while Arabic characters are treated as RTL. Some other characters (such as spaces and some punctuation) are treated as neutral and are assigned directionality based on that of their surrounding characters.\n

    Usually, the bidirectional algorithm will do the right thing without the author having to provide any special markup but, occasionally, the algorithm needs help. That's where <bdi> comes in.\n

    The <bdi> element is used to wrap a span of text and instructs the bidirectional algorithm to treat this text in isolation from its surroundings. This works in two ways:\n

    \n

    For example, consider some text like:\n

    EMBEDDED-TEXT - 1st place\n
    \n

    If EMBEDDED-TEXT is LTR, this works fine. But if EMBEDDED-TEXT is RTL, then - 1 will be treated as RTL text (because it consists of neutral and weak characters). The result will be garbled:\n

    1 - EMBEDDED-TEXTst place\n
    \n

    If you know the directionality of EMBEDDED-TEXT in advance, you can fix this problem by wrapping EMBEDDED-TEXT in a <span> with the dir attribute set to the known directionality. But if you don't know the directionality - for example, because EMBEDDED-TEXT is being read from a database or entered by the user - you should use <bdi> to prevent the directionality of EMBEDDED-TEXT from affecting its surroundings.\n

    Though the same visual effect can be achieved using the CSS rule unicode-bidi: isolate on a <span> or another text-formatting element, HTML authors should not use this approach because it is not semantic and browsers are allowed to ignore CSS styling.\n

    Embedding the characters in <span dir=\"auto\"> has the same effect as using <bdi>, but its semantics are less clear.", "details": { "Content categories": "Flow content\n,\nphrasing content\n, palpable content.\n", "Permitted content": "Phrasing content\n.\n", @@ -1762,7 +1794,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <big> HTML deprecated element renders the enclosed text at a font size one level larger than the surrounding text (medium becomes large, for example). The size is capped at the browser's maximum permitted font size.\n

    \n

    Warning:\nThis element has been removed from the specification and shouldn't be used anymore. Use the CSS font-size property to adjust the font size.\n

    " + "doc": "

    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.

    \n

    The <big> HTML deprecated element renders the enclosed text at a font size one level larger than the surrounding text (medium becomes large, for example). The size is capped at the browser's maximum permitted font size.\n

    \n

    Warning:\nThis element has been removed from the specification and shouldn't be used anymore. Use the CSS font-size property to adjust the font size.\n

    " }, "blockquote": { "url": "$MDN_URL$/web/html/reference/elements/blockquote", @@ -1869,7 +1901,7 @@ "baseline": { "level": "NONE" }, - "doc": "Color of text for hyperlinks when selected.\nUse the CSS color property in conjunction with the :active and :focus pseudo-classes instead." + "doc": "Color of text for hyperlinks when selected.\nUse the CSS color property in conjunction with the :active and :focus pseudo-classes instead." }, "background": { "url": "$MDN_URL$/web/html/reference/elements/body#background", @@ -1890,7 +1922,7 @@ "baseline": { "level": "NONE" }, - "doc": "URI of an image to use as a background.\nUse the CSS background-image property instead." + "doc": "URI of an image to use as a background.\nUse the CSS background-image property instead." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/body#bgcolor", @@ -1911,7 +1943,7 @@ "baseline": { "level": "NONE" }, - "doc": "Background color for the document.\nUse the CSS background-color property instead." + "doc": "Background color for the document.\nUse the CSS background-color property instead." }, "bottommargin": { "url": "$MDN_URL$/web/html/reference/elements/body#bottommargin", @@ -1932,7 +1964,7 @@ "baseline": { "level": "NONE" }, - "doc": "The margin of the bottom of the body.\nUse the CSS margin-bottom property (or the logical margin-block-end property) instead." + "doc": "The margin of the bottom of the body.\nUse the CSS margin-bottom property (or the logical margin-block-end property) instead." }, "leftmargin": { "url": "$MDN_URL$/web/html/reference/elements/body#leftmargin", @@ -1953,7 +1985,7 @@ "baseline": { "level": "NONE" }, - "doc": "The margin of the left of the body.\nUse the CSS margin-left property (or the logical margin-inline-start property) instead." + "doc": "The margin of the left of the body.\nUse the CSS margin-left property (or the logical margin-inline-start property) instead." }, "link": { "url": "$MDN_URL$/web/html/reference/elements/body#link", @@ -1974,7 +2006,7 @@ "baseline": { "level": "NONE" }, - "doc": "Color of text for unvisited hypertext links.\nUse the CSS color property in conjunction with the :link pseudo-class instead." + "doc": "Color of text for unvisited hypertext links.\nUse the CSS color property in conjunction with the :link pseudo-class instead." }, "rightmargin": { "url": "$MDN_URL$/web/html/reference/elements/body#rightmargin", @@ -1995,7 +2027,7 @@ "baseline": { "level": "NONE" }, - "doc": "The margin of the right of the body.\nUse the CSS margin-right property or the logical margin-inline-end property) instead." + "doc": "The margin of the right of the body.\nUse the CSS margin-right property or the logical margin-inline-end property) instead." }, "text": { "url": "$MDN_URL$/web/html/reference/elements/body#text", @@ -2016,7 +2048,7 @@ "baseline": { "level": "NONE" }, - "doc": "Foreground color of text.\nUse the CSS color property instead." + "doc": "Foreground color of text.\nUse the CSS color property instead." }, "topmargin": { "url": "$MDN_URL$/web/html/reference/elements/body#topmargin", @@ -2037,7 +2069,7 @@ "baseline": { "level": "NONE" }, - "doc": "The margin of the top of the body.\nUse the CSS margin-top property (or the logical margin-block-start property) instead." + "doc": "The margin of the top of the body.\nUse the CSS margin-top property (or the logical margin-block-start property) instead." }, "vlink": { "url": "$MDN_URL$/web/html/reference/elements/body#vlink", @@ -2058,7 +2090,7 @@ "baseline": { "level": "NONE" }, - "doc": "Color of text for visited hypertext links.\nUse the CSS color property in conjunction with the :visited pseudo-class instead." + "doc": "Color of text for visited hypertext links.\nUse the CSS color property in conjunction with the :visited pseudo-class instead." } } }, @@ -2082,7 +2114,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <br> HTML element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.\n

    As you can see from the above example, a <br> element is included at each point where we want the text to break. The text after the <br> begins again at the start of the next line of the text block.\n

    \n

    Note:\nDo not use <br> to create margins between paragraphs; wrap them in <p> elements and use the CSS margin property to control their size.\n

    ", + "doc": "The <br> HTML element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.\n

    As you can see from the above example, a <br> element is included at each point where we want the text to break. The text after the <br> begins again at the start of the next line of the text block.\n

    \n

    Note:\nDo not use <br> to create margins between paragraphs; wrap them in <p> elements and use the CSS margin property to control their size.\n

    ", "details": { "Content categories": "Flow content\n,\nphrasing content\n.\n", "Permitted content": "None; it is a\nvoid element\n.\n", @@ -2163,12 +2195,14 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, - "doc": "Specifies the action to be performed on an element being controlled by a control <button> specified via the commandfor attribute. The possible values are:\n
    \n
    \"show-modal\"
    \n
    \n

    The button will show a <dialog> as modal. If the dialog is already modal, no action will be taken. This is a declarative equivalent of calling the HTMLDialogElement.showModal() method on the <dialog> element.\n

    \n
    \"close\"
    \n
    \n

    The button will close a <dialog> element. If the dialog is already closed, no action will be taken. This is a declarative equivalent of calling the HTMLDialogElement.close() method on the <dialog> element.\n

    \n
    \"request-close\"
    \n
    \n

    The button will trigger a cancel event on a <dialog> element to request that the browser dismiss it, followed by a close event. This differs from the close command in that authors can call Event.preventDefault() on the cancel event to prevent the <dialog> from closing. If the dialog is already closed, no action will be taken. This is a declarative equivalent of calling the HTMLDialogElement.requestClose() method on the <dialog> element.\n

    \n
    \"show-popover\"
    \n
    \n

    The button will show a hidden popover. If you try to show an already showing popover, no action will be taken. See Popover API for more details. This is equivalent to setting a value of show for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.showPopover() method on the popover element.\n

    \n
    \"hide-popover\"
    \n
    \n

    The button will hide a showing popover. If you try to hide an already hidden popover, no action will be taken. See Popover API for more details. This is equivalent to setting a value of hide for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.hidePopover() method on the popover element.\n

    \n
    \"toggle-popover\"
    \n
    \n

    The button will toggle a popover between showing and hidden. If the popover is hidden, it will be shown; if the popover is showing, it will be hidden. See Popover API for more details. This is equivalent to setting a value of toggle for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.togglePopover() method on the popover element.\n

    \n
    Custom values
    \n
    \n

    This attribute can represent custom values that are prefixed with a two hyphen characters (--). Buttons with a custom value will dispatch the CommandEvent on the controlled element.\n

    \n
    " + "doc": "Specifies the action to be performed on an element being controlled by a control <button> specified via the commandfor attribute. The possible values are:\n
    \n
    \"show-modal\"
    \n
    \n

    The button will show a <dialog> as modal. If the dialog is already modal, no action will be taken. This is a declarative equivalent of calling the HTMLDialogElement.showModal() method on the <dialog> element.\n

    \n
    \"close\"
    \n
    \n

    The button will close a <dialog> element.\nIf the dialog is already closed, no action will be taken.\nThis is a declarative equivalent of calling the HTMLDialogElement.close() method on the <dialog> element.\nWhen used with the value attribute, the button's value will be passed as the dialog's returnValue property.\n

    \n
    \"request-close\"
    \n
    \n

    The button will trigger a cancel event on a <dialog> element to request that the browser dismiss it, followed by a close event.\nThis differs from the close command in that authors can call Event.preventDefault() on the cancel event to prevent the <dialog> from closing.\nIf the dialog is already closed, no action will be taken.\nThis is a declarative equivalent of calling the HTMLDialogElement.requestClose() method on the <dialog> element.\nWhen used with the button's value attribute, the value will be passed as the dialog's returnValue property.\n

    \n
    \"show-popover\"
    \n
    \n

    The button will show a hidden popover. If you try to show an already showing popover, no action will be taken. See Popover API for more details. This is equivalent to setting a value of show for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.showPopover() method on the popover element.\n

    \n
    \"hide-popover\"
    \n
    \n

    The button will hide a showing popover. If you try to hide an already hidden popover, no action will be taken. See Popover API for more details. This is equivalent to setting a value of hide for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.hidePopover() method on the popover element.\n

    \n
    \"toggle-popover\"
    \n
    \n

    The button will toggle a popover between showing and hidden. If the popover is hidden, it will be shown; if the popover is showing, it will be hidden. See Popover API for more details. This is equivalent to setting a value of toggle for the popovertargetaction attribute, and also provides a declarative equivalent to calling the HTMLElement.togglePopover() method on the popover element.\n

    \n
    Custom values
    \n
    \n

    This attribute can represent custom values that are prefixed with a two hyphen characters (--). Buttons with a custom value will dispatch the CommandEvent on the controlled element.\n

    \n
    " }, "commandfor": { "url": "$MDN_URL$/web/html/reference/elements/button#commandfor", @@ -2182,10 +2216,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "Turns a <button> element into a command button, controlling a given interactive element by issuing the command specified in the button's command attribute. The commandfor attribute takes the ID of the element to control as its value. This is a more general version of popovertarget." }, @@ -2343,6 +2379,21 @@ }, "doc": "If the button is a submit button, this attribute is an author-defined name or standardized, underscore-prefixed keyword indicating where to display the response from submitting the form. This is the name of, or keyword for, a browsing context (a tab, window, or <iframe>). If this attribute is specified, it overrides the target attribute of the button's form owner. The following keywords have special meanings:\n" }, + "interestfor": { + "url": "$MDN_URL$/web/html/reference/elements/button#interestfor", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "Defines the <button> element as an interest invoker. Its value is the id of a target element, which will be affected in some way (normally shown or hidden) when interest is shown or lost on the invoker element (for example, by hovering/unhovering or focusing/blurring it). See Using interest invokers for more details and examples." + }, "name": { "url": "$MDN_URL$/web/html/reference/elements/button#name", "status": [ @@ -2384,7 +2435,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "Turns a <button> element into a popover control button; takes the ID of the popover element to control as its value. Establishing a relationship between a popover and its invoker button using the popovertarget attribute has two additional useful effects:\n" + "doc": "Turns a <button> element into a popover control button; takes the ID of the popover element to control as its value. Establishing a relationship between a popover and its invoker button using the popovertarget attribute has two additional useful effects:\n" }, "popovertargetaction": { "url": "$MDN_URL$/web/html/reference/elements/button#popovertargetaction", @@ -2449,7 +2500,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "Defines the value associated with the button's name when it's submitted with the form data. This value is passed to the server in params when the form is submitted using this button." + "doc": "Defines the value associated with the button's name when it's submitted with the form data.\nThis value is passed to the server in params when the form is submitted using this button.\nWhen used with the close or request-close commands, the value attribute sets the returnValue of the <dialog> element being controlled." } } }, @@ -2584,7 +2635,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies on which side of the table the caption should be displayed. The possible enumerated values are left, top, right, or bottom. Use the caption-side and text-align CSS properties instead, as this attribute is deprecated." + "doc": "Specifies on which side of the table the caption should be displayed. The possible enumerated values are left, top, right, or bottom. Use the caption-side and text-align CSS properties instead, as this attribute is deprecated." } } }, @@ -2604,7 +2655,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <center> HTML element is a block-level element that displays its block-level or inline contents centered horizontally within its containing element. The container is usually, but isn't required to be, <body>.\n

    This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the CSS text-align property, which can be applied to the <div> element or to an individual <p>. For centering blocks, use other CSS properties like margin-left and margin-right and set them to auto (or set margin to 0 auto)." + "doc": "

    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.

    \n

    The <center> HTML element is a block-level element that displays its block-level or inline contents centered horizontally within its containing element. The container is usually, but isn't required to be, <body>.\n

    This tag has been deprecated in HTML 4 (and XHTML 1) in favor of the CSS text-align property, which can be applied to the <div> element or to an individual <p>. For centering blocks, use other CSS properties like margin-left and margin-right and set them to auto (or set margin to 0 auto)." }, "cite": { "url": "$MDN_URL$/web/html/reference/elements/cite", @@ -2718,11 +2769,11 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each column cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Note that this attribute overrides the specified align of its <colgroup> parent element. Use the text-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n

    \n

    Note:\nSetting text-align on the <col> element has no effect as <col> has no descendants, and therefore no elements inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector. Set a to zero and b to the position of the column in the table, e.g., td:nth-of-type(2) { text-align: right; } to right-align the second column cells.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " + "doc": "Specifies the horizontal alignment of each column cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Note that this attribute overrides the specified align of its <colgroup> parent element. Use the text-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting text-align on the <col> element has no effect as <col> has no descendants, and therefore no elements inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector. Set a to zero and b to the position of the column in the table, e.g., td:nth-of-type(2) { text-align: right; } to right-align the second column cells.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/col#bgcolor", - "doc": "Defines the background color of each column cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each column cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/col#char", @@ -2730,13 +2781,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -2748,13 +2793,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -2771,6 +2810,7 @@ "Edge": "12", "Firefox": "1", "FirefoxAndroid": "4", + "Opera": "15", "Safari": "4", "SafariIOS": "3.2" }, @@ -2800,7 +2840,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each column cell. The possible enumerated values are baseline, bottom, middle, and top. Note that this attribute overrides the specified valign of its <colgroup> parent element. Use the vertical-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting vertical-align on the <col> element has no effect as <col> has no descendants, and therefore no elements inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector. Set a to zero and b to the position of the column in the table, e.g., td:nth-of-type(2) { vertical-align: middle; } to center the second column cells vertically.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " + "doc": "Specifies the vertical alignment of each column cell. The possible enumerated values are baseline, bottom, middle, and top. Note that this attribute overrides the specified valign of its <colgroup> parent element. Use the vertical-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting vertical-align on the <col> element has no effect as <col> has no descendants, and therefore no elements inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector. Set a to zero and b to the position of the column in the table, e.g., td:nth-of-type(2) { vertical-align: middle; } to center the second column cells vertically.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " }, "width": { "url": "$MDN_URL$/web/html/reference/elements/col#width", @@ -2821,7 +2861,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies a default width for each column. In addition to the standard pixel and percentage values, this attribute can take the special form 0*, which means that the width of each column spanned should be the minimum width necessary to hold the column's contents. Relative widths such as 5* can also be used. Note that this attribute overrides the specified width of its <colgroup> parent element. Use the width CSS property instead, as this attribute is deprecated." + "doc": "Specifies a default width for each column. In addition to the standard pixel and percentage values, this attribute can take the special form 0*, which means that the width of each column spanned should be the minimum width necessary to hold the column's contents. Relative widths such as 5* can also be used. Note that this attribute overrides the specified width of its <colgroup> parent element. Use the width CSS property instead, as this attribute is deprecated." } } }, @@ -2875,11 +2915,11 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each column group cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Note that the descendant <col> elements may override this value using their own align attribute. Use the text-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting text-align on the <colgroup> element has no effect as <td> and <th> elements are not descendants of the <colgroup> element, and therefore they do not inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector per column, where a is the total number of the columns in the table and b is the ordinal position of the column in the table, e.g., td:nth-of-type(7n+2) { text-align: right; } to right-align the second column cells.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " + "doc": "Specifies the horizontal alignment of each column group cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Note that the descendant <col> elements may override this value using their own align attribute. Use the text-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting text-align on the <colgroup> element has no effect as <td> and <th> elements are not descendants of the <colgroup> element, and therefore they do not inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type(an+b) CSS selector per column, where a is the total number of the columns in the table and b is the ordinal position of the column in the table, e.g., td:nth-of-type(7n+2) { text-align: right; } to right-align the second column cells.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/colgroup#bgcolor", - "doc": "Defines the background color of each column group cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each column group cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/colgroup#char", @@ -2887,13 +2927,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -2905,13 +2939,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -2958,7 +2986,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each column group cell. The possible enumerated values are baseline, bottom, middle, and top. Note that the descendant <col> elements may override this value using their own valign attribute. Use the vertical-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting vertical-align on the <colgroup> element has no effect as <td> and <th> elements are not descendants of the <colgroup> element, and therefore they do not inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type() CSS selector per column, e.g., td:nth-of-type(2) { vertical-align: middle; } to center the second column cells vertically.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " + "doc": "Specifies the vertical alignment of each column group cell. The possible enumerated values are baseline, bottom, middle, and top. Note that the descendant <col> elements may override this value using their own valign attribute. Use the vertical-align CSS property on the <td> and <th> elements instead, as this attribute is deprecated.\n
    \n

    Note:\nSetting vertical-align on the <colgroup> element has no effect as <td> and <th> elements are not descendants of the <colgroup> element, and therefore they do not inherit from it.\n

    If the table does not use a colspan attribute, use the td:nth-of-type() CSS selector per column, e.g., td:nth-of-type(2) { vertical-align: middle; } to center the second column cells vertically.\n

    If the table does use a colspan attribute, the effect can be achieved by combining adequate CSS attribute selectors like [colspan=n], though this is not trivial.\n

    " }, "width": { "url": "$MDN_URL$/web/html/reference/elements/colgroup#width", @@ -2979,7 +3007,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies a default width for each column in the current column group. In addition to the standard pixel and percentage values, this attribute can take the special form 0*, which means that the width of each column spanned should be the minimum width necessary to hold the column's contents. Relative widths such as 5* can also be used. Note that the descendant <col> elements may override this value using their own width attribute. Use the width CSS property instead, as this attribute is deprecated." + "doc": "Specifies a default width for each column in the current column group. In addition to the standard pixel and percentage values, this attribute can take the special form 0*, which means that the width of each column spanned should be the minimum width necessary to hold the column's contents. Relative widths such as 5* can also be used. Note that the descendant <col> elements may override this value using their own width attribute. Use the width CSS property instead, as this attribute is deprecated." } } }, @@ -3193,7 +3221,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The <details> HTML element creates a disclosure widget in which information is visible only when the widget is toggled into an open state. A summary or label must be provided using the <summary> element.\n

    A disclosure widget is typically presented onscreen using a small triangle that rotates (or twists) to indicate open/closed state, with a label next to the triangle. The contents of the <summary> element are used as the label for the disclosure widget. The contents of the <details> provide the accessible description for the <summary>.\n

    A <details> widget can be in one of two states. The default closed state displays only the triangle and the label inside <summary> (or a user agent-defined default string if no <summary>).\n

    When the user clicks on the widget or focuses it then presses the space bar, it \"twists\" open, revealing its contents. The common use of a triangle which rotates or twists around to represent opening or closing the widget is why these are sometimes called \"twisty\".\n

    You can use CSS to style the disclosure widget, and you can programmatically open and close the widget by setting/removing its open attribute. Unfortunately, at this time, there's no built-in way to animate the transition between open and closed.\n

    By default when closed, the widget is only tall enough to display the disclosure triangle and summary. When open, it expands to display the details contained within.\n

    Fully standards-compliant implementations automatically apply the CSS display: list-item to the <summary> element. You can use this or the ::marker pseudo-element to customize the disclosure widget.", + "doc": "The <details> HTML element creates a disclosure widget in which information is visible only when the widget is toggled into an open state. A summary or label must be provided using the <summary> element.\n

    A disclosure widget is typically presented onscreen using a small triangle that rotates (or twists) to indicate open/closed state, with a label next to the triangle. The contents of the <summary> element are used as the label for the disclosure widget. The contents of the <details> provide the accessible description for the <summary>.\n

    A <details> widget can be in one of two states. The default closed state displays only the triangle and the label inside <summary> (or a user agent-defined default string if no <summary>).\n

    When the user clicks on the widget or focuses it then presses the space bar, it \"twists\" open, revealing its contents. The common use of a triangle which rotates or twists around to represent opening or closing the widget is why these are sometimes called \"twisty\".\n

    You can use CSS to style the disclosure widget, and you can programmatically open and close the widget by setting/removing its open attribute. Unfortunately, at this time, there's no built-in way to animate the transition between open and closed.\n

    By default when closed, the widget is only tall enough to display the disclosure triangle and summary. When open, it expands to display the details contained within.\n

    Fully standards-compliant implementations automatically apply the CSS display: list-item to the <summary> element. You can use this or the ::marker pseudo-element to customize the disclosure widget.", "details": { "Content categories": "Flow content\n, sectioning root, interactive content, palpable content.\n", "Permitted content": "One\n<summary>\nelement followed by\nflow content\n.\n", @@ -3414,7 +3442,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <div> HTML element is the generic container for flow content. It has no effect on the content or layout until styled in some way using CSS (e.g., styling is directly applied to it, or some kind of layout model like Flexbox is applied to its parent element).\n

    As a \"pure\" container, the <div> element does not inherently represent anything. Instead, it's used to group content so it can be easily styled using the class or id attributes, marking a section of a document as being written in a different language (using the lang attribute), and so on.", + "doc": "The <div> HTML element is the generic container for flow content. It has no effect on the content or layout until styled in some way using CSS (e.g., styling is directly applied to it, or some kind of layout model like Flexbox is applied to its parent element).\n

    As a \"pure\" container, the <div> element does not inherently represent anything. Instead, it's used to group content so it can be easily styled using the class or id attributes, marking a section of a document as being written in a different language (using the lang attribute), and so on.", "details": { "Content categories": "Flow content\n,\npalpable content\n.\n", "Permitted content": "Flow content\n.\n
    \nOr (in\nWHATWG\nHTML): If the parent is a\n<dl>\nelement: one or more\n<dt>\nelements followed by one or more\n<dd>\nelements, optionally intermixed with\n<script>\nand\n<template>\nelements.\n", @@ -3479,7 +3507,7 @@ "attrs": { "compact": { "url": "$MDN_URL$/web/html/reference/elements/dl#compact", - "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." + "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." } } }, @@ -3962,7 +3990,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <font> HTML element defines the font size, color and face for its content.\n

    \n

    Warning:\nDo not use this element. Use the CSS Fonts properties to style text.\n

    ", + "doc": "

    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.

    \n

    The <font> HTML element defines the font size, color and face for its content.\n

    \n

    Warning:\nDo not use this element. Use the CSS Fonts properties to style text.\n

    ", "attrs": { "color": { "url": "$MDN_URL$/web/html/reference/elements/font#color", @@ -4080,7 +4108,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <form> HTML element represents a document section containing interactive controls for submitting information.\n

    It is possible to use the :valid and :invalid CSS pseudo-classes to style a <form> element based on whether the elements inside the form are valid.", + "doc": "The <form> HTML element represents a document section containing interactive controls for submitting information.\n

    It is possible to use the :valid and :invalid CSS pseudo-classes to style a <form> element based on whether the elements inside the form are valid.", "details": { "Content categories": "Flow content\n,\npalpable content\n", "Permitted content": "Flow content\n, but not containing\n<form>\nelements\n", @@ -4655,7 +4683,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <hr> HTML element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.\n

    Historically, this has been presented as a horizontal rule or line. While it may still be displayed as a horizontal rule in visual browsers, this element is now defined in semantic terms, rather than presentational terms, so if you wish to draw a horizontal line, you should do so using appropriate CSS.", + "doc": "The <hr> HTML element represents a thematic break between paragraph-level elements: for example, a change of scene in a story, or a shift of topic within a section.\n

    Historically, the <hr> element has always been presented as a horizontal rule or line. While it may still be displayed as a horizontal rule in visual browsers, this element is now defined in semantic terms, rather than presentational terms. Therefore, if you wish to draw a horizontal line, you should do so by adding a border to an existing element using CSS.\n

    The border-* properties (for example, border-style and border-color) allow you to significantly customize a line's appearance, whether you are customizing an <hr> element or a border drawn on a different element.", "details": { "Content categories": "Flow content\n.\n", "Permitted content": "None; it is a\nvoid element\n.\n", @@ -4966,7 +4994,7 @@ "baseline": { "level": "NONE" }, - "doc": "Set to true if the <iframe> can activate fullscreen mode by calling the requestFullscreen() method.\n

    \n

    Note:\nThis attribute is considered a legacy attribute and redefined as allow=\"fullscreen\".\n

    " + "doc": "Set to true if the <iframe> can activate fullscreen mode by calling the requestFullscreen() method.\n
    \n

    Note:\nThis attribute is considered a legacy attribute and redefined as allow=\"fullscreen *\".\n

    " }, "allowpaymentrequest": { "url": "$MDN_URL$/web/html/reference/elements/iframe#allowpaymentrequest", @@ -4982,12 +5010,12 @@ "baseline": { "level": "NONE" }, - "doc": "Set to true if a cross-origin <iframe> should be allowed to invoke the Payment Request API.\n
    \n

    Note:\nThis attribute is considered a legacy attribute and redefined as allow=\"payment\".\n

    " + "doc": "Set to true if a cross-origin <iframe> should be allowed to invoke the Payment Request API.\n
    \n

    Note:\nThis attribute is considered a legacy attribute and redefined as allow=\"payment *\".\n

    " }, "browsingtopics": { "url": "$MDN_URL$/web/html/reference/elements/iframe#browsingtopics", "status": [ - "Experimental" + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -5015,7 +5043,7 @@ "baseline": { "level": "NONE" }, - "doc": "Set to true to make the <iframe> credentialless, meaning that its content will be loaded in a new, ephemeral context. It doesn't have access to the network, cookies, and storage data associated with its origin. It uses a new context local to the top-level document lifetime. In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not. See IFrame credentialless for more details." + "doc": "Set to true to make the <iframe> credentialless, meaning that its content will be loaded in a new, ephemeral context. It doesn't have access to the network, cookies, and storage data associated with its origin. It uses a new context local to the top-level document lifetime. In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not. See IFrame credentialless for more details." }, "csp": { "url": "$MDN_URL$/web/html/reference/elements/iframe#csp", @@ -5053,7 +5081,7 @@ "baseline": { "level": "NONE" }, - "doc": "The value 1 (the default) draws a border around this frame. The value 0 removes the border around this frame, but you should instead use the CSS property border to control <iframe> borders." + "doc": "The value 1 (the default) draws a border around this frame. The value 0 removes the border around this frame, but you should instead use the CSS property border to control <iframe> borders." }, "height": { "url": "$MDN_URL$/web/html/reference/elements/iframe#height", @@ -5183,6 +5211,22 @@ }, "doc": "A targetable name for the embedded browsing context. This can be used in the target attribute of the <a>, <form>, or <base> elements; the formtarget attribute of the <input> or <button> elements; or the windowName parameter in the window.open() method. In addition, the name becomes a property of the Window and Document objects, containing a reference to the embedded window or the element itself." }, + "privatetoken": { + "url": "$MDN_URL$/web/html/reference/elements/iframe#privatetoken", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", + "Opera": "103" + }, + "baseline": { + "level": "NONE" + } + }, "referrerpolicy": { "url": "$MDN_URL$/web/html/reference/elements/iframe#referrerpolicy", "status": [ @@ -5225,7 +5269,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "Controls the restrictions applied to the content embedded in the <iframe>. The value of the attribute can either be empty to apply all restrictions, or space-separated tokens to lift particular restrictions:\n
    \n
    allow-downloads
    \n
    \n

    Allows downloading files through an <a> or <area> element with the download attribute, as well as through the navigation that leads to a download of a file. This works regardless of whether the user clicked on the link, or JS code initiated it without user interaction.\n

    \n
    allow-forms
    \n
    \n

    Allows the page to submit forms. If this keyword is not used, a form will be displayed as normal, but submitting it will not trigger input validation, send data to a web server, or close a dialog.\n

    \n
    allow-modals
    \n
    \n

    Allows the page to open modal windows by Window.alert(), Window.confirm(), Window.print() and Window.prompt(), while opening a <dialog> is allowed regardless of this keyword. It also allows the page to receive BeforeUnloadEvent event.\n

    \n
    allow-orientation-lock
    \n
    \n

    Lets the resource lock the screen orientation.\n

    \n
    allow-pointer-lock
    \n
    \n

    Allows the page to use the Pointer Lock API.\n

    \n
    allow-popups
    \n
    \n

    Allows popups (created, for example, by Window.open() or target=\"_blank\"). If this keyword is not used, such functionality will silently fail.\n

    \n
    allow-popups-to-escape-sandbox
    \n
    \n

    Allows a sandboxed document to open a new browsing context without forcing the sandboxing flags upon it. This will allow, for example, a third-party advertisement to be safely sandboxed without forcing the same restrictions upon the page the ad links to. If this flag is not included, a redirected page, popup window, or new tab will be subject to the same sandbox restrictions as the originating <iframe>.\n

    \n
    allow-presentation
    \n
    \n

    Allows embedders to have control over whether an iframe can start a presentation session.\n

    \n
    allow-same-origin
    \n
    \n

    If this token is not used, the resource is treated as being from a special origin that always fails the same-origin policy (potentially preventing access to data storage/cookies and some JavaScript APIs).\n

    \n
    allow-scripts
    \n
    \n

    Allows the page to run scripts (but not create pop-up windows). If this keyword is not used, this operation is not allowed.\n

    \n
    allow-storage-access-by-user-activation
    \n
    \n

    Allows a document loaded in the <iframe> to use the Storage Access API to request access to unpartitioned cookies.\n

    \n
    allow-top-navigation
    \n
    \n

    Lets the resource navigate the top-level browsing context (the one named _top).\n

    \n
    allow-top-navigation-by-user-activation
    \n
    \n

    Lets the resource navigate the top-level browsing context, but only if initiated by a user gesture.\n

    \n
    allow-top-navigation-to-custom-protocols
    \n
    \n

    Allows navigations to non-http protocols built into browser or registered by a website. This feature is also activated by allow-popups or allow-top-navigation keyword.\n

    \n
    \n
    \n

    Note:\n

      \n
    • When the embedded document has the same origin as the embedding page, it is strongly discouraged to use both allow-scripts and allow-same-origin, as that lets the embedded document remove the sandbox attribute — making it no more secure than not using the sandbox attribute at all.
    • \n
    • Sandboxing is useless if the attacker can display content outside a sandboxed iframe — such as if the viewer opens the frame in a new tab. Such content should be also served from a separate origin to limit potential damage.
    • \n
    \n
    \n
    \n

    Note:\nWhen redirecting the user, opening a popup window, or opening a new tab from an embedded page within an <iframe> with the sandbox attribute, the new browsing context is subject to the same sandbox restrictions. This can create issues — for example, if a page embedded within an <iframe> without a sandbox=\"allow-forms\" or sandbox=\"allow-popups-to-escape-sandbox\" attribute set on it opens a new site in a separate tab, form submission in that new browsing context will silently fail.\n

    " + "doc": "Controls the restrictions applied to the content embedded in the <iframe>. The value of the attribute can either be empty to apply all restrictions, or space-separated tokens to lift particular restrictions:\n
    \n
    allow-downloads
    \n
    \n

    Allows downloading files through an <a> or <area> element with the download attribute, as well as through the navigation that leads to a download of a file. This works regardless of whether the user clicked on the link, or JS code initiated it without user interaction.\n

    \n
    allow-forms
    \n
    \n

    Allows the page to submit forms. If this keyword is not used, a form will be displayed as normal, but submitting it will not trigger input validation, send data to a web server, or close a dialog.\n

    \n
    allow-modals
    \n
    \n

    Allows the page to open modal windows by Window.alert(), Window.confirm(), Window.print() and Window.prompt(), while opening a <dialog> is allowed regardless of this keyword. It also allows the page to receive BeforeUnloadEvent event.\n

    \n
    allow-orientation-lock
    \n
    \n

    Lets the resource lock the screen orientation.\n

    \n
    allow-pointer-lock
    \n
    \n

    Allows the page to use the Pointer Lock API.\n

    \n
    allow-popups
    \n
    \n

    Allows popups (created, for example, by Window.open() or target=\"_blank\"). If this keyword is not used, such functionality will silently fail.\n

    \n
    allow-popups-to-escape-sandbox
    \n
    \n

    Allows a sandboxed document to open a new browsing context without forcing the sandboxing flags upon it. This will allow, for example, a third-party advertisement to be safely sandboxed without forcing the same restrictions upon the page the ad links to. If this flag is not included, a redirected page, popup window, or new tab will be subject to the same sandbox restrictions as the originating <iframe>.\n

    \n
    allow-presentation
    \n
    \n

    Allows embedders to have control over whether an iframe can start a presentation session.\n

    \n
    allow-same-origin
    \n
    \n

    If this token is not used, the resource is treated as being from a special origin that always fails the same-origin policy (potentially preventing access to data storage/cookies and some JavaScript APIs).\n

    \n

    Note:\nWhen allow-same-origin is present, a same-origin parent document can still access and interact with the iframe's DOM even if allow-scripts is not set. The allow-scripts token only controls script execution within the embedded browsing context and does not affect DOM access from the parent.\n

    \n
    \n
    allow-scripts
    \n
    \n

    Allows the page to run scripts (but not create pop-up windows). If this keyword is not used, this operation is not allowed.\n

    \n
    allow-storage-access-by-user-activation
    \n
    \n

    Allows a document loaded in the <iframe> to use the Storage Access API to request access to unpartitioned cookies.\n

    \n
    allow-top-navigation
    \n
    \n

    Lets the resource navigate the top-level browsing context (the one named _top).\n

    \n
    allow-top-navigation-by-user-activation
    \n
    \n

    Lets the resource navigate the top-level browsing context, but only if initiated by a user gesture.\n

    \n
    allow-top-navigation-to-custom-protocols
    \n
    \n

    Allows navigations to non-http protocols built into browser or registered by a website. This feature is also activated by allow-popups or allow-top-navigation keyword.\n

    \n
    \n
    \n

    Note:\n

      \n
    • When the embedded document has the same origin as the embedding page, it is strongly discouraged to use both allow-scripts and allow-same-origin, as that lets the embedded document remove the sandbox attribute — making it no more secure than not using the sandbox attribute at all.
    • \n
    • Sandboxing is useless if the attacker can display content outside a sandboxed iframe — such as if the viewer opens the frame in a new tab. Such content should be also served from a separate origin to limit potential damage.
    • \n
    \n
    \n
    \n

    Note:\nWhen redirecting the user, opening a popup window, or opening a new tab from an embedded page within an <iframe> with the sandbox attribute, the new browsing context is subject to the same sandbox restrictions. This can create issues — for example, if a page embedded within an <iframe> without a sandbox=\"allow-forms\" or sandbox=\"allow-popups-to-escape-sandbox\" attribute set on it opens a new site in a separate tab, form submission in that new browsing context will silently fail.\n

    " }, "scrolling": { "url": "$MDN_URL$/web/html/reference/elements/iframe#scrolling", @@ -5268,7 +5312,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The URL of the page to embed. Use a value of about:blank to embed an empty page that conforms to the same-origin policy. Also note that programmatically removing an <iframe>'s src attribute (e.g., via Element.removeAttribute()) causes about:blank to be loaded in the frame in Firefox (from version 65), Chromium-based browsers, and Safari/iOS.\n
    \n

    Note:\nThe about:blank page uses the embedding document's URL as its base URL when resolving any relative URLs, such as anchor links.\n

    " + "doc": "The URL of the page to embed. Use a value of about:blank to embed an empty page that conforms to the same-origin policy. Also note that programmatically removing an <iframe>'s src attribute (e.g., via Element.removeAttribute()) causes about:blank to be loaded in the frame in Firefox (from version 65), Chromium-based browsers, and Safari/iOS.\n
    \n

    Note:\nThe about:blank page uses the embedding document's URL as its base URL when resolving any relative URLs, such as anchor links.\n

    " }, "srcdoc": { "url": "$MDN_URL$/web/html/reference/elements/iframe#srcdoc", @@ -5366,7 +5410,7 @@ "baseline": { "level": "NONE" }, - "doc": "Aligns the image with its surrounding context. Use the float and/or vertical-align CSS properties instead of this attribute. Allowed values:\n
    \n
    top
    \n
    \n

    Equivalent to vertical-align: top or vertical-align: text-top\n

    \n
    middle
    \n
    \n

    Equivalent to vertical-align: -moz-middle-with-baseline\n

    \n
    bottom
    \n
    \n

    The default, equivalent to vertical-align: unset or vertical-align: initial\n

    \n
    left
    \n
    \n

    Equivalent to float: left\n

    \n
    right
    \n
    \n

    Equivalent to float: right\n

    \n
    " + "doc": "Aligns the image with its surrounding context. Use the float and/or vertical-align CSS properties instead of this attribute. Allowed values:\n
    \n
    top
    \n
    \n

    Equivalent to vertical-align: top or vertical-align: text-top\n

    \n
    middle
    \n
    \n

    Equivalent to vertical-align: -moz-middle-with-baseline\n

    \n
    bottom
    \n
    \n

    The default, equivalent to vertical-align: unset or vertical-align: initial\n

    \n
    left
    \n
    \n

    Equivalent to float: left\n

    \n
    right
    \n
    \n

    Equivalent to float: right\n

    \n
    " }, "alt": { "url": "$MDN_URL$/web/html/reference/elements/img#alt", @@ -5393,8 +5437,8 @@ "attributionsrc": { "url": "$MDN_URL$/web/html/reference/elements/img#attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -5405,7 +5449,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the image request.\n

    On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register an image-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    The corresponding source or trigger event is set off once the browser receives the response containing the image file.\n

    \n

    Note:\nSee the Attribution Reporting API for more details.\n

    \n

    There are two versions of this attribute that you can set:\n

    \n
    \n```html\n```\n
    \n

    This is useful in cases where the requested resource is not on a server you control, or you just want to handle registering the attribution source on a different server. In this case, you can specify one or more URLs as the value of attributionsrc. When the resource request occurs the Attribution-Reporting-Eligible header will be sent to the URL(s) specified in attributionSrc in addition to the resource origin. These URLs can then respond with a Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header as appropriate to complete registration.\n

    \n

    Note:\nSpecifying multiple URLs means that multiple attribution sources can be registered on the same feature. You might for example have different campaigns that you are trying to measure the success of, which involve generating different reports on different data.\n

    " + "doc": "Specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the image request.\n

    On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register an image-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    The corresponding source or trigger event is set off once the browser receives the response containing the image file.\n

    \n

    Note:\nSee the Attribution Reporting API for more details.\n

    \n

    There are two versions of this attribute that you can set:\n

    \n
    \n```html\n```\n
    \n

    This is useful in cases where the requested resource is not on a server you control, or you just want to handle registering the attribution source on a different server. In this case, you can specify one or more URLs as the value of attributionsrc. When the resource request occurs the Attribution-Reporting-Eligible header will be sent to the URL(s) specified in attributionSrc in addition to the resource origin. These URLs can then respond with an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header as appropriate to complete registration.\n

    \n

    Note:\nSpecifying multiple URLs means that multiple attribution sources can be registered on the same feature. You might for example have different campaigns that you are trying to measure the success of, which involve generating different reports on different data.\n

    " }, "border": { "url": "$MDN_URL$/web/html/reference/elements/img#border", @@ -5426,7 +5470,7 @@ "baseline": { "level": "NONE" }, - "doc": "The width of a border around the image. Use the border CSS property instead." + "doc": "The width of a border around the image. Use the border CSS property instead." }, "crossorigin": { "url": "$MDN_URL$/web/html/reference/elements/img#crossorigin", @@ -5467,8 +5511,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "This attribute provides a hint to the browser as to whether it should perform image decoding along with rendering the other DOM content in a single presentation step that looks more \"correct\" (sync), or render and present the other DOM content first and then decode the image and present it later (async). In practice, async means that the next paint does not wait for the image to decode.\n

    It is often difficult to perceive any noticeable effect when using decoding on static <img> elements. They'll likely be initially rendered as empty images while the image files are fetched (either from the network or from the cache) and then handled independently anyway, so the \"syncing\" of content updates is less apparent. However, the blocking of rendering while decoding happens, while often quite small, can be measured — even if it is difficult to observe with the human eye. See What does the image decoding attribute actually do? for a more detailed analysis (tunetheweb.com, 2023).\n

    Using different decoding types can result in more noticeable differences when dynamically inserting <img> elements into the DOM via JavaScript — see HTMLImageElement.decoding for more details.\n

    Allowed values:\n

    \n
    sync
    \n
    \n

    Decode the image synchronously along with rendering the other DOM content, and present everything together.\n

    \n
    async
    \n
    \n

    Decode the image asynchronously, after rendering and presenting the other DOM content.\n

    \n
    auto
    \n
    \n

    No preference for the decoding mode; the browser decides what is best for the user. This is the default value.\n

    \n
    " }, @@ -5495,7 +5539,7 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "Provides a hint of the relative priority to use when fetching the image.\nAllowed values:\n
    \n
    high
    \n
    \n

    Fetch the image at a high priority relative to other images.\n

    \n
    low
    \n
    \n

    Fetch the image at a low priority relative to other images.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    \n

    See HTMLImageElement.fetchPriority for more information." + "doc": "Provides a hint of the relative priority to use when fetching the image. Allowed values:\n

    \n
    high
    \n
    \n

    Fetch the image at a high priority relative to other images.\n

    \n
    low
    \n
    \n

    Fetch the image at a low priority relative to other images.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    " }, "height": { "url": "$MDN_URL$/web/html/reference/elements/img#height", @@ -5538,7 +5582,7 @@ "baseline": { "level": "NONE" }, - "doc": "The number of pixels of white space on the left and right of the image. Use the margin CSS property instead." + "doc": "The number of pixels of white space on the left and right of the image. Use the margin CSS property instead." }, "ismap": { "url": "$MDN_URL$/web/html/reference/elements/img#ismap", @@ -5582,7 +5626,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "Indicates how the browser should load the image:\n
    \n
    eager
    \n
    \n

    Loads the image immediately, regardless of whether or not the image is currently within the visible viewport (this is the default value).\n

    \n
    lazy
    \n
    \n

    Defers loading the image until it reaches a calculated distance from the viewport, as defined by the browser. The intent is to avoid the network and storage bandwidth needed to handle the image until it's reasonably certain that it will be needed. This generally improves the performance of the content in most typical use cases.\n

    \n
    \n
    \n

    Note:\nLoading is only deferred when JavaScript is enabled. This is an anti-tracking measure, because if a user agent supported lazy loading when scripting is disabled, it would still be possible for a site to track a user's approximate scroll position throughout a session, by strategically placing images in a page's markup such that a server can track how many images are requested and when.\n

    \n
    \n

    Note:\nImages with loading set to lazy will never be loaded if they do not intersect a visible part of an element, even if loading them would change that as unloaded images have a width and height of 0. Putting width and height on lazy-loaded images fixes this issue and is a best practice, recommended by the specification. Doing so also helps prevent layout shifts.\n

    " + "doc": "Indicates how the browser should load the image:\n
    \n
    eager
    \n
    \n

    Loads the image immediately, regardless of whether or not the image is currently within the visible viewport (this is the default value).\n

    \n
    lazy
    \n
    \n

    Defers loading the image until it reaches a calculated distance from the viewport, as defined by the browser. The intent is to avoid the network and storage bandwidth needed to handle the image until it's reasonably certain that it will be needed. This generally improves the performance of the content in most typical use cases.\n

    \n
    \n

    While explicit width and height attributes are recommended for all images to avoid layout shift, they are especially important for lazy-loaded ones. Lazy-loaded images will never be loaded if they do not intersect a visible part of an element, even if loading them would change that, because unloaded images have a width and height of 0. It creates an even more disruptive user experience when the content visible in the viewport reflows in the middle of reading it.\n

    The load event is fired after eager-loaded images have been fetched and processed, but before lazy-laded ones are, even if the lazy-loaded images are located within the visual viewport immediately upon initial page load. These images are still loaded as soon as layout completes; they just don't affect the timing of the load event. That means that when load fires, it's possible that any lazy-loaded images located in the visual viewport may not yet be visible.\n

    Loading is only deferred when JavaScript is enabled. This is an anti-tracking measure, because if a user agent supported lazy loading when scripting is disabled, it would still be possible for a site to track a user's approximate scroll position throughout a session, by strategically placing images in a page's markup such that a server can track how many images are requested and when." }, "longdesc": { "url": "$MDN_URL$/web/html/reference/elements/img#longdesc", @@ -5668,7 +5712,7 @@ "lowDate": "2016-03-21", "highDate": "2018-09-21" }, - "doc": "One or more values separated by commas, which can be source sizes or the auto keyword.\n

    A source size consists of:\n

      \n
    1. A media condition, omitted for the last item in the list.
    2. \n
    3. A source size value.
    4. \n
    \n

    Media conditions describe properties of the viewport, not the image. For example, (height <= 500px) 1000px proposes using an image source of 1000px width if the viewport height is 500px or less. Because a source size descriptor specifies the width to use for the image during layout, the media condition is typically (but not necessarily) based on the width.\n

    Source size values specify the intended display size of the image. User agents use the current source size to select one of the sources supplied by the srcset attribute, when those sources are described using width (w) descriptors. The selected source size affects the intrinsic size of the image (the image's display size if no CSS styling is applied). If the srcset attribute is absent, or contains no values with a width descriptor, then the sizes attribute has no effect.\n

    A source size value can be any non-negative length. It must not use CSS functions other than the math functions. Units are interpreted in the same way as media queries, meaning that all relative length units are relative to the document root rather than the <img> element. For example, an em value is relative to the root font size, not the font size of the image. Percentage values are not allowed.\n

    The auto keyword can replace the whole list of sizes or the first entry in the list. It is only valid when combined with loading=\"lazy\", and resolves to the concrete size of the image. Since the intrinsic size of the image is not yet known, width and height attributes (or CSS equivalents) should also be specified to prevent the browser from assuming the default image width of 300px.\nFor better backward compatibility with browsers that do not support auto, you can include fallback sizes after auto in the sizes attribute:\n

    \n```html\n```\n
    " + "doc": "One or more values separated by commas, which can be source sizes or the auto keyword. The spec requires that the sizes attribute to only be present when srcset uses width descriptors.\n

    A source size consists of:\n

      \n
    1. A media condition, omitted for the last item in the list.
    2. \n
    3. A source size value.
    4. \n
    \n

    Media conditions describe properties of the viewport, not the image. For example, (height <= 500px) 1000px proposes using an image source of 1000px width if the viewport height is 500px or less. Because a source size descriptor specifies the width to use for the image during layout, the media condition is typically (but not necessarily) based on the width.\n

    Source size values specify the intended display size of the image. User agents use the current source size to select one of the sources supplied by the srcset attribute, when those sources are described using width (w) descriptors. The selected source size affects the intrinsic size of the image (the image's display size if no CSS styling is applied).\n

    A source size value can be any non-negative length. It must not use CSS functions other than the math functions. Units are interpreted in the same way as media queries, meaning that all relative length units are relative to the document root rather than the <img> element. For example, an em value is relative to the root font size, not the font size of the image. Percentage values are not allowed. If the sizes attribute is not provided, it has a default value of 100vw (the viewport width).\n

    The auto keyword can replace the whole list of sizes or the first entry in the list. It is only valid when combined with loading=\"lazy\", and resolves to the concrete size of the image. Since the intrinsic size of the image is not yet known, width and height attributes (or CSS equivalents) should also be specified to prevent the browser from assuming the default image width of 300px.\nFor better backward compatibility with browsers that do not support auto, you can include fallback sizes after auto in the sizes attribute:\n

    \n```html\n```\n
    " }, "src": { "url": "$MDN_URL$/web/html/reference/elements/img#src", @@ -5690,7 +5734,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The image URL. Mandatory for the <img> element. On browsers supporting srcset, src is treated like a candidate image with a pixel density descriptor 1x, unless an image with this pixel density descriptor is already defined in srcset, or unless srcset contains w descriptors." + "doc": "The image URL. At least one of src and srcset is required for an <img> element. If srcset is specified, src is used in one of two ways:\n" }, "srcset": { "url": "$MDN_URL$/web/html/reference/elements/img#srcset", @@ -5712,7 +5756,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "One or more strings separated by commas, indicating possible image sources for the user agent to use. Each string is composed of:\n
      \n
    1. A URL to an image
    2. \n
    3. Optionally, whitespace followed by one of:\n
        \n
      • A width descriptor (a positive integer directly followed by w). The width descriptor is divided by the source size given in the sizes attribute to calculate the effective pixel density.
      • \n
      • A pixel density descriptor (a positive floating point number directly followed by x).
      • \n
      \n
    4. \n
    \n

    If no descriptor is specified, the source is assigned the default descriptor of 1x.\n

    It is incorrect to mix width descriptors and pixel density descriptors in the same srcset attribute. Duplicate descriptors (for instance, two sources in the same srcset which are both described with 2x) are also invalid.\n

    If the srcset attribute uses width descriptors, the sizes attribute must also be present, or the srcset itself will be ignored.\n

    The user agent selects any of the available sources at its discretion. This provides them with significant leeway to tailor their selection based on things like user preferences or bandwidth conditions. See our Responsive images tutorial for an example." + "doc": "One or more strings separated by commas, indicating possible image sources for the user agent to use.\n

    Each string is composed of:\n

      \n
    1. A URL to an image
    2. \n
    3. Optionally, whitespace followed by one of:\n
        \n
      • A width descriptor (a positive integer directly followed by w). It must match the intrinsic width of the referenced image. The width descriptor is divided by the source size given in the sizes attribute to calculate the effective pixel density. For example, to provide an image resource to be used when the renderer needs a 450 pixel wide image, use the width descriptor 450w. When a srcset contains \"w\" descriptors, the browser uses those descriptors together with the sizes attribute to pick a resource.
      • \n
      • A pixel density descriptor (a positive floating point number directly followed by x). It specifies the condition in which the corresponding image resource should be used as the display's pixel density. For example, to provide an image resource to be used when the pixel density is double the standard density, use the pixel density descriptor 2x or 2.0x.
      • \n
      \n
    4. \n
    \n

    If no descriptor is specified, the source is assigned the default descriptor of 1x. It is incorrect to mix width descriptors and pixel density descriptors in the same srcset attribute. Duplicate descriptors (for instance, two sources in the same srcset which are both described with 2x) are also invalid.\n

    Space characters, other than the whitespace separating the URL and the corresponding condition descriptor, are ignored; this includes both leading and trailing space, as well as space before or after each comma. However, if an image candidate string contains no descriptors and no whitespace after the URL, the following image candidate string, if there is one, must begin with one or more whitespace, or the comma will be considered part of the URL.\n

    When the <img> element's srcset uses x descriptors, browsers also consider the URL in the src attribute (if present) as a candidate, and assign it a default descriptor of 1x. On the other hand, if the srcset attribute uses width descriptors, src is not considered, and the sizes attribute is used instead.\n

    The user agent selects any of the available sources at its discretion. This provides them with significant leeway to tailor their selection based on things like user preferences or bandwidth conditions. See our Responsive images tutorial for an example." }, "usemap": { "url": "$MDN_URL$/web/html/reference/elements/img#usemap", @@ -5755,7 +5799,7 @@ "baseline": { "level": "NONE" }, - "doc": "The number of pixels of white space above and below the image. Use the margin CSS property instead." + "doc": "The number of pixels of white space above and below the image. Use the margin CSS property instead." }, "width": { "url": "$MDN_URL$/web/html/reference/elements/img#width", @@ -5971,7 +6015,7 @@ "baseline": { "level": "NONE" }, - "doc": "Valid for the color input type only, the colorspace attribute specifies the color space that is used by the type=\"color\" input. Possible enumerated values are:\n

    " + "doc": "Valid for the color input type only, the colorspace attribute specifies the color space that is used by the type=\"color\" input. Possible enumerated values are:\n" }, "dirname": { "url": "$MDN_URL$/web/html/reference/elements/input#dirname", @@ -6276,13 +6320,6 @@ }, "mozactionhint": { "url": "$MDN_URL$/web/html/reference/elements/input#mozactionhint", - "status": [ - "Deprecated" - ], - "compatibility": {}, - "baseline": { - "level": "NONE" - }, "doc": "A string indicating the type of action that will be taken when the user\npresses the Enter or Return key while editing the\nfield; this is used to determine an appropriate label for that key on a\nvirtual keyboard. Since this attribute is deprecated, use enterkeyhint instead." }, "multiple": { @@ -6331,7 +6368,7 @@ }, "orient": { "url": "$MDN_URL$/web/html/reference/elements/input#orient", - "doc": "Sets the orientation of the range slider.\nFirefox only\n.

    Similar to the -moz-orient non-standard CSS property impacting the <progress> and <meter> elements, the orient attribute defines the orientation of the range slider. Values include horizontal, meaning the range is rendered horizontally, and vertical, where the range is rendered vertically. See Creating vertical form controls for a modern approach to creating vertical form controls." + "doc": "Sets the orientation of the range slider.\nFirefox only\n.

    Similar to the -moz-orient non-standard CSS property impacting the <progress> and <meter> elements, the orient attribute defines the orientation of the range slider. Values include horizontal, meaning the range is rendered horizontally, and vertical, where the range is rendered vertically. See Creating vertical form controls for a modern approach to creating vertical form controls." }, "pattern": { "url": "$MDN_URL$/web/html/reference/elements/input#pattern", @@ -6396,7 +6433,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "Turns an <input type=\"button\"> element into a popover control button; takes the ID of the popover element to control as its value. See the Popover API landing page for more details. Establishing a relationship between a popover and its invoker button using the popovertarget attribute has two additional useful effects:\n

    " + "doc": "Turns an <input type=\"button\"> element into a popover control button; takes the ID of the popover element to control as its value. See the Popover API landing page for more details. Establishing a relationship between a popover and its invoker button using the popovertarget attribute has two additional useful effects:\n" }, "popovertargetaction": { "url": "$MDN_URL$/web/html/reference/elements/input#popovertargetaction", @@ -6487,7 +6524,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "Valid for email, password, tel, url, and text, the size attribute specifies how much of the input is shown. Basically creates same result as setting CSS width property with a few specialties. The actual unit of the value depends on the input type. For password and text, it is a number of characters (or em units) with a default value of 20, and for others, it is pixels (or px units). CSS width takes precedence over the size attribute." + "doc": "Valid for email, password, tel, url, and text, the size attribute specifies how much of the input is shown. Basically creates same result as setting CSS width property with a few specialties. The actual unit of the value depends on the input type. For password and text, it is a number of characters (or em units) with a default value of 20, and for others, it is pixels (or px units). CSS width takes precedence over the size attribute." }, "src": { "url": "$MDN_URL$/web/html/reference/elements/input#src", @@ -6533,6 +6570,20 @@ }, "doc": "Valid for date, month, week, time, datetime-local, number, and range, the step attribute is a number that specifies the granularity that the value must adhere to. Only values which are a whole number of steps from the step base are valid. The step base is min if specified, value otherwise, or 0 if neither is provided (except for week, which has a default step base of −259,200,000, representing the start of week 1970-W01).\n

    If not explicitly included:\n

    \n

    The value must be a positive number—integer or float—or the special value any, which means no stepping is implied, and any value is allowed (barring other constraints, such as min and max).\n

    For example, if you have <input type=\"number\" min=\"10\" step=\"2\">, then any even integer, 10 or greater, is valid. If omitted, <input type=\"number\">, any integer is valid, but floats (like 4.2) are not valid, because step defaults to 1. For 4.2 to be valid, step would have had to be set to any, 0.1, 0.2, or the min value would have had to be a number ending in .2, such as <input type=\"number\" min=\"-5.2\">.\n

    \n

    Note:\nWhen the data entered by the user doesn't adhere to the stepping configuration, the value is considered invalid in constraint validation and will match the :invalid pseudoclass.\n

    \n

    See Client-side validation for more information." }, + "switch": { + "url": "$MDN_URL$/web/html/reference/elements/input#switch", + "status": [ + "Experimental" + ], + "compatibility": { + "Safari": "17.4", + "SafariIOS": "17.4" + }, + "baseline": { + "level": "NONE" + }, + "doc": "Valid for checkbox input only, switch is a Boolean attribute that indicates whether the checkbox input should be rendered as a switch.\n

    \n

    Note:\nThis attribute is still experimental and has limited browser support. The attribute is ignored on unsupported browsers.\n

    " + }, "tabindex": { "url": "$MDN_URL$/web/html/reference/elements/input#tabindex", "doc": "Global attribute valid for all elements, including all the input types, an integer attribute indicating if the element can take input focus (is focusable), if it should participate to sequential keyboard navigation. As all input types except for input of type hidden are focusable, this attribute should not be used on form controls, because doing so would require the management of the focus order for all elements within the document with the risk of harming usability and accessibility if done incorrectly." @@ -6582,7 +6633,8 @@ "SafariIOS": "18.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-07-22" }, "doc": "A Boolean indicating whether to only allow the user to choose a directory (or directories, if\nmultiple\nis also present)

    The Boolean webkitdirectory attribute, if present, indicates that only directories should be available to be selected by the user in the file picker interface. See HTMLInputElement.webkitdirectory for additional details and examples.\n

    Though originally implemented only for WebKit-based browsers, webkitdirectory is also usable in Microsoft Edge as well as Firefox 50 and later. However, even though it has relatively broad support, it is still not standard and should not be used unless you have no alternative." }, @@ -6858,7 +6910,7 @@ "baseline": { "level": "NONE" }, - "doc": "This character attribute indicates the numbering type:\n

    \n

    This type overrides the one used by its parent <ol> element, if any.\n

    \n

    Note:\nThis attribute has been deprecated; use the CSS list-style-type property instead.\n

    " + "doc": "This character attribute indicates the numbering type:\n\n

    This type overrides the one used by its parent <ol> element, if any.\n

    \n

    Note:\nThis attribute has been deprecated; use the CSS list-style-type property instead.\n

    " }, "value": { "url": "$MDN_URL$/web/html/reference/elements/li#value", @@ -7039,7 +7091,7 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "Provides a hint of the relative priority to use when fetching a resource of a particular type.\nAllowed values:\n
    \n
    high
    \n
    \n

    Fetch the resource at a high priority relative to other resources of the same type.\n

    \n
    low
    \n
    \n

    Fetch the resource at a low priority relative to other resources of the same type.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    \n

    See HTMLLinkElement.fetchPriority for more information." + "doc": "Provides a hint of the relative priority to use when fetching a resource of a particular type. Allowed values:\n

    \n
    high
    \n
    \n

    Fetch the resource at a high priority relative to other resources of the same type.\n

    \n
    low
    \n
    \n

    Fetch the resource at a low priority relative to other resources of the same type.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    " }, "href": { "url": "$MDN_URL$/web/html/reference/elements/link#href", @@ -7147,7 +7199,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "Contains inline metadata — a base64-encoded cryptographic hash of the resource (file) you're telling the browser to fetch.\nThe browser can use this to verify that the fetched resource has been delivered without unexpected manipulation.\nThe attribute must only be specified when the rel attribute is specified to stylesheet, preload, or modulepreload.\nSee Subresource Integrity." + "doc": "Contains inline metadata — a base64-encoded cryptographic hash of the resource (file) you're telling the browser to fetch.\nThe browser can use this to verify that the fetched resource has been delivered without unexpected manipulation.\nThe attribute must only be specified when the rel attribute is specified to stylesheet, preload, or modulepreload.\nSee Subresource Integrity." }, "media": { "url": "$MDN_URL$/web/html/reference/elements/link#media", @@ -7169,7 +7221,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "This attribute specifies the media that the linked resource applies to. Its value must be a media type / media query.\nThis attribute is mainly useful when linking to external stylesheets — it allows the user agent to pick the best adapted one for the device it runs on." + "doc": "This attribute specifies the media that the linked resource applies to. Its value must be a media type / media query.\nThis attribute is mainly useful when linking to external stylesheets — it allows the user agent to pick the best adapted one for the device it runs on." }, "referrerpolicy": { "url": "$MDN_URL$/web/html/reference/elements/link#referrerpolicy", @@ -7191,7 +7243,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "A string indicating which referrer to use when fetching the resource:\n" + "doc": "A string indicating which referrer to use when fetching the resource. For detailed explanations and examples of each policy, see the Referrer-Policy header documentation.\n" }, "rel": { "url": "$MDN_URL$/web/html/reference/elements/link#rel", @@ -7242,19 +7294,19 @@ "StandardTrack" ], "compatibility": { - "Chrome": "80", - "ChromeAndroid": "80", - "Edge": "80", - "Firefox": "72", - "FirefoxAndroid": "79", + "Chrome": "15", + "ChromeAndroid": "18", + "Edge": "79", + "Firefox": "31", + "FirefoxAndroid": "31", "Opera": "15", "Safari": "6", "SafariIOS": "6" }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-07-28", - "highDate": "≤2023-01-28" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "This attribute defines the sizes of the icons for visual media contained in the resource.\nIt must be present only if the rel contains a value of icon or a non-standard type such as Apple's apple-touch-icon.\nIt may have the following values:\n\n
    \n

    Note:\nMost icon formats are only able to store one single icon; therefore, most of the time, the sizes attribute contains only one entry.\nMicrosoft's ICO format and Apple's ICNS format can store multiple icon sizes in a single file. ICO has better browser support, so you should use this format if cross-browser support is a concern.\n

    " }, @@ -7440,7 +7492,7 @@ "Safari": "1.2", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The <marquee> HTML element is used to insert a scrolling area of text. You can control what happens when the text reaches the edges of its content area using its attributes.\n

    The HTML <marquee> element is deprecated and its use is strongly discouraged. If you must create the effect of scrolling text or continuous elements, consider using CSS animations with CSS transforms instead of <marquee> elements to smoothly animate content. Additionally, include the prefers-reduced-motion CSS @media query to stop the animation based on user preference, thereby improving user experience and accessibility.", + "doc": "

    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.

    \n

    The <marquee> HTML element is used to insert a scrolling area of text. You can control what happens when the text reaches the edges of its content area using its attributes.\n

    The HTML <marquee> element is deprecated and its use is strongly discouraged. If you must create the effect of scrolling text or continuous elements, consider using CSS animations with CSS transforms instead of <marquee> elements to smoothly animate content. Additionally, include the prefers-reduced-motion CSS @media query to stop the animation based on user preference, thereby improving user experience and accessibility.", "details": { "DOM interface": "HTMLMarqueeElement\n" }, @@ -7711,7 +7763,7 @@ "attrs": { "compact": { "url": "$MDN_URL$/web/html/reference/elements/menu#compact", - "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." + "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." } } }, @@ -7796,7 +7848,7 @@ }, "media": { "url": "$MDN_URL$/web/html/reference/elements/meta#media", - "doc": "The media attribute defines which media the theme color defined in the content attribute should be applied to.\nIts value is a media query, which defaults to all if the attribute is missing.\nThis attribute is only relevant when the element's name attribute is set to theme-color.\nOtherwise, it has no effect, and should not be included." + "doc": "The media attribute defines which media the theme color defined in the content attribute should be applied to.\nIts value is a media query, which defaults to all if the attribute is missing.\nThis attribute is only relevant when the element's name attribute is set to theme-color.\nOtherwise, it has no effect, and should not be included." }, "name": { "url": "$MDN_URL$/web/html/reference/elements/meta#name", @@ -8054,7 +8106,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <nobr> HTML element prevents the text it contains from automatically wrapping across multiple lines, potentially resulting in the user having to scroll horizontally to see the entire width of the text.\n

    \n

    Warning:\nAlthough this element is widely supported, it was never standard HTML, so you shouldn't use it. Instead, use the CSS property white-space like this:\n

    \n
    \n```html\nLong line with no breaks\n```\n
    \n
    \n```css\n.nobr {\n  white-space: nowrap;\n}\n```\n
    " + "doc": "

    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.

    \n

    The <nobr> HTML element prevents the text it contains from automatically wrapping across multiple lines, potentially resulting in the user having to scroll horizontally to see the entire width of the text.\n

    \n

    Warning:\nAlthough this element is widely supported, it was never standard HTML, so you shouldn't use it. Instead, use the CSS property white-space like this:\n

    \n
    \n```html\nLong line with no breaks\n```\n
    \n
    \n```css\n.nobr {\n  white-space: nowrap;\n}\n```\n
    " }, "noembed": { "url": "$MDN_URL$/web/html/reference/elements/noembed", @@ -8223,15 +8275,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "3", - "SafariIOS": "2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -8343,7 +8387,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height of the displayed resource, as in <integer> in CSS pixels." + "doc": "The height of the displayed resource, as in <integer> in CSS pixels." }, "name": { "url": "$MDN_URL$/web/html/reference/elements/object#name", @@ -8451,7 +8495,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width of the display resource, as in <integer> in CSS pixels." + "doc": "The width of the display resource, as in <integer> in CSS pixels." } } }, @@ -8504,7 +8548,7 @@ "baseline": { "level": "NONE" }, - "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." + "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." }, "reversed": { "url": "$MDN_URL$/web/html/reference/elements/ol#reversed", @@ -8523,8 +8567,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "This Boolean attribute specifies that the list's items are in reverse order. Items will be numbered from high to low." }, @@ -8570,7 +8614,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "Sets the numbering type:\n\n

    The specified type is used for the entire list unless a different type attribute is used on an enclosed <li> element.\n

    \n

    Note:\nUnless the type of the list number matters (like legal or technical documents where items are referenced by their number/letter), use the CSS list-style-type property instead.\n

    " + "doc": "Sets the numbering type:\n\n

    The specified type is used for the entire list unless a different type attribute is used on an enclosed <li> element.\n

    \n

    Note:\nUnless the type of the list number matters (like legal or technical documents where items are referenced by their number/letter), use the CSS list-style-type property instead.\n

    " } } }, @@ -8617,13 +8661,10 @@ "Firefox": "1", "FirefoxAndroid": "4", "Opera": "15", - "Safari": "4", - "SafariIOS": "3.2" + "Safari": "7" }, "baseline": { - "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "level": "NONE" }, "doc": "If this Boolean attribute is set, none of the items in this option group is selectable. Often browsers grey out such control and it won't receive any browsing events, like mouse clicks or focus-related ones." }, @@ -9062,7 +9103,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <plaintext> HTML element renders everything following the start tag as raw text, ignoring any following HTML. There is no closing tag, since everything after it is considered raw text.\n

    \n

    Warning:\nDo not use this element.\n

      \n
    • <plaintext> is deprecated since HTML 2, and not all browsers implemented it. Browsers that did implement it didn't do so consistently.
    • \n
    • <plaintext> is obsolete; browsers that accept it may instead treat it as a <pre> element that still interprets HTML within.
    • \n
    • If <plaintext> is the first element on the page (other than any non-displayed elements, like <head>), do not use HTML at all. Instead serve a text file with the text/plain MIME-type.
    • \n
    • Instead of <plaintext>, use the <pre> element or, if semantically accurate (such as for inline text), the <code> element. Escape any <, > and & characters, to prevent browsers inadvertently parsing the element content as HTML.
    • \n
    • A monospaced font can be applied to any HTML element via a CSS font-family style with the monospace generic value.
    • \n
    \n
    " + "doc": "

    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.

    \n

    The <plaintext> HTML element renders everything following the start tag as raw text, ignoring any following HTML. There is no closing tag, since everything after it is considered raw text.\n

    \n

    Warning:\nDo not use this element.\n

      \n
    • <plaintext> is deprecated since HTML 2, and not all browsers implemented it. Browsers that did implement it didn't do so consistently.
    • \n
    • <plaintext> is obsolete; browsers that accept it may instead treat it as a <pre> element that still interprets HTML within.
    • \n
    • If <plaintext> is the first element on the page (other than any non-displayed elements, like <head>), do not use HTML at all. Instead serve a text file with the text/plain MIME-type.
    • \n
    • Instead of <plaintext>, use the <pre> element or, if semantically accurate (such as for inline text), the <code> element. Escape any <, > and & characters, to prevent browsers inadvertently parsing the element content as HTML.
    • \n
    • A monospaced font can be applied to any HTML element via a CSS font-family style with the monospace generic value.
    • \n
    \n
    " }, "pre": { "url": "$MDN_URL$/web/html/reference/elements/pre", @@ -9084,7 +9125,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <pre> HTML element represents preformatted text which is to be presented exactly as written in the HTML file. The text is typically rendered using a non-proportional, or monospaced font.\n

    Whitespace inside this element is displayed as written, with one exception. If one or more leading newline characters are included immediately following the opening <pre> tag, the first newline character is stripped.\n

    <pre> elements' text content is parsed as HTML, so if you want to ensure that your text content stays as plain text, some syntax characters, such as <, may need to be escaped using their respective character references. See escaping ambiguous characters for more information.\n

    <pre> elements commonly contain <code>, <samp>, and <kbd> elements, to represent computer code, computer output, and user input, respectively.\n

    By default, <pre> is a block-level element, i.e., its default display value is block.", + "doc": "The <pre> HTML element represents preformatted text which is to be presented exactly as written in the HTML file. The text is typically rendered using a non-proportional, or monospaced font.\n

    Whitespace inside this element is displayed as written, with one exception. If one or more leading newline characters are included immediately following the opening <pre> tag, the first newline character is stripped. This transformation is done by the HTML parser and does not apply when using XHTML.\n

    <pre> elements' text content is parsed as HTML, so if you want to ensure that your text content stays as plain text, some syntax characters, such as <, may need to be escaped using their respective character references. See escaping ambiguous characters for more information.\n

    <pre> elements commonly contain <code>, <samp>, and <kbd> elements, to represent computer code, computer output, and user input, respectively.\n

    By default, <pre> is a block-level element, i.e., its default display value is block.", "details": { "Content categories": "Flow content\n, palpable content.\n", "Permitted content": "Phrasing content\n.\n", @@ -9113,11 +9154,11 @@ "baseline": { "level": "NONE" }, - "doc": "Contains the preferred count of characters that a line should have. Though technically still implemented, this attribute has no visual effect; to achieve such an effect, use CSS width instead." + "doc": "Contains the preferred count of characters that a line should have. Though technically still implemented, this attribute has no visual effect; to achieve such an effect, use CSS width instead." }, "wrap": { "url": "$MDN_URL$/web/html/reference/elements/pre#wrap", - "doc": "Is a hint indicating how the overflow must happen. In modern browser this hint is ignored and no visual effect results in its present; to achieve such an effect, use CSS white-space instead." + "doc": "Is a hint indicating how the overflow must happen. In modern browser this hint is ignored and no visual effect results in its present; to achieve such an effect, use CSS white-space instead." } } }, @@ -9384,7 +9425,7 @@ "doc": "The <ruby> HTML element represents small annotations that are rendered above, below, or next to base text, usually used for showing the pronunciation of East Asian characters. It can also be used for annotating other kinds of text, but this usage is less common.\n

    The term ruby originated as a unit of measurement used by typesetters, representing the smallest size that text can be printed on newsprint while remaining legible.", "details": { "Content categories": "Flow content\n,\nphrasing content\n, palpable content.\n", - "Permitted content": "Phrasing content\n.\n", + "Permitted content": "One or more groups, each consisting of two parts:\n

      \n
    1. The base text, which is either:\n
        \n
      • Phrasing content, but with no <ruby> elements and with no <ruby> element descendants, or
      • \n
      • A single <ruby> element that itself has no <ruby> element descendants.
      • \n
      \n
    2. \n
    3. The annotations for the base text, which is either:\n
        \n
      • One or more <rt> elements, or
      • \n
      • An <rp> element followed by one or more <rt> elements, each of which is itself followed by an <rp> element (that is, rp, rt, rp, rt, ..., rp).
      • \n
      \n
    4. \n
    \n", "Tag omission": "None, both the starting and ending tag are mandatory.\n", "Permitted parents": "Any element that accepts\nphrasing content\n.\n", "Implicit ARIA role": "No corresponding role\n", @@ -9510,8 +9551,8 @@ "attributionsrc": { "url": "$MDN_URL$/web/html/reference/elements/script#attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -9522,7 +9563,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the script resource request. On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register a JavaScript-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n
    \n

    Note:\nAlternatively, JavaScript-based attribution sources or triggers can be registered by sending a fetch() request containing the attributionReporting option (either set directly on the fetch() call or on a Request object passed into the fetch() call), or by sending an XMLHttpRequest with setAttributionReporting() invoked on the request object.\n

    \n

    There are two versions of this attribute that you can set:\n

    \n

    See the Attribution Reporting API for more details." + "doc": "Specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the script resource request. On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register a JavaScript-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    \n

    Note:\nAlternatively, JavaScript-based attribution sources or triggers can be registered by sending a fetch() request containing the attributionReporting option (either set directly on the fetch() call or on a Request object passed into the fetch() call), or by sending an XMLHttpRequest with setAttributionReporting() invoked on the request object.\n

    \n

    There are two versions of this attribute that you can set:\n

    \n

    See the Attribution Reporting API for more details." }, "blocking": { "url": "$MDN_URL$/web/html/reference/elements/script#blocking", @@ -9609,7 +9650,7 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "Provides a hint of the relative priority to use when fetching an external script.\nAllowed values:\n

    \n
    high
    \n
    \n

    Fetch the external script at a high priority relative to other external scripts.\n

    \n
    low
    \n
    \n

    Fetch the external script at a low priority relative to other external scripts.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    \n

    See HTMLScriptElement.fetchPriority for more information." + "doc": "Provides a hint of the relative priority to use when fetching an external script. Allowed values:\n

    \n
    high
    \n
    \n

    Fetch the external script at a high priority relative to other external scripts.\n

    \n
    low
    \n
    \n

    Fetch the external script at a low priority relative to other external scripts.\n

    \n
    auto
    \n
    \n

    Don't set a preference for the fetch priority.\nThis is the default.\nIt is used if no value or an invalid value is set.\n

    \n
    " }, "integrity": { "url": "$MDN_URL$/web/html/reference/elements/script#integrity", @@ -9631,7 +9672,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "This attribute contains inline metadata that a user agent can use to verify that a fetched resource has been delivered without unexpected manipulation. The attribute must not be specified when the src attribute is absent. See Subresource Integrity." + "doc": "This attribute contains inline metadata that a user agent can use to verify that a fetched resource has been delivered without unexpected manipulation. The attribute must not be specified when the src attribute is absent. See Subresource Integrity." }, "language": { "url": "$MDN_URL$/web/html/reference/elements/script#language", @@ -9661,7 +9702,7 @@ }, "nonce": { "url": "$MDN_URL$/web/html/reference/elements/script#nonce", - "doc": "A cryptographic nonce (number used once) to allow scripts in a script-src Content-Security-Policy. The server must generate a unique nonce value each time it transmits a policy. It is critical to provide a nonce that cannot be guessed as bypassing a resource's policy is otherwise trivial." + "doc": "A cryptographic nonce (number used once) to allow scripts in a script-src Content-Security-Policy. The server must generate a unique nonce value each time it transmits a policy. It is critical to provide a nonce that cannot be guessed as bypassing a resource's policy is otherwise trivial." }, "referrerpolicy": { "url": "$MDN_URL$/web/html/reference/elements/script#referrerpolicy", @@ -10164,7 +10205,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "Specifies the media query for the resource's intended media." + "doc": "Specifies the media query for the resource's intended media." }, "sizes": { "url": "$MDN_URL$/web/html/reference/elements/source#sizes", @@ -10381,7 +10422,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <style> HTML element contains style information for a document, or part of a document. It contains CSS, which is applied to the contents of the document containing the <style> element.\n

    The <style> element must be included inside the <head> of the document. In general, it is better to put your styles in external stylesheets and apply them using <link> elements.\n

    If you include multiple <style> and <link> elements in your document, they will be applied to the DOM in the order they are included in the document — make sure you include them in the correct order, to avoid unexpected cascade issues.\n

    In the same manner as <link> elements, <style> elements can include media attributes that contain media queries, allowing you to selectively apply internal stylesheets to your document depending on media features such as viewport width.", + "doc": "The <style> HTML element contains style information for a document, or part of a document. It contains CSS, which is applied to the contents of the document containing the <style> element.\n

    The <style> element must be included inside the <head> of the document. In general, it is better to put your styles in external stylesheets and apply them using <link> elements.\n

    If you include multiple <style> and <link> elements in your document, they will be applied to the DOM in the order they are included in the document — make sure you include them in the correct order, to avoid unexpected cascade issues.\n

    In the same manner as <link> elements, <style> elements can include media attributes that contain media queries, allowing you to selectively apply internal stylesheets to your document depending on media features such as viewport width.", "details": { "Content categories": "Metadata content\n.\n", "Permitted content": "Text content matching the\ntype\nattribute, that is\ntext/css\n.\n", @@ -10408,7 +10449,7 @@ "baseline": { "level": "NONE" }, - "doc": "This attribute explicitly indicates that certain operations should be blocked on the fetching of critical subresources and the application of the stylesheet to the document. @import-ed stylesheets are generally considered as critical subresources, whereas background-image and fonts are not. The operations that are to be blocked must be a space-separated list of blocking tokens listed below. Currently there is only one token:\n

    \n
    \n

    Note:\nOnly style elements in the document's <head> can possibly block rendering. By default, a style element in the <head> blocks rendering when the browser discovers it during parsing. If such a style element is added dynamically via script, you must additionally set blocking = \"render\" for it to block rendering.\n

    " + "doc": "This attribute explicitly indicates that certain operations should be blocked on the fetching of critical subresources and the application of the stylesheet to the document. @import-ed stylesheets are generally considered as critical subresources, whereas background-image and fonts are not. The operations that are to be blocked must be a space-separated list of blocking tokens listed below. Currently there is only one token:\n\n
    \n

    Note:\nOnly style elements in the document's <head> can possibly block rendering. By default, a style element in the <head> blocks rendering when the browser discovers it during parsing. If such a style element is added dynamically via script, you must additionally set blocking = \"render\" for it to block rendering.\n

    " }, "media": { "url": "$MDN_URL$/web/html/reference/elements/style#media", @@ -10430,11 +10471,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "This attribute defines which media the style should be applied to. Its value is a media query, which defaults to all if the attribute is missing." + "doc": "This attribute defines which media the style should be applied to. Its value is a media query, which defaults to all if the attribute is missing." }, "nonce": { "url": "$MDN_URL$/web/html/reference/elements/style#nonce", - "doc": "A cryptographic nonce (number used once) used to allow inline styles in a style-src Content-Security-Policy. The server must generate a unique nonce value each time it transmits a policy. It is critical to provide a nonce that cannot be guessed as bypassing a resource's policy is otherwise trivial." + "doc": "A cryptographic nonce (number used once) used to allow inline styles in a style-src Content-Security-Policy. The server must generate a unique nonce value each time it transmits a policy. It is critical to provide a nonce that cannot be guessed as bypassing a resource's policy is otherwise trivial." }, "title": { "url": "$MDN_URL$/web/html/reference/elements/style#title", @@ -10606,7 +10647,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of the table within its parent element. The possible enumerated values are left, center, and right. Use the margin-inline-start and margin-inline-end CSS properties instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of the table within its parent element. The possible enumerated values are left, center, and right. Use the margin-inline-start and margin-inline-end CSS properties instead, as this attribute is deprecated." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/table#bgcolor", @@ -10627,7 +10668,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of the table. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of the table. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "border": { "url": "$MDN_URL$/web/html/reference/elements/table#border", @@ -10648,7 +10689,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines, as a non-negative integer value (in pixels), the size of the frame surrounding the table. If set to 0, the frame attribute is set to void. Use the border CSS property instead, as this attribute is deprecated." + "doc": "Defines, as a non-negative integer value (in pixels), the size of the frame surrounding the table. If set to 0, the frame attribute is set to void. Use the border CSS property instead, as this attribute is deprecated." }, "cellpadding": { "url": "$MDN_URL$/web/html/reference/elements/table#cellpadding", @@ -10669,7 +10710,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the space between the content of a cell and its border. This attribute is obsolete: instead of using it, apply the padding CSS property to the <th> and <td> elements." + "doc": "Defines the space between the content of a cell and its border. This attribute is obsolete: instead of using it, apply the padding CSS property to the <th> and <td> elements." }, "cellspacing": { "url": "$MDN_URL$/web/html/reference/elements/table#cellspacing", @@ -10690,7 +10731,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the size of the space between two cells. This attribute is obsolete: instead of using it, set the border-spacing CSS property on the <table> element. Note that this has no effect if the <table> element's border-collapse CSS property is set to collapse." + "doc": "Defines the size of the space between two cells. This attribute is obsolete: instead of using it, set the border-spacing CSS property on the <table> element. Note that this has no effect if the <table> element's border-collapse CSS property is set to collapse." }, "frame": { "url": "$MDN_URL$/web/html/reference/elements/table#frame", @@ -10711,7 +10752,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines which side of the frame surrounding the table must be displayed. The possible enumerated values are void, above, below, hsides, vsides, lhs, rhs, box and border. Use the border-style and border-width CSS properties instead, as this attribute is deprecated." + "doc": "Defines which side of the frame surrounding the table must be displayed. The possible enumerated values are void, above, below, hsides, vsides, lhs, rhs, box and border. Use the border-style and border-width CSS properties instead, as this attribute is deprecated." }, "rules": { "url": "$MDN_URL$/web/html/reference/elements/table#rules", @@ -10732,7 +10773,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines where rules (borders) are displayed in the table. The possible enumerated values are none (default value), groups (<thead>, <tbody>, and <tfoot> elements), rows (horizontal lines), cols (vertical lines), and all (border around every cell). Use the border CSS property on the appropriate table-related elements, as well as on the <table> itself, instead, as this attribute is deprecated." + "doc": "Defines where rules (borders) are displayed in the table. The possible enumerated values are none (default value), groups (<thead>, <tbody>, and <tfoot> elements), rows (horizontal lines), cols (vertical lines), and all (border around every cell). Use the border CSS property on the appropriate table-related elements, as well as on the <table> itself, instead, as this attribute is deprecated." }, "summary": { "url": "$MDN_URL$/web/html/reference/elements/table#summary", @@ -10774,7 +10815,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the width of the table. Use the width CSS property instead, as this attribute is deprecated.\n
    \n

    Note:\nWhile no HTML specification includes height as a <table> attribute, some browsers support a non-standard interpretation of height. The unitless value sets a minimum absolute height in pixels. If set as a percent value, the minimum table height will be relative to the parent container's height. Use the min-height CSS property instead, as this attribute is deprecated.\n

    " + "doc": "Specifies the width of the table. Use the width CSS property instead, as this attribute is deprecated.\n
    \n

    Note:\nWhile no HTML specification includes height as a <table> attribute, some browsers support a non-standard interpretation of height. The unitless value sets a minimum absolute height in pixels. If set as a percent value, the minimum table height will be relative to the parent container's height. Use the min-height CSS property instead, as this attribute is deprecated.\n

    " } } }, @@ -10828,7 +10869,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each body cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of each body cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/tbody#bgcolor", @@ -10849,7 +10890,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of each body cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each body cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/tbody#char", @@ -10857,13 +10898,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -10876,13 +10911,8 @@ "Deprecated" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "4", - "SafariIOS": "3.2" + "FirefoxAndroid": "4" }, "baseline": { "level": "NONE" @@ -10908,7 +10938,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each body cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of each body cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." } } }, @@ -10962,7 +10992,7 @@ "baseline": { "level": "NONE" }, - "doc": "Contains a short abbreviated description of the data cell's content. Some user-agents, such as speech readers, may present this description before the content itself. Put the abbreviated content inside the cell and place the (longer) description in the title attribute, as this attribute is deprecated. Or, preferably, include the content within the data cell, and use CSS to visually clip overflowing text." + "doc": "Contains a short abbreviated description of the data cell's content. Some user-agents, such as speech readers, may present this description before the content itself. Put the abbreviated content inside the cell and place the (longer) description in the title attribute, as this attribute is deprecated. Or, preferably, include the content within the data cell, and use CSS to visually clip overflowing text." }, "align": { "url": "$MDN_URL$/web/html/reference/elements/td#align", @@ -10983,7 +11013,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of the data cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of the data cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "axis": { "url": "$MDN_URL$/web/html/reference/elements/td#axis", @@ -11025,7 +11055,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of the data cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of the data cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/td#char", @@ -11033,13 +11063,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -11052,13 +11076,8 @@ "Deprecated" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "4", - "SafariIOS": "3.2" + "FirefoxAndroid": "4" }, "baseline": { "level": "NONE" @@ -11111,7 +11130,7 @@ }, "height": { "url": "$MDN_URL$/web/html/reference/elements/td#height", - "doc": "Defines a recommended data cell height. Use the height CSS property instead, as this attribute is deprecated." + "doc": "Defines a recommended data cell height. Use the height CSS property instead, as this attribute is deprecated." }, "rowspan": { "url": "$MDN_URL$/web/html/reference/elements/td#rowspan", @@ -11175,7 +11194,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of the data cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of the data cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." }, "width": { "url": "$MDN_URL$/web/html/reference/elements/td#width", @@ -11196,7 +11215,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines a recommended data cell width. Use the width CSS property instead, as this attribute is deprecated." + "doc": "Defines a recommended data cell width. Use the width CSS property instead, as this attribute is deprecated." } } }, @@ -11247,7 +11266,8 @@ "SafariIOS": "17.5" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2024-05-13" }, "doc": "Sets the value of the clonable property of a ShadowRoot created using this element to true.\nIf set, a clone of the shadow host (the parent element of this <template>) created with Node.cloneNode() or Document.importNode() will include a shadow root in the copy." }, @@ -11267,7 +11287,8 @@ "SafariIOS": "16.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2024-03-22" }, "doc": "Sets the value of the delegatesFocus property of a ShadowRoot created using this element to true.\nIf this is set and a non-focusable element in the shadow tree is selected, then focus is delegated to the first focusable element in the tree.\nThe value defaults to false." }, @@ -11292,6 +11313,17 @@ }, "doc": "Creates a shadow root for the parent element.\nIt is a declarative version of the Element.attachShadow() method and accepts the same enumerated values.\n
    \n
    open
    \n
    \n

    Exposes the internal shadow root DOM for JavaScript (recommended for most use cases).\n

    \n
    closed
    \n
    \n

    Hides the internal shadow root DOM from JavaScript.\n

    \n
    \n
    \n

    Note:\nThe HTML parser creates a ShadowRoot object in the DOM for the first <template> in a node with this attribute set to an allowed value.\nIf the attribute is not set, or not set to an allowed value — or if a ShadowRoot has already been declaratively created in the same parent — then an HTMLTemplateElement is constructed.\nA HTMLTemplateElement cannot subsequently be changed into a shadow root after parsing, for example, by setting HTMLTemplateElement.shadowRootMode.\n

    \n
    \n

    Note:\nYou may find the non-standard shadowroot attribute in older tutorials and examples that used to be supported in Chrome 90-110. This attribute has since been removed and replaced by the standard shadowrootmode attribute.\n

    " }, + "shadowrootreferencetarget": { + "url": "$MDN_URL$/web/html/reference/elements/template#shadowrootreferencetarget", + "status": [ + "Experimental" + ], + "compatibility": {}, + "baseline": { + "level": "NONE" + }, + "doc": "Sets the value of the referenceTarget property of a ShadowRoot created using this element. The value should be the ID of an element inside the shadow DOM. If set, target references to the host element from outside the shadow DOM will cause the referenced target element to become the effective target of the reference to the host element." + }, "shadowrootserializable": { "url": "$MDN_URL$/web/html/reference/elements/template#shadowrootserializable", "status": [ @@ -11696,7 +11728,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each foot cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of each foot cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/tfoot#bgcolor", @@ -11717,7 +11749,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of each foot cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each foot cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/tfoot#char", @@ -11725,13 +11757,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -11744,13 +11770,8 @@ "Deprecated" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "4", - "SafariIOS": "3.2" + "FirefoxAndroid": "4" }, "baseline": { "level": "NONE" @@ -11776,7 +11797,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each foot cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of each foot cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." } } }, @@ -11852,7 +11873,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of the header cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of the header cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "axis": { "url": "$MDN_URL$/web/html/reference/elements/th#axis", @@ -11894,7 +11915,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of the header cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of the header cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/th#char", @@ -11902,13 +11923,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -11921,13 +11936,8 @@ "Deprecated" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "4", - "SafariIOS": "3.2" + "FirefoxAndroid": "4" }, "baseline": { "level": "NONE" @@ -11980,7 +11990,7 @@ }, "height": { "url": "$MDN_URL$/web/html/reference/elements/th#height", - "doc": "Defines a recommended header cell height. Use the height CSS property instead, as this attribute is deprecated." + "doc": "Defines a recommended header cell height. Use the height CSS property instead, as this attribute is deprecated." }, "rowspan": { "url": "$MDN_URL$/web/html/reference/elements/th#rowspan", @@ -12045,7 +12055,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of the header cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of the header cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." }, "width": { "url": "$MDN_URL$/web/html/reference/elements/th#width", @@ -12066,7 +12076,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines a recommended header cell width. Use the width CSS property instead, as this attribute is deprecated." + "doc": "Defines a recommended header cell width. Use the width CSS property instead, as this attribute is deprecated." } } }, @@ -12120,7 +12130,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each head cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of each head cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and the offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/thead#bgcolor", @@ -12141,7 +12151,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of each head cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each head cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/thead#char", @@ -12149,13 +12159,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -12168,13 +12172,8 @@ "Deprecated" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", "Firefox": "1", - "FirefoxAndroid": "4", - "Safari": "4", - "SafariIOS": "3.2" + "FirefoxAndroid": "4" }, "baseline": { "level": "NONE" @@ -12200,7 +12199,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each head cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of each head cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." } } }, @@ -12340,7 +12339,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the horizontal alignment of each row cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the horizontal alignment of each row cell. The possible enumerated values are left, center, right, justify, and char. When supported, the char value aligns the textual content on the character defined in the char attribute and on offset defined by the charoff attribute. Use the text-align CSS property instead, as this attribute is deprecated." }, "bgcolor": { "url": "$MDN_URL$/web/html/reference/elements/tr#bgcolor", @@ -12361,7 +12360,7 @@ "baseline": { "level": "NONE" }, - "doc": "Defines the background color of each row cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." + "doc": "Defines the background color of each row cell. The value is an HTML color; either a 6-digit hexadecimal RGB code, prefixed by a #, or a color keyword. Other CSS <color> values are not supported. Use the background-color CSS property instead, as this attribute is deprecated." }, "char": { "url": "$MDN_URL$/web/html/reference/elements/tr#char", @@ -12369,13 +12368,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -12387,13 +12380,7 @@ "StandardTrack", "Deprecated" ], - "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Safari": "4", - "SafariIOS": "3.2" - }, + "compatibility": {}, "baseline": { "level": "NONE" }, @@ -12418,7 +12405,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the vertical alignment of each row cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." + "doc": "Specifies the vertical alignment of each row cell. The possible enumerated values are baseline, bottom, middle, and top. Use the vertical-align CSS property instead, as this attribute is deprecated." } } }, @@ -12581,7 +12568,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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.

    \n

    The <tt> HTML element creates inline text which is presented using the user agent's default monospace font face. This element was created for the purpose of rendering text as it would be displayed on a fixed-width display such as a teletype, text-only screen, or line printer.\n

    The terms non-proportional, monotype, and monospace are used interchangeably and have the same general meaning: they describe a typeface whose characters are all the same number of pixels wide.\n

    This element is obsolete, however. You should use the more semantically helpful <code>, <kbd>, <samp>, or <var> elements for inline text that needs to be presented in monospace type, or the <pre> tag for content that should be presented as a separate block.\n

    \n

    Note:\nIf none of the semantic elements are appropriate for your use case (for example, if you need to show some content in a non-proportional font), you should consider using the <span> element, styling it as desired using CSS. The font-family property is a good place to start.\n

    ", + "doc": "

    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.

    \n

    The <tt> HTML element creates inline text which is presented using the user agent's default monospace font face. This element was created for the purpose of rendering text as it would be displayed on a fixed-width display such as a teletype, text-only screen, or line printer.\n

    The terms non-proportional, monotype, and monospace are used interchangeably and have the same general meaning: they describe a typeface whose characters are all the same number of pixels wide.\n

    This element is obsolete, however. You should use the more semantically helpful <code>, <kbd>, <samp>, or <var> elements for inline text that needs to be presented in monospace type, or the <pre> tag for content that should be presented as a separate block.\n

    \n

    Note:\nIf none of the semantic elements are appropriate for your use case (for example, if you need to show some content in a non-proportional font), you should consider using the <span> element, styling it as desired using CSS. The font-family property is a good place to start.\n

    ", "details": { "Content categories": "Flow content\n,\nphrasing content\n, palpable content.\n", "Permitted content": "Phrasing content\n.\n", @@ -12611,7 +12598,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <u> HTML element represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation. This is rendered by default as a single solid underline, but may be altered using CSS.\n
    \n

    Warning:\nThis element used to be called the \"Underline\" element in older versions of HTML, and is still sometimes misused in this way. To underline text, you should instead apply a style that includes the CSS text-decoration property set to underline.\n

    \n

    See the Usage notes section for further details on when it's appropriate to use <u> and when it isn't.", + "doc": "The <u> HTML element represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation. This is rendered by default as a single solid underline, but may be altered using CSS.\n

    \n

    Warning:\nThis element used to be called the \"Underline\" element in older versions of HTML, and is still sometimes misused in this way. To underline text, you should instead apply a style that includes the CSS text-decoration property set to underline.\n

    \n

    See the Usage notes section for further details on when it's appropriate to use <u> and when it isn't.", "details": { "Content categories": "Flow content\n,\nphrasing content\n, palpable content.\n", "Permitted content": "Phrasing content\n.\n", @@ -12672,7 +12659,7 @@ "baseline": { "level": "NONE" }, - "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." + "doc": "This Boolean attribute hints that the list should be rendered in a compact style. The interpretation of this attribute is browser-specific. Use CSS instead: to give a similar effect as the compact attribute, the CSS property line-height can be used with a value of 80%." }, "type": { "url": "$MDN_URL$/web/html/reference/elements/ul#type", @@ -12693,7 +12680,7 @@ "baseline": { "level": "NONE" }, - "doc": "This attribute sets the bullet style for the list. The values defined under HTML3.2 and the transitional version of HTML 4.0/4.01 are:\n

    \n

    A fourth bullet type has been defined in the WebTV interface, but not all browsers support it: triangle.\n

    If not present and if no CSS list-style-type property applies to the element, the user agent selects a bullet type depending on the nesting level of the list.\n

    \n

    Warning:\nDo not use this attribute, as it has been deprecated; use the CSS list-style-type property instead.\n

    " + "doc": "This attribute sets the bullet style for the list. The values defined under HTML3.2 and the transitional version of HTML 4.0/4.01 are:\n\n

    A fourth bullet type has been defined in the WebTV interface, but not all browsers support it: triangle.\n

    If not present and if no CSS list-style-type property applies to the element, the user agent selects a bullet type depending on the nesting level of the list.\n

    \n

    Warning:\nDo not use this attribute, as it has been deprecated; use the CSS list-style-type property instead.\n

    " } } }, @@ -13098,7 +13085,7 @@ "Safari": "4", "SafariIOS": "3.2" }, - "doc": "

    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 <xmp> HTML element renders text between the start and end tags without interpreting the HTML in between and using a monospaced font. The HTML2 specification recommended that it should be rendered wide enough to allow 80 characters per line.\n
    \n

    Note:\nDo not use this element.\n

      \n
    • It has been deprecated since HTML3.2 and was not implemented in a consistent way. It was completely removed from current HTML.
    • \n
    • Use the <pre> element or, if semantically adequate, the <code> element instead. Note that you will need to escape the < character as &lt; and the & character as &amp; to make sure they are not interpreted as markup.
    • \n
    • A monospaced font can also be obtained on any element, by applying an adequate CSS style using monospace as the generic-font value for the font-family property.
    • \n
    \n
    " + "doc": "

    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 <xmp> HTML element renders text between the start and end tags without interpreting the HTML in between and using a monospaced font. The HTML2 specification recommended that it should be rendered wide enough to allow 80 characters per line.\n
    \n

    Note:\nDo not use this element.\n

      \n
    • It has been deprecated since HTML3.2 and was not implemented in a consistent way. It was completely removed from current HTML.
    • \n
    • Use the <pre> element or, if semantically adequate, the <code> element instead. Note that you will need to escape the < character as &lt; and the & character as &amp; to make sure they are not interpreted as markup.
    • \n
    • A monospaced font can also be obtained on any element, by applying an adequate CSS style using monospace as the generic-font value for the font-family property.
    • \n
    \n
    " } }, "tagAliases": { diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/MathML.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/MathML.json index bfd118757971..c534236a2e6f 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/MathML.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/MathML.json @@ -33,7 +33,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "The dir global attribute is an enumerated attribute that indicates the directionality of the MathML element." + "doc": "The dir global attribute is an enumerated attribute that indicates the directionality of the MathML element.\n

    The directionality controls whether math formulas are rendered left-to-right or right-to-left." }, "displaystyle": { "url": "$MDN_URL$/web/mathml/reference/global_attributes/displaystyle", @@ -55,7 +55,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "The displaystyle global attribute is a boolean setting the math-style of a MathML element." + "doc": "The displaystyle global attribute is a boolean setting the math-style of a MathML element." }, "href": { "url": "$MDN_URL$/web/mathml/reference/global_attributes/href", @@ -89,7 +89,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The mathbackground global attribute sets the background-color of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathbackground attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS background-color property value, if set.\n

    " + "doc": "

    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.

    \n

    The mathbackground global attribute sets the background-color of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathbackground attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS background-color property value, if set.\n

    " }, "mathcolor": { "url": "$MDN_URL$/web/mathml/reference/global_attributes/mathcolor", @@ -110,7 +110,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The mathcolor global attribute sets the color of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathcolor attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS color property, if set.\n

    " + "doc": "

    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.

    \n

    The mathcolor global attribute sets the color of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathcolor attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS color property, if set.\n

    " }, "mathsize": { "url": "$MDN_URL$/web/mathml/reference/global_attributes/mathsize", @@ -131,7 +131,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The mathsize global attribute sets the font-size of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathsize attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS font-size property, if set.\n

    " + "doc": "

    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.

    \n

    The mathsize global attribute sets the font-size of a MathML element.\n

    \n

    Note:\nUse CSS for styling MathML whenever possible. The mathsize attribute should only be included for applications that are not CSS-aware and will be overridden by the CSS font-size property, if set.\n

    " }, "scriptlevel": { "url": "$MDN_URL$/web/mathml/reference/global_attributes/scriptlevel", @@ -149,7 +149,7 @@ "baseline": { "level": "NONE" }, - "doc": "The scriptlevel global attribute sets the math-depth of a MathML element. It allows overriding rules from the user agent stylesheet that define automatic calculation of font-size within MathML formulas." + "doc": "The scriptlevel global attribute sets the math-depth of a MathML element. It allows overriding rules from the user agent stylesheet that define automatic calculation of font-size within MathML formulas." } }, "tags": { @@ -319,7 +319,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "This enumerated attribute specifies how the enclosed MathML markup should be rendered. It can have one of the following values:\n\n

    If not present, its default value is inline." + "doc": "This enumerated attribute specifies how the enclosed MathML markup should be rendered. It can have one of the following values:\n

    \n

    If not present, its default value is inline." } } }, @@ -466,7 +466,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the thickness of the horizontal fraction line." + "doc": "A <length-percentage> indicating the thickness of the horizontal fraction line." }, "numalign": { "url": "$MDN_URL$/web/mathml/reference/element/mfrac#numalign", @@ -504,7 +504,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "The <mi> MathML element indicates that the content should be rendered as an identifier, such as a function name, variable or symbolic constant.\n

    By default <mi> elements that contain multiple characters are a rendered as normal text, while single character characters are rendered as italic: the same formatting behavior as the CSS text-transform property with a value of math-auto.\nThe mathvariant attribute with a value of normal can be used to reset a single character to the normal font.\n

    In order to use a particular form of a character such as bold/italic, serif, sans-serif, script/calligraphy, monospaced, double-struck, and so on, you should use the appropriate Mathematical Alphanumeric Symbols.\n

    \n

    Note:\nIn a previous specification (MathML3), the mathvariant attribute was used to define logical classes that could apply the character formatting for mathematical alphanumeric symbols.\nThe associated values are now deprecated, and expected to be removed from browsers in future releases.\n

    ", + "doc": "The <mi> MathML element indicates that the content should be rendered as an identifier, such as a function name, variable or symbolic constant.\n

    By default <mi> elements that contain multiple characters are a rendered as normal text, while single character characters are rendered as italic: the same formatting behavior as the CSS text-transform property with a value of math-auto.\nThe mathvariant attribute with a value of normal can be used to reset a single character to the normal font.\n

    In order to use a particular form of a character such as bold/italic, serif, sans-serif, script/calligraphy, monospaced, double-struck, and so on, you should use the appropriate Mathematical Alphanumeric Symbols.\n

    \n

    Note:\nIn a previous specification (MathML3), the mathvariant attribute was used to define logical classes that could apply the character formatting for mathematical alphanumeric symbols.\nThe associated values are now deprecated, and expected to be removed from browsers in future releases.\n

    ", "details": { "Implicit ARIA role": "None\n" }, @@ -570,7 +570,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." }, "superscriptshift": { "url": "$MDN_URL$/web/mathml/reference/element/mmultiscripts#superscriptshift", @@ -584,7 +584,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." } } }, @@ -697,7 +697,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <boolean> indicating whether the operator should be drawn bigger when math-style is set to normal." + "doc": "A <boolean> indicating whether the operator should be drawn bigger when math-style is set to normal." }, "lspace": { "url": "$MDN_URL$/web/mathml/reference/element/mo#lspace", @@ -719,7 +719,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the amount of space before the operator." + "doc": "A <length-percentage> indicating the amount of space before the operator." }, "maxsize": { "url": "$MDN_URL$/web/mathml/reference/element/mo#maxsize", @@ -741,7 +741,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the maximum size of the operator when it is stretchy." + "doc": "A <length-percentage> indicating the maximum size of the operator when it is stretchy." }, "minsize": { "url": "$MDN_URL$/web/mathml/reference/element/mo#minsize", @@ -763,7 +763,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the minimum size of the operator when it is stretchy." + "doc": "A <length-percentage> indicating the minimum size of the operator when it is stretchy." }, "movablelimits": { "url": "$MDN_URL$/web/mathml/reference/element/mo#movablelimits", @@ -785,7 +785,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <boolean> indicating whether attached under- and overscripts move to sub- and superscript positions when math-style is set to compact." + "doc": "A <boolean> indicating whether attached under- and overscripts move to sub- and superscript positions when math-style is set to compact." }, "rspace": { "url": "$MDN_URL$/web/mathml/reference/element/mo#rspace", @@ -807,7 +807,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the amount of space after the operator." + "doc": "A <length-percentage> indicating the amount of space after the operator." }, "separator": { "url": "$MDN_URL$/web/mathml/reference/element/mo#separator", @@ -953,7 +953,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired depth (below the baseline) of the <mpadded> element." + "doc": "A <length-percentage> indicating the desired depth (below the baseline) of the <mpadded> element." }, "height": { "url": "$MDN_URL$/web/mathml/reference/element/mpadded#height", @@ -975,7 +975,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired height (above the baseline) of the <mpadded> element." + "doc": "A <length-percentage> indicating the desired height (above the baseline) of the <mpadded> element." }, "lspace": { "url": "$MDN_URL$/web/mathml/reference/element/mpadded#lspace", @@ -997,7 +997,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the horizontal location of the positioning point of the child content with respect to the positioning point of the <mpadded> element." + "doc": "A <length-percentage> indicating the horizontal location of the positioning point of the child content with respect to the positioning point of the <mpadded> element." }, "voffset": { "url": "$MDN_URL$/web/mathml/reference/element/mpadded#voffset", @@ -1019,7 +1019,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the vertical location of the positioning point of the child content with respect to the positioning point of the <mpadded> element." + "doc": "A <length-percentage> indicating the vertical location of the positioning point of the child content with respect to the positioning point of the <mpadded> element." }, "width": { "url": "$MDN_URL$/web/mathml/reference/element/mpadded#width", @@ -1041,7 +1041,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired horizontal length of the <mpadded> element." + "doc": "A <length-percentage> indicating the desired horizontal length of the <mpadded> element." } } }, @@ -1215,7 +1215,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired depth (below the baseline) of the space." + "doc": "A <length-percentage> indicating the desired depth (below the baseline) of the space." }, "height": { "url": "$MDN_URL$/web/mathml/reference/element/mspace#height", @@ -1237,7 +1237,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired height (above the baseline) of the space." + "doc": "A <length-percentage> indicating the desired height (above the baseline) of the space." }, "width": { "url": "$MDN_URL$/web/mathml/reference/element/mspace#width", @@ -1259,7 +1259,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "A <length-percentage> indicating the desired width of the space." + "doc": "A <length-percentage> indicating the desired width of the space." } } }, @@ -1325,7 +1325,7 @@ "baseline": { "level": "NONE" }, - "doc": "Use CSS property background-color instead." + "doc": "Use CSS property background-color instead." }, "color": { "url": "$MDN_URL$/web/mathml/reference/element/mstyle#color", @@ -1339,7 +1339,7 @@ "baseline": { "level": "NONE" }, - "doc": "Use CSS property color instead." + "doc": "Use CSS property color instead." }, "fontsize": { "url": "$MDN_URL$/web/mathml/reference/element/mstyle#fontsize", @@ -1353,7 +1353,7 @@ "baseline": { "level": "NONE" }, - "doc": "Use CSS property font-size instead." + "doc": "Use CSS property font-size instead." }, "fontstyle": { "url": "$MDN_URL$/web/mathml/reference/element/mstyle#fontstyle", @@ -1367,7 +1367,7 @@ "baseline": { "level": "NONE" }, - "doc": "Use CSS property font-style instead." + "doc": "Use CSS property font-style instead." }, "fontweight": { "url": "$MDN_URL$/web/mathml/reference/element/mstyle#fontweight", @@ -1381,7 +1381,7 @@ "baseline": { "level": "NONE" }, - "doc": "Use CSS property font-weight instead." + "doc": "Use CSS property font-weight instead." } } }, @@ -1422,7 +1422,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." } } }, @@ -1463,7 +1463,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the subscript down." }, "superscriptshift": { "url": "$MDN_URL$/web/mathml/reference/element/msubsup#superscriptshift", @@ -1477,7 +1477,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." } } }, @@ -1518,7 +1518,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." + "doc": "A <length-percentage> indicating the minimum amount to shift the baseline of the superscript up." } } }, @@ -1593,7 +1593,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the space between table columns. Multiple values separated by space are allowed and apply to the corresponding columns (e.g., columnspacing=\"1em 2em\"). Possible values are <length-percentage>." + "doc": "Specifies the space between table columns. Multiple values separated by space are allowed and apply to the corresponding columns (e.g., columnspacing=\"1em 2em\"). Possible values are <length-percentage>." }, "frame": { "url": "$MDN_URL$/web/mathml/reference/element/mtable#frame", @@ -1617,7 +1617,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies additional space added between the table and frame. The first value specifies the spacing on the right and left; the second value specifies the spacing above and below. Possible values are <length-percentage>." + "doc": "Specifies additional space added between the table and frame. The first value specifies the spacing on the right and left; the second value specifies the spacing above and below. Possible values are <length-percentage>." }, "rowalign": { "url": "$MDN_URL$/web/mathml/reference/element/mtable#rowalign", @@ -1654,7 +1654,7 @@ "baseline": { "level": "NONE" }, - "doc": "Specifies the space between table rows. Multiple values separated by space are allowed and apply to the corresponding rows (e.g., rowspacing=\"1em 2em\"). Possible values are <length-percentage>." + "doc": "Specifies the space between table rows. Multiple values separated by space are allowed and apply to the corresponding rows (e.g., rowspacing=\"1em 2em\"). Possible values are <length-percentage>." }, "width": { "url": "$MDN_URL$/web/mathml/reference/element/mtable#width", @@ -1665,7 +1665,7 @@ "baseline": { "level": "NONE" }, - "doc": "A <length-percentage> indicating the width of the entire table." + "doc": "A <length-percentage> indicating the width of the entire table." } } }, @@ -1982,7 +1982,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "The <semantics> MathML element associates annotations with a MathML expression, for example its text source as a lightweight markup language or mathematical meaning expressed in a special XML dialect. Typically, its structure is:\n\n

    By default, only the first child of the <semantics> element is rendered while the others have their display set to none.\n

    \n```css\nsemantics > :not(:first-child) {\n  display: none;\n}\n```\n
    \n
    \n

    Note:\nLegacy MathML specifications allowed renderers to decide the default rendering according to available annotations. The following rules for determining the visible child have been implemented in some browsers. See MathML 4 for the distinction between Presentation and Content MathML.\n

      \n
    • If no other rules apply: By default only the first child is rendered, which is supposed to be Presentation MathML.
    • \n
    • If the first child is a Presentation MathML element other than <annotation> or <annotation-xml>, render the first child.
    • \n
    • If no Presentation MathML is found, render the first <annotation> or <annotation-xml> child element of <semantics> without a src attribute. For <annotation-xml> elements the encoding attribute must be equal to one of following values:\n
        \n
      • \"application/mathml-presentation+xml\"
      • \n
      • \"MathML-Presentation\"
      • \n
      • \"SVG1.1\"
      • \n
      • \"text/html\"
      • \n
      • \"image/svg+xml\"
      • \n
      • \"application/xml\"
      • \n
      \n
    • \n
    \n

    Note that \"application/mathml+xml\" is not mentioned here as it does not distinguish between Content or Presentation MathML.\n

    ", + "doc": "The <semantics> MathML element associates annotations with a MathML expression, for example its text source as a lightweight markup language or mathematical meaning expressed in a special XML dialect. Typically, its structure is:\n\n

    By default, only the first child of the <semantics> element is rendered while the others have their display set to none.\n

    \n```css\nsemantics > :not(:first-child) {\n  display: none;\n}\n```\n
    \n
    \n

    Note:\nLegacy MathML specifications allowed renderers to decide the default rendering according to available annotations. The following rules for determining the visible child have been implemented in some browsers. See MathML 4 for the distinction between Presentation and Content MathML.\n

      \n
    • If no other rules apply: By default only the first child is rendered, which is supposed to be Presentation MathML.
    • \n
    • If the first child is a Presentation MathML element other than <annotation> or <annotation-xml>, render the first child.
    • \n
    • If no Presentation MathML is found, render the first <annotation> or <annotation-xml> child element of <semantics> without a src attribute. For <annotation-xml> elements the encoding attribute must be equal to one of following values:\n
        \n
      • \"application/mathml-presentation+xml\"
      • \n
      • \"MathML-Presentation\"
      • \n
      • \"SVG1.1\"
      • \n
      • \"text/html\"
      • \n
      • \"image/svg+xml\"
      • \n
      • \"application/xml\"
      • \n
      \n
    • \n
    \n

    Note that \"application/mathml+xml\" is not mentioned here as it does not distinguish between Content or Presentation MathML.\n

    ", "details": { "Implicit ARIA role": "None\n" } diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Svg.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Svg.json index f81cf68bb67d..f0f803764969 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Svg.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/Svg.json @@ -33,7 +33,7 @@ "baseline": { "level": "NONE" }, - "doc": "The alignment-baseline attribute specifies how an object is aligned with respect to its parent. This property specifies which baseline of this element is to be aligned with the corresponding baseline of the parent. For example, this allows alphabetic baselines in Roman text to stay aligned across font size changes. It defaults to the baseline with the same name as the computed value of the alignment-baseline property.\n
    \n

    Note:\nAs a presentation attribute, alignment-baseline also has a CSS property counterpart: alignment-baseline. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The alignment-baseline attribute specifies how an object is aligned with respect to its parent. This property specifies which baseline of this element is to be aligned with the corresponding baseline of the parent. For example, this allows alphabetic baselines in Roman text to stay aligned across font size changes. It defaults to the baseline with the same name as the computed value of the alignment-baseline property.\n
    \n

    Note:\nAs a presentation attribute, alignment-baseline also has a CSS property counterpart: alignment-baseline. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "amplitude": { "url": "$MDN_URL$/web/svg/reference/attribute/amplitude", @@ -121,7 +121,7 @@ "baseline": { "level": "NONE" }, - "doc": "The baseline-shift attribute allows repositioning of the dominant-baseline relative to the dominant-baseline of the parent text content element. The shifted object might be a sub- or superscript.\n
    \n

    Note:\nAs a presentation attribute, baseline-shift also has a CSS property counterpart: baseline-shift. When both are specified, the CSS property takes priority.\n

    \n
    \n

    Note:\nThis property is going to be deprecated and authors are advised to use vertical-align instead.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The baseline-shift attribute allows repositioning of the dominant-baseline relative to the dominant-baseline of the parent text content element. The shifted object might be a sub- or superscript.\n
    \n

    Note:\nAs a presentation attribute, baseline-shift also has a CSS property counterpart: baseline-shift. When both are specified, the CSS property takes priority.\n

    \n
    \n

    Note:\nThis property is going to be deprecated and authors are advised to use vertical-align instead.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "begin": { "url": "$MDN_URL$/web/svg/reference/attribute/begin", @@ -212,7 +212,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The clip attribute defines the visible region of an element. You should use clip-path instead.\n

    \n

    Note:\nAs a presentation attribute, clip also has a CSS property counterpart: clip. When both are specified, the CSS property takes priority.\n

    \n

    This attribute has the same parameter values as defined for the CSS clip property. Unitless values, which indicate current user coordinates, are permitted on the coordinate values on the rect(). The value of auto defines a clipping path along the bounds of the viewport created by the given element.\n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "

    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.

    \n

    The clip attribute defines the visible region of an element. You should use clip-path instead.\n

    \n

    Note:\nAs a presentation attribute, clip also has a CSS property counterpart: clip. When both are specified, the CSS property takes priority.\n

    \n

    This attribute has the same parameter values as defined for the CSS clip property. Unitless values, which indicate current user coordinates, are permitted on the coordinate values on the rect(). The value of auto defines a clipping path along the bounds of the viewport created by the given element.\n

    You can use this attribute with the following SVG elements:\n

    " }, "clip-path": { "url": "$MDN_URL$/web/svg/reference/attribute/clip-path", @@ -234,7 +234,7 @@ "lowDate": "2017-03-07", "highDate": "2019-09-07" }, - "doc": "The clip-path presentation attribute defines or associates a clipping path with the element it is related to.\n
    \n

    Note:\nAs a presentation attribute, clip-path also has a CSS property counterpart: clip-path. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The clip-path presentation attribute defines or associates a clipping path with the element it is related to.\n
    \n

    Note:\nAs a presentation attribute, clip-path also has a CSS property counterpart: clip-path. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "clip-rule": { "url": "$MDN_URL$/web/svg/reference/attribute/clip-rule", @@ -256,7 +256,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The clip-rule attribute only applies to graphics elements that are contained within a <clipPath> element. The clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clipPath> definitions.\n
    \n

    Note:\nAs a presentation attribute, clip-rule also has a CSS property counterpart: clip-rule. When both are specified, the CSS property takes priority.\n

    \n

    The following fragment of code will cause an evenodd clipping rule to be applied to the clipping path because clip-rule is specified on the <path> element that defines the clipping shape:\n

    \n```html\n\n  \n    \n  \n  \n\n```\n
    \n

    whereas the following fragment of code will not cause an evenodd clipping rule to be applied because the clip-rule is specified on the referencing element, not on the object defining the clipping shape:\n

    \n```html\n\n  \n    \n  \n  \n\n```\n
    " + "doc": "The clip-rule attribute only applies to graphics elements that are contained within a <clipPath> element. The clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clipPath> definitions.\n
    \n

    Note:\nAs a presentation attribute, clip-rule also has a CSS property counterpart: clip-rule. When both are specified, the CSS property takes priority.\n

    \n

    The following fragment of code will cause an evenodd clipping rule to be applied to the clipping path because clip-rule is specified on the <path> element that defines the clipping shape:\n

    \n```html\n\n  \n    \n  \n  \n\n```\n
    \n

    whereas the following fragment of code will not cause an evenodd clipping rule to be applied because the clip-rule is specified on the referencing element, not on the object defining the clipping shape:\n

    \n```html\n\n  \n    \n  \n  \n\n```\n
    " }, "color": { "url": "$MDN_URL$/web/svg/reference/attribute/color", @@ -278,7 +278,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The color attribute is used to provide a potential indirect value, currentColor, for the fill, stroke, stop-color, flood-color, and lighting-color attributes.\n
    \n

    Note:\nAs a presentation attribute, color also has a CSS property counterpart: color. When both are specified, the CSS property takes priority.\n

    \n

    Technically, color can be applied to any element, but it has no direct effect on SVG elements." + "doc": "The color attribute is used to provide a potential indirect value, currentColor, for the fill, stroke, stop-color, flood-color, and lighting-color attributes.\n

    \n

    Note:\nAs a presentation attribute, color also has a CSS property counterpart: color. When both are specified, the CSS property takes priority.\n

    \n

    Technically, color can be applied to any element, but it has no direct effect on SVG elements." }, "color-interpolation": { "url": "$MDN_URL$/web/svg/reference/attribute/color-interpolation", @@ -292,7 +292,7 @@ "baseline": { "level": "NONE" }, - "doc": "The color-interpolation attribute specifies the color space for gradient interpolations, color animations, and alpha compositing.\n

    \n

    Note:\nFor filter effects, the color-interpolation-filters property controls which color space is used.\n

    \n

    The color-interpolation property chooses between color operations occurring in the sRGB color space or in a (light energy linear) linearized RGB color space. Having chosen the appropriate color space, component-wise linear interpolation is used.\n

    When a child element is blended into a background, the value of the color-interpolation property on the child determines the type of blending, not the value of the color-interpolation on the parent. For gradients which make use of the href or the deprecated xlink:href attribute to reference another gradient, the gradient uses the property's value from the gradient element which is directly referenced by the fill or stroke property. When animating colors, color interpolation is performed according to the value of the color-interpolation property on the element being animated.\n

    \n

    Note:\nAs a presentation attribute, color-interpolation also has a CSS property counterpart: color-interpolation. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The color-interpolation attribute specifies the color space for gradient interpolations, color animations, and alpha compositing.\n
    \n

    Note:\nFor filter effects, the color-interpolation-filters property controls which color space is used.\n

    \n

    The color-interpolation property chooses between color operations occurring in the sRGB color space or in a (light energy linear) linearized RGB color space. Having chosen the appropriate color space, component-wise linear interpolation is used.\n

    When a child element is blended into a background, the value of the color-interpolation property on the child determines the type of blending, not the value of the color-interpolation on the parent. For gradients which make use of the href or the deprecated xlink:href attribute to reference another gradient, the gradient uses the property's value from the gradient element which is directly referenced by the fill or stroke property. When animating colors, color interpolation is performed according to the value of the color-interpolation property on the element being animated.\n

    \n

    Note:\nAs a presentation attribute, color-interpolation also has a CSS property counterpart: color-interpolation. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "color-interpolation-filters": { "url": "$MDN_URL$/web/svg/reference/attribute/color-interpolation-filters", @@ -314,7 +314,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The color-interpolation-filters attribute specifies the color space for imaging operations performed via filter effects.\n
    \n

    Note:\nThis property just has an affect on filter operations. Therefore, it has no effect on filter primitives like <feOffset>, <feImage>, <feTile> or <feFlood>.\n

    color-interpolation-filters has a different initial value than color-interpolation. color-interpolation-filters has an initial value of linearRGB, whereas color-interpolation has an initial value of sRGB. Thus, in the default case, filter effects operations occur in the linearRGB color space, whereas all other color interpolations occur by default in the sRGB color space.\n

    It has no affect on filter functions, which operate in the sRGB color space.\n

    \n
    \n

    Note:\nAs a presentation attribute, color-interpolation-filters also has a CSS property counterpart: color-interpolation-filters. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The color-interpolation-filters attribute specifies the color space for imaging operations performed via filter effects.\n
    \n

    Note:\nThis property just has an affect on filter operations. Therefore, it has no effect on filter primitives like <feOffset>, <feImage>, <feTile> or <feFlood>.\n

    color-interpolation-filters has a different initial value than color-interpolation. color-interpolation-filters has an initial value of linearRGB, whereas color-interpolation has an initial value of sRGB. Thus, in the default case, filter effects operations occur in the linearRGB color space, whereas all other color interpolations occur by default in the sRGB color space.\n

    It has no affect on filter functions, which operate in the sRGB color space.\n

    \n
    \n

    Note:\nAs a presentation attribute, color-interpolation-filters also has a CSS property counterpart: color-interpolation-filters. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "crossorigin": { "url": "$MDN_URL$/web/svg/reference/attribute/crossorigin", @@ -333,7 +333,7 @@ "SafariIOS": "17.2" } }, - "doc": "The crossorigin attribute, valid on the <image> and <feImage> elements, provides support for configuration of the Cross-Origin Resource Sharing (CORS) requests for the element's fetched data.\n

    This table shows possible keywords and their meaning:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    KeywordDescription
    anonymousClient CORS requests for this element will have the credentials flag set to 'same-origin'.
    use-credentialsClient CORS requests for this element will have the credentials flag set to 'include'.
    \"\"Setting the attribute name to an empty value, like crossorigin or crossorigin=\"\", is the same as anonymous.
    \n

    It follows the same processing rules as the HTML attribute crossorigin." + "doc": "The crossorigin attribute, valid on the <image>, <feImage>, and <script> elements, provides support for configuration of Cross-Origin Resource Sharing (CORS) requests for the element's fetched data.\n

    This table shows possible keywords and their meaning:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    KeywordDescription
    anonymousClient CORS requests for this element will have the credentials flag set to 'same-origin'.
    use-credentialsClient CORS requests for this element will have the credentials flag set to 'include'.
    \"\"Setting the attribute name to an empty value, like crossorigin or crossorigin=\"\", is the same as anonymous.
    \n

    It follows the same processing rules as the HTML attribute crossorigin." }, "cursor": { "url": "$MDN_URL$/web/svg/reference/attribute/cursor", @@ -355,7 +355,7 @@ "lowDate": "2021-12-07", "highDate": "2024-06-07" }, - "doc": "The cursor attribute specifies the mouse cursor displayed when the mouse pointer is over an element.\n

    \n

    Note:\nAs a presentation attribute, cursor also has a CSS property counterpart: cursor. When both are specified, the CSS property takes priority.\n

    " + "doc": "The cursor attribute specifies the mouse cursor displayed when the mouse pointer is over an element.\n
    \n

    Note:\nAs a presentation attribute, cursor also has a CSS property counterpart: cursor. When both are specified, the CSS property takes priority.\n

    " }, "decoding": { "url": "$MDN_URL$/web/svg/reference/attribute/decoding", @@ -417,7 +417,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The direction attribute specifies the inline-base direction of a <text> or <tspan> element. It defines the start and end points of a line of text as used by the text-anchor and inline-size properties. It also may affect the direction in which characters are positioned if the unicode-bidi property's value is either embed or bidi-override.\n

    It applies only to glyphs oriented perpendicular to the inline-base direction, which includes the usual case of horizontally-oriented Latin or Arabic text and the case of narrow-cell Latin or Arabic characters rotated 90 degrees clockwise relative to a top-to-bottom inline-base direction.\n

    In many cases, the bidirectional Unicode algorithm produces the desired result automatically, so this attribute doesn't need to be specified in those cases. For other cases, such as when using right-to-left languages, it may be sufficient to add the direction attribute to the outermost <svg> element, and allow that direction to inherit to all text elements:\n

    \n

    Note:\nAs a presentation attribute, direction also has a CSS property counterpart: direction. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The direction attribute specifies the inline-base direction of a <text> or <tspan> element. It defines the start and end points of a line of text as used by the text-anchor and inline-size properties. It also may affect the direction in which characters are positioned if the unicode-bidi property's value is either embed or bidi-override.\n

    It applies only to glyphs oriented perpendicular to the inline-base direction, which includes the usual case of horizontally-oriented Latin or Arabic text and the case of narrow-cell Latin or Arabic characters rotated 90 degrees clockwise relative to a top-to-bottom inline-base direction.\n

    In many cases, the bidirectional Unicode algorithm produces the desired result automatically, so this attribute doesn't need to be specified in those cases. For other cases, such as when using right-to-left languages, it may be sufficient to add the direction attribute to the outermost <svg> element, and allow that direction to inherit to all text elements:\n

    \n

    Note:\nAs a presentation attribute, direction also has a CSS property counterpart: direction. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "display": { "url": "$MDN_URL$/web/svg/reference/attribute/display", @@ -439,7 +439,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The display attribute lets you control the rendering of graphical or container elements.\n

    A value of display=\"none\" indicates that the given element and its children will not be rendered. Any value other than none or inherit indicates that the given element will be rendered by the browser.\n

    When applied to a container element, setting display to none causes the container and all of its children to be invisible; thus, it acts on groups of elements as a group. This means that any child of an element with display=\"none\" will never be rendered even if the child has a value for display other than none.\n

    When the display attribute is set to none, then the given element does not become part of the rendering tree. It has implications for the <tspan> elements, event processing, for bounding box calculations and for calculation of clipping paths:\n

    \n

    The display attribute only affects the direct rendering of a given element, whereas it does not prevent elements from being referenced by other elements. For example, setting it to none on a <path> element will prevent that element from getting rendered directly onto the canvas, but the <path> element can still be referenced by a <textPath> element; furthermore, its geometry will be used in text-on-a-path processing even if the <path> has a display value of none.\n

    This attribute also affects direct rendering into offscreen canvases, such as occurs with masks or clip paths. Thus, setting display=\"none\" on a child of a <mask> will prevent the given child element from being rendered as part of the mask. Similarly, setting display=\"none\" on a child of a <clipPath> element will prevent the given child element from contributing to the clipping path.\n

    \n

    Note:\nAs a presentation attribute, display also has a CSS property counterpart: display. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with any SVG element." + "doc": "The display attribute lets you control the rendering of graphical or container elements.\n

    A value of display=\"none\" indicates that the given element and its children will not be rendered. Any value other than none or inherit indicates that the given element will be rendered by the browser.\n

    When applied to a container element, setting display to none causes the container and all of its children to be invisible; thus, it acts on groups of elements as a group. This means that any child of an element with display=\"none\" will never be rendered even if the child has a value for display other than none.\n

    When the display attribute is set to none, then the given element does not become part of the rendering tree. It has implications for the <tspan> elements, event processing, for bounding box calculations and for calculation of clipping paths:\n

    \n

    The display attribute only affects the direct rendering of a given element, whereas it does not prevent elements from being referenced by other elements. For example, setting it to none on a <path> element will prevent that element from getting rendered directly onto the canvas, but the <path> element can still be referenced by a <textPath> element; furthermore, its geometry will be used in text-on-a-path processing even if the <path> has a display value of none.\n

    This attribute also affects direct rendering into offscreen canvases, such as occurs with masks or clip paths. Thus, setting display=\"none\" on a child of a <mask> will prevent the given child element from being rendered as part of the mask. Similarly, setting display=\"none\" on a child of a <clipPath> element will prevent the given child element from contributing to the clipping path.\n

    \n

    Note:\nAs a presentation attribute, display also has a CSS property counterpart: display. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with any SVG element." }, "divisor": { "url": "$MDN_URL$/web/svg/reference/attribute/divisor", @@ -483,7 +483,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The dominant-baseline attribute specifies the dominant baseline, which is the baseline used to align the box's text and inline-level contents. It also indicates the default alignment baseline of any boxes participating in baseline alignment in the box's alignment context.\n

    It is used to determine or re-determine a scaled-baseline-table. A scaled-baseline-table is a compound value with three components:\n

      \n
    1. a baseline-identifier for the dominant-baseline,
    2. \n
    3. a baseline-table, and
    4. \n
    5. a baseline-table font-size.
    6. \n
    \n

    Some values of the property re-determine all three values. Others only re-establish the baseline-table font-size. When the initial value, auto, would give an undesired result, this property can be used to explicitly set the desired scaled-baseline-table.\n

    If there is no baseline table in the nominal font, or if the baseline table lacks an entry for the desired baseline, then the browser may use heuristics to determine the position of the desired baseline.\n

    \n

    Note:\nAs a presentation attribute, dominant-baseline also has a CSS property counterpart: dominant-baseline. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The dominant-baseline attribute specifies the dominant baseline, which is the baseline used to align the box's text and inline-level contents. It also indicates the default alignment baseline of any boxes participating in baseline alignment in the box's alignment context.\n

    It is used to determine or re-determine a scaled-baseline-table. A scaled-baseline-table is a compound value with three components:\n

      \n
    1. a baseline-identifier for the dominant-baseline,
    2. \n
    3. a baseline-table, and
    4. \n
    5. a baseline-table font-size.
    6. \n
    \n

    Some values of the property re-determine all three values. Others only re-establish the baseline-table font-size. When the initial value, auto, would give an undesired result, this property can be used to explicitly set the desired scaled-baseline-table.\n

    If there is no baseline table in the nominal font, or if the baseline table lacks an entry for the desired baseline, then the browser may use heuristics to determine the position of the desired baseline.\n

    \n

    Note:\nAs a presentation attribute, dominant-baseline also has a CSS property counterpart: dominant-baseline. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "dur": { "url": "$MDN_URL$/web/svg/reference/attribute/dur", @@ -571,7 +571,7 @@ "SafariIOS": "2" } }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "fill-opacity": { "url": "$MDN_URL$/web/svg/reference/attribute/fill-opacity", @@ -593,7 +593,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The fill-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc.) applied to a shape.\n
    \n

    Note:\nAs a presentation attribute, fill-opacity also has a CSS property counterpart: fill-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The fill-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc.) applied to a shape.\n
    \n

    Note:\nAs a presentation attribute, fill-opacity also has a CSS property counterpart: fill-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "fill-rule": { "url": "$MDN_URL$/web/svg/reference/attribute/fill-rule", @@ -615,7 +615,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The fill-rule attribute is a presentation attribute defining the algorithm to use to determine the inside part of a shape.\n
    \n

    Note:\nAs a presentation attribute, fill-rule also has a CSS property counterpart: fill-rule. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The fill-rule attribute is a presentation attribute defining the algorithm to use to determine the inside part of a shape.\n
    \n

    Note:\nAs a presentation attribute, fill-rule also has a CSS property counterpart: fill-rule. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "filter": { "url": "$MDN_URL$/web/svg/reference/attribute/filter", @@ -637,7 +637,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.\n
    \n

    Note:\nAs a presentation attribute, filter also has a CSS property counterpart: filter. When both are specified, the CSS property takes priority.\n

    \n

    Technically, filter can be applied to any element, but it only has effect on container elements without the <defs> element, all graphics elements, and the <use> element." + "doc": "The filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.\n

    \n

    Note:\nAs a presentation attribute, filter also has a CSS property counterpart: filter. When both are specified, the CSS property takes priority.\n

    \n

    Technically, filter can be applied to any element, but it only has effect on container elements without the <defs> element, all graphics elements, and the <use> element." }, "flood-color": { "url": "$MDN_URL$/web/svg/reference/attribute/flood-color", @@ -659,7 +659,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The flood-color attribute indicates what color to use to flood the current filter primitive subregion.\n

    \n

    Note:\nAs a presentation attribute, flood-color also has a CSS property counterpart: flood-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The flood-color attribute indicates what color to use to flood the current filter primitive subregion.\n
    \n

    Note:\nAs a presentation attribute, flood-color also has a CSS property counterpart: flood-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "flood-opacity": { "url": "$MDN_URL$/web/svg/reference/attribute/flood-opacity", @@ -681,7 +681,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The flood-opacity attribute indicates the opacity value to use across the current filter primitive subregion.\n
    \n

    Note:\nAs a presentation attribute, flood-opacity also has a CSS property counterpart: flood-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The flood-opacity attribute indicates the opacity value to use across the current filter primitive subregion.\n
    \n

    Note:\nAs a presentation attribute, flood-opacity also has a CSS property counterpart: flood-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-family": { "url": "$MDN_URL$/web/svg/reference/attribute/font-family", @@ -703,7 +703,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-family attribute indicates which font family will be used to render the text, specified as a prioritized list of font family names and/or generic family names.\n
    \n

    Note:\nAs a presentation attribute, font-family also has a CSS property counterpart: font-family. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-family attribute indicates which font family will be used to render the text, specified as a prioritized list of font family names and/or generic family names.\n
    \n

    Note:\nAs a presentation attribute, font-family also has a CSS property counterpart: font-family. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-size": { "url": "$MDN_URL$/web/svg/reference/attribute/font-size", @@ -725,7 +725,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-size attribute refers to the size of the font from baseline to baseline when multiple lines of text are set solid in a multiline layout environment.\n
    \n

    Note:\nAs a presentation attribute, font-size also has a CSS property counterpart: font-size. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-size attribute refers to the size of the font from baseline to baseline when multiple lines of text are set solid in a multiline layout environment.\n
    \n

    Note:\nAs a presentation attribute, font-size also has a CSS property counterpart: font-size. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-size-adjust": { "url": "$MDN_URL$/web/svg/reference/attribute/font-size-adjust", @@ -746,7 +746,7 @@ "level": "LOW", "lowDate": "2024-07-25" }, - "doc": "The font-size-adjust attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.\n
    \n

    Note:\nAs a presentation attribute, font-size-adjust also has a CSS property counterpart: font-size-adjust. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-size-adjust attribute allows authors to specify an aspect value for an element that will preserve the x-height of the first choice font in a substitute font.\n
    \n

    Note:\nAs a presentation attribute, font-size-adjust also has a CSS property counterpart: font-size-adjust. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-stretch": { "url": "$MDN_URL$/web/svg/reference/attribute/font-stretch", @@ -767,7 +767,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The font-stretch attribute indicates the desired amount of condensing or expansion in the glyphs used to render the text.\n

    \n

    Note:\nAs a presentation attribute, font-stretch also has a CSS property counterpart: font-stretch. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "

    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.

    \n

    The font-stretch attribute indicates the desired amount of condensing or expansion in the glyphs used to render the text.\n

    \n

    Note:\nAs a presentation attribute, font-stretch also has a CSS property counterpart: font-stretch. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-style": { "url": "$MDN_URL$/web/svg/reference/attribute/font-style", @@ -789,7 +789,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-style attribute specifies whether the text is to be rendered using a normal, italic, or oblique face.\n
    \n

    Note:\nAs a presentation attribute, font-style also has a CSS property counterpart: font-style. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-style attribute specifies whether the text is to be rendered using a normal, italic, or oblique face.\n
    \n

    Note:\nAs a presentation attribute, font-style also has a CSS property counterpart: font-style. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-variant": { "url": "$MDN_URL$/web/svg/reference/attribute/font-variant", @@ -811,7 +811,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-variant attribute indicates whether the text is to be rendered using variations of the font's glyphs.\n
    \n

    Note:\nAs a presentation attribute, font-variant also has a CSS property counterpart: font-variant. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-variant attribute indicates whether the text is to be rendered using variations of the font's glyphs.\n
    \n

    Note:\nAs a presentation attribute, font-variant also has a CSS property counterpart: font-variant. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "font-weight": { "url": "$MDN_URL$/web/svg/reference/attribute/font-weight", @@ -833,7 +833,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The font-weight attribute refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the same font family.\n
    \n

    Note:\nAs a presentation attribute, font-weight also has a CSS property counterpart: font-weight. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The font-weight attribute refers to the boldness or lightness of the glyphs used to render the text, relative to other fonts in the same font family.\n
    \n

    Note:\nAs a presentation attribute, font-weight also has a CSS property counterpart: font-weight. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "fr": { "url": "$MDN_URL$/web/svg/reference/attribute/fr", @@ -970,7 +970,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The image-rendering attribute provides a hint to the browser about how to make speed vs. quality tradeoffs as it performs image processing.\n

    The resampling is always done in a true color (e.g., 24-bit) color space even if the original data and/or the target device is indexed color.\n

    \n

    Note:\nAs a presentation attribute, image-rendering also has a CSS property counterpart: image-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The image-rendering attribute provides a hint to the browser about how to make speed vs. quality tradeoffs as it performs image processing.\n

    The resampling is always done in a true color (e.g., 24-bit) color space even if the original data and/or the target device is indexed color.\n

    \n

    Note:\nAs a presentation attribute, image-rendering also has a CSS property counterpart: image-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "in": { "url": "$MDN_URL$/web/svg/reference/attribute/in", @@ -1158,7 +1158,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The letter-spacing attribute controls spacing between text characters.\n

    If the attribute value is a unitless number (like 128), the browser processes it as a <length> in the current user coordinate system.\n

    If the attribute value has a unit identifier, such as .25em or 1%, then the browser converts the <length> into its corresponding value in the current user coordinate system.\n

    \n

    Note:\nAs a presentation attribute, letter-spacing also has a CSS property counterpart: letter-spacing. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The letter-spacing attribute controls spacing between text characters.\n

    If the attribute value is a unitless number (like 128), the browser processes it as a <length> in the current user coordinate system.\n

    If the attribute value has a unit identifier, such as .25em or 1%, then the browser converts the <length> into its corresponding value in the current user coordinate system.\n

    \n

    Note:\nAs a presentation attribute, letter-spacing also has a CSS property counterpart: letter-spacing. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "lighting-color": { "url": "$MDN_URL$/web/svg/reference/attribute/lighting-color", @@ -1180,7 +1180,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The lighting-color attribute defines the color of the light source for lighting filter primitives.\n
    \n

    Note:\nAs a presentation attribute, lighting-color also has a CSS property counterpart: lighting-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The lighting-color attribute defines the color of the light source for lighting filter primitives.\n
    \n

    Note:\nAs a presentation attribute, lighting-color also has a CSS property counterpart: lighting-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "limitingconeangle": { "url": "$MDN_URL$/web/svg/reference/attribute/limitingconeangle", @@ -1224,7 +1224,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The marker-end attribute defines the arrowhead or polymarker that will be drawn at the final vertex of the given shape.\n

    For all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex. In this case, if the value of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex. For <path> elements, for each closed subpath, the last vertex is the same as the first vertex. marker-end is only rendered on the final vertex of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-end also has a CSS property counterpart: marker-end. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The marker-end attribute defines the arrowhead or polymarker that will be drawn at the final vertex of the given shape.\n

    For all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex. In this case, if the value of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex. For <path> elements, for each closed subpath, the last vertex is the same as the first vertex. marker-end is only rendered on the final vertex of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-end also has a CSS property counterpart: marker-end. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "marker-mid": { "url": "$MDN_URL$/web/svg/reference/attribute/marker-mid", @@ -1246,7 +1246,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The marker-mid attribute defines the arrowhead or polymarker that will be drawn at all interior vertices of the given shape.\n

    The marker is rendered on every vertex other than the first and last vertices of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-mid also has a CSS property counterpart: marker-mid. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The marker-mid attribute defines the arrowhead or polymarker that will be drawn at all interior vertices of the given shape.\n

    The marker is rendered on every vertex other than the first and last vertices of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-mid also has a CSS property counterpart: marker-mid. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "marker-start": { "url": "$MDN_URL$/web/svg/reference/attribute/marker-start", @@ -1268,7 +1268,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The marker-start attribute defines the arrowhead or polymarker that will be drawn at the first vertex of the given shape.\n

    For all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex. In this case, if the value of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex. For <path> elements, for each closed subpath, the last vertex is the same as the first vertex. marker-start is only rendered on the first vertex of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-start also has a CSS property counterpart: marker-start. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The marker-start attribute defines the arrowhead or polymarker that will be drawn at the first vertex of the given shape.\n

    For all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex. In this case, if the value of marker-start and marker-end are both not none, then two markers will be rendered on that final vertex. For <path> elements, for each closed subpath, the last vertex is the same as the first vertex. marker-start is only rendered on the first vertex of the path data.\n

    \n

    Note:\nAs a presentation attribute, marker-start also has a CSS property counterpart: marker-start. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "mask": { "url": "$MDN_URL$/web/svg/reference/attribute/mask", @@ -1289,11 +1289,11 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "The mask attribute is a presentation attribute mainly used to bind a given <mask> element with the element the attribute belongs to.\n
    \n

    Note:\nAs a presentation attribute, mask also has a CSS property counterpart: mask. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The mask attribute is a presentation attribute mainly used to bind a given <mask> element with the element the attribute belongs to.\n
    \n

    Note:\nAs a presentation attribute, mask also has a CSS property counterpart: mask. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "mask-type": { "url": "$MDN_URL$/web/svg/reference/attribute/mask-type", - "doc": "The mask-type attribute indicates which mask mode, alpha or luminance, to use for the contents of the <mask> element when masking.\n

    You can use this attribute with the following SVG elements:\n

    \n
    \n

    Note:\nThis presentation attribute has a CSS property counterpart: mask-type. When both are specified, the CSS property takes priority.\n

    " + "doc": "The mask-type attribute indicates which mask mode, alpha or luminance, to use for the contents of the <mask> element when masking.\n

    You can use this attribute with the following SVG elements:\n

    \n
    \n

    Note:\nThis presentation attribute has a CSS property counterpart: mask-type. When both are specified, the CSS property takes priority.\n

    " }, "max": { "url": "$MDN_URL$/web/svg/reference/attribute/max", @@ -1371,7 +1371,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.\n
    \n

    Note:\nAs a presentation attribute, opacity also has a CSS property counterpart: opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    \n

    Unlike fill-opacity, stroke-opacity, and stop-opacity, which are applied to individual operations and are rendered when the element is rendered, opacity is applied to whole objects or groups, and is more like a post-processing operation on the rendered image of the object or group. Therefore, when you have both opacity and the other opacity attributes in the same area, they will be overlaid on top of each other and cause the opacity to be multiplied." + "doc": "The opacity attribute specifies the transparency of an object or of a group of objects, that is, the degree to which the background behind the element is overlaid.\n

    \n

    Note:\nAs a presentation attribute, opacity also has a CSS property counterpart: opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    \n

    Unlike fill-opacity, stroke-opacity, and stop-opacity, which are applied to individual operations and are rendered when the element is rendered, opacity is applied to whole objects or groups, and is more like a post-processing operation on the rendered image of the object or group. Therefore, when you have both opacity and the other opacity attributes in the same area, they will be overlaid on top of each other and cause the opacity to be multiplied." }, "operator": { "url": "$MDN_URL$/web/svg/reference/attribute/operator", @@ -1419,7 +1419,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The overflow attribute sets what to do when an element's content is too big to fit in its block formatting context. This feature is not widely implemented yet.\n

    This attribute has the same parameter values and meaning as the CSS overflow property, however, the following additional points apply:\n

    \n
    \n

    Note:\nAlthough the initial value for overflow is auto, it is overwritten in the User Agent style sheet for the <svg> element when it is not the root element of a stand-alone document, the <pattern> element, and the <marker> element to be hidden by default.\n

    \n
    \n

    Note:\nAs a presentation attribute, overflow also has a CSS property counterpart: overflow. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The overflow attribute sets what to do when an element's content is too big to fit in its block formatting context. This feature is not widely implemented yet.\n

    This attribute has the same parameter values and meaning as the CSS overflow property, however, the following additional points apply:\n

    \n
    \n

    Note:\nAlthough the initial value for overflow is auto, it is overwritten in the User Agent style sheet for the <svg> element when it is not the root element of a stand-alone document, the <pattern> element, and the <marker> element to be hidden by default.\n

    \n
    \n

    Note:\nAs a presentation attribute, overflow also has a CSS property counterpart: overflow. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "paint-order": { "url": "$MDN_URL$/web/svg/reference/attribute/paint-order", @@ -1433,12 +1433,15 @@ "Firefox": "66", "FirefoxAndroid": "66", "Opera": "60", - "Safari": "12" + "Safari": "12", + "SafariIOS": "12" }, "baseline": { - "level": "NONE" + "level": "HIGH", + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, - "doc": "The paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.\n
    \n

    Note:\nAs a presentation attribute, paint-order also has a CSS property counterpart: paint-order. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The paint-order attribute specifies the order that the fill, stroke, and markers of a given shape or text element are painted.\n
    \n

    Note:\nAs a presentation attribute, paint-order also has a CSS property counterpart: paint-order. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "pointer-events": { "url": "$MDN_URL$/web/svg/reference/attribute/pointer-events", @@ -1460,7 +1463,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The pointer-events attribute is a presentation attribute that allows defining whether or when an element may be the target of a mouse event.\n
    \n

    Note:\nAs a presentation attribute, pointer-events also has a CSS property counterpart: pointer-events. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The pointer-events attribute is a presentation attribute that allows defining whether or when an element may be the target of a mouse event.\n
    \n

    Note:\nAs a presentation attribute, pointer-events also has a CSS property counterpart: pointer-events. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "pointsatx": { "url": "$MDN_URL$/web/svg/reference/attribute/pointsatx", @@ -1648,7 +1651,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.\n
    \n

    Note:\nAs a presentation attribute, shape-rendering also has a CSS property counterpart: shape-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.\n
    \n

    Note:\nAs a presentation attribute, shape-rendering also has a CSS property counterpart: shape-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "side": { "url": "$MDN_URL$/web/svg/reference/attribute/side", @@ -1818,7 +1821,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The stop-color attribute indicates what color to use at a gradient stop.\n
    \n

    Note:\nWith respect to gradients, SVG treats the transparent keyword differently than CSS. SVG does not calculate gradients in pre-multiplied space, so transparent really means transparent black. So, specifying a stop-color with the value transparent is equivalent to specifying a stop-color with the value black and a stop-opacity with the value 0.\n

    \n
    \n

    Note:\nAs a presentation attribute, stop-color also has a CSS property counterpart: stop-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stop-color attribute indicates what color to use at a gradient stop.\n
    \n

    Note:\nWith respect to gradients, SVG treats the transparent keyword differently than CSS. SVG does not calculate gradients in pre-multiplied space, so transparent really means transparent black. So, specifying a stop-color with the value transparent is equivalent to specifying a stop-color with the value black and a stop-opacity with the value 0.\n

    \n
    \n

    Note:\nAs a presentation attribute, stop-color also has a CSS property counterpart: stop-color. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stop-opacity": { "url": "$MDN_URL$/web/svg/reference/attribute/stop-opacity", @@ -1840,7 +1843,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The stop-opacity attribute defines the opacity of a given color gradient stop.\n

    The opacity value used for the gradient calculation is the product of the value of stop-opacity and the opacity of the value of the stop-color attribute. For stop-color values that don't include explicit opacity information, the opacity is treated as 1.\n

    \n

    Note:\nAs a presentation attribute, stop-opacity also has a CSS property counterpart: stop-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stop-opacity attribute defines the opacity of a given color gradient stop.\n

    The opacity value used for the gradient calculation is the product of the value of stop-opacity and the opacity of the value of the stop-color attribute. For stop-color values that don't include explicit opacity information, the opacity is treated as 1.\n

    \n

    Note:\nAs a presentation attribute, stop-opacity also has a CSS property counterpart: stop-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke", @@ -1862,7 +1865,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The stroke attribute is a presentation attribute defining the color (or any SVG paint servers like gradients or patterns) used to paint the outline of the shape.\n
    \n

    Note:\nAs a presentation attribute, stroke also has a CSS property counterpart: stroke. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke attribute is a presentation attribute defining the color (or any SVG paint servers like gradients or patterns) used to paint the outline of the shape.\n
    \n

    Note:\nAs a presentation attribute, stroke also has a CSS property counterpart: stroke. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-dasharray": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-dasharray", @@ -1884,7 +1887,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-dasharray attribute is a presentation attribute defining the pattern of dashes and gaps used to paint the outline of the shape.\n
    \n

    Note:\nAs a presentation attribute, stroke-dasharray also has a CSS property counterpart: stroke-dasharray. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-dasharray attribute is a presentation attribute defining the pattern of dashes and gaps used to paint the outline of the shape.\n
    \n

    Note:\nAs a presentation attribute, stroke-dasharray also has a CSS property counterpart: stroke-dasharray. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-dashoffset": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-dashoffset", @@ -1906,7 +1909,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.\n
    \n

    Note:\nAs a presentation attribute, stroke-dashoffset also has a CSS property counterpart: stroke-dashoffset. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-dashoffset attribute is a presentation attribute defining an offset on the rendering of the associated dash array.\n
    \n

    Note:\nAs a presentation attribute, stroke-dashoffset also has a CSS property counterpart: stroke-dashoffset. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-linecap": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-linecap", @@ -1928,7 +1931,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-linecap attribute is a presentation attribute defining the shape to be used at the end of open subpaths when they are stroked.\n
    \n

    Note:\nAs a presentation attribute, stroke-linecap also has a CSS property counterpart: stroke-linecap. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-linecap attribute is a presentation attribute defining the shape to be used at the end of open subpaths when they are stroked.\n
    \n

    Note:\nAs a presentation attribute, stroke-linecap also has a CSS property counterpart: stroke-linecap. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-linejoin": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-linejoin", @@ -1950,7 +1953,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-linejoin attribute is a presentation attribute defining the shape to be used at the corners of paths when they are stroked.\n
    \n

    Note:\nAs a presentation attribute, stroke-linejoin also has a CSS property counterpart: stroke-linejoin. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-linejoin attribute is a presentation attribute defining the shape to be used at the corners of paths when they are stroked.\n
    \n

    Note:\nAs a presentation attribute, stroke-linejoin also has a CSS property counterpart: stroke-linejoin. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-miterlimit": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-miterlimit", @@ -1972,7 +1975,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-miterlimit attribute is a presentation attribute defining a limit on the ratio of the miter length to the stroke-width used to draw a miter join. When the limit is exceeded, the join is converted from a miter to a bevel.\n
    \n

    Note:\nAs a presentation attribute, stroke-miterlimit also has a CSS property counterpart: stroke-miterlimit. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-miterlimit attribute is a presentation attribute defining a limit on the ratio of the miter length to the stroke-width used to draw a miter join. When the limit is exceeded, the join is converted from a miter to a bevel.\n
    \n

    Note:\nAs a presentation attribute, stroke-miterlimit also has a CSS property counterpart: stroke-miterlimit. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-opacity": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-opacity", @@ -1994,7 +1997,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc.) applied to the stroke of a shape.\n
    \n

    Note:\nAs a presentation attribute, stroke-opacity also has a CSS property counterpart: stroke-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-opacity attribute is a presentation attribute defining the opacity of the paint server (color, gradient, pattern, etc.) applied to the stroke of a shape.\n
    \n

    Note:\nAs a presentation attribute, stroke-opacity also has a CSS property counterpart: stroke-opacity. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "stroke-width": { "url": "$MDN_URL$/web/svg/reference/attribute/stroke-width", @@ -2016,7 +2019,7 @@ "lowDate": "≤2020-03-24", "highDate": "≤2022-09-24" }, - "doc": "The stroke-width attribute is a presentation attribute defining the width of the stroke to be applied to the shape. It applies to any SVG shape or text-content element, but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.\n
    \n

    Note:\nAs a presentation attribute, stroke-width also has a CSS property counterpart: stroke-width. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The stroke-width attribute is a presentation attribute defining the width of the stroke to be applied to the shape. It applies to any SVG shape or text-content element, but as an inherited property, it may be applied to elements such as <g> and still have the intended effect on descendant elements' strokes.\n
    \n

    Note:\nAs a presentation attribute, stroke-width also has a CSS property counterpart: stroke-width. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "style": { "url": "$MDN_URL$/web/svg/reference/attribute/style", @@ -2134,7 +2137,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The text-anchor attribute is used to align (start-, middle- or end-alignment) a string of pre-formatted text or auto-wrapped text where the wrapping area is determined from the inline-size property relative to a given point.\n

    This attribute is not applicable to other types of auto-wrapped text. For those cases you should use text-align. For multi-line text, the alignment takes place for each line.\n

    The text-anchor attribute is applied to each individual text chunk within a given <text> element. Each text chunk has an initial current text position, which represents the point in the user coordinate system resulting from (depending on context) application of the x and y attributes on the <text> element, any x or y attribute values on a <tspan> element assigned explicitly to the first rendered character in a text chunk, or determination of the initial current text position for a <textPath> element.\n

    \n

    Note:\nAs a presentation attribute, text-anchor also has a CSS property counterpart: text-anchor. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The text-anchor attribute is used to align (start-, middle- or end-alignment) a string of pre-formatted text or auto-wrapped text where the wrapping area is determined from the inline-size property relative to a given point.\n

    This attribute is not applicable to other types of auto-wrapped text. For those cases you should use text-align. For multi-line text, the alignment takes place for each line.\n

    The text-anchor attribute is applied to each individual text chunk within a given <text> element. Each text chunk has an initial current text position, which represents the point in the user coordinate system resulting from (depending on context) application of the x and y attributes on the <text> element, any x or y attribute values on a <tspan> element assigned explicitly to the first rendered character in a text chunk, or determination of the initial current text position for a <textPath> element.\n

    \n

    Note:\nAs a presentation attribute, text-anchor also has a CSS property counterpart: text-anchor. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "text-decoration": { "url": "$MDN_URL$/web/svg/reference/attribute/text-decoration", @@ -2156,7 +2159,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The text-decoration attribute defines whether text is decorated with an underline, overline and/or strike-through. It is a shorthand for the text-decoration-line and text-decoration-style properties.\n

    The fill and stroke of the text decoration are given by the fill and stroke of the text at the point where the text decoration is declared.\n

    The paint order of the text decoration, i.e., the fill and stroke, is determined by the value of the paint-order attribute at the point where the text decoration is declared.\n

    \n

    Note:\nAs a presentation attribute, text-decoration also has a CSS property counterpart: text-decoration. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The text-decoration attribute defines whether text is decorated with an underline, overline and/or strike-through. It is a shorthand for the text-decoration-line and text-decoration-style properties.\n

    The fill and stroke of the text decoration are given by the fill and stroke of the text at the point where the text decoration is declared.\n

    The paint order of the text decoration, i.e., the fill and stroke, is determined by the value of the paint-order attribute at the point where the text decoration is declared.\n

    \n

    Note:\nAs a presentation attribute, text-decoration also has a CSS property counterpart: text-decoration. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "text-overflow": { "url": "$MDN_URL$/web/svg/reference/attribute/text-overflow", @@ -2178,7 +2181,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The SVG text-overflow attribute specifies how text content block elements render when text overflows line boxes. This can happen, for example, when the white-space attribute or CSS property has the value nowrap. The property does not apply to pre-formatted text or text situated on a path.\n

    In SVG, text-overflow has an effect if there is a validly specified wrapping area, regardless of the computed value of the overflow property on the text content block element. The effect is purely visual: clipped text is not removed from the DOM, and any ellipsis, if presented, does not itself become part of the DOM. For all the DOM methods, it is as if text-overflow was not applied, and as if the wrapping area did not constrain the text.\n

    \n

    Note:\nAs a presentation attribute, text-overflow also has a CSS property counterpart: text-overflow. When both are specified, the CSS property takes priority.\n

    " + "doc": "The SVG text-overflow attribute specifies how text content block elements render when text overflows line boxes. This can happen, for example, when the white-space attribute or CSS white-space property has the value nowrap. The property does not apply to pre-formatted text or text situated on a path.\n

    In SVG, text-overflow has an effect if there is a validly specified wrapping area, regardless of the computed value of the overflow property on the text content block element. The effect is purely visual: clipped text is not removed from the DOM, and any ellipsis, if presented, does not itself become part of the DOM. For all the DOM methods, it is as if text-overflow was not applied, and as if the wrapping area did not constrain the text.\n

    \n

    Note:\nAs a presentation attribute, text-overflow also has a CSS property counterpart: text-overflow. When both are specified, the CSS property takes priority.\n

    " }, "text-rendering": { "url": "$MDN_URL$/web/svg/reference/attribute/text-rendering", @@ -2200,7 +2203,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The text-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering text.\n
    \n

    Note:\nAs a presentation attribute, text-rendering also has a CSS property counterpart: text-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The text-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering text.\n
    \n

    Note:\nAs a presentation attribute, text-rendering also has a CSS property counterpart: text-rendering. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "to": { "url": "$MDN_URL$/web/svg/reference/attribute/to", @@ -2226,7 +2229,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The transform attribute defines a list of transform definitions that are applied to an element and the element's children.\n
    \n

    Note:\nAs a presentation attribute, transform also has a CSS property counterpart: transform. When both are specified, the CSS property takes priority. Note that there are some differences in syntax between the CSS property and the attribute!\n

    " + "doc": "The transform attribute defines a list of transform definitions that are applied to an element and the element's children.\n
    \n

    Note:\nAs a presentation attribute, transform also has a CSS property counterpart: transform. When both are specified, the CSS property takes priority. Note that there are some differences in syntax between the CSS property and the attribute!\n

    " }, "transform-origin": { "url": "$MDN_URL$/web/svg/reference/attribute/transform-origin", @@ -2244,7 +2247,7 @@ "baseline": { "level": "NONE" }, - "doc": "The transform-origin SVG attribute sets the origin for an item's transformations.\n

    You can use this attribute with any SVG element.\n

    \n

    Note:\nAs a presentation attribute, transform-origin also has a CSS property counterpart: transform-origin. When both are specified, the CSS property takes priority.\n

    " + "doc": "The transform-origin SVG attribute sets the origin for an item's transformations.\n

    You can use this attribute with any SVG element.\n

    \n

    Note:\nAs a presentation attribute, transform-origin also has a CSS property counterpart: transform-origin. When both are specified, the CSS property takes priority.\n

    " }, "type": { "url": "$MDN_URL$/web/svg/reference/attribute/type", @@ -2270,7 +2273,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The unicode-bidi attribute specifies how the accumulation of the background image is managed.\n
    \n

    Note:\nAs a presentation attribute, unicode-bidi also has a CSS property counterpart: unicode-bidi. When both are specified, the CSS property takes priority.\n

    " + "doc": "The unicode-bidi attribute specifies how the accumulation of the background image is managed.\n
    \n

    Note:\nAs a presentation attribute, unicode-bidi also has a CSS property counterpart: unicode-bidi. When both are specified, the CSS property takes priority.\n

    " }, "values": { "url": "$MDN_URL$/web/svg/reference/attribute/values", @@ -2296,7 +2299,7 @@ "lowDate": "≤2020-07-28", "highDate": "≤2023-01-28" }, - "doc": "The vector-effect property specifies the vector effect to use when drawing an object. Vector effects are applied before any of the other compositing operations, i.e., filters, masks and clips.\n
    \n

    Note:\nAs a presentation attribute, vector-effect also has a CSS property counterpart: vector-effect. When both are specified, the CSS property takes priority.\n

    " + "doc": "The vector-effect property specifies the vector effect to use when drawing an object. Vector effects are applied before any of the other compositing operations, i.e., filters, masks and clips.\n
    \n

    Note:\nAs a presentation attribute, vector-effect also has a CSS property counterpart: vector-effect. When both are specified, the CSS property takes priority.\n

    " }, "visibility": { "url": "$MDN_URL$/web/svg/reference/attribute/visibility", @@ -2318,7 +2321,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The visibility attribute lets you control the visibility of graphical elements. With a value of hidden or collapse the current graphics element is invisible.\n
    \n

    Note:\nIf the visibility attribute is set to hidden on a text element, then the text is invisible but still takes up space in text layout calculations.\n

    \n

    Depending on the value of attribute pointer-events, graphics elements which have their visibility attribute set to hidden still might receive events.\n

    \n

    Note:\nAs a presentation attribute, visibility also has a CSS property counterpart: visibility. When both are specified, the CSS property takes priority.\n

    " + "doc": "The visibility attribute lets you control the visibility of graphical elements. With a value of hidden or collapse the current graphics element is invisible.\n
    \n

    Note:\nIf the visibility attribute is set to hidden on a text element, then the text is invisible but still takes up space in text layout calculations.\n

    \n

    Depending on the value of attribute pointer-events, graphics elements which have their visibility attribute set to hidden still might receive events.\n

    \n

    Note:\nAs a presentation attribute, visibility also has a CSS property counterpart: visibility. When both are specified, the CSS property takes priority.\n

    " }, "white-space": { "url": "$MDN_URL$/web/svg/reference/attribute/white-space", @@ -2340,7 +2343,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The white-space SVG attribute specifies how white space within text should be handled. This includes whether and how white space inside the element is collapsed and whether lines may wrap at unforced soft wrap opportunities.\n
    \n

    Note:\nAs a presentation attribute, white-space also has a CSS property counterpart: white-space. When both are specified, the CSS property takes priority.\n

    " + "doc": "The white-space SVG attribute specifies how white space within text should be handled. This includes whether and how white space inside the element is collapsed and whether lines may wrap at unforced soft wrap opportunities.\n
    \n

    Note:\nAs a presentation attribute, white-space also has a CSS property counterpart: white-space. When both are specified, the CSS property takes priority.\n

    " }, "word-spacing": { "url": "$MDN_URL$/web/svg/reference/attribute/word-spacing", @@ -2362,7 +2365,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The word-spacing attribute specifies spacing behavior between words.\n

    If a <length> is provided without a unit identifier (e.g., an unqualified number such as 128), the browser processes the <length> as a width value in the current user coordinate system.\n

    If a <length> is provided with one of the unit identifiers (e.g., .25em or 1%), then the browser converts the <length> into a corresponding value in the current user coordinate system.\n

    \n

    Note:\nAs a presentation attribute, word-spacing also has a CSS property counterpart: word-spacing. When both are specified, the CSS property takes priority.\n

    " + "doc": "The word-spacing attribute specifies spacing behavior between words.\n

    If a <length> is provided without a unit identifier (e.g., an unqualified number such as 128), the browser processes the <length> as a width value in the current user coordinate system.\n

    If a <length> is provided with one of the unit identifiers (e.g., .25em or 1%), then the browser converts the <length> into a corresponding value in the current user coordinate system.\n

    \n

    Note:\nAs a presentation attribute, word-spacing also has a CSS property counterpart: word-spacing. When both are specified, the CSS property takes priority.\n

    " }, "writing-mode": { "url": "$MDN_URL$/web/svg/reference/attribute/writing-mode", @@ -2384,7 +2387,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "The writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom. The writing-mode attribute applies only to <text> elements; the attribute is ignored for <tspan> and <textPath> sub-elements. (Note that the inline-progression-direction can change within a <text> element due to the Unicode bidirectional algorithm and properties direction and unicode-bidi.)\n
    \n

    Note:\nAs a presentation attribute, writing-mode also has a CSS property counterpart: writing-mode. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "The writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom. The writing-mode attribute applies only to <text> elements; the attribute is ignored for <tspan> and <textPath> sub-elements. (Note that the inline-progression-direction can change within a <text> element due to the Unicode bidirectional algorithm and properties direction and unicode-bidi.)\n
    \n

    Note:\nAs a presentation attribute, writing-mode also has a CSS property counterpart: writing-mode. When both are specified, the CSS property takes priority.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, "x": { "url": "$MDN_URL$/web/svg/reference/attribute/x", @@ -2531,6 +2534,26 @@ "Animatable": "no" } }, + "interestfor": { + "url": "$MDN_URL$/web/svg/reference/element/a#interestfor", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "Defines the <a> element as an interest invoker. Its value is the id of a target element that will be affected in some way (normally shown or hidden) when interest is shown or lost on the invoker element (for example, by hovering/unhovering or focusing/blurring it). See Using interest invokers for more details and examples.", + "details": { + "Value type": "<string>", + "Default": "none", + "Animatable": "no" + } + }, "ping": { "url": "$MDN_URL$/web/svg/reference/element/a#ping", "status": [ @@ -2783,7 +2806,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "from": { "url": "$MDN_URL$/web/svg/reference/element/animate#from", @@ -2961,7 +2984,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "href": { "url": "$MDN_URL$/web/svg/reference/element/animatemotion#href", @@ -3171,7 +3194,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "from": { "url": "$MDN_URL$/web/svg/reference/element/animatetransform#from", @@ -3381,7 +3404,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "pathlength": { "url": "$MDN_URL$/web/svg/reference/element/circle#pathlength" @@ -3669,7 +3692,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "pathlength": { "url": "$MDN_URL$/web/svg/reference/element/ellipse#pathlength" @@ -4061,8 +4084,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "The k1 attribute defines one of the values to be used within the arithmetic operation of the <feComposite> filter primitive.\n

    The pixel composition is computed using the following formula:\n

    \n```js\nresult = k1 * i1 * i2 + k2 * i1 + k3 * i2 + k4;\n```\n
    \n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -4083,8 +4106,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "The k2 attribute defines one of the values to be used within the arithmetic operation of the <feComposite> filter primitive.\n

    The pixel composition is computed using the following formula:\n

    \n```js\nresult = k1 * i1 * i2 + k2 * i1 + k3 * i2 + k4;\n```\n
    \n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -4105,8 +4128,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "The k3 attribute defines one of the values to be used within the arithmetic operation of the <feComposite> filter primitive.\n

    The pixel composition is computed using the following formula:\n

    \n```js\nresult = k1 * i1 * i2 + k2 * i1 + k3 * i2 + k4;\n```\n
    \n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -4127,8 +4150,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "The k4 attribute defines one of the values to be used within the arithmetic operation of the <feComposite> filter primitive.\n

    The pixel composition is computed using the following formula:\n

    result = k1*i1*i2 + k2*i1 + k3*i2 + k4\n
    \n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -4666,7 +4689,7 @@ "lowDate": "≤2018-10-02", "highDate": "≤2021-04-02" }, - "doc": "The <feDistantLight> SVG filter primitive defines a distant light source that can be used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.\n

    Like other filter primitives, it handles color components in the linearRGB color space by default. You can use color-interpolation-filters to use sRGB instead.", + "doc": "The <feDistantLight> SVG element defines a distant light source that can be used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.", "attrs": { "azimuth": { "url": "$MDN_URL$/web/svg/reference/element/fedistantlight#azimuth", @@ -4756,12 +4779,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "This attribute defines the x offset of the drop shadow.", - "details": { - "Value type": "<number>", - "Default": "2", - "Animatable": "yes" - } + "doc": "The dx attribute indicates a shift along the x-axis on the position of an element or its content.\n

    You can use this attribute with the following SVG elements:\n

    " }, "dy": { "url": "$MDN_URL$/web/svg/reference/element/fedropshadow#dy", @@ -4783,12 +4801,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "This attribute defines the y offset of the drop shadow.", - "details": { - "Value type": "<number>", - "Default": "2", - "Animatable": "yes" - } + "doc": "The dy attribute indicates a shift along the y-axis on the position of an element or its content.\n

    You can use this attribute with the following SVG elements:\n

    " }, "in": { "url": "$MDN_URL$/web/svg/reference/element/fedropshadow#in", @@ -5062,7 +5075,7 @@ "baseline": { "level": "NONE" }, - "doc": "The crossorigin attribute, valid on the <image> and <feImage> elements, provides support for configuration of the Cross-Origin Resource Sharing (CORS) requests for the element's fetched data.\n

    This table shows possible keywords and their meaning:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    KeywordDescription
    anonymousClient CORS requests for this element will have the credentials flag set to 'same-origin'.
    use-credentialsClient CORS requests for this element will have the credentials flag set to 'include'.
    \"\"Setting the attribute name to an empty value, like crossorigin or crossorigin=\"\", is the same as anonymous.
    \n

    It follows the same processing rules as the HTML attribute crossorigin." + "doc": "The crossorigin attribute, valid on the <image>, <feImage>, and <script> elements, provides support for configuration of Cross-Origin Resource Sharing (CORS) requests for the element's fetched data.\n

    This table shows possible keywords and their meaning:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    KeywordDescription
    anonymousClient CORS requests for this element will have the credentials flag set to 'same-origin'.
    use-credentialsClient CORS requests for this element will have the credentials flag set to 'include'.
    \"\"Setting the attribute name to an empty value, like crossorigin or crossorigin=\"\", is the same as anonymous.
    \n

    It follows the same processing rules as the HTML attribute crossorigin." }, "fetchpriority": { "url": "$MDN_URL$/web/svg/reference/element/feimage#fetchpriority", @@ -5073,6 +5086,9 @@ "Firefox": "140", "FirefoxAndroid": "140" }, + "baseline": { + "level": "NONE" + }, "doc": "

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

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The fetchpriority attribute provides a hint to the browser about the relative priority to use when fetching an external resource. This works the same way as the fetchpriority attribute for the HTML <img> and <script> elements.\n

    You can use this attribute with the following SVG elements:\n

    " }, "href": { @@ -5389,7 +5405,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <fePointLight> SVG filter primitive defines a light source which allows to create a point light effect. It that can be used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.\n

    Like other filter primitives, it handles color components in the linearRGB color space by default. You can use color-interpolation-filters to use sRGB instead.", + "doc": "The <fePointLight> SVG element defines a light source which allows to create a point light effect. It can be used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.", "attrs": { "x": { "url": "$MDN_URL$/web/svg/reference/element/fepointlight#x", @@ -5612,7 +5628,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <feSpotLight> SVG filter primitive defines a light source that can be used to create a spotlight effect.\nIt is used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.\n

    Like other filter primitives, it handles color components in the linearRGB color space by default. You can use color-interpolation-filters to use sRGB instead.", + "doc": "The <feSpotLight> SVG element defines a light source that can be used to create a spotlight effect.\nIt is used within a lighting filter primitive: <feDiffuseLighting> or <feSpecularLighting>.", "attrs": { "limitingconeangle": { "url": "$MDN_URL$/web/svg/reference/element/fespotlight#limitingconeangle", @@ -5992,7 +6008,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <filter> SVG element defines a custom filter effect by grouping atomic filter primitives. It is never rendered itself, but must be used by the filter attribute on SVG elements, or the filter CSS property for SVG/HTML elements.", + "doc": "The <filter> SVG element defines a custom filter effect by grouping atomic filter primitives. It is never rendered itself, but must be used by the filter attribute on SVG elements, or the filter CSS property for SVG/HTML elements.", "attrs": { "filterunits": { "url": "$MDN_URL$/web/svg/reference/element/filter#filterunits", @@ -6158,7 +6174,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "2", "FirefoxAndroid": "4", "Opera": "2", @@ -6167,8 +6183,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "The height of the foreignObject.", "details": { @@ -6185,7 +6201,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "12", "FirefoxAndroid": "14", "Opera": "2", @@ -6194,8 +6210,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "The systemLanguage attribute represents a list of supported language tags. This list is matched against the language defined in the user preferences.\n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -6207,7 +6223,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "2", "FirefoxAndroid": "4", "Opera": "2", @@ -6216,8 +6232,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "The width of the foreignObject.", "details": { @@ -6234,7 +6250,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "2", "FirefoxAndroid": "4", "Opera": "2", @@ -6243,8 +6259,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "The x coordinate of the foreignObject.", "details": { @@ -6261,7 +6277,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "2", "FirefoxAndroid": "4", "Opera": "2", @@ -6270,8 +6286,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "The y coordinate of the foreignObject.", "details": { @@ -6348,7 +6364,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <image> SVG element includes images inside SVG documents. It can display raster image files or other SVG files.\n

    The only image formats SVG software must support are JPEG, PNG, and other SVG files. Animated GIF behavior is undefined.\n

    SVG files displayed with <image> are treated as an image: external resources aren't loaded, :visited styles aren't applied, and they cannot be interactive. To include dynamic SVG elements, try <use> with an external URL. To include SVG files and run scripts inside them, try <object> inside of <foreignObject>.\n

    \n

    Note:\nThe HTML spec defines <image> as a synonym for <img> while parsing HTML. This specific element and its behavior only apply inside SVG documents or inline SVGs.\n

    ", + "doc": "The <image> SVG element includes images inside SVG documents. It can display raster image files or other SVG files.\n

    The only image formats SVG software must support are JPEG, PNG, and other SVG files. Animated GIF behavior is undefined.\n

    SVG files displayed with <image> are treated as an image: external resources aren't loaded, :visited styles aren't applied, and they cannot be interactive. To include dynamic SVG elements, try <use> with an external URL. To include SVG files and run scripts inside them, try <object> inside of <foreignObject>.\n

    \n

    Note:\nThe HTML spec defines <image> as a synonym for <img> while parsing HTML. This specific element and its behavior only apply inside SVG documents or inline SVGs.\n

    ", "attrs": { "crossorigin": { "url": "$MDN_URL$/web/svg/reference/element/image#crossorigin", @@ -6408,6 +6424,9 @@ "Firefox": "140", "FirefoxAndroid": "140" }, + "baseline": { + "level": "NONE" + }, "doc": "Provides a hint of the relative priority to use when fetching an external image.\nAllowed values:\n
    \n
    high
    \n
    \n

    Fetches the external image at a high priority relative to other external resources.\n

    \n
    low
    \n
    \n

    Fetches the external image at a low priority relative to other external resources.\n

    \n
    auto
    \n
    \n

    Doesn't set a preference for the fetch priority.\nIt is used if no value or an invalid value is set.\nThis is the default.\n

    \n
    " }, "height": { @@ -7197,7 +7216,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <mask> SVG element defines a mask for compositing the current object into the background. A mask is used/referenced using the mask property and CSS mask-image property.", + "doc": "The <mask> SVG element defines a mask for compositing the current object into the background. A mask is used/referenced using the mask property and CSS mask-image property.", "attrs": { "height": { "url": "$MDN_URL$/web/svg/reference/element/mask#height", @@ -7521,7 +7540,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "pathlength": { "url": "$MDN_URL$/web/svg/reference/element/path#pathlength" @@ -7854,7 +7873,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "pathlength": { "url": "$MDN_URL$/web/svg/reference/element/polygon#pathlength" @@ -7952,7 +7971,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "pathlength": { "url": "$MDN_URL$/web/svg/reference/element/polyline#pathlength" @@ -8028,7 +8047,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <radialGradient> SVG element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.\n
    \n

    Note:\nDon't be confused with CSS radial-gradient() as CSS gradients can only apply to HTML elements where SVG gradient can only apply to SVG elements.\n

    ", + "doc": "The <radialGradient> SVG element lets authors define radial gradients that can be applied to fill or stroke of graphical elements.\n
    \n

    Note:\nDon't be confused with CSS radial-gradient() as CSS gradients can only apply to HTML elements where SVG gradient can only apply to SVG elements.\n

    ", "attrs": { "cx": { "url": "$MDN_URL$/web/svg/reference/element/radialgradient#cx", @@ -8338,7 +8357,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "height": { "url": "$MDN_URL$/web/svg/reference/element/rect#height", @@ -8569,7 +8588,7 @@ "url": "$MDN_URL$/web/svg/reference/element/script#crossorigin", "doc": "This attribute defines CORS settings as define for the HTML <script> element.", "details": { - "Value type": "[ anonymous | use-credentials ]?", + "Value type": "[ anonymous | use-credentials ]?", "Default": "?", "Animatable": "yes" } @@ -8597,6 +8616,9 @@ "Firefox": "140", "FirefoxAndroid": "140" }, + "baseline": { + "level": "NONE" + }, "doc": "Provides a hint of the relative priority to use when fetching an external script.\nAllowed values:\n
    \n
    high
    \n
    \n

    Fetches the external script at a high priority relative to other external scripts.\n

    \n
    low
    \n
    \n

    Fetches the external script at a low priority relative to other external scripts.\n

    \n
    auto
    \n
    \n

    Doesn't set a preference for the fetch priority.\nIt is used if no value or an invalid value is set.\nThis is the default.\n

    \n
    " }, "href": { @@ -8706,7 +8728,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "href": { "url": "$MDN_URL$/web/svg/reference/element/set#href", @@ -8716,7 +8738,7 @@ "compatibility": { "Chrome": "50", "ChromeAndroid": "50", - "Edge": "79", + "Edge": "12", "Firefox": "51", "FirefoxAndroid": "51", "Opera": "37", @@ -8725,8 +8747,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2019-03-25", + "highDate": "2021-09-25" }, "doc": "The href attribute defines a link to a resource as a reference URL. The exact meaning of that link depends on the context of each element using it.\n
    \n

    Note:\nSpecifications before SVG 2 defined an xlink:href attribute, which is now rendered obsolete by the href attribute. If you need to support earlier browser versions, the deprecated xlink:href attribute can be used as a fallback in addition to the href attribute, e.g., <use href=\"some-id\" xlink:href=\"some-id\" x=\"5\" y=\"5\" />.\n

    \n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -8760,7 +8782,7 @@ "compatibility": { "Chrome": "2", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "4", "FirefoxAndroid": "4", "Opera": "12.1", @@ -8769,8 +8791,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2015-07-29", + "highDate": "2018-01-29" }, "doc": "This attribute defines the value to be applied to the target attribute for the duration of the animation. The value must match the requirements of the target attribute.", "details": { @@ -8892,9 +8914,9 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "This attribute defines to which media the style applies.", + "doc": "This attribute defines to which media the style applies.", "details": { - "Value type": "<media-query-list>", + "Value type": "<media-query-list>", "Default": "all", "Animatable": "no" } @@ -8921,7 +8943,7 @@ }, "doc": "This attribute is the title of the style sheet which can be used to switch between alternate style sheets.", "details": { - "Value type": "<string>", + "Value type": "<string>", "Default": "none", "Animatable": "no" } @@ -8975,7 +8997,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <svg> SVG element is a container that defines a new coordinate system and viewport. It is used as the outermost element of SVG documents, but it can also be used to embed an SVG fragment inside an SVG or HTML document.\n
    \n

    Note:\nThe xmlns attribute is only required on the outermost svg element of SVG documents, or inside HTML documents with XML serialization. It is unnecessary for inner svg elements or inside HTML documents with HTML serialization.\n

    ", + "doc": "The <svg> SVG element is a container that defines a new coordinate system and viewport. It is used as the outermost element of SVG documents, but it can also be used to embed an SVG fragment inside an SVG or HTML document.\n

    This element is for creating new SVG documents. If you have an existing SVG document to embed in another document via URL, use <img>, <object>, or <image>.\n

    \n

    Note:\nThe xmlns attribute is only required on the outermost svg element of SVG documents, or inside HTML documents with XML serialization. It is unnecessary for inner svg elements or inside HTML documents with HTML serialization.\n

    ", "attrs": { "baseprofile": { "url": "$MDN_URL$/web/svg/reference/element/svg#baseprofile", @@ -8986,7 +9008,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "1.5", "FirefoxAndroid": "4", "Opera": "15", @@ -8996,7 +9018,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    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.

    \n

    The baseProfile attribute describes the minimum SVG language profile that the author believes is necessary to correctly render the content. The attribute does not specify any processing restrictions; It can be considered metadata.\n

    For example, the value of the attribute could be used by an authoring tool to warn the user when they are modifying the document beyond the scope of the specified base profile.\n

    Each SVG profile should define the text that is appropriate for this attribute.\n

    You can use this attribute with the following SVG elements:\n

    " + "doc": "

    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.

    \n

    The baseProfile attribute describes the minimum SVG language profile that the author believes is necessary to correctly render the content. The attribute does not specify any processing restrictions; it can be considered metadata.\n

    For example, the value of the attribute could be used by an authoring tool to warn the user when they are modifying the document beyond the scope of the specified base profile.\n

    Each SVG profile should define the text that is appropriate for this attribute.\n

    You can use this attribute with the following SVG elements:\n

    " }, "height": { "url": "$MDN_URL$/web/svg/reference/element/svg#height", @@ -9078,7 +9100,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "1.5", "FirefoxAndroid": "4", "Opera": "15", @@ -9207,7 +9229,7 @@ "compatibility": { "Chrome": "1", "ChromeAndroid": "18", - "Edge": "79", + "Edge": "12", "Firefox": "1.5", "FirefoxAndroid": "4", "Opera": "15", @@ -9290,7 +9312,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <symbol> SVG element is used to define graphical template objects which can be instantiated by a <use> element.\n

    The use of <symbol> elements for graphics that are used multiple times in the same document adds structure and semantics. Documents that are rich in structure may be rendered graphically, as speech, or as Braille, and thus promote accessibility.\n

    \n

    Note:\nA <symbol> element itself is not meant to be rendered. Only instances of a <symbol> element (i.e., a reference to a <symbol> by a <use> element) are rendered. That means that some browsers could refuse to directly display a <symbol> element even if the CSS display property tells otherwise.\n

    ", + "doc": "The <symbol> SVG element is used to define graphical template objects which can be instantiated by a <use> element.\n

    The use of <symbol> elements for graphics that are used multiple times in the same document adds structure and semantics. Documents that are rich in structure may be rendered graphically, as speech, or as Braille, and thus promote accessibility.\n

    \n

    Note:\nA <symbol> element itself is not meant to be rendered. Only instances of a <symbol> element (i.e., a reference to a <symbol> by a <use> element) are rendered. That means that some browsers could refuse to directly display a <symbol> element even if the CSS display property tells otherwise.\n

    ", "attrs": { "height": { "url": "$MDN_URL$/web/svg/reference/element/symbol#height", @@ -9400,7 +9422,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <text> SVG element draws a graphics element consisting of text. It's possible to apply a gradient, pattern, clipping path, mask, or filter to <text>, like any other SVG graphics element.\n

    If text is included in SVG not inside of a <text> element, it is not rendered. This is different than being hidden by default, as setting the display property won't show the text.\n

    \n

    Note:\nThe <text> element does not wrap by default, to make this happen it needs to be styled with the white-space CSS property.\n

    ", + "doc": "The <text> SVG element draws a graphics element consisting of text. It's possible to apply a gradient, pattern, clipping path, mask, or filter to <text>, like any other SVG graphics element.\n

    If text is included in SVG not inside of a <text> element, it is not rendered. This is different than being hidden by default, as setting the display property won't show the text.\n

    \n

    Note:\nThe <text> element does not wrap by default, to make this happen it needs to be styled with the white-space CSS property.\n

    ", "attrs": { "dx": { "url": "$MDN_URL$/web/svg/reference/element/text#dx", @@ -9476,7 +9498,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "lengthadjust": { "url": "$MDN_URL$/web/svg/reference/element/text#lengthadjust", @@ -9669,7 +9691,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "href": { "url": "$MDN_URL$/web/svg/reference/element/textpath#href", @@ -9887,7 +9909,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The <tspan> SVG element defines a subtext within a <text> element or another <tspan> element. It allows for adjustment of the style and/or position of that subtext as needed.\n
    \n

    Note:\nThe <tspan> element does not wrap by default, to make this happen it needs to be styled with the white-space CSS property.\n

    ", + "doc": "The <tspan> SVG element defines a subtext within a <text> element or another <tspan> element. It allows for adjustment of the style and/or position of that subtext as needed.\n
    \n

    Note:\nThe <tspan> element does not wrap by default, to make this happen it needs to be styled with the white-space CSS property.\n

    ", "attrs": { "dx": { "url": "$MDN_URL$/web/svg/reference/element/tspan#dx", @@ -9963,7 +9985,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " + "doc": "The fill attribute has two different meanings. For shapes and text it's a presentation attribute that defines the color (or any SVG paint servers like gradients or patterns) used to paint the element; for animation it defines the final state of the animation.\n
    \n

    Note:\nWhen used as a presentation attribute, fill also has a CSS property counterpart: fill. When both are specified, the CSS property takes priority.\n

    \n

    The SVG presentational fill attribute and the CSS fill property can be used with the following SVG elements:\n

    \n

    The SVG fill attribute can be used to define the final animation state with the following SVG elements:\n

    " }, "lengthadjust": { "url": "$MDN_URL$/web/svg/reference/element/tspan#lengthadjust", @@ -9974,16 +9996,12 @@ "Chrome": "1", "ChromeAndroid": "18", "Edge": "79", - "Firefox": "1.5", - "FirefoxAndroid": "4", "Opera": "15", "Safari": "3", "SafariIOS": "2" }, "baseline": { - "level": "HIGH", - "lowDate": "2020-01-15", - "highDate": "2022-07-15" + "level": "NONE" }, "doc": "The lengthAdjust attribute controls how the text is stretched into the length defined by the textLength attribute.\n

    You can use this attribute with the following SVG elements:\n

    " }, @@ -10004,8 +10022,8 @@ }, "baseline": { "level": "HIGH", - "lowDate": "≤2020-01-15", - "highDate": "≤2022-07-15" + "lowDate": "2020-01-15", + "highDate": "2022-07-15" }, "doc": "Rotates orientation of each individual glyph. Can rotate glyphs individually.", "details": { @@ -10045,16 +10063,12 @@ "Chrome": "1", "ChromeAndroid": "18", "Edge": "12", - "Firefox": "1.5", - "FirefoxAndroid": "4", "Opera": "15", "Safari": "3", "SafariIOS": "2" }, "baseline": { - "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "level": "NONE" }, "doc": "The textLength attribute, available on SVG <text> and <tspan> elements, lets you specify the width of the space into which the text will draw. The user agent will ensure that the text does not extend farther than that distance, using the method or methods specified by the lengthAdjust attribute. By default, only the spacing between characters is adjusted, but the glyph size can also be adjusted if you change lengthAdjust.\n

    By using textLength, you can ensure that your SVG text displays at the same width regardless of conditions including web fonts failing to load (or not having loaded yet).\n

    You can use this attribute with the following SVG elements:\n

    " }, diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-a.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-a.json index c8040bab227e..d68ec6021956 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-a.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-a.json @@ -210,7 +210,7 @@ "parameters": { "iterable": "An iterable (such as an Array) of abort signals." }, - "returns": "A AbortSignal that is:\n" + "returns": "An AbortSignal that is:\n" }, "abortsignal.reason": { "url": "$MDN_URL$/web/api/abortsignal/reason", @@ -302,7 +302,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The AbsoluteOrientationSensor interface of the Sensor APIs describes the device's physical orientation in relation to the Earth's reference coordinate system.\n

    To use this sensor, the user must grant permission to the 'accelerometer', 'gyroscope', and 'magnetometer' device sensors through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." + "doc": "

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

    \n

    The AbsoluteOrientationSensor interface of the Sensor APIs describes the device's physical orientation in relation to the Earth's reference coordinate system.\n

    To use this sensor, the user must grant permission to the 'accelerometer', 'gyroscope', and 'magnetometer' device sensors through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." }, "absoluteorientationsensor.absoluteorientationsensor": { "url": "$MDN_URL$/web/api/absoluteorientationsensor/absoluteorientationsensor", @@ -318,7 +318,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The AbsoluteOrientationSensor() constructor creates a new AbsoluteOrientationSensor object which describes the device's physical orientation in relation to the Earth's reference coordinate system.", + "doc": "

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

    \n

    The AbsoluteOrientationSensor() constructor creates a new AbsoluteOrientationSensor object which describes the device's physical orientation in relation to the Earth's reference coordinate system.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should be taken, meaning the number of times per second that the reading event will be called. A whole number or decimal may be used, the latter for frequencies less than a second. The actual reading frequency depends on the device hardware and consequently may be less than requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or 'screen'. The default is 'device'.\n

    \n
    " } @@ -365,7 +365,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The read-only collapsed property of the AbstractRange interface returns true if the range's start position and end position are the same." + "doc": "The read-only collapsed property of the AbstractRange interface returns true if the range's start position and end position are the same.\n

    A collapsed range is empty (containing no content), and specifies a single point in a DOM tree. To collapse a range, see the Range.collapse() method." }, "abstractrange.endcontainer": { "url": "$MDN_URL$/web/api/abstractrange/endcontainer", @@ -387,7 +387,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The read-only endContainer property of the AbstractRange interface returns the Node in which the end of the range is located." + "doc": "The read-only endContainer property of the AbstractRange interface returns the Node in which the end of the range is located.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "abstractrange.endoffset": { "url": "$MDN_URL$/web/api/abstractrange/endoffset", @@ -409,7 +409,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The endOffset property of the AbstractRange interface returns the offset into the end node of the range's end position." + "doc": "The endOffset property of the AbstractRange interface returns the offset into the end node of the range's end position.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "abstractrange.startcontainer": { "url": "$MDN_URL$/web/api/abstractrange/startcontainer", @@ -431,7 +431,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The read-only startContainer property of the AbstractRange interface returns the start Node for the range." + "doc": "The read-only startContainer property of the AbstractRange interface returns the Node in which the start of the range is located.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "abstractrange.startoffset": { "url": "$MDN_URL$/web/api/abstractrange/startoffset", @@ -453,7 +453,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The read-only startOffset property of the AbstractRange interface returns the offset into the start node of the range's start position." + "doc": "The read-only startOffset property of the AbstractRange interface returns the offset into the start node of the range's start position.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "accelerometer": { "url": "$MDN_URL$/web/api/accelerometer", @@ -470,7 +470,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The Accelerometer interface of the Sensor APIs provides on each reading the acceleration applied to the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'accelerometer', device sensor through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." + "doc": "

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

    \n

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

    \n

    The Accelerometer interface of the Sensor APIs provides on each reading the acceleration applied to the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'accelerometer', device sensor through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." }, "accelerometer.accelerometer": { "url": "$MDN_URL$/web/api/accelerometer/accelerometer", @@ -487,7 +487,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The Accelerometer() constructor creates a new Accelerometer object which returns the acceleration of the device along all three axes at the time it is read.", + "doc": "

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

    \n

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

    \n

    The Accelerometer() constructor creates a new Accelerometer object which returns the acceleration of the device along all three axes at the time it is read.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should be taken, meaning the number of times per second the reading event will be called. A whole number or decimal may be used, the latter for frequencies less than a second. The actual reading frequency depends on the device hardware and consequently may be less than requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or 'screen'. The default is 'device'.\n

    \n
    " }, @@ -510,7 +510,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The x read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its x-axis." + "doc": "

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

    \n

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

    \n

    The x read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its x-axis." }, "accelerometer.y": { "url": "$MDN_URL$/web/api/accelerometer/y", @@ -527,7 +527,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The y read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its y-axis." + "doc": "

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

    \n

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

    \n

    The y read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its y-axis." }, "accelerometer.z": { "url": "$MDN_URL$/web/api/accelerometer/z", @@ -544,7 +544,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The z read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its z-axis." + "doc": "

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

    \n

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

    \n

    The z read-only property of the Accelerometer interface returns a number specifying the acceleration of the device along its z-axis." }, "aescbcparams": { "url": "$MDN_URL$/web/api/aescbcparams", @@ -552,7 +552,7 @@ }, "aesctrparams": { "url": "$MDN_URL$/web/api/aesctrparams", - "doc": "The AesCtrParams dictionary of the Web Crypto API represents the object that should be passed as the algorithm parameter into SubtleCrypto.encrypt(), SubtleCrypto.decrypt(), SubtleCrypto.wrapKey(), or SubtleCrypto.unwrapKey(), when using the AES-CTR algorithm.\n

    AES is a block cipher, meaning that it splits the message into blocks and encrypts it a block at a time. In CTR mode, every time a block of the message is encrypted, an extra block of data is mixed in. This extra block is called the \"counter block\".\n

    A given counter block value must never be used more than once with the same key:\n

    \n

    Typically this is achieved by splitting the initial counter block value into two concatenated parts:\n

    \n

    Essentially: the nonce should ensure that counter blocks are not reused from one message to the next, while the counter should ensure that counter blocks are not reused within a single message.\n

    \n

    Note:\nSee Appendix B of the NIST SP800-38A standard for more information.\n

    " + "doc": "The AesCtrParams dictionary of the Web Crypto API represents the object that should be passed as the algorithm parameter into SubtleCrypto.encrypt(), SubtleCrypto.decrypt(), SubtleCrypto.wrapKey(), or SubtleCrypto.unwrapKey(), when using the AES-CTR algorithm.\n

    AES is a block cipher, meaning that it splits the message into blocks and encrypts it a block at a time. In CTR mode, every time a block of the message is encrypted, an extra block of data is mixed in. This extra block is called the \"counter block\".\n

    A given counter block value must never be used more than once with the same key:\n

    \n

    Typically this is achieved by splitting the initial counter block value into two concatenated parts:\n

    \n

    Essentially: the nonce should ensure that counter blocks are not reused from one message to the next, while the counter should ensure that counter blocks are not reused within a single message.\n

    \n

    Note:\nSee Appendix B of the NIST SP800-38A standard for more information.\n

    " }, "aesderivedkeyparams": { "url": "$MDN_URL$/web/api/aesderivedkeyparams", @@ -576,7 +576,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The AmbientLightSensor interface of the Sensor APIs returns the current light level or illuminance of the ambient light around the hosting device.\n

    To use this sensor, the user must grant permission to the 'ambient-light-sensor' device sensor through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." + "doc": "

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

    \n

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

    \n

    The AmbientLightSensor interface of the Sensor APIs returns the current light level or illuminance of the ambient light around the hosting device.\n

    To use this sensor, the user must grant permission to the 'ambient-light-sensor' device sensor through the Permissions API.\n

    This feature may be blocked by a Permissions Policy set on your server." }, "ambientlightsensor.ambientlightsensor": { "url": "$MDN_URL$/web/api/ambientlightsensor/ambientlightsensor", @@ -588,7 +588,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The AmbientLightSensor() constructor creates a new AmbientLightSensor object, which returns the current light level or illuminance of the ambient light around the hosting device.", + "doc": "

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

    \n

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

    \n

    The AmbientLightSensor() constructor creates a new AmbientLightSensor object, which returns the current light level or illuminance of the ambient light around the hosting device.", "parameters": { "options": "Currently only one option is supported:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should be taken, meaning the number of times per second that reading event will be called. A whole number or decimal may be used, the latter for frequencies less than a second. The actual reading frequency depends on the device hardware and consequently may be less than requested.\n

    \n
    " }, @@ -606,7 +606,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The illuminance read-only property of the AmbientLightSensor interface returns the current light level in lux of the ambient light level around the hosting device." + "doc": "

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

    \n

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

    \n

    The illuminance read-only property of the AmbientLightSensor interface returns the current light level in lux of the ambient light level around the hosting device." }, "analysernode": { "url": "$MDN_URL$/web/api/analysernode", @@ -967,7 +967,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The commitStyles() method of the Web Animations API's Animation interface writes the computed values of the animation's current styles into its target element's style attribute.\n

    It is primarily used to write the styles for the final state of an animation into the target element, so that the styling persists after the animation ends.", + "doc": "The commitStyles() method of the Web Animations API's Animation interface writes the computed values of the animation's current styles into its target element's style attribute.\n

    It is primarily used to write the styles for the final state of an animation into the target element, so that the styling persists after the animation ends.", "returns": "None (undefined)." }, "animation.currenttime": { @@ -1096,7 +1096,8 @@ "Firefox": "142", "FirefoxAndroid": "142", "Opera": "118", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "doc": "The overallProgress read-only property of the Animation interface returns a number between 0 and 1 indicating the animation's overall progress towards its finished state. This is the overall progress across all of the animation's iterations, not each individual iteration.\n

    overallProgress works consistently across all animations, regardless of the type of timeline." }, @@ -1395,7 +1396,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "The AnimationEffect interface of the Web Animations API is an interface representing animation effects.\n

    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." + "doc": "The AnimationEffect interface of the Web Animations API is an interface representing animation effects.\n

    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." }, "animationeffect.getcomputedtiming": { "url": "$MDN_URL$/web/api/animationeffect/getcomputedtiming", @@ -1441,7 +1442,7 @@ "highDate": "2022-09-24" }, "doc": "The AnimationEffect.getTiming() method of the AnimationEffect interface returns an object containing the timing properties for the Animation Effect.\n

    \n

    Note:\nSeveral of the timing properties returned by getTiming() may take on the placeholder value \"auto\". To obtain resolved values for use in timing computations, instead use AnimationEffect.getComputedTiming().\n

    In the future, \"auto\" or similar values might be added to the types of more timing properties, and new types of AnimationEffect might resolve \"auto\" to different values.\n

    ", - "returns": "An object containing the following properties:\n
    \n
    delay
    \n
    \n

    The number of milliseconds of delay before the start of the effect.\n

    (See also animation-delay.)\n

    \n
    direction
    \n
    \n

    \"normal\", \"reverse\", \"alternate\", or \"alternate-reverse\".\n

    Indicates whether the effect runs forwards (\"normal\"), backwards (\"reverse\"), switches direction\nafter each iteration (\"alternate\"), or runs backwards and switches direction after each iteration\n(\"alternate-reverse\").\n

    (See also animation-direction.)\n

    \n
    duration
    \n
    \n

    A number of milliseconds or the string \"auto\".\n

    Indicates the time one iteration of the animation takes to complete.\n

    The meaning of \"auto\" may differ depending on the type of effect; for KeyframeEffect, \"auto\" is the same as 0.\n

    (See also animation-duration.)\n

    \n
    easing
    \n
    \n

    A string representing an <easing-function> describing the rate of change of the effect over time.\n

    (See also animation-timing-function.)\n

    \n
    endDelay
    \n
    \n

    The number of milliseconds of delay after the end of the effect.\n

    This is primarily of use when sequencing animations based on the end time of another animation.\n

    \n
    fill
    \n
    \n

    \"none\", \"forwards\", \"backwards\", \"both\", or \"auto\".\n

    Indicates whether the effect is reflected by its target(s) prior to playing\n(\"backwards\"), retained after the effect has completed (\"forwards\"), \"both\", or\nneither (\"none\").\n

    The meaning of \"auto\" may differ depending on the type of effect; for\nKeyframeEffect, \"auto\" is the same as \"none\".\n

    (See also animation-fill-mode.)\n

    \n
    iterations
    \n
    \n

    The number of times the effect will repeat. A value of Infinity indicates that\nthe effect repeats indefinitely.\n

    (See also animation-iteration-count.)\n

    \n
    iterationStart
    \n
    \n

    A number indicating at what point in the iteration the effect starts. For example, an effect with\nan iterationStart of 0.5 and 2 iterations would start halfway through its first iteration\nand end halfway through a third iteration.\n

    \n
    " + "returns": "An object containing the following properties:\n
    \n
    delay
    \n
    \n

    The number of milliseconds of delay before the start of the effect.\n

    (See also animation-delay.)\n

    \n
    direction
    \n
    \n

    \"normal\", \"reverse\", \"alternate\", or \"alternate-reverse\".\n

    Indicates whether the effect runs forwards (\"normal\"), backwards (\"reverse\"), switches direction\nafter each iteration (\"alternate\"), or runs backwards and switches direction after each iteration\n(\"alternate-reverse\").\n

    (See also animation-direction.)\n

    \n
    duration
    \n
    \n

    A number of milliseconds or the string \"auto\".\n

    Indicates the time one iteration of the animation takes to complete.\n

    The meaning of \"auto\" may differ depending on the type of effect; for KeyframeEffect, \"auto\" is the same as 0.\n

    (See also animation-duration.)\n

    \n
    easing
    \n
    \n

    A string representing an <easing-function> describing the rate of change of the effect over time.\n

    (See also animation-timing-function.)\n

    \n
    endDelay
    \n
    \n

    The number of milliseconds of delay after the end of the effect.\n

    This is primarily of use when sequencing animations based on the end time of another animation.\n

    \n
    fill
    \n
    \n

    \"none\", \"forwards\", \"backwards\", \"both\", or \"auto\".\n

    Indicates whether the effect is reflected by its target(s) prior to playing\n(\"backwards\"), retained after the effect has completed (\"forwards\"), \"both\", or\nneither (\"none\").\n

    The meaning of \"auto\" may differ depending on the type of effect; for\nKeyframeEffect, \"auto\" is the same as \"none\".\n

    (See also animation-fill-mode.)\n

    \n
    iterations
    \n
    \n

    The number of times the effect will repeat. A value of Infinity indicates that\nthe effect repeats indefinitely.\n

    (See also animation-iteration-count.)\n

    \n
    iterationStart
    \n
    \n

    A number indicating at what point in the iteration the effect starts. For example, an effect with\nan iterationStart of 0.5 and 2 iterations would start halfway through its first iteration\nand end halfway through a third iteration.\n

    \n
    " }, "animationeffect.updatetiming": { "url": "$MDN_URL$/web/api/animationeffect/updatetiming", @@ -1492,7 +1493,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The AnimationEvent interface represents events providing information related to animations." + "doc": "The AnimationEvent interface represents events providing information related to animations." }, "animationevent.animationevent": { "url": "$MDN_URL$/web/api/animationevent/animationevent", @@ -1517,7 +1518,7 @@ "doc": "The AnimationEvent() constructor returns a new AnimationEvent object, representing an event in relation with an animation.", "parameters": { "type": "A string with the name of the type of the AnimationEvent.\nIt is case-sensitive and browsers set it to animationstart, animationend, or animationiteration.", - "options": "An object that, in addition of the properties defined in Event(), has the following properties:\n
    \n
    animationName Optional
    \n
    \n

    A string containing the value of the animation-name CSS property associated with the transition. It defaults to \"\".\n

    \n
    elapsedTime Optional
    \n
    \n

    A float giving the amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused.\nFor an animationstart event, elapsedTime is 0.0 unless there was a negative value for animation-delay,\nin which case the event will be fired with elapsedTime containing (-1 * delay). It defaults to 0.0.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string, starting with \"::\", containing the name of the pseudo-element the animation runs on. If the animation doesn't run on a pseudo-element but on the element itself, specify an empty string: \"\". It defaults to \"\".\n

    \n
    " + "options": "An object that, in addition of the properties defined in Event(), has the following properties:\n
    \n
    animationName Optional
    \n
    \n

    A string containing the value of the animation-name CSS property associated with the transition. It defaults to \"\".\n

    \n
    elapsedTime Optional
    \n
    \n

    A float giving the amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused.\nFor an animationstart event, elapsedTime is 0.0 unless there was a negative value for animation-delay,\nin which case the event will be fired with elapsedTime containing (-1 * delay). It defaults to 0.0.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string, starting with \"::\", containing the name of the pseudo-element the animation runs on. If the animation doesn't run on a pseudo-element but on the element itself, specify an empty string: \"\". It defaults to \"\".\n

    \n
    " } }, "animationevent.animationname": { @@ -1540,7 +1541,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The AnimationEvent.animationName read-only property is a\nstring containing the value of the animation-name CSS\nproperty associated with the transition." + "doc": "The AnimationEvent.animationName read-only property is a\nstring containing the value of the animation-name CSS\nproperty associated with the transition." }, "animationevent.elapsedtime": { "url": "$MDN_URL$/web/api/animationevent/elapsedtime", @@ -1562,7 +1563,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The AnimationEvent.elapsedTime read-only property is a\nfloat giving the amount of time the animation has been running, in seconds,\nwhen this event fired, excluding any time the animation was paused. For an\nanimationstart event,\nelapsedTime is 0.0 unless there was a negative value for\nanimation-delay, in which case the event will be fired with\nelapsedTime containing (-1 * delay)." + "doc": "The AnimationEvent.elapsedTime read-only property is a\nfloat giving the amount of time the animation has been running, in seconds,\nwhen this event fired, excluding any time the animation was paused. For an\nanimationstart event,\nelapsedTime is 0.0 unless there was a negative value for\nanimation-delay, in which case the event will be fired with\nelapsedTime containing (-1 * delay)." }, "animationevent.pseudoelement": { "url": "$MDN_URL$/web/api/animationevent/pseudoelement", @@ -1584,7 +1585,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "The AnimationEvent.pseudoElement read-only property is a\nstring, starting with '::', containing the name of the pseudo-element the animation runs on.\nIf the animation doesn't run on a pseudo-element but on the element, an empty string: ''." + "doc": "The AnimationEvent.pseudoElement read-only property is a\nstring, starting with '::', containing the name of the pseudo-element the animation runs on.\nIf the animation doesn't run on a pseudo-element but on the element, an empty string: ''." }, "animationplaybackevent": { "url": "$MDN_URL$/web/api/animationplaybackevent", @@ -2188,7 +2189,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The AudioBufferSourceNode interface is an AudioScheduledSourceNode which represents an audio source consisting of in-memory audio data, stored in an AudioBuffer.\n

    This interface is especially useful for playing back audio which has particularly stringent timing accuracy requirements, such as for sounds that must match a specific rhythm and can be kept in memory rather than being played from disk or the network. To play sounds which require accurate timing but must be streamed from the network or played from disk, use a AudioWorkletNode to implement its playback.\n

    An AudioBufferSourceNode has no inputs and exactly one output, which has the same number of channels as the AudioBuffer indicated by its buffer property. If there's no buffer set—that is, if buffer is null—the output contains a single channel of silence (every sample is 0).\n

    An AudioBufferSourceNode can only be played once; after each call to start(), you have to create a new node if you want to play the same sound again. Fortunately, these nodes are very inexpensive to create, and the actual AudioBuffers can be reused for multiple plays of the sound. Indeed, you can use these nodes in a \"fire and forget\" manner: create the node, call start() to begin playing the sound, and don't even bother to hold a reference to it. It will automatically be garbage-collected at an appropriate time, which won't be until sometime after the sound has finished playing.\n

    Multiple calls to stop() are allowed. The most recent call replaces the previous one, if the AudioBufferSourceNode has not already reached the end of the buffer.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs0
    Number of outputs1
    Channel countdefined by the associated AudioBuffer
    " + "doc": "The AudioBufferSourceNode interface is an AudioScheduledSourceNode which represents an audio source consisting of in-memory audio data, stored in an AudioBuffer.\n

    This interface is especially useful for playing back audio which has particularly stringent timing accuracy requirements, such as for sounds that must match a specific rhythm and can be kept in memory rather than being played from disk or the network. To play sounds which require accurate timing but must be streamed from the network or played from disk, use an AudioWorkletNode to implement its playback.\n

    An AudioBufferSourceNode has no inputs and exactly one output, which has the same number of channels as the AudioBuffer indicated by its buffer property. If there's no buffer set—that is, if buffer is null—the output contains a single channel of silence (every sample is 0).\n

    An AudioBufferSourceNode can only be played once; after each call to start(), you have to create a new node if you want to play the same sound again. Fortunately, these nodes are very inexpensive to create, and the actual AudioBuffers can be reused for multiple plays of the sound. Indeed, you can use these nodes in a \"fire and forget\" manner: create the node, call start() to begin playing the sound, and don't even bother to hold a reference to it. It will automatically be garbage-collected at an appropriate time, which won't be until sometime after the sound has finished playing.\n

    Multiple calls to stop() are allowed. The most recent call replaces the previous one, if the AudioBufferSourceNode has not already reached the end of the buffer.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs0
    Number of outputs1
    Channel countdefined by the associated AudioBuffer
    " }, "audiobuffersourcenode.audiobuffersourcenode": { "url": "$MDN_URL$/web/api/audiobuffersourcenode/audiobuffersourcenode", @@ -2373,7 +2374,7 @@ "parameters": { "when": "The time, in seconds, at which the sound should begin to play, in the same time\ncoordinate system used by the AudioContext. If when is\nless than (AudioContext.currentTime, or if it's 0, the sound begins to\nplay at once. The default value is 0.", "offset": "An offset, specified as the number of seconds in the same time coordinate system as\nthe AudioContext, to the time within the audio buffer that playback\nshould begin. For example, to start playback halfway through a 10-second audio clip,\noffset should be 5. The default value, 0, will begin playback at the\nbeginning of the audio buffer, and offsets past the end of the audio which will be\nplayed (based on the audio buffer's duration\nand/or the loopEnd property) are\nsilently clamped to the maximum value allowed. The computation of the offset into the\nsound is performed using the sound buffer's natural sample rate, rather than the\ncurrent playback rate, so even if the sound is playing at twice its normal speed, the\nmidway point through a 10-second audio buffer is still 5.", - "duration": "The duration of the sound to be played, specified in seconds. If this parameter\nisn't specified, the sound plays until it reaches its natural conclusion or is stopped\nusing the stop() method. Using this\nparameter is functionally identical to calling start(when, offset) and\nthen calling stop(when+duration)." + "duration": "The duration of the audio data to be played, specified as seconds of total buffer content.\nIf this parameter isn't specified, the sound plays until it reaches its natural conclusion or\nis stopped using the stop() method. The\nvalue is independent of the AudioBufferSourceNode.playbackRate, so e.g., a\nduration of 2 seconds with a playbackRate of 2 will play 2 seconds of the source,\nproducing a 1 second audio output." }, "returns": "None (undefined).", "throws": { @@ -2652,7 +2653,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The setSinkId() method of the AudioContext interface sets the output audio device for the AudioContext. If a sink ID is not explicitly set, the default system audio output device will be used.\n

    To set the audio device to a device different than the default one, the developer needs permission to access to audio devices. If required, the user can be prompted to grant the required permission via a MediaDevices.getUserMedia() call.\n

    In addition, this feature may be blocked by a speaker-selection Permissions Policy.", + "doc": "

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

    \n

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

    \n

    The setSinkId() method of the AudioContext interface sets the output audio device for the AudioContext. If a sink ID is not explicitly set, the default system audio output device will be used.\n

    To set the audio device to a device different than the default one, the developer needs permission to access to audio devices. If required, the user can be prompted to grant the required permission via a MediaDevices.getUserMedia() call.\n

    In addition, this feature may be blocked by a speaker-selection Permissions Policy.", "parameters": { "sinkId": "The sink ID of the device you want to set as the output audio device. This can take one of the following value types:\n

    \n
    String
    \n
    \n

    A string representing the sink ID, retrieved for example via the deviceId property of the MediaDeviceInfo objects returned by MediaDevices.enumerateDevices().\n

    \n
    AudioSinkOptions
    \n
    \n

    An object representing different options for a sink ID. Currently this takes a single property, type, with a value of none. Setting this parameter causes the audio to be processed without being played through any audio output device. This is a useful option to minimize power consumption when you don't need playback along with processing.\n

    \n
    " }, @@ -2678,7 +2679,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The sinkId read-only property of the\nAudioContext interface returns the sink ID of the current output audio device." + "doc": "

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

    \n

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

    \n

    The sinkId read-only property of the\nAudioContext interface returns the sink ID of the current output audio device." }, "audiocontext.suspend": { "url": "$MDN_URL$/web/api/audiocontext/suspend", @@ -2972,7 +2973,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioDecoder interface of the WebCodecs API decodes chunks of audio." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioDecoder interface of the WebCodecs API decodes chunks of audio." }, "audiodecoder.audiodecoder": { "url": "$MDN_URL$/web/api/audiodecoder/audiodecoder", @@ -2991,7 +2992,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioDecoder() constructor creates a new AudioDecoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the AudioDecoder.state set to \"unconfigured\".", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioDecoder() constructor creates a new AudioDecoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the AudioDecoder.state set to \"unconfigured\".", "parameters": { "init": "A dictionary object containing two required callbacks.\n

    \n
    output
    \n
    \n

    A callback which is passed a single argument of an AudioData object.\n

    \n
    error
    \n
    \n

    A callback which is passed a single argument of the error that has been thrown.\n

    \n
    " } @@ -3013,7 +3014,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the AudioDecoder interface ends all pending work and releases system resources.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the AudioDecoder interface ends all pending work and releases system resources.", "returns": "None (undefined)." }, "audiodecoder.configure": { @@ -3033,7 +3034,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the AudioDecoder interface enqueues a control message to configure the audio decoder for decoding chunks.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the AudioDecoder interface enqueues a control message to configure the audio decoder for decoding chunks.", "parameters": { "config": "A dictionary object containing the following members:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string. See \"codecs\" parameter for details on codec string construction.\n

    \n
    sampleRate
    \n
    \n

    An integer representing the number of frame samples per second.\n

    \n
    numberOfChannels
    \n
    \n

    An integer representing the number of audio channels.\n

    \n
    description Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView containing a sequence of codec specific bytes, commonly known as extradata.\n

    \n
    " }, @@ -3061,7 +3062,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the AudioDecoder interface enqueues a control message to decode a given chunk of audio.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the AudioDecoder interface enqueues a control message to decode a given chunk of audio.", "parameters": { "chunk": "An EncodedAudioChunk object representing a chunk of encoded audio." }, @@ -3088,7 +3089,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decodeQueueSize read-only property of the AudioDecoder interface returns the number of pending decode requests in the queue." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decodeQueueSize read-only property of the AudioDecoder interface returns the number of pending decode requests in the queue." }, "audiodecoder.flush": { "url": "$MDN_URL$/web/api/audiodecoder/flush", @@ -3107,7 +3108,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the AudioDecoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the AudioDecoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Returned if the Promise is rejected because the state is not configured." @@ -3130,7 +3131,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the AudioDecoder interface checks if the given config is supported (that is, if AudioDecoder objects can be successfully configured with the given config).", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the AudioDecoder interface checks if the given config is supported (that is, if AudioDecoder objects can be successfully configured with the given config).", "parameters": { "config": "The dictionary object accepted by AudioDecoder.configure" }, @@ -3156,7 +3157,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the AudioDecoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the AudioDecoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", "returns": "None (undefined)." }, "audiodecoder.state": { @@ -3176,7 +3177,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the AudioDecoder interface returns the current state of the underlying codec." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the AudioDecoder interface returns the current state of the underlying codec." }, "audiodestinationnode": { "url": "$MDN_URL$/web/api/audiodestinationnode", @@ -3239,7 +3240,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioEncoder interface of the WebCodecs API encodes AudioData objects." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioEncoder interface of the WebCodecs API encodes AudioData objects." }, "audioencoder.audioencoder": { "url": "$MDN_URL$/web/api/audioencoder/audioencoder", @@ -3258,9 +3259,9 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioEncoder() constructor creates a new AudioEncoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the AudioEncoder.state set to \"unconfigured\".", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The AudioEncoder() constructor creates a new AudioEncoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the AudioEncoder.state set to \"unconfigured\".", "parameters": { - "init": "An object containing two required callbacks.\n

    \n
    output
    \n
    \n

    A callback which takes a EncodedAudioChunk object as the first argument, and an optional metadata object as the second. The metadata object has one member, decoderConfig which has an object as its value containing:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string.\n

    \n
    sampleRate
    \n
    \n

    An integer representing the number of frame samples per second.\n

    \n
    numberOfChannels
    \n
    \n

    An integer representing the number of audio channels.\n

    \n
    description Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView containing a sequence of codec specific bytes, commonly known as extradata.\n

    \n
    \n
    \n
    error
    \n
    \n

    A callback which takes an Error object as its only argument.\n

    \n
    " + "init": "An object containing two required callbacks.\n
    \n
    output
    \n
    \n

    A callback which takes an EncodedAudioChunk object as the first argument, and an optional metadata object as the second. The metadata object has one member, decoderConfig which has an object as its value containing:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string.\n

    \n
    sampleRate
    \n
    \n

    An integer representing the number of frame samples per second.\n

    \n
    numberOfChannels
    \n
    \n

    An integer representing the number of audio channels.\n

    \n
    description Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView containing a sequence of codec specific bytes, commonly known as extradata.\n

    \n
    \n
    \n
    error
    \n
    \n

    A callback which takes an Error object as its only argument.\n

    \n
    " } }, "audioencoder.close": { @@ -3280,7 +3281,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the AudioEncoder interface ends all pending work and releases system resources.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the AudioEncoder interface ends all pending work and releases system resources.", "returns": "None (undefined)." }, "audioencoder.configure": { @@ -3300,7 +3301,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the AudioEncoder interface enqueues a control message to configure the audio encoder for encoding chunks.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the AudioEncoder interface enqueues a control message to configure the audio encoder for encoding chunks.", "parameters": { "config": "A dictionary object containing the following members:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string. See \"codecs\" parameter for details on codec string construction.\n

    \n
    sampleRate
    \n
    \n

    An integer representing the number of frame samples per second.\n

    \n
    numberOfChannels
    \n
    \n

    An integer representing the number of audio channels.\n

    \n
    bitrate Optional
    \n
    \n

    An integer representing the bitrate.\n

    \n
    bitrateMode Optional
    \n
    \n

    An enumerated value that defines the bitrate mode the encoder should use. Possible values are:\n

    \n
    \"constant\"
    \n
    \n

    Forces an audio encoder to maintain the same bitrate, regardless of the audio content. This can be useful when a predictable bandwidth consumption is preferable.\n

    \n
    \"variable\" (default)
    \n
    \n

    Allows an audio encoder to increase or lower its bitrate according to the content of the audio it is encoding, in order to preserve bandwidth/binary-size, while still maintaining a target quality. For example, an encoder might lower its bitrate when encoding silence, and revert to a full bitrate when encoding speech.\n

    \n
    \n

    Specific codec encoder implementations may use slightly different terminology (for example, CBR vs VBR for Opus), but they should all map to the general concept of \"constant\" versus \"variable\" bitrate.\n

    \n
    opus Optional
    \n
    \n

    Specifies codec configuration options specific to the Opus codec. Its value is an OpusEncoderConfig object, the possible properties of which are as follows:\n

    \n
    application Optional
    \n
    \n

    An enumerated value that specifies the encoder's intended application type. Possible values are:\n

    \n
    audio (default)
    \n
    \n

    Process the signal faithfully to the original input.\n

    \n
    lowdelay
    \n
    \n

    When processing the signal, configure the minimum possible encoding delay by disabling certain modes of operation.\n

    \n
    voip
    \n
    \n

    Process signal for improved speech intelligibility.\n

    \n
    \n
    \n
    complexity Optional
    \n
    \n

    A number that defines the encoder's computational complexity, based on the aspects described in section RFC6716, 2.1.5. — Complexity. The valid range is 0 to 10, with 10 representing the highest complexity. If no value is specified, the default value is platform-specific, with the specification recommending 5 for mobile platforms, and 9 for all other platforms.\n

    \n
    format Optional
    \n
    \n

    An enumerated value that specifies the format in which the encoder should output EncodedAudioChunks. Possible values are:\n

    \n
    opus (default)
    \n
    \n

    Output EncodedAudioChunks in Opus format. In this case, no metadata are necessary to decode the encoded audio stream.\n

    \n
    ogg
    \n
    \n

    Output EncodedAudioChunks in Ogg format. In this case, no metadata are necessary to decode the encoded audio stream. In this case, the metadata of the encoded audio stream are provided in the decoder configuration — via the description property of the config object passed into AudioDecoder.configure().\n

    \n
    \n
    \n
    frameDuration Optional
    \n
    \n

    A number that defines the frame duration, in microseconds, of EncodedAudioChunks outputted by the encoder. If not specified, frameDuration defaults to 20000.\n

    \n
    packetlossperc Optional
    \n
    \n

    A number that defines the encoder's expected packet loss percentage. The valid range is 0 to 100. If not specified, packetlossperc defaults to 0.\n

    \n
    signal Optional
    \n
    \n

    An enumerated value that specifies the default value for the type of audio signal being encoded. Possible values are:\n

    \n
    auto (default)
    \n
    \n

    The audio signal is not specified to be of a particular type.\n

    \n
    music
    \n
    \n

    The audio signal is music.\n

    \n
    voice
    \n
    \n

    The audio signal is voice or speech.\n

    \n
    \n
    \n
    usedtx Optional
    \n
    \n

    A boolean value that specifies whether the encoder uses Discontinuous Transmission (DTX), which reduces the bitrate during silence or background noise. When DTX is enabled, only one frame is encoded every 400 milliseconds. If not specified, usedtx defaults to false.\n

    \n
    useinbandfec Optional
    \n
    \n

    A boolean value that specifies whether the encoder provides Opus in-band Forward Error Correction (FEC). This results in packets that are determined to contain perceptually important speech information — such as onsets or transients — to be re-encoded at a lower bitrate and added to a subsequent packet. If not specified, useinbandfec defaults to false.\n

    \n
    \n
    \n
    " }, @@ -3328,7 +3329,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encode() method of the AudioEncoder interface enqueues a control message to encode a given AudioData object.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encode() method of the AudioEncoder interface enqueues a control message to encode a given AudioData object.", "parameters": { "data": "An AudioData object." }, @@ -3355,7 +3356,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encodeQueueSize read-only property of the AudioEncoder interface returns the number of pending encode requests in the queue." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encodeQueueSize read-only property of the AudioEncoder interface returns the number of pending encode requests in the queue." }, "audioencoder.flush": { "url": "$MDN_URL$/web/api/audioencoder/flush", @@ -3374,7 +3375,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the AudioEncoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the AudioEncoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if the Promise is rejected because the state is not \"configured\"." @@ -3397,7 +3398,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the AudioEncoder interface checks if the given config is supported (that is, if AudioEncoder objects can be successfully configured with the given config).", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the AudioEncoder interface checks if the given config is supported (that is, if AudioEncoder objects can be successfully configured with the given config).", "parameters": { "config": "The dictionary object accepted by AudioEncoder.configure" }, @@ -3423,7 +3424,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the AudioEncoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the AudioEncoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", "returns": "None (undefined)." }, "audioencoder.state": { @@ -3443,7 +3444,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the AudioEncoder interface returns the current state of the underlying codec." + "doc": "

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

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the AudioEncoder interface returns the current state of the underlying codec." }, "audiolistener": { "url": "$MDN_URL$/web/api/audiolistener", @@ -4591,7 +4592,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n

    The AudioWorklet interface of the Web Audio API is used to supply custom audio processing scripts that execute in a separate thread to provide very low latency audio processing.\n

    The worklet's code is run in the AudioWorkletGlobalScope global execution context, using a separate Web Audio thread which is shared by the worklet and other audio nodes.\n

    Access the audio context's instance of AudioWorklet through the BaseAudioContext.audioWorklet property." + "doc": "

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

    \n

    The AudioWorklet interface of the Web Audio API is used to supply custom audio processing scripts that execute in a separate thread to provide very low latency audio processing.\n

    The worklet's code is run in the AudioWorkletGlobalScope global execution context, using a separate Web Audio thread which is shared by the worklet and other audio nodes.\n

    Access the audio context's instance of AudioWorklet through the BaseAudioContext.audioWorklet property." }, "audioworklet.port": { "url": "$MDN_URL$/web/api/audioworklet/port", @@ -4759,7 +4760,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n
    \n

    Note:\nAlthough the interface is available outside secure contexts, the BaseAudioContext.audioWorklet property is not, thus custom AudioWorkletProcessors cannot be defined outside them.\n

    \n

    The AudioWorkletNode interface of the Web Audio API represents a base class for a user-defined AudioNode, which can be connected to an audio routing graph along with other nodes. It has an associated AudioWorkletProcessor, which does the actual audio processing in a Web Audio rendering thread." + "doc": "

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

    \n
    \n

    Note:\nAlthough the interface is available outside secure contexts, the BaseAudioContext.audioWorklet property is not, thus custom AudioWorkletProcessors cannot be defined outside them.\n

    \n

    The AudioWorkletNode interface of the Web Audio API represents a base class for a user-defined AudioNode, which can be connected to an audio routing graph along with other nodes. It has an associated AudioWorkletProcessor, which does the actual audio processing in a Web Audio rendering thread." }, "audioworkletnode.audioworkletnode": { "url": "$MDN_URL$/web/api/audioworkletnode/audioworkletnode", @@ -4781,7 +4782,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n

    The AudioWorkletNode()\nconstructor creates a new AudioWorkletNode object, which represents an\nAudioNode that uses a JavaScript function to perform custom audio\nprocessing.", + "doc": "

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

    \n

    The AudioWorkletNode()\nconstructor creates a new AudioWorkletNode object, which represents an\nAudioNode that uses a JavaScript function to perform custom audio\nprocessing.", "parameters": { "context": "The BaseAudioContext instance this node will be associated with.", "name": "A string, which represents the name of the AudioWorkletProcessor this\nnode will be based on. A processor with the provided name must first be registered\nusing the AudioWorkletGlobalScope.registerProcessor() method.", @@ -4812,7 +4813,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n

    The read-only parameters property of the\nAudioWorkletNode interface returns the associated\nAudioParamMap — that is, a Map-like collection of\nAudioParam objects. They are instantiated during creation of the\nunderlying AudioWorkletProcessor according to its\nparameterDescriptors static\ngetter." + "doc": "

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

    \n

    The read-only parameters property of the\nAudioWorkletNode interface returns the associated\nAudioParamMap — that is, a Map-like collection of\nAudioParam objects. They are instantiated during creation of the\nunderlying AudioWorkletProcessor according to its\nparameterDescriptors static\ngetter." }, "audioworkletnode.port": { "url": "$MDN_URL$/web/api/audioworkletnode/port", @@ -4834,7 +4835,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n

    The read-only port property of the\nAudioWorkletNode interface returns the associated\nMessagePort. It can be used to communicate between the node and its\nassociated AudioWorkletProcessor.\n

    \n

    Note:\nThe port at the other end of the channel is\navailable under the port property of the\nprocessor.\n

    " + "doc": "

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

    \n

    The read-only port property of the\nAudioWorkletNode interface returns the associated\nMessagePort. It can be used to communicate between the node and its\nassociated AudioWorkletProcessor.\n

    \n

    Note:\nThe port at the other end of the channel is\navailable under the port property of the\nprocessor.\n

    " }, "audioworkletprocessor": { "url": "$MDN_URL$/web/api/audioworkletprocessor", @@ -4940,7 +4941,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The AuthenticatorAssertionResponse interface of the Web Authentication API contains a digital signature from the private key of a particular WebAuthn credential. The relying party's server can verify this signature to authenticate a user, for example when they sign in.\n

    An AuthenticatorAssertionResponse object instance is available in the response property of a PublicKeyCredential object returned by a successful navigator.credentials.get() call.\n

    This interface inherits from AuthenticatorResponse.\n

    \n

    Note:\nThis interface is restricted to top-level contexts. Use from within an <iframe> element will not have any effect.\n

    " + "doc": "

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

    \n

    The AuthenticatorAssertionResponse interface of the Web Authentication API contains a digital signature from the private key of a particular WebAuthn credential. The relying party's server can verify this signature to authenticate a user, for example when they sign in.\n

    An AuthenticatorAssertionResponse object instance is available in the response property of a PublicKeyCredential object returned by a successful navigator.credentials.get() call.\n

    This interface inherits from AuthenticatorResponse.\n

    \n

    Note:\nThis interface is restricted to top-level contexts. Use from within an <iframe> element will not have any effect.\n

    " }, "authenticatorassertionresponse.authenticatordata": { "url": "$MDN_URL$/web/api/authenticatorassertionresponse/authenticatordata", @@ -4962,7 +4963,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The authenticatorData property of the AuthenticatorAssertionResponse interface returns an ArrayBuffer containing information from the authenticator such as the Relying Party ID Hash (rpIdHash), a signature counter, test of user presence, user verification flags, and any extensions processed by the authenticator." + "doc": "

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

    \n

    The authenticatorData property of the AuthenticatorAssertionResponse interface returns an ArrayBuffer containing information from the authenticator such as the Relying Party ID Hash (rpIdHash), a signature counter, test of user presence, user verification flags, and any extensions processed by the authenticator." }, "authenticatorassertionresponse.signature": { "url": "$MDN_URL$/web/api/authenticatorassertionresponse/signature", @@ -4984,7 +4985,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The signature read-only property of the\nAuthenticatorAssertionResponse interface is an ArrayBuffer\nobject which is the signature of the authenticator for both\nAuthenticatorAssertionResponse.authenticatorData and a SHA-256 hash of\nthe client data\n(AuthenticatorAssertionResponse.clientDataJSON).\n

    This signature will be sent to the server for control, as part of the response. It\nprovides the proof that an authenticator does possess the private key which was used for\nthe credential's generation." + "doc": "

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

    \n

    The signature read-only property of the\nAuthenticatorAssertionResponse interface is an ArrayBuffer\nobject which is the signature of the authenticator for both\nAuthenticatorAssertionResponse.authenticatorData and a SHA-256 hash of\nthe client data\n(AuthenticatorAssertionResponse.clientDataJSON).\n

    This signature will be sent to the server for control, as part of the response. It\nprovides the proof that an authenticator does possess the private key which was used for\nthe credential's generation." }, "authenticatorassertionresponse.userhandle": { "url": "$MDN_URL$/web/api/authenticatorassertionresponse/userhandle", @@ -5006,7 +5007,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The userHandle read-only property of the AuthenticatorAssertionResponse interface is an ArrayBuffer object providing an opaque identifier for the given user. Such an identifier can be used by the relying party's server to link the user account with its corresponding credentials and other data.\n

    This value is specified as user.id in the options passed to the originating navigator.credentials.create() call." + "doc": "

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

    \n

    The userHandle read-only property of the AuthenticatorAssertionResponse interface is an ArrayBuffer object providing an opaque identifier for the given user. Such an identifier can be used by the relying party's server to link the user account with its corresponding credentials and other data.\n

    This value is specified as user.id in the options passed to the originating navigator.credentials.create() call." }, "authenticatorattestationresponse": { "url": "$MDN_URL$/web/api/authenticatorattestationresponse", @@ -5028,7 +5029,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The AuthenticatorAttestationResponse interface of the Web Authentication API is the result of a WebAuthn credential registration. It contains information about the credential that the server needs to perform WebAuthn assertions, such as its credential ID and public key.\n

    An AuthenticatorAttestationResponse object instance is available in the response property of a PublicKeyCredential object returned by a successful CredentialsContainer.create() call.\n

    This interface inherits from AuthenticatorResponse.\n

    \n

    Note:\nThis interface is restricted to top-level contexts. Use of its features from within an <iframe> element will not have any effect.\n

    " + "doc": "

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

    \n

    The AuthenticatorAttestationResponse interface of the Web Authentication API is the result of a WebAuthn credential registration. It contains information about the credential that the server needs to perform WebAuthn assertions, such as its credential ID and public key.\n

    An AuthenticatorAttestationResponse object instance is available in the response property of a PublicKeyCredential object returned by a successful CredentialsContainer.create() call.\n

    This interface inherits from AuthenticatorResponse.\n

    \n

    Note:\nThis interface is restricted to top-level contexts. Use of its features from within an <iframe> element will not have any effect.\n

    " }, "authenticatorattestationresponse.attestationobject": { "url": "$MDN_URL$/web/api/authenticatorattestationresponse/attestationobject", @@ -5050,7 +5051,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The attestationObject property of the\nAuthenticatorAttestationResponse interface returns an\nArrayBuffer containing the new public key, as well as signature over the\nentire attestationObject with a private key that is stored in the\nauthenticator when it is manufactured.\n

    As part of the CredentialsContainer.create() call, an authenticator will\ncreate a new key pair as well as an attestationObject for that key pair. The public key\nthat corresponds to the private key that has created the attestation signature is well\nknown; however, there are various well known attestation public key chains for different\necosystems (for example, Android or TPM attestations)." + "doc": "

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

    \n

    The attestationObject property of the\nAuthenticatorAttestationResponse interface returns an\nArrayBuffer containing the new public key, as well as signature over the\nentire attestationObject with a private key that is stored in the\nauthenticator when it is manufactured.\n

    As part of the CredentialsContainer.create() call, an authenticator will\ncreate a new key pair as well as an attestationObject for that key pair. The public key\nthat corresponds to the private key that has created the attestation signature is well\nknown; however, there are various well known attestation public key chains for different\necosystems (for example, Android or TPM attestations)." }, "authenticatorattestationresponse.getauthenticatordata": { "url": "$MDN_URL$/web/api/authenticatorattestationresponse/getauthenticatordata", @@ -5071,8 +5072,8 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "

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

    \n

    The getAuthenticatorData() method of the AuthenticatorAttestationResponse interface returns an ArrayBuffer containing the authenticator data contained within the AuthenticatorAttestationResponse.attestationObject property.\n

    This is a convenience function, created to allow easy access to the authenticator data without having to write extra parsing code to extract it from the attestationObject.", - "returns": "An ArrayBuffer with a ArrayBuffer.byteLength of at least 37 bytes, which contains the data structure explained in Authenticator data.\n

    This will be equivalent to the authenticator data contained within the AuthenticatorAttestationResponse.attestationObject property." + "doc": "

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

    \n

    The getAuthenticatorData() method of the AuthenticatorAttestationResponse interface returns an ArrayBuffer containing the authenticator data contained within the AuthenticatorAttestationResponse.attestationObject property.\n

    This is a convenience function, created to allow easy access to the authenticator data without having to write extra parsing code to extract it from the attestationObject.", + "returns": "An ArrayBuffer with a byteLength of at least 37 bytes, which contains the data structure explained in Authenticator data.\n

    This will be equivalent to the authenticator data contained within the AuthenticatorAttestationResponse.attestationObject property." }, "authenticatorattestationresponse.getpublickey": { "url": "$MDN_URL$/web/api/authenticatorattestationresponse/getpublickey", @@ -5093,7 +5094,7 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "

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

    \n

    The getPublicKey() method of the AuthenticatorAttestationResponse interface returns an ArrayBuffer containing the DER SubjectPublicKeyInfo of the new credential (see Subject Public Key Info), or null if this is not available.\n

    This is a convenience function, created to allow easy access to the public key. This key will need to be stored in order to verify future authentication operations (i.e., using navigator.credentials.get()).", + "doc": "

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

    \n

    The getPublicKey() method of the AuthenticatorAttestationResponse interface returns an ArrayBuffer containing the DER SubjectPublicKeyInfo of the new credential (see Subject Public Key Info), or null if this is not available.\n

    This is a convenience function, created to allow easy access to the public key. This key will need to be stored in order to verify future authentication operations (i.e., using navigator.credentials.get()).", "returns": "An ArrayBuffer containing the DER SubjectPublicKeyInfo of the new credential (see Subject Public Key Info), or null if this is not available." }, "authenticatorattestationresponse.getpublickeyalgorithm": { @@ -5115,7 +5116,7 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "

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

    \n

    The getPublicKeyAlgorithm() method of the AuthenticatorAttestationResponse interface returns a number that is equal to a COSE Algorithm Identifier, representing the cryptographic algorithm used for the new credential.\n

    This is a convenience function created to allow easy access to the algorithm type. This information will need to be stored in order to verify future authentication operations (i.e., using navigator.credentials.get()).", + "doc": "

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

    \n

    The getPublicKeyAlgorithm() method of the AuthenticatorAttestationResponse interface returns a number that is equal to a COSE Algorithm Identifier, representing the cryptographic algorithm used for the new credential.\n

    This is a convenience function created to allow easy access to the algorithm type. This information will need to be stored in order to verify future authentication operations (i.e., using navigator.credentials.get()).", "returns": "A number that is equal to a COSE Algorithm Identifier, representing the cryptographic algorithm used for the new credential." }, "authenticatorattestationresponse.gettransports": { @@ -5137,7 +5138,7 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "

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

    \n

    The getTransports() method of the AuthenticatorAttestationResponse interface returns an array of strings describing the different transports which may be used by the authenticator.\n

    Such transports may be USB, NFC, BLE, internal (applicable when the authenticator is not removable from the device), or a hybrid approach. Sites should not interpret this array but instead store it along with the rest of the credential information. In a subsequent navigator.credentials.get() call, the transports value(s) specified inside publicKey.allowCredentials should be set to the stored array value. This provides a hint to the browser as to which types of authenticators to try when making an assertion for this credential.", + "doc": "

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

    \n

    The getTransports() method of the AuthenticatorAttestationResponse interface returns an array of strings describing the different transports which may be used by the authenticator.\n

    Such transports may be USB, NFC, BLE, internal (applicable when the authenticator is not removable from the device), or a hybrid approach. Sites should not interpret this array but instead store it along with the rest of the credential information. In a subsequent navigator.credentials.get() call, the transports value(s) specified inside publicKey.allowCredentials should be set to the stored array value. This provides a hint to the browser as to which types of authenticators to try when making an assertion for this credential.", "returns": "An Array of strings representing the different transports supported by the authenticator, in lexicographical order.\nValues may include:\n

    \n
    \"ble\"
    \n
    \n

    The authenticator may be used over BLE (Bluetooth Low Energy).\n

    \n
    \"hybrid\"
    \n
    \n

    The authenticator can be used over a combination of (often separate) data transport and proximity mechanisms. This supports, for example, authentication on a desktop computer using a smartphone.\n

    \n
    \"internal\"
    \n
    \n

    The authenticator is specifically bound to the client device (cannot be removed).\n

    \n
    \"nfc\"
    \n
    \n

    The authenticator may be used over NFC (Near Field Communication).\n

    \n
    \"usb\"
    \n
    \n

    The authenticator can be contacted over USB.\n

    \n
    " }, "authenticatorresponse": { @@ -5160,7 +5161,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The AuthenticatorResponse interface of the Web Authentication API is the base interface for interfaces that provide a cryptographic root of trust for a key pair. The child interfaces include information from the browser such as the challenge origin and either may be returned from PublicKeyCredential.response." + "doc": "

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

    \n

    The AuthenticatorResponse interface of the Web Authentication API is the base interface for interfaces that provide a cryptographic root of trust for a key pair. The child interfaces include information from the browser such as the challenge origin and either may be returned from PublicKeyCredential.response." }, "authenticatorresponse.clientdatajson": { "url": "$MDN_URL$/web/api/authenticatorresponse/clientdatajson", @@ -5182,7 +5183,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

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

    \n

    The clientDataJSON property of the AuthenticatorResponse interface stores a JSON string in an\nArrayBuffer, representing the client data that was passed to navigator.credentials.create() or navigator.credentials.get(). This property is only accessed on one of the child objects of AuthenticatorResponse, specifically AuthenticatorAttestationResponse or AuthenticatorAssertionResponse." + "doc": "

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

    \n

    The clientDataJSON property of the AuthenticatorResponse interface stores a JSON string in an\nArrayBuffer, representing the client data that was passed to navigator.credentials.create() or navigator.credentials.get(). This property is only accessed on one of the child objects of AuthenticatorResponse, specifically AuthenticatorAttestationResponse or AuthenticatorAssertionResponse." }, "backgroundfetchevent": { "url": "$MDN_URL$/web/api/backgroundfetchevent", @@ -5497,7 +5498,7 @@ "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The match() method of the BackgroundFetchRegistration interface returns the first matching BackgroundFetchRecord.", "parameters": { "request": "The Request for which you are attempting to find records.\nThis can be a Request object or a URL.", - "options": "An object that sets options for the match operation. The available\noptions are:\n

    \n
    ignoreSearch Optional
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod Optional
    \n
    \n

    A boolean value. When true,\nprevents matching operations from validating the Request http method.\nIf false (the default) only GET and HEAD are allowed.\n

    \n
    ignoreVary Optional
    \n
    \n

    A boolean value. When true indicates that the Vary header should be ignored.\nIt defaults to false.\n

    \n
    " + "options": "An object that sets options for the match operation. The available\noptions are:\n
    \n
    ignoreSearch Optional
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod Optional
    \n
    \n

    A boolean value. When true,\nprevents matching operations from validating the Request http method.\nIf false (the default) only GET and HEAD are allowed.\n

    \n
    ignoreVary Optional
    \n
    \n

    A boolean value. When true indicates that the Vary header should be ignored.\nIt defaults to false.\n

    \n
    " }, "returns": "A Promise that resolves with the first BackgroundFetchRecord that matches\nthe request or undefined if no match is found.\n
    \n

    Note:\nBackgroundFetchRegistration.match() is basically identical to\nBackgroundFetchRegistration.matchAll(), except that rather than resolving with an array of\nall matching records, it resolves with the first matching record only.\n

    ", "throws": { @@ -5522,7 +5523,7 @@ "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The matchAll() method of the BackgroundFetchRegistration interface returns an array of matching BackgroundFetchRecord objects.", "parameters": { "request": "The Request for which you are attempting to find records.\nThis can be a Request object or a URL. If this parameter is omitted, all records are included in the result.", - "options": "An object that sets options for the match operation. The available\noptions are:\n

    \n
    ignoreSearch Optional
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod Optional
    \n
    \n

    A boolean value. When true,\nprevents matching operations from validating the Request http method.\nIf false (the default) only GET and HEAD are allowed.\n

    \n
    ignoreVary Optional
    \n
    \n

    A boolean value. When true indicates that the Vary header should be ignored.\nIt defaults to false.\n

    \n
    " + "options": "An object that sets options for the match operation. The available\noptions are:\n
    \n
    ignoreSearch Optional
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod Optional
    \n
    \n

    A boolean value. When true,\nprevents matching operations from validating the Request http method.\nIf false (the default) only GET and HEAD are allowed.\n

    \n
    ignoreVary Optional
    \n
    \n

    A boolean value. When true indicates that the Vary header should be ignored.\nIt defaults to false.\n

    \n
    " }, "returns": "A Promise that resolves with an array of all matching BackgroundFetchRecord objects.", "throws": { @@ -5672,7 +5673,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The BarcodeDetector interface of the Barcode Detection API allows detection of linear and two dimensional barcodes in images." + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The BarcodeDetector interface of the Barcode Detection API allows detection of linear and two dimensional barcodes in images." }, "barcodedetector.barcodedetector": { "url": "$MDN_URL$/web/api/barcodedetector/barcodedetector", @@ -5686,7 +5687,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The BarcodeDetector() constructor creates\na new BarcodeDetector object which detects linear and two-dimensional\nbarcodes in images.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The BarcodeDetector() constructor creates\na new BarcodeDetector object which detects linear and two-dimensional\nbarcodes in images.", "parameters": { "options": "An options object containing a series of BarcodeFormats to search for\nin the subsequent detect() calls. The\noptions are:\n

    \n
    formats Optional
    \n
    \n

    An Array of barcode formats as strings.\nIf not provided, detect() calls search for all supported formats.\nLimiting to specific formats is therefore recommended for performance reasons.\nTo see a full list of supported formats see the supported barcode format.\n

    \n
    " }, @@ -5706,7 +5707,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The detect() method of the\nBarcodeDetector interface returns a Promise which fulfills\nwith an Array of detected barcodes within an image.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The detect() method of the\nBarcodeDetector interface returns a Promise which fulfills\nwith an Array of detected barcodes within an image.", "parameters": { "imageBitmapSource": "Receives an image source as a parameter. This can be a HTMLImageElement, a SVGImageElement, a HTMLVideoElement, a HTMLCanvasElement, an ImageBitmap, an OffscreenCanvas, a VideoFrame, a Blob of type image or an ImageData object." }, @@ -5729,7 +5730,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The getSupportedFormats() static method\nof the BarcodeDetector interface returns a Promise which\nfulfills with an Array of supported barcode format types.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

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

    \n

    The getSupportedFormats() static method\nof the BarcodeDetector interface returns a Promise which\nfulfills with an Array of supported barcode format types.", "returns": "A Promise which fulfills with an Array of\nsupported barcode format types." }, "barprop": { @@ -5818,7 +5819,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

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

    \n

    The audioWorklet read-only property of the\nBaseAudioContext interface returns an instance of\nAudioWorklet that can be used for adding\nAudioWorkletProcessor-derived classes which implement custom audio\nprocessing." + "doc": "

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

    \n

    The audioWorklet read-only property of the\nBaseAudioContext interface returns an instance of\nAudioWorklet that can be used for adding\nAudioWorkletProcessor-derived classes which implement custom audio\nprocessing." }, "baseaudiocontext.createanalyser": { "url": "$MDN_URL$/web/api/baseaudiocontext/createanalyser", @@ -5918,7 +5919,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The createBufferSource() method of the BaseAudioContext\nInterface is used to create a new AudioBufferSourceNode, which can be\nused to play audio data contained within an AudioBuffer object.\nAudioBuffers are created using BaseAudioContext.createBuffer or returned by BaseAudioContext.decodeAudioData when it successfully decodes an audio track.\n

    \n

    Note:\nThe AudioBufferSourceNode()\nconstructor is the recommended way to create a AudioBufferSourceNode; see\nCreating an AudioNode.\n

    ", + "doc": "The createBufferSource() method of the BaseAudioContext\nInterface is used to create a new AudioBufferSourceNode, which can be\nused to play audio data contained within an AudioBuffer object.\nAudioBuffers are created using BaseAudioContext.createBuffer or returned by BaseAudioContext.decodeAudioData when it successfully decodes an audio track.\n
    \n

    Note:\nThe AudioBufferSourceNode()\nconstructor is the recommended way to create an AudioBufferSourceNode; see\nCreating an AudioNode.\n

    ", "returns": "An AudioBufferSourceNode." }, "baseaudiocontext.createchannelmerger": { @@ -6111,7 +6112,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The createIIRFilter() method of the BaseAudioContext interface creates an IIRFilterNode, which represents a general infinite impulse response (IIR) filter which can be configured to serve as various types of filter.\n
    \n

    Note:\nThe IIRFilterNode()\nconstructor is the recommended way to create a IIRFilterNode; see\nCreating an AudioNode.\n

    ", + "doc": "The createIIRFilter() method of the BaseAudioContext interface creates an IIRFilterNode, which represents a general infinite impulse response (IIR) filter which can be configured to serve as various types of filter.\n
    \n

    Note:\nThe IIRFilterNode()\nconstructor is the recommended way to create an IIRFilterNode; see\nCreating an AudioNode.\n

    ", "parameters": { "feedforward": "An array of floating-point values specifying the feedforward (numerator)\ncoefficients for the transfer function of the IIR filter. The maximum length of this\narray is 20, and at least one value must be nonzero.", "feedback": "An array of floating-point values specifying the feedback (denominator) coefficients\nfor the transfer function of the IIR filter. This array may have up to 20 members, the\nfirst of which must not be zero." @@ -6142,7 +6143,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The createOscillator() method of the BaseAudioContext\ninterface creates an OscillatorNode, a source representing a periodic\nwaveform. It basically generates a constant tone.\n
    \n

    Note:\nThe OscillatorNode()\nconstructor is the recommended way to create a OscillatorNode; see\nCreating an AudioNode.\n

    ", + "doc": "The createOscillator() method of the BaseAudioContext\ninterface creates an OscillatorNode, a source representing a periodic\nwaveform. It basically generates a constant tone.\n
    \n

    Note:\nThe OscillatorNode()\nconstructor is the recommended way to create an OscillatorNode; see\nCreating an AudioNode.\n

    ", "returns": "An OscillatorNode." }, "baseaudiocontext.createpanner": { @@ -6418,7 +6419,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The BatteryManager interface of the Battery Status API provides information about the system's battery charge level. The navigator.getBattery() method returns a promise that resolves with a BatteryManager interface.\n

    Since Chrome 103, the BatteryManager interface of Battery Status API only expose to secure context." + "doc": "

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

    \n

    The BatteryManager interface of the Battery Status API provides information about the system's battery charge level. The navigator.getBattery() method returns a promise that resolves with a BatteryManager interface.\n

    Since Chrome 103, the BatteryManager interface of Battery Status API only expose to secure context." }, "batterymanager.charging": { "url": "$MDN_URL$/web/api/batterymanager/charging", @@ -6434,7 +6435,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The charging read-only property of the BatteryManager interface is a Boolean value indicating whether or not the device's battery is currently being charged. When its value changes, the chargingchange event is fired.\n

    If the battery is charging or the user agent is unable to report the battery status information, this value is true. Otherwise, it is false." + "doc": "

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

    \n

    The charging read-only property of the BatteryManager interface is a Boolean value indicating whether or not the device's battery is currently being charged. When its value changes, the chargingchange event is fired.\n

    If the battery is charging or the user agent is unable to report the battery status information, this value is true. Otherwise, it is false." }, "batterymanager.chargingtime": { "url": "$MDN_URL$/web/api/batterymanager/chargingtime", @@ -6450,7 +6451,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The chargingTime read-only property of the BatteryManager interface indicates the amount of time, in seconds, that remain until the battery is fully charged, or 0 if the battery is already fully charged or the user agent is unable to report the battery status information.\nIf the battery is currently discharging, its value is Infinity.\nWhen its value changes, the chargingtimechange event is fired.\n

    \n

    Note:\nEven if the time returned is precise to the second,\nbrowsers round them to a higher interval\n(typically to the closest 15 minutes) for privacy reasons.\n

    " + "doc": "

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

    \n

    The chargingTime read-only property of the BatteryManager interface indicates the amount of time, in seconds, that remain until the battery is fully charged, or 0 if the battery is already fully charged or the user agent is unable to report the battery status information.\nIf the battery is currently discharging, its value is Infinity.\nWhen its value changes, the chargingtimechange event is fired.\n

    \n

    Note:\nEven if the time returned is precise to the second,\nbrowsers round them to a higher interval\n(typically to the closest 15 minutes) for privacy reasons.\n

    " }, "batterymanager.dischargingtime": { "url": "$MDN_URL$/web/api/batterymanager/dischargingtime", @@ -6466,7 +6467,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The dischargingTime read-only property of the BatteryManager interface indicates the amount of time, in seconds, that remains until the battery is fully discharged,\nor Infinity if the battery is currently charging rather than discharging or the user agent is unable to report the battery status information.\nWhen its value changes, the dischargingtimechange event is fired.\n

    \n

    Note:\nEven if the time returned is precise to the second, browsers round them to a higher\ninterval (typically to the closest 15 minutes) for privacy reasons.\n

    " + "doc": "

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

    \n

    The dischargingTime read-only property of the BatteryManager interface indicates the amount of time, in seconds, that remains until the battery is fully discharged,\nor Infinity if the battery is currently charging rather than discharging or the user agent is unable to report the battery status information.\nWhen its value changes, the dischargingtimechange event is fired.\n

    \n

    Note:\nEven if the time returned is precise to the second, browsers round them to a higher\ninterval (typically to the closest 15 minutes) for privacy reasons.\n

    " }, "batterymanager.level": { "url": "$MDN_URL$/web/api/batterymanager/level", @@ -6482,7 +6483,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

    The level read-only property of the BatteryManager interface indicates the current battery charge level as a value between 0.0 and 1.0.\nA value of 0.0 means the battery is empty and the system is about to be suspended.\nA value of 1.0 means the battery is full or the user agent is unable to report the battery status information.\nWhen its value changes, the levelchange event is fired." + "doc": "

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

    \n

    The level read-only property of the BatteryManager interface indicates the current battery charge level as a value between 0.0 and 1.0.\nA value of 0.0 means the battery is empty and the system is about to be suspended.\nA value of 1.0 means the battery is full or the user agent is unable to report the battery status information.\nWhen its value changes, the levelchange event is fired." }, "beforeinstallpromptevent": { "url": "$MDN_URL$/web/api/beforeinstallpromptevent", @@ -6884,6 +6885,9 @@ "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "128", "FirefoxAndroid": "128", "Safari": "18", @@ -7126,7 +7130,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The Bluetooth interface of the Web Bluetooth API provides methods to query Bluetooth availability and request access to devices." + "doc": "

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

    \n

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

    \n

    The Bluetooth interface of the Web Bluetooth API provides methods to query Bluetooth availability and request access to devices." }, "bluetooth.getavailability": { "url": "$MDN_URL$/web/api/bluetooth/getavailability", @@ -7143,7 +7147,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The getAvailability() method of the Bluetooth interface nominally returns true if the user agent can support Bluetooth (because the device has a Bluetooth adapter), and false otherwise.\n

    The word \"nominally\" is used because if permission to use the Web Bluetooth API is disallowed by the Permissions-Policy: bluetooth permission, the method will always return false.\nIn addition, a user can configure their browser to return false from a getAvailability() call even if the browser does have an operational Bluetooth adapter, and vice versa. This setting value ignored if access is blocked by the permission.\n

    Even if getAvailability() returns true and the device actually has a Bluetooth adaptor, this does not necessarily mean that calling navigator.bluetooth.requestDevice() will resolve with a BluetoothDevice.\nThe Bluetooth adapter may not be powered, and a user might deny permission to use the API when prompted.", + "doc": "

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

    \n

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

    \n

    The getAvailability() method of the Bluetooth interface nominally returns true if the user agent can support Bluetooth (because the device has a Bluetooth adapter), and false otherwise.\n

    The word \"nominally\" is used because if permission to use the Web Bluetooth API is disallowed by the Permissions-Policy: bluetooth permission, the method will always return false.\nIn addition, a user can configure their browser to return false from a getAvailability() call even if the browser does have an operational Bluetooth adapter, and vice versa. This setting value ignored if access is blocked by the permission.\n

    Even if getAvailability() returns true and the device actually has a Bluetooth adaptor, this does not necessarily mean that calling navigator.bluetooth.requestDevice() will resolve with a BluetoothDevice.\nThe Bluetooth adapter may not be powered, and a user might deny permission to use the API when prompted.", "returns": "A Promise that resolves with a Boolean.\n

    The Promise will resolve with a value of false if access is disallowed by Permissions-Policy: bluetooth, if the user has configured the browser to always resolve with false, or if the device does not have a Bluetooth adapter.\nOtherwise it will resolve with true." }, "bluetooth.getdevices": { @@ -7156,7 +7160,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The getDevices() method of the Bluetooth interface returns an array containing the Bluetooth devices that this origin is allowed to access — including those that are out of range and powered off.", + "doc": "

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

    \n

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

    \n

    The getDevices() method of the Bluetooth interface returns an array containing the Bluetooth devices that this origin is allowed to access — including those that are out of range and powered off.", "returns": "A Promise that resolves with an array of BluetoothDevice objects.", "throws": { "SecurityError DOMException": "Thrown if this operation is not permitted in this context due to security concerns, such as being called when access to the current document is blocked by the Permissions Policy directive bluetooth." @@ -7177,7 +7181,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The Bluetooth.requestDevice() method of the Bluetooth interface returns a Promise that fulfills with a BluetoothDevice object matching the specified options.\nIf there is no chooser UI, this method returns the first device matching the criteria.", + "doc": "

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

    \n

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

    \n

    The Bluetooth.requestDevice() method of the Bluetooth interface returns a Promise that fulfills with a BluetoothDevice object matching the specified options.\nIf there is no chooser UI, this method returns the first device matching the criteria.", "parameters": { "options": "An object that sets options for selecting an appropriate device.\nThe available options are:\n

    \n
    filters Optional
    \n
    \n

    An array of filter objects indicating the properties of devices that will be matched.\nTo match a filter object, a device must match all the values of the filter: all its specified services, name, namePrefix, and so on.\n

    Each filter consists of an array of objects with the following properties:\n

    \n
    services Optional
    \n
    \n

    An array of values indicating the Bluetooth GATT (Generic Attribute Profile) services that a Bluetooth device must support.\nEach value can be a valid name from the GATT assigned services list, such as 'battery_service' or 'blood_pressure'.\nYou can also pass a full service UUID such as '0000180F-0000-1000-8000-00805f9b34fb' or the short 16-bit (0x180F) or 32-bit alias.\nNote that these are the same values that can be passed to BluetoothUUID.getService().\n

    \n
    name Optional
    \n
    \n

    A string containing the precise name of the device to match against.\n

    \n
    namePrefix Optional
    \n
    \n

    A string containing the name prefix to match against.\nAll devices that have a name starting with this string will be matched.\n

    \n
    manufacturerData Optional
    \n
    \n

    An array of objects matching against manufacturer data in the Bluetooth Low Energy (BLE) advertising packets.\nEach filter object has the following properties:\n

    \n
    companyIdentifier
    \n
    \n

    A mandatory number identifying the manufacturer of the device.\nCompany identifiers are listed in the Bluetooth specification Assigned numbers, Section 7.\nFor example, to match against devices manufactured by \"Digianswer A/S\", with assigned hex number 0x000C, you would specify 12.\n

    \n
    dataPrefix Optional
    \n
    \n

    The data prefix.\nA buffer containing values to match against the values at the start of the advertising manufacturer data.\n

    \n
    mask Optional
    \n
    \n

    This allows you to match against bytes within the manufacturer data, by masking some bytes of the service data dataPrefix.\n

    \n
    \n
    \n
    serviceData Optional
    \n
    \n

    An array of objects matching against service data in the Bluetooth Low Energy (BLE) advertising packets.\nEach filter object has the following properties:\n

    \n
    service
    \n
    \n

    The GATT service name, the service UUID, or the UUID 16-bit or 32-bit form.\nThis takes the same values as the elements of the services array.\n

    \n
    dataPrefix Optional
    \n
    \n

    The data prefix.\nA buffer containing values to match against the values at the start of the advertising service data.\n

    \n
    mask Optional
    \n
    \n

    This allows you to match against bytes within the service data, by masking some bytes of the service data dataPrefix.\n

    \n
    \n
    \n
    \n
    \n
    exclusionFilters Optional
    \n
    \n

    An array of filter objects indicating the characteristics of devices that will be excluded from matching.\nThe properties of the array elements are the same as for filters.\n

    \n
    optionalServices Optional
    \n
    \n

    An array of optional service identifiers.\n

    The identifiers take the same values as the elements of the services array (a GATT service name, service UUID, or UUID short 16-bit or 32-bit form).\n

    \n
    optionalManufacturerData Optional
    \n
    \n

    An optional array of integer manufacturer codes.\nThis takes the same values as companyIdentifier.\n

    The data is not used for filtering the devices, but advertisements that match the specified set are still delivered in advertisementreceived events.\nThis is useful because it allows code to specify an interest in data received from Bluetooth devices without constraining the filter controlling which devices are presented to the user in the permission prompt.\n

    \n
    acceptAllDevices Optional
    \n
    \n

    A boolean value indicating that the requesting script can accept all Bluetooth devices.\nThe default is false.\n

    This option is appropriate when devices have not advertised enough information for filtering to be useful.\nWhen acceptAllDevices is set to true you should omit all filters and exclusionFilters, and you must set optionalServices to be able to use the returned device.\n

    \n
    " }, @@ -7200,7 +7204,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothCharacteristicProperties interface of the Web Bluetooth API provides the operations that are valid on the given BluetoothRemoteGATTCharacteristic.\n

    This interface is returned by calling BluetoothRemoteGATTCharacteristic.properties." + "doc": "

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

    \n

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

    \n

    The BluetoothCharacteristicProperties interface of the Web Bluetooth API provides the operations that are valid on the given BluetoothRemoteGATTCharacteristic.\n

    This interface is returned by calling BluetoothRemoteGATTCharacteristic.properties." }, "bluetoothcharacteristicproperties.authenticatedsignedwrites": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/authenticatedsignedwrites", @@ -7217,7 +7221,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The authenticatedSignedWrites read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if signed writing to the characteristic\nvalue is permitted." + "doc": "

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

    \n

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

    \n

    The authenticatedSignedWrites read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if signed writing to the characteristic\nvalue is permitted." }, "bluetoothcharacteristicproperties.broadcast": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/broadcast", @@ -7234,7 +7238,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The broadcast read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the broadcast of the characteristic\nvalue is permitted using the Server Characteristic Configuration Descriptor." + "doc": "

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

    \n

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

    \n

    The broadcast read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the broadcast of the characteristic\nvalue is permitted using the Server Characteristic Configuration Descriptor." }, "bluetoothcharacteristicproperties.indicate": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/indicate", @@ -7251,7 +7255,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The indicate read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if indications of the characteristic\nvalue with acknowledgement is permitted." + "doc": "

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

    \n

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

    \n

    The indicate read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if indications of the characteristic\nvalue with acknowledgement is permitted." }, "bluetoothcharacteristicproperties.notify": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/notify", @@ -7268,7 +7272,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The notify read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if notifications of the characteristic\nvalue without acknowledgement is permitted." + "doc": "

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

    \n

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

    \n

    The notify read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if notifications of the characteristic\nvalue without acknowledgement is permitted." }, "bluetoothcharacteristicproperties.read": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/read", @@ -7285,7 +7289,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The read read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the reading of the characteristic\nvalue is permitted." + "doc": "

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

    \n

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

    \n

    The read read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the reading of the characteristic\nvalue is permitted." }, "bluetoothcharacteristicproperties.reliablewrite": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/reliablewrite", @@ -7302,7 +7306,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The reliableWrite read-only property of\nthe BluetoothCharacteristicProperties interface returns a\nboolean that is true if reliable writes to the characteristic\nis permitted." + "doc": "

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

    \n

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

    \n

    The reliableWrite read-only property of\nthe BluetoothCharacteristicProperties interface returns a\nboolean that is true if reliable writes to the characteristic\nis permitted." }, "bluetoothcharacteristicproperties.writableauxiliaries": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/writableauxiliaries", @@ -7319,7 +7323,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The writableAuxiliaries read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if reliable writes to the characteristic\ndescriptor is permitted." + "doc": "

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

    \n

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

    \n

    The writableAuxiliaries read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if reliable writes to the characteristic\ndescriptor is permitted." }, "bluetoothcharacteristicproperties.write": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/write", @@ -7336,7 +7340,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The write read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the writing to the characteristic with\nresponse is permitted." + "doc": "

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

    \n

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

    \n

    The write read-only property of the\nBluetoothCharacteristicProperties interface returns a\nboolean that is true if the writing to the characteristic with\nresponse is permitted." }, "bluetoothcharacteristicproperties.writewithoutresponse": { "url": "$MDN_URL$/web/api/bluetoothcharacteristicproperties/writewithoutresponse", @@ -7353,7 +7357,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The writeWithoutResponse read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if the writing to the characteristic\nwithout response is permitted." + "doc": "

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

    \n

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

    \n

    The writeWithoutResponse read-only\nproperty of the BluetoothCharacteristicProperties interface returns a\nboolean that is true if the writing to the characteristic\nwithout response is permitted." }, "bluetoothdevice": { "url": "$MDN_URL$/web/api/bluetoothdevice", @@ -7367,7 +7371,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothDevice interface of the Web Bluetooth API represents a Bluetooth device inside a particular script execution\nenvironment." + "doc": "

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

    \n

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

    \n

    The BluetoothDevice interface of the Web Bluetooth API represents a Bluetooth device inside a particular script execution\nenvironment." }, "bluetoothdevice.gatt": { "url": "$MDN_URL$/web/api/bluetoothdevice/gatt", @@ -7384,7 +7388,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The\nBluetoothDevice.gatt read-only property returns\na reference to the device's BluetoothRemoteGATTServer." + "doc": "

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

    \n

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

    \n

    The\nBluetoothDevice.gatt read-only property returns\na reference to the device's BluetoothRemoteGATTServer." }, "bluetoothdevice.id": { "url": "$MDN_URL$/web/api/bluetoothdevice/id", @@ -7401,7 +7405,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothDevice.id read-only property returns a\nstring that uniquely identifies a device." + "doc": "

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

    \n

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

    \n

    The BluetoothDevice.id read-only property returns a\nstring that uniquely identifies a device." }, "bluetoothdevice.name": { "url": "$MDN_URL$/web/api/bluetoothdevice/name", @@ -7418,7 +7422,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothDevice.name read-only property returns a\nstring that provides a human-readable name for the device." + "doc": "

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

    \n

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

    \n

    The BluetoothDevice.name read-only property returns a\nstring that provides a human-readable name for the device." }, "bluetoothremotegattcharacteristic": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic", @@ -7432,7 +7436,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGattCharacteristic interface of the Web Bluetooth API represents a GATT Characteristic, which is a basic data element that provides further information about a peripheral's service." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGattCharacteristic interface of the Web Bluetooth API represents a GATT Characteristic, which is a basic data element that provides further information about a peripheral's service." }, "bluetoothremotegattcharacteristic.getdescriptor": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic/getdescriptor", @@ -7449,7 +7453,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.getDescriptor() method\nreturns a Promise that resolves to the\nfirst BluetoothRemoteGATTDescriptor for a given descriptor UUID.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.getDescriptor() method\nreturns a Promise that resolves to the\nfirst BluetoothRemoteGATTDescriptor for a given descriptor UUID.", "returns": "A Promise that resolves to the\nfirst BluetoothRemoteGATTDescriptor." }, "bluetoothremotegattcharacteristic.getdescriptors": { @@ -7467,7 +7471,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.getDescriptors() method\nreturns a Promise that resolves to an Array of all\nBluetoothRemoteGATTDescriptor objects for a given descriptor UUID.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.getDescriptors() method\nreturns a Promise that resolves to an Array of all\nBluetoothRemoteGATTDescriptor objects for a given descriptor UUID.", "returns": "A Promise that resolves to an Array\nof BluetoothRemoteGATTDescriptor objects." }, "bluetoothremotegattcharacteristic.properties": { @@ -7485,7 +7489,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.properties\nread-only property returns a BluetoothCharacteristicProperties instance\ncontaining the properties of this characteristic." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.properties\nread-only property returns a BluetoothCharacteristicProperties instance\ncontaining the properties of this characteristic." }, "bluetoothremotegattcharacteristic.readvalue": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic/readvalue", @@ -7502,7 +7506,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.readValue() method\nreturns a Promise that resolves to a DataView holding a\nduplicate of the value property if it is available and supported. Otherwise\nit throws an error.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.readValue() method\nreturns a Promise that resolves to a DataView holding a\nduplicate of the value property if it is available and supported. Otherwise\nit throws an error.", "returns": "A Promise that resolves to a DataView." }, "bluetoothremotegattcharacteristic.service": { @@ -7520,7 +7524,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.service read-only\nproperty returns the BluetoothRemoteGATTService this characteristic belongs to." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.service read-only\nproperty returns the BluetoothRemoteGATTService this characteristic belongs to." }, "bluetoothremotegattcharacteristic.startnotifications": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic/startnotifications", @@ -7537,7 +7541,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.startNotifications() method\nreturns a Promise to the BluetoothRemoteGATTCharacteristic instance when\nthere is an active notification on it.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.startNotifications() method\nreturns a Promise to the BluetoothRemoteGATTCharacteristic instance when\nthere is an active notification on it.", "returns": "A Promise to the BluetoothRemoteGATTCharacteristic instance." }, "bluetoothremotegattcharacteristic.stopnotifications": { @@ -7555,7 +7559,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.stopNotifications() method\nreturns a Promise to the BluetoothRemoteGATTCharacteristic instance when\nthere is no longer an active notification on it.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.stopNotifications() method\nreturns a Promise to the BluetoothRemoteGATTCharacteristic instance when\nthere is no longer an active notification on it.", "returns": "A Promise." }, "bluetoothremotegattcharacteristic.uuid": { @@ -7573,7 +7577,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.uuid read-only\nproperty returns a string containing the UUID of the characteristic, for\nexample '00002a37-0000-1000-8000-00805f9b34fb' for the Heart Rate\nMeasurement characteristic." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.uuid read-only\nproperty returns a string containing the UUID of the characteristic, for\nexample '00002a37-0000-1000-8000-00805f9b34fb' for the Heart Rate\nMeasurement characteristic." }, "bluetoothremotegattcharacteristic.value": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic/value", @@ -7590,7 +7594,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.value read-only\nproperty returns currently cached characteristic value. This value gets updated when the\nvalue of the characteristic is read or updated via a notification or indication." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.value read-only\nproperty returns currently cached characteristic value. This value gets updated when the\nvalue of the characteristic is read or updated via a notification or indication." }, "bluetoothremotegattcharacteristic.writevalue": { "url": "$MDN_URL$/web/api/bluetoothremotegattcharacteristic/writevalue", @@ -7604,7 +7608,7 @@ "Edge": "79", "Opera": "43" }, - "doc": "

    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.

    \n

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

    \n

    Use BluetoothRemoteGATTCharacteristic.writeValueWithResponse() and BluetoothRemoteGATTCharacteristic.writeValueWithoutResponse() instead.\n

    The BluetoothRemoteGATTCharacteristic.writeValue() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value with optional response, and returns the resulting Promise.", + "doc": "

    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.

    \n

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

    \n

    Use BluetoothRemoteGATTCharacteristic.writeValueWithResponse() and BluetoothRemoteGATTCharacteristic.writeValueWithoutResponse() instead.\n

    The BluetoothRemoteGATTCharacteristic.writeValue() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value with optional response, and returns the resulting Promise.", "parameters": { "value": "An ArrayBuffer, TypedArray, or DataView." }, @@ -7625,7 +7629,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.writeValueWithoutResponse() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value without response, and returns the resulting Promise.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.writeValueWithoutResponse() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value without response, and returns the resulting Promise.", "parameters": { "value": "An ArrayBuffer, TypedArray, or DataView." }, @@ -7646,7 +7650,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.writeValueWithResponse() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value with required response, and returns the resulting Promise.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTCharacteristic.writeValueWithResponse() method sets a BluetoothRemoteGATTCharacteristic object's value property to the bytes contained in a given ArrayBuffer, TypedArray, or DataView, writes the characteristic value with required response, and returns the resulting Promise.", "parameters": { "value": "An ArrayBuffer, TypedArray, or DataView." }, @@ -7664,7 +7668,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor interface of the Web Bluetooth API provides a GATT Descriptor,\nwhich provides further information about a characteristic's value." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor interface of the Web Bluetooth API provides a GATT Descriptor,\nwhich provides further information about a characteristic's value." }, "bluetoothremotegattdescriptor.characteristic": { "url": "$MDN_URL$/web/api/bluetoothremotegattdescriptor/characteristic", @@ -7681,7 +7685,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.characteristic\nread-only property returns the BluetoothRemoteGATTCharacteristic this\ndescriptor belongs to." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.characteristic\nread-only property returns the BluetoothRemoteGATTCharacteristic this\ndescriptor belongs to." }, "bluetoothremotegattdescriptor.readvalue": { "url": "$MDN_URL$/web/api/bluetoothremotegattdescriptor/readvalue", @@ -7698,7 +7702,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The\nBluetoothRemoteGATTDescriptor.readValue()\nmethod returns a Promise that resolves to\na DataView holding a duplicate of the value property if\nit is available and supported. Otherwise it throws an error.", + "doc": "

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

    \n

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

    \n

    The\nBluetoothRemoteGATTDescriptor.readValue()\nmethod returns a Promise that resolves to\na DataView holding a duplicate of the value property if\nit is available and supported. Otherwise it throws an error.", "returns": "A Promise that resolves to a DataView." }, "bluetoothremotegattdescriptor.uuid": { @@ -7716,7 +7720,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.uuid read-only property returns the UUID of the characteristic descriptor.\nFor example \"00002902-0000-1000-8000-00805f9b34fb\" for the Client Characteristic Configuration descriptor." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.uuid read-only property returns the UUID of the characteristic descriptor.\nFor example \"00002902-0000-1000-8000-00805f9b34fb\" for the Client Characteristic Configuration descriptor." }, "bluetoothremotegattdescriptor.value": { "url": "$MDN_URL$/web/api/bluetoothremotegattdescriptor/value", @@ -7733,7 +7737,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.value\nread-only property returns an DataView containing the currently cached\ndescriptor value. This value gets updated when the value of the descriptor is read." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.value\nread-only property returns a DataView containing the currently cached\ndescriptor value. This value gets updated when the value of the descriptor is read." }, "bluetoothremotegattdescriptor.writevalue": { "url": "$MDN_URL$/web/api/bluetoothremotegattdescriptor/writevalue", @@ -7750,7 +7754,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.writeValue()\nmethod sets the value property to the bytes contained in\nan ArrayBuffer, TypedArray, or DataView and returns a Promise.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTDescriptor.writeValue()\nmethod sets the value property to the bytes contained in\nan ArrayBuffer, TypedArray, or DataView and returns a Promise.", "parameters": { "buffer": "Sets the value with the bytes contained in the buffer." }, @@ -7768,7 +7772,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer interface of the Web Bluetooth API represents a GATT\nServer on a remote device." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer interface of the Web Bluetooth API represents a GATT\nServer on a remote device." }, "bluetoothremotegattserver.connect": { "url": "$MDN_URL$/web/api/bluetoothremotegattserver/connect", @@ -7785,7 +7789,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The\nBluetoothRemoteGATTServer.connect() method causes the\nscript execution environment to connect to this.device.", + "doc": "

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

    \n

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

    \n

    The\nBluetoothRemoteGATTServer.connect() method causes the\nscript execution environment to connect to this.device.", "returns": "A Promise that resolves to a BluetoothRemoteGATTServer." }, "bluetoothremotegattserver.connected": { @@ -7803,7 +7807,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.connected read-only\nproperty returns a boolean value that returns true while this script execution\nenvironment is connected to this.device. It can be false while the user\nagent is physically connected." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.connected read-only\nproperty returns a boolean value that returns true while this script execution\nenvironment is connected to this.device. It can be false while the user\nagent is physically connected." }, "bluetoothremotegattserver.device": { "url": "$MDN_URL$/web/api/bluetoothremotegattserver/device", @@ -7820,7 +7824,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.device read-only property\nreturns a reference to the BluetoothDevice running the server." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.device read-only property\nreturns a reference to the BluetoothDevice running the server." }, "bluetoothremotegattserver.disconnect": { "url": "$MDN_URL$/web/api/bluetoothremotegattserver/disconnect", @@ -7837,7 +7841,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.disconnect() method causes\nthe script execution environment to disconnect from this.device.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.disconnect() method causes\nthe script execution environment to disconnect from this.device.", "returns": "None (undefined)." }, "bluetoothremotegattserver.getprimaryservice": { @@ -7855,7 +7859,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.getPrimaryService() method\nreturns a promise to the primary BluetoothRemoteGATTService offered by the\nBluetooth device for a specified bluetooth service UUID.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.getPrimaryService() method\nreturns a promise to the primary BluetoothRemoteGATTService offered by the\nBluetooth device for a specified bluetooth service UUID.", "parameters": { "bluetoothServiceUUID": "A Bluetooth service universally unique identifier for a specified device, that is either a 128-bit UUID, a 16-bit or 32-bit UUID alias, or a string from the list of GATT assigned services keys." }, @@ -7876,7 +7880,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.getPrimaryServices() method returns a\npromise to a list of primary BluetoothRemoteGATTService objects offered by the\nBluetooth device for a specified BluetoothServiceUUID.", + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTServer.getPrimaryServices() method returns a\npromise to a list of primary BluetoothRemoteGATTService objects offered by the\nBluetooth device for a specified BluetoothServiceUUID.", "parameters": { "bluetoothServiceUUID": "A Bluetooth service universally unique identifier for a specified device." }, @@ -7894,7 +7898,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTService interface of the Web Bluetooth API represents a\nservice provided by a GATT server, including a device, a list of referenced services,\nand a list of the characteristics of this service." + "doc": "

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

    \n

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

    \n

    The BluetoothRemoteGATTService interface of the Web Bluetooth API represents a\nservice provided by a GATT server, including a device, a list of referenced services,\nand a list of the characteristics of this service." }, "bluetoothremotegattservice.device": { "url": "$MDN_URL$/web/api/bluetoothremotegattservice/device", @@ -7911,7 +7915,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.device read-only property\nreturns information about a Bluetooth device through an instance of\nBluetoothDevice." + "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.device read-only property\nreturns information about a Bluetooth device through an instance of\nBluetoothDevice." }, "bluetoothremotegattservice.getcharacteristic": { "url": "$MDN_URL$/web/api/bluetoothremotegattservice/getcharacteristic", @@ -7928,7 +7932,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.getCharacteristic() method\nreturns a Promise to an instance of\nBluetoothRemoteGATTCharacteristic for a given universally unique identifier\n(UUID).", + "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.getCharacteristic() method\nreturns a Promise to an instance of\nBluetoothRemoteGATTCharacteristic for a given universally unique identifier\n(UUID).", "parameters": { "characteristic": "The UUID of a characteristic, for\nexample '00002a37-0000-1000-8000-00805f9b34fb' for the Heart Rate\nMeasurement characteristic." }, @@ -7949,7 +7953,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.getCharacteristics() method\nreturns a Promise to a list of BluetoothRemoteGATTCharacteristic\ninstances for a given universally unique identifier (UUID).", + "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.getCharacteristics() method\nreturns a Promise to a list of BluetoothRemoteGATTCharacteristic\ninstances for a given universally unique identifier (UUID).", "parameters": { "characteristics": "The UUID of a characteristic, for\nexample '00002a37-0000-1000-8000-00805f9b34fb' for the Heart Rate\nMeasurement characteristic." }, @@ -7970,7 +7974,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.isPrimary read-only property\nreturns a boolean value that indicates whether this is a primary service. If it\nis not a primary service, it is a secondary service." + "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.isPrimary read-only property\nreturns a boolean value that indicates whether this is a primary service. If it\nis not a primary service, it is a secondary service." }, "bluetoothremotegattservice.uuid": { "url": "$MDN_URL$/web/api/bluetoothremotegattservice/uuid", @@ -7987,7 +7991,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.uuid read-only property\nreturns a string representing the UUID of this service." + "doc": "

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

    \n

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

    \n

    The BluetoothGATTService.uuid read-only property\nreturns a string representing the UUID of this service." }, "bluetoothuuid": { "url": "$MDN_URL$/web/api/bluetoothuuid", @@ -8252,7 +8256,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The clone() method of the BrowserCaptureMediaStreamTrack interface returns a clone of the original BrowserCaptureMediaStreamTrack.\n

    This method is functionally identical to MediaStreamTrack.clone(), except that it handles cases where cropping or restriction have been applied to the track. The returned clone is identical to the original BrowserCaptureMediaStreamTrack, but with any cropping or restriction removed.\n

    \n

    Note:\nIn Chromium, if a track has clones, its cropTo() and restrictTo() methods will reject (see Chrome issue 41482026).\n

    ", + "doc": "

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

    \n

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

    \n

    The clone() method of the BrowserCaptureMediaStreamTrack interface returns a clone of the original BrowserCaptureMediaStreamTrack.\n

    This method is functionally identical to MediaStreamTrack.clone(), except that it handles cases where cropping or restriction have been applied to the track. The returned clone is identical to the original BrowserCaptureMediaStreamTrack, but with any cropping or restriction removed.\n

    \n

    Note:\nIn Chromium, if a track has clones, its cropTo() and restrictTo() methods will reject (see Chrome issue 41482026).\n

    ", "returns": "A BrowserCaptureMediaStreamTrack instance." }, "browsercapturemediastreamtrack.cropto": { @@ -8269,7 +8273,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The cropTo() method of the BrowserCaptureMediaStreamTrack interface crops a self-capture stream to the area in which a specified DOM element is rendered.", + "doc": "

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

    \n

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

    \n

    The cropTo() method of the BrowserCaptureMediaStreamTrack interface crops a self-capture stream to the area in which a specified DOM element is rendered.", "parameters": { "cropTarget": "A CropTarget instance representing the element rendering area the stream should be cropped to, or null/undefined, in which case any previously-set cropping is removed from the track." }, @@ -8289,7 +8293,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The restrictTo() method of the BrowserCaptureMediaStreamTrack interface restricts a self-capture stream to a specific DOM element (and its descendants).", + "doc": "

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

    \n

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

    \n

    The restrictTo() method of the BrowserCaptureMediaStreamTrack interface restricts a self-capture stream to a specific DOM element (and its descendants).", "parameters": { "restrictionTarget": "A RestrictionTarget instance representing the element the stream should be restricted to, or null/undefined, in which case any previously-set restriction is removed from the track." }, @@ -8451,7 +8455,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The Cache interface provides a persistent storage mechanism for Request / Response object pairs that are cached in long lived memory. How long a Cache object lives is browser dependent, but a single origin's scripts can typically rely on the presence of a previously populated Cache object. Note that the Cache interface is exposed to windowed scopes as well as workers. You don't have to use it in conjunction with service workers, even though it is defined in the service worker spec.\n

    An origin can have multiple, named Cache objects. You are responsible for implementing how your script (e.g., in a ServiceWorker) handles Cache updates. Items in a Cache do not get updated unless explicitly requested; they don't expire unless deleted. Use CacheStorage.open() to open a specific named Cache object and then call any of the Cache methods to maintain the Cache.\n

    You are also responsible for periodically purging cache entries. Each browser has a hard limit on the amount of cache storage that a given origin can use. Cache quota usage estimates are available via the StorageManager.estimate() method. The browser does its best to manage disk space, but it may delete the Cache storage for an origin. The browser will generally delete all of the data for an origin or none of the data for an origin. Make sure to version caches by name and use the caches only from the version of the script that they can safely operate on. See Deleting old caches for more information.\n

    \n

    Note:\nThe key matching algorithm depends on the VARY header in the value. So matching a new key requires looking at both key and value for entries in the Cache object.\n

    \n
    \n

    Note:\nThe caching API doesn't honor HTTP caching headers.\n

    " + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The Cache interface provides a persistent storage mechanism for Request / Response object pairs that are cached in long lived memory. How long a Cache object lives is browser dependent, but a single origin's scripts can typically rely on the presence of a previously populated Cache object. Note that the Cache interface is exposed to windowed scopes as well as workers. You don't have to use it in conjunction with service workers, even though it is defined in the service worker spec.\n

    An origin can have multiple, named Cache objects. You are responsible for implementing how your script (e.g., in a ServiceWorker) handles Cache updates. Items in a Cache do not get updated unless explicitly requested; they don't expire unless deleted. Use CacheStorage.open() to open a specific named Cache object and then call any of the Cache methods to maintain the Cache.\n

    You are also responsible for periodically purging cache entries. Each browser has a hard limit on the amount of cache storage that a given origin can use. Cache quota usage estimates are available via the StorageManager.estimate() method. The browser does its best to manage disk space, but it may delete the Cache storage for an origin. The browser will generally delete all of the data for an origin or none of the data for an origin. Make sure to version caches by name and use the caches only from the version of the script that they can safely operate on. See Deleting old caches for more information.\n

    \n

    Note:\nThe key matching algorithm depends on the VARY header in the value. So matching a new key requires looking at both key and value for entries in the Cache object.\n

    \n
    \n

    Note:\nThe caching API doesn't honor HTTP caching headers.\n

    " }, "cache.add": { "url": "$MDN_URL$/web/api/cache/add", @@ -8473,7 +8477,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The add() method of the Cache interface takes a URL, retrieves it, and adds the resulting response object to the given cache.\n

    The add() method is functionally equivalent to the following:\n

    \n```js\nfetch(url).then((response) => {\n  if (!response.ok) {\n    throw new TypeError(\"bad response status\");\n  }\n  return cache.put(url, response);\n});\n```\n
    \n

    For more complex operations, you'll need to use Cache.put() directly.\n

    \n

    Note:\nadd() will overwrite any key/value pair previously stored in the cache that matches the request.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The add() method of the Cache interface takes a URL, retrieves it, and adds the resulting response object to the given cache.\n

    The add() method is functionally equivalent to the following:\n

    \n```js\nfetch(url).then((response) => {\n  if (!response.ok) {\n    throw new TypeError(\"bad response status\");\n  }\n  return cache.put(url, response);\n});\n```\n
    \n

    For more complex operations, you'll need to use Cache.put() directly.\n

    \n

    Note:\nadd() will overwrite any key/value pair previously stored in the cache that matches the request.\n

    ", "parameters": { "request": "A request for the resource you want to add to the cache. This can be a Request object or a URL.\n

    This parameter is used as a parameter to the Request() constructor, so URLs follow the same rules as for that constructor. In particular, URLs may be relative to the base URL, which is the document's baseURI in a window context, or WorkerGlobalScope.location in a worker context." }, @@ -8502,7 +8506,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The addAll() method of the Cache interface takes an array of URLs, retrieves them, and adds the resulting response objects to the given cache. The request objects created during retrieval become keys to the stored response operations.\n

    \n

    Note:\naddAll() will overwrite any key/value pairs\npreviously stored in the cache that match the request, but will fail if a\nresulting put() operation would overwrite a previous cache entry stored by the same addAll() method.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The addAll() method of the Cache interface takes an array of URLs, retrieves them, and adds the resulting response objects to the given cache. The request objects created during retrieval become keys to the stored response operations.\n

    \n

    Note:\naddAll() will overwrite any key/value pairs\npreviously stored in the cache that match the request, but will fail if a\nresulting put() operation would overwrite a previous cache entry stored by the same addAll() method.\n

    ", "parameters": { "requests": "An array of requests for the resources you want to add to the cache. These can be Request objects or URLs.\n

    These requests are used as parameters to the Request() constructor, so URLs follow the same rules as for that constructor. In particular, URLs may be relative to the base URL, which is the document's baseURI in a window context, or WorkerGlobalScope.location in a worker context." }, @@ -8532,12 +8536,12 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the Cache interface finds the Cache entry whose key is the request, and if found, deletes the Cache entry and returns a Promise that resolves to true.\nIf no Cache entry is found, it resolves to false.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the Cache interface finds the Cache entry whose key is the request, and if found, deletes the Cache entry and returns a Promise that resolves to true.\nIf no Cache entry is found, it resolves to false.", "parameters": { "request": "The Request you are looking to delete.\nThis can be a Request object or a URL.", - "options": "An object whose properties control how matching is done in the delete operation.\nThe available options are:\n

    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the matching process should ignore the query string in the URL.\nIf set to true, the ?value=bar part of http://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest HTTP method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific cache to search within. Note that this option is ignored by Cache.delete().\n

    \n
    " + "options": "An object whose properties control how matching is done in the delete operation.\nThe available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the matching process should ignore the query string in the URL.\nIf set to true, the ?value=bar part of https://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest HTTP method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific cache to search within. Note that this option is ignored by Cache.delete().\n

    \n
    " }, - "returns": "a Promise that resolves to true if the cache entry is\ndeleted, or false otherwise." + "returns": "A Promise that resolves to true if the cache entry is\ndeleted, or false otherwise." }, "cache.keys": { "url": "$MDN_URL$/web/api/cache/keys", @@ -8559,10 +8563,10 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the Cache interface returns a\nPromise that resolves to an array of Request objects\nrepresenting the keys of the Cache.\n

    The requests are returned in the same order that they were inserted.\n

    \n

    Note:\nRequests with duplicate URLs but different headers can be\nreturned if their responses have the VARY header set on them.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the Cache interface returns a\nPromise that resolves to an array of Request objects\nrepresenting the keys of the Cache.\n

    The requests are returned in the same order that they were inserted.\n

    \n

    Note:\nRequests with duplicate URLs but different headers can be\nreturned if their responses have the VARY header set on them.\n

    ", "parameters": { "request": "The Request want to return, if a specific key is desired. This can be\na Request object or a URL.", - "options": "An object whose properties control how matching is done in the keys\noperation. The available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. If set to\ntrue, the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest HTTP method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific\ncache to search within. Note that this option is ignored by\nCache.keys().\n

    \n
    " + "options": "An object whose properties control how matching is done in the keys\noperation. The available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. If set to\ntrue, the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest HTTP method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific\ncache to search within. Note that this option is ignored by\nCache.keys().\n

    \n
    " }, "returns": "A Promise that resolves to an array of Request\nobjects." }, @@ -8587,10 +8591,10 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The match() method of the Cache interface returns a Promise that resolves to the Response associated with the first matching request in the Cache object.\nIf no match is found, the Promise resolves to undefined.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The match() method of the Cache interface returns a Promise that resolves to the Response associated with the first matching request in the Cache object.\nIf no match is found, the Promise resolves to undefined.", "parameters": { "request": "The Request for which you are attempting to find responses in the\nCache. This can be a Request object or a URL string.", - "options": "An object that sets options for the match operation.\nThe available options are:\n

    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that when set to\ntrue tells the matching operation not to perform VARY\nheader matching — i.e., if the URL matches you will get a match regardless of\nwhether the Response object has a VARY header. It\ndefaults to false.\n

    \n
    " + "options": "An object that sets options for the match operation.\nThe available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether to\nignore the query string in the URL. For example, if set to\ntrue the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that when set to\ntrue tells the matching operation not to perform VARY\nheader matching — i.e., if the URL matches you will get a match regardless of\nwhether the Response object has a VARY header. It\ndefaults to false.\n

    \n
    " }, "returns": "A Promise that resolves to the first Response that matches\nthe request or to undefined if no match is found.\n
    \n

    Note:\nCache.match() is basically identical to\nCache.matchAll(), except that rather than resolving with an array of\nall matching responses, it resolves with the first matching response only (that is,\nresponse[0]).\n

    " }, @@ -8614,10 +8618,10 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The matchAll() method of the Cache\ninterface returns a Promise that resolves to an array of all matching\nresponses in the Cache object.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The matchAll() method of the Cache\ninterface returns a Promise that resolves to an array of all matching\nresponses in the Cache object.", "parameters": { "request": "The Request for which you are attempting to find responses in the\nCache. This can be a Request object or a URL. If this\nargument is omitted, you will get a copy of all responses in this cache.", - "options": "An options object allowing you to set specific control options for the matching\nperformed. The available options are:\n

    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. If set to\ntrue, the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that when set to\ntrue tells the matching operation not to perform VARY\nheader matching — i.e., if the URL matches you will get a match regardless of the\nResponse object having a VARY header or not. It\ndefaults to false.\n

    \n
    " + "options": "An options object allowing you to set specific control options for the matching\nperformed. The available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. If set to\ntrue, the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that when set to\ntrue tells the matching operation not to perform VARY\nheader matching — i.e., if the URL matches you will get a match regardless of the\nResponse object having a VARY header or not. It\ndefaults to false.\n

    \n
    " }, "returns": "A Promise that resolves to an array of all matching responses in the\nCache object.\n
    \n

    Note:\nCache.match() is basically identical to\nCache.matchAll(), except that rather than resolving with an array of all\nmatching responses, it resolves with the first matching response only (that is,\nresponse[0]).\n

    " }, @@ -8642,7 +8646,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The put() method of the\nCache interface allows key/value pairs to be added to the current\nCache object.\n

    Often, you will just want to fetch()\none or more requests, then add the result straight to your cache. In such cases you are\nbetter off using\nCache.add()/Cache.addAll(), as\nthey are shorthand functions for one or more of these operations.\n

    \n```js\nfetch(url).then((response) => {\n  if (!response.ok) {\n    throw new TypeError(\"Bad response status\");\n  }\n  return cache.put(url, response);\n});\n```\n
    \n
    \n

    Note:\nput() will overwrite any key/value pair\npreviously stored in the cache that matches the request.\n

    \n
    \n

    Note:\nCache.add/Cache.addAll do not\ncache responses with Response.status values that are not in the 200\nrange, whereas Cache.put lets you store any request/response pair. As a\nresult, Cache.add/Cache.addAll can't be used to store\nopaque responses, whereas Cache.put can.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The put() method of the\nCache interface allows key/value pairs to be added to the current\nCache object.\n

    Often, you will just want to fetch()\none or more requests, then add the result straight to your cache. In such cases you are\nbetter off using\nCache.add()/Cache.addAll(), as\nthey are shorthand functions for one or more of these operations.\n

    \n```js\nfetch(url).then((response) => {\n  if (!response.ok) {\n    throw new TypeError(\"Bad response status\");\n  }\n  return cache.put(url, response);\n});\n```\n
    \n
    \n

    Note:\nput() will overwrite any key/value pair\npreviously stored in the cache that matches the request.\n

    \n
    \n

    Note:\nCache.add/Cache.addAll do not\ncache responses with Response.status values that are not in the 200\nrange, whereas Cache.put lets you store any request/response pair. As a\nresult, Cache.add/Cache.addAll can't be used to store\nopaque responses, whereas Cache.put can.\n

    ", "parameters": { "request": "The Request object or URL that you want to add to the cache.", "response": "The Response you want to match up to the request." @@ -8673,7 +8677,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    The caches read-only property of the Window interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." + "doc": "

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

    \n

    The caches read-only property of the Window interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." }, "cachestorage": { "url": "$MDN_URL$/web/api/cachestorage", @@ -8696,7 +8700,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The CacheStorage interface represents the storage for Cache objects.\n

    The interface:\n

    \n

    Use CacheStorage.open() to obtain a Cache instance.\n

    Use CacheStorage.match() to check if a given Request is a key in any of the Cache objects that the CacheStorage object tracks.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    \n

    Note:\nCacheStorage always rejects with a SecurityError on untrusted origins (i.e., those that aren't using HTTPS, although this definition will likely become more complex in the future.) When testing on Firefox, you can get around this by checking the Enable Service Workers over HTTP (when toolbox is open) option in the Firefox DevTools options/gear menu. Furthermore, because CacheStorage requires file-system access, it may be unavailable in private mode in Firefox.\n

    \n
    \n

    Note:\nCacheStorage.match() is a convenience method. Equivalent functionality to match a cache entry can be implemented by returning an array of cache names from CacheStorage.keys(), opening each cache with CacheStorage.open(), and matching the one you want with Cache.match().\n

    " + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The CacheStorage interface represents the storage for Cache objects.\n

    The interface:\n

    \n

    Use CacheStorage.open() to obtain a Cache instance.\n

    Use CacheStorage.match() to check if a given Request is a key in any of the Cache objects that the CacheStorage object tracks.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    \n

    Note:\nCacheStorage always rejects with a SecurityError on untrusted origins (i.e., those that aren't using HTTPS, although this definition will likely become more complex in the future.) When testing on Firefox, you can get around this by checking the Enable Service Workers over HTTP (when toolbox is open) option in the Firefox DevTools options/gear menu. Furthermore, because CacheStorage requires file-system access, it may be unavailable in private mode in Firefox.\n

    \n
    \n

    Note:\nCacheStorage.match() is a convenience method. Equivalent functionality to match a cache entry can be implemented by returning an array of cache names from CacheStorage.keys(), opening each cache with CacheStorage.open(), and matching the one you want with Cache.match().\n

    " }, "cachestorage.delete": { "url": "$MDN_URL$/web/api/cachestorage/delete", @@ -8719,11 +8723,11 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the CacheStorage interface finds the Cache object matching the cacheName, and if found, deletes the Cache object and returns a Promise that resolves to true.\nIf no Cache object is found, it resolves to false.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the CacheStorage interface finds the Cache object matching the cacheName, and if found, deletes the Cache object and returns a Promise that resolves to true.\nIf no Cache object is found, it resolves to false.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", "parameters": { "cacheName": "The name of the cache you want to delete." }, - "returns": "a Promise that resolves to true if the Cache\nobject is found and deleted, and false otherwise." + "returns": "A Promise that resolves to true if the Cache\nobject is found and deleted, and false otherwise." }, "cachestorage.has": { "url": "$MDN_URL$/web/api/cachestorage/has", @@ -8746,11 +8750,11 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The has() method of the CacheStorage\ninterface returns a Promise that resolves to true if a\nCache object matches the cacheName.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The has() method of the CacheStorage\ninterface returns a Promise that resolves to true if a\nCache object matches the cacheName.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", "parameters": { "cacheName": "A string representing the name of the Cache object you are looking for in the CacheStorage." }, - "returns": "a Promise that resolves to true if the cache exists or\nfalse if not." + "returns": "A Promise that resolves to true if the cache exists or\nfalse if not." }, "cachestorage.keys": { "url": "$MDN_URL$/web/api/cachestorage/keys", @@ -8772,8 +8776,8 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the CacheStorage interface returns a Promise that will resolve with an array containing strings corresponding to all of the named Cache objects tracked by the CacheStorage object in the order they were created.\nUse this method to iterate over a list of all Cache objects.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", - "returns": "a Promise that resolves with an array of the Cache names inside the CacheStorage object." + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the CacheStorage interface returns a Promise that will resolve with an array containing strings corresponding to all of the named Cache objects tracked by the CacheStorage object in the order they were created.\nUse this method to iterate over a list of all Cache objects.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.", + "returns": "A Promise that resolves with an array of the Cache names inside the CacheStorage object." }, "cachestorage.match": { "url": "$MDN_URL$/web/api/cachestorage/match", @@ -8795,12 +8799,12 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The match() method of the CacheStorage interface checks if a given Request or URL string is a key for a stored Response.\nThis method returns a Promise for a Response, or a Promise which resolves to undefined if no match is found.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    Cache objects are searched in creation order.\n

    \n

    Note:\ncaches.match() is a convenience method.\nEquivalent functionality is to call cache.match() on each cache (in the order returned by caches.keys()) until a Response is returned.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The match() method of the CacheStorage interface checks if a given Request or URL string is a key for a stored Response.\nThis method returns a Promise for a Response, or a Promise which resolves to undefined if no match is found.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    Cache objects are searched in creation order.\n

    \n

    Note:\ncaches.match() is a convenience method.\nEquivalent functionality is to call cache.match() on each cache (in the order returned by caches.keys()) until a Response is returned.\n

    ", "parameters": { "request": "The Request you want to match. This can be a Request\nobject or a URL string.", - "options": "An object whose properties control how matching is done in the match\noperation. The available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. For example, if set\nto true, the ?value=bar part of\nhttp://foo.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader or not. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific\ncache to search within.\n

    \n
    " + "options": "An object whose properties control how matching is done in the match\noperation. The available options are:\n
    \n
    ignoreSearch
    \n
    \n

    A boolean value that specifies whether the\nmatching process should ignore the query string in the URL. For example, if set\nto true, the ?value=bar part of\nhttps://example.com/?value=bar would be ignored when performing a match.\nIt defaults to false.\n

    \n
    ignoreMethod
    \n
    \n

    A boolean value that, when set to\ntrue, prevents matching operations from validating the\nRequest http method (normally only GET\nand HEAD are allowed.) It defaults to false.\n

    \n
    ignoreVary
    \n
    \n

    A boolean value that, when set to\ntrue, tells the matching operation not to perform VARY\nheader matching. In other words, if the URL matches you will get a match\nregardless of whether the Response object has a VARY\nheader or not. It defaults to false.\n

    \n
    cacheName
    \n
    \n

    A string that represents a specific\ncache to search within.\n

    \n
    " }, - "returns": "a Promise that resolves to the matching Response. If\nno matching response to the specified request is found, the promise resolves\nwith undefined." + "returns": "A Promise that resolves to the matching Response. If\nno matching response to the specified request is found, the promise resolves\nwith undefined." }, "cachestorage.open": { "url": "$MDN_URL$/web/api/cachestorage/open", @@ -8823,7 +8827,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The open() method of the\nCacheStorage interface returns a Promise that resolves to\nthe Cache object matching the cacheName.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    \n

    Note:\nIf the specified Cache does not exist, a new\ncache is created with that cacheName and a Promise that\nresolves to this new Cache object is returned.\n

    ", + "doc": "

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

    \n

    Note: This feature is available in Web Workers.

    \n

    The open() method of the\nCacheStorage interface returns a Promise that resolves to\nthe Cache object matching the cacheName.\n

    You can access CacheStorage through the Window.caches property in windows or through the WorkerGlobalScope.caches property in workers.\n

    \n

    Note:\nIf the specified Cache does not exist, a new\ncache is created with that cacheName and a Promise that\nresolves to this new Cache object is returned.\n

    ", "parameters": { "cacheName": "The name of the cache you want to open." }, @@ -8987,12 +8991,12 @@ "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CanvasGradient.addColorStop() method adds a new color stop,\ndefined by an offset and a color, to a given canvas gradient.", "parameters": { "offset": "A number between 0 and 1, inclusive, representing the\nposition of the color stop. 0 represents the start of the gradient and\n1 represents the end.", - "color": "A CSS <color> value\nrepresenting the color of the stop." + "color": "A CSS <color> value\nrepresenting the color of the stop." }, "returns": "None (undefined).", "throws": { "IndexSizeError DOMException": "Thrown if offset is not between 0 and 1 (both included).", - "SyntaxError DOMException": "Thrown if color cannot be parsed as a CSS <color> value." + "SyntaxError DOMException": "Thrown if color cannot be parsed as a CSS <color> value." } }, "canvaspattern": { @@ -9310,7 +9314,7 @@ "x": "The x-axis coordinate of the center of the gradient.", "y": "The y-axis coordinate of the center of the gradient." }, - "returns": "

    \n
    CanvasGradient
    \n
    \n

    A conic CanvasGradient.\n

    \n
    " + "returns": "A conic CanvasGradient." }, "canvasrenderingcontext2d.createimagedata": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/createimagedata", @@ -9401,7 +9405,7 @@ "image": "An image to be used as the pattern's image.\nIt can be any of the following:\n", "repetition": "A string indicating how to repeat the pattern's image.\nPossible values are:\n\n

    A null value is treated the same as the empty string (\"\"): both are synonyms of \"repeat\"." }, - "returns": "

    \n
    CanvasPattern
    \n
    \n

    An opaque object describing a pattern.\n

    \n
    \n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." + "returns": "An opaque CanvasPattern describing a pattern.\n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." }, "canvasrenderingcontext2d.createradialgradient": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/createradialgradient", @@ -9681,7 +9685,7 @@ "baseline": { "level": "NONE" }, - "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." + "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." }, "canvasrenderingcontext2d.font": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/font", @@ -9702,7 +9706,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.font property of the Canvas 2D API specifies the current text style to use when drawing text.\nThis string uses the same syntax as the CSS font specifier." + "doc": "The CanvasRenderingContext2D.font property of the Canvas 2D API specifies the current text style to use when drawing text.\nThis string uses the same syntax as the CSS font specifier." }, "canvasrenderingcontext2d.fontkerning": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontkerning", @@ -9720,7 +9724,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontKerning property of the Canvas API specifies how font kerning information is used.\n

    Kerning adjusts how adjacent letters are spaced in a proportional font, allowing them to edge into each other's visual area if there is space available.\nFor example, in well-kerned fonts, the characters AV, Ta and We nest together and make character spacing more uniform and pleasant to read than the equivalent text without kerning.\n

    The property corresponds to the font-kerning CSS property." + "doc": "The CanvasRenderingContext2D.fontKerning property of the Canvas API specifies how font kerning information is used.\n

    Kerning adjusts how adjacent letters are spaced in a proportional font, allowing them to edge into each other's visual area if there is space available.\nFor example, in well-kerned fonts, the characters AV, Ta and We nest together and make character spacing more uniform and pleasant to read than the equivalent text without kerning.\n

    The property corresponds to the font-kerning CSS property." }, "canvasrenderingcontext2d.fontstretch": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontstretch", @@ -9738,7 +9742,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontStretch property of the Canvas API specifies how the font may be expanded or condensed when drawing text.\n

    The property corresponds to the font-stretch CSS property when used with keywords (percentage values are not supported)." + "doc": "The CanvasRenderingContext2D.fontStretch property of the Canvas API specifies how the font may be expanded or condensed when drawing text.\n

    The property corresponds to the font-stretch CSS property when used with keywords (percentage values are not supported)." }, "canvasrenderingcontext2d.fontvariantcaps": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontvariantcaps", @@ -9756,7 +9760,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontVariantCaps property of the Canvas API specifies an alternative capitalization of the rendered text.\n

    This corresponds to the CSS font-variant-caps property." + "doc": "The CanvasRenderingContext2D.fontVariantCaps property of the Canvas API specifies an alternative capitalization of the rendered text.\n

    This corresponds to the CSS font-variant-caps property." }, "canvasrenderingcontext2d.getcontextattributes": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/getcontextattributes", @@ -9990,7 +9994,7 @@ "fillRule": "The algorithm by which to determine if a point is inside or outside the path.\nPossible values:\n

    \n
    nonzero
    \n
    \n

    The non-zero winding rule.\nDefault rule.\n

    \n
    evenodd
    \n
    \n

    The even-odd winding rule.\n

    \n
    ", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the specified point is contained in the\ncurrent or specified path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the specified point is contained in the current or specified path, otherwise false." }, "canvasrenderingcontext2d.ispointinstroke": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/ispointinstroke", @@ -10018,7 +10022,7 @@ "y": "The y-axis coordinate of the point to check.", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the point is inside the area contained by\nthe stroking of a path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the point is inside the area contained by the stroking of a path, otherwise false." }, "canvasrenderingcontext2d.lang": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/lang", @@ -10056,7 +10060,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.letterSpacing property of the Canvas API specifies the spacing between letters when drawing text.\n

    This corresponds to the CSS letter-spacing property." + "doc": "The CanvasRenderingContext2D.letterSpacing property of the Canvas API specifies the spacing between letters when drawing text.\n

    This corresponds to the CSS letter-spacing property." }, "canvasrenderingcontext2d.linecap": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/linecap", @@ -10407,7 +10411,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", + "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", "returns": "None (undefined)." }, "canvasrenderingcontext2d.rotate": { @@ -10456,13 +10460,13 @@ "lowDate": "2023-04-11", "highDate": "2025-10-11" }, - "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", + "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", "parameters": { "x": "The x-axis coordinate of the rectangle's starting point, in pixels.", "y": "The y-axis coordinate of the rectangle's starting point, in pixels.", "width": "The rectangle's width. Positive values are to the right, and negative to the left.", "height": "The rectangle's height. Positive values are down, and negative are up.", - "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." + "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." }, "returns": "None (undefined).", "throws": { @@ -10830,7 +10834,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.textRendering property of the Canvas API provides information to the rendering engine about what to optimize for when rendering text.\n

    The values correspond to the SVG text-rendering attribute (and CSS text-rendering property)." + "doc": "The CanvasRenderingContext2D.textRendering property of the Canvas API provides information to the rendering engine about what to optimize for when rendering text.\n

    The values correspond to the SVG text-rendering attribute (and CSS text-rendering property)." }, "canvasrenderingcontext2d.transform": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/transform", @@ -10909,7 +10913,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.wordSpacing property of the Canvas API specifies the spacing between words when drawing text.\n

    This corresponds to the CSS word-spacing property." + "doc": "The CanvasRenderingContext2D.wordSpacing property of the Canvas API specifies the spacing between words when drawing text.\n

    This corresponds to the CSS word-spacing property." }, "capturecontroller": { "url": "$MDN_URL$/web/api/capturecontroller", @@ -10925,7 +10929,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface provides methods that can be used to further manipulate a captured display surface (captured via MediaDevices.getDisplayMedia())\n

    A CaptureController object is associated with a captured display surface by passing it into a getDisplayMedia() call as the value of the options object's controller property." + "doc": "

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

    \n

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

    \n

    The CaptureController interface provides methods that can be used to further manipulate a captured display surface (captured via MediaDevices.getDisplayMedia())\n

    A CaptureController object is associated with a captured display surface by passing it into a getDisplayMedia() call as the value of the options object's controller property." }, "capturecontroller.capturecontroller": { "url": "$MDN_URL$/web/api/capturecontroller/capturecontroller", @@ -10941,7 +10945,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The CaptureController constructor creates a new CaptureController object instance." + "doc": "

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

    \n

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

    \n

    The CaptureController constructor creates a new CaptureController object instance." }, "capturecontroller.decreasezoomlevel": { "url": "$MDN_URL$/web/api/capturecontroller/decreasezoomlevel", @@ -10954,7 +10958,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's decreaseZoomLevel() method decreases the captured display surface's zoom level by one increment.\n

    The decreaseZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", + "doc": "

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

    \n

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

    \n

    The CaptureController interface's decreaseZoomLevel() method decreases the captured display surface's zoom level by one increment.\n

    The decreaseZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", "returns": "A Promise that fulfills with undefined.", "throws": { "InvalidStateError DOMException": "Thrown when:\n

    ", @@ -10972,7 +10976,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's forwardWheel() method starts forwarding wheel events fired on the referenced element to the viewport of an associated captured display surface.\n

    The forwardWheel() method must be invoked via transient activation. Specifically, the only events that can successfully invoke it are click and input. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user grants permission, this also includes permission to scroll captured tabs. If the relevant permission is already \"granted\", transient activation is not needed.", + "doc": "

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

    \n

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

    \n

    The CaptureController interface's forwardWheel() method starts forwarding wheel events fired on the referenced element to the viewport of an associated captured display surface.\n

    The forwardWheel() method must be invoked via transient activation. Specifically, the only events that can successfully invoke it are click and input. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user grants permission, this also includes permission to scroll captured tabs. If the relevant permission is already \"granted\", transient activation is not needed.", "parameters": { "element": "A reference to the element whose wheel events you want to forward to the associated captured display surface." }, @@ -10994,7 +10998,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's getSupportedZoomLevels() method returns the different zoom levels that the captured display surface supports.", + "doc": "

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

    \n

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

    \n

    The CaptureController interface's getSupportedZoomLevels() method returns the different zoom levels that the captured display surface supports.", "returns": "An array of numbers representing the different zoom levels that the captured display surface supports.", "throws": { "InvalidStateError DOMException": "The capturing MediaStream returned by the originating MediaDevices.getDisplayMedia() call is no longer capturing, for example because the associated MediaStreamTrack objects have had stop() called on them.", @@ -11012,7 +11016,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's increaseZoomLevel() method increases the captured display surface's zoom level by one increment.\n

    The increaseZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", + "doc": "

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

    \n

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

    \n

    The CaptureController interface's increaseZoomLevel() method increases the captured display surface's zoom level by one increment.\n

    The increaseZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", "returns": "A Promise that fulfills with undefined.", "throws": { "InvalidStateError DOMException": "Thrown when:\n

    ", @@ -11030,7 +11034,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's resetZoomLevel() method resets the captured display surface's zoom to its initial level, which is 100.\n

    The resetZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", + "doc": "

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

    \n

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

    \n

    The CaptureController interface's resetZoomLevel() method resets the captured display surface's zoom to its initial level, which is 100.\n

    The resetZoomLevel() method must be invoked via transient activation. In addition, the user is asked for permission to share tabs when screen capture is first attempted; if the user denies permission the zoom level cannot be changed even with transient activation.", "returns": "A Promise that fulfills with undefined.", "throws": { "InvalidStateError DOMException": "An attempt is made to invoke resetZoomLevel() without transient activation.", @@ -11051,7 +11055,7 @@ "baseline": { "level": "NONE" }, - "doc": "

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

    \n

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

    \n

    The CaptureController interface's setFocusBehavior() method controls whether the captured tab or window will be focused when an associated MediaDevices.getDisplayMedia() Promise fulfills, or whether the focus will remain with the tab containing the capturing app.\n

    You can set this behavior multiple times before the MediaDevices.getDisplayMedia() call, or once immediately after its Promise resolves. After that, the focus behavior is said to be finalized, and can't be changed.", + "doc": "

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

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CaptureController interface's setFocusBehavior() method controls whether the captured tab or window will be focused when an associated MediaDevices.getDisplayMedia() Promise fulfills, or whether the focus will remain with the tab containing the capturing app.\n

    You can set this behavior multiple times before the MediaDevices.getDisplayMedia() call, or once immediately after its Promise resolves. After that, the focus behavior is said to be finalized, and can't be changed.", "parameters": { "focusBehavior": "An enumerated value that describes whether the user agent should transfer focus to the captured display surface, or keep the capturing app focused. Possible values are focus-captured-surface (transfer focus) and no-focus-change (keep focus on the capturing app)." }, @@ -11084,10 +11088,13 @@ "Edge": "128", "Firefox": "20", "FirefoxAndroid": "20", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The CaretPosition interface represents the caret position, an indicator for the text insertion point.\nYou can get a CaretPosition using the Document.caretPositionFromPoint() method." }, @@ -11102,10 +11109,13 @@ "Edge": "128", "Firefox": "23", "FirefoxAndroid": "23", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The getClientRect() method of the CaretPosition interface returns the client rectangle for the caret range.", "returns": "A DOMRect object." @@ -11121,10 +11131,13 @@ "Edge": "128", "Firefox": "20", "FirefoxAndroid": "20", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The offset property of the CaretPosition interface returns an integer representing the offset of the selection in the caret position node.\n

    This will be the character offset in a text node or the selected child node's index in an element node." }, @@ -11139,10 +11152,13 @@ "Edge": "128", "Firefox": "20", "FirefoxAndroid": "20", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The offsetNode property of the CaretPosition interface returns a Node containing the found node at the caret's position." }, @@ -11188,7 +11204,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The ChannelMergerNode interface, often used in conjunction with its opposite, ChannelSplitterNode, reunites different mono inputs into a single output. Each input is used to fill a channel of the output. This is useful for accessing each channels separately, e.g., for performing channel mixing where gain must be separately controlled on each channel.\n

    If ChannelMergerNode has one single output, but as many inputs as there are channels to merge; the number of inputs is defined as a parameter of its constructor and the call to AudioContext.createChannelMerger(). In the case that no value is given, it will default to 6.\n

    Using a ChannelMergerNode, it is possible to create outputs with more channels than the rendering hardware is able to process. In that case, when the signal is sent to the AudioContext.listener object, supernumerary channels will be ignored.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputsvariable; default to 6.
    Number of outputs1
    Channel count mode\"explicit\"
    Channel count2 (not used in the default count mode)
    Channel interpretation\"speakers\"
    " + "doc": "The ChannelMergerNode interface, often used in conjunction with its opposite, ChannelSplitterNode, reunites different mono inputs into a single output. Each input is used to fill a channel of the output. This is useful for accessing each channel separately, e.g., for performing channel mixing where gain must be separately controlled on each channel.\n

    If ChannelMergerNode has one single output, but as many inputs as there are channels to merge; the number of inputs is defined as a parameter of its constructor and the call to AudioContext.createChannelMerger(). In the case that no value is given, it will default to 6.\n

    Using a ChannelMergerNode, it is possible to create outputs with more channels than the rendering hardware is able to process. In that case, when the signal is sent to the AudioContext.listener object, supernumerary channels will be ignored.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputsvariable; defaults to 6.
    Number of outputs1
    Channel count mode\"explicit\"
    Channel count2 (not used in the default count mode)
    Channel interpretation\"speakers\"
    " }, "channelmergernode.channelmergernode": { "url": "$MDN_URL$/web/api/channelmergernode/channelmergernode", @@ -11240,7 +11256,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The ChannelSplitterNode interface, often used in conjunction with its opposite, ChannelMergerNode, separates the different channels of an audio source into a set of mono outputs. This is useful for accessing each channel separately, e.g., for performing channel mixing where gain must be separately controlled on each channel.\n

    If your ChannelSplitterNode always has one single input, the amount of outputs is defined by a parameter on its constructor and the call to AudioContext.createChannelSplitter(). In the case that no value is given, it will default to 6. If there are fewer channels in the input than there are outputs, supernumerary outputs are silent.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs1
    Number of outputsvariable; default to 6.
    Channel count mode\n\"explicit\" Older implementations, as per earlier versions\nof the spec use \"max\".\n
    Channel count\nFixed to the number of outputs. Older implementations, as per earlier\nversions of the spec use 2 (not used in the default count\nmode).\n
    Channel interpretation\"discrete\"
    " + "doc": "The ChannelSplitterNode interface, often used in conjunction with its opposite, ChannelMergerNode, separates the different channels of an audio source into a set of mono outputs. This is useful for accessing each channel separately, e.g., for performing channel mixing where gain must be separately controlled on each channel.\n

    If your ChannelSplitterNode always has one single input, the amount of outputs is defined by a parameter on its constructor and the call to AudioContext.createChannelSplitter(). In the case that no value is given, it will default to 6. If there are fewer channels in the input than there are outputs, supernumerary outputs are silent.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs1
    Number of outputsvariable; defaults to 6.
    Channel count mode\n\"explicit\". Older implementations, as per earlier versions\nof the spec use \"max\".\n
    Channel count\nFixed to the number of outputs. Older implementations, as per earlier\nversions of the spec use 2 (not used in the default count\nmode).\n
    Channel interpretation\"discrete\"
    " }, "channelsplitternode.channelsplitternode": { "url": "$MDN_URL$/web/api/channelsplitternode/channelsplitternode", @@ -12091,7 +12107,7 @@ }, "returns": "A Promise that resolves to a WindowClient object if the\nURL is from the same origin as the service worker or a null value otherwise.", "throws": { - "InvalidAccessError DOMException": "The promise is rejected with this exception if none of the windows in the app's origin have transient activation." + "InvalidAccessError DOMException": "The promise is rejected with this exception if none of the windows in the app's origin have transient activation." } }, "clipboard": { @@ -12114,7 +12130,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Clipboard interface of the Clipboard API provides read and write access to the contents of the system clipboard.\nThis allows a web application to implement cut, copy, and paste features.\n

    The system clipboard is exposed through the global Navigator.clipboard property.\n

    All of the Clipboard API methods operate asynchronously; they return a Promise which is resolved once the clipboard access has been completed.\nThe promise is rejected if clipboard access is denied.\n

    All the methods require a secure context.\nAdditional requirements for using the API are discussed in the Security consideration section of the API overview topic." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Clipboard interface of the Clipboard API provides read and write access to the contents of the system clipboard.\nThis allows a web application to implement cut, copy, and paste features.\n

    The system clipboard is exposed through the global Navigator.clipboard property.\n

    All of the Clipboard API methods operate asynchronously; they return a Promise which is resolved once the clipboard access has been completed.\nThe promise is rejected if clipboard access is denied.\n

    All the methods require a secure context.\nAdditional requirements for using the API are discussed in the Security consideration section of the API overview topic." }, "clipboard.read": { "url": "$MDN_URL$/web/api/clipboard/read", @@ -12135,7 +12151,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read() method of the Clipboard interface requests a copy of the clipboard's contents, fulfilling the returned Promise with the data.\n

    The method can in theory return arbitrary data (unlike readText(), which can only return text).\nBrowsers commonly support reading text, HTML, and PNG image data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read() method of the Clipboard interface requests a copy of the clipboard's contents, fulfilling the returned Promise with the data.\n

    The method can in theory return arbitrary data (unlike readText(), which can only return text).\nBrowsers commonly support reading text, HTML, and PNG image data.", "parameters": { "formats": "An optional object with the following properties:\n

    \n
    unsanitized Optional
    \n
    \n

    An Array of strings containing MIME types of data formats that should not be sanitized when reading from the clipboard.\n

    Certain browsers may sanitize the clipboard data when it is read, to prevent malicious content from being pasted into the document. For example, Chrome (and other Chromium-based browsers) sanitizes HTML data by stripping <script> tags and other potentially dangerous content. Use the unsanitized array to specify a list of MIME types that should not be sanitized.\n

    \n
    " }, @@ -12163,7 +12179,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The readText() method of the Clipboard interface returns a Promise which fulfills with a copy of the textual contents of the system clipboard.\n

    \n

    Note:\nTo read non-text contents from the clipboard, use the read() method instead.\nYou can write text to the clipboard using writeText().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The readText() method of the Clipboard interface returns a Promise which fulfills with a copy of the textual contents of the system clipboard.\n

    \n

    Note:\nTo read non-text contents from the clipboard, use the read() method instead.\nYou can write text to the clipboard using writeText().\n

    ", "returns": "A Promise that resolves with a string containing the textual contents of the clipboard.\n

    Returns an empty string if the clipboard is empty, does not contain text, or does not include a textual representation among the objects representing the clipboard's contents.", "throws": { "NotAllowedError DOMException": "Thrown if the access to read the clipboard is not allowed.", @@ -12189,7 +12205,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The write() method of the Clipboard interface writes arbitrary ClipboardItem data such as images and text to the clipboard, fulfilling the returned Promise on completion.\nThis can be used to implement cut and copy functionality.\n

    The method can in theory write arbitrary data (unlike writeText(), which can only write text).\nBrowsers commonly support writing text, HTML, and PNG image data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The write() method of the Clipboard interface writes arbitrary ClipboardItem data such as images and text to the clipboard, fulfilling the returned Promise on completion.\nThis can be used to implement cut and copy functionality.\n

    The method can in theory write arbitrary data (unlike writeText(), which can only write text).\nBrowsers commonly support writing text, HTML, and PNG image data.", "parameters": { "data": "An array of ClipboardItem objects containing data to be written to the clipboard." }, @@ -12218,7 +12234,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The writeText() method of the Clipboard interface writes the specified text to the system clipboard, returning a Promise that is resolved once the system clipboard has been updated.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The writeText() method of the Clipboard interface writes the specified text to the system clipboard, returning a Promise that is resolved once the system clipboard has been updated.", "parameters": { "newClipText": "The string to be written to the clipboard." }, @@ -12227,6 +12243,75 @@ "NotAllowedError DOMException": "Thrown if writing to the clipboard is not allowed." } }, + "clipboardchangeevent": { + "url": "$MDN_URL$/web/api/ClipboardChangeEvent", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The ClipboardChangeEvent interface of the Clipboard API represents events fired whenever the contents of the system clipboard are changed." + }, + "clipboardchangeevent.changeid": { + "url": "$MDN_URL$/web/api/ClipboardChangeEvent/changeId", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The changeId read-only property of the ClipboardChangeEvent interface returns an integer representing a unique identifier for this specific clipboard change operation.\n

    The identifier is consistent across all windows and tabs with the same storage key for the same clipboard change, enabling applications to deduplicate events when multiple windows receive the same clipboard change notification." + }, + "clipboardchangeevent.clipboardchangeevent": { + "url": "$MDN_URL$/web/api/ClipboardChangeEvent/ClipboardChangeEvent", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ClipboardChangeEvent() constructor creates a new ClipboardChangeEvent object instance when a clipboardchange event occurs. The clipboardchange event fires whenever the system clipboard contents are changed either by a web app or any other system application.\n

    \n

    Note:\nThis event constructor is generally not needed for production websites. Its primary use is for tests that require an instance of this event.\n

    ", + "parameters": { + "type": "A string with the name of the event. It should always be set to clipboardchange.", + "options": "An object that, in addition to the properties defined in Event(), can have the following properties:\n
    \n
    types
    \n
    \n

    An array of strings representing the data types available on the system clipboard.\n

    \n
    changeId
    \n
    \n

    An integer representing a unique identifier for the clipboard change operation.\n

    \n
    " + }, + "returns": "A new ClipboardChangeEvent object." + }, + "clipboardchangeevent.types": { + "url": "$MDN_URL$/web/api/ClipboardChangeEvent/types", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The types read-only property of the ClipboardChangeEvent interface returns an array of strings representing the mandatory MIME types available on the system clipboard when the ClipboardChangeEvent event was fired. Optional types and custom formats are not included to limit fingerprinting." + }, "clipboardevent": { "url": "$MDN_URL$/web/api/clipboardevent", "status": [ @@ -12317,7 +12402,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ClipboardItem interface of the Clipboard API represents a single item format, used when reading or writing clipboard data using Clipboard.read() and Clipboard.write() respectively.\n

    The ClipboardItem interface enables developers to use a single type to represent a range of different data formats.\n

    \n

    Note:\nThe read() and write() methods can be used to work with text strings and arbitrary data items represented by Blob instances. However, if you are solely working with text, it is more convenient to use the Clipboard.readText() and Clipboard.writeText() methods.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ClipboardItem interface of the Clipboard API represents a single item format, used when reading or writing clipboard data using Clipboard.read() and Clipboard.write() respectively.\n

    The ClipboardItem interface enables developers to use a single type to represent a range of different data formats.\n

    \n

    Note:\nThe read() and write() methods can be used to work with text strings and arbitrary data items represented by Blob instances. However, if you are solely working with text, it is more convenient to use the Clipboard.readText() and Clipboard.writeText() methods.\n

    " }, "clipboarditem.clipboarditem": { "url": "$MDN_URL$/web/api/clipboarditem/clipboarditem", @@ -12338,7 +12423,7 @@ "level": "LOW", "lowDate": "2025-02-06" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ClipboardItem() constructor creates a new ClipboardItem object, which represents data to be stored or retrieved via the Clipboard API clipboard.write() and clipboard.read() methods, respectively.\n

    \n

    Note:\nThe read() and write() methods can be used to work with text strings and arbitrary data items represented by Blob instances. However, if you are solely working with text, it is more convenient to use the Clipboard.readText() and Clipboard.writeText() methods.\n

    \n
    \n

    Note:\nImage format support varies by browser. See the browser compatibility table for the Clipboard interface.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ClipboardItem() constructor creates a new ClipboardItem object, which represents data to be stored or retrieved via the Clipboard API clipboard.write() and clipboard.read() methods, respectively.\n

    \n

    Note:\nThe read() and write() methods can be used to work with text strings and arbitrary data items represented by Blob instances. However, if you are solely working with text, it is more convenient to use the Clipboard.readText() and Clipboard.writeText() methods.\n

    \n
    \n

    Note:\nImage format support varies by browser. See the browser compatibility table for the Clipboard interface.\n

    ", "parameters": { "data": "An Object with the MIME type as the key and data as the value.\nThe data can be represented as one of the following:\n", "options": "An object with the following properties:\n
    \n
    presentationStyle Optional
    \n
    \n

    One of the three strings: unspecified, inline or attachment.\nThe default is unspecified.\n

    inline signifies to apps that receive the paste that the ClipboardItem should be inserted inline at the point of paste. attachment signifies to apps that receive the paste that the ClipboardItem should be added as an attachment. unspecified doesn't signify any information to apps that receive the paste.\n

    \n
    " @@ -12363,7 +12448,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getType() method of the ClipboardItem interface returns a Promise that resolves with a Blob of the requested MIME type or an error if the MIME type is not found.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getType() method of the ClipboardItem interface returns a Promise that resolves with a Blob of the requested MIME type or an error if the MIME type is not found.", "parameters": { "type": "A valid MIME type." }, @@ -12387,7 +12472,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only presentationStyle property of the ClipboardItem interface returns a string indicating how an item should be presented.\n

    For example, in some contexts an image might be displayed inline, while in others it might be represented as an attachment." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only presentationStyle property of the ClipboardItem interface returns a string indicating how an item should be presented.\n

    For example, in some contexts an image might be displayed inline, while in others it might be represented as an attachment." }, "clipboarditem.supports": { "url": "$MDN_URL$/web/api/clipboarditem/supports_static", @@ -12408,7 +12493,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The supports() static method of the ClipboardItem interface returns true if the given MIME type is supported by the clipboard, and false otherwise.\n

    Note that the Clipboard API mandates support for plain text, HTML and PNG files.\nThe supports() method will always return true for these MIME types, so testing them is unnecessary.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The supports() static method of the ClipboardItem interface returns true if the given MIME type is supported by the clipboard, and false otherwise.\n

    Note that the Clipboard API mandates support for plain text, HTML and PNG files.\nThe supports() method will always return true for these MIME types, so testing them is unnecessary.", "parameters": { "type": "A string indicating the MIME type to test.\n

    These MIME types are always supported:\n

    \n

    These MIME types may be supported:\n

    " }, @@ -12433,7 +12518,7 @@ "level": "LOW", "lowDate": "2024-06-11" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only types property of the ClipboardItem interface returns an Array of MIME types available within the ClipboardItem." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only types property of the ClipboardItem interface returns an Array of MIME types available within the ClipboardItem." }, "closeevent": { "url": "$MDN_URL$/web/api/closeevent", @@ -12613,7 +12698,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CloseWatcher() constructor creates a new CloseWatcher object.\n

    You can create CloseWatcher instances without user activation, and this can be useful to implement cases like session inactivity timeout dialogs. However, if you create more than one CloseWatcher without user activation, then the newly-created one will be grouped together with the last one, so a single close request will close them both. This means that it is important to call destroy(), close(), and requestClose() properly.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CloseWatcher() constructor creates a new CloseWatcher object.\n

    You can create CloseWatcher instances without user activation, and this can be useful to implement cases like session inactivity timeout dialogs. However, if you create more than one CloseWatcher without user activation, then the newly-created one will be grouped together with the last one, so a single close request will close them both. This means that it is important to call destroy(), close(), and requestClose() properly.", "parameters": { "options": "An object that has the following properties:\n

    \n
    signal
    \n
    \n

    An AbortSignal. If this is provided, then the watcher can be destroyed (as if by calling CloseWatcher.destroy()) by calling AbortController.abort() on the corresponding AbortController.\n

    \n
    " }, @@ -12669,10 +12754,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The CommandEvent interface represents an event notifying the user when a button element with valid commandForElement and command attributes is about to invoke an interactive element.\n

    This is the event object for the HTMLElement command event, which represents an action from an Invoker Control when it is invoked (for example when it is clicked or pressed)." }, @@ -12688,10 +12775,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The command read-only property of the CommandEvent interface returns a string containing the value of the command property at the time the event was dispatched." }, @@ -12707,10 +12796,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The CommandEvent() constructor creates a new CommandEvent object.", "parameters": { @@ -12731,10 +12822,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The source read-only property of the CommandEvent interface returns an EventTarget representing the control that invoked the given command." }, @@ -12910,10 +13003,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CompressionStream interface of the Compression Streams API is an API for compressing a stream of data." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CompressionStream interface of the Compression Streams API compresses a stream of data. It implements the same shape as a TransformStream, allowing it to be used in ReadableStream.pipeThrough() and similar methods." }, "compressionstream.compressionstream": { "url": "$MDN_URL$/web/api/compressionstream/compressionstream", @@ -12933,12 +13027,13 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CompressionStream() constructor creates a new CompressionStream object which compresses a stream of data.", "parameters": { - "format": "One of the following allowed compression formats:\n

    \n
    \"gzip\"
    \n
    \n

    Compresses the stream using the GZIP format.\n

    \n
    \"deflate\"
    \n
    \n

    Compresses the stream using the DEFLATE algorithm in ZLIB Compressed Data Format.\nThe ZLIB format includes a header with information about the compression method and the uncompressed size of the data, and a trailing checksum for verifying the integrity of the data\n

    \n
    \"deflate-raw\"
    \n
    \n

    Compresses the stream using the DEFLATE algorithm without a header and trailing checksum.\n

    \n
    " + "format": "One of the following allowed compression formats:\n
    \n
    \"brotli\"
    \n
    \n

    Compresses the stream using the Brotli algorithm.\n

    \n
    \"gzip\"
    \n
    \n

    Compresses the stream using the GZIP format.\n

    \n
    \"deflate\"
    \n
    \n

    Compresses the stream using the DEFLATE algorithm in ZLIB Compressed Data Format.\nThe ZLIB format includes a header with information about the compression method and the uncompressed size of the data, and a trailing checksum for verifying the integrity of the data\n

    \n
    \"deflate-raw\"
    \n
    \n

    Compresses the stream using the DEFLATE algorithm without a header and trailing checksum.\n

    \n
    \"zstd\"
    \n
    \n

    Compresses the stream using the ZSTD algorithm.\n

    \n
    " }, "throws": { "TypeError": "Thrown if the format passed to the constructor is not supported." @@ -12962,10 +13057,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the CompressionStream interface returns a ReadableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the CompressionStream interface returns a ReadableStream that emits compressed data as Uint8Array chunks." }, "compressionstream.writable": { "url": "$MDN_URL$/web/api/compressionstream/writable", @@ -12985,10 +13081,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the CompressionStream interface returns a WritableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the CompressionStream interface returns a WritableStream that accepts uncompressed data to be compressed, in the form of ArrayBuffer, TypedArray, or DataView chunks." }, "console": { "url": "$MDN_URL$/web/api/console", @@ -13543,9 +13640,15 @@ "SafariIOS": "6", "Deno": "1.29" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The console.timeStamp() static method adds a single marker to the browser's Performance tool (Firefox bug 1387528, Chrome). This lets you correlate a point in your code with the other events recorded in the timeline, such as layout and paint events.\n

    You can optionally supply an argument to label the timestamp, and this label will then be shown alongside the marker.", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The console.timeStamp() static method adds a single marker to the browser's Performance tool (Firefox bug 1387528, Chrome). This lets you correlate a point in your code with the other events recorded in the timeline, such as layout and paint events.\n

    You can optionally supply an argument to label the timestamp, and this label will then be shown alongside the marker.\n

    Some browsers have further extended this console.timeStamp() method to allow additional, optional parameters to be provided as part of its extensibility API that surfaces these in performances traces. See the Chrome's extensibility API documentation for more information.", "parameters": { - "label": "Label for the timestamp." + "color": "A string for the display colour of the entry. Must be one of \"primary\", \"primary-light\", \"primary-dark\", \"secondary\", \"secondary-light\", \"secondary-dark\", \"tertiary\", \"tertiary-light\", \"tertiary-dark\", \"error\".", + "data": "An object with additional data to display. URLs may automatically be turned into links by some browsers.", + "end": "A string referencing a previously defined timeStamp label or a timestamp (DOMHighResTimeStamp) to be used as the end time.", + "label": "Label for the timestamp.", + "start": "A string referencing a previously defined timeStamp label or a timestamp (DOMHighResTimeStamp) to be used as the start time.", + "trackName": "The name of the custom track used to display the timestamp data", + "trackGroup": "The group of the custom track used to display the timestamp data" }, "returns": "None (undefined)." }, @@ -13675,7 +13778,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The read-only offset property of the ConstantSourceNode\ninterface returns a AudioParam object indicating the numeric a-rate value which is always returned\nby the source when asked for the next sample.\n

    \n

    Note:\nWhile the AudioParam named offset is read-only, the\nvalue property within is not. So you can change the value of\noffset by setting the value of\nConstantSourceNode.offset.value:\n

    \n```js\nmyConstantSourceNode.offset.value = newValue;\n```\n
    \n
    " + "doc": "The read-only offset property of the ConstantSourceNode\ninterface returns an AudioParam object indicating the numeric a-rate value which is always returned\nby the source when asked for the next sample.\n
    \n

    Note:\nWhile the AudioParam named offset is read-only, the\nvalue property within is not. So you can change the value of\noffset by setting the value of\nConstantSourceNode.offset.value:\n

    \n```js\nmyConstantSourceNode.offset.value = newValue;\n```\n
    \n
    " }, "contactaddress": { "url": "$MDN_URL$/web/api/contactaddress", @@ -13689,7 +13792,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The ContactAddress interface of the Contact Picker API represents a physical address. Instances of this interface are retrieved from the address property of the objects returned by ContactsManager.getProperties().\n

    It may be useful to refer to the Universal Postal Union website's Addressing S42 standard materials, which provide information about international standards for postal addresses." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The ContactAddress interface of the Contact Picker API represents a physical address. Instances of this interface are retrieved from the address property of the objects returned by ContactsManager.getProperties().\n

    It may be useful to refer to the Universal Postal Union website's Addressing S42 standard materials, which provide information about international standards for postal addresses." }, "contactaddress.addressline": { "url": "$MDN_URL$/web/api/contactaddress/addressline", @@ -13703,7 +13806,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The addressLine read-only property of the ContactAddress interface is an array of strings, each specifying a line of the address that is not covered by one of the other properties of ContactAddress. The array may include the street name, the house number, apartment number, the rural delivery route, descriptive instructions, or the post office box." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The addressLine read-only property of the ContactAddress interface is an array of strings, each specifying a line of the address that is not covered by one of the other properties of ContactAddress. The array may include the street name, the house number, apartment number, the rural delivery route, descriptive instructions, or the post office box." }, "contactaddress.city": { "url": "$MDN_URL$/web/api/contactaddress/city", @@ -13717,7 +13820,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The city read-only property of the ContactAddress interface returns a string containing the city or town portion of the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The city read-only property of the ContactAddress interface returns a string containing the city or town portion of the address." }, "contactaddress.country": { "url": "$MDN_URL$/web/api/contactaddress/country", @@ -13731,7 +13834,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The country read-only property of the ContactAddress 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.\n

    Some examples of valid country values: \"US\", \"GB\", \"CN\", or \"JP\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The country read-only property of the ContactAddress 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.\n

    Some examples of valid country values: \"US\", \"GB\", \"CN\", or \"JP\"." }, "contactaddress.dependentlocality": { "url": "$MDN_URL$/web/api/contactaddress/dependentlocality", @@ -13745,7 +13848,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only dependentLocality property of the ContactAddress interface is a string containing a locality or sublocality designation within a city, such as a neighborhood, borough, district, or, in the United Kingdom, a dependent locality. Also known as a post town." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only dependentLocality property of the ContactAddress interface is a string containing a locality or sublocality designation within a city, such as a neighborhood, borough, district, or, in the United Kingdom, a dependent locality. Also known as a post town." }, "contactaddress.organization": { "url": "$MDN_URL$/web/api/contactaddress/organization", @@ -13759,7 +13862,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The organization read-only property of the ContactAddress interface returns a string containing the name of the organization, firm, company, or institution at the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The organization read-only property of the ContactAddress interface returns a string containing the name of the organization, firm, company, or institution at the address." }, "contactaddress.phone": { "url": "$MDN_URL$/web/api/contactaddress/phone", @@ -13773,7 +13876,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only phone property of the ContactAddress interface returns a string containing the telephone number of the recipient or contact person at the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only phone property of the ContactAddress interface returns a string containing the telephone number of the recipient or contact person at the address." }, "contactaddress.postalcode": { "url": "$MDN_URL$/web/api/contactaddress/postalcode", @@ -13787,7 +13890,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The postalCode read-only property of the ContactAddress interface returns a string containing a code used by a jurisdiction for mail routing, for example, the ZIP Code in the United States or the Postal Index Number (PIN code) in India." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The postalCode read-only property of the ContactAddress interface returns a string containing a code used by a jurisdiction for mail routing, for example, the ZIP Code in the United States or the Postal Index Number (PIN code) in India." }, "contactaddress.recipient": { "url": "$MDN_URL$/web/api/contactaddress/recipient", @@ -13801,7 +13904,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only recipient property of the ContactAddress interface returns a string containing the name of the recipient, purchaser, or contact person at the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only recipient property of the ContactAddress interface returns a string containing the name of the recipient, purchaser, or contact person at the address." }, "contactaddress.region": { "url": "$MDN_URL$/web/api/contactaddress/region", @@ -13815,7 +13918,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only region property of the ContactAddress interface returns a string containing the top-level administrative subdivision of the country in which the address is located. This may be a state, province, oblast, or prefecture." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only region property of the ContactAddress interface returns a string containing the top-level administrative subdivision of the country in which the address is located. This may be a state, province, oblast, or prefecture." }, "contactaddress.sortingcode": { "url": "$MDN_URL$/web/api/contactaddress/sortingcode", @@ -13829,7 +13932,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The sortingCode read-only property of the ContactAddress interface returns a string containing a postal sorting code such as is used in France." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The sortingCode read-only property of the ContactAddress interface returns a string containing a postal sorting code such as is used in France." }, "contactaddress.tojson": { "url": "$MDN_URL$/web/api/contactaddress/tojson", @@ -13843,7 +13946,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The toJSON() method of the ContactAddress interface is a standard serializer that returns a JSON representation of the ContactAddress object's properties.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The toJSON() method of the ContactAddress interface is a standard serializer that returns a JSON representation of the ContactAddress object's properties.", "returns": "A JSON object." }, "contactsmanager": { @@ -13858,7 +13961,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The ContactsManager interface of the Contact Picker API allows users to select entries from their contact list and share limited details of the selected entries with a website or application.\n

    The ContactsManager is available through the global navigator.contacts property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The ContactsManager interface of the Contact Picker API allows users to select entries from their contact list and share limited details of the selected entries with a website or application.\n

    The ContactsManager is available through the global navigator.contacts property." }, "contactsmanager.getproperties": { "url": "$MDN_URL$/web/api/contactsmanager/getproperties", @@ -13872,7 +13975,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getProperties() method of the\nContactsManager interface returns a Promise which resolves\nwith an Array of strings indicating which contact\nproperties are available.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getProperties() method of the\nContactsManager interface returns a Promise which resolves\nwith an Array of strings indicating which contact\nproperties are available.", "returns": "Returns a Promise that resolves with an Array of strings naming the contact properties that can be returned by the current system.\n

    Properties can include the following:\n

    " }, "contactsmanager.select": { @@ -13887,7 +13990,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The select() method of the\nContactsManager interface returns a Promise which, when\nresolved, presents the user with a contact picker which allows them to select contact(s)\nthey wish to share. This method requires a user gesture for the Promise to\nresolve.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The select() method of the\nContactsManager interface returns a Promise which, when\nresolved, presents the user with a contact picker which allows them to select contact(s)\nthey wish to share. This method requires a user gesture for the Promise to\nresolve.", "parameters": { "properties": "An array of strings defining what information to retrieve\nfrom a contact. Allowed values are as follows:\n

    ", "options": "Options are as follows:\n
    \n
    multiple
    \n
    \n

    A Boolean that allows multiple contacts to be selected. The default is false.\n

    \n
    " @@ -13895,7 +13998,7 @@ "returns": "Returns a Promise that resolves with an array of objects containing contact information. Each object represents a single contact may contain the following properties:\n
    \n
    address
    \n
    \n

    An Array of ContactAddress objects, each containing specifics of a unique physical address.\n

    \n
    email
    \n
    \n

    An array of strings containing email addresses.\n

    \n
    icon
    \n
    \n

    An array of Blob objects containing images of an individual.\n

    \n
    name
    \n
    \n

    An array strings, each containing a unique name of an individual.\n

    \n
    tel
    \n
    \n

    An array strings, each containing a unique phone number of an individual.\n

    \n
    ", "throws": { "InvalidStateError DOMException": "Returned if the browsing context is not top-level, if the contact picker shows a flag that denotes an already existing contact picker since only one picker can exist at any time, or if launching a contact picker failed.", - "SecurityError DOMException": "Returned if the method is not triggered by user activation.", + "SecurityError DOMException": "Returned if the method is not triggered by user activation.", "TypeError": "Returned if properties is empty, or if any of the specified properties are not\nsupported." } }, @@ -14033,7 +14136,7 @@ "level": "LOW", "lowDate": "2024-09-16" }, - "doc": "The ContentVisibilityAutoStateChangeEvent interface is the event object for the contentvisibilityautostatechange event, which fires on any element with content-visibility: auto set on it when it starts or stops being relevant to the user and skipping its contents.\n

    While the element is not relevant (between the start and end events), the user agent skips an element's rendering, including layout and painting.\nThis can significantly improve page rendering speed.\nThe contentvisibilityautostatechange event provides a way for an app's code to also start or stop rendering processes (e.g., drawing on a <canvas>) when they are not needed, thereby conserving processing power.\n

    Note that even when hidden from view, element contents will remain semantically relevant (e.g., to assistive technology users), so this signal should not be used to skip significant semantic DOM updates." + "doc": "The ContentVisibilityAutoStateChangeEvent interface is the event object for the contentvisibilityautostatechange event, which fires on any element with content-visibility: auto set on it when it starts or stops being relevant to the user and skipping its contents.\n

    While the element is not relevant (between the start and end events), the user agent skips an element's rendering, including layout and painting.\nThis can significantly improve page rendering speed.\nThe contentvisibilityautostatechange event provides a way for an app's code to also start or stop rendering processes (e.g., drawing on a <canvas>) when they are not needed, thereby conserving processing power.\n

    Note that even when hidden from view, element contents will remain semantically relevant (e.g., to assistive technology users), so this signal should not be used to skip significant semantic DOM updates." }, "contentvisibilityautostatechangeevent.contentvisibilityautostatechangeevent": { "url": "$MDN_URL$/web/api/contentvisibilityautostatechangeevent/contentvisibilityautostatechangeevent", @@ -14057,7 +14160,7 @@ "doc": "The ContentVisibilityAutoStateChangeEvent() constructor creates a new ContentVisibilityAutoStateChangeEvent object instance.", "parameters": { "type": "A string representing the type of event. In the case of ContentVisibilityAutoStateChangeEvent this is always event.", - "options": "An object that contains the following properties:\n

    \n
    skipped
    \n
    \n

    A boolean, which is set to true if the user agent skips the element's contents, or false otherwise.\n

    \n
    " + "options": "An object that contains the following properties:\n
    \n
    skipped
    \n
    \n

    A boolean, which is set to true if the user agent skips the element's contents, or false otherwise.\n

    \n
    " } }, "contentvisibilityautostatechangeevent.skipped": { @@ -14079,7 +14182,7 @@ "level": "LOW", "lowDate": "2024-09-16" }, - "doc": "The skipped read-only property of the ContentVisibilityAutoStateChangeEvent interface returns true if the user agent skips the element's contents, or false otherwise." + "doc": "The skipped read-only property of the ContentVisibilityAutoStateChangeEvent interface returns true if the user agent skips the element's contents, or false otherwise." }, "convolvernode": { "url": "$MDN_URL$/web/api/convolvernode", @@ -14196,7 +14299,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CookieChangeEvent interface of the Cookie Store API is the event type of the change event fired at a CookieStore when any cookies are created or deleted.\n

    \n

    Note:\nA cookie that is replaced due to the insertion of another cookie with the same name, domain, and path, is ignored and does not trigger a change event.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CookieChangeEvent interface of the Cookie Store API is the event type of the change event fired at a CookieStore when any cookies are created or deleted.\n

    \n

    Note:\nA cookie that is replaced due to the insertion of another cookie with the same name, domain, and path, is ignored and does not trigger a change event.\n

    " }, "cookiechangeevent.changed": { "url": "$MDN_URL$/web/api/cookiechangeevent/changed", @@ -14217,7 +14320,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The changed read-only property of the CookieChangeEvent interface returns an array of the cookies that have been changed.\n

    Note that this will exclude cookies which were created with an expiry date in the past, as these cookies are immediately deleted." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The changed read-only property of the CookieChangeEvent interface returns an array of the cookies that have been changed.\n

    Note that this will exclude cookies which were created with an expiry date in the past, as these cookies are immediately deleted." }, "cookiechangeevent.cookiechangeevent": { "url": "$MDN_URL$/web/api/cookiechangeevent/cookiechangeevent", @@ -14238,7 +14341,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CookieChangeEvent() constructor creates a new CookieChangeEvent object\nwhich is the event type of the change event fired at a CookieStore when any cookie changes occur.\nThis constructor is called by the browser when a change event occurs.\n

    \n

    Note:\nThis event constructor is generally not needed for production websites. It's primary use is for tests that require an instance of this event.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CookieChangeEvent() constructor creates a new CookieChangeEvent object\nwhich is the event type of the change event fired at a CookieStore when any cookie changes occur.\nThis constructor is called by the browser when a change event occurs.\n

    \n

    Note:\nThis event constructor is generally not needed for production websites. It's primary use is for tests that require an instance of this event.\n

    ", "parameters": { "type": "A string with the name of the event. It is case-sensitive and browsers always set it to change.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n
    \n
    changed Optional
    \n
    \n

    An array containing the changed cookies.\n

    \n
    deleted Optional
    \n
    \n

    An array containing the deleted cookies.\n

    \n
    " @@ -14264,7 +14367,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deleted read-only property of the CookieChangeEvent interface returns an array of the cookies that have been deleted by the given CookieChangeEvent instance.\n

    Note that this will include cookies which were created with an expiry date in the past, as these cookies are immediately deleted." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deleted read-only property of the CookieChangeEvent interface returns an array of the cookies that have been deleted by the given CookieChangeEvent instance.\n

    Note that this will include cookies which were created with an expiry date in the past, as these cookies are immediately deleted." }, "cookiestore": { "url": "$MDN_URL$/web/api/cookiestore", @@ -14285,7 +14388,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The CookieStore interface of the Cookie Store API provides methods for getting and setting cookies asynchronously from either a page or a service worker.\n

    The CookieStore is accessed via attributes in the global scope in a Window or ServiceWorkerGlobalScope context. Therefore there is no constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The CookieStore interface of the Cookie Store API provides methods for getting and setting cookies asynchronously from either a page or a service worker.\n

    The CookieStore is accessed via attributes in the global scope in a Window or ServiceWorkerGlobalScope context. Therefore there is no constructor." }, "cookiestore.delete": { "url": "$MDN_URL$/web/api/cookiestore/delete", @@ -14306,7 +14409,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The delete() method of the CookieStore interface deletes a cookie that matches the given name or options object.\nThe method expires the cookie by changing its date to one in the past.\n

    Note that there is no error if a cookie cannot be matched: the returned promise will fulfill when the matched cookie is deleted or if no cookie is matched.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The delete() method of the CookieStore interface deletes a cookie that matches the given name or options object.\nThe method expires the cookie by changing its date to one in the past.\n

    Note that there is no error if a cookie cannot be matched: the returned promise will fulfill when the matched cookie is deleted or if no cookie is matched.", "parameters": { "name": "A string with the name of a cookie.", "options": "An object containing:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    domain Optional
    \n
    \n

    A string with the domain of a cookie. Defaults to null.\n

    \n
    path Optional
    \n
    \n

    A string containing a path. Defaults to /.\n

    \n
    partitioned Optional
    \n
    \n

    A boolean value that defaults to false. Setting it to true specifies that the cookie to delete will be a partitioned cookie. See Cookies Having Independent Partitioned State (CHIPS) for more information.\n

    \n
    " @@ -14336,12 +14439,12 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The get() method of the CookieStore interface returns a Promise that resolves to a single cookie matching the given name or options object. The method will return the first cookie that matches.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The get() method of the CookieStore interface returns a Promise that resolves to a single cookie matching the given name or options object. The method will return the first cookie that matches.", "parameters": { "name": "A string with the name of a cookie.", "options": "An object containing:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    url
    \n
    \n

    A string with the URL of a cookie.\n

    \n
    " }, - "returns": "A Promise that resolves with an object representing the first cookie matching the submitted name or options, or null if there is no matching cookie.\n

    The object returned for a match contains the following properties:\n

    \n
    domain
    \n
    \n

    A string containing the domain of the cookie.\n

    \n
    expires
    \n
    \n

    A timestamp, given as Unix time in milliseconds, containing the expiration date of the cookie.\n

    \n
    name
    \n
    \n

    A string containing the name of the cookie.\n

    \n
    partitioned
    \n
    \n

    A boolean indicating whether the cookie is a partitioned cookie (true) or not (false). See Cookies Having Independent Partitioned State (CHIPS) for more information.\n

    \n
    path
    \n
    \n

    A string containing the path of the cookie.\n

    \n
    sameSite
    \n
    \n

    One of the following SameSite values: \"strict\", \"lax\", or \"none\".\n

    \n
    secure
    \n
    \n

    A boolean value indicating whether the cookie is to be used in secure contexts only (true) or not (false).\n

    \n
    value
    \n
    \n

    A string containing the value of the cookie.\n

    \n
    ", + "returns": "A Promise that resolves with an object representing the first cookie matching the submitted name or options, or null if there is no matching cookie.\n

    The object returned for a match contains the following properties:\n

    \n
    domain \nExperimental\n \nNon-standard\n
    \n
    \n

    A string containing the domain of the cookie.\n

    \n
    expires \nExperimental\n \nNon-standard\n
    \n
    \n

    A timestamp, given as Unix time in milliseconds, containing the expiration date of the cookie.\n

    \n
    name \nExperimental\n \nNon-standard\n
    \n
    \n

    A string containing the name of the cookie.\n

    \n
    partitioned \nExperimental\n \nNon-standard\n
    \n
    \n

    A boolean indicating whether the cookie is a partitioned cookie (true) or not (false). See Cookies Having Independent Partitioned State (CHIPS) for more information.\n

    \n
    path \nExperimental\n \nNon-standard\n
    \n
    \n

    A string containing the path of the cookie.\n

    \n
    sameSite \nExperimental\n \nNon-standard\n
    \n
    \n

    One of the following SameSite values: \"strict\", \"lax\", or \"none\".\n

    \n
    secure \nExperimental\n \nNon-standard\n
    \n
    \n

    A boolean value indicating whether the cookie is to be used in secure contexts only (true) or not (false).\n

    \n
    value \nExperimental\n \nNon-standard\n
    \n
    \n

    A string containing the value of the cookie.\n

    \n
    ", "throws": { "SecurityError DOMException": "Thrown if the origin does not serialize to a URL.", "TypeError": "Thrown if:\n" @@ -14366,7 +14469,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The getAll() method of the CookieStore interface returns a Promise that resolves as an array of cookies that match the name or options passed to it.\nPassing no parameters will return all cookies for the current context.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The getAll() method of the CookieStore interface returns a Promise that resolves as an array of cookies that match the name or options passed to it.\nPassing no parameters will return all cookies for the current context.", "parameters": { "name": "A string with the name of a cookie.", "options": "An object containing:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    url
    \n
    \n

    A string with the URL of a cookie.\n

    \n
    " @@ -14396,7 +14499,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The set() method of the CookieStore interface sets a cookie with the given name and value or options object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The set() method of the CookieStore interface sets a cookie with the given name and value or options object.", "parameters": { "name": "A string with the name of the cookie.", "value": "A string with the value of the cookie.", @@ -14424,7 +14527,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The CookieStoreManager interface of the Cookie Store API allows service workers to subscribe to cookie change events. Call subscribe() on a particular service worker registration to receive change events.\n

    A CookieStoreManager has an associated ServiceWorkerRegistration. Each service worker registration has a cookie change subscription list, which is a list of cookie change subscriptions each containing a name and URL. The methods in this interface allow the service worker to add and remove subscriptions from this list, and to get a list of all subscriptions.\n

    To get a CookieStoreManager, call ServiceWorkerRegistration.cookies." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The CookieStoreManager interface of the Cookie Store API allows service workers to subscribe to cookie change events. Call subscribe() on a particular service worker registration to receive change events.\n

    A CookieStoreManager has an associated ServiceWorkerRegistration. Each service worker registration has a cookie change subscription list, which is a list of cookie change subscriptions each containing a name and URL. The methods in this interface allow the service worker to add and remove subscriptions from this list, and to get a list of all subscriptions.\n

    To get a CookieStoreManager, call ServiceWorkerRegistration.cookies." }, "cookiestoremanager.getsubscriptions": { "url": "$MDN_URL$/web/api/cookiestoremanager/getsubscriptions", @@ -14442,7 +14545,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The getSubscriptions() method of the CookieStoreManager interface returns a list of all the cookie change subscriptions for this ServiceWorkerRegistration.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The getSubscriptions() method of the CookieStoreManager interface returns a list of all the cookie change subscriptions for this ServiceWorkerRegistration.", "returns": "A Promise that resolves with a list of objects, each containing:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    url
    \n
    \n

    A string with the url of the scope used to subscribe to the cookie(s).\n

    \n
    " }, "cookiestoremanager.subscribe": { @@ -14461,7 +14564,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The subscribe() method of the CookieStoreManager interface subscribes a ServiceWorkerRegistration to cookie change events.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The subscribe() method of the CookieStoreManager interface subscribes a ServiceWorkerRegistration to cookie change events.", "parameters": { "subscriptions": "An array of objects, each of which has the following properties:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    url
    \n
    \n

    A string with the url of a cookie scope. This may be narrower than the scope of the service worker registration.\n

    \n
    " }, @@ -14486,7 +14589,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The unsubscribe() method of the CookieStoreManager interface stops the ServiceWorkerRegistration from receiving previously subscribed events.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The unsubscribe() method of the CookieStoreManager interface stops the ServiceWorkerRegistration from receiving previously subscribed events.", "parameters": { "subscriptions": "An object list, each object containing:\n

    \n
    name
    \n
    \n

    A string with the name of a cookie.\n

    \n
    url
    \n
    \n

    A string with the url of the scope used to subscribe to this cookie.\n

    \n
    " }, @@ -14638,7 +14741,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CreateMonitor interface provides information on the progress of an AI model download or some fine-tuning data for the model.\n

    It can be used via:\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CreateMonitor interface provides information on the progress of an AI model download or some fine-tuning data for the model.\n

    It can be used via:\n

    " }, "credential": { "url": "$MDN_URL$/web/api/credential", @@ -14660,7 +14763,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Credential interface of the Credential Management API provides information about an entity (usually a user) normally as a prerequisite to a trust decision.\n

    Credential objects may be of the following types:\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Credential interface of the Credential Management API provides information about an entity (usually a user) normally as a prerequisite to a trust decision.\n

    Credential objects may be of the following types:\n

    " }, "credential.id": { "url": "$MDN_URL$/web/api/credential/id", @@ -14682,7 +14785,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the Credential interface returns a string containing the credential's identifier. This might be a GUID, username, or email address, or some other value, depending on the type of credential." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the Credential interface returns a string containing the credential's identifier. This might be a GUID, username, or email address, or some other value, depending on the type of credential." }, "credential.isconditionalmediationavailable": { "url": "$MDN_URL$/web/api/credential/isconditionalmediationavailable_static", @@ -14697,7 +14800,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The isConditionalMediationAvailable() static method of the Credential interface returns a Promise which resolves to false.\n

    Subclasses of Credential override this method if they support conditional mediation. See PublicKeyCredential.isConditionalMediationAvailable(), for example.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The isConditionalMediationAvailable() static method of the Credential interface returns a Promise which resolves to false.\n

    Subclasses of Credential override this method if they support conditional mediation. See PublicKeyCredential.isConditionalMediationAvailable(), for example.", "returns": "A Promise which resolves to false." }, "credential.type": { @@ -14720,7 +14823,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the Credential interface returns a string containing the credential's type. Valid values are password, federated, public-key, identity and otp." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the Credential interface returns a string containing the credential's type. Valid values are password, federated, public-key, identity and otp." }, "credentialscontainer": { "url": "$MDN_URL$/web/api/credentialscontainer", @@ -14742,7 +14845,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CredentialsContainer interface of the Credential Management API exposes methods to request credentials and notify the user agent when events such as successful sign in or sign out happen. This interface is accessible from Navigator.credentials." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CredentialsContainer interface of the Credential Management API exposes methods to request credentials and notify the user agent when events such as successful sign in or sign out happen. This interface is accessible from Navigator.credentials." }, "credentialscontainer.create": { "url": "$MDN_URL$/web/api/credentialscontainer/create", @@ -14764,7 +14867,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() method of the CredentialsContainer interface creates a new credential, which can then be stored and later retrieved using the navigator.credentials.get() method. The retrieved credential can then be used by a website to authenticate a user.\n

    This method supports three different types of credential:\n

    \n

    Note that the Federated Credential Management API (FedCM) supersedes the federated credential type.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() method of the CredentialsContainer interface creates a new credential, which can then be stored and later retrieved using the navigator.credentials.get() method. The retrieved credential can then be used by a website to authenticate a user.\n

    This method supports three different types of credential:\n

    \n

    Note that the Federated Credential Management API (FedCM) supersedes the federated credential type.", "parameters": { "options": "An object that contains options for the requested new Credentials object. It can contain the following properties:\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance that allows an ongoing create() operation to be aborted. An aborted operation may complete normally (generally if the abort was received after the operation finished) or reject with an AbortError DOMException.\n

    \n
    \n

    Each of the following properties represents a credential type being created. One and only one of them must be specified:\n

    \n
    federated Optional
    \n
    \n

    A FederatedCredentialInit object containing requirements for creating a federated identify provider credential.\n

    \n
    password Optional
    \n
    \n

    A PasswordCredentialInit object containing requirements for creating a password credential.\n

    \n
    publicKey Optional
    \n
    \n

    A PublicKeyCredentialCreationOptions object containing requirements for creating a public key credential. Causes the create() call to request that the user agent creates new credentials via an authenticator — either for registering a new account or for associating a new asymmetric key pair with an existing account.\n

    \n

    Note:\nUsage of create() with the publicKey parameter may be blocked by a publickey-credentials-create Permissions Policy set on your server.\n

    \n
    \n
    " }, @@ -14795,13 +14898,14 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The get() method of the CredentialsContainer interface returns a Promise that fulfills with a single credential, which can then be used to authenticate a user to a website.\n

    The method accepts a single optional options argument, which may include:\n

    \n

    The API always fulfills with a single credential or null. If multiple credentials are available and user mediation is allowed, then the browser will ask the user to select a single credential.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The get() method of the CredentialsContainer interface returns a Promise that fulfills with a single credential, which can then be used to authenticate a user to a website.\n

    The method accepts a single optional options argument, which may include:\n

    \n

    The API always fulfills with a single credential or null. If multiple credentials are available and user mediation is allowed, then the browser will ask the user to select a single credential.", "parameters": { - "options": "An object that contains options for the request. It can contain the following properties:\n

    \n
    mediation Optional
    \n
    \n

    A string indicating whether the user will be required to login for every visit to a client app. The value can be one of the following:\n

    \n
    \"conditional\"
    \n
    \n

    Discovered credentials are presented to the user in a non-modal dialog box along with an indication of the origin requesting credentials. In practice, this means autofilling available credentials; see Sign in with a passkey through form autofill for more details of how this is used; PublicKeyCredential.isConditionalMediationAvailable() also provides some useful information.\n

    \n
    \"optional\"
    \n
    \n

    If credentials can be handed over for a given operation without user mediation, they will be, enabling automatic reauthentication without user mediation. If user mediation is required, then the user agent will ask the user to authenticate. This value is intended for situations where you have reasonable confidence that a user won't be surprised or confused at seeing a login dialog box — for example on a site that doesn't automatically log users in, when a user has just clicked a \"Login/Signup\" button.\n

    \n
    \"required\"
    \n
    \n

    The user will always be asked to authenticate. This value is intended for situations where you want to force user authentication — for example if you want a user to reauthenticate when a sensitive operation is being performed (like confirming a credit card payment), or when switching users.\n

    \n
    \"silent\"
    \n
    \n

    The user will not be asked to authenticate. The user agent will automatically reauthenticate the user and log them in if possible. If consent is required, the promise will fulfill with null. This value is intended for situations where you would want to automatically sign a user in upon visiting a web app if possible, but if not, you don't want to present them with a confusing login dialog box. Instead, you'd want to wait for them to explicitly click a \"Login/Signup\" button.\n

    \n
    \n

    The default value is \"optional\".\n

    \n

    Note:\nIn the case of a federated authentication (FedCM API) request, a mediation value of optional or silent may result in attempted auto-reauthentication. Whether this occurred is communicated to the identity provider (IdP) via the is_auto_selected parameter sent to the IdP's id_assertion_endpoint during validation and the relying party (RP) via the IdentityCredential.isAutoSelected property. This is useful for performance evaluation, security requirements (the IdP may wish to reject automatic reauthentication requests and always require user mediation), and general UX (an IdP or RP may wish to present different UX for auto and non-auto login experiences).\n

    \n
    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance that allows an ongoing get() operation to be aborted. An aborted operation may complete normally (generally if the abort was received after the operation finished) or reject with an AbortError DOMException.\n

    \n
    password Optional
    \n
    \n

    This option asks the browser to retrieve a stored password as a PasswordCredential object. It is a boolean value.\n

    \n
    identity Optional
    \n
    \n

    This option asks the browser to retrieve a federated identity credential as an IdentityCredential object, using the Federated Credential Management API.\n

    This option's value is an IdentityCredentialRequestOptions object containing details of the specific identity providers that the website wants to use.\n

    \n
    federated Optional
    \n
    \n

    This option asks the browser to retrieve a federated identity credential as a FederatedCredential object. This interface is now superseded, and developers should prefer to use the identity option, if it is available.\n

    This option's value is an object with the following properties:\n

    \n
    protocols
    \n
    \n

    An array of strings representing the protocols of the requested credentials' federated identity providers (for example, \"openidconnect\").\n

    \n
    providers
    \n
    \n

    An array of strings representing the credentials' federated identity providers (for example \"https://www.facebook.com\" or \"https://accounts.google.com\").\n

    \n
    \n
    \n
    otp Optional
    \n
    \n

    This option asks the browser to retrieve a one-time password (OTP) as an OTPCredential object.\n

    This option's value is an array of strings which may only contain the string value \"sms\".\n

    \n
    publicKey Optional
    \n
    \n

    This option asks the browser to retrieve an assertion signed using the Web Authentication API as a PublicKeyCredential.\n

    This option's value is a PublicKeyCredentialRequestOptions object.\n

    \n
    " + "options": "An object that contains options for the request. It can contain the following properties:\n
    \n
    mediation Optional
    \n
    \n

    A string indicating whether the user will be required to login for every visit to a client app. The value can be one of the following:\n

    \n
    \"conditional\"
    \n
    \n

    Discovered credentials are presented to the user in a non-modal dialog box along with an indication of the origin requesting credentials. In practice, this means autofilling available credentials; see Sign in with a passkey through form autofill for more details of how this is used; PublicKeyCredential.isConditionalMediationAvailable() also provides some useful information.\n

    \n
    \"optional\"
    \n
    \n

    If credentials can be handed over for a given operation without user mediation, they will be, enabling automatic reauthentication without user mediation. If user mediation is required, then the user agent will ask the user to authenticate. This value is intended for situations where you have reasonable confidence that a user won't be surprised or confused at seeing a login dialog box — for example on a site that doesn't automatically log users in, when a user has just clicked a \"Login/Signup\" button.\n

    \n
    \"required\"
    \n
    \n

    The user will always be asked to authenticate. This value is intended for situations where you want to force user authentication — for example if you want a user to reauthenticate when a sensitive operation is being performed (like confirming a credit card payment), or when switching users.\n

    \n
    \"silent\"
    \n
    \n

    The user will not be asked to authenticate. The user agent will automatically reauthenticate the user and log them in if possible. If consent is required, the promise will fulfill with null. This value is intended for situations where you would want to automatically sign a user in upon visiting a web app if possible, but if not, you don't want to present them with a confusing login dialog box. Instead, you'd want to wait for them to explicitly click a \"Login/Signup\" button.\n

    \n
    \n

    The default value is \"optional\".\n

    \n

    Note:\nIn the case of a federated authentication (FedCM API) request, a mediation value of optional or silent may result in attempted auto-reauthentication. Whether this occurred is communicated to the identity provider (IdP) via the is_auto_selected parameter sent to the IdP's id_assertion_endpoint during validation and the relying party (RP) via the IdentityCredential.isAutoSelected property. This is useful for performance evaluation, security requirements (the IdP may wish to reject automatic reauthentication requests and always require user mediation), and general UX (an IdP or RP may wish to present different UX for auto and non-auto login experiences).\n

    \n
    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance that allows an ongoing get() operation to be aborted. An aborted operation may complete normally (generally if the abort was received after the operation finished) or reject with the signal's reason (which is an AbortError DOMException by default, or a custom value if one was provided when calling abort()).\n

    \n
    password Optional
    \n
    \n

    This option asks the browser to retrieve a stored password as a PasswordCredential object. It is a boolean value.\n

    \n
    identity Optional
    \n
    \n

    This option asks the browser to retrieve a federated identity credential as an IdentityCredential object, using the Federated Credential Management API.\n

    This option's value is an IdentityCredentialRequestOptions object containing details of the specific identity providers that the website wants to use.\n

    \n
    federated Optional
    \n
    \n

    This option asks the browser to retrieve a federated identity credential as a FederatedCredential object. This interface is now superseded, and developers should prefer to use the identity option, if it is available.\n

    This option's value is an object with the following properties:\n

    \n
    protocols
    \n
    \n

    An array of strings representing the protocols of the requested credentials' federated identity providers (for example, \"openidconnect\").\n

    \n
    providers
    \n
    \n

    An array of strings representing the credentials' federated identity providers (for example \"https://www.facebook.com\" or \"https://accounts.google.com\").\n

    \n
    \n
    \n
    otp Optional
    \n
    \n

    This option asks the browser to retrieve a one-time password (OTP) as an OTPCredential object.\n

    This option's value is an array of strings which may only contain the string value \"sms\".\n

    \n
    publicKey Optional
    \n
    \n

    This option asks the browser to retrieve an assertion signed using the Web Authentication API as a PublicKeyCredential.\n

    This option's value is a PublicKeyCredentialRequestOptions object.\n

    \n
    " }, "returns": "A Promise that resolves with one of the following subclasses of Credential:\n\n

    If conditional mediation was specified in the get() call, the browser UI dialog is shown and the promise remains pending until the user picks an account to sign-in with from available autofill suggestions:\n

    \n

    If a single credential cannot be unambiguously obtained, the promise resolves with null.", "throws": { - "AbortError DOMException": "The request was aborted by a call to the abort() method of the AbortController associated with this method's signal option.", + "AbortError DOMException": "The request was aborted by a call to the abort() method of the AbortController associated with this method's signal option.\nNote that if the caller of abort() provided a reason argument, then get() will be rejected with the value of reason, instead of an AbortController exception.", + "TimeoutError DOMException": "The request was automatically aborted due to a timeout set using AbortSignal.timeout().", "IdentityCredentialError": "When requesting an IdentityCredential, the request to the ID assertion endpoint is unable to validate the authentication, and rejects with an error response containing information about the reason.", "NetworkError DOMException": "When requesting an IdentityCredential, the identity provider (IdP) did not respond within 60 seconds, the provided credentials were not valid/found, or the browser's login status for the IdP is set to \"logged-out\" (see Update login status using the Login Status API for more information about FedCM login status). In the latter case, there may be some delay in the rejection to avoid leaking the IdP login status to the RP.", "NotAllowedError DOMException": "Thrown in one of the following situations:\n

    ", @@ -14827,7 +14931,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The preventSilentAccess() method of the CredentialsContainer interface sets a flag that specifies whether automatic log in is allowed for future visits to the current origin, then returns a Promise that resolves to undefined.\nFor example, you might call this, after a user signs out of a website to ensure that they aren't automatically signed in on the next site visit.\nMediation varies by origin, and is an added check point of browser stored credentials, informing a user of an account login status. This method is typically called after a user signs out of a website, ensuring this user's login information is not automatically passed on the next site visit.\n

    When using a PublicKeyCredential, this method generally has no effect; such authenticators typically require user interaction. However, it is possible that certain authenticators may be excluded, which could otherwise have operated silently.\n

    Earlier versions of the spec called this method requireUserMediation().\nThe Browser compatibility section has support details.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The preventSilentAccess() method of the CredentialsContainer interface sets a flag that specifies whether automatic log in is allowed for future visits to the current origin, then returns a Promise that resolves to undefined.\nFor example, you might call this, after a user signs out of a website to ensure that they aren't automatically signed in on the next site visit.\nMediation varies by origin, and is an added check point of browser stored credentials, informing a user of an account login status. This method is typically called after a user signs out of a website, ensuring this user's login information is not automatically passed on the next site visit.\n

    When using a PublicKeyCredential, this method generally has no effect; such authenticators typically require user interaction. However, it is possible that certain authenticators may be excluded, which could otherwise have operated silently.\n

    Earlier versions of the spec called this method requireUserMediation().\nThe Browser compatibility section has support details.", "returns": "A Promise that resolves to undefined." }, "credentialscontainer.store": { @@ -14850,7 +14954,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The store() method of the\nCredentialsContainer stores a set of credentials for the user inside a\nCredential instance, returning this in a Promise.\n

    \n

    Note:\nThis method is restricted to top-level contexts. Calls to it within an\n<iframe> element will resolve without effect.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The store() method of the\nCredentialsContainer stores a set of credentials for the user inside a\nCredential instance, returning this in a Promise.\n

    \n

    Note:\nThis method is restricted to top-level contexts. Calls to it within an\n<iframe> element will resolve without effect.\n

    ", "parameters": { "credentials": "A valid Credential instance." }, @@ -14889,7 +14993,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fromElement() static method of the CropTarget interface returns a CropTarget instance that can be used to crop a captured video track to the area in which a specified element is rendered.\n

    Because the Region Capture API crops to an area of the current browser tab rather than capturing a specific element, any content drawn on top of the cropped area will be shown in the capture.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fromElement() static method of the CropTarget interface returns a CropTarget instance that can be used to crop a captured video track to the area in which a specified element is rendered.\n

    Because the Region Capture API crops to an area of the current browser tab rather than capturing a specific element, any content drawn on top of the cropped area will be shown in the capture.", "parameters": { "element": "A reference to an Element that you want to use as a crop target. For an element to be used as a crop target, it must be:\n

    \n

    In addition, the element will not be captured if the track being restricted has clones (that is, created by BrowserCaptureMediaStreamTrack.clone()) or is captured from a different tab to the current user's tab (passed via Window.postMessage(), for example)." }, @@ -14989,7 +15093,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The randomUUID() method of the Crypto interface is used to generate a v4 UUID using a cryptographically secure random number generator.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The randomUUID() method of the Crypto interface is used to generate a v4 UUID using a cryptographically secure random number generator.", "returns": "A string containing a randomly generated, 36 character long v4 UUID." }, "crypto.subtle": { @@ -15014,7 +15118,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Crypto.subtle read-only property returns a\nSubtleCrypto which can then be used to perform low-level\ncryptographic operations." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Crypto.subtle read-only property returns a\nSubtleCrypto which can then be used to perform low-level\ncryptographic operations." }, "cryptokey": { "url": "$MDN_URL$/web/api/cryptokey", @@ -15038,7 +15142,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The CryptoKey interface of the Web Crypto API represents a cryptographic key obtained from one of the SubtleCrypto methods generateKey(), deriveKey(), importKey(), or unwrapKey().\n

    For security reasons, the CryptoKey interface can only be used in a secure context." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The CryptoKey interface of the Web Crypto API represents a cryptographic key obtained from one of the SubtleCrypto methods generateKey(), deriveKey(), importKey(), or unwrapKey().\n

    For security reasons, the CryptoKey interface can only be used in a secure context." }, "cryptokey.algorithm": { "url": "$MDN_URL$/web/api/cryptokey/algorithm", @@ -15062,7 +15166,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.\n

    The object returned depends of the algorithm used to generate the key." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.\n

    The object returned depends of the algorithm used to generate the key." }, "cryptokey.extractable": { "url": "$MDN_URL$/web/api/cryptokey/extractable", @@ -15086,7 +15190,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The read-only extractable property of the CryptoKey interface indicates whether or not the key may be extracted using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().\n

    If the key cannot be exported, exportKey() or wrapKey() will throw an exception if used to extract it." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The read-only extractable property of the CryptoKey interface indicates whether or not the key may be extracted using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().\n

    If the key cannot be exported, exportKey() or wrapKey() will throw an exception if used to extract it." }, "cryptokey.type": { "url": "$MDN_URL$/web/api/cryptokey/type", @@ -15110,7 +15214,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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:\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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:\n

    " }, "cryptokey.usages": { "url": "$MDN_URL$/web/api/cryptokey/usages", @@ -15134,7 +15238,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The read-only usages property of the CryptoKey interface indicates what can be done with the key." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The read-only usages property of the CryptoKey interface indicates what can be done with the key." }, "cryptokeypair": { "url": "$MDN_URL$/web/api/cryptokeypair", @@ -15153,7 +15257,7 @@ "Safari": "18.4", "SafariIOS": "18.4" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CSPViolationReportBody interface is an extension of the Reporting API that represents the body of a Content Security Policy (CSP) violation report.\n

    CSP violations are thrown when the webpage attempts to load a resource that violates the policy set by the Content-Security-Policy HTTP header.\n

    CSP violation reports are returned in the reports parameter of ReportingObserver callbacks that have a type of \"csp-violation\".\nThe body property of those reports is an instance of CSPViolationReportBody.\n

    CSP violation reports may also be sent as JSON objects to the endpoint specified in the report-to policy directive of the Content-Security-Policy header.\nThese reports similarly have a type of \"csp-violation\", and a body property containing a serialization of an instance of this interface.\n

    \n

    Note:\nCSP violation reports sent by the Reporting API, when an endpoint is specified using the CSP report-to directive, are similar (but not identical) to the \"CSP report\" JSON objects sent when endpoints are specified using the report-uri directive.\nThe Reporting API and report-to directive are intended to replace the older report format and the report-uri directive.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The CSPViolationReportBody interface is an extension of the Reporting API that represents the body of a Content Security Policy (CSP) violation report.\n

    CSP violations are thrown when the webpage attempts to load a resource that violates the policy set by the Content-Security-Policy HTTP header.\n

    CSP violation reports are returned in the reports parameter of ReportingObserver callbacks that have a type of \"csp-violation\".\nThe body property of those reports is an instance of CSPViolationReportBody.\n

    CSP violation reports may also be sent as JSON objects to the endpoint specified in the report-to policy directive of the Content-Security-Policy header.\nThese reports similarly have a type of \"csp-violation\", and a body property containing a serialization of an instance of this interface.\n

    \n

    Note:\nCSP violation reports sent by the Reporting API, when an endpoint is specified using the CSP report-to directive, are similar (but not identical) to the \"CSP report\" JSON objects sent when endpoints are specified using the report-uri directive.\nThe Reporting API and report-to directive are intended to replace the older report format and the report-uri directive.\n

    " }, "cspviolationreportbody.blockedurl": { "url": "$MDN_URL$/web/api/cspviolationreportbody/blockedurl", @@ -15447,7 +15551,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static, read-only paintWorklet property of the CSS interface provides access to the\npaint worklet, which programmatically generates an image where a CSS\nproperty expects a file." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static, read-only paintWorklet property of the CSS interface provides access to the\npaint worklet, which programmatically generates an image where a CSS\nproperty expects a file." }, "css.registerproperty": { "url": "$MDN_URL$/web/api/css/registerproperty_static", @@ -15468,7 +15572,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The CSS.registerProperty() static method registers\ncustom properties, allowing for property type checking, default\nvalues, and properties that do or do not inherit their value.\n

    Registering a custom property allows you to tell the browser how the custom property\nshould behave; what types are allowed, whether the custom property inherits its value,\nand what the default value of the custom property is.", + "doc": "The CSS.registerProperty() static method registers\ncustom properties, allowing for property type checking, default\nvalues, and properties that do or do not inherit their value.\n

    Registering a custom property allows you to tell the browser how the custom property\nshould behave; what types are allowed, whether the custom property inherits its value,\nand what the default value of the custom property is.", "parameters": { "propertyDefinition": "An object containing the following properties:\n

    \n
    name
    \n
    \n

    A string representing the\nname of the property being defined.\n

    \n
    syntax Optional
    \n
    \n

    A string representing\nthe expected syntax of the defined property. Defaults to \"*\".\n

    \n
    inherits
    \n
    \n

    A boolean value defining whether the defined property should be inherited\n(true), or not (false). Defaults to false.\n

    \n
    initialValue Optional
    \n
    \n

    A string representing\nthe initial value of the defined property.\n

    \n
    " }, @@ -15549,7 +15653,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The animationName property of the\nCSSAnimation interface returns the animation-name. This\nspecifies one or more keyframe at-rules which describe the animation applied to the\nelement." + "doc": "The animationName property of the\nCSSAnimation interface returns the animation-name. This\nspecifies one or more keyframe at-rules which describe the animation applied to the\nelement." }, "cssconditionrule": { "url": "$MDN_URL$/web/api/cssconditionrule", @@ -15571,7 +15675,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "An object implementing the CSSConditionRule interface represents a single condition CSS at-rule, which consists of a condition and a statement block.\n

    Three objects derive from CSSConditionRule: CSSMediaRule, CSSContainerRule and CSSSupportsRule." + "doc": "An object implementing the CSSConditionRule interface represents a single condition CSS at-rule, which consists of a condition and a statement block.\n

    Three objects derive from CSSConditionRule: CSSMediaRule, CSSContainerRule and CSSSupportsRule." }, "cssconditionrule.conditiontext": { "url": "$MDN_URL$/web/api/cssconditionrule/conditiontext", @@ -15615,7 +15719,7 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The CSSContainerRule interface represents a single CSS @container rule.\n

    An object of this type can be used to get the query conditions for the @container, along with the container name if one is defined.\nNote that the container name and query together define the \"condition text\", which can be obtained using CSSConditionRule.conditionText." + "doc": "The CSSContainerRule interface represents a single CSS @container rule.\n

    An object of this type can be used to get the query conditions for the @container, along with the container name if one is defined.\nNote that the container name and query together define the \"condition text\", which can be obtained using CSSConditionRule.conditionText." }, "csscontainerrule.containername": { "url": "$MDN_URL$/web/api/csscontainerrule/containername", @@ -15636,7 +15740,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The read-only containerName property of the CSSContainerRule interface represents the container name of the associated CSS @container at-rule.\n

    For example, the value of containerName for the @container below is sidebar:\n

    \n```css\n@container sidebar (width >= 700px) {\n  .card {\n    font-size: 2em;\n  }\n}\n```\n
    " + "doc": "The read-only containerName property of the CSSContainerRule interface represents the container name of the associated CSS @container at-rule.\n

    For example, the value of containerName for the @container below is sidebar:\n

    \n```css\n@container sidebar (width >= 700px) {\n  .card {\n    font-size: 2em;\n  }\n}\n```\n
    " }, "csscontainerrule.containerquery": { "url": "$MDN_URL$/web/api/csscontainerrule/containerquery", @@ -15657,7 +15761,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The read-only containerQuery property of the CSSContainerRule interface returns a string representing the container conditions that are evaluated when the container changes size in order to determine if the styles in the associated @container are applied.\n

    For example, the value of containerQuery for the @container below is (width >= 700px):\n

    \n```css\n@container sidebar (width >= 700px) {\n  .card {\n    font-size: 2em;\n  }\n}\n```\n
    " + "doc": "The read-only containerQuery property of the CSSContainerRule interface returns a string representing the container conditions that are evaluated when the container changes size in order to determine if the styles in the associated @container are applied.\n

    For example, the value of containerQuery for the @container below is (width >= 700px):\n

    \n```css\n@container sidebar (width >= 700px) {\n  .card {\n    font-size: 2em;\n  }\n}\n```\n
    " }, "csscounterstylerule": { "url": "$MDN_URL$/web/api/csscounterstylerule", @@ -15678,7 +15782,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The CSSCounterStyleRule interface represents an @counter-style at-rule." + "doc": "The CSSCounterStyleRule interface represents an @counter-style at-rule." }, "csscounterstylerule.additivesymbols": { "url": "$MDN_URL$/web/api/csscounterstylerule/additivesymbols", @@ -15699,7 +15803,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The additiveSymbols property of the CSSCounterStyleRule interface gets and sets the value of the additive-symbols descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The additiveSymbols property of the CSSCounterStyleRule interface gets and sets the value of the additive-symbols descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.fallback": { "url": "$MDN_URL$/web/api/csscounterstylerule/fallback", @@ -15720,7 +15824,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The fallback property of the CSSCounterStyleRule interface gets and sets the value of the fallback descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The fallback property of the CSSCounterStyleRule interface gets and sets the value of the fallback descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.name": { "url": "$MDN_URL$/web/api/csscounterstylerule/name", @@ -15741,7 +15845,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The name property of the CSSCounterStyleRule interface gets and sets the <custom-ident> defined as the name for the associated rule." + "doc": "The name property of the CSSCounterStyleRule interface gets and sets the <custom-ident> defined as the name for the associated rule." }, "csscounterstylerule.negative": { "url": "$MDN_URL$/web/api/csscounterstylerule/negative", @@ -15762,7 +15866,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The negative property of the CSSCounterStyleRule interface gets and sets the value of the negative descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The negative property of the CSSCounterStyleRule interface gets and sets the value of the negative descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.pad": { "url": "$MDN_URL$/web/api/csscounterstylerule/pad", @@ -15783,7 +15887,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The pad property of the CSSCounterStyleRule interface gets and sets the value of the pad descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The pad property of the CSSCounterStyleRule interface gets and sets the value of the pad descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.prefix": { "url": "$MDN_URL$/web/api/csscounterstylerule/prefix", @@ -15804,7 +15908,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The prefix property of the CSSCounterStyleRule interface gets and sets the value of the prefix descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The prefix property of the CSSCounterStyleRule interface gets and sets the value of the prefix descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.range": { "url": "$MDN_URL$/web/api/csscounterstylerule/range", @@ -15825,7 +15929,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The range property of the CSSCounterStyleRule interface gets and sets the value of the range descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The range property of the CSSCounterStyleRule interface gets and sets the value of the range descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.speakas": { "url": "$MDN_URL$/web/api/csscounterstylerule/speakas", @@ -15846,7 +15950,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The speakAs property of the CSSCounterStyleRule interface gets and sets the value of the speak-as descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The speakAs property of the CSSCounterStyleRule interface gets and sets the value of the speak-as descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.suffix": { "url": "$MDN_URL$/web/api/csscounterstylerule/suffix", @@ -15867,7 +15971,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The suffix property of the CSSCounterStyleRule interface gets and sets the value of the suffix descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The suffix property of the CSSCounterStyleRule interface gets and sets the value of the suffix descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.symbols": { "url": "$MDN_URL$/web/api/csscounterstylerule/symbols", @@ -15888,7 +15992,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The symbols property of the CSSCounterStyleRule interface gets and sets the value of the symbols descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The symbols property of the CSSCounterStyleRule interface gets and sets the value of the symbols descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "csscounterstylerule.system": { "url": "$MDN_URL$/web/api/csscounterstylerule/system", @@ -15909,7 +16013,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "The system property of the CSSCounterStyleRule interface gets and sets the value of the system descriptor. If the descriptor does not have a value set, this attribute returns an empty string." + "doc": "The system property of the CSSCounterStyleRule interface gets and sets the value of the system descriptor. If the descriptor does not have a value set, this attribute returns an empty string." }, "cssfontfacerule": { "url": "$MDN_URL$/web/api/cssfontfacerule", @@ -15931,7 +16035,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSFontFaceRule interface represents an @font-face at-rule." + "doc": "The CSSFontFaceRule interface represents an @font-face at-rule." }, "cssfontfacerule.style": { "url": "$MDN_URL$/web/api/cssfontfacerule/style", @@ -15953,7 +16057,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only style property of the CSSFontFaceRule interface returns the style information from the @font-face at-rule. This will be in the form of a CSSStyleDeclaration object." + "doc": "The read-only style property of the CSSFontFaceRule interface contains a CSSStyleDeclaration object representing the descriptors available in the @font-face rule's body." }, "cssfontfeaturevaluesrule": { "url": "$MDN_URL$/web/api/cssfontfeaturevaluesrule", @@ -15974,7 +16078,7 @@ "level": "LOW", "lowDate": "2025-03-06" }, - "doc": "The CSSFontFeatureValuesRule interface represents an @font-feature-values at-rule, letting developers assign for each font face a common name to specify features indices to be used in font-variant-alternates." + "doc": "The CSSFontFeatureValuesRule interface represents an @font-feature-values at-rule, letting developers assign for each font face a common name to specify features indices to be used in font-variant-alternates." }, "cssfontfeaturevaluesrule.fontfamily": { "url": "$MDN_URL$/web/api/cssfontfeaturevaluesrule/fontfamily", @@ -16017,7 +16121,7 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The CSSFontPaletteValuesRule interface represents an @font-palette-values at-rule." + "doc": "The CSSFontPaletteValuesRule interface represents an @font-palette-values at-rule." }, "cssfontpalettevaluesrule.basepalette": { "url": "$MDN_URL$/web/api/cssfontpalettevaluesrule/basepalette", @@ -16083,7 +16187,7 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The read-only name property of the CSSFontPaletteValuesRule interface represents the name identifying the associated @font-palette-values at-rule. A valid name always starts with two dashes, such as --Alternate." + "doc": "The read-only name property of the CSSFontPaletteValuesRule interface represents the name identifying the associated @font-palette-values at-rule. A valid name always starts with two dashes, such as --Alternate." }, "cssfontpalettevaluesrule.overridecolors": { "url": "$MDN_URL$/web/api/cssfontpalettevaluesrule/overridecolors", @@ -16105,7 +16209,7 @@ "lowDate": "2022-11-15", "highDate": "2025-05-15" }, - "doc": "The read-only overrideColors property of the CSSFontPaletteValuesRule interface is a string containing a list of color index and color pair that are to be used instead. It is specified in the same format as the corresponding override-colors descriptor." + "doc": "The read-only overrideColors property of the CSSFontPaletteValuesRule interface is a string containing a list of color index and color pair that are to be used instead. It is specified in the same format as the corresponding override-colors descriptor." }, "cssfunctiondeclarations": { "url": "$MDN_URL$/web/api/cssfunctiondeclarations", @@ -16122,7 +16226,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSFunctionDeclarations interface of the CSS Object Model represents a consecutive run of CSS declarations included within a @function body.\n

    This can include CSS custom properties, and the value of the results descriptor inside the @function body, but it doesn't include blocks such as @media at-rules that may be included. Such a block, included in the middle of a set of declarations, would cause the body contents to be broken up into separate CSSFunctionDeclarations objects, as seen in our Multiple CSSFunctionDeclarations demo." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSFunctionDeclarations interface of the CSS Object Model represents a consecutive run of CSS declarations included within a @function body.\n

    This can include CSS custom properties, and the value of the results descriptor inside the @function body, but it doesn't include blocks such as @media at-rules that may be included. Such a block, included in the middle of a set of declarations, would cause the body contents to be broken up into separate CSSFunctionDeclarations objects, as seen in our Multiple CSSFunctionDeclarations demo." }, "cssfunctiondeclarations.style": { "url": "$MDN_URL$/web/api/cssfunctiondeclarations/style", @@ -16139,7 +16243,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The style property of the CSSFunctionDeclarations interface returns a CSSFunctionDescriptors object representing the descriptors available in a @function body." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only style property of the CSSFunctionDeclarations interface contains a CSSFunctionDescriptors object representing the descriptors available in the @function rule's body." }, "cssfunctiondescriptors": { "url": "$MDN_URL$/web/api/cssfunctiondescriptors", @@ -16190,7 +16294,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSFunctionRule interface of the CSS Object Model represents CSS @function (custom function) at-rules." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSFunctionRule interface of the CSS Object Model represents CSS @function (custom function) at-rules." }, "cssfunctionrule.getparameters": { "url": "$MDN_URL$/web/api/cssfunctionrule/getparameters", @@ -16208,7 +16312,7 @@ "level": "NONE" }, "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getParameters() method of the CSSFunctionRule interface returns an array of objects representing the custom function's parameters.", - "returns": "An array of objects containing the following properties:\n

    \n
    name
    \n
    \n

    A string representing the name of the function parameter.\n

    \n
    type
    \n
    \n

    A string representing the data type of the parameter, or * if no data type was specified.\n

    \n
    defaultValue
    \n
    \n

    A string representing the default value of the parameter, or null if no default value was specified.\n

    \n
    \n

    If no parameters were specified in the associated @function at-rule, an empty array is returned." + "returns": "An array of objects containing the following properties:\n

    \n
    name
    \n
    \n

    A string representing the name of the function parameter.\n

    \n
    type
    \n
    \n

    A string representing the data type of the parameter, or * if no data type was specified.\n

    \n
    defaultValue
    \n
    \n

    A string representing the default value of the parameter, or null if no default value was specified.\n

    \n
    \n

    If no parameters were specified in the associated @function at-rule, an empty array is returned." }, "cssfunctionrule.name": { "url": "$MDN_URL$/web/api/cssfunctionrule/name", @@ -16264,7 +16368,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The CSSGroupingRule interface of the CSS Object Model represents any CSS at-rule that contains other rules nested within it." + "doc": "The CSSGroupingRule interface of the CSS Object Model represents any CSS at-rule that contains other rules nested within it." }, "cssgroupingrule.cssrules": { "url": "$MDN_URL$/web/api/cssgroupingrule/cssrules", @@ -16346,7 +16450,7 @@ "returns": "The index of the new rule.", "throws": { "IndexSizeError DOMException": "Thrown if index is greater than the number of child CSS rules.", - "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint.

    Thrown if the rule is a valid statement but not a nested statement." + "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint.

    Thrown if the rule is a valid statement but not a nested statement." } }, "cssimagevalue": { @@ -16365,7 +16469,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSImageValue interface of the CSS Typed Object Model API represents values for properties that take an image, for example background-image, list-style-image, or border-image-source.\n

    The CSSImageValue object represents an <image> that involves a URL, such as url() or image(), but not linear-gradient() or element()." + "doc": "The CSSImageValue interface of the CSS Typed Object Model API represents values for properties that take an image, for example background-image, list-style-image, or border-image-source.\n

    The CSSImageValue object represents an <image> that involves a URL, such as url() or <image()>, but not linear-gradient() or element()." }, "cssimportrule": { "url": "$MDN_URL$/web/api/cssimportrule", @@ -16387,7 +16491,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSImportRule interface represents an @import at-rule." + "doc": "The CSSImportRule interface represents an @import at-rule." }, "cssimportrule.href": { "url": "$MDN_URL$/web/api/cssimportrule/href", @@ -16409,7 +16513,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only href property of the\nCSSImportRule interface returns the URL specified by the\n@import at-rule.\n

    The resolved URL will be the href attribute of the\nassociated stylesheet." + "doc": "The read-only href property of the\nCSSImportRule interface returns the URL specified by the\n@import at-rule.\n

    The resolved URL will be the href attribute of the\nassociated stylesheet." }, "cssimportrule.layername": { "url": "$MDN_URL$/web/api/cssimportrule/layername", @@ -16431,7 +16535,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The read-only layerName property of the CSSImportRule interface returns the name of the cascade layer created by the @import at-rule.\n

    If the created layer is anonymous, the string is empty (\"\"), if no layer has been\ncreated, it is the null object." + "doc": "The read-only layerName property of the CSSImportRule interface returns the name of the cascade layer created by the @import at-rule.\n

    If the created layer is anonymous, the string is empty (\"\"), if no layer has been\ncreated, it is the null object." }, "cssimportrule.media": { "url": "$MDN_URL$/web/api/cssimportrule/media", @@ -16453,7 +16557,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only media property of the\nCSSImportRule interface returns a MediaList object,\ncontaining the value of the media attribute of the associated stylesheet." + "doc": "The read-only media property of the CSSImportRule interface returns a MediaList object representing the media query list of the @import rule." }, "cssimportrule.stylesheet": { "url": "$MDN_URL$/web/api/cssimportrule/stylesheet", @@ -16475,7 +16579,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only styleSheet property of the\nCSSImportRule interface returns the CSS Stylesheet specified by the\n@import at-rule. This will be\nin the form of a CSSStyleSheet object.\n

    An @import at-rule always has\nan associated stylesheet." + "doc": "The read-only styleSheet property of the\nCSSImportRule interface returns the CSS Stylesheet specified by the\n@import at-rule. This will be\nin the form of a CSSStyleSheet object.\n

    An @import at-rule always has\nan associated stylesheet." }, "cssimportrule.supportstext": { "url": "$MDN_URL$/web/api/cssimportrule/supportstext", @@ -16496,7 +16600,7 @@ "level": "LOW", "lowDate": "2024-05-13" }, - "doc": "The read-only supportsText property of the CSSImportRule interface returns the supports condition specified by the @import at-rule." + "doc": "The read-only supportsText property of the CSSImportRule interface returns the supports condition specified by the @import at-rule." }, "csskeyframerule": { "url": "$MDN_URL$/web/api/csskeyframerule", @@ -16518,7 +16622,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The CSSKeyframeRule interface describes an object representing a set of styles for a given keyframe. It corresponds to the contents of a single keyframe of a @keyframes at-rule." + "doc": "The CSSKeyframeRule interface describes an object representing a set of styles for a given keyframe. It corresponds to the contents of a single keyframe of a @keyframes at-rule." }, "csskeyframerule.keytext": { "url": "$MDN_URL$/web/api/csskeyframerule/keytext", @@ -16540,7 +16644,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The keyText property of the CSSKeyframeRule interface represents the keyframe selector as a comma-separated list of percentage values. The from and to keywords map to 0% and 100%, respectively.", + "doc": "The keyText property of the CSSKeyframeRule interface represents the keyframe selector as a comma-separated list of percentage values. The from and to keywords map to 0% and 100%, respectively.", "throws": { "SyntaxError": "Thrown if keyText is updated with an invalid keyframe selector, in which case keyText remains untouched." } @@ -16565,7 +16669,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The read-only CSSKeyframeRule.style property is the CSSStyleDeclaration interface for the declaration block of the CSSKeyframeRule." + "doc": "The read-only style property of the CSSKeyframeRule interface contains a CSSStyleDeclaration object representing the descriptors available in the @keyframes rule's body." }, "csskeyframesrule": { "url": "$MDN_URL$/web/api/csskeyframesrule", @@ -16587,7 +16691,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The CSSKeyframesRule interface describes an object representing a complete set of keyframes for a CSS animation. It corresponds to the contents of a whole @keyframes at-rule." + "doc": "The CSSKeyframesRule interface describes an object representing a complete set of keyframes for a CSS animation. It corresponds to the contents of a whole @keyframes at-rule." }, "csskeyframesrule.appendrule": { "url": "$MDN_URL$/web/api/csskeyframesrule/appendrule", @@ -16635,7 +16739,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The read-only cssRules property of the CSSKeyframeRule interface returns a CSSRuleList containing the rules in the keyframes at-rule.\n

    \n

    Note:\nThe CSSKeyframeRule itself is indexable like an array, and functions similarly to its cssRules property.\n

    " + "doc": "The read-only cssRules property of the CSSKeyframeRule interface returns a CSSRuleList containing the rules in the keyframes at-rule.\n
    \n

    Note:\nThe CSSKeyframeRule itself is indexable like an array, and functions similarly to its cssRules property.\n

    " }, "csskeyframesrule.deleterule": { "url": "$MDN_URL$/web/api/csskeyframesrule/deleterule", @@ -16659,7 +16763,7 @@ }, "doc": "The deleteRule() method of the CSSKeyframeRule interface deletes the CSSKeyFrameRule that matches the specified keyframe selector.", "parameters": { - "select": "A string which contains the keyframe selector of the rule to be deleted, which must be:\n\n

    Note that the number and order of the values in the specified keyframe selector must match those of the targeted keyframe rule(s). White-space is disregarded." + "select": "A string which contains the keyframe selector of the rule to be deleted, which must be:\n

    \n

    Note that the number and order of the values in the specified keyframe selector must match those of the targeted keyframe rule(s). White-space is disregarded." }, "returns": "None (undefined)." }, @@ -16685,7 +16789,7 @@ }, "doc": "The findRule() method of the CSSKeyframeRule interface finds the CSSKeyFrameRule that matches the specified keyframe selector.", "parameters": { - "select": "A string which contains the keyframe selector of the rule to be found, which must be:\n

    \n

    Note that the number and order of the values in the specified keyframe selector must match those of the targeted keyframe rule(s). White-space is disregarded." + "select": "A string which contains the keyframe selector of the rule to be found, which must be:\n

    \n

    Note that the number and order of the values in the specified keyframe selector must match those of the targeted keyframe rule(s). White-space is disregarded." }, "returns": "A CSSKeyframeRule which is the last matching rule. If no rules are found, nothing is returned." }, @@ -16708,7 +16812,7 @@ "level": "LOW", "lowDate": "2024-03-22" }, - "doc": "The read-only length property of the CSSKeyframeRule interface returns the number of CSSKeyframeRule objects in its list. You can then access each keyframe rule by its index directly on the CSSKeyframeRule object." + "doc": "The read-only length property of the CSSKeyframesRule interface returns the number of CSSKeyframeRule objects in its list. You can then access each keyframe rule by its index directly on the CSSKeyframeRule object." }, "csskeyframesrule.name": { "url": "$MDN_URL$/web/api/csskeyframesrule/name", @@ -16730,7 +16834,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The name property of the CSSKeyframeRule interface gets and sets the name of the animation as used by the animation-name property." + "doc": "The name property of the CSSKeyframeRule interface gets and sets the name of the animation as used by the animation-name property." }, "csskeywordvalue": { "url": "$MDN_URL$/web/api/csskeywordvalue", @@ -16815,7 +16919,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The CSSLayerBlockRule represents a @layer block rule." + "doc": "The CSSLayerBlockRule represents a @layer block rule." }, "csslayerblockrule.name": { "url": "$MDN_URL$/web/api/csslayerblockrule/name", @@ -16859,7 +16963,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The CSSLayerStatementRule represents a @layer statement rule. Unlike CSSLayerBlockRule, it doesn't contain other rules and merely defines one or several layers by providing their names.\n

    This rule allows to explicitly declare the ordering layer that is in an apparent way at the beginning of a CSS file: the layer order is defined by the order of first occurrence of each layer name. Declaring them with a statement allows the reader to understand the layer order. It also allows inline and imported layers to be interleaved, which is not possible when using the CSSLayerBlockRule syntax." + "doc": "The CSSLayerStatementRule represents a @layer statement rule. Unlike CSSLayerBlockRule, it doesn't contain other rules and merely defines one or several layers by providing their names.\n

    This rule allows to explicitly declare the ordering layer that is in an apparent way at the beginning of a CSS file: the layer order is defined by the order of first occurrence of each layer name. Declaring them with a statement allows the reader to understand the layer order. It also allows inline and imported layers to be interleaved, which is not possible when using the CSSLayerBlockRule syntax." }, "csslayerstatementrule.namelist": { "url": "$MDN_URL$/web/api/csslayerstatementrule/namelist", @@ -16899,7 +17003,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMathInvert interface of the CSS Typed Object Model API represents a CSS calc() used as calc(1 / <value>). It inherits properties and methods from its parent CSSNumericValue." + "doc": "The CSSMathInvert interface of the CSS Typed Object Model API represents a CSS calc() used as calc(1 / <value>). It inherits properties and methods from its parent CSSNumericValue." }, "cssmathinvert.cssmathinvert": { "url": "$MDN_URL$/web/api/cssmathinvert/cssmathinvert", @@ -16917,7 +17021,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMathInvert() constructor creates a\nnew CSSMathInvert object which represents a CSS\ncalc() used as calc(1 / value)", + "doc": "The CSSMathInvert() constructor creates a\nnew CSSMathInvert object which represents a CSS\ncalc() used as calc(1 / value)", "parameters": { "arg": "A CSSNumericValue." }, @@ -16959,7 +17063,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMathMax interface of the CSS Typed Object Model API represents the CSS max() function. It inherits properties and methods from its parent CSSNumericValue." + "doc": "The CSSMathMax interface of the CSS Typed Object Model API represents the CSS max() function. It inherits properties and methods from its parent CSSNumericValue." }, "cssmathmax.cssmathmax": { "url": "$MDN_URL$/web/api/cssmathmax/cssmathmax", @@ -16976,7 +17080,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSMathMax() constructor creates a\nnew CSSMathMax object which represents the CSS max() function.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSMathMax() constructor creates a\nnew CSSMathMax object which represents the CSS max() function.", "parameters": { "args": "A list of values for the CSSMathProduct object to be either a double\ninteger or a CSSNumericValue." }, @@ -17018,7 +17122,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMathMin interface of the CSS Typed Object Model API represents the CSS min() function. It inherits properties and methods from its parent CSSNumericValue." + "doc": "The CSSMathMin interface of the CSS Typed Object Model API represents the CSS min() function. It inherits properties and methods from its parent CSSNumericValue." }, "cssmathmin.cssmathmin": { "url": "$MDN_URL$/web/api/cssmathmin/cssmathmin", @@ -17035,7 +17139,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSMathMin() constructor creates a\nnew CSSMathMin object which represents the CSS\nmin() function.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The CSSMathMin() constructor creates a\nnew CSSMathMin object which represents the CSS\nmin() function.", "parameters": { "args": "A list of values for the CSSMathProduct object to be either a double\ninteger or a CSSNumericValue." }, @@ -17190,7 +17294,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMathSum interface of the CSS Typed Object Model API represents the result obtained by calling add(), sub(), or toSum() on CSSNumericValue.\n

    A CSSMathSum is the object type returned when the StylePropertyMapReadOnly.get() method is used on a CSS property whose value is created with a calc() function." + "doc": "The CSSMathSum interface of the CSS Typed Object Model API represents the result obtained by calling add(), sub(), or toSum() on CSSNumericValue.\n

    A CSSMathSum is the object type returned when the StylePropertyMapReadOnly.get() method is used on a CSS property whose value is created with a calc() function." }, "cssmathsum.cssmathsum": { "url": "$MDN_URL$/web/api/cssmathsum/cssmathsum", @@ -17282,7 +17386,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMatrixComponent interface of the CSS Typed Object Model API represents the matrix() and matrix3d() values of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "The CSSMatrixComponent interface of the CSS Typed Object Model API represents the matrix() and matrix3d() values of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssmatrixcomponent.cssmatrixcomponent": { "url": "$MDN_URL$/web/api/cssmatrixcomponent/cssmatrixcomponent", @@ -17300,7 +17404,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSMatrixComponent() constructor\ncreates a new CSSMatrixComponent object representing the matrix() and matrix3d() values of the\nindividual transform property in CSS.", + "doc": "The CSSMatrixComponent() constructor\ncreates a new CSSMatrixComponent object representing the matrix() and matrix3d() values of the\nindividual transform property in CSS.", "parameters": { "matrix": "A 2d or 3d matrix." } @@ -17321,7 +17425,7 @@ "baseline": { "level": "NONE" }, - "doc": "The matrix property of the\nCSSMatrixComponent interface gets and sets a 2d or 3d matrix.\n

    See the matrix() and matrix3d() pages for\nexamples." + "doc": "The matrix property of the\nCSSMatrixComponent interface gets and sets a 2d or 3d matrix.\n

    See the matrix() and matrix3d() pages for\nexamples." }, "cssmediarule": { "url": "$MDN_URL$/web/api/cssmediarule", @@ -17343,7 +17447,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSMediaRule interface represents a single CSS @media rule." + "doc": "The CSSMediaRule interface represents a single CSS @media rule." }, "cssmediarule.media": { "url": "$MDN_URL$/web/api/cssmediarule/media", @@ -17365,7 +17469,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only media property of the\nCSSMediaRule interface returns a MediaList representing the intended\ndestination medium for style information." + "doc": "The read-only media property of the CSSMediaRule interface contains a MediaList object representing the media query list of the @media rule." }, "cssnamespacerule": { "url": "$MDN_URL$/web/api/cssnamespacerule", @@ -17387,7 +17491,7 @@ "lowDate": "2017-04-19", "highDate": "2019-10-19" }, - "doc": "The CSSNamespaceRule interface describes an object representing a single CSS @namespace at-rule." + "doc": "The CSSNamespaceRule interface describes an object representing a single CSS @namespace at-rule." }, "cssnamespacerule.namespaceuri": { "url": "$MDN_URL$/web/api/cssnamespacerule/namespaceuri", @@ -17810,7 +17914,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSPageDescriptors interface represents a CSS declaration block for an @page at-rule.\n

    The interface exposes style information and various style-related methods and properties for the page.\nEach multi-word property has versions in camel- and snake-case.\nThis means, for example, that you can access the margin-top CSS property using the syntax style[\"margin-top\"] or style.marginTop (where style is a CSSPageDescriptor).\n

    A CSSPageDescriptors object is accessed through the style property of the CSSPageRule interface, which can in turn be found using the CSSStyleSheet API." + "doc": "The CSSPageDescriptors interface represents a CSS declaration block for an @page at-rule.\n

    The interface exposes style information and various style-related methods and properties for the page.\nEach multi-word property has versions in camel- and snake-case.\nThis means, for example, that you can access the margin-top CSS property using the syntax style[\"margin-top\"] or style.marginTop (where style is a CSSPageDescriptor).\n

    A CSSPageDescriptors object is accessed through the style property of the CSSPageRule interface, which can in turn be found using the CSSStyleSheet API." }, "csspagerule": { "url": "$MDN_URL$/web/api/csspagerule", @@ -17832,7 +17936,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "CSSPageRule represents a single CSS @page rule." + "doc": "CSSPageRule represents a single CSS @page rule." }, "csspagerule.selectortext": { "url": "$MDN_URL$/web/api/csspagerule/selectortext", @@ -17876,7 +17980,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The style read-only property of the CSSPageRule interface returns a CSSPageDescriptors object.\nThis represents a CSS declaration block for a CSS @page at-rule, and exposes style information and various style-related methods and properties for the page." + "doc": "The read-only style property of the CSSPageRule interface contains a CSSPageDescriptors object representing the descriptors available in the @page rule's body." }, "cssperspective": { "url": "$MDN_URL$/web/api/cssperspective", @@ -17894,7 +17998,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSPerspective interface of the CSS Typed Object Model API represents the perspective() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "The CSSPerspective interface of the CSS Typed Object Model API represents the perspective() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssperspective.cssperspective": { "url": "$MDN_URL$/web/api/cssperspective/cssperspective", @@ -17912,12 +18016,12 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSPerspective() constructor creates\na new CSSPerspective object representing the perspective() value of\nthe individual transform property in CSS.", + "doc": "The CSSPerspective() constructor creates\na new CSSPerspective object representing the perspective() value of\nthe individual transform property in CSS.", "parameters": { - "length": "A value for the distance from z=0 of the CSSPerspective object to be\nconstructed. This must be a <length>." + "length": "A value for the distance from z=0 of the CSSPerspective object to be\nconstructed. This must be a <length>." }, "throws": { - "TypeError": "Raised if the value of CSSPerspective.length exists but is not a\n<length>." + "TypeError": "Raised if the value of CSSPerspective.length exists but is not a\n<length>." } }, "cssperspective.length": { @@ -17947,14 +18051,17 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The CSSPositionTryDescriptors interface defines properties that represent the list of CSS descriptors that can be set in the body of a @position-try at-rule.\n

    Each descriptor in the body of the corresponding @position-try at-rule can be accessed using either its property name in bracket notation or the camel-case version of the property name \"propertyName\" in dot notation.\nFor example, you can access the CSS property \"property-name\" as style[\"property-name\"] or style.propertyName, where style is a CSSPositionTryDescriptors instance.\nA property with a single-word name like height can be accessed using either notation: style[\"height\"] or style.height.\n

    \n

    Note:\nThe CSSPositionTryRule interface represents a @position-try at-rule, and the CSSPositionTryRule.style property is an instance of this object.\n

    " + "doc": "The CSSPositionTryDescriptors interface defines properties that represent the list of CSS descriptors that can be set in the body of a @position-try at-rule.\n

    Each descriptor in the body of the corresponding @position-try at-rule can be accessed using either its property name in bracket notation or the camel-case version of the property name \"propertyName\" in dot notation.\nFor example, you can access the CSS property \"property-name\" as style[\"property-name\"] or style.propertyName, where style is a CSSPositionTryDescriptors instance.\nA property with a single-word name like height can be accessed using either notation: style[\"height\"] or style.height.\n

    \n

    Note:\nThe CSSPositionTryRule interface represents a @position-try at-rule, and the CSSPositionTryRule.style property is an instance of this object.\n

    " }, "csspositiontryrule": { "url": "$MDN_URL$/web/api/csspositiontryrule", @@ -17965,14 +18072,17 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The CSSPositionTryRule interface describes an object representing a @position-try at-rule." + "doc": "The CSSPositionTryRule interface describes an object representing a @position-try at-rule." }, "csspositiontryrule.name": { "url": "$MDN_URL$/web/api/csspositiontryrule/name", @@ -17983,14 +18093,17 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The name read-only property of the CSSPositionTryRule interface represents the name of the position try fallback option specified by the @position-try at-rule's <dashed-ident>." + "doc": "The name read-only property of the CSSPositionTryRule interface represents the name of the position try fallback option specified by the @position-try at-rule's <dashed-ident>." }, "csspositiontryrule.style": { "url": "$MDN_URL$/web/api/csspositiontryrule/style", @@ -18001,14 +18114,17 @@ "Chrome": "125", "ChromeAndroid": "125", "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", "Opera": "111", "Safari": "26", "SafariIOS": "26" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "The style read-only property of the CSSPositionTryRule interface returns a CSSPositionTryDescriptors object representing the declarations set in the body of the @position-try at-rule." + "doc": "The read-only style property of the CSSPositionTryRule interface contains a CSSPositionTryDescriptors object representing the descriptors available in the @position-try rule's body." }, "csspositionvalue": { "url": "$MDN_URL$/web/api/csspositionvalue", @@ -18021,7 +18137,7 @@ "Edge": "79", "Opera": "53" }, - "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The CSSPositionValue interface of the CSS Typed Object Model API represents values for properties that take a position, for example object-position." + "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The CSSPositionValue interface of the CSS Typed Object Model API represents values for properties that take a position, for example object-position." }, "csspositionvalue.csspositionvalue": { "url": "$MDN_URL$/web/api/csspositionvalue/csspositionvalue", @@ -18034,7 +18150,7 @@ "Edge": "79", "Opera": "53" }, - "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The CSSPositionValue() constructor\ncreates a new CSSPositionValue object which represents values for\nproperties that take a position, for example object-position.", + "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The CSSPositionValue() constructor\ncreates a new CSSPositionValue object which represents values for\nproperties that take a position, for example object-position.", "parameters": { "x": "A position along the web page's horizontal axis.", "y": "A position along the web page's vertical axis." @@ -18088,7 +18204,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The getCounterValue() method of the\nCSSPrimitiveValue interface is used to get the counter\nvalue. If this CSS value doesn't contain a counter value, a DOMException\nis raised. Modification to the corresponding style property can be achieved using the\nCounter interface.\n

    \n

    Note:\nThis method was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do\nnot implement it.\n

    To achieve your purpose, you can use:\n

    \n
    ", + "doc": "

    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.

    \n

    The getCounterValue() method of the\nCSSPrimitiveValue interface is used to get the counter\nvalue. If this CSS value doesn't contain a counter value, a DOMException\nis raised. Modification to the corresponding style property can be achieved using the\nCounter interface.\n

    \n

    Note:\nThis method was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do\nnot implement it.\n

    To achieve your purpose, you can use:\n

    \n
    ", "returns": "A Counter object representing the counter value.", "throws": { "DOMException": "An\nINVALID_ACCESS_ERR\nis raised if the CSS value doesn't contain a\nCounter\nvalue (e.g., this is not\nCSS_COUNTER\n)." @@ -18106,7 +18222,7 @@ }, "doc": "

    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.

    \n

    The getFloatValue() method of the\nCSSPrimitiveValue interface is used to get a float value in a specified\nunit. If this CSS value doesn't contain a float value or can't be converted into the\nspecified unit, a DOMException is raised.\n

    \n

    Note:\nThis method was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do\nnot implement it.\n

    To achieve your purpose, you can use:\n

    \n
    ", "parameters": { - "unit": "An unsigned short representing the code for the unit type, in which the\nvalue should be returned. Valid values are:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_CMThe value is a <length> in centimeters.
    CSS_DEGThe value is an <angle> in degrees.
    CSS_DIMENSIONThe value is a <number> with an unknown dimension.
    CSS_EMSThe value is a <length> in em units.
    CSS_EXSThe value is a <length> in ex units.
    CSS_GRADThe value is an <angle> in grads.
    CSS_HZThe value is a <frequency> in Hertz. The value can be obtained by using the getFloatValue method.
    CSS_INThe value is a <length> in inches.
    CSS_KHZThe value is a <frequency> in Kilohertz.
    CSS_MMThe value is a <length> in millimeters.
    CSS_MSThe value is a <time> in milliseconds.
    CSS_NUMBERThe value is a simple <number>.
    CSS_PCThe value is a <length> in picas.
    CSS_PERCENTAGEThe value is a <percentage>.
    CSS_PTThe value is a <length> in points.
    CSS_PXThe value is a <length> in pixels.
    CSS_RADThe value is an <angle> in radians.
    CSS_SThe value is a <time> in seconds.
    " + "unit": "An unsigned short representing the code for the unit type, in which the\nvalue should be returned. Valid values are:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_CMThe value is a <length> in centimeters.
    CSS_DEGThe value is an <angle> in degrees.
    CSS_DIMENSIONThe value is a <number> with an unknown dimension.
    CSS_EMSThe value is a <length> in em units.
    CSS_EXSThe value is a <length> in ex units.
    CSS_GRADThe value is an <angle> in grads.
    CSS_HZThe value is a <frequency> in Hertz. The value can be obtained by using the getFloatValue method.
    CSS_INThe value is a <length> in inches.
    CSS_KHZThe value is a <frequency> in Kilohertz.
    CSS_MMThe value is a <length> in millimeters.
    CSS_MSThe value is a <time> in milliseconds.
    CSS_NUMBERThe value is a simple <number>.
    CSS_PCThe value is a <length> in picas.
    CSS_PERCENTAGEThe value is a <percentage>.
    CSS_PTThe value is a <length> in points.
    CSS_PXThe value is a <length> in pixels.
    CSS_RADThe value is an <angle> in radians.
    CSS_SThe value is a <time> in seconds.
    " }, "returns": "A float value in the specified unit.", "throws": { @@ -18185,12 +18301,12 @@ }, "doc": "

    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.

    \n

    The setFloatValue() method of the\nCSSPrimitiveValue interface is used to set a float value. If the property\nattached to this value can't accept the specified unit or the float value, the value\nwill be unchanged and a DOMException will be raised.\n

    \n

    Note:\nThis method was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do\nnot implement it.\n

    To achieve your purpose, you can use:\n

    \n
    ", "parameters": { - "unitType": "An unsigned short representing the code for the unit type, in which the\nvalue should be returned. Valid values are:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_CMThe value is a <length> in centimeters.
    CSS_DEGThe value is an <angle> in degrees.
    CSS_DIMENSIONThe value is a <number> with an unknown dimension.
    CSS_EMSThe value is a <length> in em units.
    CSS_EXSThe value is a <length> in ex units.
    CSS_GRADThe value is an <angle> in grads.
    CSS_HZThe value is a <frequency> in Hertz. The value can be obtained by using the getFloatValue method.
    CSS_INThe value is a <length> in inches.
    CSS_KHZThe value is a <frequency> in Kilohertz.
    CSS_MMThe value is a <length> in millimeters.
    CSS_MSThe value is a <time> in milliseconds.
    CSS_NUMBERThe value is a simple <number>.
    CSS_PCThe value is a <length> in picas.
    CSS_PERCENTAGEThe value is a <percentage>.
    CSS_PTThe value is a <length> in points.
    CSS_PXThe value is a <length> in pixels.
    CSS_RADThe value is an <angle> in radians.
    CSS_SThe value is a <time> in seconds.
    ", + "unitType": "An unsigned short representing the code for the unit type, in which the\nvalue should be returned. Valid values are:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_CMThe value is a <length> in centimeters.
    CSS_DEGThe value is an <angle> in degrees.
    CSS_DIMENSIONThe value is a <number> with an unknown dimension.
    CSS_EMSThe value is a <length> in em units.
    CSS_EXSThe value is a <length> in ex units.
    CSS_GRADThe value is an <angle> in grads.
    CSS_HZThe value is a <frequency> in Hertz. The value can be obtained by using the getFloatValue method.
    CSS_INThe value is a <length> in inches.
    CSS_KHZThe value is a <frequency> in Kilohertz.
    CSS_MMThe value is a <length> in millimeters.
    CSS_MSThe value is a <time> in milliseconds.
    CSS_NUMBERThe value is a simple <number>.
    CSS_PCThe value is a <length> in picas.
    CSS_PERCENTAGEThe value is a <percentage>.
    CSS_PTThe value is a <length> in points.
    CSS_PXThe value is a <length> in pixels.
    CSS_RADThe value is an <angle> in radians.
    CSS_SThe value is a <time> in seconds.
    ", "floatValue": "A float representing the new float value." }, "returns": "None (undefined).", "throws": { - "DOMException": "An\nINVALID_ACCESS_ERR\nis raised if the CSS value doesn't\ncontain a float value or if the string value can't be converted into the\nspecified unit.\n
    \nAn NO_MODIFICATION_ALLOWED_ERR is raised if this\nproperty is read-only." + "DOMException": "An\nINVALID_ACCESS_ERR\nis raised if the CSS value doesn't\ncontain a float value or if the string value can't be converted into the\nspecified unit.\n
    \nA NO_MODIFICATION_ALLOWED_ERR is raised if this\nproperty is read-only." } }, "cssprimitivevalue.setstringvalue": { @@ -18205,7 +18321,7 @@ }, "doc": "

    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.

    \n

    The setStringValue() method of the\nCSSPrimitiveValue interface is used to set a string value. If the\nproperty attached to this value can't accept the specified unit or the string value, the\nvalue will be unchanged and a DOMException will be raised.\n

    \n

    Note:\nThis method was part of an attempt to create a typed CSS Object Model. This attempt has been abandoned, and most browsers do\nnot implement it.\n

    To achieve your purpose, you can use:\n

    \n
    ", "parameters": { - "stringType": "An unsigned short representing the type of the value. Possible values\nare:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_ATTRThe value is an attr() function.
    CSS_IDENTThe value is an identifier.
    CSS_STRINGThe value is a <string>.
    CSS_URIThe value is a <url>.
    ", + "stringType": "An unsigned short representing the type of the value. Possible values\nare:\n
    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ConstantDescription
    CSS_ATTRThe value is an attr() function.
    CSS_IDENTThe value is an identifier.
    CSS_STRINGThe value is a <string>.
    CSS_URIThe value is a <url>.
    ", "stringValue": "A string representing the new string value." }, "returns": "None (undefined).", @@ -18233,7 +18349,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The CSSPropertyRule interface of the CSS Properties and Values API represents a single CSS @property rule." + "doc": "The CSSPropertyRule interface of the CSS Properties and Values API represents a single CSS @property rule." }, "csspropertyrule.inherits": { "url": "$MDN_URL$/web/api/csspropertyrule/inherits", @@ -18254,7 +18370,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The read-only inherits property of the CSSPropertyRule interface returns the inherit flag of the custom property registration represented by the @property rule, a boolean describing whether or not the property inherits by default." + "doc": "The read-only inherits property of the CSSPropertyRule interface returns the inherit flag of the custom property registration represented by the @property rule, a boolean describing whether or not the property inherits by default." }, "csspropertyrule.initialvalue": { "url": "$MDN_URL$/web/api/csspropertyrule/initialvalue", @@ -18275,7 +18391,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The read-only initialValue nullable property of the CSSPropertyRule interface returns the initial value of the custom property registration represented by the @property rule, controlling the property's initial value." + "doc": "The read-only initialValue nullable property of the CSSPropertyRule interface returns the initial value of the custom property registration represented by the @property rule, controlling the property's initial value." }, "csspropertyrule.name": { "url": "$MDN_URL$/web/api/csspropertyrule/name", @@ -18296,7 +18412,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The read-only name property of the CSSPropertyRule interface represents the property name, this being the serialization of the name given to the custom property in the @property rule's prelude." + "doc": "The read-only name property of the CSSPropertyRule interface represents the property name, this being the serialization of the name given to the custom property in the @property rule's prelude." }, "csspropertyrule.syntax": { "url": "$MDN_URL$/web/api/csspropertyrule/syntax", @@ -18317,7 +18433,7 @@ "level": "LOW", "lowDate": "2024-07-09" }, - "doc": "The read-only syntax property of the CSSPropertyRule interface returns the literal syntax of the custom property registration represented by the @property rule, controlling how the property's value is parsed at computed-value time." + "doc": "The read-only syntax property of the CSSPropertyRule interface returns the literal syntax of the custom property registration represented by the @property rule, controlling how the property's value is parsed at computed-value time." }, "csspseudoelement": { "url": "$MDN_URL$/web/api/csspseudoelement", @@ -18353,7 +18469,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The type read-only property of the\nCSSPseudoElement interface returns the type of the pseudo-element as a\nstring, represented in the form of a CSS selector." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The type read-only property of the\nCSSPseudoElement interface returns the type of the pseudo-element as a\nstring, represented in the form of a CSS selector." }, "cssrotate": { "url": "$MDN_URL$/web/api/cssrotate", @@ -18371,7 +18487,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSRotate interface of the CSS Typed Object Model API represents the rotate value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "The CSSRotate interface of the CSS Typed Object Model API represents the rotate value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssrotate.angle": { "url": "$MDN_URL$/web/api/cssrotate/angle", @@ -18407,7 +18523,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSRotate() constructor creates a new\nCSSRotate object representing the rotate() value of the\nindividual transform property in CSS.", + "doc": "The CSSRotate() constructor creates a new\nCSSRotate object representing the rotate() value of the\nindividual transform property in CSS.", "parameters": { "x": "A value for the x-axis of the CSSRotate object to be constructed. This must either be a number (which is wrapped into a CSSUnitValue of unit: \"number\") or a CSSNumericValue.", "y": "A value for the y-axis of the CSSRotate object to be constructed. This must either be a number (which is wrapped into a CSSUnitValue of unit: \"number\") or a CSSNumericValue.", @@ -18415,7 +18531,7 @@ "angle": "A value for the angle of the CSSRotate object to be constructed. This\nmust be a CSSNumericValue." }, "throws": { - "TypeError": "Raised if the value of CSSRotate.angle is not an <angle> value\nor CSSRotate.x, CSSRotate.y, CSSRotate.z are\nnot <number> values." + "TypeError": "Raised if the value of CSSRotate.angle is not an <angle> value\nor CSSRotate.x, CSSRotate.y, CSSRotate.z are\nnot <number> values." } }, "cssrotate.x": { @@ -18492,7 +18608,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSRule interface represents a single CSS rule. There are several types of rules which inherit properties from CSSRule.\n

    " + "doc": "The CSSRule interface represents a single CSS rule. There are several types of rules which inherit properties from CSSRule.\n" }, "cssrule.csstext": { "url": "$MDN_URL$/web/api/cssrule/csstext", @@ -18664,7 +18780,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSScale interface of the CSS Typed Object Model API represents the scale() and scale3d() values of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "The CSSScale interface of the CSS Typed Object Model API represents the scale() and scale3d() values of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssscale.cssscale": { "url": "$MDN_URL$/web/api/cssscale/cssscale", @@ -18682,7 +18798,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSScale() constructor creates a new\nCSSScale object representing the scale() and scale3d() values of the\nindividual transform property in CSS.", + "doc": "The CSSScale() constructor creates a new\nCSSScale object representing the scale() and scale3d() values of the\nindividual transform property in CSS.", "parameters": { "x": "A value for the x-axis of the CSSScale object to be constructed. This must either be a number (which is wrapped into a CSSUnitValue of unit: \"number\") or a CSSNumericValue.", "y": "A value for the y-axis of the CSSScale object to be constructed. This must either be a number (which is wrapped into a CSSUnitValue of unit: \"number\") or a CSSNumericValue.", @@ -18752,14 +18868,17 @@ "Chrome": "118", "ChromeAndroid": "118", "Edge": "118", + "Firefox": "146", + "FirefoxAndroid": "146", "Opera": "104", "Safari": "17.4", "SafariIOS": "17.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-09" }, - "doc": "The CSSScopeRule interface of the CSS Object Model represents a CSS @scope at-rule." + "doc": "The CSSScopeRule interface of the CSS Object Model represents a CSS @scope at-rule." }, "cssscoperule.end": { "url": "$MDN_URL$/web/api/cssscoperule/end", @@ -18770,12 +18889,15 @@ "Chrome": "118", "ChromeAndroid": "118", "Edge": "118", + "Firefox": "146", + "FirefoxAndroid": "146", "Opera": "104", "Safari": "17.4", "SafariIOS": "17.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-09" }, "doc": "The end property of the CSSScopeRule interface returns a string containing the value of the @scope at-rule's scope limit." }, @@ -18788,12 +18910,15 @@ "Chrome": "118", "ChromeAndroid": "118", "Edge": "118", + "Firefox": "146", + "FirefoxAndroid": "146", "Opera": "104", "Safari": "17.4", "SafariIOS": "17.4" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-09" }, "doc": "The start property of the CSSScopeRule interface returns a string containing the value of the @scope at-rule's scope root." }, @@ -18813,7 +18938,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSSkew interface of the CSS Typed Object Model API is part of the CSSTransformValue interface. It represents the skew() value of the individual transform property in CSS." + "doc": "The CSSSkew interface of the CSS Typed Object Model API is part of the CSSTransformValue interface. It represents the skew() value of the individual transform property in CSS." }, "cssskew.ax": { "url": "$MDN_URL$/web/api/cssskew/ax", @@ -18867,7 +18992,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSSkew() constructor creates a new\nCSSSkew object which represents the\nskew() value\nof the individual transform property in CSS.", + "doc": "The CSSSkew() constructor creates a new\nCSSSkew object which represents the\nskew() value\nof the individual transform property in CSS.", "parameters": { "ax": "A value for the ax (x-axis) angle of the CSSSkew object to be constructed. This must be a CSSNumericValue.", "ay": "A value for the ay (y-axis) angle of the CSSSkew object to be constructed. This must be a CSSNumericValue." @@ -18889,7 +19014,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewX interface of the CSS Typed Object Model API represents the skewX() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewX interface of the CSS Typed Object Model API represents the skewX() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssskewx.ax": { "url": "$MDN_URL$/web/api/cssskewx/ax", @@ -18925,7 +19050,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewX() constructor creates a new\nCSSSkewX object which represents the\nskewX()\nvalue of the individual transform property in CSS.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewX() constructor creates a new\nCSSSkewX object which represents the\nskewX()\nvalue of the individual transform property in CSS.", "parameters": { "ax": "A value for the ax angle of the CSSSkewX object to be\nconstructed. This must be a CSSNumericValue." } @@ -18946,7 +19071,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewY interface of the CSS Typed Object Model API represents the skewY() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewY interface of the CSS Typed Object Model API represents the skewY() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "cssskewy.ay": { "url": "$MDN_URL$/web/api/cssskewy/ay", @@ -18982,7 +19107,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewY() constructor creates a new\nCSSSkewY object which represents the\nskewY() value\nof the individual transform property in CSS.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The CSSSkewY() constructor creates a new\nCSSSkewY object which represents the\nskewY() value\nof the individual transform property in CSS.", "parameters": { "ay": "A value for the ay angle of the CSSSkewY object to be\nconstructed. This must be a CSSNumericValue." } @@ -19006,7 +19131,7 @@ "level": "LOW", "lowDate": "2024-08-06" }, - "doc": "The CSSStartingStyleRule interface of the CSS Object Model represents a CSS @starting-style at-rule." + "doc": "The CSSStartingStyleRule interface of the CSS Object Model represents a CSS @starting-style at-rule." }, "cssstyledeclaration": { "url": "$MDN_URL$/web/api/cssstyledeclaration", @@ -19028,7 +19153,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSStyleDeclaration interface is the base class for objects that represent CSS declaration blocks with different supported sets of CSS style information:\n

    \n

    The interface exposes style information and various style-related methods and properties.\nFor example, it provides getPropertyValue() for getting the value of a dash-named CSS property, such as border-top, which can't be directly accessed using dot notation because of the hyphens in its name.\n

    \n

    Note:\nEarlier versions of the specification used CSSStyleDeclaration to represent all CSS declaration blocks, and some browsers and browser versions may still do so (check the browser compatibility tables for the above APIs).\nGenerally the same website code will be functional in both old and new versions, but some properties returned in a CSSStyleDeclaration may not be relevant in a particular context.\n

    " + "doc": "The CSSStyleDeclaration interface is the base class for objects that represent CSS declaration blocks with different supported sets of CSS style information:\n\n

    The interface exposes style information and various style-related methods and properties.\nFor example, it provides getPropertyValue() for getting the value of a dash-named CSS property, such as border-top, which can't be directly accessed using dot notation because of the hyphens in its name.\n

    \n

    Note:\nEarlier versions of the specification used CSSStyleDeclaration to represent all CSS declaration blocks, and some browsers and browser versions may still do so (check the browser compatibility tables for the above APIs).\nGenerally the same website code will be functional in both old and new versions, but some properties returned in a CSSStyleDeclaration may not be relevant in a particular context.\n

    " }, "cssstyledeclaration.cssfloat": { "url": "$MDN_URL$/web/api/cssstyledeclaration/cssfloat", @@ -19042,7 +19167,7 @@ "Edge": "", "Opera": "12.1" }, - "doc": "

    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.

    \n

    The cssFloat property of the CSSStyleDeclaration interface returns the result of invoking CSSStyleDeclaration.getPropertyValue() with float as an argument.\n

    When setting, it invokes CSSStyleDeclaration.setProperty() with float as the first argument, and the given value as the second argument. The given value must be a valid value for the float property." + "doc": "

    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.

    \n

    The cssFloat property of the CSSStyleDeclaration interface returns the result of invoking CSSStyleDeclaration.getPropertyValue() with float as an argument.\n

    When setting, it invokes CSSStyleDeclaration.setProperty() with float as the first argument, and the given value as the second argument. The given value must be a valid value for the float property." }, "cssstyledeclaration.csstext": { "url": "$MDN_URL$/web/api/cssstyledeclaration/csstext", @@ -19291,7 +19416,7 @@ "Safari": "26", "SafariIOS": "26" }, - "doc": "The cssFloat property of the CSSStyleProperties interface returns the CSS float property.\n

    This is the result of invoking getPropertyValue() on the object with float as an argument.\n

    When setting, it invokes setProperty() with float as the first argument, and the given value as the second argument.\nThe given value must be a valid value for the float property." + "doc": "The cssFloat property of the CSSStyleProperties interface returns the CSS float property.\n

    This is the result of invoking getPropertyValue() on the object with float as an argument.\n

    When setting, it invokes setProperty() with float as the first argument, and the given value as the second argument.\nThe given value must be a valid value for the float property." }, "cssstylerule": { "url": "$MDN_URL$/web/api/cssstylerule", @@ -19395,7 +19520,7 @@ "returns": "The index of the new rule.", "throws": { "IndexSizeError DOMException": "Thrown if index is greater than the number of child CSS rules.", - "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint.

    Thrown if the rule is a valid statement but not a nested statement." + "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint.

    Thrown if the rule is a valid statement but not a nested statement." } }, "cssstylerule.selectortext": { @@ -19440,7 +19565,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only style property is a CSSStyleProperties object that represents the inline styles of a style rule (CSSStyleRule).\n

    Note that properties that are present on the object for all CSS properties supported by the browser.\nThe properties that are not defined inline in the corresponding CSS declaration are set to the empty string (\"\")." + "doc": "The read-only style property of the CSSStyleRule interface contains a CSSStyleProperties object representing the properties list in this style rule's body.\n

    Each CSS property supported by the browser is present on the object.\nThe properties that are not defined inline in the corresponding CSS declaration are set to the empty string (\"\")." }, "cssstylerule.stylemap": { "url": "$MDN_URL$/web/api/cssstylerule/stylemap", @@ -19480,7 +19605,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The CSSStyleSheet interface represents a single CSS stylesheet, and lets you inspect and modify the list of rules contained in the stylesheet. It inherits properties and methods from its parent, StyleSheet.\n

    A stylesheet consists of a collection of CSSRule objects representing each of the rules in the stylesheet. The rules are contained in a CSSRuleList, which can be obtained from the stylesheet's cssRules property.\n

    For example, one rule might be a CSSStyleRule object containing a style such as:\n

    \n```css\nh1,\nh2 {\n  font-size: 16pt;\n}\n```\n
    \n

    Another rule might be an at-rule such as @import or @media, and so forth.\n

    See the Obtaining a StyleSheet section for the various ways a CSSStyleSheet object can be obtained. A CSSStyleSheet object can also be directly constructed. The constructor, and the CSSStyleSheet.replace(), and CSSStyleSheet.replaceSync() methods are newer additions to the specification, enabling Constructable Stylesheets." + "doc": "The CSSStyleSheet interface represents a single CSS stylesheet, and lets you inspect and modify the list of rules contained in the stylesheet. It inherits properties and methods from its parent, StyleSheet.\n

    A stylesheet consists of a collection of CSSRule objects representing each of the rules in the stylesheet. The rules are contained in a CSSRuleList, which can be obtained from the stylesheet's cssRules property.\n

    For example, one rule might be a CSSStyleRule object containing a style such as:\n

    \n```css\nh1,\nh2 {\n  font-size: 16pt;\n}\n```\n
    \n

    Another rule might be an at-rule such as @import or @media, and so forth.\n

    See the Obtaining a StyleSheet section for the various ways a CSSStyleSheet object can be obtained. A CSSStyleSheet object can also be directly constructed. The constructor, and the CSSStyleSheet.replace(), and CSSStyleSheet.replaceSync() methods are newer additions to the specification, enabling Constructable Stylesheets.\n

    To apply a CSSStyleSheet to a document or shadow root, assign it to the Document.adoptedStyleSheets or ShadowRoot.adoptedStyleSheets property, respectively." }, "cssstylesheet.addrule": { "url": "$MDN_URL$/web/api/cssstylesheet/addrule", @@ -19601,15 +19726,15 @@ }, "doc": "The CSSStyleSheet.insertRule()\nmethod inserts a new CSS rule into the current style sheet.\n

    \n

    Note:\nAlthough insertRule() is exclusively a method of\nCSSStyleSheet, it actually inserts the rule into\nCSSStyleSheet.cssRules — its internal\nCSSRuleList.\n

    ", "parameters": { - "rule": "A string containing the rule to be inserted. What the inserted\nrule must contain depends on its type:\n", + "rule": "A string containing the rule to be inserted. What the inserted\nrule must contain depends on its type:\n", "index": "A positive integer less than or equal to stylesheet.cssRules.length,\nrepresenting the newly inserted rule's position in\nCSSStyleSheet.cssRules. The default is\n0. (In older implementations, this was required. See Browser compatibility for details.)" }, "returns": "The newly inserted rule's index within the stylesheet's rule-list.", "throws": { "IndexSizeError DOMException": "Thrown if index > CSSRuleList.length.", - "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint; for instance: trying to insert an @import at-rule after a style rule.", + "HierarchyRequestError DOMException": "Thrown if rule cannot be inserted at the specified index due to some CSS constraint; for instance: trying to insert an @import at-rule after a style rule.", "SyntaxError DOMException": "Thrown if more than one rule is given in the rule parameter.", - "InvalidStateError DOMException": "Thrown if rule is @namespace and the rule-list has more than just @import at-rules and/or @namespace at-rules." + "InvalidStateError DOMException": "Thrown if rule is @namespace and the rule-list contains at-rules other than @import and @namespace at-rules." } }, "cssstylesheet.ownerrule": { @@ -19632,7 +19757,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only CSSStyleSheet property\nownerRule returns the CSSImportRule\ncorresponding to the @import at-rule which imported the stylesheet into\nthe document. If the stylesheet wasn't imported into the document using\n@import, the returned value is null." + "doc": "The read-only CSSStyleSheet property\nownerRule returns the CSSImportRule\ncorresponding to the @import at-rule which imported the stylesheet into\nthe document. If the stylesheet wasn't imported into the document using\n@import, the returned value is null." }, "cssstylesheet.removerule": { "url": "$MDN_URL$/web/api/cssstylesheet/removerule", @@ -19678,7 +19803,7 @@ }, "doc": "The replace() method of the CSSStyleSheet interface asynchronously replaces the content of the stylesheet with the content passed into it. The method returns a promise that resolves with the CSSStyleSheet object.\n

    The replace() and CSSStyleSheet.replaceSync() methods can only be used on a stylesheet created with the CSSStyleSheet() constructor.", "parameters": { - "text": "A string containing the style rules to replace the content of the stylesheet. If the string does not contain a parsable list of rules, then the value will be set to an empty string.\n

    \n

    Note:\nIf any of the rules passed in text are an external stylesheet imported with the @import rule, those rules will be removed, and a warning printed to the console.\n

    " + "text": "A string containing the style rules to replace the content of the stylesheet. If the string does not contain a parsable list of rules, then the value will be set to an empty string.\n
    \n

    Note:\nIf any of the rules passed in text are an external stylesheet imported with the @import rule, those rules will be removed, and a warning printed to the console.\n

    " }, "returns": "A Promise that resolves with the CSSStyleSheet.", "throws": { @@ -19707,7 +19832,7 @@ }, "doc": "The replaceSync() method of the CSSStyleSheet interface synchronously replaces the content of the stylesheet with the content passed into it.\n

    The replaceSync() and CSSStyleSheet.replace() methods can only be used on a stylesheet created with the CSSStyleSheet() constructor.", "parameters": { - "text": "A string containing the style rules to replace the content of the stylesheet. If the string does not contain a parsable list of rules, then the value will be set to an empty string.\n

    \n

    Note:\nIf any of the rules passed in text are an external stylesheet imported with the @import rule, those rules will be removed, and a warning printed to the console.\n

    " + "text": "A string containing the style rules to replace the content of the stylesheet. If the string does not contain a parsable list of rules, then the value will be set to an empty string.\n
    \n

    Note:\nIf any of the rules passed in text are an external stylesheet imported with the @import rule, those rules will be removed, and a warning printed to the console.\n

    " }, "returns": "None (undefined).", "throws": { @@ -19816,7 +19941,7 @@ "lowDate": "2015-09-30", "highDate": "2018-03-30" }, - "doc": "The CSSSupportsRule interface represents a single CSS @supports at-rule." + "doc": "The CSSSupportsRule interface represents a single CSS @supports at-rule." }, "csstransformcomponent": { "url": "$MDN_URL$/web/api/csstransformcomponent", @@ -19870,7 +19995,7 @@ "baseline": { "level": "NONE" }, - "doc": "The toMatrix() method of the\nCSSTransformComponent interface returns a DOMMatrix\nobject.\n

    All transform functions can be represented mathematically as a 4x4 transformation matrix.\n

    \n

    Note:\nThe is2D property affects what transform, and therefore type of matrix that will be returned. CSS 2D and 3D transforms are different for legacy reasons. A brief explanation of 2D vs. 3D transforms can be found in Using CSS transforms.\n

    ", + "doc": "The toMatrix() method of the\nCSSTransformComponent interface returns a DOMMatrix\nobject.\n

    All transform functions can be represented mathematically as a 4x4 transformation matrix.\n

    \n

    Note:\nThe is2D property affects what transform, and therefore type of matrix that will be returned. CSS 2D and 3D transforms are different for legacy reasons. A brief explanation of 2D vs. 3D transforms can be found in Using CSS transforms.\n

    ", "returns": "A DOMMatrix object", "throws": { "TypeError": "Raised if any lengths involved in generating the matrix are not compatible units\nwith px (such as relative lengths or percentages)." @@ -19892,8 +20017,8 @@ "baseline": { "level": "NONE" }, - "doc": "The toString() method of the CSSTransformComponent interface is a stringifier returning a CSS Transforms function.", - "returns": "A string in the form of a CSS transform function.\n

    This will use the value of is2D to return either a 2D or 3D transform. For example if the component represents CSSRotate and is2D is false then the string returned will be in the form of the CSS transformation rotate3d() function. If true the string returned will be in the form of the 2-dimensional rotate() function." + "doc": "The toString() method of the CSSTransformComponent interface is a stringifier returning a CSS Transforms function.", + "returns": "A string in the form of a CSS transform function.\n

    This will use the value of is2D to return either a 2D or 3D transform. For example if the component represents CSSRotate and is2D is false then the string returned will be in the form of the CSS transformation rotate3d() function. If true the string returned will be in the form of the 2-dimensional rotate() function." }, "csstransformvalue": { "url": "$MDN_URL$/web/api/csstransformvalue", @@ -19911,7 +20036,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSTransformValue interface of the CSS Typed Object Model API represents transform-list values as used by the CSS transform property." + "doc": "The CSSTransformValue interface of the CSS Typed Object Model API represents transform-list values as used by the CSS transform property." }, "csstransformvalue.csstransformvalue": { "url": "$MDN_URL$/web/api/csstransformvalue/csstransformvalue", @@ -20099,7 +20224,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The CSSTransition interface of the Web Animations API represents an Animation object used for a CSS Transition." + "doc": "The CSSTransition interface of the Web Animations API represents an Animation object used for a CSS Transition." }, "csstransition.transitionproperty": { "url": "$MDN_URL$/web/api/csstransition/transitionproperty", @@ -20139,7 +20264,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSTranslate interface of the CSS Typed Object Model API represents the translate() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." + "doc": "The CSSTranslate interface of the CSS Typed Object Model API represents the translate() value of the individual transform property in CSS. It inherits properties and methods from its parent CSSTransformValue." }, "csstranslate.csstranslate": { "url": "$MDN_URL$/web/api/csstranslate/csstranslate", @@ -20157,14 +20282,14 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSTranslate() constructor creates a\nnew CSSTranslate object representing the translate() value of the\nindividual transform property in CSS.", + "doc": "The CSSTranslate() constructor creates a\nnew CSSTranslate object representing the translate() value of the\nindividual transform property in CSS.", "parameters": { - "x": "A value for the x-axis of the CSSTranslate object to be constructed.\nThis must be a <length-percentage>.", - "y": "A value for the y-axis of the CSSTranslate object to be constructed.\nThis must be a <length-percentage>.", - "z": "A value for the z-axis of the CSSTranslate object to be constructed.\nThis must be a <length>.\n

    If a value is passed for the z-axis this is a 3d transform. The value of\nis2D will be set to false." + "x": "A value for the x-axis of the CSSTranslate object to be constructed.\nThis must be a <length-percentage>.", + "y": "A value for the y-axis of the CSSTranslate object to be constructed.\nThis must be a <length-percentage>.", + "z": "A value for the z-axis of the CSSTranslate object to be constructed.\nThis must be a <length>.\n

    If a value is passed for the z-axis this is a 3d transform. The value of\nis2D will be set to false." }, "throws": { - "TypeError": "Raised if the value of CSSTranslate.x or CSSTranslate.y is\nnot a <length-percentage>.

    Raised if the value of CSSTranslate.z exists but is not a\n<length>." + "TypeError": "Raised if the value of CSSTranslate.x or CSSTranslate.y is\nnot a <length-percentage>.

    Raised if the value of CSSTranslate.z exists but is not a\n<length>." } }, "csstranslate.x": { @@ -20313,7 +20438,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSUnparsedValue interface of the CSS Typed Object Model API represents property values that reference custom properties. It consists of a list of string fragments and variable references.\n

    Custom properties are represented by CSSUnparsedValue and var() references are represented using CSSVariableReferenceValue." + "doc": "The CSSUnparsedValue interface of the CSS Typed Object Model API represents property values that reference custom properties. It consists of a list of string fragments and variable references.\n

    Custom properties are represented by CSSUnparsedValue and var() references are represented using CSSVariableReferenceValue." }, "cssunparsedvalue.cssunparsedvalue": { "url": "$MDN_URL$/web/api/cssunparsedvalue/cssunparsedvalue", @@ -20529,7 +20654,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CSSVariableReferenceValue interface of the CSS Typed Object Model API allows you to create a custom name for a built-in CSS value. This object functionality is sometimes called a \"CSS variable\" and serves the same purpose as the var() function. The custom name must begin with two dashes." + "doc": "The CSSVariableReferenceValue interface of the CSS Typed Object Model API allows you to create a custom name for a built-in CSS value. This object functionality is sometimes called a \"CSS variable\" and serves the same purpose as the var() function. The custom name must begin with two dashes." }, "cssvariablereferencevalue.cssvariablereferencevalue": { "url": "$MDN_URL$/web/api/cssvariablereferencevalue/cssvariablereferencevalue", @@ -20549,8 +20674,8 @@ }, "doc": "Creates a new CSSVariableReferenceValue.", "parameters": { - "variable": "A custom property name.", - "fallback": "A custom property fallback value." + "variable": "A custom property name.", + "fallback": "A custom property fallback value." } }, "cssvariablereferencevalue.fallback": { @@ -20569,7 +20694,7 @@ "baseline": { "level": "NONE" }, - "doc": "The fallback read-only property of the\nCSSVariableReferenceValue interface returns the custom property fallback value of the CSSVariableReferenceValue." + "doc": "The fallback read-only property of the\nCSSVariableReferenceValue interface returns the custom property fallback value of the CSSVariableReferenceValue." }, "cssvariablereferencevalue.variable": { "url": "$MDN_URL$/web/api/cssvariablereferencevalue/variable", @@ -20587,7 +20712,61 @@ "baseline": { "level": "NONE" }, - "doc": "The variable property of the\nCSSVariableReferenceValue interface returns the custom property name of the\nCSSVariableReferenceValue." + "doc": "The variable property of the\nCSSVariableReferenceValue interface returns the custom property name of the\nCSSVariableReferenceValue." + }, + "cssviewtransitionrule": { + "url": "$MDN_URL$/web/api/cssviewtransitionrule", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "126", + "ChromeAndroid": "126", + "Edge": "126", + "Opera": "112", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The CSSViewTransitionRule interface represents a CSS @view-transition at-rule." + }, + "cssviewtransitionrule.navigation": { + "url": "$MDN_URL$/web/api/cssviewtransitionrule/navigation", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "126", + "ChromeAndroid": "126", + "Edge": "126", + "Opera": "112", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The navigation read-only property of the CSSViewTransitionRule interface returns the associated @view-transition at-rule's navigation descriptor value." + }, + "cssviewtransitionrule.types": { + "url": "$MDN_URL$/web/api/cssviewtransitionrule/types", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "126", + "ChromeAndroid": "126", + "Edge": "126", + "Opera": "112", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "NONE" + }, + "doc": "The types read-only property of the CSSViewTransitionRule interface returns an array containing the associated @view-transition at-rule's types descriptor values." }, "customelementregistry": { "url": "$MDN_URL$/web/api/customelementregistry", @@ -20882,7 +21061,7 @@ "level": "LOW", "lowDate": "2024-05-14" }, - "doc": "The add method of the CustomStateSet interface adds value representing a custom state to the CustomStateSet.\n

    Custom elements with a specific state can be selected using the :state() pseudo-class, specifying the desired state as an argument.", + "doc": "The add method of the CustomStateSet interface adds value representing a custom state to the CustomStateSet.\n

    Custom elements with a specific state can be selected using the :state() pseudo-class, specifying the desired state as an argument.", "parameters": { "value": "A string that represents the custom state." }, @@ -21392,7 +21571,7 @@ "highDate": "2019-05-15" }, "doc": "If the item is a file, the DataTransferItem.getAsFile() method returns the drag data item's File object.\nIf the item is not a file, this method returns null.", - "returns": "

    \n
    File
    \n
    \n

    If the drag data item is a file, a File object is returned; otherwise null is returned.\n

    \n
    " + "returns": "If the drag data item is a file, a File object is returned; otherwise null is returned." }, "datatransferitem.getasfilesystemhandle": { "url": "$MDN_URL$/web/api/datatransferitem/getasfilesystemhandle", @@ -21409,7 +21588,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getAsFileSystemHandle() method of the DataTransferItem interface returns a Promise that fulfills with a FileSystemFileHandle if the dragged item is a file, or fulfills with a FileSystemDirectoryHandle if the dragged item is a directory.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getAsFileSystemHandle() method of the DataTransferItem interface returns a Promise that fulfills with a FileSystemFileHandle if the dragged item is a file, or fulfills with a FileSystemDirectoryHandle if the dragged item is a directory.", "returns": "A Promise.\n

    If the item's kind property is \"file\", and this item is accessed in the dragstart or drop event handlers, then the returned promise is fulfilled with a FileSystemFileHandle if the dragged item is a file or a FileSystemDirectoryHandle if the dragged item is a directory.\n

    Otherwise, the promise fulfills with null." }, "datatransferitem.getasstring": { @@ -21644,10 +21823,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DecompressionStream interface of the Compression Streams API is an API for decompressing a stream of data." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DecompressionStream interface of the Compression Streams API decompresses a stream of data. It implements the same shape as a TransformStream, allowing it to be used in ReadableStream.pipeThrough() and similar methods." }, "decompressionstream.decompressionstream": { "url": "$MDN_URL$/web/api/decompressionstream/decompressionstream", @@ -21667,12 +21847,13 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DecompressionStream() constructor creates a new DecompressionStream object which decompresses a stream of data.", "parameters": { - "format": "One of the following compression formats:\n

    \n
    \"gzip\"
    \n
    \n

    Decompress the stream using the GZIP format.\n

    \n
    \"deflate\"
    \n
    \n

    Decompress the stream using the DEFLATE algorithm in ZLIB Compressed Data Format.\nThe ZLIB format includes a header with information about the compression method and the uncompressed size of the data, and a trailing checksum for verifying the integrity of the data\n

    \n
    \"deflate-raw\"
    \n
    \n

    Decompress the stream using the DEFLATE algorithm without a header and trailing checksum.\n

    \n
    " + "format": "One of the following compression formats:\n
    \n
    \"brotli\"
    \n
    \n

    Decompress the stream using the Brotli algorithm.\n

    \n
    \"gzip\"
    \n
    \n

    Decompress the stream using the GZIP algorithm.\n

    \n
    \"deflate\"
    \n
    \n

    Decompress the stream using the DEFLATE algorithm in ZLIB Compressed Data Format.\nThe ZLIB format includes a header with information about the compression method and the uncompressed size of the data, and a trailing checksum for verifying the integrity of the data\n

    \n
    \"deflate-raw\"
    \n
    \n

    Decompress the stream using the DEFLATE algorithm without a header and trailing checksum.\n

    \n
    \"zstd\"
    \n
    \n

    Decompress the stream using the ZSTD algorithm.\n

    \n
    " }, "throws": { "TypeError": "Thrown if the format passed to the constructor is not supported." @@ -21696,10 +21877,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the DecompressionStream interface returns a ReadableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the DecompressionStream interface returns a ReadableStream that emits decompressed data as Uint8Array chunks." }, "decompressionstream.writable": { "url": "$MDN_URL$/web/api/decompressionstream/writable", @@ -21719,10 +21901,11 @@ "Deno": "1.19" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the DecompressionStream interface returns a WritableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the DecompressionStream interface returns a WritableStream that accepts compressed data to be decompressed, in the form of ArrayBuffer, TypedArray, or DataView chunks." }, "dedicatedworkerglobalscope": { "url": "$MDN_URL$/web/api/dedicatedworkerglobalscope", @@ -21886,7 +22069,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The DeferredRequestInit dictionary of the fetchLater() API represents the set of options that can be used to configure a deferred fetch request.\n

    The DeferredRequestInit object is passed directly into the window.fetchLater() function call as the second argument.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The DeferredRequestInit dictionary of the Fetch API represents the set of options that can be used to configure a deferred fetch request.\n

    The DeferredRequestInit object is passed directly into the window.fetchLater() function call as the second argument.", "throws": { "RangeError DOMException": "Raised when a negative activateAfter is provided." } @@ -22185,7 +22368,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEvent interface of the Device Orientation Events provides web developers with information about the speed of changes for the device's position and orientation.\n

    \n

    Warning:\nCurrently, Firefox and Chrome do not handle the coordinates the same way. Take care about this while using them.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEvent interface of the Device Orientation Events provides web developers with information about the speed of changes for the device's position and orientation.\n

    \n

    Warning:\nCurrently, Firefox and Chrome do not handle the coordinates the same way. Take care about this while using them.\n

    " }, "devicemotionevent.acceleration": { "url": "$MDN_URL$/web/api/devicemotionevent/acceleration", @@ -22206,7 +22389,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The acceleration read-only property of the DeviceMotionEvent interface returns the acceleration recorded by\nthe device, in meters per second squared (m/s²).\nThis value does not include the effect of\nthe gravitational force, in contrast to DeviceMotionEvent.accelerationIncludingGravity.\n

    \n

    Note:\nIf the hardware does not know how to remove gravity from the\nacceleration data, this value may not be present in the\nDeviceMotionEvent. In this situation, you'll need to use\nDeviceMotionEvent.accelerationIncludingGravity instead.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The acceleration read-only property of the DeviceMotionEvent interface returns the acceleration recorded by\nthe device, in meters per second squared (m/s²).\nThis value does not include the effect of\nthe gravitational force, in contrast to DeviceMotionEvent.accelerationIncludingGravity.\n

    \n

    Note:\nIf the hardware does not know how to remove gravity from the\nacceleration data, this value may not be present in the\nDeviceMotionEvent. In this situation, you'll need to use\nDeviceMotionEvent.accelerationIncludingGravity instead.\n

    " }, "devicemotionevent.accelerationincludinggravity": { "url": "$MDN_URL$/web/api/devicemotionevent/accelerationincludinggravity", @@ -22227,7 +22410,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The accelerationIncludingGravity read-only property of the DeviceMotionEvent interface returns the\namount of acceleration recorded by the device, in meters per second squared (m/s²). Unlike DeviceMotionEvent.acceleration\nwhich compensates for the influence of gravity, its value is the sum of the acceleration\nof the device as induced by the user and an acceleration equal and opposite to that\ncaused by gravity. In other words, it measures the\ng-force. In practice, this value represents\nthe raw data measured by an accelerometer.\n

    This value is not typically as useful as DeviceMotionEvent.acceleration,\nbut may be the only value available on devices that aren't able to remove gravity from\nthe acceleration data, such as on devices that don't have a gyroscope.\n

    \n

    Note:\naccelerationIncludingGravity's name can be misleading. This property represents acceleration including the effects of gravity. For example, if a device is lying flat on a horizontal surface with the screen pointing up, gravity would be -9.8 along the Z axis, while acceleration.z would be 0 and accelerationIncludingGravity.z would be 9.8. Similarly, if a device is in free fall with its screen horizontal and pointing up, gravity would be -9.8 along the Z axis, while acceleration.z would be -9.8 and accelerationIncludingGravity.z would be 0.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The accelerationIncludingGravity read-only property of the DeviceMotionEvent interface returns the\namount of acceleration recorded by the device, in meters per second squared (m/s²). Unlike DeviceMotionEvent.acceleration\nwhich compensates for the influence of gravity, its value is the sum of the acceleration\nof the device as induced by the user and an acceleration equal and opposite to that\ncaused by gravity. In other words, it measures the\ng-force. In practice, this value represents\nthe raw data measured by an accelerometer.\n

    This value is not typically as useful as DeviceMotionEvent.acceleration,\nbut may be the only value available on devices that aren't able to remove gravity from\nthe acceleration data, such as on devices that don't have a gyroscope.\n

    \n

    Note:\naccelerationIncludingGravity's name can be misleading. This property represents acceleration including the effects of gravity. For example, if a device is lying flat on a horizontal surface with the screen pointing up, gravity would be -9.8 along the Z axis, while acceleration.z would be 0 and accelerationIncludingGravity.z would be 9.8. Similarly, if a device is in free fall with its screen horizontal and pointing up, gravity would be -9.8 along the Z axis, while acceleration.z would be -9.8 and accelerationIncludingGravity.z would be 0.\n

    " }, "devicemotionevent.devicemotionevent": { "url": "$MDN_URL$/web/api/devicemotionevent/devicemotionevent", @@ -22245,7 +22428,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEvent() constructor creates a new DeviceMotionEvent object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEvent() constructor creates a new DeviceMotionEvent object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to devicemotion.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    acceleration Optional
    \n
    \n

    A DeviceMotionEventAcceleration object giving the acceleration of the device on the three axis X, Y and Z. Acceleration is expressed in m/s². If not specified, every properties in the object will be null.\n

    \n
    accelerationIncludingGravity Optional
    \n
    \n

    A DeviceMotionEventAcceleration object giving the acceleration of the device on the three axis X, Y and Z with the effect of gravity. Acceleration is expressed in m/s². If not specified, every properties in the object will be null.\n

    \n
    rotationRate Optional
    \n
    \n

    A DeviceMotionEventRotationRate object giving the rate of change of the device's orientation on the three orientation axis alpha, beta and gamma. Rotation rate is express in degrees per seconds. If not specified, every properties in the object will be null.\n

    \n
    interval Optional
    \n
    \n

    A number representing the interval of time, in milliseconds, at which data is obtained from the device. It defaults to 0.\n

    \n
    " @@ -22271,7 +22454,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The interval read-only property of the DeviceMotionEvent interface returns the interval, in milliseconds, at which data is obtained from the underlying\nhardware. You can use this to determine the granularity of motion events." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The interval read-only property of the DeviceMotionEvent interface returns the interval, in milliseconds, at which data is obtained from the underlying\nhardware. You can use this to determine the granularity of motion events." }, "devicemotionevent.rotationrate": { "url": "$MDN_URL$/web/api/devicemotionevent/rotationrate", @@ -22292,7 +22475,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The rotationRate read-only property of the DeviceMotionEvent interface returns the rate at which the device is rotating around each of its axes in degrees per\nsecond.\n

    \n

    Note:\nIf the hardware isn't capable of providing this\ninformation, this property returns null.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The rotationRate read-only property of the DeviceMotionEvent interface returns the rate at which the device is rotating around each of its axes in degrees per\nsecond.\n

    \n

    Note:\nIf the hardware isn't capable of providing this\ninformation, this property returns null.\n

    " }, "devicemotioneventacceleration": { "url": "$MDN_URL$/web/api/devicemotioneventacceleration", @@ -22311,7 +22494,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEventAcceleration interface of the Device Orientation Events provides information about the amount of acceleration the device is experiencing along all three axes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceMotionEventAcceleration interface of the Device Orientation Events provides information about the amount of acceleration the device is experiencing along all three axes." }, "devicemotioneventacceleration.x": { "url": "$MDN_URL$/web/api/devicemotioneventacceleration/x", @@ -22330,7 +22513,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The x read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the X\naxis in a DeviceMotionEventAcceleration\nobject." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The x read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the X\naxis in a DeviceMotionEventAcceleration\nobject." }, "devicemotioneventacceleration.y": { "url": "$MDN_URL$/web/api/devicemotioneventacceleration/y", @@ -22349,7 +22532,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The y read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the Y\naxis in a DeviceMotionEventAcceleration\nobject." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The y read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the Y\naxis in a DeviceMotionEventAcceleration\nobject." }, "devicemotioneventacceleration.z": { "url": "$MDN_URL$/web/api/devicemotioneventacceleration/z", @@ -22368,7 +22551,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The z read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the Z\naxis in a DeviceMotionEventAcceleration\nobject." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The z read-only property of the DeviceMotionEventAcceleration interface indicates the amount of acceleration that occurred along the Z\naxis in a DeviceMotionEventAcceleration\nobject." }, "devicemotioneventrotationrate": { "url": "$MDN_URL$/web/api/devicemotioneventrotationrate", @@ -22387,7 +22570,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A DeviceMotionEventRotationRate interface of the Device Orientation Events provides information about the rate at which the device is rotating around all three axes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A DeviceMotionEventRotationRate interface of the Device Orientation Events provides information about the rate at which the device is rotating around all three axes." }, "devicemotioneventrotationrate.alpha": { "url": "$MDN_URL$/web/api/devicemotioneventrotationrate/alpha", @@ -22406,7 +22589,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The alpha read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the Z axis, in degrees per second." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The alpha read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the Z axis, in degrees per second." }, "devicemotioneventrotationrate.beta": { "url": "$MDN_URL$/web/api/devicemotioneventrotationrate/beta", @@ -22425,7 +22608,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The beta read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the X axis, in degrees per second." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The beta read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the X axis, in degrees per second." }, "devicemotioneventrotationrate.gamma": { "url": "$MDN_URL$/web/api/devicemotioneventrotationrate/gamma", @@ -22444,7 +22627,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The gamma read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the Y axis, in degrees per second." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The gamma read-only property of the DeviceMotionEventRotationRate interface indicates the rate of rotation around the Y axis, in degrees per second." }, "deviceorientationevent": { "url": "$MDN_URL$/web/api/deviceorientationevent", @@ -22465,7 +22648,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceOrientationEvent interface of the Device Orientation Events provides web developers with information from the physical orientation of the device running the web page." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceOrientationEvent interface of the Device Orientation Events provides web developers with information from the physical orientation of the device running the web page." }, "deviceorientationevent.absolute": { "url": "$MDN_URL$/web/api/deviceorientationevent/absolute", @@ -22484,7 +22667,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The absolute read-only property of the DeviceOrientationEvent interface indicates whether or not the device is providing orientation data absolutely (that is,\nin reference to the Earth's coordinate frame) or using some arbitrary frame determined\nby the device.\nSee Orientation and motion data explained for details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The absolute read-only property of the DeviceOrientationEvent interface indicates whether or not the device is providing orientation data absolutely (that is,\nin reference to the Earth's coordinate frame) or using some arbitrary frame determined\nby the device.\nSee Orientation and motion data explained for details." }, "deviceorientationevent.alpha": { "url": "$MDN_URL$/web/api/deviceorientationevent/alpha", @@ -22505,7 +22688,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The alpha read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the Z axis; that is, the number of degrees by\nwhich the device is being twisted around the center of the screen.\nSee Orientation and motion data explained for details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The alpha read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the Z axis; that is, the number of degrees by\nwhich the device is being twisted around the center of the screen.\nSee Orientation and motion data explained for details." }, "deviceorientationevent.beta": { "url": "$MDN_URL$/web/api/deviceorientationevent/beta", @@ -22526,7 +22709,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The beta read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the X axis; that is, the number of degrees,\nranged between -180 and 180, by which the device is tipped forward or backward.\nSee Orientation and motion data explained for details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The beta read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the X axis; that is, the number of degrees,\nranged between -180 and 180, by which the device is tipped forward or backward.\nSee Orientation and motion data explained for details." }, "deviceorientationevent.deviceorientationevent": { "url": "$MDN_URL$/web/api/deviceorientationevent/deviceorientationevent", @@ -22544,7 +22727,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceOrientationEvent() constructor creates a new DeviceOrientationEvent object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DeviceOrientationEvent() constructor creates a new DeviceOrientationEvent object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to deviceorientation or deviceorientationabsolute.\nIn the latter case, options.absolute is always true.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    alpha Optional
    \n
    \n

    A number representing the motion of the device around the z axis,\nexpressed in degrees with values ranging from 0 to 360.\nIt defaults to null.\n

    \n
    beta Optional
    \n
    \n

    A number representing the motion of the device around the x axis,\nexpressed in degrees with values ranging from -180 to 180.\nThis represents a front to back motion of the device.\nIt defaults to null.\n

    \n
    gamma Optional
    \n
    \n

    A number representing the motion of the device around the y axis,\nexpressed in degrees with values ranging from -90 to 90.\nThis represents a left to right motion of the device.\nIt defaults to null.\n

    \n
    absolute
    \n
    \n

    A boolean value that indicates whether or not the device is providing orientation data absolutely.\nIt defaults to false.\n

    \n
    " @@ -22570,7 +22753,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The gamma read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the Y axis; that is, the number of degrees,\nranged between -90 and 90, by which the device is tilted left\nor right.\nSee Orientation and motion data explained for details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The gamma read-only property of the DeviceOrientationEvent interface returns the rotation of the device around the Y axis; that is, the number of degrees,\nranged between -90 and 90, by which the device is tilted left\nor right.\nSee Orientation and motion data explained for details." }, "deviceposture": { "url": "$MDN_URL$/web/api/deviceposture", @@ -22666,6 +22849,22 @@ }, "doc": "The activeElement read-only property of the Document interface returns the Element within the DOM that is receiving keyboard events such as keydown and keyup. This is usually analogous to the focused element.\n

    Which elements are focusable varies depending on the platform and the browser's current configuration. For example, on Safari, following the behavior of macOS, elements that aren't text input elements are not focusable by default, unless the \"Full Keyboard Access\" setting is enabled in System Settings.\n

    Typically a user can press the Tab key to move the focus around the page among focusable elements, and use keyboard gestures such as Space or Enter to simulate clicks on the focused element.\n

    \n

    Note:\nFocus (which element is receiving user input events) is not the same thing as selection (the currently highlighted part of the document). You can get the current selection using window.getSelection().\n

    " }, + "document.activeviewtransition": { + "url": "$MDN_URL$/web/api/document/activeviewtransition", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142", + "Firefox": "147", + "FirefoxAndroid": "147", + "Safari": "26.2", + "SafariIOS": "26.2" + }, + "doc": "The activeViewTransition read-only property of the Document interface returns a ViewTransition instance representing the view transition currently active on the document.\n

    The current ViewTransition can be accessed in other ways:\n

    \n

    However, the activeViewTransition property provides a consistent way to access the active view transition in any context, without having to worry about saving it for easy access later on." + }, "document.adoptedstylesheets": { "url": "$MDN_URL$/web/api/document/adoptedstylesheets", "status": [ @@ -22686,7 +22885,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The adoptedStyleSheets property of the Document interface is used for setting an array of constructed stylesheets to be used by the document.\n

    \n

    Note:\nA constructed stylesheet is a stylesheet created programmatically using the CSSStyleSheet() constructor (as compared to one created by a user-agent when importing a stylesheet from a script, imported using <style> and @import, or linked to via <link>).\n

    \n

    The same constructed stylesheets can also be shared with one or more ShadowRoot instances using the ShadowRoot.adoptedStyleSheets property.\nChanging an adopted stylesheet will affect all the objects that adopt it.\n

    Stylesheets in the property are evaluated along with the document's other stylesheets using the CSS cascade algorithm.\nWhere the resolution of rules considers stylesheet order, adoptedStyleSheets are assumed to be ordered after those in Document.styleSheets.\n

    Only stylesheets created using the CSSStyleSheet() constructor within the context of the current Document may be adopted.", + "doc": "The adoptedStyleSheets property of the Document interface is used for setting an array of constructed stylesheets to be used by the document.\n

    \n

    Note:\nA constructed stylesheet is a stylesheet created programmatically using the CSSStyleSheet() constructor (as compared to one created by a user-agent when importing a stylesheet from a script, imported using <style> and @import, or linked to via <link>).\n

    \n

    The same constructed stylesheets can also be shared with one or more ShadowRoot instances using the ShadowRoot.adoptedStyleSheets property.\nChanging an adopted stylesheet will affect all the objects that adopt it.\n

    Stylesheets in the property are evaluated along with the document's other stylesheets using the CSS cascade algorithm.\nWhere the resolution of rules considers stylesheet order, adoptedStyleSheets are assumed to be ordered after those in Document.styleSheets.\n

    Only stylesheets created using the CSSStyleSheet() constructor within the context of the current Document may be adopted.", "throws": { "NotAllowedError DOMException": "One of the CSSStyleSheet instances in the array was not created using the CSSStyleSheet() constructor or was constructed in a different document than the current document, such as one in a frame." } @@ -22877,7 +23076,7 @@ "document.browsingtopics": { "url": "$MDN_URL$/web/api/document/browsingtopics", "status": [ - "Experimental" + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -22885,10 +23084,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n
    \n

    Warning:\nThis feature is currently opposed by two browser vendors. See the Standards positions section below for details of opposition.\n

    \n
    \n

    Note:\nAn Enrollment process is required to use this feature in your applications.\n

    \n

    The browsingTopics() method of the Document interface returns a promise that fulfills with an array of objects representing the top topics for the user, one from each of the last three epochs. These topics could then be returned to the ad tech platform in a subsequent fetch request. By default, the method also causes the browser to record the current page visit as observed by the caller, so the page's hostname can later be used in topics calculation.\n

    See Using the Topics API for more details.\n

    \n

    Note:\nbrowsingTopics() does not rely on HTTP headers to send topics and mark topics as observed like the other Topics API enabling features, but it is somewhat less performant. You are advised to use one of the HTTP header-using features, falling back to browsingTopics() only in situations where the headers cannot be modified.\n

    ", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n
    \n

    Warning:\nThis feature is currently opposed by two browser vendors. See the Standards positions section below for details of opposition.\n

    \n
    \n

    Note:\nAn Enrollment process is required to use this feature in your applications.\n

    \n

    The browsingTopics() method of the Document interface returns a promise that fulfills with an array of objects representing the top topics for the user, one from each of the last three epochs. These topics could then be returned to the ad tech platform in a subsequent fetch request. By default, the method also causes the browser to record the current page visit as observed by the caller, so the page's hostname can later be used in topics calculation.\n

    See Using the Topics API for more details.\n

    \n

    Note:\nbrowsingTopics() does not rely on HTTP headers to send topics and mark topics as observed like the other Topics API enabling features, but it is somewhat less performant. You are advised to use one of the HTTP header-using features, falling back to browsingTopics() only in situations where the headers cannot be modified.\n

    ", "parameters": { "options": "An options object, which can contain the following properties:\n
    \n
    skipObservation
    \n
    \n

    A boolean value that, if set to true, causes the browser to not observe topics when browsingTopics() is invoked. The default is false, which causes topics to be observed.\n

    \n
    " }, @@ -22908,10 +23104,13 @@ "Edge": "128", "Firefox": "20", "FirefoxAndroid": "20", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The caretPositionFromPoint() method of the Document interface returns a CaretPosition object, containing the DOM node, along with the caret and caret's character offset within that node.", "parameters": { @@ -23131,7 +23330,7 @@ "parameters": { "name": "A string containing the name of the attribute." }, - "returns": "A Attr node.", + "returns": "An Attr node.", "throws": { "InvalidCharacterError DOMException": "Thrown if the name value is not a valid XML name; for example, it starts with a number, hyphen, or period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods." } @@ -23451,7 +23650,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Document.createRange() method returns a new\nRange object.", + "doc": "The Document.createRange() method returns a new\nRange object whose start and end are offset 0 of the Document\nobject on which it was called.", "returns": "The created Range object." }, "document.createtextnode": { @@ -23505,7 +23704,7 @@ "rotationAngle": "The value for Touch.rotationAngle.", "force": "The value for Touch.force." }, - "returns": "
    \n
    touch
    \n
    \n

    A Touch object configured as described by the input parameters.\n

    \n
    " + "returns": "A Touch object configured as described by the input parameters." }, "document.createtouchlist": { "url": "$MDN_URL$/web/api/document/createtouchlist", @@ -23520,7 +23719,7 @@ "parameters": { "touch1, …, touchN": "Zero or more Touch objects. Firefox also\naccepts an array of\nTouch objects." }, - "returns": "
    \n
    list
    \n
    \n

    A TouchList object containing the Touch objects\nspecified by the touches parameter.\n

    \n
    " + "returns": "A TouchList object containing the Touch objects specified by the touches parameter." }, "document.createtreewalker": { "url": "$MDN_URL$/web/api/document/createtreewalker", @@ -23737,7 +23936,7 @@ "Safari": "", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The domain property of the Document\ninterface gets/sets the domain portion of the origin of the current\ndocument, as used by the same-origin policy.", + "doc": "

    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.

    \n

    The domain property of the Document\ninterface gets/sets the domain portion of the origin of the current\ndocument, as used by the same-origin policy.", "throws": { "SecurityError DOMException": "The document is forbidden from setting its domain, for example it is sandboxed or has an opaque origin. See Failures section for details." } @@ -23762,7 +23961,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The elementFromPoint()\nmethod, available on the Document object, returns the topmost Element at the specified coordinates\n(relative to the viewport).\n

    If the element at the specified point belongs to another document (for example, the\ndocument of an <iframe>), that document's parent element is returned\n(the <iframe> itself). If the element at the given point is anonymous\nor XBL generated content, such as a textbox's scroll bars, then the first non-anonymous\nancestor element (for example, the textbox) is returned.\n

    Elements with pointer-events set to none will be ignored,\nand the element below it will be returned.\n

    If the method is run on another document (like an <iframe>'s\nsubdocument), the coordinates are relative to the document where the method is being\ncalled.\n

    If the specified point is outside the visible bounds of the document or either\ncoordinate is negative, the result is null.\n

    If you need to find the specific position inside the element, use\nDocument.caretPositionFromPoint().", + "doc": "The elementFromPoint()\nmethod, available on the Document object, returns the topmost Element at the specified coordinates\n(relative to the viewport).\n

    If the element at the specified point belongs to another document (for example, the\ndocument of an <iframe>), that document's parent element is returned\n(the <iframe> itself). If the element at the given point is anonymous\nor XBL generated content, such as a textbox's scroll bars, then the first non-anonymous\nancestor element (for example, the textbox) is returned.\n

    Elements with pointer-events set to none will be ignored,\nand the element below it will be returned.\n

    If the method is run on another document (like an <iframe>'s\nsubdocument), the coordinates are relative to the document where the method is being\ncalled.\n

    If the specified point is outside the visible bounds of the document or either\ncoordinate is negative, the result is null.\n

    If you need to find the specific position inside the element, use\nDocument.caretPositionFromPoint().", "parameters": { "x": "The horizontal coordinate of a point, relative to the left edge of the current\nviewport.", "y": "The vertical coordinate of a point, relative to the top edge of the current\nviewport." @@ -23881,7 +24080,7 @@ }, "doc": "

    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.

    \n
    \n

    Note:\nAlthough the execCommand() method is deprecated, there are still some valid use cases that do not yet have viable alternatives. For example, unlike direct DOM manipulation, modifications performed by execCommand() preserve the undo buffer (edit history). For these use cases, you can still use this method, but test to ensure cross-browser compatibility, such as by using document.queryCommandSupported().\n

    \n

    The execCommand method implements multiple different commands. Some of them provide access to the clipboard, while others are for editing form inputs, contenteditable elements or entire documents (when switched to design mode).\n

    To access the clipboard, the newer Clipboard API is recommended over execCommand().\n

    Most commands affect the document's selection. For example, some commands (bold, italics, etc.) format the currently selected text, while others delete the selection, insert new elements (replacing the selection) or affect an entire line (indenting). Only the currently active editable element can be modified, but some commands (e.g., copy) can work without an editable element.\n

    \n

    Note:\nModifications performed by execCommand() may or may not trigger beforeinput and input events, depending on the browser and configuration. If triggered, the handlers for the events will run before execCommand() returns. Authors need to be careful about such recursive calls, especially if they call execCommand() in response to these events. From Firefox 82, nested execCommand() calls will always fail, see bug 1634262.\n

    ", "parameters": { - "commandName": "A string specifying the name of the command to execute. The following commands are specified:\n
    \n
    backColor
    \n
    \n

    Changes the document background color. In styleWithCss mode, it affects the background color of the containing block instead. This requires a <color> value string to be passed in as a value argument.\n

    \n
    bold
    \n
    \n

    Toggles bold on/off for the selection or at the insertion point.\n

    \n
    contentReadOnly
    \n
    \n

    Makes the content document either read-only or editable. This requires a boolean true/false as the value argument.\n

    \n
    copy
    \n
    \n

    Copies the current selection to the clipboard. Conditions of having this behavior enabled vary from one browser to another, and have evolved over time. Check the compatibility table to determine if you can use it in your case.\n

    \n
    createLink
    \n
    \n

    Creates an hyperlink from the selection, but only if there is a selection. Requires a URI string as a value argument for the hyperlink's href. The URI must contain at least a single character, which may be whitespace.\n

    \n
    cut
    \n
    \n

    Removes the current selection and copies it to the clipboard. When this behavior is enabled varies between browsers, and its conditions have evolved over time. Check the compatibility table for usage details.\n

    \n
    decreaseFontSize
    \n
    \n

    Adds a <small> tag around the selection or at the insertion point.\n

    \n
    defaultParagraphSeparator
    \n
    \n

    Changes the paragraph separator used when new paragraphs are created in editable text regions.\n

    \n
    delete
    \n
    \n

    Deletes the current selection.\n

    \n
    enableAbsolutePositionEditor
    \n
    \n

    Enables or disables the grabber that allows absolutely-positioned elements to be moved around. The grabber is disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    enableInlineTableEditing
    \n
    \n

    Enables or disables the table row/column insertion and deletion controls. The controls are disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    enableObjectResizing
    \n
    \n

    Enables or disables the resize handles on images, tables, and absolutely-positioned elements and other resizable objects. The handles are disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    fontName
    \n
    \n

    Changes the font name for the selection or at the insertion point. This requires a font name string (like \"Arial\") as a value argument.\n

    \n
    fontSize
    \n
    \n

    Changes the font size for the selection or at the insertion point. This requires an integer from 1 - 7 as a value argument.\n

    \n
    foreColor
    \n
    \n

    Changes a font color for the selection or at the insertion point. This requires a hexadecimal color value string as a value argument.\n

    \n
    formatBlock
    \n
    \n

    Adds an HTML block-level element around the line containing the current selection, replacing the block element containing the line if one exists (in Firefox, <blockquote> is the exception — it will wrap any containing block element). Requires a tag-name string as a value argument. Virtually all block-level elements can be used. (Legacy Edge only supports heading tags H1 – H6, ADDRESS, and PRE, which must be wrapped in angle brackets, such as \"<H1>\".)\n

    \n
    forwardDelete
    \n
    \n

    Deletes the character ahead of the cursor's position, identical to hitting the Delete key on a Windows keyboard.\n

    \n
    heading
    \n
    \n

    Adds a heading element around a selection or insertion point line. Requires the tag-name string as a value argument (i.e., \"H1\", \"H6\"). (Not supported by Safari.)\n

    \n
    highlightColor
    \n
    \n

    Changes the background color for the selection or at the insertion point. Requires a color value string as a value argument. useCSS must be true for this to function.\n

    \n
    increaseFontSize
    \n
    \n

    Adds a <big> tag around the selection or at the insertion point.\n

    \n
    indent
    \n
    \n

    Indents the line containing the selection or insertion point. In Firefox, if the selection spans multiple lines at different levels of indentation, only the least indented lines in the selection will be indented.\n

    \n
    insertBrOnReturn
    \n
    \n

    Controls whether the Enter key inserts a <br> element, or splits the current block element into two.\n

    \n
    insertHorizontalRule
    \n
    \n

    Inserts a <hr> element at the insertion point, or replaces the selection with it.\n

    \n
    insertHTML
    \n
    \n

    Inserts an HTML string at the insertion point (deletes selection). Requires a valid HTML string as a value argument.\n

    \n
    insertImage
    \n
    \n

    Inserts an image at the insertion point (deletes selection). Requires a URL string for the image's src as a value argument. The requirements for this string are the same as createLink.\n

    \n
    insertOrderedList
    \n
    \n

    Creates a numbered ordered list for the selection or at the insertion point.\n

    \n
    insertUnorderedList
    \n
    \n

    Creates a bulleted unordered list for the selection or at the insertion point.\n

    \n
    insertParagraph
    \n
    \n

    Inserts a paragraph around the selection or the current line.\n

    \n
    insertText
    \n
    \n

    Inserts the given plain text at the insertion point (deletes selection).\n

    \n
    italic
    \n
    \n

    Toggles italics on/off for the selection or at the insertion point.\n

    \n
    justifyCenter
    \n
    \n

    Centers the selection or insertion point.\n

    \n
    justifyFull
    \n
    \n

    Justifies the selection or insertion point.\n

    \n
    justifyLeft
    \n
    \n

    Justifies the selection or insertion point to the left.\n

    \n
    justifyRight
    \n
    \n

    Right-justifies the selection or the insertion point.\n

    \n
    outdent
    \n
    \n

    Outdents the line containing the selection or insertion point.\n

    \n
    paste
    \n
    \n

    Pastes the clipboard contents at the insertion point (replaces current selection). Disabled for web content.\n

    \n
    redo
    \n
    \n

    Redoes the previous undo command.\n

    \n
    removeFormat
    \n
    \n

    Removes all formatting from the current selection.\n

    \n
    selectAll
    \n
    \n

    Selects all of the content of the editable region.\n

    \n
    strikeThrough
    \n
    \n

    Toggles strikethrough on/off for the selection or at the insertion point.\n

    \n
    subscript
    \n
    \n

    Toggles subscript on/off for the selection or at the insertion point.\n

    \n
    superscript
    \n
    \n

    Toggles superscript on/off for the selection or at the insertion point.\n

    \n
    underline
    \n
    \n

    Toggles underline on/off for the selection or at the insertion point.\n

    \n
    undo
    \n
    \n

    Undoes the last executed command.\n

    \n
    unlink
    \n
    \n

    Removes the anchor element from a selected hyperlink.\n

    \n
    useCSS
    \n
    \n

    Toggles the use of HTML tags or CSS for the generated markup. Requires a boolean true/false as a value argument.\n

    \n

    Note:\nThis argument is logically backwards (i.e., use false to use CSS,\ntrue to use HTML). This has been deprecated in favor of styleWithCSS.\n

    \n
    \n
    styleWithCSS
    \n
    \n

    Replaces the useCSS command. true modifies/generates style attributes in markup, false generates presentational elements.\n

    \n
    AutoUrlDetect
    \n
    \n

    Changes the browser auto-link behavior.\n

    \n
    ", + "commandName": "A string specifying the name of the command to execute. The following commands are specified:\n
    \n
    backColor
    \n
    \n

    Changes the document background color. In styleWithCss mode, it affects the background color of the containing block instead. This requires a <color> value string to be passed in as a value argument.\n

    \n
    bold
    \n
    \n

    Toggles bold on/off for the selection or at the insertion point.\n

    \n
    contentReadOnly
    \n
    \n

    Makes the content document either read-only or editable. This requires a boolean true/false as the value argument.\n

    \n
    copy
    \n
    \n

    Copies the current selection to the clipboard. Conditions of having this behavior enabled vary from one browser to another, and have evolved over time. Check the compatibility table to determine if you can use it in your case.\n

    \n
    createLink
    \n
    \n

    Creates a hyperlink from the selection, but only if there is a selection. Requires a URI string as a value argument for the hyperlink's href. The URI must contain at least a single character, which may be whitespace.\n

    \n
    cut
    \n
    \n

    Removes the current selection and copies it to the clipboard. When this behavior is enabled varies between browsers, and its conditions have evolved over time. Check the compatibility table for usage details.\n

    \n
    decreaseFontSize
    \n
    \n

    Adds a <small> tag around the selection or at the insertion point.\n

    \n
    defaultParagraphSeparator
    \n
    \n

    Changes the paragraph separator used when new paragraphs are created in editable text regions.\n

    \n
    delete
    \n
    \n

    Deletes the current selection.\n

    \n
    enableAbsolutePositionEditor
    \n
    \n

    Enables or disables the grabber that allows absolutely-positioned elements to be moved around. The grabber is disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    enableInlineTableEditing
    \n
    \n

    Enables or disables the table row/column insertion and deletion controls. The controls are disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    enableObjectResizing
    \n
    \n

    Enables or disables the resize handles on images, tables, and absolutely-positioned elements and other resizable objects. The handles are disabled by default since Firefox 64 (Firefox bug 1490641).\n

    \n
    fontName
    \n
    \n

    Changes the font name for the selection or at the insertion point. This requires a font name string (like \"Arial\") as a value argument.\n

    \n
    fontSize
    \n
    \n

    Changes the font size for the selection or at the insertion point. This requires an integer from 1 - 7 as a value argument.\n

    \n
    foreColor
    \n
    \n

    Changes a font color for the selection or at the insertion point. This requires a hexadecimal color value string as a value argument.\n

    \n
    formatBlock
    \n
    \n

    Adds an HTML block-level element around the line containing the current selection, replacing the block element containing the line if one exists (in Firefox, <blockquote> is the exception — it will wrap any containing block element). Requires a tag-name string as a value argument. Virtually all block-level elements can be used. (Legacy Edge only supports heading tags H1 – H6, ADDRESS, and PRE, which must be wrapped in angle brackets, such as \"<H1>\".)\n

    \n
    forwardDelete
    \n
    \n

    Deletes the character ahead of the cursor's position, identical to hitting the Delete key on a Windows keyboard.\n

    \n
    heading
    \n
    \n

    Adds a heading element around a selection or insertion point line. Requires the tag-name string as a value argument (i.e., \"H1\", \"H6\"). (Not supported by Safari.)\n

    \n
    highlightColor
    \n
    \n

    Changes the background color for the selection or at the insertion point. Requires a color value string as a value argument. useCSS must be true for this to function.\n

    \n
    increaseFontSize
    \n
    \n

    Adds a <big> tag around the selection or at the insertion point.\n

    \n
    indent
    \n
    \n

    Indents the line containing the selection or insertion point. In Firefox, if the selection spans multiple lines at different levels of indentation, only the least indented lines in the selection will be indented.\n

    \n
    insertBrOnReturn
    \n
    \n

    Controls whether the Enter key inserts a <br> element, or splits the current block element into two.\n

    \n
    insertHorizontalRule
    \n
    \n

    Inserts a <hr> element at the insertion point, or replaces the selection with it.\n

    \n
    insertHTML
    \n
    \n

    Inserts an TrustedHTML instance or string of HTML markup at the insertion point (deletes selection).\nThis requires valid HTML markup.\n

    \n

    Warning:\nThe input is parsed as HTML and written into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee the Trusted Types API for more information.\n

    \n
    \n
    insertImage
    \n
    \n

    Inserts an image at the insertion point (deletes selection). Requires a URL string for the image's src as a value argument. The requirements for this string are the same as createLink.\n

    \n
    insertOrderedList
    \n
    \n

    Creates a numbered ordered list for the selection or at the insertion point.\n

    \n
    insertUnorderedList
    \n
    \n

    Creates a bulleted unordered list for the selection or at the insertion point.\n

    \n
    insertParagraph
    \n
    \n

    Inserts a paragraph around the selection or the current line.\n

    \n
    insertText
    \n
    \n

    Inserts the given plain text at the insertion point (deletes selection).\n

    \n
    italic
    \n
    \n

    Toggles italics on/off for the selection or at the insertion point.\n

    \n
    justifyCenter
    \n
    \n

    Centers the selection or insertion point.\n

    \n
    justifyFull
    \n
    \n

    Justifies the selection or insertion point.\n

    \n
    justifyLeft
    \n
    \n

    Justifies the selection or insertion point to the left.\n

    \n
    justifyRight
    \n
    \n

    Right-justifies the selection or the insertion point.\n

    \n
    outdent
    \n
    \n

    Outdents the line containing the selection or insertion point.\n

    \n
    paste
    \n
    \n

    Pastes the clipboard contents at the insertion point (replaces current selection). Disabled for web content.\n

    \n
    redo
    \n
    \n

    Redoes the previous undo command.\n

    \n
    removeFormat
    \n
    \n

    Removes all formatting from the current selection.\n

    \n
    selectAll
    \n
    \n

    Selects all of the content of the editable region.\n

    \n
    strikeThrough
    \n
    \n

    Toggles strikethrough on/off for the selection or at the insertion point.\n

    \n
    subscript
    \n
    \n

    Toggles subscript on/off for the selection or at the insertion point.\n

    \n
    superscript
    \n
    \n

    Toggles superscript on/off for the selection or at the insertion point.\n

    \n
    underline
    \n
    \n

    Toggles underline on/off for the selection or at the insertion point.\n

    \n
    undo
    \n
    \n

    Undoes the last executed command.\n

    \n
    unlink
    \n
    \n

    Removes the anchor element from a selected hyperlink.\n

    \n
    useCSS
    \n
    \n

    Toggles the use of HTML tags or CSS for the generated markup. Requires a boolean true/false as a value argument.\n

    \n

    Note:\nThis argument is logically backwards (i.e., use false to use CSS,\ntrue to use HTML). This has been deprecated in favor of styleWithCSS.\n

    \n
    \n
    styleWithCSS
    \n
    \n

    Replaces the useCSS command. true modifies/generates style attributes in markup, false generates presentational elements.\n

    \n
    AutoUrlDetect
    \n
    \n

    Changes the browser auto-link behavior.\n

    \n
    ", "showDefaultUI": "A boolean value indicating whether the default user interface should be shown. This is not implemented in Mozilla.", "valueArgument": "For commands which require an input argument, is a string providing that information. For example, insertImage requires the URL of the image to insert. Specify null if no argument is needed." }, @@ -24142,7 +24341,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The getAnimations() method of the Document interface\nreturns an array of all Animation objects currently in effect whose\ntarget elements are descendants of the document. This array includes CSS Animations, CSS Transitions, and Web Animations.", + "doc": "The getAnimations() method of the Document interface\nreturns an array of all Animation objects currently in effect whose\ntarget elements are descendants of the document. This array includes CSS Animations, CSS Transitions, and Web Animations.", "returns": "An Array of Animation objects, each representing one\nanimation currently associated with elements which are descendants of the\nDocument on which it's called." }, "document.getelementbyid": { @@ -24322,6 +24521,52 @@ "doc": "The hasFocus() method of the Document interface returns a boolean value indicating whether the document or any element inside the document has focus.\nThis method can be used to determine whether the active element in a document has focus.\n
    \n

    Note:\nWhen viewing a document, an element with focus is always the active element in the document, but an active element does not necessarily have focus.\nFor example, an active element within a popup window that is not the foreground doesn't have focus.\n

    ", "returns": "false if the active element in the document has no focus;\ntrue if the active element in the document has focus." }, + "document.hasprivatetoken": { + "url": "$MDN_URL$/web/api/document/hasprivatetoken", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", + "Opera": "103" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hasPrivateToken() method of the Document interface returns a promise that fulfills with a boolean indicating whether the browser has a private state token stored from a particular issuer server.", + "parameters": { + "issuer": "A string representing the URL of an issuer server." + }, + "returns": "A Promise that resolves with a boolean value indicating whether the browser has a private state token stored from the specified issuer server.", + "throws": { + "InvalidStateError DOMException": "Thrown if the current Document is not yet active.", + "NotAllowedError DOMException": "Thrown if:\n

    ", + "TypeError DOMException": "Thrown if issuer is not a valid URL." + } + }, + "document.hasredemptionrecord": { + "url": "$MDN_URL$/web/api/document/hasredemptionrecord", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", + "Opera": "103" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hasRedemptionRecord() method of the Document interface returns a promise that fulfills with a boolean indicating whether the browser has a redemption record originating from a particular issuer.", + "parameters": { + "issuer": "A string representing the URL of an issuer server." + }, + "returns": "A Promise that resolves with a boolean value indicating whether the browser has a redemption record stored that originates from the specified issuer server.", + "throws": { + "InvalidStateError DOMException": "Thrown if the current Document is not yet active.", + "NotAllowedError DOMException": "Thrown if the current Document is not loaded in a secure context.", + "TypeError DOMException": "Thrown if issuer is not a valid URL." + } + }, "document.hasstorageaccess": { "url": "$MDN_URL$/web/api/document/hasstorageaccess", "status": [ @@ -24475,7 +24720,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Document object's importNode() method creates a copy of a\nNode or DocumentFragment from another document, to be\ninserted into the current document later.\n

    The imported node is not yet included in the document tree. To include it, you need to\ncall an insertion method such as appendChild() or\ninsertBefore() with a node that is\ncurrently in the document tree.\n

    Unlike document.adoptNode(), the original node is not removed from its\noriginal document. The imported node is a clone of the original.", + "doc": "The importNode() method of the Document interface creates a copy of a Node or DocumentFragment from another document, to be inserted into the current document later.\n

    The imported node is not yet included in the document tree. To include it, you need to call an insertion method such as appendChild() or insertBefore() with a node that is currently in the document tree.\n

    Unlike document.adoptNode(), the original node is not removed from its original document. The imported node is a clone of the original.\n

    The Node.cloneNode() method also creates a copy of a node. The difference is that importNode() clones the node in the context of the calling document, whereas cloneNode() uses the document of the node being cloned. The document context determines the CustomElementRegistry for constructing any custom elements. For this reason, to clone nodes to be used in another document, use importNode() on the target document. The HTMLTemplateElement.content is owned by a separate document, so it should also be cloned using document.importNode() so that custom element descendants are constructed using the definitions in the current document. See the Node.cloneNode() page's examples for more details.", "parameters": { "externalNode": "The external Node or DocumentFragment to import into\nthe current document.", "deep": "A boolean flag, whose default value is false,\nwhich controls whether to include the entire DOM subtree\nof the externalNode in the import.\n

    " @@ -24553,7 +24798,7 @@ "Safari": "11", "SafariIOS": "11" }, - "doc": "

    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.

    \n

    The Document.linkColor property gets/sets the color of\nlinks within the document.\n

    This property is deprecated. As an alternative, you can set the CSS\ncolor property on either HTML anchor links (<a>) or on\n:link pseudo-classes." + "doc": "

    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.

    \n

    The Document.linkColor property gets/sets the color of\nlinks within the document.\n

    This property is deprecated. As an alternative, you can set the CSS\ncolor property on either HTML anchor links (<a>) or on\n:link pseudo-classes." }, "document.links": { "url": "$MDN_URL$/web/api/document/links", @@ -24597,7 +24842,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Document.location read-only property returns a\nLocation object, which contains information about the URL of the document\nand provides methods for changing that URL and loading another URL.\n

    Though Document.location is a read-only Location\nobject, you can also assign a string to it. This means that you can\nwork with document.location as if it were a string in most cases:\ndocument.location = 'http://www.example.com' is a synonym of\ndocument.location.href = 'http://www.example.com'. If you assign another\nstring to it, browser will load the website you assigned.\n

    To retrieve just the URL as a string, the read-only document.URL\nproperty can also be used.\n

    If the current document is not in a browsing context, the returned value is\nnull." + "doc": "The read-only location property of the Document interface returns a Location object, which contains information about the URL of the document and provides methods for changing that URL and loading another URL.\n

    To retrieve just the URL as a string, the read-only document.URL\nproperty can also be used." }, "document.movebefore": { "url": "$MDN_URL$/web/api/document/movebefore", @@ -24635,7 +24880,7 @@ }, "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The Document.mozSetImageElement() method changes the\nelement being used as the CSS background for a background with a given background\nelement ID.", "parameters": { - "imageElementId": "A string indicating the name of an element that has\nbeen specified as a background image using the -moz-element CSS\nfunction.", + "imageElementId": "A string indicating the name of an element that has\nbeen specified as a background image using the -moz-element CSS\nfunction.", "imageElement": "The new element to use as the background corresponding\nto that image element string. Specify null to remove the background\nelement." }, "returns": "None (undefined)." @@ -24661,20 +24906,23 @@ "document.parsehtml": { "url": "$MDN_URL$/web/api/document/parsehtml_static", "status": [ + "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Firefox": "preview" + }, "baseline": { "level": "NONE" }, - "doc": "The parseHTML() static method of the Document object provides an XSS-safe method to parse and sanitize a string of HTML in order to create a new Document instance.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The parseHTML() static method of the Document object provides an XSS-safe method to parse and sanitize a string of HTML in order to create a new Document instance.", "parameters": { "input": "A string defining HTML to be sanitized and injected into the shadow root.", "options": "An options object with the following optional parameters:\n

    \n
    sanitizer
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed, or the string \"default\" for the default sanitizer configuration.\nNote that generally a \"Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to reused.\nIf not specified, the XSS-safe default sanitizer configuration is used.\n

    \n
    " }, "returns": "A Document.", "throws": { - "TypeError": "This is thrown if options.sanitizer is passed a:\n" + "TypeError": "This is thrown if options.sanitizer is passed a:\n" } }, "document.parsehtmlunsafe": { @@ -24696,14 +24944,14 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nDocument.parseHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The parseHTMLUnsafe() static method of the Document object is used to parse HTML input, optionally filtering unwanted HTML elements and attributes, in order to create a new Document instance.", + "doc": "

    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nDocument.parseHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The parseHTMLUnsafe() static method of the Document object is used to parse HTML input, optionally filtering unwanted HTML elements and attributes, in order to create a new Document instance.", "parameters": { "input": "A TrustedHTML or string instance defining HTML to be parsed.", "options": "An options object with the following optional parameters:\n

    \n
    sanitizer Optional
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed.\nThis can also be a string with the value \"default\", which applies a Sanitizer with the default (XSS-safe) configuration.\nIf not specified, no sanitizer is used.\n

    Note that generally a Sanitizer is expected than the to be more efficient than a SanitizerConfig if the configuration is to reused.\n

    \n
    " }, "returns": "A Document.", "throws": { - "TypeError": "This is thrown if:\n" + "TypeError": "This is thrown if:\n" } }, "document.pictureinpictureelement": { @@ -24922,11 +25170,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Document method querySelector()\nreturns the first Element within the document that matches the specified\nCSS selector, or group of CSS selectors. If no matches are found, null is returned.\n

    The matching is done using depth-first pre-order traversal of the document's nodes starting with the first element in the document's markup and iterating through sequential nodes by order of the number of child nodes.\n

    If the specified selector matches an ID that is incorrectly used more than once in the\ndocument, the first element with that ID is returned.\n

    CSS pseudo-elements will never return any elements.", + "doc": "The Document method querySelector()\nreturns the first Element within the document that matches the specified\nCSS selector, or group of CSS selectors. If no matches are found, null is returned.\n

    The matching is done using depth-first pre-order traversal of the document's nodes starting with the first element in the document's markup and iterating through sequential nodes by order of the number of child nodes.\n

    If the specified selector matches an ID that is incorrectly used more than once in the\ndocument, the first element with that ID is returned.\n

    CSS pseudo-elements will never return any elements.", "parameters": { - "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." + "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." }, - "returns": "An Element object representing the first element in the document\nthat matches the specified set of CSS selectors, or null is returned if there are no matches.\n

    If you need a list of all elements matching the specified selectors, you should use\nquerySelectorAll() instead.", + "returns": "An Element object representing the first element in the document\nthat matches the specified set of CSS selectors, or null is returned if there are no matches.\n

    If you need a list of all elements matching the specified selectors, you should use\nquerySelectorAll() instead.", "throws": { "SyntaxError DOMException": "Thrown if the syntax of the specified selectors is invalid." } @@ -24953,9 +25201,9 @@ }, "doc": "The Document method querySelectorAll()\nreturns a static (not live) NodeList representing a list of the\ndocument's elements that match the specified group of selectors.", "parameters": { - "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." + "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." }, - "returns": "A non-live NodeList containing one Element object for\neach element that matches at least one of the specified selectors or an empty\nNodeList in case of no matches. The elements are in document order — that is, parents before children, earlier siblings before later siblings.\n

    \n

    Note:\nIf the specified selectors include a CSS pseudo-element, the returned list\nis always empty.\n

    ", + "returns": "A non-live NodeList containing one Element object for\neach element that matches at least one of the specified selectors or an empty\nNodeList in case of no matches. The elements are in document order — that is, parents before children, earlier siblings before later siblings.\n
    \n

    Note:\nIf the specified selectors include a CSS pseudo-element, the returned list\nis always empty.\n

    ", "throws": { "SyntaxError DOMException": "Thrown if the syntax of the specified selectors string is not valid." } @@ -25061,14 +25309,14 @@ "level": "LOW", "lowDate": "2023-12-05" }, - "doc": "The requestStorageAccess() method of the Document interface allows content loaded in a third-party context (i.e., embedded in an <iframe>) to request access to third-party cookies and unpartitioned state. This is relevant to user agents that, by default, block access to third-party, unpartitioned cookies to improve privacy (e.g., to prevent tracking), and is part of the Storage Access API.\n

    To check whether permission to access third-party cookies has already been granted, you can call Permissions.query(), specifying the feature name \"storage-access\".\n

    \n

    Note:\nUsage of this feature may be blocked by a storage-access Permissions Policy set on your server. In addition, the document must pass additional browser-specific checks such as allowlists, blocklists, on-device classification, user settings, anti-clickjacking heuristics, or prompting the user for explicit permission.\n

    ", + "doc": "The requestStorageAccess() method of the Document interface allows content loaded in a third-party context (i.e., embedded in an <iframe>) to request access to third-party cookies and unpartitioned state.\nThis is relevant to user agents that, by default, block access to third-party, unpartitioned cookies to improve privacy (e.g., to prevent tracking), and is part of the Storage Access API.\n

    To check whether permission to access third-party cookies has already been granted, you can call Permissions.query(), specifying the feature name \"storage-access\".\n

    After an embed has activated storage-access permission via requestStorageAccess(), it should reload itself.\nThe browser will re-request the resource with third-party unpartitioned cookies included, and make them available to the embedded resource once it has loaded.\n

    Third-party cookies are sent only with requests to the embedded resource's exact origin.\nOther origins within the same site that wish to access their third-party cookies will need to activate the granted storage-access permission.\nThe storage access headers should be used for activating a granted storage-access permission.\nNote that the headers can activate a granted permission for any embedded resource, such as credentialed images, not just code embedded in an <iframe>.\n

    It is also possible to activate a granted permission for a cross-origin, same-site endpoint by calling requestStorageAccess() (this time without the requirement for transient activation).\nHowever, this only works to activate permission for embedded code.\nIt is also less efficient than using the headers, because the resource needs to be loaded in order to activate the permission.\n

    \n

    Note:\nUsage of this feature may be blocked by a storage-access Permissions Policy set on your server. In addition, the document must pass additional browser-specific checks such as allowlists, blocklists, on-device classification, user settings, anti-clickjacking heuristics, or prompting the user for explicit permission.\n

    ", "parameters": { "types": "An object containing properties that control what unpartitioned state is made accessible. If not specified, the default value of the property is false. Available properties are as follows:\n
    \n
    all
    \n
    \n

    A boolean specifying all possible unpartitioned states should be made accessible.\n

    \n
    cookies
    \n
    \n

    A boolean specifying third-party cookies should be made accessible.\n

    \n
    sessionStorage
    \n
    \n

    A boolean specifying StorageAccessHandle.sessionStorage should be made accessible.\n

    \n
    localStorage
    \n
    \n

    A boolean specifying StorageAccessHandle.localStorage should be made accessible.\n

    \n
    indexedDB
    \n
    \n

    A boolean specifying StorageAccessHandle.indexedDB should be made accessible.\n

    \n
    locks
    \n
    \n

    A boolean specifying StorageAccessHandle.locks should be made accessible.\n

    \n
    caches
    \n
    \n

    A boolean specifying StorageAccessHandle.caches should be made accessible.\n

    \n
    getDirectory
    \n
    \n

    A boolean specifying StorageAccessHandle.getDirectory() should be made accessible.\n

    \n
    estimate
    \n
    \n

    A boolean specifying StorageAccessHandle.estimate() should be made accessible.\n

    \n
    createObjectURL
    \n
    \n

    A boolean specifying StorageAccessHandle.createObjectURL() should be made accessible.\n

    \n
    revokeObjectURL
    \n
    \n

    A boolean specifying StorageAccessHandle.revokeObjectURL() should be made accessible.\n

    \n
    BroadcastChannel
    \n
    \n

    A boolean specifying StorageAccessHandle.BroadcastChannel() should be made accessible.\n

    \n
    SharedWorker
    \n
    \n

    A boolean specifying StorageAccessHandle.SharedWorker() should be made accessible.\n

    \n
    " }, "returns": "A Promise that fulfills with undefined if the access to third-party cookies was granted and no types parameter was provided, fulfills with StorageAccessHandle if the access to unpartitioned state requested by the types parameter was provided, and rejects if access was denied.\n

    requestStorageAccess() requests are automatically denied unless the embedded content is currently processing a user gesture such as a tap or click (transient activation), or unless permission was already granted previously. If permission was not previously granted, they need to be run inside a user gesture-based event handler. The user gesture behavior depends on the state of the promise:\n

    ", "throws": { "InvalidStateError DOMException": "Thrown if:\n", - "NotAllowedError DOMException": "Thrown if:\n" + "NotAllowedError DOMException": "Thrown if:\n" } }, "document.requeststorageaccessfor": { @@ -25083,9 +25331,6 @@ "Edge": "119", "Opera": "105" }, - "baseline": { - "level": "NONE" - }, "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestStorageAccessFor() method of the Document interface allows top-level sites to request third-party cookie access on behalf of embedded content originating from another site in the same related website set. It returns a Promise that resolves if the access was granted, and rejects if access was denied.", "parameters": { "requestedOrigin": "A string representing the URL of the origin you are requesting third-party cookie access for." @@ -25093,7 +25338,7 @@ "returns": "A Promise that fulfills with undefined if the access to third-party cookies was granted and rejects if access was denied.\n

    requestStorageAccessFor() requests are automatically denied unless the top-level content is currently processing a user gesture such as a tap or click (transient activation), or unless permission was already granted previously. If permission was not previously granted, they must run inside a user gesture-based event handler. The user gesture behavior depends on the state of the promise:\n

    ", "throws": { "InvalidStateError DOMException": "Thrown if the current Document is not yet active.", - "NotAllowedError DOMException": "Thrown if:\n", + "NotAllowedError DOMException": "Thrown if:\n", "TypeError": "Thrown if requestedOrigin is not a valid URL." } }, @@ -25192,7 +25437,7 @@ "doc": "The startViewTransition() method of the Document interface starts a new same-document (SPA) view transition and returns a ViewTransition object to represent it.\n

    When startViewTransition() is invoked, a sequence of steps is followed as explained in The view transition process.", "parameters": { "updateCallback": "An optional callback function typically invoked to update the DOM during the SPA view transition process, which returns a Promise. The callback is invoked once the API has taken a snapshot of the current page. When the promise returned by the callback fulfills, the view transition begins in the next frame. If the promise returned by the callback rejects, the transition is abandoned.", - "options": "An object containing options to configure the view transition. It can include the following properties:\n

    \n
    update Optional
    \n
    \n

    The same updateCallback function described above. Defaults to null.\n

    \n
    types Optional
    \n
    \n

    An array of strings. These strings act as class names or identifiers for the transition, allowing you to selectively apply CSS styles or run different JavaScript logic based on the type of transition occurring. Defaults to an empty sequence.\n

    \n
    " + "options": "An object containing options to configure the view transition. It can include the following properties:\n
    \n
    update Optional
    \n
    \n

    The same updateCallback function described above. Defaults to null.\n

    \n
    types Optional
    \n
    \n

    An array of strings representing the types applied to the view transition. View transition types enable selective application of CSS styles or JavaScript logic based on the type of transition occurring. Defaults to an empty sequence.\n

    \n
    " }, "returns": "A ViewTransition object instance." }, @@ -25351,7 +25596,7 @@ "Safari": "11", "SafariIOS": "11" }, - "doc": "

    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.

    \n
    \n

    Warning:\nUse of the document.write() method is strongly discouraged.\nAvoid using it, and where possible replace it in existing code.\n

    As the HTML spec itself warns:\n

    \n

    This method has very idiosyncratic behavior.\nIn some cases, this method can affect the state of the HTML parser while the parser is running, resulting in a DOM that does not correspond to the source of the document (e.g., if the string written is the string \"<plaintext>\" or \"<!--\").\nIn other cases, the call can clear the current page first, as if document.open() had been called.\nIn yet more cases, the method is simply ignored, or throws an exception. Users agents are explicitly allowed to avoid executing script elements inserted via this method.\nAnd to make matters even worse, the exact behavior of this method can in some cases be dependent on network latency, which can lead to failures that are very hard to debug.\nFor all these reasons, use of this method is strongly discouraged.\n

    \n
    \n
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The write() method of the Document interface writes text in one or more TrustedHTML or string parameters to a document stream opened by document.open().", + "doc": "

    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.

    \n
    \n

    Warning:\nUse of the document.write() method is strongly discouraged.\nAvoid using it, and where possible replace it in existing code.\n

    As the HTML spec itself warns:\n

    \n

    This method has very idiosyncratic behavior.\nIn some cases, this method can affect the state of the HTML parser while the parser is running, resulting in a DOM that does not correspond to the source of the document (e.g., if the string written is the string \"<plaintext>\" or \"<!--\").\nIn other cases, the call can clear the current page first, as if document.open() had been called.\nIn yet more cases, the method is simply ignored, or throws an exception. Users agents are explicitly allowed to avoid executing script elements inserted via this method.\nAnd to make matters even worse, the exact behavior of this method can in some cases be dependent on network latency, which can lead to failures that are very hard to debug.\nFor all these reasons, use of this method is strongly discouraged.\n

    \n
    \n
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The write() method of the Document interface writes text in one or more TrustedHTML or string parameters to a document stream opened by document.open().", "parameters": { "markup, …, markupN": "TrustedHTML objects or strings containing the markup to be written to the document." }, @@ -25688,7 +25933,7 @@ "parameters": { "selectors": "A string containing one or more CSS selectors separated by\ncommas." }, - "returns": "An Element object representing the first element in the document\nthat matches the specified set of CSS selectors, or null is returned if there are no matches." + "returns": "An Element object representing the first element in the document\nthat matches the specified set of CSS selectors, or null is returned if there are no matches." }, "documentfragment.queryselectorall": { "url": "$MDN_URL$/web/api/documentfragment/queryselectorall", @@ -25754,12 +25999,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPicture interface of the Document Picture-in-Picture API is the entry point for creating and handling document picture-in-picture windows.\n

    It is accessed via the Window.documentPictureInPicture property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPicture interface of the Document Picture-in-Picture API is the entry point for creating and handling document picture-in-picture windows.\n

    It is accessed via the Window.documentPictureInPicture property." }, "documentpictureinpicture.requestwindow": { "url": "$MDN_URL$/web/api/documentpictureinpicture/requestwindow", @@ -25770,12 +26016,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestWindow() method of the\nDocumentPictureInPicture interface opens the Picture-in-Picture window for the current main browsing context. It returns a Promise that fulfills with a Window instance representing the browsing context inside the Picture-in-Picture window.\n

    The requestWindow() method requires transient activation, i.e., it must be invoked in response to a user action such as a mouse click or button press.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestWindow() method of the\nDocumentPictureInPicture interface opens the Picture-in-Picture window for the current main browsing context. It returns a Promise that fulfills with a Window instance representing the browsing context inside the Picture-in-Picture window.\n

    The requestWindow() method requires transient activation, i.e., it must be invoked in response to a user action such as a mouse click or button press.", "parameters": { "options": "An options object containing the following properties:\n

    \n
    disallowReturnToOpener Optional
    \n
    \n

    A boolean value. When set to true, this option hints to the browser that it should not display a UI control that enables the user to return to the originating tab and close the Picture-in-Picture window. Defaults to false.\n

    For example, in Chrome's implementation of this feature, the provided UI control is a \"back to tab\" button in the Picture-in-Picture window's top bar:\n

    \n
    height Optional
    \n
    \n

    A non-negative number representing the height to set for the Picture-in-Picture window's viewport, in pixels. Defaults to 0.\n

    \n
    preferInitialWindowPlacement Optional
    \n
    \n

    A boolean value, which defaults to false. When set to true, it causes the Picture-in-Picture window to always appear back at the position and size it initially opened at, when it is closed and then reopened. By contrast, if preferInitialWindowPlacement is false the Picture-in-Picture window's size and position will be remembered when closed and reopened — it will reopen at its previous position and size, for example as set by the user.\n

    \n
    width Optional
    \n
    \n

    A non-negative number representing the width to set for the Picture-in-Picture window's viewport, in pixels. Defaults to 0.\n

    \n
    " }, @@ -25795,12 +26042,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window read-only property of the\nDocumentPictureInPicture interface returns a Window instance representing the browsing context inside the Picture-in-Picture window." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window read-only property of the\nDocumentPictureInPicture interface returns a Window instance representing the browsing context inside the Picture-in-Picture window." }, "documentpictureinpictureevent": { "url": "$MDN_URL$/web/api/documentpictureinpictureevent", @@ -25811,12 +26059,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPictureEvent interface of the Document Picture-in-Picture API is the event object for the enter event, which fires when the Picture-in-Picture window is opened." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPictureEvent interface of the Document Picture-in-Picture API is the event object for the enter event, which fires when the Picture-in-Picture window is opened." }, "documentpictureinpictureevent.documentpictureinpictureevent": { "url": "$MDN_URL$/web/api/documentpictureinpictureevent/documentpictureinpictureevent", @@ -25827,12 +26076,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPictureEvent() constructor creates a new\nDocumentPictureInPictureEvent object instance.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The DocumentPictureInPictureEvent() constructor creates a new\nDocumentPictureInPictureEvent object instance.", "parameters": { "type": "A string representing the type of event. In the case of DocumentPictureInPictureEvent this is always enter.", "init": "An object containing the following properties:\n

    \n
    window
    \n
    \n

    A Window instance representing the browsing context inside the DocumentPictureInPicture window the event was fired on.\n

    \n
    " @@ -25847,12 +26097,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window read-only property of the\nDocumentPictureInPictureEvent interface returns a Window instance representing the browsing context inside the DocumentPictureInPicture window the event was fired on." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window read-only property of the\nDocumentPictureInPictureEvent interface returns a Window instance representing the browsing context inside the DocumentPictureInPicture window the event was fired on." }, "documenttimeline": { "url": "$MDN_URL$/web/api/documenttimeline", @@ -26407,9 +26658,102 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMMatrix constructor creates a new\nDOMMatrix object which represents 4x4 matrices, suitable for 2D and 3D\noperations.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMMatrix() constructor creates a new DOMMatrix object which represents a 4x4 matrix, suitable for 2D and 3D operations.", "parameters": { - "init": "An array of numbers specifying the matrix you want to create, or a CSS transform string.\n

    In case an array of numbers is passed, the behavior depends on the length of the array:\n

    " + "initString": "A string representing a 2D or 3D matrix in CSS matrix() or matrix3d() format.", + "initArray": "An array containing either 6 or 16 numbers in column-major order. Other array lengths throw a TypeError.\n\n

    If this argument is omitted, an identity matrix is created, i.e., equivalent to [1, 0, 0, 1, 0, 0].\n

    If this argument is provided as a Float32Array or Float64Array, consider using the more performant static methods DOMMatrix.fromFloat32Array() or DOMMatrix.fromFloat64Array() instead." + }, + "returns": "A new DOMMatrix object.", + "throws": { + "TypeError": "Thrown if the argument is not a string or an array with a length other than 6 or 16.", + "SyntaxError": "Thrown if the string argument is not in a valid CSS matrix() or matrix3d() format." + } + }, + "dommatrix.fromfloat32array": { + "url": "$MDN_URL$/web/api/dommatrix/fromfloat32array_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromFloat32Array() static method of the DOMMatrix interface creates a new DOMMatrix object given an array of single-precision (32-bit) floating-point values.\n

    If the array has 6 values, the result is a 2D matrix; if the array has 16 values, the result is a 3D matrix. Otherwise, a TypeError exception is thrown.", + "parameters": { + "array": "A Float32Array with 6 or 16 elements in column-major order." + }, + "returns": "A DOMMatrix object.", + "throws": { + "TypeError": "Thrown if the length of the array parameter is not 6 or 16." + } + }, + "dommatrix.fromfloat64array": { + "url": "$MDN_URL$/web/api/dommatrix/fromfloat64array_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromFloat64Array() static method of the DOMMatrix interface creates a new DOMMatrix object given an array of double-precision (64-bit) floating-point values.\n

    If the array has 6 values, the result is a 2D matrix; if the array has 16 values, the result is a 3D matrix. Otherwise, a TypeError exception is thrown.", + "parameters": { + "array": "A Float64Array with 6 or 16 elements in column-major order." + }, + "returns": "A DOMMatrix object.", + "throws": { + "TypeError": "Thrown if the length of the array parameter is not 6 or 16." + } + }, + "dommatrix.frommatrix": { + "url": "$MDN_URL$/web/api/dommatrix/frommatrix_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromMatrix() static method of the DOMMatrix interface creates a new DOMMatrix object given an existing matrix or an object which provides the values for its properties.", + "parameters": { + "other": "A DOMMatrix, DOMMatrix, or an object with the same properties. All properties default to 0. The properties are:\n

    \n
    is2D
    \n
    \n

    A boolean. true if the matrix should be created as a 2D matrix. Defaults to false if at least one of m13, m14, m23, m24, m31, m32, m34, or m43 is non-zero, or at least one of m33 or m44 is not 1; otherwise, defaults to true.\n

    \n
    m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44
    \n
    \n

    Numbers representing each component of a 4×4 matrix, where m11 through m14 are the first column, m21 through m24 are the second column, and so forth. m11, m22, m33, and m44 default to 1, and all other components default to 0.\n

    If is2D is explicitly set to true, m13, m14, m23, m24, m31, m32, m34, or m43 must either be omitted or set to 0, and m33 and m44 must either be omitted or set to 1.\n

    \n
    a, b, c, d, e, f
    \n
    \n

    Aliases for m11, m12, m21, m22, m41, and m42, respectively, for convenience when initializing 2D matrices. If these aliases are provided with the m counterparts, their values must be equal.\n

    \n
    " + }, + "returns": "A DOMMatrix object.", + "throws": { + "TypeError": "Thrown if the provided object's properties are inconsistent (for example, if both a and m11 are provided but have different values)." } }, "dommatrix.invertself": { @@ -26538,8 +26882,8 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The rotateFromVectorSelf() method of the DOMMatrix interface is a mutable transformation method that modifies a matrix by rotating the matrix by the angle between the specified vector and (1, 0). The rotation angle is determined by the angle between the vector (1,0)T and (x,y)T in the clockwise direction, or (+/-)arctan(y/x). If x and y are both 0, the angle is specified as 0, and the matrix is not altered.\n

    To rotate a matrix from a vector without mutating it, see DOMMatrixReadOnly.rotateFromVector(), which creates a new rotated matrix while leaving the original unchanged.", "parameters": { - "rotX": "A number; The x-coordinate of x,y vector that determines the rotation angle. If undefined, 0 is used.", - "rotY": "A number; The y-coordinate of x,y vector that determines the rotation angle. If undefined, 0 is used." + "rotX": "A number; the x-coordinate of x,y vector that determines the rotation angle. If undefined, 0 is used.", + "rotY": "A number; the y-coordinate of x,y vector that determines the rotation angle. If undefined, 0 is used." }, "returns": "Returns itself; the updated DOMMatrix." }, @@ -26653,7 +26997,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The setMatrixValue() method of the DOMMatrix interface replaces the contents of the matrix with the matrix described by the specified transform or transforms, returning itself.", "parameters": { - "transformList": "A string. Its value follows the same syntax as the CSS transform property value." + "transformList": "A string. Its value follows the same syntax as the CSS transform property value." }, "returns": "Returns itself; the DOMMatrix with updated values." }, @@ -26779,9 +27123,15 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMMatrixReadOnly constructor creates a new\nDOMMatrixReadOnly object which represents 4x4 matrices, suitable for 2D\nand 3D operations.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMMatrixReadOnly() constructor creates a new DOMMatrixReadOnly object which represents a 4x4 matrix, suitable for 2D and 3D operations.", "parameters": { - "init": "Either a string containing a sequence of numbers or an array of numbers\nspecifying the matrix you want to create.\n

    In case an array of numbers is passed, the behavior depends on the length of the array:\n

    " + "initString": "A string representing a 2D or 3D matrix in CSS matrix() or matrix3d() format.", + "initArray": "An array containing either 6 or 16 numbers in column-major order. Other array lengths throw a TypeError.\n\n

    If this argument is omitted, an identity matrix is created, i.e., equivalent to [1, 0, 0, 1, 0, 0].\n

    If this argument is provided as a Float32Array or Float64Array, consider using the more performant static methods DOMMatrixReadOnly.fromFloat32Array() or DOMMatrixReadOnly.fromFloat64Array() instead." + }, + "returns": "A new DOMMatrixReadOnly object.", + "throws": { + "TypeError": "Thrown if the argument is not a string or an array with a length other than 6 or 16.", + "SyntaxError": "Thrown if the string argument is not in a valid CSS matrix() or matrix3d() format." } }, "dommatrixreadonly.flipx": { @@ -26830,6 +27180,93 @@ "doc": "

    Note: This feature is available in Web Workers.

    \n

    The flipY() method of the DOMMatrixReadOnly interface creates a new matrix being the result of the original matrix flipped about the y-axis. This is equivalent to multiplying the matrix by DOMMatrix(1, 0, 0, -1, 0, 0). The original matrix is not modified.", "returns": "A DOMMatrix." }, + "dommatrixreadonly.fromfloat32array": { + "url": "$MDN_URL$/web/api/dommatrixreadonly/fromfloat32array_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromFloat32Array() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an array of single-precision (32-bit) floating-point values.\n

    If the array has 6 values, the result is a 2D matrix; if the array has 16 values, the result is a 3D matrix. Otherwise, a TypeError exception is thrown.", + "parameters": { + "array": "A Float32Array with 6 or 16 elements in column-major order." + }, + "returns": "A DOMMatrixReadOnly object.", + "throws": { + "TypeError": "Thrown if the length of the array parameter is not 6 or 16." + } + }, + "dommatrixreadonly.fromfloat64array": { + "url": "$MDN_URL$/web/api/dommatrixreadonly/fromfloat64array_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromFloat64Array() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an array of double-precision (64-bit) floating-point values.\n

    If the array has 6 values, the result is a 2D matrix; if the array has 16 values, the result is a 3D matrix. Otherwise, a TypeError exception is thrown.", + "parameters": { + "array": "A Float64Array with 6 or 16 elements in column-major order." + }, + "returns": "A DOMMatrixReadOnly object.", + "throws": { + "TypeError": "Thrown if the length of the array parameter is not 6 or 16." + } + }, + "dommatrixreadonly.frommatrix": { + "url": "$MDN_URL$/web/api/dommatrixreadonly/frommatrix_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromMatrix() static method of the DOMMatrixReadOnly interface creates a new DOMMatrixReadOnly object given an existing matrix or an object which provides the values for its properties.", + "parameters": { + "other": "A DOMMatrix, DOMMatrixReadOnly, or an object with the same properties. All properties default to 0. The properties are:\n

    \n
    is2D
    \n
    \n

    A boolean. true if the matrix should be created as a 2D matrix. Defaults to false if at least one of m13, m14, m23, m24, m31, m32, m34, or m43 is non-zero, or at least one of m33 or m44 is not 1; otherwise, defaults to true.\n

    \n
    m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44
    \n
    \n

    Numbers representing each component of a 4×4 matrix, where m11 through m14 are the first column, m21 through m24 are the second column, and so forth. m11, m22, m33, and m44 default to 1, and all other components default to 0.\n

    If is2D is explicitly set to true, m13, m14, m23, m24, m31, m32, m34, or m43 must either be omitted or set to 0, and m33 and m44 must either be omitted or set to 1.\n

    \n
    a, b, c, d, e, f
    \n
    \n

    Aliases for m11, m12, m21, m22, m41, and m42, respectively, for convenience when initializing 2D matrices. If these aliases are provided with the m counterparts, their values must be equal.\n

    \n
    " + }, + "returns": "A DOMMatrixReadOnly object.", + "throws": { + "TypeError": "Thrown if the provided object's properties are inconsistent (for example, if both a and m11 are provided but have different values)." + } + }, "dommatrixreadonly.inverse": { "url": "$MDN_URL$/web/api/dommatrixreadonly/inverse", "status": [ @@ -27002,8 +27439,8 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The rotateFromVector() method of the DOMMatrixReadOnly interface is returns a new DOMMatrix created by rotating the source matrix by the angle between the specified vector and (1, 0). The rotation angle is determined by the angle between the vector (1,0)T and (x,y)T in the clockwise direction, or (+/-)arctan(y/x). If x and y are both 0, the angle is specified as 0. The original matrix is not altered.\n

    To mutate the matrix as you rotate it by the angle between the specified vector and (1, 0), see DOMMatrix.rotateFromVectorSelf().", "parameters": { - "rotX": "A number; The x-coordinate of the x,y vector that determines the rotation angle. If undefined, 0 is used.", - "rotY": "A number; The y-coordinate of the x,y vector that determines the rotation angle. If undefined, 0 is used." + "rotX": "A number; the x-coordinate of the x,y vector that determines the rotation angle. If undefined, 0 is used.", + "rotY": "A number; the y-coordinate of the x,y vector that determines the rotation angle. If undefined, 0 is used." }, "returns": "A DOMMatrix." }, @@ -27208,7 +27645,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The toString() stringifier of the DOMMatrixReadOnly interface returns the value of the matrix as a string in the form of a matrix() or matrix3d() CSS transform function; comma-separated lists of 6 or 16 coordinate values, prepended by \"matrix( or \"matrix3d( respectively, appended by )\".\n

    For a 2D matrix, the elements a through f are listed, for a total of six values and the form matrix(a, b, c, d, e, f). See the matrix() CSS function for details on this syntax.\n

    For a 3D matrix, the returned string contains all 16 elements and takes the form matrix3d(m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44). See the CSS matrix3d() function for details on the 3D notation's syntax.", + "doc": "The toString() stringifier of the DOMMatrixReadOnly interface returns the value of the matrix as a string in the form of a matrix() or matrix3d() CSS transform function; comma-separated lists of 6 or 16 coordinate values, prepended by \"matrix( or \"matrix3d( respectively, appended by )\".\n

    For a 2D matrix, the elements a through f are listed, for a total of six values and the form matrix(a, b, c, d, e, f). See the matrix() CSS function for details on this syntax.\n

    For a 3D matrix, the returned string contains all 16 elements and takes the form matrix3d(m11, m12, m13, m14, m21, m22, m23, m24, m31, m32, m33, m34, m41, m42, m43, m44). See the CSS matrix3d() function for details on the 3D notation's syntax.", "returns": "A string; the values of the list separated by commas, within matrix() or matrix3d() function syntax." }, "dommatrixreadonly.transformpoint": { @@ -27330,7 +27767,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The parseFromString() method of the DOMParser interface parses an input containing either HTML or XML, returning a Document with the type given in the contentType property.\n

    \n

    Note:\nThe Document.parseHTMLUnsafe() static method provides an ergonomic alternative for parsing HTML markup into a Document.\n

    ", + "doc": "
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The parseFromString() method of the DOMParser interface parses an input containing either HTML or XML, returning a Document with the type given in the contentType property.\n

    \n

    Note:\nThe Document.parseHTMLUnsafe() static method provides an ergonomic alternative for parsing HTML markup into a Document.\n

    ", "parameters": { "input": "A TrustedHTML or string instance defining HTML to be parsed.\nThe markup must contain either an HTML, XML, XHTML, or SVG document.", "mimeType": "A string that specifies whether the XML parser or the HTML parser is used to parse the string.\n

    Allowed values are:\n

    " @@ -27760,14 +28197,63 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad() constructor\ncreates and returns a new DOMQuad object, given the values for some or\nall of its properties.\n

    You can also create a DOMQuad by calling the\nDOMQuad.fromRect() or DOMQuad.fromQuad() static function. That function accepts any object with the required parameters, including a DOMQuad, DOMPoint or\nDOMPointReadOnly.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad() constructor creates and returns a new DOMQuad object, given the values for some or all of its properties.\n

    You can also create a DOMQuad by calling the DOMQuad.fromRect() or DOMQuad.fromQuad() static function. These functions accept any object with the required parameters, including a DOMRect, DOMRectReadOnly, or another DOMQuad.", "parameters": { - "p1": "The p1 DOMPoint for the new DOMQuad.", - "p2": "The p2 DOMPoint for the new DOMQuad.", - "p3": "The p3 DOMPoint for the new DOMQuad.", - "p4": "The p4 DOMPoint for the new DOMQuad." + "p1": "Each a DOMPoint or an object with the same properties representing one corner of the quad." } }, + "domquad.fromquad": { + "url": "$MDN_URL$/web/api/domquad/fromquad_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromQuad() static method of the DOMQuad interface returns a new DOMQuad object based on the provided set of coordinates in the shape of another DOMQuad object.", + "parameters": { + "quad": "A DOMQuad or an object with the same properties. All properties default to (0, 0, 0, 1). The properties are:\n

    \n
    p1 Optional, p2 Optional, p3 Optional, p4 Optional
    \n
    \n

    Each a DOMPoint or an object with the same properties representing one corner of the quad.\n

    \n
    \n

    This object should usually be another DOMQuad instance, or an existing object retrieved from some data storage. If you are creating this object from scratch, you should use the DOMQuad() constructor, which accepts the four points separately, avoiding creating the intermediate object." + }, + "returns": "A DOMQuad object." + }, + "domquad.fromrect": { + "url": "$MDN_URL$/web/api/domquad/fromrect_static", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "61", + "ChromeAndroid": "61", + "Edge": "79", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "48", + "Safari": "11", + "SafariIOS": "11" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2020-07-28", + "highDate": "2023-01-28" + }, + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The fromRect() static method of the DOMQuad interface returns a new DOMQuad object based on the provided set of coordinates in the shape of a DOMRect object.", + "parameters": { + "rect": "A DOMRect, DOMRectReadOnly, or an object with the same properties. All properties default to 0. The properties are:\n

    \n
    x Optional
    \n
    \n

    The x coordinate of the rectangle's origin (top-left corner).\n

    \n
    y Optional
    \n
    \n

    The y coordinate of the rectangle's origin (top-left corner).\n

    \n
    width Optional
    \n
    \n

    The width of the rectangle.\n

    \n
    height Optional
    \n
    \n

    The height of the rectangle.\n

    \n
    " + }, + "returns": "A DOMQuad object." + }, "domquad.getbounds": { "url": "$MDN_URL$/web/api/domquad/getbounds", "status": [ @@ -27811,7 +28297,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p1 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x, y)." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p1 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x, y)." }, "domquad.p2": { "url": "$MDN_URL$/web/api/domquad/p2", @@ -27833,7 +28319,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p2 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x + width, y)." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p2 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x + width, y)." }, "domquad.p3": { "url": "$MDN_URL$/web/api/domquad/p3", @@ -27855,7 +28341,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p3 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x + width, y + height)." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p3 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x + width, y + height)." }, "domquad.p4": { "url": "$MDN_URL$/web/api/domquad/p4", @@ -27877,7 +28363,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p4 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x, y + height)." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The DOMQuad interface's p4 property holds the DOMPoint object that represents one of the four corners of the DOMQuad. When created from DOMQuad.fromRect(), it is the point (x, y + height)." }, "domquad.tojson": { "url": "$MDN_URL$/web/api/domquad/tojson", diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-e.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-e.json index 626d09ad182e..8b8051142140 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-e.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-e.json @@ -364,7 +364,7 @@ "doc": "The Element interface's animate() method\nis a shortcut method which creates a new Animation, applies it to the\nelement, then plays the animation. It returns the created Animation\nobject instance.\n

    \n

    Note:\nElements can have multiple animations applied to them. You can get a list of the\nanimations that affect an element by calling Element.getAnimations().\n

    ", "parameters": { "keyframes": "Either an array of keyframe objects, or a keyframe object whose\nproperties are arrays of values to iterate over. See Keyframe Formats for more details.", - "options": "Either an integer representing the animation's duration (in\nmilliseconds), or an Object containing one or more timing properties described in the KeyframeEffect() options parameter and/or the following options:\n
    \n
    id Optional
    \n
    \n

    A property unique to animate(): A string with which to reference the animation.\n

    \n
    rangeEnd Optional
    \n
    \n

    Specifies the end of an animation's attachment range along its timeline, i.e., where along the timeline an animation will end. The JavaScript equivalent of the CSS animation-range-end property. rangeEnd can take several different value types, as follows:\n

      \n
    • \n

      A string that can be normal (meaning no change to the animation's attachment range), a CSS <length-percentage> representing an offset, a <timeline-range-name>, or a <timeline-range-name> with a <length-percentage> following it. For example: \"normal\", \"entry\", or \"cover 100%\".\n

      See animation-range for a detailed description of the available values. Also check out the View Timeline Ranges Visualizer, which shows exactly what the different values mean in an easy visual format.\n

    • \n
    • \n

      An object containing rangeName (a string) and offset (a CSSNumericValue) properties representing a <timeline-range-name> and <length-percentage>, as described in the previous bullet. For example: { rangeName: \"entry\", offset: CSS.percent(\"100\") }.\n

    • \n
    • \n

      A CSSNumericValue representing an offset, for example: CSS.percent(\"100\").\n

    • \n
    \n
    \n
    rangeStart Optional
    \n
    \n

    Specifies the start of an animation's attachment range along its timeline, i.e., where along the timeline an animation will start. The JavaScript equivalent of the CSS animation-range-start property. rangeStart can take the same value types as rangeEnd.\n

    \n
    timeline Optional
    \n
    \n

    A property unique to animate(): The AnimationTimeline to associate with the animation. Defaults to Document.timeline. The JavaScript equivalent of the CSS animation-timeline property.\n

    \n
    " + "options": "Either an integer representing the animation's duration (in\nmilliseconds), or an Object containing one or more timing properties described in the KeyframeEffect() options parameter and/or the following options:\n
    \n
    id Optional
    \n
    \n

    A property unique to animate(): A string with which to reference the animation.\n

    \n
    rangeEnd Optional
    \n
    \n

    Specifies the end of an animation's attachment range along its timeline, i.e., where along the timeline an animation will end. The JavaScript equivalent of the CSS animation-range-end property. rangeEnd can take several different value types, as follows:\n

      \n
    • \n

      A string that can be normal (meaning no change to the animation's attachment range), a CSS <length-percentage> representing an offset, a <timeline-range-name>, or a <timeline-range-name> with a <length-percentage> following it. For example: \"normal\", \"entry\", or \"cover 100%\".\n

      See animation-range for a detailed description of the available values. Also check out the View Timeline Ranges Visualizer, which shows exactly what the different values mean in an easy visual format.\n

    • \n
    • \n

      An object containing rangeName (a string) and offset (a CSSNumericValue) properties representing a <timeline-range-name> and <length-percentage>, as described in the previous bullet. For example: { rangeName: \"entry\", offset: CSS.percent(\"100\") }.\n

    • \n
    • \n

      A CSSNumericValue representing an offset, for example: CSS.percent(\"100\").\n

    • \n
    \n
    \n
    rangeStart Optional
    \n
    \n

    Specifies the start of an animation's attachment range along its timeline, i.e., where along the timeline an animation will start. The JavaScript equivalent of the CSS animation-range-start property. rangeStart can take the same value types as rangeEnd.\n

    \n
    timeline Optional
    \n
    \n

    A property unique to animate(): The AnimationTimeline to associate with the animation. Defaults to Document.timeline. The JavaScript equivalent of the CSS animation-timeline property.\n

    \n
    " }, "returns": "Returns an Animation." }, @@ -597,10 +597,13 @@ "Edge": "128", "Firefox": "119", "FirefoxAndroid": "119", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The ariaColIndexText property of the Element interface reflects the value of the aria-colindextext attribute, which defines a human readable text alternative of aria-colindex." }, @@ -1295,10 +1298,13 @@ "Edge": "128", "Firefox": "119", "FirefoxAndroid": "119", - "Opera": "114" + "Opera": "114", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The ariaRowIndexText property of the Element interface reflects the value of the aria-rowindextext attribute, which defines a human readable text alternative of aria-rowindex." }, @@ -1514,7 +1520,7 @@ }, "doc": "The Element.attachShadow() method attaches a shadow DOM tree to the specified element and returns a reference to its ShadowRoot.", "parameters": { - "options": "An object which contains the following fields:\n
    \n
    mode
    \n
    \n

    A string specifying the encapsulation mode for the shadow DOM tree.\nThis can be one of:\n

    \n
    open
    \n
    \n

    Elements of the shadow root are accessible from JavaScript outside the root,\nfor example using Element.shadowRoot:\n

    \n```js\nelement.attachShadow({ mode: \"open\" });\nelement.shadowRoot; // Returns a ShadowRoot obj\n```\n
    \n
    \n
    closed
    \n
    \n

    Denies access to the node(s) of a closed shadow root\nfrom JavaScript outside it:\n

    \n```js\nelement.attachShadow({ mode: \"closed\" });\nelement.shadowRoot; // Returns null\n```\n
    \n
    \n
    \n
    \n
    clonable Optional
    \n
    \n

    A boolean that specifies whether the shadow root is clonable: when set to true, the shadow host cloned with Node.cloneNode() or Document.importNode() will include shadow root in the copy. Its default value is false.\n

    \n
    delegatesFocus Optional
    \n
    \n

    A boolean that, when set to true, specifies behavior that mitigates custom element issues around focusability.\nWhen a non-focusable part of the shadow DOM is clicked, the first focusable part is given focus, and the shadow host is given any available :focus styling. Its default value is false.\n

    \n
    serializable Optional
    \n
    \n

    A boolean that, when set to true, indicates that the shadow root is serializable.\nIf set, the shadow root may be serialized by calling the Element.getHTML() or ShadowRoot.getHTML() methods with the options.serializableShadowRoots parameter set true.\nIts default value is false.\n

    \n
    slotAssignment Optional
    \n
    \n

    A string specifying the slot assignment mode for the shadow DOM tree. This can be one of:\n

    \n
    named
    \n
    \n

    Elements are automatically assigned to <slot> elements within this shadow root. Any descendants of the host with a slot attribute which matches the name attribute of a <slot> within this shadow root will be assigned to that slot. Any top-level children of the host with no slot attribute will be assigned to a <slot> with no name attribute (the \"default slot\") if one is present.\n

    \n
    manual
    \n
    \n

    Elements are not automatically assigned to <slot> elements. Instead, they must be manually assigned with HTMLSlotElement.assign().\nIts default value is named.\n

    \n
    \n
    \n
    " + "options": "An object which contains the following fields:\n
    \n
    mode
    \n
    \n

    A string specifying the encapsulation mode for the shadow DOM tree.\nThis can be one of:\n

    \n
    open
    \n
    \n

    Elements of the shadow root are accessible from JavaScript outside the root,\nfor example using Element.shadowRoot:\n

    \n```js\nelement.attachShadow({ mode: \"open\" });\nelement.shadowRoot; // Returns a ShadowRoot obj\n```\n
    \n
    \n
    closed
    \n
    \n

    Denies access to the node(s) of a closed shadow root\nfrom JavaScript outside it:\n

    \n```js\nelement.attachShadow({ mode: \"closed\" });\nelement.shadowRoot; // Returns null\n```\n
    \n
    \n
    \n
    \n
    clonable Optional
    \n
    \n

    A boolean that specifies whether the shadow root is clonable: when set to true, the shadow host cloned with Node.cloneNode() or Document.importNode() will include shadow root in the copy. Its default value is false.\n

    \n
    delegatesFocus Optional
    \n
    \n

    A boolean that, when set to true, specifies behavior that mitigates custom element issues around focusability.\nWhen a non-focusable part of the shadow DOM is clicked, the first focusable part is given focus, and the shadow host is given any available :focus styling. Its default value is false.\n

    \n
    referenceTarget Optional
    \n
    \n

    A string value that indicates the effective target of any element reference made against the shadow host from outside the host element. The value should be the ID of an element inside the shadow DOM. If set, target references to the host element from outside the shadow DOM will cause the referenced target element to become the effective target of the reference to the host element.\n

    \n
    serializable Optional
    \n
    \n

    A boolean that, when set to true, indicates that the shadow root is serializable.\nIf set, the shadow root may be serialized by calling the Element.getHTML() or ShadowRoot.getHTML() methods with the options.serializableShadowRoots parameter set true.\nIts default value is false.\n

    \n
    slotAssignment Optional
    \n
    \n

    A string specifying the slot assignment mode for the shadow DOM tree. This can be one of:\n

    \n
    named
    \n
    \n

    Elements are automatically assigned to <slot> elements within this shadow root. Any descendants of the host with a slot attribute which matches the name attribute of a <slot> within this shadow root will be assigned to that slot. Any top-level children of the host with no slot attribute will be assigned to a <slot> with no name attribute (the \"default slot\") if one is present.\n

    \n
    manual
    \n
    \n

    Elements are not automatically assigned to <slot> elements. Instead, they must be manually assigned with HTMLSlotElement.assign().\nIts default value is named.\n

    \n
    \n
    \n
    " }, "returns": "Returns a ShadowRoot object.", "throws": { @@ -1591,11 +1597,11 @@ "level": "LOW", "lowDate": "2024-03-05" }, - "doc": "The checkVisibility() method of the Element interface checks whether the element is visible.\n

    The method returns false in either of the following situations:\n

    \n

    The optional parameter enables additional checks to test for other interpretations of what \"visible\" means.\nFor example, you can further check whether an element has an opacity of 0, if the value of the element visibility property makes it invisible, or if the element content-visibility property has a value of auto and its rendering is currently being skipped.", + "doc": "The checkVisibility() method of the Element interface checks whether the element is visible.\n

    The method returns false in either of the following situations:\n

    \n

    The optional parameter enables additional checks to test for other interpretations of what \"visible\" means.\nFor example, you can further check whether an element has an opacity of 0, if the value of the element visibility property makes it invisible, or if the element content-visibility property has a value of auto and its rendering is currently being skipped.", "parameters": { - "options": "An object indicating additional checks to run.\nThe possible options are:\n

    \n
    contentVisibilityAuto
    \n
    \n

    true to check if the element content-visibility property has (or inherits) the value auto, and it is currently skipping its rendering.\nfalse by default.\n

    \n
    opacityProperty
    \n
    \n

    true to check if the element opacity property has (or inherits) a value of 0.\nfalse by default.\n

    \n
    visibilityProperty
    \n
    \n

    true to check if the element is invisible due to the value of its visibility property.\nfalse by default.\n

    \n

    Note:\nInvisible elements include those that have visibility: hidden, and some element types that have visibility: collapse.\n

    \n
    \n
    checkOpacity
    \n
    \n

    A historic alias for opacityProperty.\n

    \n
    checkVisibilityCSS
    \n
    \n

    A historic alias for visibilityProperty.\n

    \n
    " + "options": "An object indicating additional checks to run.\nThe possible options are:\n
    \n
    contentVisibilityAuto
    \n
    \n

    true to check if the element content-visibility property has (or inherits) the value auto, and it is currently skipping its rendering.\nfalse by default.\n

    \n
    opacityProperty
    \n
    \n

    true to check if the element opacity property has (or inherits) a value of 0.\nfalse by default.\n

    \n
    visibilityProperty
    \n
    \n

    true to check if the element is invisible due to the value of its visibility property.\nfalse by default.\n

    \n

    Note:\nInvisible elements include those that have visibility: hidden, and some element types that have visibility: collapse.\n

    \n
    \n
    checkOpacity
    \n
    \n

    A historic alias for opacityProperty.\n

    \n
    checkVisibilityCSS
    \n
    \n

    A historic alias for visibilityProperty.\n

    \n
    " }, - "returns": "false if any of the following conditions are met, otherwise true:\n" + "returns": "false if any of the following conditions are met, otherwise true:\n" }, "element.childelementcount": { "url": "$MDN_URL$/web/api/element/childelementcount", @@ -1661,7 +1667,7 @@ "lowDate": "2017-10-17", "highDate": "2020-04-17" }, - "doc": "The Element.classList is a read-only property that\nreturns a live DOMTokenList collection of the class\nattributes of the element. This can then be used to manipulate the class list.\n

    Using classList is a convenient alternative to accessing an element's list\nof classes as a space-delimited string via element.className." + "doc": "The read-only classList property of the Element interface contains a live DOMTokenList collection representing the class attribute of the element. This can then be used to manipulate the class list.\n

    Using classList is a convenient alternative to accessing an element's list of classes as a space-delimited string via element.className." }, "element.classname": { "url": "$MDN_URL$/web/api/element/classname", @@ -1819,7 +1825,7 @@ "level": "NONE" }, "doc": "The computedStyleMap() method of\nthe Element interface returns a StylePropertyMapReadOnly\ninterface which provides a read-only representation of a CSS declaration block that is\nan alternative to CSSStyleDeclaration.", - "returns": "A StylePropertyMapReadOnly object.\n

    Unlike Window.getComputedStyle, the return value contains computed values, not resolved values. For most properties, they are the same, except a few layout-related properties, where the resolved value is the used value instead of the computed value. See the comparison with getComputedStyle() example for details." + "returns": "A StylePropertyMapReadOnly object.\n

    Unlike Window.getComputedStyle, the return value contains computed values, not resolved values. For most properties, they are the same, except a few layout-related properties, where the resolved value is the used value instead of the computed value. See the comparison with getComputedStyle() example for details." }, "element.currentcsszoom": { "url": "$MDN_URL$/web/api/element/currentcsszoom", @@ -1837,7 +1843,7 @@ "baseline": { "level": "NONE" }, - "doc": "The currentCSSZoom read-only property of the Element interface provides the \"effective\" CSS zoom of an element, taking into account the zoom applied to the element and all its parent elements.\n

    The value calculated by multiplying the CSS zoom values of the element and all of its parents.\nFor example, if three elements with zoom values of 2, 1.5, and 3, are nested within each other, the most deeply nested element will have a currentCSSZoom value of 9.\nIf the element doesn't have a CSS box, for example because display: none is set on the element or one of its parents, then the currentCSSZoom is set to 1.\n

    Note that some methods, such as Element.getBoundingClientRect(), return dimensions and position that are relative to the viewport, and hence include the effects of CSS zoom.\nOther properties and methods return values that are relative to the element itself, and do not include the effects of zooming.\nThese include, for example, client* properties such as Element.clientHeight, scroll*() methods like Element.scroll(), and offset* properties such as HTMLElement.offsetHeight.\nThe currentCSSZoom property can be used to scale these values to adjust for the effects of zooming." + "doc": "The currentCSSZoom read-only property of the Element interface provides the \"effective\" CSS zoom of an element, taking into account the zoom applied to the element and all its parent elements.\n

    The value calculated by multiplying the CSS zoom values of the element and all of its parents.\nFor example, if three elements with zoom values of 2, 1.5, and 3, are nested within each other, the most deeply nested element will have a currentCSSZoom value of 9.\nIf the element doesn't have a CSS box, for example because display: none is set on the element or one of its parents, then the currentCSSZoom is set to 1.\n

    Note that some methods, such as Element.getBoundingClientRect(), return dimensions and position that are relative to the viewport, and hence include the effects of CSS zoom.\nOther properties and methods return values that are relative to the element itself, and do not include the effects of zooming.\nThese include, for example, client* properties such as Element.clientHeight, scroll*() methods like Element.scroll(), and offset* properties such as HTMLElement.offsetHeight.\nThe currentCSSZoom property can be used to scale these values to adjust for the effects of zooming." }, "element.elementtiming": { "url": "$MDN_URL$/web/api/element/elementtiming", @@ -1898,9 +1904,9 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The getAnimations() method of the Element interface\n(specified on the Animatable mixin) returns an array of all\nAnimation objects affecting this element or which are scheduled to do so\nin future. It can optionally return Animation objects for descendant\nelements too.\n

    \n

    Note:\nThis array includes CSS Animations, CSS Transitions, and Web Animations.\n

    ", + "doc": "The getAnimations() method of the Element interface\n(specified on the Animatable mixin) returns an array of all\nAnimation objects affecting this element or which are scheduled to do so\nin future. It can optionally return Animation objects for descendant\nelements too.\n
    \n

    Note:\nThis array includes CSS Animations, CSS Transitions, and Web Animations.\n

    ", "parameters": { - "options": "An options object containing the following property:\n
    \n
    subtree
    \n
    \n

    A boolean value which, if true, causes animations that target\ndescendants of Element to be returned as well. This includes animations\nthat target any CSS pseudo-elements attached to\nElement or one of its descendants. Defaults to false.\n

    \n
    " + "options": "An options object containing the following property:\n
    \n
    subtree
    \n
    \n

    A boolean value which, if true, causes animations that target\ndescendants of Element to be returned as well. This includes animations\nthat target any CSS pseudo-elements attached to\nElement or one of its descendants. Defaults to false.\n

    \n
    " }, "returns": "An Array of Animation objects, each representing an\nanimation currently targeting the Element on which this method is called,\nor one of its descendant elements if { subtree: true } is specified." }, @@ -2054,7 +2060,7 @@ "highDate": "2018-01-29" }, "doc": "The Element.getBoundingClientRect() method returns a\nDOMRect object providing information about the size of an element and its\nposition relative to the viewport.", - "returns": "The returned value is a DOMRect object which is the smallest rectangle\nwhich contains the entire element, including its padding and border-width. The\nleft, top, right, bottom,\nx, y, width, and height properties\ndescribe the position and size of the overall rectangle in pixels. Properties other than\nwidth and height are relative to the top-left of the viewport.\n

    \n

    The width and height properties of the DOMRect\nobject returned by the method include the padding and\nborder-width, not only the content width/height. In the standard box model,\nthis would be equal to the width or height property of the\nelement + padding + border-width. But\nif box-sizing: border-box is\nset for the element this would be directly equal to its width or\nheight.\n

    The returned value can be thought of as the union of the rectangles returned by\ngetClientRects() for the element, i.e., the CSS\nborder-boxes associated with the element.\n

    Empty border-boxes are completely ignored. If all the element's border-boxes are empty,\nthen a rectangle is returned with a width and height of zero\nand where the top and left are the top-left of the border-box\nfor the first CSS box (in content order) for the element.\n

    The amount of scrolling that has been done of the viewport area (or any other\nscrollable element) is taken into account when computing the bounding rectangle. This\nmeans that the rectangle's boundary edges (top, right,\nbottom, left) change their values every time the scrolling\nposition changes (because their values are relative to the viewport and not absolute).\n

    If you need the bounding rectangle relative to the top-left corner of the document,\njust add the current scrolling position to the top and left\nproperties (these can be obtained using window.scrollY and\nwindow.scrollX) to get a bounding rectangle which is independent from the\ncurrent scrolling position." + "returns": "The returned value is a DOMRect object which is the smallest rectangle\nwhich contains the entire element, including its padding and border-width. The\nleft, top, right, bottom,\nx, y, width, and height properties\ndescribe the position and size of the overall rectangle in pixels. Properties other than\nwidth and height are relative to the top-left of the viewport.\n

    \n

    The width and height properties of the DOMRect\nobject returned by the method include the padding and\nborder-width, not only the content width/height. In the standard box model,\nthis would be equal to the width or height property of the\nelement + padding + border-width. But\nif box-sizing: border-box is\nset for the element this would be directly equal to its width or\nheight.\n

    The returned value can be thought of as the union of the rectangles returned by\ngetClientRects() for the element, i.e., the CSS\nborder-boxes associated with the element.\n

    Empty border-boxes are completely ignored. If all the element's border-boxes are empty,\nthen a rectangle is returned with a width and height of zero\nand where the top and left are the top-left of the border-box\nfor the first CSS box (in content order) for the element.\n

    The amount of scrolling that has been done of the viewport area (or any other\nscrollable element) is taken into account when computing the bounding rectangle. This\nmeans that the rectangle's boundary edges (top, right,\nbottom, left) change their values every time the scrolling\nposition changes (because their values are relative to the viewport and not absolute).\n

    If you need the bounding rectangle relative to the top-left corner of the document,\njust add the current scrolling position to the top and left\nproperties (these can be obtained using window.scrollY and\nwindow.scrollX) to get a bounding rectangle which is independent from the\ncurrent scrolling position." }, "element.getclientrects": { "url": "$MDN_URL$/web/api/element/getclientrects", @@ -2076,7 +2082,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The getClientRects() method of the Element\ninterface returns a collection of DOMRect objects that indicate the\nbounding rectangles for each CSS border box in a client.\n

    Most elements only have one border box each, but a multiline inline-level element (such as a multiline\n<span> element, by default) has a border box around each line.", + "doc": "The getClientRects() method of the Element\ninterface returns a collection of DOMRect objects that indicate the\nbounding rectangles for each CSS border box in a client.\n

    Most elements only have one border box each, but a multiline inline-level element (such as a multiline\n<span> element, by default) has a border box around each line.", "returns": "The returned value is a collection of DOMRect objects, one for each CSS\nborder box associated with the element. Each DOMRect object describes the border box, in pixels, with the top-left\nrelative to the top-left of the viewport. For tables with captions, the caption is\nincluded even though it's outside the border box of the table. When called on SVG\nelements other than an outer-<svg>, the \"viewport\" that the resulting\nrectangles are relative to is the viewport that the element's\nouter-<svg> establishes (and to be clear, the rectangles are also\ntransformed by the outer-<svg>'s viewBox transform, if\nany).\n

    The amount of scrolling that has been done of the viewport area (or any other\nscrollable element) is taken into account when computing the rectangles.\n

    The returned rectangles do not include the bounds of any child elements that might\nhappen to overflow.\n

    For HTML <area> elements, SVG elements that do not render anything\nthemselves, display:none elements, and generally any elements that are not\ndirectly rendered, an empty list is returned.\n

    Rectangles are returned even for CSS boxes that have empty border-boxes. The\nleft, top, right, and bottom\ncoordinates can still be meaningful.\n

    Fractional pixel offsets are possible." }, "element.getelementsbyclassname": { @@ -2305,7 +2311,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The id property of the Element interface\nrepresents the element's identifier, reflecting the\nid\nglobal attribute.\n

    If the id value is not the empty string, it must be unique in a document.\n

    The id is often used with getElementById() to retrieve a particular element.\nAnother common case is to use an element's ID as a selector when styling the document with CSS.\n

    \n

    Note:\nIdentifiers are case-sensitive, but you should avoid creating\nIDs that differ only in the capitalization.\n

    " + "doc": "The id property of the Element interface\nrepresents the element's identifier, reflecting the\nid\nglobal attribute.\n

    If the id value is not the empty string, it must be unique in a document.\n

    The id is often used with getElementById() to retrieve a particular element.\nAnother common case is to use an element's ID as a selector when styling the document with CSS.\n

    \n

    Note:\nIdentifiers are case-sensitive, but you should avoid creating\nIDs that differ only in the capitalization.\n

    " }, "element.innerhtml": { "url": "$MDN_URL$/web/api/element/innerhtml", @@ -2327,7 +2333,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "
    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The innerHTML property of the Element interface gets or sets the HTML or XML markup contained within the element, omitting any shadow roots in both cases.\n

    To insert the HTML into the document rather than replace the contents of an element, use the method insertAdjacentHTML().", + "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The innerHTML property of the Element interface gets or sets the HTML or XML markup contained within the element, omitting any shadow roots in both cases.\n

    To insert the HTML into the document rather than replace the contents of an element, use the method insertAdjacentHTML().", "throws": { "SyntaxError DOMException": "Thrown if an attempt was made to set the value of innerHTML using a string which is not properly-formed HTML.", "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.", @@ -2385,7 +2391,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    \n

    Warning:\nThis method parses its input as HTML or XML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can reduce the risk by assigning TrustedHTML objects instead of strings, and enforcing trusted types using the require-trusted-types-for CSP directive.\nThis ensures that the input is passed through a transformation function, which has the chance to sanitize the input to remove potentially dangerous markup, such as <script> elements and event handler attributes.\n

    \n

    The insertAdjacentHTML() method of the Element interface parses the specified input as HTML or XML and inserts the resulting nodes into the DOM tree at a specified position.", + "doc": "

    \n

    Warning:\nThis method parses its input as HTML or XML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can reduce the risk by assigning TrustedHTML objects instead of strings, and enforcing trusted types using the require-trusted-types-for CSP directive.\nThis ensures that the input is passed through a transformation function, which has the chance to sanitize the input to remove potentially dangerous markup, such as <script> elements and event handler attributes.\n

    \n

    The insertAdjacentHTML() method of the Element interface parses the specified input as HTML or XML and inserts the resulting nodes into the DOM tree at a specified position.", "parameters": { "position": "A string representing the position relative to the element. Must be one of the following strings:\n

    \n
    \"beforebegin\"
    \n
    \n

    Before the element. Only valid if the element is in the DOM tree and has a parent element.\n

    \n
    \"afterbegin\"
    \n
    \n

    Just inside the element, before its first child.\n

    \n
    \"beforeend\"
    \n
    \n

    Just inside the element, after its last child.\n

    \n
    \"afterend\"
    \n
    \n

    After the element. Only valid if the element is in the DOM tree and has a parent element.\n

    \n
    ", "input": "A TrustedHTML instance or string defining the HTML or XML to be parsed." @@ -2592,7 +2598,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "
    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The outerHTML attribute of the Element interface gets or sets the HTML or XML markup of the element and its descendants, omitting any shadow roots in both cases.\n

    To get or set the contents of an element, use the innerHTML property instead.", + "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The outerHTML attribute of the Element interface gets or sets the HTML or XML markup of the element and its descendants, omitting any shadow roots in both cases.\n

    To get or set the contents of an element, use the innerHTML property instead.", "throws": { "NoModificationAllowedError DOMException": "Thrown if an attempt was made to set outerHTML on an element which is a direct child of a Document, such as Document.documentElement.", "SyntaxError DOMException": "Thrown if an attempt was made to set outerHTML using an XML input which is not well-formed.", @@ -2619,7 +2625,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "The part property of the Element interface\nrepresents the part identifier(s) of the element (i.e., set using the part\nattribute), returned as a DOMTokenList. These can be used to style parts\nof a shadow DOM, via the ::part pseudo-element." + "doc": "The read-only part property of the Element interface contains a DOMTokenList object representing the part identifier(s) of the element. It reflects the element's part content attribute. These can be used to style parts of a shadow DOM, via the ::part pseudo-element." }, "element.prefix": { "url": "$MDN_URL$/web/api/element/prefix", @@ -2716,7 +2722,7 @@ }, "doc": "The querySelector() method of the Element\ninterface returns the first element that is a descendant of the element on which it is\ninvoked that matches the specified group of selectors.", "parameters": { - "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." + "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example." }, "returns": "The first descendant element of baseElement which matches the specified\ngroup of selectors. The entire hierarchy of elements is considered when\nmatching, including those outside the set of elements including baseElement\nand its descendants; in other words, selectors is first applied to the\nwhole document, not the baseElement, to generate an initial list of\npotential elements. The resulting elements are then examined to see if they are\ndescendants of baseElement. The first match of those remaining elements is\nreturned by the querySelector() method.\n

    If no matches are found, the returned value is null.", "throws": { @@ -2745,9 +2751,9 @@ }, "doc": "The Element method querySelectorAll()\nreturns a static (not live) NodeList representing a list of elements\nmatching the specified group of selectors which are descendants of the element on which\nthe method was called.", "parameters": { - "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example.\n

    The selectors are applied to the entire document, not just the particular element on which querySelectorAll() is called. To restrict the selector to the element on which querySelectorAll() is called, include the :scope pseudo-class at the start of the selector. See the selector scope example." + "selectors": "A string containing one or more selectors to match. This string\nmust be a valid CSS selector string; if it isn't, a SyntaxError exception\nis thrown.\n

    Note that the HTML specification does not require attribute values to be valid CSS identifiers. If a class or id attribute value is not a valid CSS identifier, then you must escape it before using it in a selector, either by calling CSS.escape() on the value, or using one of the techniques described in Escaping characters. See Escaping attribute values for an example.\n

    The selectors are applied to the entire document, not just the particular element on which querySelectorAll() is called. To restrict the selector to the element on which querySelectorAll() is called, include the :scope pseudo-class at the start of the selector. See the selector scope example." }, - "returns": "A non-live NodeList containing one Element object for\neach descendant node that matches at least one of the specified selectors. The elements are in document order — that is, parents before children, earlier siblings before later siblings.\n

    \n

    Note:\nIf the specified selectors include a CSS pseudo-element, the returned list\nis always empty.\n

    ", + "returns": "A non-live NodeList containing one Element object for\neach descendant node that matches at least one of the specified selectors. The elements are in document order — that is, parents before children, earlier siblings before later siblings.\n
    \n

    Note:\nIf the specified selectors include a CSS pseudo-element, the returned list\nis always empty.\n

    ", "throws": { "SyntaxError DOMException": "Thrown if the syntax of the specified selectors string is not valid." } @@ -3037,7 +3043,7 @@ "parameters": { "xCoord": "The pixel along the horizontal axis of the element that you want displayed in the\nupper left.", "yCoord": "The pixel along the vertical axis of the element that you want displayed in the\nupper left.", - "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " + "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " }, "returns": "None (undefined)." }, @@ -3089,7 +3095,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scrollHeight read-only property of the Element interface is a measurement of the height of an element's content, including content not visible on the screen due to overflow.\n

    The scrollHeight value is equal to the minimum height the element would require in order to fit all the content in the viewport without using a vertical scrollbar. The height is measured in the same way as clientHeight: it includes the element's padding, but not its border, margin or horizontal scrollbar (if present). It can also include the height of pseudo-elements such as ::before or ::after. If the element's content can fit without a need for vertical scrollbar, its scrollHeight is equal to clientHeight." + "doc": "The scrollHeight read-only property of the Element interface is a measurement of the height of an element's content, including content not visible on the screen due to overflow.\n

    The scrollHeight value is equal to the minimum height the element would require in order to fit all the content in the viewport without using a vertical scrollbar. The height is measured in the same way as clientHeight: it includes the element's padding, but not its border, margin or horizontal scrollbar (if present). It can also include the height of pseudo-elements such as ::before or ::after. If the element's content can fit without a need for vertical scrollbar, its scrollHeight is equal to clientHeight." }, "element.scrollintoview": { "url": "$MDN_URL$/web/api/element/scrollintoview", @@ -3114,7 +3120,7 @@ "doc": "The Element interface's\nscrollIntoView() method scrolls the element's ancestor\ncontainers such that the element on which scrollIntoView() is called is\nvisible to the user.", "parameters": { "alignToTop": "A boolean value:\n

    ", - "options": "An object with the following properties:\n
    \n
    behavior Optional
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. Its value can be one of the following:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n

    The default is auto.\n

    \n
    block Optional
    \n
    \n

    Defines the vertical alignment of the element within the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • start: Aligns the element's top edge with the top of the scrollable container, making the element appear at the start of the visible area vertically.
    • \n
    • center: Aligns the element vertically at the center of the scrollable container, positioning it in the middle of the visible area.
    • \n
    • end: Aligns the element's bottom edge with the bottom of the scrollable container, placing the element at the end of the visible area vertically.
    • \n
    • nearest: Scrolls the element to the nearest edge in the vertical direction. If the element is closer to the top edge of the scrollable container, it will align to the top; if it's closer to the bottom edge, it will align to the bottom. This minimizes the scrolling distance.
    • \n
    \n

    The default is start.\n

    \n
    container Optional
    \n
    \n

    Defines the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • all: All scrollable containers are impacted (including the viewport).
    • \n
    • nearest: Only the nearest scrollable container is impacted by the scroll.
    • \n
    \n

    The default is all.\n

    \n
    inline Optional
    \n
    \n

    Defines the horizontal alignment of the element within the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • start: Aligns the element's left edge with the left of the scrollable container, making the element appear at the start of the visible area horizontally.
    • \n
    • center: Aligns the element horizontally at the center of the scrollable container, positioning it in the middle of the visible area.
    • \n
    • end: Aligns the element's right edge with the right of the scrollable container, placing the element at the end of the visible area horizontally.
    • \n
    • nearest: Scrolls the element to the nearest edge in the horizontal direction. If the element is closer to the left edge of the scrollable container, it will align to the left; if it's closer to the right edge, it will align to the right. This minimizes the scrolling distance.
    • \n
    \n

    The default is nearest.\n

    \n
    " + "options": "An object with the following properties:\n
    \n
    behavior Optional
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. Its value can be one of the following:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n

    The default is auto.\n

    \n
    block Optional
    \n
    \n

    Defines the vertical alignment of the element within the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • start: Aligns the element's top edge with the top of the scrollable container, making the element appear at the start of the visible area vertically.
    • \n
    • center: Aligns the element vertically at the center of the scrollable container, positioning it in the middle of the visible area.
    • \n
    • end: Aligns the element's bottom edge with the bottom of the scrollable container, placing the element at the end of the visible area vertically.
    • \n
    • nearest: Scrolls the element to the nearest edge in the vertical direction. If the element is closer to the top edge of the scrollable container, it will align to the top; if it's closer to the bottom edge, it will align to the bottom. This minimizes the scrolling distance.
    • \n
    \n

    The default is start.\n

    \n
    container Optional
    \n
    \n

    Defines the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • all: All scrollable containers are impacted (including the viewport).
    • \n
    • nearest: Only the nearest scrollable container is impacted by the scroll.
    • \n
    \n

    The default is all.\n

    \n
    inline Optional
    \n
    \n

    Defines the horizontal alignment of the element within the scrollable ancestor container. Its value can be one of the following:\n

      \n
    • start: Aligns the element's left edge with the left of the scrollable container, making the element appear at the start of the visible area horizontally.
    • \n
    • center: Aligns the element horizontally at the center of the scrollable container, positioning it in the middle of the visible area.
    • \n
    • end: Aligns the element's right edge with the right of the scrollable container, placing the element at the end of the visible area horizontally.
    • \n
    • nearest: Scrolls the element to the nearest edge in the horizontal direction. If the element is closer to the left edge of the scrollable container, it will align to the left; if it's closer to the right edge, it will align to the right. This minimizes the scrolling distance.
    • \n
    \n

    The default is nearest.\n

    \n
    " }, "returns": "None (undefined)." }, @@ -3184,11 +3190,11 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The scrollTo() method of the Element\ninterface scrolls to a particular set of coordinates inside a given element.", + "doc": "The scrollTo() method of the Element\ninterface scrolls to a particular set of coordinates inside a given element.\n

    This method is an alias for Element.scroll().", "parameters": { "xCoord": "The pixel along the horizontal axis of the\nelement that you want displayed in the upper left.", "yCoord": "The pixel along the vertical axis of the element\nthat you want displayed in the upper left.", - "options": "An object containing the following properties:\n

    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " + "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " }, "returns": "None (undefined)." }, @@ -3242,7 +3248,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The scrollWidth read-only property of the Element interface is a measurement of the width of an element's content, including content not visible on the screen due to overflow.\n

    The scrollWidth value is equal to the minimum width the element would require in order to fit all the content in the viewport without using a horizontal scrollbar. The width is measured in the same way as clientWidth: it includes the element's padding, but not its border, margin or vertical scrollbar (if present). It can also include the width of pseudo-elements such as ::before or ::after. If the element's content can fit without a need for horizontal scrollbar, its scrollWidth is equal to clientWidth." + "doc": "The scrollWidth read-only property of the Element interface is a measurement of the width of an element's content, including content not visible on the screen due to overflow.\n

    The scrollWidth value is equal to the minimum width the element would require in order to fit all the content in the viewport without using a horizontal scrollbar. The width is measured in the same way as clientWidth: it includes the element's padding, but not its border, margin or vertical scrollbar (if present). It can also include the width of pseudo-elements such as ::before or ::after. If the element's content can fit without a need for horizontal scrollbar, its scrollWidth is equal to clientWidth." }, "element.setattribute": { "url": "$MDN_URL$/web/api/element/setattribute", @@ -3264,14 +3270,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The setAttribute() method of the Element interface sets the value of an attribute on the specified element. If the attribute already exists, the value is updated; otherwise a new attribute is added with the specified name and value.\n

    To get the current value of an attribute, use getAttribute(); to remove an attribute, call removeAttribute().\n

    If you need to work with the Attr node (such as cloning from another element) before adding it, you can use the setAttributeNode() method instead.", + "doc": "

    \n

    Warning:\nThis method can take attribute values that are parsed as HTML, a script, or as a script URL, depending on the attribute.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the value originally came from an attacker.\n

    You can mitigate this risk by always passing the appropriate trusted type object (TrustedHTML, TrustedScript, or TrustedScriptURL) instead of strings for those attributes that require them, and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The setAttribute() method of the Element interface sets the value of an attribute on the specified element.\nIf the attribute already exists, the value is updated; otherwise a new attribute is added with the specified name and value.\n

    If you need to work with the Attr node (such as cloning from another element) before adding it, you can use the setAttributeNode() method instead.", "parameters": { - "name": "A string specifying the name of the attribute whose value is to be\nset. The attribute name is automatically converted to all lower-case when\nsetAttribute() is called on an HTML element in an HTML document.", - "value": "A string containing the value to assign to the attribute. Any\nnon-string value specified is converted automatically into a string." + "name": "A string specifying the name of the attribute whose value is to be set.\nThe attribute name is automatically converted to all lower-case when setAttribute() is called on an HTML element in an HTML document.", + "value": "A trusted type or string containing the value to assign to the attribute.\n

    Trusted type instances must be passed for the following attributes when trusted types are enforced:\n

    \n

    Trusted types are not enforced for other attributes, so a string or any trusted type may be passed.\n

    A specified non-string value specified is converted automatically into a string.\n

    Boolean attributes are considered to be true if they're present on the element at all.\nYou should set value to the empty string (\"\") or the attribute's name, with no leading or trailing whitespace.\nSee the example below for a practical demonstration." }, "returns": "None (undefined).", "throws": { - "InvalidCharacterError DOMException": "Thrown if the name value is not a valid XML name; for example, it starts with a number, a hyphen, or a period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods." + "InvalidCharacterError DOMException": "Thrown if the name value is not a valid XML name.\nFor example, if it starts with a number, a hyphen, or a period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods.", + "TypeError": "Thrown if value is passed a string instead of a trusted type object (for those attributes that require them) when Trusted Types are enforced by a CSP and no default policy is defined." } }, "element.setattributenode": { @@ -3346,11 +3353,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "setAttributeNS adds a new attribute or changes the value of an attribute\nwith the given namespace and name.\n

    If you are working with HTML documents and you don't need to specify the requested attribute as being part of a specific namespace, use the setAttribute() method instead.", + "doc": "

    \n

    Warning:\nThis method can take attribute values that are parsed as HTML, a script, or as a script URL, depending on the attribute.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the value originally came from an attacker.\n

    You can mitigate this risk by always passing the appropriate trusted type object (TrustedHTML, TrustedScript, or TrustedScriptURL) instead of strings for those attributes that require them, and enforcing trusted types.\nSee Security considerations in Element.setAttribute() for more information.\n

    \n

    The setAttributeNS() method of the Element interface adds a new attribute or changes the value of an attribute with the given namespace and name.\n

    If you are working with HTML documents and you don't need to specify the requested attribute as being part of a specific namespace, use the setAttribute() method instead.\n

    Note that setAttributeNS() is the only method for namespaced attributes which expects the fully qualified name, i.e., \"namespace:local-name\".", "parameters": { "namespace": "A string specifying the namespace of the attribute.", - "name": "A string identifying the attribute by its qualified name;\nthat is, a namespace prefix followed by a colon followed by a local name.", - "value": "The desired string value of the new attribute." + "name": "A string identifying the attribute by its qualified name; that is, a namespace prefix followed by a colon followed by a local name.", + "value": "A trusted type or string containing the value to assign to the attribute.\n

    Trusted type instances must be passed for the following attributes when trusted types are enforced:\n

    \n

    Trusted types are not enforced for other attributes, so a string or any trusted type may be passed." }, "returns": "None (undefined)." }, @@ -3372,21 +3379,26 @@ "element.sethtml": { "url": "$MDN_URL$/web/api/element/sethtml", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The setHTML() method of the Element interface provides an XSS-safe method to parse and sanitize a string of HTML into a DocumentFragment, and then insert it into the DOM as a subtree of the element.", + "doc": "The setHTML() method of the Element interface provides an XSS-safe method to parse and sanitize a string of HTML and insert it into the DOM as a subtree of the element.\n

    The method removes any elements and attributes that are considered XSS-unsafe, even if allowed by a passed sanitizer.\nNotably, the following elements are always removed: <script>, <frame>, <iframe>, <embed>, <object>, <use>, and event handler attributes.\n

    It is recommended (if supported) as a drop-in replacement for Element.innerHTML when setting a user-provided string of HTML.", "parameters": { "input": "A string defining HTML to be sanitized and injected into the element.", - "options": "An options object with the following optional parameters:\n

    \n
    sanitizer
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed, or the string \"default\" for the default configuration.\nNote that generally a Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to be reused.\nIf not specified, the default sanitizer configuration is used.\n

    \n
    " + "options": "An options object with the following optional parameters:\n
    \n
    sanitizer
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed, or the string \"default\" for the default configuration.\nThe method will remove any XSS-unsafe elements and attributes, even if allowed by the sanitizer.\n

    Note that generally a Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to be reused.\nIf not specified, the default sanitizer configuration is used.\n

    \n
    " }, "returns": "None (undefined).", "throws": { - "TypeError": "This is thrown if options.sanitizer is passed a:\n" + "TypeError": "This is thrown if options.sanitizer is passed a:\n" } }, "element.sethtmlunsafe": { @@ -3408,14 +3420,14 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nElement.setHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The setHTMLUnsafe() method of the Element interface is used to parse HTML input into a DocumentFragment, optionally filtering out unwanted elements and attributes, and those that don't belong in the context, and then using it to replace the element's subtree in the DOM.", + "doc": "

    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nElement.setHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The setHTMLUnsafe() method of the Element interface is used to parse HTML input into a DocumentFragment, optionally filtering out unwanted elements and attributes, and those that don't belong in the context, and then using it to replace the element's subtree in the DOM.", "parameters": { "input": "A TrustedHTML instance or string defining HTML to be parsed.", "options": "An options object with the following optional parameters:\n

    \n
    sanitizer Optional
    \n
    \n

    A Sanitizer or SanitizerConfig object that defines what elements of the input will be allowed or removed.\nThis can also be a string with the value \"default\", which applies a Sanitizer with the default (XSS-safe) configuration.\nIf not specified, no sanitizer is used.\n

    Note that generally a Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to reused.\n

    \n
    " }, "returns": "None (undefined).", "throws": { - "TypeError": "This is thrown if:\n" + "TypeError": "This is thrown if:\n" } }, "element.setpointercapture": { @@ -4730,7 +4742,7 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "The role read-only property of the ElementInternals interface returns the WAI-ARIA role for the element. For example, a checkbox might have role=\"checkbox\". It reflects the role attribute; it does not return the element's implicit ARIA role, if any, unless explicitly set." + "doc": "The role property of the ElementInternals interface returns the WAI-ARIA role for the element. For example, a checkbox might have role=\"checkbox\". It reflects the role attribute; it does not return the element's implicit ARIA role, if any, unless explicitly set." }, "elementinternals.setformvalue": { "url": "$MDN_URL$/web/api/elementinternals/setformvalue", @@ -4784,7 +4796,7 @@ }, "doc": "The setValidity() method of the ElementInternals interface sets the validity of the element.", "parameters": { - "flags": "A dictionary object containing one or more flags indicating the validity state of the element:\n
    \n
    valueMissing
    \n
    \n

    A boolean value that is true if the element has a required attribute, but no value, or false otherwise. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    typeMismatch
    \n
    \n

    A boolean value that is true if the value is not in the required syntax (when type is email or url), or false if the syntax is correct. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    patternMismatch
    \n
    \n

    A boolean value that is true if the value does not match the specified pattern, and false if it does match. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    tooLong
    \n
    \n

    A boolean value that is true if the value exceeds the specified maxlength for HTMLInputElement or HTMLTextAreaElement objects, or false if its length is less than or equal to the maximum length. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    tooShort
    \n
    \n

    A boolean value that is true if the value fails to meet the specified minlength for HTMLInputElement or HTMLTextAreaElement objects, or false if its length is greater than or equal to the minimum length. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    rangeUnderflow
    \n
    \n

    A boolean value that is true if the value is less than the minimum specified by the min attribute, or false if it is greater than or equal to the minimum. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    rangeOverflow
    \n
    \n

    A boolean value that is true if the value is greater than the maximum specified by the max attribute, or false if it is less than or equal to the maximum. If true, the element matches the :invalid and :out-of-range and CSS pseudo-classes.\n

    \n
    stepMismatch
    \n
    \n

    A boolean value that is true if the value does not fit the rules determined by the step attribute (that is, it's not evenly divisible by the step value), or false if it does fit the step rule. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    badInput
    \n
    \n

    A boolean value that is true if the user has provided input that the browser is unable to convert.\n

    \n
    customError
    \n
    \n

    A boolean value indicating whether the element's custom validity message has been set to a non-empty string by calling the element's setCustomValidity() method.\n

    \n
    \n
    \n

    Note:\nTo set all flags to false, indicating that this element passes all constraints validation, pass in an empty object {}. In this case, you do not need to also pass a message.\n

    ", + "flags": "A dictionary object containing one or more flags indicating the validity state of the element:\n
    \n
    valueMissing
    \n
    \n

    A boolean value that is true if the element has a required attribute, but no value, or false otherwise. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    typeMismatch
    \n
    \n

    A boolean value that is true if the value is not in the required syntax (when type is email or url), or false if the syntax is correct. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    patternMismatch
    \n
    \n

    A boolean value that is true if the value does not match the specified pattern, and false if it does match. If true, the element matches the :invalid CSS pseudo-class.\n

    \n
    tooLong
    \n
    \n

    A boolean value that is true if the value exceeds the specified maxlength for HTMLInputElement or HTMLTextAreaElement objects, or false if its length is less than or equal to the maximum length. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    tooShort
    \n
    \n

    A boolean value that is true if the value fails to meet the specified minlength for HTMLInputElement or HTMLTextAreaElement objects, or false if its length is greater than or equal to the minimum length. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    rangeUnderflow
    \n
    \n

    A boolean value that is true if the value is less than the minimum specified by the min attribute, or false if it is greater than or equal to the minimum. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    rangeOverflow
    \n
    \n

    A boolean value that is true if the value is greater than the maximum specified by the max attribute, or false if it is less than or equal to the maximum. If true, the element matches the :invalid and :out-of-range and CSS pseudo-classes.\n

    \n
    stepMismatch
    \n
    \n

    A boolean value that is true if the value does not fit the rules determined by the step attribute (that is, it's not evenly divisible by the step value), or false if it does fit the step rule. If true, the element matches the :invalid and :out-of-range CSS pseudo-classes.\n

    \n
    badInput
    \n
    \n

    A boolean value that is true if the user has provided input that the browser is unable to convert.\n

    \n
    customError
    \n
    \n

    A boolean value indicating whether the element's custom validity message has been set to a non-empty string by calling the element's setCustomValidity() method.\n

    \n
    \n
    \n

    Note:\nTo set all flags to false, indicating that this element passes all constraints validation, pass in an empty object {}. In this case, you do not need to also pass a message.\n

    ", "message": "A string containing a message, which will be set if any flags are true. This parameter is only optional if all flags are false.", "anchor": "An HTMLElement which can be used by the user agent to report problems with this form submission." }, @@ -5641,7 +5653,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The preventDefault() method of the Event interface tells the user agent that the event is being explicitly handled, so its default action, such as page scrolling, link navigation, or pasting text, should not be taken.\n

    The event continues to propagate as usual,\nunless one of its event listeners calls\nstopPropagation()\nor stopImmediatePropagation(),\neither of which terminates propagation at once.\n

    As noted below, calling preventDefault() for a\nnon-cancelable event, such as one dispatched via\nEventTarget.dispatchEvent(), without specifying\ncancelable: true has no effect.\n

    If a passive listener calls preventDefault(), nothing will happen and a console warning may be generated.\n

    \n

    Note:\nLook for better alternatives than using preventDefault() to block default actions. For example, you can use the disabled or readonly attribute on a form control to prevent it from being interacted with, use HTML constraint validation to reject invalid input, or use the overflow property to prevent scrolling.\n

    ", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The preventDefault() method of the Event interface tells the user agent that the event is being explicitly handled, so its default action, such as page scrolling, link navigation, or pasting text, should not be taken.\n

    The event continues to propagate as usual,\nunless one of its event listeners calls\nstopPropagation()\nor stopImmediatePropagation(),\neither of which terminates propagation at once.\n

    As noted below, calling preventDefault() for a\nnon-cancelable event, such as one dispatched via\nEventTarget.dispatchEvent(), without specifying\ncancelable: true has no effect.\n

    If a passive listener calls preventDefault(), nothing will happen and a console warning may be generated.\n

    \n

    Note:\nLook for better alternatives than using preventDefault() to block default actions. For example, you can use the disabled or readonly attribute on a form control to prevent it from being interacted with, use HTML constraint validation to reject invalid input, or use the overflow property to prevent scrolling.\n

    ", "returns": "None (undefined)." }, "event.returnvalue": { @@ -5817,10 +5829,13 @@ "Edge": "85", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "71" + "Opera": "71", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The EventCounts interface of the Performance API provides the number of events that have been dispatched for each event type.\n

    An EventCounts instance is a read-only Map-like object, in which each key is the name string for an event type, and the corresponding value is an integer indicating the number of events that have been dispatched for that event type." }, @@ -6126,7 +6141,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ExtendableCookieChangeEvent interface of the Cookie Store API is the event type passed to cookiechange event fired at the ServiceWorkerGlobalScope when any cookie changes occur which match the service worker's cookie change subscription list. A cookie change event consists of a cookie and a type (either \"changed\" or \"deleted\").\n

    Cookie changes that cause the ExtendableCookieChangeEvent to be dispatched are:\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ExtendableCookieChangeEvent interface of the Cookie Store API is the event type passed to cookiechange event fired at the ServiceWorkerGlobalScope when any cookie changes occur which match the service worker's cookie change subscription list. A cookie change event consists of a cookie and a type (either \"changed\" or \"deleted\").\n

    Cookie changes that cause the ExtendableCookieChangeEvent to be dispatched are:\n

    " }, "extendablecookiechangeevent.changed": { "url": "$MDN_URL$/web/api/extendablecookiechangeevent/changed", @@ -6144,7 +6159,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The changed read-only property of the ExtendableCookieChangeEvent interface returns any cookies that have been changed by the given ExtendableCookieChangeEvent instance." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The changed read-only property of the ExtendableCookieChangeEvent interface returns any cookies that have been changed by the given ExtendableCookieChangeEvent instance." }, "extendablecookiechangeevent.deleted": { "url": "$MDN_URL$/web/api/extendablecookiechangeevent/deleted", @@ -6162,7 +6177,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The deleted read-only property of the ExtendableCookieChangeEvent interface returns any cookies that have been deleted by the given ExtendableCookieChangeEvent instance." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The deleted read-only property of the ExtendableCookieChangeEvent interface returns any cookies that have been deleted by the given ExtendableCookieChangeEvent instance." }, "extendablecookiechangeevent.extendablecookiechangeevent": { "url": "$MDN_URL$/web/api/extendablecookiechangeevent/extendablecookiechangeevent", @@ -6180,7 +6195,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ExtendableCookieChangeEvent() constructor creates a new ExtendableCookieChangeEvent object\nwhich is the event type passed to cookiechange event fired at the ServiceWorkerGlobalScope when any cookie changes occur which match the service worker's cookie change subscription list.\nThis constructor is called by the browser when a change event occurs.\n

    \n

    Note:\nThis event constructor is generally not needed for production websites. It's primary use is for tests that require an instance of this event.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ExtendableCookieChangeEvent() constructor creates a new ExtendableCookieChangeEvent object\nwhich is the event type passed to cookiechange event fired at the ServiceWorkerGlobalScope when any cookie changes occur which match the service worker's cookie change subscription list.\nThis constructor is called by the browser when a change event occurs.\n

    \n

    Note:\nThis event constructor is generally not needed for production websites. It's primary use is for tests that require an instance of this event.\n

    ", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to cookiechange.", "options": "An object that, in addition of the properties defined in ExtendableEvent(), can have the following properties:\n
    \n
    changed Optional
    \n
    \n

    An array containing a changed cookie.\n

    \n
    deleted Optional
    \n
    \n

    An array containing a deleted cookie.\n

    \n
    " @@ -6435,7 +6450,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper interface represents an instance of an eyedropper tool that can be opened and used by the user to select colors from the screen." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper interface represents an instance of an eyedropper tool that can be opened and used by the user to select colors from the screen." }, "eyedropper.eyedropper": { "url": "$MDN_URL$/web/api/eyedropper/eyedropper", @@ -6451,7 +6466,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper() constructor returns a new EyeDropper object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper() constructor returns a new EyeDropper object." }, "eyedropper.open": { "url": "$MDN_URL$/web/api/eyedropper/open", @@ -6467,7 +6482,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper.open() method starts the eyedropper mode, returning a promise which is fulfilled once the user has selected a color and exited the eyedropper mode.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The EyeDropper.open() method starts the eyedropper mode, returning a promise which is fulfilled once the user has selected a color and exited the eyedropper mode.", "parameters": { "options": "An options object to pass an AbortSignal signal:\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal. The eyedropper mode will be aborted when the AbortSignal's abort() method is called.\n

    \n
    " }, @@ -6575,7 +6590,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The FederatedCredential interface of the Credential Management API provides information about credentials from a federated identity provider. A federated identity provider is an entity that a website trusts to correctly authenticate a user, and that provides an API for that purpose. OpenID Connect is an example of a federated identity provider framework.\n

    \n

    Note:\nThe Federated Credential Management API (FedCM) provides a more complete solution for handling identity federation in the browser, and uses the IdentityCredential type.\n

    \n

    In browsers that support it, an instance of this interface may be passed in the credential member of the init object for global fetch()." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The FederatedCredential interface of the Credential Management API provides information about credentials from a federated identity provider. A federated identity provider is an entity that a website trusts to correctly authenticate a user, and that provides an API for that purpose. OpenID Connect is an example of a federated identity provider framework.\n

    \n

    Note:\nThe Federated Credential Management API (FedCM) provides a more complete solution for handling identity federation in the browser, and uses the IdentityCredential type.\n

    \n

    In browsers that support it, an instance of this interface may be passed in the credential member of the init object for global fetch()." }, "federatedcredential.federatedcredential": { "url": "$MDN_URL$/web/api/federatedcredential/federatedcredential", @@ -6592,7 +6607,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The FederatedCredential() constructor creates a new FederatedCredential object. In supporting browsers, an instance of this class may be passed the credential received from the init object for global fetch().", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The FederatedCredential() constructor creates a new FederatedCredential object. In supporting browsers, an instance of this class may be passed the credential received from the init object for global fetch().", "parameters": { "data": "A FederatedCredentialInit object. An object with the following properties:\n

    \n
    name Optional
    \n
    \n

    A string representing the credential username.\n

    \n
    iconURL Optional
    \n
    \n

    A string representing the URL of an icon or avatar to be associated with the credential.\n

    \n
    origin
    \n
    \n

    A string representing the credential's origin. FederatedCredential objects are origin-bound, so they will only be usable on the origin specified here.\n

    \n
    provider
    \n
    \n

    A string which identifies the credentials' federated identity provider, specified as the origin that the provider uses to sign users in (for example \"https://www.facebook.com\" or \"https://accounts.google.com\").\n

    \n
    protocol Optional
    \n
    \n

    A string representing the protocol of the credentials' federated identity provider (for example, \"openidconnect\").\n

    \n
    " } @@ -6612,7 +6627,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The protocol property of the\nFederatedCredential interface returns a read-only\nstring containing a credential's federated identity protocol. If this\nproperty is null, the protocol may be inferred from the\nFederatedCredential.provider property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The protocol property of the\nFederatedCredential interface returns a read-only\nstring containing a credential's federated identity protocol. If this\nproperty is null, the protocol may be inferred from the\nFederatedCredential.provider property." }, "federatedcredential.provider": { "url": "$MDN_URL$/web/api/federatedcredential/provider", @@ -6629,7 +6644,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The provider property of the\nFederatedCredential interface returns a string\ncontaining a credential's federated identity provider." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The provider property of the\nFederatedCredential interface returns a string\ncontaining a credential's federated identity provider." }, "federatedcredentialinit": { "url": "$MDN_URL$/web/api/federatedcredentialinit", @@ -6780,8 +6795,8 @@ "returns": "A Promise that resolves to a Response object.", "throws": { "AbortError DOMException": "The request was aborted due to a call to the AbortController\nabort() method.", - "NotAllowedError DOMException": "Thrown if use of the Topics API is specifically disallowed by a browsing-topics Permissions Policy, and a fetch() request was made with browsingTopics: true.", - "TypeError": "Can occur for the following reasons:\n

    " + "NotAllowedError DOMException": "Thrown if:\n", + "TypeError": "Can occur for the following reasons:\n" } }, "fetchevent": { @@ -7005,7 +7020,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The FetchLaterResult interface of the fetchLater() API is returned by the Window.fetchLater() method after a deferred fetch has been created.\n

    It contains a single activated property that indicates whether the deferred request has been sent out or not.\n

    After a successful sending, the whole response is ignored — including body and headers — so the response of the deferred fetch is never returned to the FetchLaterResult interface." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The FetchLaterResult interface of the Fetch API is returned by the Window.fetchLater() method after a deferred fetch has been created.\n

    It contains a single activated property that indicates whether the deferred request has been sent out or not.\n

    After a successful sending, the whole response is ignored — including body and headers — so the response of the deferred fetch is never returned to the FetchLaterResult interface." }, "fetchlaterresult.activated": { "url": "$MDN_URL$/web/api/fetchlaterresult/activated", @@ -7145,7 +7160,7 @@ ], "compatibility": { "Chrome": "13", - "ChromeAndroid": "", + "ChromeAndroid": "18", "Edge": "13", "Firefox": "50", "FirefoxAndroid": "142", @@ -7153,6 +7168,10 @@ "Safari": "11.1", "SafariIOS": "11.3" }, + "baseline": { + "level": "LOW", + "lowDate": "2025-08-19" + }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The webkitRelativePath read-only property of the File interface\ncontains a string which specifies the file's path relative to the\ndirectory selected by the user in an <input> element with its\nwebkitdirectory attribute set." }, "fileentrysync": { @@ -7843,7 +7862,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemDirectoryHandle interface of the File System API provides a handle to a file system directory.\n

    The interface can be accessed via the window.showDirectoryPicker(), StorageManager.getDirectory(), DataTransferItem.getAsFileSystemHandle(), and FileSystemDirectoryHandle.getDirectoryHandle() methods." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemDirectoryHandle interface of the File System API provides a handle to a file system directory.\n

    The interface can be accessed via the window.showDirectoryPicker(), StorageManager.getDirectory(), DataTransferItem.getAsFileSystemHandle(), and FileSystemDirectoryHandle.getDirectoryHandle() methods." }, "filesystemdirectoryhandle.entries": { "url": "$MDN_URL$/web/api/filesystemdirectoryhandle/entries", @@ -7865,7 +7884,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The entries() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the key-value pairs of the entries within the FileSystemDirectoryHandle\non which this method is called. The key-value pairs are\nin the form of an array like [key, value].", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The entries() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the key-value pairs of the entries within the FileSystemDirectoryHandle\non which this method is called. The key-value pairs are\nin the form of an array like [key, value].", "returns": "A new asynchronous iterator containing the key-value pairs of each entry within the FileSystemDirectoryHandle.", "throws": { "NotAllowedError DOMException": "Thrown if the PermissionStatus.state for the handle is not 'granted' in read mode.", @@ -7892,7 +7911,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDirectoryHandle() method of the\nFileSystemDirectoryHandle interface returns a\nFileSystemDirectoryHandle for a subdirectory with the specified name\nwithin the directory handle on which the method is called.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDirectoryHandle() method of the\nFileSystemDirectoryHandle interface returns a\nFileSystemDirectoryHandle for a subdirectory with the specified name\nwithin the directory handle on which the method is called.", "parameters": { "name": "A string representing the FileSystemHandle.name of\nthe subdirectory you wish to retrieve.", "options": "An optional object containing options for the retrieved subdirectory. Options are as\nfollows:\n

    \n
    create Optional
    \n
    \n

    A boolean value, which defaults to false. When\nset to true if the directory is not found, one with the specified\nname will be created and returned.\n

    \n
    " @@ -7925,7 +7944,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getFileHandle() method of the\nFileSystemDirectoryHandle interface returns a\nFileSystemFileHandle for a file with the specified name, within the\ndirectory the method is called.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getFileHandle() method of the\nFileSystemDirectoryHandle interface returns a\nFileSystemFileHandle for a file with the specified name, within the\ndirectory the method is called.", "parameters": { "name": "A string representing the FileSystemHandle.name of\nthe file you wish to retrieve.", "options": "An object with the following properties:\n

    \n
    create Optional
    \n
    \n

    A Boolean. Default false. When\nset to true if the file is not found, one with the specified name\nwill be created and returned.\n

    \n
    " @@ -7958,7 +7977,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the key of the entries within the FileSystemDirectoryHandle\non which this method is called.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The keys() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the key of the entries within the FileSystemDirectoryHandle\non which this method is called.", "returns": "A new asynchronous iterator containing the keys of each entry within the FileSystemDirectoryHandle.", "throws": { "NotAllowedError DOMException": "Thrown if the PermissionStatus.state for the handle is not 'granted' in read mode.", @@ -7985,7 +8004,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The removeEntry() method of the\nFileSystemDirectoryHandle interface attempts to remove an entry if the\ndirectory handle contains a file or directory called the name specified.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The removeEntry() method of the\nFileSystemDirectoryHandle interface attempts to remove an entry if the\ndirectory handle contains a file or directory called the name specified.", "parameters": { "name": "A string representing the FileSystemHandle.name of\nthe entry you wish to remove.", "options": "An optional object containing options, which are as follows:\n

    \n
    recursive Optional
    \n
    \n

    A boolean value, which defaults to false. When set to true entries will be removed recursively.\n

    \n
    " @@ -8018,7 +8037,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The resolve() method of the\nFileSystemDirectoryHandle interface returns an Array of\ndirectory names from the parent handle to the specified child entry, with the name of\nthe child entry as the last array item.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The resolve() method of the\nFileSystemDirectoryHandle interface returns an Array of\ndirectory names from the parent handle to the specified child entry, with the name of\nthe child entry as the last array item.", "parameters": { "possibleDescendant": "The FileSystemHandle from which to return the relative path." }, @@ -8044,7 +8063,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The values() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the value of the entries within the FileSystemDirectoryHandle\non which this method is called.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The values() method of the\nFileSystemDirectoryHandle interface returns a new asynchronous iterator\nfor the iteration of the value of the entries within the FileSystemDirectoryHandle\non which this method is called.", "returns": "A new asynchronous iterator containing the handles of each entry within the FileSystemDirectoryHandle.", "throws": { "NotAllowedError DOMException": "Thrown if the PermissionStatus.state for the handle is not 'granted' in read mode.", @@ -8408,7 +8427,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemFileHandle interface of the File System API represents a handle to a file system entry. The interface is accessed through the window.showOpenFilePicker() method.\n

    Note that read and write operations depend on file-access permissions that do not persist after a page refresh if no other tabs for that origin remain open. The queryPermission method of the FileSystemHandle interface can be used to verify permission state before accessing a file." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemFileHandle interface of the File System API represents a handle to a file system entry. The interface is accessed through the window.showOpenFilePicker() method.\n

    Note that read and write operations depend on file-access permissions that do not persist after a page refresh if no other tabs for that origin remain open. The queryPermission method of the FileSystemHandle interface can be used to verify permission state before accessing a file." }, "filesystemfilehandle.createsyncaccesshandle": { "url": "$MDN_URL$/web/api/filesystemfilehandle/createsyncaccesshandle", @@ -8430,7 +8449,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The createSyncAccessHandle() method of the\nFileSystemFileHandle interface returns a Promise which resolves to a FileSystemSyncAccessHandle object\nthat can be used to synchronously read from and write to a file. The synchronous nature of this method brings performance advantages,\nbut it is only usable inside dedicated Web Workers for files within the origin private file system.\n

    Creating a FileSystemSyncAccessHandle takes an exclusive lock on the file associated with the file handle. This prevents the creation of further FileSystemSyncAccessHandles or FileSystemWritableFileStreams for the file until the existing access handle is closed.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The createSyncAccessHandle() method of the\nFileSystemFileHandle interface returns a Promise which resolves to a FileSystemSyncAccessHandle object\nthat can be used to synchronously read from and write to a file. The synchronous nature of this method brings performance advantages,\nbut it is only usable inside dedicated Web Workers for files within the origin private file system.\n

    Creating a FileSystemSyncAccessHandle takes an exclusive lock on the file associated with the file handle. This prevents the creation of further FileSystemSyncAccessHandles or FileSystemWritableFileStreams for the file until the existing access handle is closed.", "parameters": { "options": "An object with the following properties:\n

    \n
    mode Optional
    \n
    \n

    A string specifying the locking mode for the access handle. The default value is \"readwrite\".\nPossible values are:\n

    \n
    \"read-only\"
    \n
    \n

    Multiple FileSystemSyncAccessHandle objects can be opened simultaneously on a file (for example when using the same app in multiple tabs), provided they are all opened in \"read-only\" mode. Once opened, read-like methods can be called on the handles — read(), getSize(), and close().\n

    \n
    \"readwrite\"
    \n
    \n

    Only one FileSystemSyncAccessHandle object can be opened on a file. Attempting to open subsequent handles before the first handle is closed results in a NoModificationAllowedError exception being thrown. Once opened, any available method can be called on the handle.\n

    \n
    \"readwrite-unsafe\"
    \n
    \n

    Multiple FileSystemSyncAccessHandle objects can be opened simultaneously on a file, provided they are all opened in \"readwrite-unsafe\" mode. Once opened, any available method can be called on the handles.\n

    \n
    \n
    \n
    " }, @@ -8461,7 +8480,7 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createWritable() method of the FileSystemFileHandle interface creates a FileSystemWritableFileStream that can be used to write to a file.\nThe method returns a Promise which resolves to this created stream.\n

    Any changes made through the stream won't be reflected in the file represented by the file handle until the stream has been closed.\nThis is typically implemented by writing data to a temporary file, and only replacing the file represented by file handle with the temporary file when the writable file stream is closed.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createWritable() method of the FileSystemFileHandle interface creates a FileSystemWritableFileStream that can be used to write to a file.\nThe method returns a Promise which resolves to this created stream.\n

    Any changes made through the stream won't be reflected in the file represented by the file handle until the stream has been closed.\nThis is typically implemented by writing data to a temporary file, and only replacing the file represented by file handle with the temporary file when the writable file stream is closed.", "parameters": { "options": "An object with the following properties:\n

    \n
    keepExistingData Optional
    \n
    \n

    A Boolean. Default false.\nWhen set to true if the file exists, the existing file is first copied to the temporary file.\nOtherwise the temporary file starts out empty.\n

    \n
    mode Optional
    \n
    \n

    A string specifying the locking mode for the writable file stream. The default value is \"siloed\".\nPossible values are:\n

    \n
    \"exclusive\"
    \n
    \n

    Only one FileSystemWritableFileStream writer can be opened. Attempting to open subsequent writers before the first writer is closed results in a NoModificationAllowedError exception being thrown.\n

    \n
    \"siloed\"
    \n
    \n

    Multiple FileSystemWritableFileStream writers can be opened at the same time, each with its own swap file, for example when using the same app in multiple tabs. The last writer opened has its data written, as the data gets flushed when each writer is closed.\n

    \n
    \n
    \n
    " }, @@ -8493,7 +8512,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getFile() method of the\nFileSystemFileHandle interface returns a Promise which resolves to a\nFile object representing the state on disk of the entry represented by the handle.\n

    If the file on disk changes or is removed after this method is called, the returned\nFile object will likely be no longer readable.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getFile() method of the\nFileSystemFileHandle interface returns a Promise which resolves to a\nFile object representing the state on disk of the entry represented by the handle.\n

    If the file on disk changes or is removed after this method is called, the returned\nFile object will likely be no longer readable.", "returns": "A Promise which resolves to a File object.", "throws": { "NotAllowedError DOMException": "Thrown if the PermissionStatus.state is not granted in read mode.", @@ -8520,7 +8539,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemHandle interface of the File System API is an object which represents a file or directory entry. Multiple handles can represent the same entry. For the most part you do not work with FileSystemHandle directly but rather its child interfaces FileSystemFileHandle and FileSystemDirectoryHandle." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemHandle interface of the File System API is an object which represents a file or directory entry. Multiple handles can represent the same entry. For the most part you do not work with FileSystemHandle directly but rather its child interfaces FileSystemFileHandle and FileSystemDirectoryHandle." }, "filesystemhandle.issameentry": { "url": "$MDN_URL$/web/api/filesystemhandle/issameentry", @@ -8542,7 +8561,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isSameEntry() method of the\nFileSystemHandle interface compares two handles to see if the associated entries (either a file or directory) match.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isSameEntry() method of the\nFileSystemHandle interface compares two handles to see if the associated entries (either a file or directory) match.", "parameters": { "FileSystemHandle": "The FileSystemHandle to match against the handle on which the method is\ninvoked." }, @@ -8568,7 +8587,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The kind read-only property of the\nFileSystemHandle interface returns the type of entry. This is\n'file' if the associated entry is a file or 'directory'. It is\nused to distinguish files from directories when iterating over the contents of a\ndirectory." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The kind read-only property of the\nFileSystemHandle interface returns the type of entry. This is\n'file' if the associated entry is a file or 'directory'. It is\nused to distinguish files from directories when iterating over the contents of a\ndirectory." }, "filesystemhandle.name": { "url": "$MDN_URL$/web/api/filesystemhandle/name", @@ -8590,7 +8609,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The name read-only property of the\nFileSystemHandle interface returns the name of the entry represented by\nhandle." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The name read-only property of the\nFileSystemHandle interface returns the name of the entry represented by\nhandle." }, "filesystemhandle.querypermission": { "url": "$MDN_URL$/web/api/filesystemhandle/querypermission", @@ -8607,7 +8626,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The queryPermission() method of the\nFileSystemHandle interface queries the current permission state of the\ncurrent handle.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The queryPermission() method of the\nFileSystemHandle interface queries the current permission state of the\ncurrent handle.", "parameters": { "descriptor": "An object which specifies the permission mode to query for. Options are as follows:\n

    \n
    'mode' Optional
    \n
    \n

    Can be either 'read', 'write', or 'readwrite'.\n

    \n
    " }, @@ -8627,7 +8646,7 @@ "Edge": "110", "Opera": "96" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The remove() method of the FileSystemHandle interface requests removal of the entry represented by the handle from the underlying file system.\n

    The remove() method allows you to remove a file or directory directly from its handle. Without this method, you would have to obtain the handle of the parent directory, then call FileSystemDirectoryHandle.removeEntry() on that to remove it.\n

    You can also call remove() on the root directory of the Origin Private File System to clear its contents, after which a new empty OPFS is created.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The remove() method of the FileSystemHandle interface requests removal of the entry represented by the handle from the underlying file system.\n

    The remove() method allows you to remove a file or directory directly from its handle. Without this method, you would have to obtain the handle of the parent directory, then call FileSystemDirectoryHandle.removeEntry() on that to remove it.\n

    You can also call remove() on the root directory of the Origin Private File System to clear its contents, after which a new empty OPFS is created.", "parameters": { "options": "An object that specifies options for the removal. Possible properties are as follows:\n

    \n
    recursive Optional
    \n
    \n

    A boolean value that defaults to false. When set to true and the entry is a directory, its contents will be removed recursively.\n

    \n
    " }, @@ -8654,14 +8673,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestPermission() method of the\nFileSystemHandle interface requests read or readwrite permissions for the\nfile handle.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestPermission() method of the\nFileSystemHandle interface requests read or readwrite permissions for the\nfile handle.", "parameters": { "descriptor": "An object which specifies the permission mode to query for. Options are as follows:\n

    \n
    'mode' Optional
    \n
    \n

    Can be either 'read', 'write', or 'readwrite'.\n

    \n
    " }, "returns": "A Promise that resolves with PermissionStatus.state which is one of 'granted', 'denied' or 'prompt'. It may also reject with one of the exceptions below.", "throws": { "TypeError": "Thrown if no parameter is specified or the mode is not that of\n'read', 'write', or 'readwrite'", - "SecurityError DOMException": "Thrown in one of the following cases:\n" + "SecurityError DOMException": "Thrown in one of the following cases:\n" } }, "filesystemobserver": { @@ -8674,7 +8693,7 @@ "Edge": "133", "Opera": "118" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The FileSystemObserver interface of the File System API provides a mechanism to observe changes to the user-observable file system and the Origin Private File System (OPFS). This means web applications don't have to poll the file system to find changes in the files or folder structure, which can be time-consuming and wasteful." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The FileSystemObserver interface of the File System API provides a mechanism to observe changes to the user-observable file system and the Origin Private File System (OPFS). This means web applications don't have to poll the file system to find changes in the files or folder structure, which can be time-consuming and wasteful." }, "filesystemobserver.disconnect": { "url": "$MDN_URL$/web/api/filesystemobserver/disconnect", @@ -8686,7 +8705,7 @@ "Edge": "133", "Opera": "118" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The disconnect() method of the\nFileSystemObserver interface stops the observer observing the file system.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The disconnect() method of the\nFileSystemObserver interface stops the observer observing the file system.", "returns": "None (undefined)." }, "filesystemobserver.filesystemobserver": { @@ -8715,7 +8734,7 @@ "Edge": "133", "Opera": "118" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The observe() method of the\nFileSystemObserver interface asks the observer to start observing changes to a given file or directory.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The observe() method of the\nFileSystemObserver interface asks the observer to start observing changes to a given file or directory.", "parameters": { "handle": "The handle of the file system entry representing the file or directory to observe.\n

    ", "options": "An object specifying options for the observe() call. This can contain the following properties:\n
    \n
    recursive
    \n
    \n

    A boolean specifying whether you want to observe changes to a directory recursively. If set to true, changes are observed in the directory itself and all contained subdirectories and files. If set to false, changes are only observed in the directory itself and directly contained files (that is, files in subdirectories are excluded). Defaults to false.\n

    This property has no effect if handle represents a file.\n

    \n
    " @@ -8758,7 +8777,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The FileSystemSyncAccessHandle interface of the File System API represents a synchronous handle to a file system entry.\n

    This class is only accessible inside dedicated Web Workers (so that its methods do not block execution on the main thread) for files within the origin private file system, which is not visible to end-users.\n

    As a result, its methods are not subject to the same security checks as methods running on files within the user-visible file system, and so are much more performant. This makes them suitable for significant, large-scale file updates such as SQLite database modifications.\n

    The interface is accessed through the FileSystemFileHandle.createSyncAccessHandle() method.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The FileSystemSyncAccessHandle interface of the File System API represents a synchronous handle to a file system entry.\n

    This class is only accessible inside dedicated Web Workers (so that its methods do not block execution on the main thread) for files within the origin private file system, which is not visible to end-users.\n

    As a result, its methods are not subject to the same security checks as methods running on files within the user-visible file system, and so are much more performant. This makes them suitable for significant, large-scale file updates such as SQLite database modifications.\n

    The interface is accessed through the FileSystemFileHandle.createSyncAccessHandle() method.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    " }, "filesystemsyncaccesshandle.close": { "url": "$MDN_URL$/web/api/filesystemsyncaccesshandle/close", @@ -8780,7 +8799,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The close() method of the\nFileSystemSyncAccessHandle interface closes an open synchronous file handle, disabling any further operations on it and releasing the exclusive lock previously put on the file associated with the file handle.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The close() method of the\nFileSystemSyncAccessHandle interface closes an open synchronous file handle, disabling any further operations on it and releasing the exclusive lock previously put on the file associated with the file handle.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", "returns": "None (undefined)." }, "filesystemsyncaccesshandle.flush": { @@ -8803,7 +8822,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The flush() method of the\nFileSystemSyncAccessHandle interface persists any changes made to the file associated with the handle via the write() method to disk.\n

    Bear in mind that you only need to call this method if you need the changes committed to disk at a specific time, otherwise you can leave the underlying operating system to handle this when it sees fit, which should be OK in most cases.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The flush() method of the\nFileSystemSyncAccessHandle interface persists any changes made to the file associated with the handle via the write() method to disk.\n

    Bear in mind that you only need to call this method if you need the changes committed to disk at a specific time, otherwise you can leave the underlying operating system to handle this when it sees fit, which should be OK in most cases.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the associated access handle is already closed." @@ -8829,7 +8848,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The getSize() method of the\nFileSystemSyncAccessHandle interface returns the size of the file associated with the handle in bytes.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The getSize() method of the\nFileSystemSyncAccessHandle interface returns the size of the file associated with the handle in bytes.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", "returns": "A number representing the size of the file in bytes.", "throws": { "InvalidStateError DOMException": "Thrown if the associated access handle is already closed." @@ -8855,7 +8874,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The read() method of the\nFileSystemSyncAccessHandle interface reads the content of the file associated with the handle into a specified buffer, optionally at a given offset.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The read() method of the\nFileSystemSyncAccessHandle interface reads the content of the file associated with the handle into a specified buffer, optionally at a given offset.", "parameters": { "buffer": "An ArrayBuffer or ArrayBufferView (such as a DataView) representing the buffer that the file content should be read into. Note that you cannot directly manipulate the contents of an ArrayBuffer. Instead, you create one of the typed array objects like an Int8Array or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer.", "options": "An options object containing the following properties:\n

    \n
    at
    \n
    \n

    A number representing the offset in bytes that the file should be read from.\n

    \n
    " @@ -8886,7 +8905,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The truncate() method of the\nFileSystemSyncAccessHandle interface resizes the file associated with the handle to a specified number of bytes.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The truncate() method of the\nFileSystemSyncAccessHandle interface resizes the file associated with the handle to a specified number of bytes.\n

    \n

    Note:\nIn earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods, and older versions of some browsers implement them in this way. However, all current browsers that support these methods implement them as synchronous methods.\n

    ", "parameters": { "newSize": "The number of bytes to resize the file to." }, @@ -8917,7 +8936,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The write() method of the\nFileSystemSyncAccessHandle interface writes the content of a specified buffer to the file associated with the handle, optionally at a given offset.\n

    Files within the origin private file system are not visible to end-users, therefore are not subject to the same security checks as methods running on files within the user-visible file system. As a result, writes performed using FileSystemSyncAccessHandle.write() are much more performant. This makes them suitable for significant, large-scale file updates such as SQLite database modifications.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The write() method of the\nFileSystemSyncAccessHandle interface writes the content of a specified buffer to the file associated with the handle, optionally at a given offset.\n

    Files within the origin private file system are not visible to end-users, therefore are not subject to the same security checks as methods running on files within the user-visible file system. As a result, writes performed using FileSystemSyncAccessHandle.write() are much more performant. This makes them suitable for significant, large-scale file updates such as SQLite database modifications.", "parameters": { "buffer": "An ArrayBuffer or ArrayBufferView (such as a DataView) representing the buffer to be written to the file.", "options": "An options object containing the following properties:\n

    \n
    at
    \n
    \n

    A number representing the offset in bytes from the start of the file that the buffer should be written at.\n

    \n
    " @@ -8948,7 +8967,7 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemWritableFileStream interface of the File System API is a WritableStream object with additional convenience methods, which operates on a single file on disk. The interface is accessed through the FileSystemFileHandle.createWritable() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The FileSystemWritableFileStream interface of the File System API is a WritableStream object with additional convenience methods, which operates on a single file on disk. The interface is accessed through the FileSystemFileHandle.createWritable() method." }, "filesystemwritablefilestream.seek": { "url": "$MDN_URL$/web/api/filesystemwritablefilestream/seek", @@ -8969,7 +8988,7 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The seek() method of the FileSystemWritableFileStream interface updates the current file cursor offset to the position (in bytes) specified when calling the method.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The seek() method of the FileSystemWritableFileStream interface updates the current file cursor offset to the position (in bytes) specified when calling the method.", "parameters": { "position": "A number specifying the byte position from the beginning of the file." }, @@ -8998,7 +9017,7 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The truncate() method of the FileSystemWritableFileStream interface resizes the file associated with the stream to the specified size in bytes.\n

    If the size specified is larger than the current file size the file is padded with 0x00 bytes.\n

    The file cursor is also updated when truncate() is called.\nIf the offset is smaller than the size, it remains unchanged.\nIf the offset is larger than size, the offset is set to that size.\nThis ensures that subsequent writes do not error.\n

    No changes are written to the actual file on disk until the stream has been closed.\nChanges are typically written to a temporary file instead.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The truncate() method of the FileSystemWritableFileStream interface resizes the file associated with the stream to the specified size in bytes.\n

    If the size specified is larger than the current file size the file is padded with 0x00 bytes.\n

    The file cursor is also updated when truncate() is called.\nIf the offset is smaller than the size, it remains unchanged.\nIf the offset is larger than size, the offset is set to that size.\nThis ensures that subsequent writes do not error.\n

    No changes are written to the actual file on disk until the stream has been closed.\nChanges are typically written to a temporary file instead.", "parameters": { "size": "A number specifying the number of bytes to resize the stream to." }, @@ -9028,7 +9047,7 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The write() method of the FileSystemWritableFileStream interface writes content into the file the method is called on, at the current file cursor offset.\n

    No changes are written to the actual file on disk until the stream has been closed.\nChanges are typically written to a temporary file instead. This method can also be used to seek to a byte point within the stream and truncate to modify the total bytes the file contains.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The write() method of the FileSystemWritableFileStream interface writes content into the file the method is called on, at the current file cursor offset.\n

    No changes are written to the actual file on disk until the stream has been closed.\nChanges are typically written to a temporary file instead. This method can also be used to seek to a byte point within the stream and truncate to modify the total bytes the file contains.", "parameters": { "data": "Can be one of the following:\n

    " }, @@ -9156,7 +9175,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The family read-only property of the FontData interface returns the family of the font face.\n

    This is the name used when referring to the font family from code, for example, in the font-family property or in places within the @font-face at-rule such as the local() function.\n

    Examples include:\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The family read-only property of the FontData interface returns the family of the font face.\n

    This is the name used when referring to the font family from code, for example, in the font-family property or in places within the @font-face at-rule such as the local() function.\n

    Examples include:\n

    " }, "fontdata.fullname": { "url": "$MDN_URL$/web/api/fontdata/fullname", @@ -9204,7 +9223,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The style read-only property of the FontData interface returns the style of the font face.\n

    This is the value used to select the style of the font you want to use, for example inside the font-style property.\n

    Examples include:\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The style read-only property of the FontData interface returns the style of the font face.\n

    This is the value used to select the style of the font you want to use, for example inside the font-style property.\n

    Examples include:\n

    " }, "fontface": { "url": "$MDN_URL$/web/api/fontface", @@ -9244,7 +9263,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The ascentOverride property of the FontFace interface returns and sets the ascent metric for the font, the height above the baseline that CSS uses to lay out line boxes in an inline formatting context.\n

    This property is equivalent to the ascent-override descriptor of @font-face." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The ascentOverride property of the FontFace interface returns and sets the ascent metric for the font, the height above the baseline that CSS uses to lay out line boxes in an inline formatting context.\n

    This property is equivalent to the ascent-override descriptor of @font-face." }, "fontface.descentoverride": { "url": "$MDN_URL$/web/api/fontface/descentoverride", @@ -9262,7 +9281,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The descentOverride property of the FontFace interface returns and sets the value of the descent-override descriptor.\nThe possible values are normal, indicating that the metric used should be obtained from the font file, or a percentage." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The descentOverride property of the FontFace interface returns and sets the value of the descent-override descriptor.\nThe possible values are normal, indicating that the metric used should be obtained from the font file, or a percentage." }, "fontface.display": { "url": "$MDN_URL$/web/api/fontface/display", @@ -9306,7 +9325,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The FontFace.family property allows the author to get or set the font family of a FontFace object.\n

    The value is used for name matching against a particular font face when styling elements using the font-family property.\nAny name may be used, and this overrides any name specified in the underlying font data.\n

    This property is equivalent to the font-family descriptor of @font-face." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The FontFace.family property allows the author to get or set the font family of a FontFace object.\n

    The value is used for name matching against a particular font face when styling elements using the font-family property.\nAny name may be used, and this overrides any name specified in the underlying font data.\n

    This property is equivalent to the font-family descriptor of @font-face." }, "fontface.featuresettings": { "url": "$MDN_URL$/web/api/fontface/featuresettings", @@ -9319,7 +9338,7 @@ "Edge": "79", "Firefox": "41", "FirefoxAndroid": "41", - "Opera": "22", + "Opera": "124", "Safari": "10", "SafariIOS": "10" }, @@ -9328,7 +9347,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The featureSettings property of the FontFace interface retrieves or sets infrequently used font features that are not available from a font's variant properties.\n

    This property is equivalent to the font-feature-settings descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The featureSettings property of the FontFace interface retrieves or sets infrequently used font features that are not available from a font's variant properties.\n

    This property is equivalent to the font-feature-settings descriptor." }, "fontface.fontface": { "url": "$MDN_URL$/web/api/fontface/fontface", @@ -9352,12 +9371,12 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The FontFace() constructor creates a new FontFace object.", "parameters": { - "family": "Specifies a font family name that can be used to match against this font face when styling elements.\n

    Takes the same type of values as the font-family descriptor of @font-face.\nThis value may also be read and set using the FontFace.family property.", + "family": "Specifies a font family name that can be used to match against this font face when styling elements.\n

    Takes the same type of values as the font-family descriptor of @font-face.\nThis value may also be read and set using the FontFace.family property.", "source": "The font source.\nThis can be either:\n

    ", - "descriptors": "A set of optional descriptors passed as an object.\nIt can contain any of the descriptors available for @font-face:\n
    \n
    ascentOverride
    \n
    \n

    With an allowable value for ascent-override.\n

    \n
    descentOverride
    \n
    \n

    With an allowable value for descent-override.\n

    \n
    display
    \n
    \n

    With an allowable value for font-display.\n

    \n
    featureSettings
    \n
    \n

    With an allowable value for font-feature-settings.\n

    \n
    lineGapOverride
    \n
    \n

    With an allowable value for line-gap-override.\n

    \n
    stretch
    \n
    \n

    With an allowable value for font-stretch.\n

    \n
    style
    \n
    \n

    With an allowable value for font-style.\n

    \n
    unicodeRange
    \n
    \n

    With an allowable value for unicode-range.\n

    \n
    variationSettings
    \n
    \n

    With an allowable value for font-variation-settings.\n

    \n
    weight
    \n
    \n

    With an allowable value for font-weight.\n

    \n
    " + "descriptors": "A set of optional descriptors passed as an object.\nIt can contain any of the descriptors available for @font-face:\n
    \n
    ascentOverride
    \n
    \n

    With an allowable value for ascent-override.\n

    \n
    descentOverride
    \n
    \n

    With an allowable value for descent-override.\n

    \n
    display
    \n
    \n

    With an allowable value for font-display.\n

    \n
    featureSettings
    \n
    \n

    With an allowable value for font-feature-settings.\n

    \n
    lineGapOverride
    \n
    \n

    With an allowable value for line-gap-override.\n

    \n
    stretch
    \n
    \n

    With an allowable value for font-stretch.\n

    \n
    style
    \n
    \n

    With an allowable value for font-style.\n

    \n
    unicodeRange
    \n
    \n

    With an allowable value for unicode-range.\n

    \n
    variationSettings
    \n
    \n

    With an allowable value for font-variation-settings.\n

    \n
    weight
    \n
    \n

    With an allowable value for font-weight.\n

    \n
    " }, "throws": { - "SyntaxError DOMException": "Thrown when a descriptor string does not match the grammar of the corresponding @font-face descriptor, or the specified binary source cannot be loaded.\nThis error results in FontFace.status being set to error." + "SyntaxError DOMException": "Thrown when a descriptor string does not match the grammar of the corresponding @font-face descriptor, or the specified binary source cannot be loaded.\nThis error results in FontFace.status being set to error." } }, "fontface.linegapoverride": { @@ -9376,7 +9395,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The lineGapOverride property of the FontFace interface returns and sets the value of the line-gap-override descriptor.\nThe possible values are normal, indicating that the metric used should be obtained from the font file, or a percentage." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The lineGapOverride property of the FontFace interface returns and sets the value of the line-gap-override descriptor.\nThe possible values are normal, indicating that the metric used should be obtained from the font file, or a percentage." }, "fontface.load": { "url": "$MDN_URL$/web/api/fontface/load", @@ -9468,7 +9487,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The stretch property of the FontFace interface retrieves or sets how the font stretches.\n

    This property is equivalent to the font-stretch descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The stretch property of the FontFace interface retrieves or sets how the font stretches.\n

    This property is equivalent to the font-stretch descriptor." }, "fontface.style": { "url": "$MDN_URL$/web/api/fontface/style", @@ -9490,7 +9509,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The style property of the FontFace interface retrieves or sets the font's style.\n

    This property is equivalent to the font-style descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The style property of the FontFace interface retrieves or sets the font's style.\n

    This property is equivalent to the font-style descriptor." }, "fontface.unicoderange": { "url": "$MDN_URL$/web/api/fontface/unicoderange", @@ -9512,7 +9531,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The unicodeRange property of the FontFace interface retrieves or sets the range of unicode code points encompassing the font.\n

    This property is equivalent to the unicode-range descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The unicodeRange property of the FontFace interface retrieves or sets the range of unicode code points encompassing the font.\n

    This property is equivalent to the unicode-range descriptor." }, "fontface.variant": { "url": "$MDN_URL$/web/api/fontface/variant", @@ -9545,7 +9564,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The variationSettings property of the FontFace interface retrieves or sets low-level OpenType or TrueType font variations.\n

    This property is equivalent to the font-variation-settings descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The variationSettings property of the FontFace interface retrieves or sets low-level OpenType or TrueType font variations.\n

    This property is equivalent to the font-variation-settings descriptor." }, "fontface.weight": { "url": "$MDN_URL$/web/api/fontface/weight", @@ -9567,7 +9586,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The weight property of the FontFace interface retrieves or sets the weight of the font.\n

    This property is equivalent to the font-weight descriptor." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The weight property of the FontFace interface retrieves or sets the weight of the font.\n

    This property is equivalent to the font-weight descriptor." }, "fontfaceset": { "url": "$MDN_URL$/web/api/fontfaceset", @@ -9617,7 +9636,7 @@ }, "returns": "A new FontFaceSet.", "throws": { - "InvalidModificationError DOMException": "Thrown if this font is already included via the CSS @font-face rule." + "InvalidModificationError DOMException": "Thrown if this font is already included via the CSS @font-face rule." } }, "fontfaceset.check": { @@ -9639,9 +9658,9 @@ "level": "LOW", "lowDate": "2023-12-07" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The check() method of the FontFaceSet returns true if you can render some text using the given font specification without attempting to use any fonts in this FontFaceSet that are not yet fully loaded. This means you can use the font specification without causing a font swap.\n

    \n

    Note:\nThe check() method is not designed to verify whether a specific font style can be rendered or if a particular font is fully loaded. Instead, it returns true if the specified text can be rendered using the given font specification without causing a font swap. This means that even if the requested font isn't available or fully loaded, the method may still return true. This behavior helps avoid the visual issues associated with font swapping but may be counterintuitive if you're trying to confirm the availability of a specific font.\n

    ", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The check() method of the FontFaceSet returns true if you can render some text using the given font specification without attempting to use any fonts in this FontFaceSet that are not yet fully loaded. This means you can use the font specification without causing a font swap.\n

    \n

    Note:\nThe check() method is not designed to verify whether a specific font style can be rendered or if a particular font is fully loaded. Instead, it returns true if the specified text can be rendered using the given font specification without causing a font swap. This means that even if the requested font isn't available or fully loaded, the method may still return true. This behavior helps avoid the visual issues associated with font swapping but may be counterintuitive if you're trying to confirm the availability of a specific font.\n

    ", "parameters": { - "font": "a font specification using the syntax for the CSS font property, for example \"italic bold 16px Roboto\"", + "font": "a font specification using the syntax for the CSS font property, for example \"italic bold 16px Roboto\"", "text": "limit the font faces to those whose Unicode range contains at least one of the characters in text. This does not check for individual glyph coverage." }, "returns": "A Boolean value that is true if rendering text with the given font specification will not attempt to use any fonts in this FontFaceSet that are not yet fully loaded.\n

    This means that all fonts in this FontFaceSet that are matched by the given font specification have a status property set to \"loaded\".\n

    Otherwise, this function returns false." @@ -9666,7 +9685,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The clear() method of the FontFaceSet interface removes all fonts added via this interface. Fonts added with the @font-face rule are not removed.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The clear() method of the FontFaceSet interface removes all fonts added via this interface. Fonts added with the @font-face rule are not removed.", "returns": "None (undefined)." }, "fontfaceset.delete": { @@ -9689,7 +9708,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the FontFaceSet interface removes a font from the set.\n

    Font faces that were added to the set using the CSS @font-face rule remain connected to the corresponding CSS, and cannot be deleted.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the FontFaceSet interface removes a font from the set.\n

    Font faces that were added to the set using the CSS @font-face rule remain connected to the corresponding CSS, and cannot be deleted.", "parameters": { "font": "A FontFace to be removed from the set." }, @@ -10455,7 +10474,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad interface of the Gamepad API defines an individual gamepad or other controller, allowing access to information such as button presses, axis positions, and id.\n

    A Gamepad object can be returned in one of two ways: via the gamepad property of the gamepadconnected and gamepaddisconnected events, or by grabbing any position in the array returned by the Navigator.getGamepads() method.\n

    \n

    Note:\nThe support of gamepad features varies across different combinations of platforms and controllers. Even if the controller supports a certain feature (for example, haptic feedback), the platform may not support it for that controller.\n

    " + "doc": "The Gamepad interface of the Gamepad API defines an individual gamepad or other controller, allowing access to information such as button presses, axis positions, and id.\n

    A Gamepad object can be returned in one of two ways: via the gamepad property of the gamepadconnected and gamepaddisconnected events, or by grabbing any position in the array returned by the Navigator.getGamepads() method.\n

    \n

    Note:\nThe support of gamepad features varies across different combinations of platforms and controllers. Even if the controller supports a certain feature (for example, haptic feedback), the platform may not support it for that controller.\n

    " }, "gamepad.axes": { "url": "$MDN_URL$/web/api/gamepad/axes", @@ -10477,7 +10496,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad.axes property of the Gamepad\ninterface returns an array representing the controls with axes present on the device\n(e.g., analog thumb sticks).\n

    Each entry in the array is a floating point value in the range -1.0 – 1.0, representing\nthe axis position from the lowest value (-1.0) to the highest value (1.0)." + "doc": "The Gamepad.axes property of the Gamepad\ninterface returns an array representing the controls with axes present on the device\n(e.g., analog thumb sticks).\n

    Each entry in the array is a floating point value in the range -1.0 – 1.0, representing\nthe axis position from the lowest value (-1.0) to the highest value (1.0)." }, "gamepad.buttons": { "url": "$MDN_URL$/web/api/gamepad/buttons", @@ -10499,7 +10518,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The buttons property of the Gamepad interface returns an array of GamepadButton objects representing the buttons present on the device.\n

    Each entry in the array is 0 if the button is not pressed, and non-zero (typically 1.0) if the button is pressed." + "doc": "The buttons property of the Gamepad interface returns an array of GamepadButton objects representing the buttons present on the device.\n

    Each entry in the array is 0 if the button is not pressed, and non-zero (typically 1.0) if the button is pressed." }, "gamepad.connected": { "url": "$MDN_URL$/web/api/gamepad/connected", @@ -10521,7 +10540,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad.connected property of the\nGamepad interface returns a boolean indicating whether the gamepad is\nstill connected to the system.\n

    If the gamepad is connected, the value is true; if not, it is\nfalse." + "doc": "The Gamepad.connected property of the\nGamepad interface returns a boolean indicating whether the gamepad is\nstill connected to the system.\n

    If the gamepad is connected, the value is true; if not, it is\nfalse." }, "gamepad.displayid": { "url": "$MDN_URL$/web/api/gamepad/displayid", @@ -10544,7 +10563,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hand read-only property of the Gamepad interface returns an enum defining what hand the controller is being held in, or is most likely to be held in." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hand read-only property of the Gamepad interface returns an enum defining what hand the controller is being held in, or is most likely to be held in." }, "gamepad.hapticactuators": { "url": "$MDN_URL$/web/api/gamepad/hapticactuators", @@ -10559,7 +10578,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hapticActuators read-only property of the Gamepad interface returns an array containing GamepadHapticActuator objects, each of which represents haptic feedback hardware available on the controller." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hapticActuators read-only property of the Gamepad interface returns an array containing GamepadHapticActuator objects, each of which represents haptic feedback hardware available on the controller." }, "gamepad.id": { "url": "$MDN_URL$/web/api/gamepad/id", @@ -10581,7 +10600,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad.id property of the Gamepad\ninterface returns a string containing some information about the controller.\n

    The exact syntax is not strictly specified, but in Firefox it will contain three pieces\nof information separated by dashes (-):\n

    \n

    For example, a PS2 controller returned 810-3-USB Gamepad.\n

    This information is intended to allow you to find a mapping for the controls on the\ndevice as well as display useful feedback to the user." + "doc": "The Gamepad.id property of the Gamepad\ninterface returns a string containing some information about the controller.\n

    The exact syntax is not strictly specified, but in Firefox it will contain three pieces\nof information separated by dashes (-):\n

    \n

    For example, a PS2 controller returned 810-3-USB Gamepad.\n

    This information is intended to allow you to find a mapping for the controls on the\ndevice as well as display useful feedback to the user." }, "gamepad.mapping": { "url": "$MDN_URL$/web/api/gamepad/mapping", @@ -10603,7 +10622,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad.mapping property of the\nGamepad interface returns a string indicating whether the browser has\nremapped the controls on the device to a known layout.\n

    The currently supported known layouts are:\n

    " + "doc": "The Gamepad.mapping property of the\nGamepad interface returns a string indicating whether the browser has\nremapped the controls on the device to a known layout.\n

    The currently supported known layouts are:\n

    " }, "gamepad.pose": { "url": "$MDN_URL$/web/api/gamepad/pose", @@ -10618,7 +10637,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The pose read-only property of the Gamepad interface returns a GamepadPose object representing the pose information associated with a WebVR controller (e.g., its position and orientation in 3D space)." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The pose read-only property of the Gamepad interface returns a GamepadPose object representing the pose information associated with a WebVR controller (e.g., its position and orientation in 3D space)." }, "gamepad.timestamp": { "url": "$MDN_URL$/web/api/gamepad/timestamp", @@ -10640,7 +10659,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gamepad.timestamp property of the\nGamepad interface returns a DOMHighResTimeStamp\nrepresenting the last time the data for this gamepad was updated.\n

    The idea behind this is to allow developers to determine if the axes and\nbutton data have been updated from the hardware. The value must be\nrelative to the navigationStart attribute of the\nPerformanceTiming interface. Values are monotonically\nincreasing, meaning that they can be compared to determine the ordering of updates, as\nnewer values will always be greater than or equal to older values.\n

    \n

    Note:\nThis property is not currently supported anywhere.\n

    " + "doc": "The Gamepad.timestamp property of the\nGamepad interface returns a DOMHighResTimeStamp\nrepresenting the last time the data for this gamepad was updated.\n

    The idea behind this is to allow developers to determine if the axes and\nbutton data have been updated from the hardware. The value must be\nrelative to the navigationStart attribute of the\nPerformanceTiming interface. Values are monotonically\nincreasing, meaning that they can be compared to determine the ordering of updates, as\nnewer values will always be greater than or equal to older values.\n

    \n

    Note:\nThis property is not currently supported anywhere.\n

    " }, "gamepad.vibrationactuator": { "url": "$MDN_URL$/web/api/gamepad/vibrationactuator", @@ -10657,7 +10676,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The vibrationActuator read-only property of the Gamepad interface returns a GamepadHapticActuator object, which represents haptic feedback hardware available on the controller.\n

    \n

    Note:\nSupport for this property may vary across different combinations of platforms and controllers. Even if the controller supports haptic feedback, the platform may not support it.\n

    " + "doc": "The vibrationActuator read-only property of the Gamepad interface returns a GamepadHapticActuator object, which represents haptic feedback hardware available on the controller.\n
    \n

    Note:\nSupport for this property may vary across different combinations of platforms and controllers. Even if the controller supports haptic feedback, the platform may not support it.\n

    " }, "gamepadbutton": { "url": "$MDN_URL$/web/api/gamepadbutton", @@ -10679,7 +10698,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadButton interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device.\n

    A GamepadButton object is returned by querying any value of the array returned by the buttons property of the Gamepad interface." + "doc": "The GamepadButton interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device.\n

    A GamepadButton object is returned by querying any value of the array returned by the buttons property of the Gamepad interface." }, "gamepadbutton.pressed": { "url": "$MDN_URL$/web/api/gamepadbutton/pressed", @@ -10701,7 +10720,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadButton.pressed property of the\nGamepadButton interface returns a boolean indicating whether\nthe button is currently pressed (true) or unpressed (false)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadButton.pressed property of the\nGamepadButton interface returns a boolean indicating whether\nthe button is currently pressed (true) or unpressed (false)." }, "gamepadbutton.touched": { "url": "$MDN_URL$/web/api/gamepadbutton/touched", @@ -10719,7 +10738,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The touched property of the\nGamepadButton interface returns a boolean indicating whether\na button capable of detecting touch is currently touched (true) or not touched (false).\n

    If the button is not capable of detecting touch but can return an analog value, the property will be true if the value is greater than 0, and false otherwise. If the button is not capable of detecting touch and can only report a digital value, then it should mirror the GamepadButton.pressed property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The touched property of the\nGamepadButton interface returns a boolean indicating whether\na button capable of detecting touch is currently touched (true) or not touched (false).\n

    If the button is not capable of detecting touch but can return an analog value, the property will be true if the value is greater than 0, and false otherwise. If the button is not capable of detecting touch and can only report a digital value, then it should mirror the GamepadButton.pressed property." }, "gamepadbutton.value": { "url": "$MDN_URL$/web/api/gamepadbutton/value", @@ -10741,7 +10760,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadButton.value property of the\nGamepadButton interface returns a double value used to represent the\ncurrent state of analog buttons on many modern gamepads, such as the triggers.\n

    The values are normalized to the range 0.0 — 1.0, with\n0.0 representing a button that is not pressed, and 1.0 representing a\nbutton that is fully pressed." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadButton.value property of the\nGamepadButton interface returns a double value used to represent the\ncurrent state of analog buttons on many modern gamepads, such as the triggers.\n

    The values are normalized to the range 0.0 — 1.0, with\n0.0 representing a button that is not pressed, and 1.0 representing a\nbutton that is fully pressed." }, "gamepadevent": { "url": "$MDN_URL$/web/api/gamepadevent", @@ -10763,7 +10782,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadEvent interface of the Gamepad API contains references to gamepads connected to the system, which is what the gamepad events gamepadconnected and gamepaddisconnected are fired in response to." + "doc": "The GamepadEvent interface of the Gamepad API contains references to gamepads connected to the system, which is what the gamepad events gamepadconnected and gamepaddisconnected are fired in response to." }, "gamepadevent.gamepad": { "url": "$MDN_URL$/web/api/gamepadevent/gamepad", @@ -10785,7 +10804,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadEvent.gamepad property of the\nGamepadEvent interface returns a Gamepad\nobject, providing access to the associated gamepad data for fired\ngamepadconnected and gamepaddisconnected events." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadEvent.gamepad property of the\nGamepadEvent interface returns a Gamepad\nobject, providing access to the associated gamepad data for fired\ngamepadconnected and gamepaddisconnected events." }, "gamepadevent.gamepadevent": { "url": "$MDN_URL$/web/api/gamepadevent/gamepadevent", @@ -10807,7 +10826,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadEvent() constructor creates a new GamepadEvent object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadEvent() constructor creates a new GamepadEvent object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to gamepadconnected or gamepaddisconnected.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    gamepad
    \n
    \n

    A Gamepad object describing the gamepad associated with the event.\n

    \n
    " @@ -10831,7 +10850,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GamepadHapticActuator interface of the Gamepad API represents hardware in the controller designed to provide haptic feedback to the user (if available), most commonly vibration hardware.\n

    This interface is accessible through the Gamepad.hapticActuators property." + "doc": "The GamepadHapticActuator interface of the Gamepad API represents hardware in the controller designed to provide haptic feedback to the user (if available), most commonly vibration hardware.\n

    This interface is accessible through the Gamepad.hapticActuators property." }, "gamepadhapticactuator.effects": { "url": "$MDN_URL$/web/api/gamepadhapticactuator/effects", @@ -10938,7 +10957,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The GamepadPose interface of the Gamepad API represents the pose of a WebVR controller at a given timestamp (which includes orientation, position, velocity, and acceleration information).\n

    This interface is accessible through the Gamepad.pose property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The GamepadPose interface of the Gamepad API represents the pose of a WebVR controller at a given timestamp (which includes orientation, position, velocity, and acceleration information).\n

    This interface is accessible through the Gamepad.pose property." }, "gamepadpose.angularacceleration": { "url": "$MDN_URL$/web/api/gamepadpose/angularacceleration", @@ -11080,7 +11099,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Geolocation interface represents an object able to obtain the position of the device programmatically. It gives Web content access to the location of the device. This allows a website or app to offer customized results based on the user's location.\n

    An object with this interface is obtained using the navigator.geolocation property implemented by the Navigator object.\n

    \n

    Note:\nFor security reasons, when a web page tries to access location information, the user is notified and asked to grant permission. Be aware that each browser has its own policies and methods for requesting this permission.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Geolocation interface represents an object able to obtain the position of the device programmatically. It gives Web content access to the location of the device. This allows a website or app to offer customized results based on the user's location.\n

    An object with this interface is obtained using the navigator.geolocation property implemented by the Navigator object.\n

    \n

    Note:\nFor security reasons, when a web page tries to access location information, the user is notified and asked to grant permission. Be aware that each browser has its own policies and methods for requesting this permission.\n

    " }, "geolocation.clearwatch": { "url": "$MDN_URL$/web/api/geolocation/clearwatch", @@ -11102,7 +11121,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearWatch() method of the Geolocation interface is used to unregister location/error monitoring handlers previously installed using Geolocation.watchPosition().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearWatch() method of the Geolocation interface is used to unregister location/error monitoring handlers previously installed using Geolocation.watchPosition().", "parameters": { "id": "The ID number returned by the Geolocation.watchPosition() method when\ninstalling the handler you wish to remove." }, @@ -11128,7 +11147,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCurrentPosition() method of the Geolocation interface is used to get the current position of the device.\n

    Note that in addition to requiring a secure context this feature may be blocked by the geolocation Permissions-Policy, and also requires that explicit permission be granted by the user.\nIf required, the user will be prompted when this method is called.\nThe permission state can be queried using the geolocation user permission in the Permissions API.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCurrentPosition() method of the Geolocation interface is used to get the current position of the device.\n

    Note that in addition to requiring a secure context this feature may be blocked by the geolocation Permissions-Policy, and also requires that explicit permission be granted by the user.\nIf required, the user will be prompted when this method is called.\nThe permission state can be queried using the geolocation user permission in the Permissions API.", "parameters": { "success": "A callback function that takes a GeolocationPosition object as its\nsole input parameter.", "error": "An optional callback function that takes a GeolocationPositionError\nobject as its sole input parameter.", @@ -11156,7 +11175,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The watchPosition() method of the Geolocation interface is used to register a handler function that will be called automatically each time the position of the device changes.\nYou can also, optionally, specify an error handling callback function.\n

    Note that in addition to requiring a secure context this feature may be blocked by the geolocation Permissions-Policy, and also requires that explicit permission be granted by the user.\nIf required, the user will be prompted when this method is called.\nThe permission state can be queried using the geolocation user permission in the Permissions API.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The watchPosition() method of the Geolocation interface is used to register a handler function that will be called automatically each time the position of the device changes.\nYou can also, optionally, specify an error handling callback function.\n

    Note that in addition to requiring a secure context this feature may be blocked by the geolocation Permissions-Policy, and also requires that explicit permission be granted by the user.\nIf required, the user will be prompted when this method is called.\nThe permission state can be queried using the geolocation user permission in the Permissions API.", "parameters": { "success": "A callback function that takes a GeolocationPosition object as an input parameter.", "error": "An optional callback function that takes a GeolocationPositionError object as an input parameter.", @@ -11183,7 +11202,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationCoordinates interface represents the position and altitude of the device on Earth, as well as the accuracy with which these properties are calculated.\nThe geographic position information is provided in terms of World Geodetic System coordinates (WGS84)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationCoordinates interface represents the position and altitude of the device on Earth, as well as the accuracy with which these properties are calculated.\nThe geographic position information is provided in terms of World Geodetic System coordinates (WGS84)." }, "geolocationcoordinates.accuracy": { "url": "$MDN_URL$/web/api/geolocationcoordinates/accuracy", @@ -11205,7 +11224,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The accuracy read-only property of the GeolocationCoordinates interface is a strictly positive double representing the accuracy, with a 95% confidence level, of the GeolocationCoordinates.latitude and GeolocationCoordinates.longitude properties expressed in meters." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The accuracy read-only property of the GeolocationCoordinates interface is a strictly positive double representing the accuracy, with a 95% confidence level, of the GeolocationCoordinates.latitude and GeolocationCoordinates.longitude properties expressed in meters." }, "geolocationcoordinates.altitude": { "url": "$MDN_URL$/web/api/geolocationcoordinates/altitude", @@ -11227,7 +11246,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The altitude read-only property of the GeolocationCoordinates interface is a double representing the altitude of the position in meters above the WGS84 ellipsoid (which defines the nominal sea level surface). This value is null if the implementation cannot provide this data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The altitude read-only property of the GeolocationCoordinates interface is a double representing the altitude of the position in meters above the WGS84 ellipsoid (which defines the nominal sea level surface). This value is null if the implementation cannot provide this data." }, "geolocationcoordinates.altitudeaccuracy": { "url": "$MDN_URL$/web/api/geolocationcoordinates/altitudeaccuracy", @@ -11249,7 +11268,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The altitudeAccuracy read-only property of the GeolocationCoordinates interface is a strictly positive double representing the accuracy, with a 95% confidence level, of the altitude expressed in meters. This value is null if the implementation doesn't support measuring altitude." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The altitudeAccuracy read-only property of the GeolocationCoordinates interface is a strictly positive double representing the accuracy, with a 95% confidence level, of the altitude expressed in meters. This value is null if the implementation doesn't support measuring altitude." }, "geolocationcoordinates.heading": { "url": "$MDN_URL$/web/api/geolocationcoordinates/heading", @@ -11271,7 +11290,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The heading read-only property of the GeolocationCoordinates interface is a double representing the direction in which the device is traveling. This value, specified in degrees, indicates how far off from heading due north the device is. 0 degrees represents true north, and the direction is determined clockwise (which means that east is 90 degrees and west is 270 degrees). If GeolocationCoordinates.speed is 0 or the device is not able to provide heading information, heading is null." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The heading read-only property of the GeolocationCoordinates interface is a double representing the direction in which the device is traveling. This value, specified in degrees, indicates how far off from heading due north the device is. 0 degrees represents true north, and the direction is determined clockwise (which means that east is 90 degrees and west is 270 degrees). If GeolocationCoordinates.speed is 0 or the device is not able to provide heading information, heading is null." }, "geolocationcoordinates.latitude": { "url": "$MDN_URL$/web/api/geolocationcoordinates/latitude", @@ -11293,7 +11312,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The latitude read-only property of the GeolocationCoordinates interface is a double representing the latitude of the position in decimal degrees." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The latitude read-only property of the GeolocationCoordinates interface is a double representing the latitude of the position in decimal degrees." }, "geolocationcoordinates.longitude": { "url": "$MDN_URL$/web/api/geolocationcoordinates/longitude", @@ -11315,7 +11334,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The longitude read-only property of the GeolocationCoordinates interface is a number which represents the longitude of a geographical position, specified in decimal degrees.\nTogether with a timestamp, given as Unix time in milliseconds, indicating a time of measurement, the GeolocationCoordinates object is part of the GeolocationPosition interface, which is the object type returned by Geolocation API functions that obtain and return a geographical position." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The longitude read-only property of the GeolocationCoordinates interface is a number which represents the longitude of a geographical position, specified in decimal degrees.\nTogether with a timestamp, given as Unix time in milliseconds, indicating a time of measurement, the GeolocationCoordinates object is part of the GeolocationPosition interface, which is the object type returned by Geolocation API functions that obtain and return a geographical position." }, "geolocationcoordinates.speed": { "url": "$MDN_URL$/web/api/geolocationcoordinates/speed", @@ -11337,7 +11356,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The speed read-only property of the GeolocationCoordinates interface is a double representing the velocity of the device in meters per second. This value is null if the implementation is not able to measure it." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The speed read-only property of the GeolocationCoordinates interface is a double representing the velocity of the device in meters per second. This value is null if the implementation is not able to measure it." }, "geolocationcoordinates.tojson": { "url": "$MDN_URL$/web/api/geolocationcoordinates/tojson", @@ -11381,7 +11400,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationPosition interface represents the position of the concerned device at a given time. The position, represented by a GeolocationCoordinates object, comprehends the 2D position of the device, on a spheroid representing the Earth, but also its altitude and its speed." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationPosition interface represents the position of the concerned device at a given time. The position, represented by a GeolocationCoordinates object, comprehends the 2D position of the device, on a spheroid representing the Earth, but also its altitude and its speed." }, "geolocationposition.coords": { "url": "$MDN_URL$/web/api/geolocationposition/coords", @@ -11403,7 +11422,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The coords read-only property of the GeolocationPosition interface returns a GeolocationCoordinates object representing a geographic position. It contains the location, that is longitude and latitude on the Earth, the altitude, and the speed of the object concerned, regrouped inside the returned value. It also contains accuracy information about these values." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The coords read-only property of the GeolocationPosition interface returns a GeolocationCoordinates object representing a geographic position. It contains the location, that is longitude and latitude on the Earth, the altitude, and the speed of the object concerned, regrouped inside the returned value. It also contains accuracy information about these values." }, "geolocationposition.timestamp": { "url": "$MDN_URL$/web/api/geolocationposition/timestamp", @@ -11425,7 +11444,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The timestamp read-only property of the GeolocationPosition interface represents the date and time that the position was acquired by the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The timestamp read-only property of the GeolocationPosition interface represents the date and time that the position was acquired by the device." }, "geolocationposition.tojson": { "url": "$MDN_URL$/web/api/geolocationposition/tojson", @@ -11469,7 +11488,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationPositionError interface represents the reason of an error occurring when using the geolocating device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GeolocationPositionError interface represents the reason of an error occurring when using the geolocating device." }, "geolocationpositionerror.code": { "url": "$MDN_URL$/web/api/geolocationpositionerror/code", @@ -11491,7 +11510,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The code read-only property of the GeolocationPositionError interface is an unsigned short representing the error code.\n

    The following values are possible:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ValueAssociated constantDescription
    1PERMISSION_DENIED\nThe acquisition of the geolocation information failed because the page\ndidn't have the permission to do it.\n
    2POSITION_UNAVAILABLE\nThe acquisition of the geolocation failed because one or several internal sources of position returned an internal error.\n
    3TIMEOUTGeolocation information was not obtained in the allowed time.
    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The code read-only property of the GeolocationPositionError interface is an unsigned short representing the error code.\n

    The following values are possible:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    ValueAssociated constantDescription
    1PERMISSION_DENIED\nThe acquisition of the geolocation information failed because the page\ndidn't have the permission to do it.\n
    2POSITION_UNAVAILABLE\nThe acquisition of the geolocation failed because one or several internal sources of position returned an internal error.\n
    3TIMEOUTGeolocation information was not obtained in the allowed time.
    " }, "geolocationpositionerror.message": { "url": "$MDN_URL$/web/api/geolocationpositionerror/message", @@ -11513,7 +11532,7 @@ "lowDate": "2020-07-28", "highDate": "2023-01-28" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The message read-only property of the GeolocationPositionError interface returns a human-readable string describing the details of the error." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The message read-only property of the GeolocationPositionError interface returns a human-readable string describing the details of the error." }, "gestureevent": { "url": "$MDN_URL$/web/api/gestureevent", @@ -11536,7 +11555,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPU interface of the WebGPU API is the starting point for using WebGPU. It can be used to return a GPUAdapter from which you can request devices, configure features and limits, and more.\n

    The GPU object for the current context is accessed via the Navigator.gpu or WorkerNavigator.gpu properties." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPU interface of the WebGPU API is the starting point for using WebGPU. It can be used to return a GPUAdapter from which you can request devices, configure features and limits, and more.\n

    The GPU object for the current context is accessed via the Navigator.gpu or WorkerNavigator.gpu properties." }, "gpu.getpreferredcanvasformat": { "url": "$MDN_URL$/web/api/gpu/getpreferredcanvasformat", @@ -11551,7 +11570,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getPreferredCanvasFormat() method of the\nGPU interface returns the optimal canvas texture format for displaying 8-bit depth, standard dynamic range content on the current system.\n

    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.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getPreferredCanvasFormat() method of the\nGPU interface returns the optimal canvas texture format for displaying 8-bit depth, standard dynamic range content on the current system.\n

    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.", "returns": "A string indicating a canvas texture format. The value can be rgba8unorm or bgra8unorm." }, "gpu.requestadapter": { @@ -11567,7 +11586,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestAdapter() method of the\nGPU interface returns a Promise that fulfills with a GPUAdapter object instance. From this you can request a GPUDevice, adapter info, features, and limits.\n

    Note that the user agent chooses whether to return an adapter. If so, it chooses according to the provided options. If no options are provided, the device will provide access to the default adapter, which is usually good enough for most purposes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestAdapter() method of the\nGPU interface returns a Promise that fulfills with a GPUAdapter object instance. From this you can request a GPUDevice, adapter info, features, and limits.\n

    Note that the user agent chooses whether to return an adapter. If so, it chooses according to the provided options. If no options are provided, the device will provide access to the default adapter, which is usually good enough for most purposes.", "parameters": { "options": "An object containing the following properties:\n

    \n
    powerPreference Optional
    \n
    \n

    An enumerated value that can be used to provide a hint to the user agent indicating what class of adapter should be chosen from the system's available adapters. Available values are:\n

      \n
    • undefined (or not specified), which provides no hint.
    • \n
    • \"low-power\", which provides a hint to prioritize power savings over performance. If your app runs OK with this setting, it is recommended to use it, as it can significantly improve battery life on portable devices. This is usually the default if no options are provided.
    • \n
    • \"high-performance\", which provides a hint to prioritize performance over power consumption. You are encouraged to only specify this value if absolutely necessary, since it may significantly decrease battery life on portable devices. It may also result in increased GPUDevice loss — the system will sometimes elect to switch to a lower-power adapter to save power.
    • \n
    \n

    This hint's primary purpose is to influence which GPU is used in a multi-GPU system. For instance, some laptops have a low-power integrated GPU and a high-performance discrete GPU. Different factors may affect which adapter is returned including battery status, attached displays, or removable GPUs.\n

    \n

    Note:\nOn Chrome running on dual-GPU macOS devices, if requestAdapter() is called without a powerPreference option, the high-performance discrete GPU is returned when the user's device is on AC power. Otherwise, the low-power integrated GPU is returned.\n

    \n
    \n
    " }, @@ -11586,7 +11605,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The wgslLanguageFeatures read-only property of the\nGPU interface returns a WGSLLanguageFeatures object that reports the WGSL language extensions supported by the WebGPU implementation.\n

    \n

    Note:\nNot 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.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The wgslLanguageFeatures read-only property of the\nGPU interface returns a WGSLLanguageFeatures object that reports the WGSL language extensions supported by the WebGPU implementation.\n

    \n

    Note:\nNot 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.\n

    " }, "gpuadapter": { "url": "$MDN_URL$/web/api/gpuadapter", @@ -11601,7 +11620,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUAdapter interface of the WebGPU API represents a GPU adapter. From this you can request a GPUDevice, adapter info, features, and limits.\n

    A GPUAdapter object is requested using the GPU.requestAdapter() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUAdapter interface of the WebGPU API represents a GPU adapter. From this you can request a GPUDevice, adapter info, features, and limits.\n

    A GPUAdapter object is requested using the GPU.requestAdapter() method." }, "gpuadapter.features": { "url": "$MDN_URL$/web/api/gpuadapter/features", @@ -11616,7 +11635,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The features read-only property of the\nGPUAdapter interface returns a GPUSupportedFeatures object that describes additional functionality supported by the adapter.\n

    You should note that not all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. This could be due to constraints in the underlying system, browser, or adapter. For example:\n

    \n

    If you are hoping to take advantage of a specific additional feature in a WebGPU app, thorough testing is advised." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The features read-only property of the\nGPUAdapter interface returns a GPUSupportedFeatures object that describes additional functionality supported by the adapter.\n

    You should note that not all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. This could be due to constraints in the underlying system, browser, or adapter. For example:\n

    \n

    If you are hoping to take advantage of a specific additional feature in a WebGPU app, thorough testing is advised." }, "gpuadapter.info": { "url": "$MDN_URL$/web/api/gpuadapter/info", @@ -11624,14 +11643,13 @@ "StandardTrack" ], "compatibility": { - "ChromeAndroid": "127", "Safari": "26", "SafariIOS": "26" }, "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The info read-only property of the\nGPUAdapter interface returns a GPUAdapterInfo object containing identifying information about the adapter." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The info read-only property of the\nGPUAdapter interface returns a GPUAdapterInfo object containing identifying information about the adapter." }, "gpuadapter.isfallbackadapter": { "url": "$MDN_URL$/web/api/gpuadapter/isfallbackadapter", @@ -11643,7 +11661,7 @@ "Safari": "26", "SafariIOS": "26" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The isFallbackAdapter read-only property of the\nGPUAdapter interface returns true if the adapter is a fallback adapter, and false if not.\n

    This property has been removed from the web platform. Use GPUAdapterInfo.isFallbackAdapter instead." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The isFallbackAdapter read-only property of the\nGPUAdapter interface returns true if the adapter is a fallback adapter, and false if not.\n

    This property has been removed from the web platform. Use GPUAdapterInfo.isFallbackAdapter instead." }, "gpuadapter.limits": { "url": "$MDN_URL$/web/api/gpuadapter/limits", @@ -11658,7 +11676,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The limits read-only property of the\nGPUAdapter interface returns a GPUSupportedLimits object that describes the limits supported by the adapter.\n

    You should note that, rather than reporting the exact limits of each GPU, browsers will likely report different tier values of different limits to reduce the unique information available to drive-by fingerprinting. For example, the tiers of a certain limit might be 2048, 8192, and 32768. If your GPU's actual limit is 16384, the browser will still report 8192.\n

    Given that different browsers will handle this differently and the tier values may change over time, it is hard to provide an accurate account of what limit values to expect — thorough testing is advised." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The limits read-only property of the\nGPUAdapter interface returns a GPUSupportedLimits object that describes the limits supported by the adapter.\n

    You should note that, rather than reporting the exact limits of each GPU, browsers will likely report different tier values of different limits to reduce the unique information available to drive-by fingerprinting. For example, the tiers of a certain limit might be 2048, 8192, and 32768. If your GPU's actual limit is 16384, the browser will still report 8192.\n

    Given that different browsers will handle this differently and the tier values may change over time, it is hard to provide an accurate account of what limit values to expect — thorough testing is advised." }, "gpuadapter.requestadapterinfo": { "url": "$MDN_URL$/web/api/gpuadapter/requestadapterinfo", @@ -11668,7 +11686,7 @@ "compatibility": { "ChromeAndroid": "121" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestAdapterInfo() method of the\nGPUAdapter interface returns a Promise that fulfills with a GPUAdapterInfo object containing identifying information about an adapter.\n

    requestAdapterInfo() has been removed from the WebGPU specification. Use GPUAdapter.info to access adapter information instead.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestAdapterInfo() method of the\nGPUAdapter interface returns a Promise that fulfills with a GPUAdapterInfo object containing identifying information about an adapter.\n

    requestAdapterInfo() has been removed from the WebGPU specification. Use GPUAdapter.info to access adapter information instead.", "returns": "A Promise that fulfills with a GPUAdapterInfo object instance." }, "gpuadapter.requestdevice": { @@ -11684,13 +11702,13 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestDevice() method of the\nGPUAdapter interface returns a Promise that fulfills with a GPUDevice object, which is the primary interface for communicating with the GPU.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestDevice() method of the\nGPUAdapter interface returns a Promise that fulfills with a GPUDevice object, which is the primary interface for communicating with the GPU.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    defaultQueue Optional
    \n
    \n

    An object that provides information for the device's default GPUQueue (as returned by GPUDevice.queue). This object has a single property — label — which provides the default queue with a label value. If no value is provided, this defaults to an empty object, and the default queue's label will be an empty string.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the GPUDevice, for example in GPUError messages or console warnings.\n

    \n
    requiredFeatures Optional
    \n
    \n

    An array of strings representing additional functionality that you want supported by the returned GPUDevice. The requestDevice() call will fail if the GPUAdapter cannot provide these features. See GPUSupportedFeatures for a full list of possible features. This defaults to an empty array if no value is provided.\n

    \n
    requiredLimits Optional
    \n
    \n

    An object containing properties representing the limits that you want supported by the returned GPUDevice. The requestDevice() call will fail if the GPUAdapter cannot provide these limits. Each key with a non-undefined value must be the name of a member of GPUSupportedLimits.\n

    \n

    Note:\nYou can request unknown limits when requesting a GPU device without causing an error. Such limits will be undefined. This is useful because it makes WebGPU code less brittle — a codebase won't stop working because a limit no longer exists in the adapter.\n

    \n
    \n
    " }, - "returns": "A Promise that fulfills with a GPUDevice object instance.\n

    If you make a duplicate call, i.e., call requestDevice() on a GPUAdapter that requestDevice() was already called on, the promise fulfills with a device that is immediately lost. You can then get information on how the device was lost via GPUDevice.lost.", + "returns": "A Promise that fulfills with a GPUDevice object instance.\n

    If you make a duplicate call, i.e., call requestDevice() on a GPUAdapter that requestDevice() was already called on, the promise rejects with an OperationError because the associated GPUAdapter is consumed when a GPUDevice is created.", "throws": { - "OperationError DOMException": "The promise rejects with an OperationError if the limits included in the requiredLimits property are not supported by the GPUAdapter, either because they are not valid limits, or because their values are higher than the adapter's values for those limits.", + "OperationError DOMException": "The promise rejects with an OperationError if either:\n

    ", "TypeError DOMException": "The promise rejects with a TypeError if the features included in the requiredFeatures property are not supported by the GPUAdapter." } }, @@ -11707,7 +11725,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUAdapterInfo interface of the WebGPU API contains identifying information about a GPUAdapter.\n

    An adapter's GPUAdapterInfo can be retrieved using the GPUAdapter.info property of the adapter itself, or the GPUDevice.adapterInfo property of a device that originated from the adapter.\n

    This object allows developers to access specific details about the user's GPU so that they can preemptively apply workarounds for GPU-specific bugs, or provide different codepaths to better suit different GPU architectures. Providing such information does present a security risk — it could be used for fingerprinting — therefore the information shared is kept at a minimum, and different browser vendors are likely to share different information types and granularities." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUAdapterInfo interface of the WebGPU API contains identifying information about a GPUAdapter.\n

    An adapter's GPUAdapterInfo can be retrieved using the GPUAdapter.info property of the adapter itself, or the GPUDevice.adapterInfo property of a device that originated from the adapter.\n

    This object allows developers to access specific details about the user's GPU so that they can preemptively apply workarounds for GPU-specific bugs, or provide different codepaths to better suit different GPU architectures. Providing such information does present a security risk — it could be used for fingerprinting — therefore the information shared is kept at a minimum, and different browser vendors are likely to share different information types and granularities." }, "gpuadapterinfo.architecture": { "url": "$MDN_URL$/web/api/gpuadapterinfo/architecture", @@ -11722,7 +11740,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The architecture read-only property of the\nGPUAdapterInfo interface returns the name of the family or class of GPUs the adapter belongs to, or an empty string if it is not available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The architecture read-only property of the\nGPUAdapterInfo interface returns the name of the family or class of GPUs the adapter belongs to, or an empty string if it is not available." }, "gpuadapterinfo.description": { "url": "$MDN_URL$/web/api/gpuadapterinfo/description", @@ -11737,7 +11755,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The description read-only property of the\nGPUAdapterInfo interface returns a human-readable string describing the adapter, or an empty string if it is not available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The description read-only property of the\nGPUAdapterInfo interface returns a human-readable string describing the adapter, or an empty string if it is not available." }, "gpuadapterinfo.device": { "url": "$MDN_URL$/web/api/gpuadapterinfo/device", @@ -11752,7 +11770,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The device read-only property of the\nGPUAdapterInfo interface returns a vendor-specific identifier for the adapter, or an empty string if it is not available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The device read-only property of the\nGPUAdapterInfo interface returns a vendor-specific identifier for the adapter, or an empty string if it is not available." }, "gpuadapterinfo.isfallbackadapter": { "url": "$MDN_URL$/web/api/gpuadapterinfo/isfallbackadapter", @@ -11767,7 +11785,7 @@ "Safari": "26", "SafariIOS": "26" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isFallbackAdapter read-only property of the\nGPUAdapterInfo interface returns true if the adapter is a fallback adapter, and false if not." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isFallbackAdapter read-only property of the\nGPUAdapterInfo interface returns true if the adapter is a fallback adapter, and false if not." }, "gpuadapterinfo.subgroupmaxsize": { "url": "$MDN_URL$/web/api/gpuadapterinfo/subgroupmaxsize", @@ -11778,7 +11796,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subgroupMaxSize read-only property of the GPUAdapterInfo interface returns the maximum supported subgroup size for the GPUAdapter. This can be used along with the subgroups feature." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subgroupMaxSize read-only property of the GPUAdapterInfo interface returns the maximum supported subgroup size for the GPUAdapter. This can be used along with the subgroups feature." }, "gpuadapterinfo.subgroupminsize": { "url": "$MDN_URL$/web/api/gpuadapterinfo/subgroupminsize", @@ -11789,7 +11807,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subgroupMinSize read-only property of the GPUAdapterInfo interface returns the minimum supported subgroup size for the GPUAdapter. This can be used along with the subgroups feature." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subgroupMinSize read-only property of the GPUAdapterInfo interface returns the minimum supported subgroup size for the GPUAdapter. This can be used along with the subgroups feature." }, "gpuadapterinfo.vendor": { "url": "$MDN_URL$/web/api/gpuadapterinfo/vendor", @@ -11804,7 +11822,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vendor read-only property of the\nGPUAdapterInfo interface returns the name of the adapter vendor, or an empty string if it is not available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vendor read-only property of the\nGPUAdapterInfo interface returns the name of the adapter vendor, or an empty string if it is not available." }, "gpubindgroup": { "url": "$MDN_URL$/web/api/gpubindgroup", @@ -11819,7 +11837,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBindGroup interface of the WebGPU API is based on a GPUBindGroupLayout and defines a set of resources to be bound together in a group and how those resources are used in shader stages.\n

    A GPUBindGroup object instance is created using the GPUDevice.createBindGroup() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBindGroup interface of the WebGPU API is based on a GPUBindGroupLayout and defines a set of resources to be bound together in a group and how those resources are used in shader stages.\n

    A GPUBindGroup object instance is created using the GPUDevice.createBindGroup() method." }, "gpubindgroup.label": { "url": "$MDN_URL$/web/api/gpubindgroup/label", @@ -11834,7 +11852,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBindGroup interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBindGroup() call, or you can get and set it directly on the GPUBindGroup object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBindGroup interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBindGroup() call, or you can get and set it directly on the GPUBindGroup object." }, "gpubindgrouplayout": { "url": "$MDN_URL$/web/api/gpubindgrouplayout", @@ -11849,7 +11867,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBindGroupLayout interface of the WebGPU API defines the structure and purpose of related GPU resources such as buffers that will be used in a pipeline, and is used as a template when creating GPUBindGroups.\n

    A GPUBindGroupLayout object instance is created using the GPUDevice.createBindGroupLayout() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBindGroupLayout interface of the WebGPU API defines the structure and purpose of related GPU resources such as buffers that will be used in a pipeline, and is used as a template when creating GPUBindGroups.\n

    A GPUBindGroupLayout object instance is created using the GPUDevice.createBindGroupLayout() method." }, "gpubindgrouplayout.label": { "url": "$MDN_URL$/web/api/gpubindgrouplayout/label", @@ -11864,7 +11882,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBindGroupLayout interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBindGroupLayout() call, or you can get and set it directly on the GPUBindGroupLayout object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBindGroupLayout interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBindGroupLayout() call, or you can get and set it directly on the GPUBindGroupLayout object." }, "gpubuffer": { "url": "$MDN_URL$/web/api/gpubuffer", @@ -11879,7 +11897,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBuffer interface of the WebGPU API represents a block of memory that can be used to store raw data to use in GPU operations.\n

    A GPUBuffer object instance is created using the GPUDevice.createBuffer() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUBuffer interface of the WebGPU API represents a block of memory that can be used to store raw data to use in GPU operations.\n

    A GPUBuffer object instance is created using the GPUDevice.createBuffer() method." }, "gpubuffer.destroy": { "url": "$MDN_URL$/web/api/gpubuffer/destroy", @@ -11894,7 +11912,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUBuffer interface destroys the GPUBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUBuffer interface destroys the GPUBuffer.", "returns": "None (Undefined)." }, "gpubuffer.getmappedrange": { @@ -11910,7 +11928,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getMappedRange() method of the\nGPUBuffer interface returns an ArrayBuffer containing the mapped contents of the GPUBuffer in the specified range.\n

    This can only happen once the GPUBuffer has been successfully mapped with GPUBuffer.mapAsync() (this can be checked via GPUBuffer.mapState). While the GPUBuffer is mapped it cannot be used in any GPU commands.\n

    When you have finished working with the GPUBuffer values, call GPUBuffer.unmap() to unmap it, making it accessible to the GPU again. A TypeError is thrown if an attempt is made to detach the ArrayBuffer in any way other than via GPUBuffer.unmap(), such as by calling transfer().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getMappedRange() method of the\nGPUBuffer interface returns an ArrayBuffer containing the mapped contents of the GPUBuffer in the specified range.\n

    This can only happen once the GPUBuffer has been successfully mapped with GPUBuffer.mapAsync() (this can be checked via GPUBuffer.mapState). While the GPUBuffer is mapped it cannot be used in any GPU commands.\n

    When you have finished working with the GPUBuffer values, call GPUBuffer.unmap() to unmap it, making it accessible to the GPU again. A TypeError is thrown if an attempt is made to detach the ArrayBuffer in any way other than via GPUBuffer.unmap(), such as by calling transfer().", "parameters": { "offset": "A number representing the offset, in bytes, from the start of the GPUBuffer's mapped range to the start of the range to be returned in the ArrayBuffer. If offset is omitted, it defaults to 0.", "size": "A number representing the size, in bytes, of the ArrayBuffer to return. If size is omitted, the range extends to the end of the GPUBuffer's mapped range." @@ -11930,7 +11948,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBuffer interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBuffer() call, or you can get and set it directly on the GPUBuffer object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUBuffer interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createBuffer() call, or you can get and set it directly on the GPUBuffer object." }, "gpubuffer.mapasync": { "url": "$MDN_URL$/web/api/gpubuffer/mapasync", @@ -11945,7 +11963,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mapAsync() method of the\nGPUBuffer interface maps the specified range of the GPUBuffer. It returns a Promise that resolves when the GPUBuffer's content is ready to be accessed. While the GPUBuffer is mapped it cannot be used in any GPU commands.\n

    Once the buffer is successfully mapped (which can be checked via GPUBuffer.mapState), calls to GPUBuffer.getMappedRange() will return an ArrayBuffer containing the GPUBuffer's current values, to be read and updated by JavaScript as required.\n

    When you have finished working with the GPUBuffer values, call GPUBuffer.unmap() to unmap it, making it accessible to the GPU again.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mapAsync() method of the\nGPUBuffer interface maps the specified range of the GPUBuffer. It returns a Promise that resolves when the GPUBuffer's content is ready to be accessed. While the GPUBuffer is mapped it cannot be used in any GPU commands.\n

    Once the buffer is successfully mapped (which can be checked via GPUBuffer.mapState), calls to GPUBuffer.getMappedRange() will return an ArrayBuffer containing the GPUBuffer's current values, to be read and updated by JavaScript as required.\n

    When you have finished working with the GPUBuffer values, call GPUBuffer.unmap() to unmap it, making it accessible to the GPU again.", "parameters": { "mode": "A bitwise flag that specifies whether the GPUBuffer is mapped for reading or writing. Possible values are:\n

    \n
    GPUMapMode.READ
    \n
    \n

    The GPUBuffer is mapped for reading. Values can be read, but any changes made to the ArrayBuffer returned by GPUBuffer.getMappedRange() will be discarded once GPUBuffer.unmap() is called.\n

    Read-mode mapping can only be used on GPUBuffers that have a usage of GPUBufferUsage.MAP_READ set on them (i.e., when created with GPUDevice.createBuffer()).\n

    \n
    GPUMapMode.WRITE
    \n
    \n

    The GPUBuffer is mapped for writing. Values can be read and updated — any changes made to the ArrayBuffer returned by GPUBuffer.getMappedRange() will be saved to the GPUBuffer once GPUBuffer.unmap() is called.\n

    Write-mode mapping can only be used on GPUBuffers that have a usage of GPUBufferUsage.MAP_WRITE set on them (i.e., when created with GPUDevice.createBuffer()).\n

    \n
    ", "offset": "A number representing the offset, in bytes, from the start of the buffer to the start of the range to be mapped. If offset is omitted, it defaults to 0.", @@ -11966,7 +11984,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mapState read-only property of the\nGPUBuffer interface represents the mapped state of the GPUBuffer." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mapState read-only property of the\nGPUBuffer interface represents the mapped state of the GPUBuffer." }, "gpubuffer.size": { "url": "$MDN_URL$/web/api/gpubuffer/size", @@ -11981,7 +11999,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The size read-only property of the\nGPUBuffer interface represents the length of the GPUBuffer's memory allocation, in bytes.\n

    size is set via the size property in the descriptor object passed into the originating GPUDevice.createBuffer() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The size read-only property of the\nGPUBuffer interface represents the length of the GPUBuffer's memory allocation, in bytes.\n

    size is set via the size property in the descriptor object passed into the originating GPUDevice.createBuffer() call." }, "gpubuffer.unmap": { "url": "$MDN_URL$/web/api/gpubuffer/unmap", @@ -11996,7 +12014,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unmap() method of the\nGPUBuffer interface unmaps the mapped range of the GPUBuffer, making its contents available for use by the GPU again after it has previously been mapped with GPUBuffer.mapAsync() (the GPU cannot access a mapped GPUBuffer).\n

    When unmap() is called, any ArrayBuffers created via GPUBuffer.getMappedRange() are detached.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unmap() method of the\nGPUBuffer interface unmaps the mapped range of the GPUBuffer, making its contents available for use by the GPU again after it has previously been mapped with GPUBuffer.mapAsync() (the GPU cannot access a mapped GPUBuffer).\n

    When unmap() is called, any ArrayBuffers created via GPUBuffer.getMappedRange() are detached.", "returns": "None (Undefined)." }, "gpubuffer.usage": { @@ -12012,7 +12030,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usage read-only property of the\nGPUBuffer interface contains the bitwise flags representing the allowed usages of the GPUBuffer.\n

    usage is set via the usage property in the descriptor object passed into the originating GPUDevice.createBuffer() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usage read-only property of the\nGPUBuffer interface contains the bitwise flags representing the allowed usages of the GPUBuffer.\n

    usage is set via the usage property in the descriptor object passed into the originating GPUDevice.createBuffer() call." }, "gpucanvascontext": { "url": "$MDN_URL$/web/api/gpucanvascontext", @@ -12027,7 +12045,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCanvasContext interface of the WebGPU API represents the WebGPU rendering context of a <canvas> element, returned via an HTMLCanvasElement.getContext() call with a contextType of \"webgpu\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCanvasContext interface of the WebGPU API represents the WebGPU rendering context of a <canvas> element, returned via an HTMLCanvasElement.getContext() call with a contextType of \"webgpu\"." }, "gpucanvascontext.canvas": { "url": "$MDN_URL$/web/api/gpucanvascontext/canvas", @@ -12042,7 +12060,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The canvas read-only property of the\nGPUCanvasContext interface returns a reference to the canvas that the context was created from." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The canvas read-only property of the\nGPUCanvasContext interface returns a reference to the canvas that the context was created from." }, "gpucanvascontext.configure": { "url": "$MDN_URL$/web/api/gpucanvascontext/configure", @@ -12057,7 +12075,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configure() method of the\nGPUCanvasContext interface configures the context to use for rendering with a given GPUDevice. When called the canvas will initially be cleared to transparent black.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configure() method of the\nGPUCanvasContext interface configures the context to use for rendering with a given GPUDevice. When called the canvas will initially be cleared to transparent black.", "parameters": { "configuration": "An object containing the following properties:\n

    \n
    alphaMode Optional
    \n
    \n

    An enumerated value that specifies the effect that alpha values will have on the content of textures returned by getCurrentTexture() when read, displayed, or used as an image source. Possible values are:\n

      \n
    • opaque: Alpha values are ignored — if a texture is not already opaque, the alpha channel is cleared to 1.0 when it is used as an image source or displayed to the screen. This is the default value.
    • \n
    • premultiplied: Color values are premultiplied by their alpha value. For example, 100% red at 50% alpha is [0.5, 0, 0, 0.5].
    • \n
    \n
    \n
    colorSpace Optional
    \n
    \n

    The color space that values written into textures returned by getCurrentTexture() should be displayed with. Possible values are srgb (the default) and display-p3.\n

    \n
    device
    \n
    \n

    The GPUDevice that the rendering information for the context will come from.\n

    \n
    format
    \n
    \n

    The format that textures returned by getCurrentTexture() will have. This can be bgra8unorm, rgba8unorm, or rgba16float. The optimal canvas texture format for the current system can be returned by GPU.getPreferredCanvasFormat(). Using 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.\n

    \n
    toneMapping Optional
    \n
    \n

    An object specifying parameters that define the tone mapping for the context — how the content of associated textures are to be displayed. This allows WebGPU to draw colors brighter than white (#FFFFFF). Possible properties are:\n

    \n
    mode Optional
    \n
    \n

    An enumerated value specifying the tone mapping mode for the canvas. Possible values include:\n

    \n
    standard
    \n
    \n

    The default value. Restricts rendered content to the Standard Dynamic Range (SDR) of the display. This mode is accomplished by clamping all color values in the color space of the screen to the [0, 1] interval.\n

    \n
    extended
    \n
    \n

    Allows content to be rendered in the full High Dynamic Range (HDR) of the display, where available. HDR mode allows a wider range of colors and brightness levels to be displayed, with more precise instructions as to what color should be displayed in each case. This mode matches \"standard\" in the [0, 1] range of the screen. Clamping or projection is done to the extended dynamic range of the screen but not [0, 1].\n

    \n
    \n
    \n
    \n
    \n
    usage Optional
    \n
    \n

    Bitwise flags specifying the allowed usage for textures returned by getCurrentTexture(). Possible values are:\n

      \n
    • GPUTextureUsage.COPY_SRC: The texture can be used as the source of a copy operation, for example the source argument of a GPUCommandEncoder.copyTextureToBuffer() call.
    • \n
    • GPUTextureUsage.COPY_DST: The texture can be used as the destination of a copy/write operation, for example the destination argument of a GPUCommandEncoder.copyTextureToTexture() call.
    • \n
    • GPUTextureUsage.RENDER_ATTACHMENT: The texture can be used as a color attachment in a render pass, for example in a color attachment view in a GPUCommandEncoder.beginRenderPass() call. GPUTextureUsage.RENDER_ATTACHMENT is the default usage, but note that it is not automatically included if a different value is explicitly set; in such cases you need to include it in addition.
    • \n
    • GPUTextureUsage.TEXTURE_BINDING: The texture can be bound for use as a sampled texture in a shader, for example in a bind group entry in a GPUDevice.createBindGroup() call.
    • \n
    • GPUTextureUsage.STORAGE_BINDING: The texture can be bound for use as a storage texture in a shader, for example in a bind group entry in a GPUDevice.createBindGroup() call.
    • \n
    \n

    Note that multiple possible usages can be specified using the bitwise OR operator. For example, usage: GPUTextureUsage.COPY_SRC | GPUTextureUsage.RENDER_ATTACHMENT.\n

    \n
    viewFormats Optional
    \n
    \n

    An array of formats that views created from textures returned by getCurrentTexture() may use. See Texture Formats for all the possible values.\n

    \n
    " }, @@ -12075,7 +12093,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getConfiguration() method of the\nGPUCanvasContext interface returns the current configuration set for the context.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getConfiguration() method of the\nGPUCanvasContext interface returns the current configuration set for the context.", "returns": "An object containing the configuration options set on the context (i.e., via the GPUCanvasContext.configure() method), or null if no configuration is set (either no configuration was previously set, or a configuration was set and then GPUCanvasContext.unconfigure() was called on the context)." }, "gpucanvascontext.getcurrenttexture": { @@ -12091,7 +12109,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getCurrentTexture() method of the\nGPUCanvasContext interface returns the next GPUTexture to be composited to the document by the canvas context.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getCurrentTexture() method of the\nGPUCanvasContext interface returns the next GPUTexture to be composited to the document by the canvas context.", "returns": "A GPUTexture object instance.", "throws": { "InvalidStateError DOMException": "Thrown if getCurrentTexture() is called on the canvas context before it is configured (i.e., before GPUCanvasContext.configure() has been called)." @@ -12110,7 +12128,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unconfigure() method of the\nGPUCanvasContext interface removes any previously-set context configuration, and destroys any textures returned via getCurrentTexture() while the canvas context was configured.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unconfigure() method of the\nGPUCanvasContext interface removes any previously-set context configuration, and destroys any textures returned via getCurrentTexture() while the canvas context was configured.", "returns": "None (undefined)." }, "gpucommandbuffer": { @@ -12126,7 +12144,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCommandBuffer interface of the WebGPU API represents a pre-recorded list of GPU commands that can be submitted to a GPUQueue for execution.\n

    A GPUCommandBuffer is created via the GPUCommandEncoder.finish() method; the GPU commands recorded within are submitted for execution by passing the GPUCommandBuffer into the parameter of a GPUQueue.submit() call.\n

    \n

    Note:\nOnce a GPUCommandBuffer object has been submitted, it cannot be used again.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCommandBuffer interface of the WebGPU API represents a pre-recorded list of GPU commands that can be submitted to a GPUQueue for execution.\n

    A GPUCommandBuffer is created via the GPUCommandEncoder.finish() method; the GPU commands recorded within are submitted for execution by passing the GPUCommandBuffer into the parameter of a GPUQueue.submit() call.\n

    \n

    Note:\nOnce a GPUCommandBuffer object has been submitted, it cannot be used again.\n

    " }, "gpucommandbuffer.label": { "url": "$MDN_URL$/web/api/gpucommandbuffer/label", @@ -12141,7 +12159,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUCommandBuffer interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.finish() call, or you can get and set it directly on the GPUCommandBuffer object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUCommandBuffer interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.finish() call, or you can get and set it directly on the GPUCommandBuffer object." }, "gpucommandencoder": { "url": "$MDN_URL$/web/api/gpucommandencoder", @@ -12156,7 +12174,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCommandEncoder interface of the WebGPU API represents an encoder that collects a sequence of GPU commands to be issued to the GPU.\n

    A GPUCommandEncoder object instance is created via the GPUDevice.createCommandEncoder() property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCommandEncoder interface of the WebGPU API represents an encoder that collects a sequence of GPU commands to be issued to the GPU.\n

    A GPUCommandEncoder object instance is created via the GPUDevice.createCommandEncoder() property." }, "gpucommandencoder.begincomputepass": { "url": "$MDN_URL$/web/api/gpucommandencoder/begincomputepass", @@ -12171,7 +12189,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginComputePass() method of the\nGPUCommandEncoder interface starts encoding a compute pass, returning a GPUComputePassEncoder that can be used to control computation.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginComputePass() method of the\nGPUCommandEncoder interface starts encoding a compute pass, returning a GPUComputePassEncoder that can be used to control computation.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    timestampWrites Optional
    \n
    \n

    An array of objects defining where and when timestamp query values will be written for this pass. These objects have the following properties:\n

    \n
    querySet
    \n
    \n

    A GPUQuerySet of type \"timestamp\" that the timestamp query results will be written to.\n

    \n
    beginningOfPassWriteIndex
    \n
    \n

    A number specifying the query index in querySet where the timestamp at the beginning of the render pass will be written. This is optional - if not defined, no timestamp will be written for the beginning of the pass.\n

    \n
    endOfPassWriteIndex
    \n
    \n

    A number specifying the query index in querySet where the timestamp at the end of the render pass will be written. This is optional - if not defined, no timestamp will be written for the end of the pass.\n

    \n
    \n
    \n

    Note:\nThe timestamp-query feature needs to be enabled to use timestamp queries. Timestamp query values are written in nanoseconds, but how the value is determined is implementation-defined.\n

    \n
    \n
    " }, @@ -12190,7 +12208,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginRenderPass() method of the\nGPUCommandEncoder interface starts encoding a render pass, returning a GPURenderPassEncoder that can be used to control rendering.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginRenderPass() method of the\nGPUCommandEncoder interface starts encoding a render pass, returning a GPURenderPassEncoder that can be used to control rendering.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    colorAttachments
    \n
    \n

    An array of objects (see Color attachment object structure) defining the color attachments that will be output to when executing this render pass.\n

    \n
    depthStencilAttachment Optional
    \n
    \n

    An object (see Depth/stencil attachment object structure) defining the depth/stencil attachment that will be output to and tested against when executing this render pass.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    maxDrawCount Optional
    \n
    \n

    A number indicating the maximum number of draw calls that will be done in the render pass. This is used by some implementations to size work injected before the render pass. You should keep the default value — 50000000 — unless you know that more draw calls will be done.\n

    \n
    occlusionQuerySet Optional
    \n
    \n

    The GPUQuerySet that will store the occlusion query results for this pass.\n

    \n
    timestampWrites Optional
    \n
    \n

    An array of objects defining where and when timestamp query values will be written for this pass. These objects have the following properties:\n

    \n
    querySet
    \n
    \n

    A GPUQuerySet of type \"timestamp\" that the timestamp query results will be written to.\n

    \n
    beginningOfPassWriteIndex
    \n
    \n

    A number specifying the query index in querySet where the timestamp at the beginning of the render pass will be written. This is optional - if not defined, no timestamp will be written for the beginning of the pass.\n

    \n
    endOfPassWriteIndex
    \n
    \n

    A number specifying the query index in querySet where the timestamp at the end of the render pass will be written. This is optional - if not defined, no timestamp will be written for the end of the pass.\n

    \n
    \n
    \n

    Note:\nThe timestamp-query feature needs to be enabled to use timestamp queries. Timestamp query values are written in nanoseconds, but how the value is determined is implementation-defined.\n

    \n
    \n
    " }, @@ -12209,7 +12227,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The clearBuffer() method of the\nGPUCommandEncoder interface encodes a command that fills a region of a GPUBuffer with zeroes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The clearBuffer() method of the\nGPUCommandEncoder interface encodes a command that fills a region of a GPUBuffer with zeroes.", "parameters": { "buffer": "A GPUBuffer object representing the buffer to clear.", "offset": "A number representing the offset, in bytes, from the start of the buffer to the sub-region to clear. If omitted, offset defaults to 0.", @@ -12230,7 +12248,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyBufferToBuffer() method of the\nGPUCommandEncoder interface encodes a command that copies data from one GPUBuffer to another.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyBufferToBuffer() method of the\nGPUCommandEncoder interface encodes a command that copies data from one GPUBuffer to another.", "parameters": { "source": "The GPUBuffer to copy from.", "sourceOffset": "The offset, in bytes, into the source to begin copying from.", @@ -12253,7 +12271,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyBufferToTexture() method of the\nGPUCommandEncoder interface encodes a command that copies data from a GPUBuffer to a GPUTexture.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyBufferToTexture() method of the\nGPUCommandEncoder interface encodes a command that copies data from a GPUBuffer to a GPUTexture.", "parameters": { "source": "An object that defines the buffer to copy from, plus the layout of the data in the buffer to be copied to the texture. Combined with copySize, it defines the region of the source buffer. source can take the following properties:\n

    \n
    buffer
    \n
    \n

    The GPUBuffer to copy from.\n

    \n
    offset Optional
    \n
    \n

    The offset, in bytes, from the beginning of data to the start of the image data to be copied. If omitted, offset defaults to 0.\n

    \n
    bytesPerRow Optional
    \n
    \n

    A number representing the stride, in bytes, between the start of each block row (i.e., a row of complete texel blocks) and the subsequent block row. This is required if there are multiple block rows (i.e., the copy height or depth is more than one block).\n

    \n
    rowsPerImage Optional
    \n
    \n

    The number of block rows per single image inside the data. bytesPerRow × rowsPerImage will give you the stride, in bytes, between the start of each complete image. This is required if there are multiple images to copy.\n

    \n
    ", "destination": "An object defining the texture to write the data to. Combined with copySize, defines the region of the destination texture subresource. destination can take the following properties:\n
    \n
    aspect Optional
    \n
    \n

    An enumerated value defining which aspects of the texture to write the data to. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be written to, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be written to.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be written to.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    mipLevel Optional
    \n
    \n

    A number representing the mip-map level of the texture to write the data to. If omitted, mipLevel defaults to 0.\n

    \n
    origin Optional
    \n
    \n

    An object or array specifying the origin of the copy — the minimum corner of the texture region to write the data to. Together with size, this defines the full extent of the region to copy to. The x, y, and z values default to 0 if any of all of origin is omitted.\n

    For example, you can pass an array like [0, 0, 0], or its equivalent object { x: 0, y: 0, z: 0 }.\n

    \n
    texture
    \n
    \n

    A GPUTexture object representing the texture to write the data to.\n

    \n
    ", @@ -12274,7 +12292,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyTextureToBuffer() method of the\nGPUCommandEncoder interface encodes a command that copies data from a GPUTexture to a GPUBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyTextureToBuffer() method of the\nGPUCommandEncoder interface encodes a command that copies data from a GPUTexture to a GPUBuffer.", "parameters": { "source": "An object defining the texture to copy the data from. Combined with copySize, defines the region of the source texture subresource. source can take the following properties:\n

    \n
    aspect Optional
    \n
    \n

    An enumerated value defining which aspects of the texture to copy the data from. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be copied from, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be copied from.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be copied from.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    mipLevel Optional
    \n
    \n

    A number representing the mip-map level of the texture to copy the data from. If omitted, mipLevel defaults to 0.\n

    \n
    origin Optional
    \n
    \n

    An object or array specifying the origin of the copy — the minimum corner of the texture region to copy the data from. Together with size, this defines the full extent of the region to copy from. The x, y, and z values default to 0 if any of all of origin is omitted.\n

    For example, you can pass an array [0, 0, 0], or its equivalent object { x: 0, y: 0, z: 0 }.\n

    \n
    texture
    \n
    \n

    A GPUTexture object representing the texture to copy the data from.\n

    \n
    ", "destination": "An object that defines the buffer to write to, plus the layout of the data to write to the buffer. Combined with copySize, it defines the region of the destination buffer. source can take the following properties:\n
    \n
    buffer
    \n
    \n

    The GPUBuffer to write to.\n

    \n
    offset Optional
    \n
    \n

    The offset, in bytes, from the beginning of data to the start position to write the copied data to. If omitted, offset defaults to 0.\n

    \n
    bytesPerRow Optional
    \n
    \n

    A number representing the stride, in bytes, between the start of each block row (i.e., a row of complete texel blocks) and the subsequent block row. This is required if there are multiple block rows (i.e., the copy height or depth is more than one block).\n

    \n
    rowsPerImage Optional
    \n
    \n

    The number of block rows per single image inside the data. bytesPerRow × rowsPerImage will give you the stride, in bytes, between the start of each complete image. This is required if there are multiple images to copy.\n

    \n
    ", @@ -12295,7 +12313,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyTextureToTexture() method of the\nGPUCommandEncoder interface encodes a command that copies data from one GPUTexture to another.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The copyTextureToTexture() method of the\nGPUCommandEncoder interface encodes a command that copies data from one GPUTexture to another.", "parameters": { "source": "An object (see Copy texture object structure) defining the texture to copy the data from. Combined with copySize, this defines the region of the source texture subresource.", "destination": "An object (see Copy texture object structure) defining the texture to write the data to. Combined with copySize, this defines the region of the destination texture subresource.", @@ -12316,7 +12334,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The finish() method of the\nGPUCommandEncoder interface completes recording of the command sequence encoded on this GPUCommandEncoder, returning a corresponding GPUCommandBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The finish() method of the\nGPUCommandEncoder interface completes recording of the command sequence encoded on this GPUCommandEncoder, returning a corresponding GPUCommandBuffer.", "parameters": { "descriptor": "An object that can contain the following properties:\n

    \n
    label Optional
    \n
    \n

    A string providing a label for the returned GPUCommandBuffer that can be used to identify it, for example in GPUError messages or console warnings.\n

    \n
    " }, @@ -12335,7 +12353,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPUCommandEncoder interface marks a specific point in a series of encoded commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPUCommandEncoder interface marks a specific point in a series of encoded commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "markerLabel": "A string representing the label to insert." }, @@ -12354,7 +12372,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUCommandEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createCommandEncoder() call, or you can get and set it directly on the GPUCommandEncoder object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUCommandEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createCommandEncoder() call, or you can get and set it directly on the GPUCommandEncoder object." }, "gpucommandencoder.popdebuggroup": { "url": "$MDN_URL$/web/api/gpucommandencoder/popdebuggroup", @@ -12369,7 +12387,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPUCommandEncoder interface ends a debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPUCommandEncoder interface ends a debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "returns": "None (Undefined)." }, "gpucommandencoder.pushdebuggroup": { @@ -12385,7 +12403,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPUCommandEncoder interface begins a debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPUCommandEncoder interface begins a debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "groupLabel": "A string representing the label for the debug group." }, @@ -12404,7 +12422,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The resolveQuerySet() method of the\nGPUCommandEncoder interface encodes a command that resolves a GPUQuerySet, copying the results into a specified GPUBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The resolveQuerySet() method of the\nGPUCommandEncoder interface encodes a command that resolves a GPUQuerySet, copying the results into a specified GPUBuffer.", "parameters": { "querySet": "A GPUQuerySet object representing the query set to be resolved.", "firstQuery": "The index number of the first query value to be copied over to the buffer.", @@ -12420,7 +12438,7 @@ "Deprecated" ], "compatibility": {}, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeTimestamp() method of the\nGPUCommandEncoder interface encodes a command that writes a timestamp into a GPUQuerySet once the previous commands recorded into the same queued GPUCommandBuffer have been executed by the GPU.\n

    \n

    Note:\nTo use timestamp queries, the timestamp-query feature must be enabled in the GPUDevice.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeTimestamp() method of the\nGPUCommandEncoder interface encodes a command that writes a timestamp into a GPUQuerySet once the previous commands recorded into the same queued GPUCommandBuffer have been executed by the GPU.\n

    \n

    Note:\nTo use timestamp queries, the timestamp-query feature must be enabled in the GPUDevice.\n

    ", "parameters": { "querySet": "A GPUQuerySet object representing the query set that will store the timestamp values.", "queryIndex": "A number representing the index of the query in the query set." @@ -12440,7 +12458,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCompilationInfo interface of the WebGPU API represents an array of GPUCompilationMessage objects generated by the GPU shader module compiler to help diagnose problems with shader code.\n

    GPUCompilationInfo is accessed via GPUShaderModule.getCompilationInfo()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCompilationInfo interface of the WebGPU API represents an array of GPUCompilationMessage objects generated by the GPU shader module compiler to help diagnose problems with shader code.\n

    GPUCompilationInfo is accessed via GPUShaderModule.getCompilationInfo()." }, "gpucompilationinfo.messages": { "url": "$MDN_URL$/web/api/gpucompilationinfo/messages", @@ -12455,7 +12473,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The messages read-only property of the\nGPUCompilationInfo interface is an array of GPUCompilationMessage objects, each one containing the details of an individual shader compilation message. Messages can be informational, warnings, or errors." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The messages read-only property of the\nGPUCompilationInfo interface is an array of GPUCompilationMessage objects, each one containing the details of an individual shader compilation message. Messages can be informational, warnings, or errors." }, "gpucompilationmessage": { "url": "$MDN_URL$/web/api/gpucompilationmessage", @@ -12470,7 +12488,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCompilationMessage interface of the WebGPU API represents a single informational, warning, or error message generated by the GPU shader module compiler.\n

    An array of GPUCompilationMessage objects is available in the messages property of the GPUCompilationInfo object accessed via GPUShaderModule.getCompilationInfo()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUCompilationMessage interface of the WebGPU API represents a single informational, warning, or error message generated by the GPU shader module compiler.\n

    An array of GPUCompilationMessage objects is available in the messages property of the GPUCompilationInfo object accessed via GPUShaderModule.getCompilationInfo()." }, "gpucompilationmessage.length": { "url": "$MDN_URL$/web/api/gpucompilationmessage/length", @@ -12485,7 +12503,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The length read-only property of the\nGPUCompilationMessage interface is a number representing the length of the substring that the message corresponds to." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The length read-only property of the\nGPUCompilationMessage interface is a number representing the length of the substring that the message corresponds to." }, "gpucompilationmessage.linenum": { "url": "$MDN_URL$/web/api/gpucompilationmessage/linenum", @@ -12500,7 +12518,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lineNum read-only property of the\nGPUCompilationMessage interface is a number representing the line number in the shader code that the message corresponds to." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lineNum read-only property of the\nGPUCompilationMessage interface is a number representing the line number in the shader code that the message corresponds to." }, "gpucompilationmessage.linepos": { "url": "$MDN_URL$/web/api/gpucompilationmessage/linepos", @@ -12515,7 +12533,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The linePos read-only property of the\nGPUCompilationMessage interface is a number representing the position in the code line that the message corresponds to. This could be an exact point, or the start of the relevant substring." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The linePos read-only property of the\nGPUCompilationMessage interface is a number representing the position in the code line that the message corresponds to. This could be an exact point, or the start of the relevant substring." }, "gpucompilationmessage.message": { "url": "$MDN_URL$/web/api/gpucompilationmessage/message", @@ -12530,7 +12548,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUCompilationMessage interface is a string representing human-readable message text." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUCompilationMessage interface is a string representing human-readable message text." }, "gpucompilationmessage.offset": { "url": "$MDN_URL$/web/api/gpucompilationmessage/offset", @@ -12545,7 +12563,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The offset read-only property of the\nGPUCompilationMessage interface is a number representing the offset from the start of the shader code to the exact point, or the start of the relevant substring, that the message corresponds to." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The offset read-only property of the\nGPUCompilationMessage interface is a number representing the offset from the start of the shader code to the exact point, or the start of the relevant substring, that the message corresponds to." }, "gpucompilationmessage.type": { "url": "$MDN_URL$/web/api/gpucompilationmessage/type", @@ -12560,7 +12578,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The type read-only property of the\nGPUCompilationMessage interface is an enumerated value representing the type of the message. Each type represents a different severity level." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The type read-only property of the\nGPUCompilationMessage interface is an enumerated value representing the type of the message. Each type represents a different severity level." }, "gpucomputepassencoder": { "url": "$MDN_URL$/web/api/gpucomputepassencoder", @@ -12575,7 +12593,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUComputePassEncoder interface of the WebGPU API encodes commands related to controlling the compute shader stage, as issued by a GPUComputePipeline. It forms part of the overall encoding activity of a GPUCommandEncoder.\n

    A compute pipeline contains a single compute stage in which a compute shader takes general data, processes it in parallel across a specified number of workgroups, then returns the result in one or more buffers.\n

    A GPUComputePassEncoder object instance is created via the GPUCommandEncoder.beginComputePass() property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUComputePassEncoder interface of the WebGPU API encodes commands related to controlling the compute shader stage, as issued by a GPUComputePipeline. It forms part of the overall encoding activity of a GPUCommandEncoder.\n

    A compute pipeline contains a single compute stage in which a compute shader takes general data, processes it in parallel across a specified number of workgroups, then returns the result in one or more buffers.\n

    A GPUComputePassEncoder object instance is created via the GPUCommandEncoder.beginComputePass() property." }, "gpucomputepassencoder.dispatchworkgroups": { "url": "$MDN_URL$/web/api/gpucomputepassencoder/dispatchworkgroups", @@ -12590,7 +12608,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dispatchWorkgroups() method of the\nGPUComputePassEncoder interface dispatches a specific grid of workgroups to perform the work being done by the current GPUComputePipeline (i.e., set via GPUComputePassEncoder.setPipeline()).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dispatchWorkgroups() method of the\nGPUComputePassEncoder interface dispatches a specific grid of workgroups to perform the work being done by the current GPUComputePipeline (i.e., set via GPUComputePassEncoder.setPipeline()).", "parameters": { "workgroupCountX": "The X dimension of the grid of workgroups to dispatch.", "workgroupCountY": "The Y dimension of the grid of workgroups to dispatch. If omitted, workgroupCountY defaults to 1.", @@ -12611,7 +12629,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dispatchWorkgroupsIndirect() method of the\nGPUComputePassEncoder interface dispatches a grid of workgroups, defined by the parameters of a GPUBuffer, to perform the work being done by the current GPUComputePipeline (i.e., set via GPUComputePassEncoder.setPipeline()).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dispatchWorkgroupsIndirect() method of the\nGPUComputePassEncoder interface dispatches a grid of workgroups, defined by the parameters of a GPUBuffer, to perform the work being done by the current GPUComputePipeline (i.e., set via GPUComputePassEncoder.setPipeline()).", "parameters": { "indirectBuffer": "A GPUBuffer containing the X, Y, and Z dimensions of the grid of workgroups to dispatch. The buffer must contain a tightly packed block of three 32-bit unsigned integer values representing the dimensions (12 bytes total), given in the same order as the arguments for GPUComputePassEncoder.dispatchWorkgroups(). So for example:\n

    \n```js\nconst uint32 = new Uint32Array(3);\nuint32[0] = 25; // The X value\nuint32[1] = 1; // The Y value\nuint32[2] = 1; // The Z value\n// Write values into a GPUBuffer\ndevice.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);\n```\n
    ", "indirectOffset": "The offset, in bytes, into indirectBuffer where the dimension data begins." @@ -12631,7 +12649,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The end() method of the\nGPUComputePassEncoder interface completes recording of the current compute pass command sequence.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The end() method of the\nGPUComputePassEncoder interface completes recording of the current compute pass command sequence.", "returns": "None (Undefined)." }, "gpucomputepassencoder.insertdebugmarker": { @@ -12647,7 +12665,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPUComputePassEncoder interface marks a specific point in a series of encoded compute pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPUComputePassEncoder interface marks a specific point in a series of encoded compute pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "markerLabel": "A string representing the label to insert." }, @@ -12666,7 +12684,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUComputePassEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.beginComputePass() call, or you can get and set it directly on the GPUComputePassEncoder object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUComputePassEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.beginComputePass() call, or you can get and set it directly on the GPUComputePassEncoder object." }, "gpucomputepassencoder.popdebuggroup": { "url": "$MDN_URL$/web/api/gpucomputepassencoder/popdebuggroup", @@ -12681,7 +12699,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPUComputePassEncoder interface ends a compute pass debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPUComputePassEncoder interface ends a compute pass debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "returns": "None (Undefined)." }, "gpucomputepassencoder.pushdebuggroup": { @@ -12697,7 +12715,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPUComputePassEncoder interface begins a compute pass debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPUComputePassEncoder interface begins a compute pass debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "groupLabel": "A string representing the label for the debug group." }, @@ -12716,7 +12734,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPUComputePassEncoder interface sets the GPUBindGroup to use for subsequent compute commands, for a given index.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPUComputePassEncoder interface sets the GPUBindGroup to use for subsequent compute commands, for a given index.", "parameters": { "index": "The index to set the bind group at. This matches the n index value of the corresponding @group(n) attribute in the shader code (GPUShaderModule) used in the related pipeline.", "bindGroup": "The GPUBindGroup to use for subsequent compute commands, or null, in which case any previously-set bind group in the given slot is unset.", @@ -12739,7 +12757,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPUComputePassEncoder interface sets the GPUComputePipeline to use for this compute pass.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPUComputePassEncoder interface sets the GPUComputePipeline to use for this compute pass.", "parameters": { "pipeline": "The GPUComputePipeline to use for this compute pass." }, @@ -12758,7 +12776,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUComputePipeline interface of the WebGPU API represents a pipeline that controls the compute shader stage and can be used in a GPUComputePassEncoder.\n

    A GPUComputePipeline object instance can be created using the GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() methods." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUComputePipeline interface of the WebGPU API represents a pipeline that controls the compute shader stage and can be used in a GPUComputePassEncoder.\n

    A GPUComputePipeline object instance can be created using the GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() methods." }, "gpucomputepipeline.getbindgrouplayout": { "url": "$MDN_URL$/web/api/gpucomputepipeline/getbindgrouplayout", @@ -12773,7 +12791,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getBindGroupLayout() method of the\nGPUComputePipeline interface returns the pipeline's GPUBindGroupLayout object with the given index (i.e., included in the originating GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() call's pipeline layout).\n

    If the GPUComputePipeline was created with layout: \"auto\", this method is the only way to retrieve the GPUBindGroupLayouts generated by the pipeline.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getBindGroupLayout() method of the\nGPUComputePipeline interface returns the pipeline's GPUBindGroupLayout object with the given index (i.e., included in the originating GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() call's pipeline layout).\n

    If the GPUComputePipeline was created with layout: \"auto\", this method is the only way to retrieve the GPUBindGroupLayouts generated by the pipeline.", "parameters": { "index": "A number representing the index of the GPUBindGroupLayout to return." }, @@ -12792,7 +12810,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUComputePipeline interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() call, or you can get and set it directly on the GPUComputePipeline object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUComputePipeline interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createComputePipeline() or GPUDevice.createComputePipelineAsync() call, or you can get and set it directly on the GPUComputePipeline object." }, "gpudevice": { "url": "$MDN_URL$/web/api/gpudevice", @@ -12807,7 +12825,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUDevice interface of the WebGPU API represents a logical GPU device. This is the main interface through which the majority of WebGPU functionality is accessed.\n

    A GPUDevice object is requested using the GPUAdapter.requestDevice() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUDevice interface of the WebGPU API represents a logical GPU device. This is the main interface through which the majority of WebGPU functionality is accessed.\n

    A GPUDevice object is requested using the GPUAdapter.requestDevice() method." }, "gpudevice.adapterinfo": { "url": "$MDN_URL$/web/api/gpudevice/adapterinfo", @@ -12818,7 +12836,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The adapterInfo read-only property of the\nGPUDevice interface returns a GPUAdapterInfo object containing identifying information about the device's originating adapter." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The adapterInfo read-only property of the\nGPUDevice interface returns a GPUAdapterInfo object containing identifying information about the device's originating adapter." }, "gpudevice.createbindgroup": { "url": "$MDN_URL$/web/api/gpudevice/createbindgroup", @@ -12833,7 +12851,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBindGroup() method of the\nGPUDevice interface creates a GPUBindGroup based on a GPUBindGroupLayout that defines a set of resources to be bound together in a group and how those resources are used in shader stages.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBindGroup() method of the\nGPUDevice interface creates a GPUBindGroup based on a GPUBindGroupLayout that defines a set of resources to be bound together in a group and how those resources are used in shader stages.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    entries
    \n
    \n

    An array of entry objects describing the resources to expose to the shader. There will be one for each corresponding entry described by the GPUBindGroupLayout referenced in layout. Each entry object has the following properties:\n

    \n
    binding
    \n
    \n

    A number representing a unique identifier for this resource binding, which matches the binding value of a corresponding GPUBindGroupLayout entry. In addition, it matches the n index value of the corresponding @binding(n) attribute in the shader (GPUShaderModule) used in the related pipeline.\n

    \n
    resource
    \n
    \n

    The resource to bind. This can be one of the following:\n

    \n
    \n
    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    layout
    \n
    \n

    The GPUBindGroupLayout that the entries of this bind group will conform to.\n

    \n
    " }, @@ -12852,7 +12870,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBindGroupLayout() method of the\nGPUDevice interface creates a GPUBindGroupLayout that defines the structure and purpose of related GPU resources such as buffers that will be used in a pipeline, and is used as a template when creating GPUBindGroups.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBindGroupLayout() method of the\nGPUDevice interface creates a GPUBindGroupLayout that defines the structure and purpose of related GPU resources such as buffers that will be used in a pipeline, and is used as a template when creating GPUBindGroups.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    entries
    \n
    \n

    An array of entry objects, each one of which describes a single shader resource binding to be included in the GPUBindGroupLayout. Each entry will correspond to an entry defined in a GPUBindGroup (created via a GPUDevice.createBindGroup() call) that uses this GPUBindGroupLayout object as a template.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    " }, @@ -12871,7 +12889,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBuffer() method of the\nGPUDevice interface creates a GPUBuffer in which to store raw data to use in GPU operations.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBuffer() method of the\nGPUDevice interface creates a GPUBuffer in which to store raw data to use in GPU operations.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    mappedAtCreation Optional
    \n
    \n

    A boolean. If set to true, the buffer will be mapped upon creation, meaning that you can set the values inside the buffer immediately by calling GPUBuffer.getMappedRange(). The default value is false.\n

    Note that it is valid to set mappedAtCreation: true so you can set the buffer's initial data, even if the GPUBufferUsage.MAP_READ or GPUBufferUsage.MAP_WRITE usage flags are not set.\n

    \n
    size
    \n
    \n

    A number representing the size of the buffer, in bytes. If mappedAtCreation is set to true, this must be a multiple of 4.\n

    \n
    usage
    \n
    \n

    The bitwise flags representing the allowed usages for the GPUBuffer. The possible values are in the GPUBuffer.usage value table.\n

    Note that multiple possible usages can be specified by separating values with bitwise OR, for example: GPUBufferUsage.COPY_SRC | GPUBufferUsage.MAP_WRITE.\n

    \n
    " }, @@ -12893,7 +12911,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createCommandEncoder() method of the\nGPUDevice interface creates a GPUCommandEncoder, used to encode commands to be issued to the GPU.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createCommandEncoder() method of the\nGPUDevice interface creates a GPUCommandEncoder, used to encode commands to be issued to the GPU.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    " }, @@ -12912,7 +12930,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createComputePipeline() method of the\nGPUDevice interface creates a GPUComputePipeline that can control the compute shader stage and be used in a GPUComputePassEncoder.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createComputePipeline() method of the\nGPUDevice interface creates a GPUComputePipeline that can control the compute shader stage and be used in a GPUComputePassEncoder.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    compute
    \n
    \n

    An object describing the compute shader entry point of the pipeline. This object can contain the following properties:\n

    \n
    constants Optional
    \n
    \n

    A sequence of record types, with the structure (id, value), representing override values for WGSL constants that can be overridden in the pipeline. These behave like ordered maps. In each case, the id is a key used to identify or select the record, and the constant is an enumerated value representing a WGSL.\n

    Depending on which constant you want to override, the id may take the form of the numeric ID of the constant, if one is specified, or otherwise the constant's identifier name.\n

    A code snippet providing override values for several overridable constants might look like this:\n

    \n```js\n({\n  // …\n  constants: {\n    0: false,\n    1200: 3.0,\n    1300: 2.0,\n    width: 20,\n    depth: -1,\n    height: 15,\n  },\n});\n```\n
    \n
    \n
    entryPoint Optional
    \n
    \n

    The name of the function in the module that this stage will use to perform its work. The corresponding shader function must have the @compute attribute to be identified as this entry point. See Entry Point Declaration for more information.\n

    You can omit the entryPoint property if your shader code contains a single function with the @compute attribute set — the browser will use this as the default entry point. If entryPoint is omitted and the browser cannot determine a default entry point, a GPUValidationError is generated and the resulting GPUComputePipeline will be invalid.\n

    \n
    module
    \n
    \n

    A GPUShaderModule object containing the WGSL code that this programmable stage will execute.\n

    \n
    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    layout
    \n
    \n

    Defines the layout (structure, purpose, and type) of all the GPU resources (buffers, textures, etc.) used during the execution of the pipeline. Possible values are:\n

      \n
    • A GPUPipelineLayout object, created using GPUDevice.createPipelineLayout(), which allows the GPU to figure out how to run the pipeline most efficiently ahead of time.
    • \n
    • A string of \"auto\", which causes the pipeline to generate an implicit bind group layout based on any bindings defined in the shader code. If \"auto\" is used, the generated bind group layouts may only be used with the current pipeline.
    • \n
    \n
    \n
    " }, @@ -12931,7 +12949,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createComputePipelineAsync() method of the\nGPUDevice interface returns a Promise that fulfills with a GPUComputePipeline, which can control the compute shader stage and be used in a GPUComputePassEncoder, once the pipeline can be used without any stalling.\n

    \n

    Note:\nIt is generally preferable to use this method over GPUDevice.createComputePipeline() whenever possible, as it prevents blocking of GPU operation execution on pipeline compilation.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createComputePipelineAsync() method of the\nGPUDevice interface returns a Promise that fulfills with a GPUComputePipeline, which can control the compute shader stage and be used in a GPUComputePassEncoder, once the pipeline can be used without any stalling.\n

    \n

    Note:\nIt is generally preferable to use this method over GPUDevice.createComputePipeline() whenever possible, as it prevents blocking of GPU operation execution on pipeline compilation.\n

    ", "parameters": { "descriptor": "See the descriptor definition for the GPUDevice.createComputePipeline() method." }, @@ -12950,7 +12968,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createPipelineLayout() method of the\nGPUDevice interface creates a GPUPipelineLayout that defines the GPUBindGroupLayouts used by a pipeline. GPUBindGroups used with the pipeline during command encoding must have compatible GPUBindGroupLayouts.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createPipelineLayout() method of the\nGPUDevice interface creates a GPUPipelineLayout that defines the GPUBindGroupLayouts used by a pipeline. GPUBindGroups used with the pipeline during command encoding must have compatible GPUBindGroupLayouts.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    bindGroupLayouts
    \n
    \n

    An array of values representing the bind group layouts for a pipeline. Each value can be:\n

    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    " }, @@ -12969,7 +12987,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createQuerySet() method of the\nGPUDevice interface creates a GPUQuerySet that can be used to record the results of queries on passes, such as occlusion or timestamp queries.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createQuerySet() method of the\nGPUDevice interface creates a GPUQuerySet that can be used to record the results of queries on passes, such as occlusion or timestamp queries.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    count
    \n
    \n

    A number specifying the number of queries to be managed by the resulting GPUQuerySet.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    type
    \n
    \n

    An enumerated value specifying the type of queries to be managed by the resulting GPUQuerySet. Possible values are:\n

    \n
    \"occlusion\"
    \n
    \n

    Occlusion queries are available on render passes to query the number of fragment samples that pass all the per-fragment tests for a set of drawing commands (including scissor, sample mask, alpha to coverage, stencil, and depth tests). To run an occlusion query, an appropriate GPUQuerySet must be provided as the value of the occlusionQuerySet descriptor property when invoking GPUCommandEncoder.beginRenderPass() to run a render pass.\n

    \n
    \"timestamp\"
    \n
    \n

    Timestamp queries allow applications to write timestamps to a GPUQuerySet. To run a timestamp query, appropriate GPUQuerySets must be provided inside the value of the timestampWrites descriptor property when invoking GPUCommandEncoder.beginRenderPass() to run a render pass, or GPUCommandEncoder.beginComputePass() to run a compute pass. Alternatively, you can run a single timestamp query at any time by invoking GPUCommandEncoder.writeTimeStamp() with an appropriate GPUQuerySet as a parameter.\n

    \n

    Note:\nThe timestamp-query feature needs to be enabled to use timestamp queries.\n

    \n
    \n
    \n
    \n
    " }, @@ -12988,7 +13006,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderBundleEncoder() method of the\nGPUDevice interface creates a GPURenderBundleEncoder that can be used to pre-record bundles of commands. These can be reused in GPURenderPassEncoders via the executeBundles() method, as many times as required.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderBundleEncoder() method of the\nGPUDevice interface creates a GPURenderBundleEncoder that can be used to pre-record bundles of commands. These can be reused in GPURenderPassEncoders via the executeBundles() method, as many times as required.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    colorFormats
    \n
    \n

    An array of enumerated values specifying the expected color formats for render targets. For possible values, see the GPUTextureFormat definition in the spec.\n

    \n
    depthReadOnly Optional
    \n
    \n

    A boolean. If true, specifies that executing any GPURenderBundle created by the GPURenderBundleEncoder will not modify the depth component of the depthStencilFormat when executed. If omitted, depthReadOnly will default to false.\n

    \n
    depthStencilFormat Optional
    \n
    \n

    An enumerated value that specifies the expected depth-or-stencil format for render targets. For possible values, see the Depth-stencil formats section of the spec.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    sampleCount Optional
    \n
    \n

    A number representing the expected sample count for render targets.\n

    \n
    stencilReadOnly Optional
    \n
    \n

    A boolean. If true, specifies that executing any GPURenderBundle created by the GPURenderBundleEncoder will not modify the stencil component of the depthStencilFormat when executed. If omitted, stencilReadOnly will default to false.\n

    \n
    " }, @@ -13007,7 +13025,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderPipeline() method of the\nGPUDevice interface creates a GPURenderPipeline that can control the vertex and fragment shader stages and be used in a GPURenderPassEncoder or GPURenderBundleEncoder.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderPipeline() method of the\nGPUDevice interface creates a GPURenderPipeline that can control the vertex and fragment shader stages and be used in a GPURenderPassEncoder or GPURenderBundleEncoder.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    depthStencil Optional
    \n
    \n

    An object (see depthStencil object structure) describing depth-stencil properties including testing, operations, and bias.\n

    \n
    fragment Optional
    \n
    \n

    An object (see fragment object structure) describing the fragment shader entry point of the pipeline and its output colors. If no fragment shader entry point is defined, the pipeline will not produce any color attachment outputs, but it still performs rasterization and produces depth values based on the vertex position output. Depth testing and stencil operations can still be used.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    layout
    \n
    \n

    Defines the layout (structure, purpose, and type) of all the GPU resources (buffers, textures, etc.) used during the execution of the pipeline. Possible values are:\n

      \n
    • A GPUPipelineLayout object, created using GPUDevice.createPipelineLayout(), which allows the GPU to figure out how to run the pipeline most efficiently ahead of time.
    • \n
    • A string of \"auto\", which causes the pipeline to generate an implicit bind group layout based on any bindings defined in the shader code. If \"auto\" is used, the generated bind group layouts may only be used with the current pipeline.
    • \n
    \n
    \n
    multisample Optional
    \n
    \n

    An object (see multisample object structure) describing how the pipeline interacts with a render pass's multisampled attachments.\n

    \n
    primitive Optional
    \n
    \n

    An object (see primitive object structure) describing how a pipeline constructs and rasterizes primitives from its vertex inputs.\n

    \n
    vertex
    \n
    \n

    An object (see vertex object structure) describing the vertex shader entry point of the pipeline and its input buffer layouts.\n

    \n
    " }, @@ -13026,7 +13044,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderPipelineAsync() method of the\nGPUDevice interface returns a Promise that fulfills with a GPURenderPipeline, which can control the vertex and fragment shader stages and be used in a GPURenderPassEncoder or GPURenderBundleEncoder, once the pipeline can be used without any stalling.\n

    \n

    Note:\nIt is generally preferable to use this method over GPUDevice.createRenderPipeline() whenever possible, as it prevents blocking of GPU operation execution on pipeline compilation.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createRenderPipelineAsync() method of the\nGPUDevice interface returns a Promise that fulfills with a GPURenderPipeline, which can control the vertex and fragment shader stages and be used in a GPURenderPassEncoder or GPURenderBundleEncoder, once the pipeline can be used without any stalling.\n

    \n

    Note:\nIt is generally preferable to use this method over GPUDevice.createRenderPipeline() whenever possible, as it prevents blocking of GPU operation execution on pipeline compilation.\n

    ", "parameters": { "descriptor": "See the descriptor definition for the GPUDevice.createRenderPipeline() method." }, @@ -13045,7 +13063,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createSampler() method of the\nGPUDevice interface creates a GPUSampler, which controls how shaders transform and filter texture resource data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createSampler() method of the\nGPUDevice interface creates a GPUSampler, which controls how shaders transform and filter texture resource data.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    addressModeU Optional
    \n
    \n

    An enumerated value specifying the behavior of the sampler when the sample footprint width extends beyond the width of the texture. Possible values are:\n

      \n
    • \"clamp-to-edge\": The texture coordinates are clamped between 0.0 and 1.0, inclusive.
    • \n
    • \"repeat\": The texture coordinates wrap to the other side of the texture.
    • \n
    • \"mirror-repeat\": The texture coordinates wrap to the other side of the texture, but the texture is flipped when the integer part of the coordinate is odd.
    • \n
    \n

    If omitted, addressModeU defaults to \"clamp-to-edge\".\n

    \n
    addressModeV Optional
    \n
    \n

    An enumerated value specifying the behavior of the sampler when the sample footprint height extends beyond the height of the texture. Possible and default values are the same as for addressModeU.\n

    \n
    addressModeW Optional
    \n
    \n

    An enumerated value specifying the behavior of the sampler when the sample footprint depth extends beyond the depth of the texture. Possible and default values are the same as for addressModeU.\n

    \n
    compare Optional
    \n
    \n

    If specified, the sampler will be a comparison sampler of the specified type. Possible (enumerated) values are:\n

      \n
    • \"never\": Comparison tests never pass.
    • \n
    • \"less\": A provided value passes the comparison test if it is less than the sampled value.
    • \n
    • \"equal\": A provided value passes the comparison test if it is equal to the sampled value.
    • \n
    • \"less-equal\": A provided value passes the comparison test if it is less than or equal to the sampled value.
    • \n
    • \"greater\": A provided value passes the comparison test if it is greater than the sampled value.
    • \n
    • \"not-equal\": A provided value passes the comparison test if it is not equal to the sampled value.
    • \n
    • \"greater-equal\": A provided value passes the comparison test if it is greater than or equal to the sampled value.
    • \n
    • \"always\": Comparison tests always pass.
    • \n
    \n

    Comparison samplers may use filtering, but the sampling results will be implementation-dependent and may differ from the normal filtering rules.\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    lodMinClamp Optional
    \n
    \n

    A number specifying the minimum level of detail used internally when sampling a texture. If omitted, lodMinClamp defaults to 0.\n

    \n
    lodMaxClamp Optional
    \n
    \n

    A number specifying the maximum level of detail used internally when sampling a texture. If omitted, lodMaxClamp defaults to 32.\n

    \n
    maxAnisotropy Optional
    \n
    \n

    Specifies the maximum anisotropy value clamp used by the sampler. If omitted, maxAnisotropy defaults to 1.\n

    Most implementations support maxAnisotropy values in a range between 1 and 16, inclusive. The value used will be clamped to the maximum value that the underlying platform supports.\n

    \n
    magFilter Optional
    \n
    \n

    An enumerated value specifying the sampling behavior when the sample footprint is smaller than or equal to one texel. Possible values are:\n

      \n
    • \"nearest\": Return the value of the texel nearest to the texture coordinates.
    • \n
    • \"linear\": Select two texels in each dimension and return a linear interpolation between their values.
    • \n
    \n

    If omitted, magFilter defaults to \"nearest\".\n

    \n

    Note:\nThe float32-filterable feature needs to be enabled for r32float-, rg32float-, and rgba32float-format GPUTextures to be filterable.\n

    \n
    \n
    minFilter Optional
    \n
    \n

    An enumerated value specifying the sampling behavior when the sample footprint is larger than one texel. Possible and default values are the same as for magFilter.\n

    \n
    mipmapFilter Optional
    \n
    \n

    An enumerated value specifying the behavior when sampling between mipmap levels. Possible and default values are the same as for magFilter.\n

    \n
    " }, @@ -13064,9 +13082,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createShaderModule() method of the\nGPUDevice interface creates a GPUShaderModule from a string of WGSL source code.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createShaderModule() method of the\nGPUDevice interface creates a GPUShaderModule from a string of WGSL source code.", "parameters": { - "descriptor": "An object containing the following properties:\n

    \n
    code
    \n
    \n

    A string representing the WGSL source code for the shader module.\n

    \n
    hints Optional
    \n
    \n

    A sequence of record types, with the structure (\"string\", compilationHint). These behave like ordered maps. In each case, the \"string\" is a key used to identify or select the record, and the compilationHint is either a GPUPipelineLayout object instance or an enumerated value of \"auto\".\n

    The point of hints is to provide information about the pipeline layout as early as possible to improve performance. The idea is to maximize the amount of compilation that can be done once by createShaderModule(), rather than multiple times in multiple calls to GPUDevice.createComputePipeline() and GPUDevice.createRenderPipeline().\n

    \n

    Note:\nDifferent implementations may handle hints in different ways, including possibly ignoring them entirely. Providing hints does not guarantee improved shader compilation performance on all browsers/systems.\n

    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    sourceMap Optional
    \n
    \n

    A source map definition to provide developer tool integration such as source-language debugging. WGSL names (identifiers) in source maps should follow the rules defined in WGSL identifier comparison. If defined, the source map may be interpreted as a source-map-v3 format.\n

    \n

    Note:\nDifferent implementations may handle sourceMaps in different ways, including possibly ignoring them entirely.\n

    \n
    \n
    " + "descriptor": "An object containing the following properties:\n
    \n
    code
    \n
    \n

    A string representing the WGSL source code for the shader module.\n

    \n
    hints Optional
    \n
    \n

    A sequence of record types, with the structure (\"string\", compilationHint). These behave like ordered maps. In each case, the \"string\" is a key used to identify or select the record, and the compilationHint is either a GPUPipelineLayout object instance or an enumerated value of \"auto\".\n

    The point of hints is to provide information about the pipeline layout as early as possible to improve performance. The idea is to maximize the amount of compilation that can be done once by createShaderModule(), rather than multiple times in multiple calls to GPUDevice.createComputePipeline() and GPUDevice.createRenderPipeline().\n

    \n

    Note:\nDifferent implementations may handle hints in different ways, including possibly ignoring them entirely. Providing hints does not guarantee improved shader compilation performance on all browsers/systems.\n

    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    sourceMap Optional
    \n
    \n

    A source map definition to provide developer tool integration such as source-language debugging. WGSL names (identifiers) in source maps should follow the rules defined in WGSL identifier comparison. If defined, the source map may be interpreted as a source-map-v3 format.\n

    \n

    Note:\nDifferent implementations may handle sourceMaps in different ways, including possibly ignoring them entirely.\n

    \n
    \n
    " }, "returns": "A GPUShaderModule object instance." }, @@ -13083,7 +13101,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createTexture() method of the\nGPUDevice interface creates a GPUTexture in which to store 1D, 2D, or 3D arrays of data, such as images, to use in GPU rendering operations.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createTexture() method of the\nGPUDevice interface creates a GPUTexture in which to store 1D, 2D, or 3D arrays of data, such as images, to use in GPU rendering operations.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    dimension Optional
    \n
    \n

    An enumerated value indicating the dimension level of the texture. Possible values are:\n

      \n
    • \"1d\": The texture is one-dimensional.
    • \n
    • \"2d\": The texture is two-dimensional or an array of two-dimensional layers.
    • \n
    • \"3d\": The texture is three-dimensional.
    • \n
    \n

    dimension defaults to \"2d\" if the value is omitted.\n

    \n
    format
    \n
    \n

    An enumerated value specifying the format of the texture. See the Texture formats section of the specification for all the possible values.\n

    \n

    Note:\n

      \n
    • The depth32float-stencil8 feature needs to be enabled to create depth32float-stencil8-format GPUTextures.
    • \n
    • The texture-compression-bc feature needs to be enabled to create two-dimensional (dimension: \"2d\") BC compressed GPUTextures: bc1-rgba-unorm, bc1-rgba-unorm-srgb, bc2-rgba-unorm, bc2-rgba-unorm-srgb, bc3-rgba-unorm, bc3-rgba-unorm-srgb, bc4-r-unorm, bc4-r-snorm, bc5-rg-unorm, bc5-rg-snorm, bc6h-rgb-ufloat, bc6h-rgb-float, bc7-rgba-unorm, and bc7-rgba-unorm-srgb formats.
    • \n
    • The texture-compression-bc and texture-compression-bc-sliced-3d features need to be enabled to create three-dimensional BC compressed GPUTextures (the same format values specified in the previous bullet, but with dimension set to 3d).
    • \n
    • The texture-compression-astc feature needs to be enabled to create two-dimensional (dimension: \"2d\") ASTC compressed GPUTextures: astc-4x4-unorm, astc-4x4-unorm-srgb, astc-5x4-unorm, astc-5x4-unorm-srgb, astc-5x5-unorm, astc-5x5-unorm-srgb, astc-6x5-unorm, astc-6x5-unorm-srgb, astc-6x6-unorm, astc-6x6-unorm-srgb, astc-8x5-unorm, astc-8x5-unorm-srgb, astc-8x6-unorm, astc-8x6-unorm-srgb, astc-8x8-unorm, astc-8x8-unorm-srgb, astc-10x5-unorm, astc-10x5-unorm-srgb, astc-10x6-unorm, astc-10x6-unorm-srgb, astc-10x8-unorm, astc-10x8-unorm-srgb, astc-10x10-unorm, astc-10x10-unorm-srgb, astc-12x10-unorm, astc-12x10-unorm-srgb, astc-12x12-unorm, and astc-12x12-unorm-srgb formats.
    • \n
    • The texture-compression-astc and texture-compression-astc-sliced-3d features need to be enabled to create three-dimensional BC compressed GPUTextures (the same format values specified in the previous bullet, but with dimension set to 3d).
    • \n
    • The texture-compression-etc2 feature needs to be enabled to create two-dimensional ETC2 compressed GPUTextures: etc2-rgb8unorm, etc2-rgb8unorm-srgb, etc2-rgb8a1unorm, etc2-rgb8a1unorm-srgb, etc2-rgba8unorm, etc2-rgba8unorm-srgb, eac-r11unorm, eac-r11snorm, eac-rg11unorm, and eac-rg11snorm formats.
    • \n
    • See the Tier 1 and Tier 2 texture formats section for more information about those texture format sets and the requirements to create them.
    • \n
    \n
    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    mipLevelCount Optional
    \n
    \n

    A number specifying the number of mip levels the texture will contain. If omitted, this defaults to 1.\n

    \n
    sampleCount Optional
    \n
    \n

    A number specifying the texture's sample count. To be valid, the value must be 1 or 4. If omitted, this defaults to 1. A value higher than 1 indicates a multi-sampled texture.\n

    \n
    size
    \n
    \n

    An object or array specifying the width, height, and depth/array layer count of the texture. The width value must always be specified, while the height and depth/array layer count values are optional and will default to 1 if omitted.\n

    For example, you can pass an array like [16, 16, 2], or its equivalent object { width: 16, height: 16, depthOrArrayLayers: 2 }.\n

    \n
    usage
    \n
    \n

    The bitwise flags representing the allowed usages for the GPUTexture. The possible values are in the GPUTexture.usage value table.\n

    Note that multiple possible usages can be specified by separating values with bitwise OR, for example: GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT.\n

    \n

    Note:\n

      \n
    • The bgra8unorm-storage feature needs to be enabled to specify STORAGE_BINDING usage for a bgra8unorm-format GPUTexture.
    • \n
    • The rg11b10ufloat-renderable feature needs to be enabled to specify RENDER_ATTACHMENT usage for a rg11b10ufloat-format GPUTexture, as well as its blending and multisampling.
    • \n
    \n
    \n
    \n
    viewFormats Optional
    \n
    \n

    An array of enumerated values specifying other texture formats permitted when calling GPUTexture.createView() on this texture, in addition to the texture format specified in its format value.\n

    \n
    " }, @@ -13102,7 +13120,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUDevice interface destroys the device, preventing further operations on it.\n

    Note that:\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUDevice interface destroys the device, preventing further operations on it.\n

    Note that:\n

    ", "returns": "None (undefined)." }, "gpudevice.features": { @@ -13118,7 +13136,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The features read-only property of the\nGPUDevice interface returns a GPUSupportedFeatures object that describes additional functionality supported by the device. Only features requested during the creation of the device (i.e., when GPUAdapter.requestDevice() is called) are included.\n

    \n

    Note:\nNot all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. See GPUAdapter.features for more details.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The features read-only property of the\nGPUDevice interface returns a GPUSupportedFeatures object that describes additional functionality supported by the device. Only features requested during the creation of the device (i.e., when GPUAdapter.requestDevice() is called) are included.\n

    \n

    Note:\nNot all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. See GPUAdapter.features for more details.\n

    " }, "gpudevice.importexternaltexture": { "url": "$MDN_URL$/web/api/gpudevice/importexternaltexture", @@ -13133,11 +13151,11 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importExternalTexture() method of the\nGPUDevice interface takes an HTMLVideoElement or a VideoFrame object as an input and returns a GPUExternalTexture wrapper object containing a snapshot of the video that can be used as a frame in GPU rendering operations.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importExternalTexture() method of the\nGPUDevice interface takes an HTMLVideoElement or a VideoFrame object as an input and returns a GPUExternalTexture wrapper object containing a snapshot of the video that can be used as a frame in GPU rendering operations.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    colorSpace Optional
    \n
    \n

    An enumerated value specifying the color space to use for the video frame. Possible values are \"srgb\" and \"display-p3\". If omitted, colorSpace defaults to \"srgb\".\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    source
    \n
    \n

    The HTMLVideoElement or VideoFrame source of the video snapshot.\n

    \n
    " }, - "returns": "A GPUExternalTexture object instance.\n

    Note that the moment when the GPUExternalTexture object expires (is destroyed) depends on what its source is:\n

    ", + "returns": "A GPUExternalTexture object instance.\n

    Note that the moment when the GPUExternalTexture object expires (is destroyed) depends on what its source is:\n

    ", "throws": { "SecurityError DOMException": "Thrown if the video source data is cross-origin." } @@ -13155,7 +13173,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUDevice interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUDevice interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings." }, "gpudevice.limits": { "url": "$MDN_URL$/web/api/gpudevice/limits", @@ -13170,7 +13188,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The limits read-only property of the\nGPUDevice interface returns a GPUSupportedLimits object that describes the limits supported by the device. All limit values will be included, and the limits requested during the creation of the device (i.e., when GPUAdapter.requestDevice() is called) will be reflected in those values.\n

    \n

    Note:\nNot all limits will be reported as expected, even if they are supported by the underlying hardware. See GPUAdapter.limits for more details.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The limits read-only property of the\nGPUDevice interface returns a GPUSupportedLimits object that describes the limits supported by the device. All limit values will be included, and the limits requested during the creation of the device (i.e., when GPUAdapter.requestDevice() is called) will be reflected in those values.\n

    \n

    Note:\nNot all limits will be reported as expected, even if they are supported by the underlying hardware. See GPUAdapter.limits for more details.\n

    " }, "gpudevice.lost": { "url": "$MDN_URL$/web/api/gpudevice/lost", @@ -13185,7 +13203,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lost read-only property of the\nGPUDevice interface contains a Promise that remains pending throughout the device's lifetime and resolves with a GPUDeviceLostInfo object when the device is lost.\n

    GPUAdapter.requestDevice() will never return null, and it will reject only if the request is invalid, i.e., it exceeds the capabilities of the GPUAdapter. If a valid device request can't be fulfilled for some reason however it may resolve to a device that has already been lost. Additionally, devices can be lost at any time after creation for a variety of reasons (such as browser resource management or driver updates), so it's a good idea to always handle lost devices gracefully.\n

    Many causes for lost devices are transient, so you should try getting a new device once a previous one has been lost unless the loss was caused by the application intentionally destroying the device (i.e., with GPUDevice.destroy()). Note that any WebGPU resources created with a previous device (buffers, textures, etc.) will need to be re-created with the new one.\n

    \n

    Note:\nAlso bear in mind that a GPUAdapter may become unavailable, e.g., if the physical GPU is unplugged from the system or disabled to save power. From then on, the adapter can no longer return valid devices, and will always return already-lost devices.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lost read-only property of the\nGPUDevice interface contains a Promise that remains pending throughout the device's lifetime and resolves with a GPUDeviceLostInfo object when the device is lost.\n

    GPUAdapter.requestDevice() will never return null, and it will reject only if the request is invalid, i.e., it exceeds the capabilities of the GPUAdapter. If a valid device request can't be fulfilled for some reason however it may resolve to a device that has already been lost. Additionally, devices can be lost at any time after creation for a variety of reasons (such as browser resource management or driver updates), so it's a good idea to always handle lost devices gracefully.\n

    Many causes for lost devices are transient, so you should try getting a new device once a previous one has been lost unless the loss was caused by the application intentionally destroying the device (i.e., with GPUDevice.destroy()). Note that any WebGPU resources created with a previous device (buffers, textures, etc.) will need to be re-created with the new one.\n

    \n

    Note:\nAlso bear in mind that a GPUAdapter may become unavailable, e.g., if the physical GPU is unplugged from the system or disabled to save power. From then on, the adapter can no longer return valid devices, and will always return already-lost devices.\n

    " }, "gpudevice.poperrorscope": { "url": "$MDN_URL$/web/api/gpudevice/poperrorscope", @@ -13200,8 +13218,8 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popErrorScope() method of the\nGPUDevice interface pops an existing GPU error scope from the error scope stack (originally pushed using GPUDevice.pushErrorScope()) and returns a Promise that resolves to an object describing the first error captured in the scope, or null if no error occurred.", - "returns": "a Promise that resolves to an object describing the first error captured in the scope. This can be of type:\n

    \n

    If no error occurred, it resolves to null." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popErrorScope() method of the\nGPUDevice interface pops an existing GPU error scope from the error scope stack (originally pushed using GPUDevice.pushErrorScope()) and returns a Promise that resolves to an object describing the first error captured in the scope, or null if no error occurred.", + "returns": "A Promise that resolves to an object describing the first error captured in the scope. This can be of type:\n

    \n

    If no error occurred, it resolves to null." }, "gpudevice.pusherrorscope": { "url": "$MDN_URL$/web/api/gpudevice/pusherrorscope", @@ -13216,7 +13234,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushErrorScope() method of the\nGPUDevice interface pushes a new GPU error scope onto the device's error scope stack, allowing you to capture errors of a particular type.\n

    Once you are done capturing errors, you can end capture by invoking GPUDevice.popErrorScope(). This pops the scope from the stack and returns a Promise that resolves to an object describing the first error captured in the scope, or null if no errors were captured.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushErrorScope() method of the\nGPUDevice interface pushes a new GPU error scope onto the device's error scope stack, allowing you to capture errors of a particular type.\n

    Once you are done capturing errors, you can end capture by invoking GPUDevice.popErrorScope(). This pops the scope from the stack and returns a Promise that resolves to an object describing the first error captured in the scope, or null if no errors were captured.", "parameters": { "filter": "An enumerated value that specifies what type of error will be caught in this particular error scope. Possible values are:\n

    \n
    \"internal\"
    \n
    \n

    The error scope will catch a GPUInternalError.\n

    \n
    \"out-of-memory\"
    \n
    \n

    The error scope will catch a GPUOutOfMemoryError.\n

    \n
    \"validation\"
    \n
    \n

    The error scope will catch a GPUValidationError.\n

    \n
    " }, @@ -13235,7 +13253,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The queue read-only property of the\nGPUDevice interface returns the primary GPUQueue for the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The queue read-only property of the\nGPUDevice interface returns the primary GPUQueue for the device." }, "gpudevicelostinfo": { "url": "$MDN_URL$/web/api/gpudevicelostinfo", @@ -13250,7 +13268,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUDeviceLostInfo interface of the WebGPU API represents the object returned when the GPUDevice.lost Promise resolves. This provides information as to why a device has been lost.\n

    See the GPUDevice.lost page for more information about \"lost\" state." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUDeviceLostInfo interface of the WebGPU API represents the object returned when the GPUDevice.lost Promise resolves. This provides information as to why a device has been lost.\n

    See the GPUDevice.lost page for more information about \"lost\" state." }, "gpudevicelostinfo.message": { "url": "$MDN_URL$/web/api/gpudevicelostinfo/message", @@ -13265,7 +13283,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUDeviceLostInfo interface provides a human-readable message that explains why the device was lost." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUDeviceLostInfo interface provides a human-readable message that explains why the device was lost." }, "gpudevicelostinfo.reason": { "url": "$MDN_URL$/web/api/gpudevicelostinfo/reason", @@ -13280,7 +13298,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reason read-only property of the\nGPUDeviceLostInfo interface defines the reason the device was lost in a machine-readable way." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reason read-only property of the\nGPUDeviceLostInfo interface defines the reason the device was lost in a machine-readable way." }, "gpuerror": { "url": "$MDN_URL$/web/api/gpuerror", @@ -13293,7 +13311,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUError interface of the WebGPU API is the base interface for errors surfaced by GPUDevice.popErrorScope and the uncapturederror event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUError interface of the WebGPU API is the base interface for errors surfaced by GPUDevice.popErrorScope and the uncapturederror event." }, "gpuerror.message": { "url": "$MDN_URL$/web/api/gpuerror/message", @@ -13306,7 +13324,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUError interface provides a human-readable message that explains why the error occurred." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The message read-only property of the\nGPUError interface provides a human-readable message that explains why the error occurred." }, "gpuexternaltexture": { "url": "$MDN_URL$/web/api/gpuexternaltexture", @@ -13321,7 +13339,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUExternalTexture interface of the WebGPU API represents a wrapper object containing an HTMLVideoElement snapshot that can be used as a texture in GPU rendering operations.\n

    A GPUExternalTexture object instance is created using GPUDevice.importExternalTexture()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUExternalTexture interface of the WebGPU API represents a wrapper object containing an HTMLVideoElement snapshot that can be used as a texture in GPU rendering operations.\n

    A GPUExternalTexture object instance is created using GPUDevice.importExternalTexture()." }, "gpuexternaltexture.label": { "url": "$MDN_URL$/web/api/gpuexternaltexture/label", @@ -13336,7 +13354,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUExternalTexture interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.importExternalTexture() call, or you can get and set it directly on the GPUExternalTexture object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUExternalTexture interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.importExternalTexture() call, or you can get and set it directly on the GPUExternalTexture object." }, "gpuinternalerror": { "url": "$MDN_URL$/web/api/gpuinternalerror", @@ -13351,7 +13369,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUInternalError interface of the WebGPU API describes an application error indicating that an operation failed for a system or implementation-specific reason, even when all validation requirements were satisfied.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Internal errors occur when something happens in the WebGPU implementation that wasn't caught by validation and wasn't clearly identifiable as an out-of-memory error. It generally means that an operation your code performed hit a system limit in a way that was difficult to express with WebGPU's supported limits. The same operation might succeed on a different device. These can only be raised by pipeline creation, usually if the shader is too complex for the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUInternalError interface of the WebGPU API describes an application error indicating that an operation failed for a system or implementation-specific reason, even when all validation requirements were satisfied.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Internal errors occur when something happens in the WebGPU implementation that wasn't caught by validation and wasn't clearly identifiable as an out-of-memory error. It generally means that an operation your code performed hit a system limit in a way that was difficult to express with WebGPU's supported limits. The same operation might succeed on a different device. These can only be raised by pipeline creation, usually if the shader is too complex for the device." }, "gpuinternalerror.gpuinternalerror": { "url": "$MDN_URL$/web/api/gpuinternalerror/gpuinternalerror", @@ -13366,7 +13384,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUInternalError() constructor creates a new\nGPUInternalError object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUInternalError() constructor creates a new\nGPUInternalError object instance.", "parameters": { "message": "A string providing a human-readable message that explains why the error occurred." } @@ -13384,7 +13402,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUOutOfMemoryError interface of the WebGPU API describes an out-of-memory (oom) error indicating that there was not enough free memory to complete the requested operation.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Out-of-memory errors should be relatively rare in a well-behaved app but are less predictable than GPUValidationErrors. This is because they are dependent on the device your app is running on as well as other apps that are using GPU resources at the time." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUOutOfMemoryError interface of the WebGPU API describes an out-of-memory (oom) error indicating that there was not enough free memory to complete the requested operation.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Out-of-memory errors should be relatively rare in a well-behaved app but are less predictable than GPUValidationErrors. This is because they are dependent on the device your app is running on as well as other apps that are using GPU resources at the time." }, "gpuoutofmemoryerror.gpuoutofmemoryerror": { "url": "$MDN_URL$/web/api/gpuoutofmemoryerror/gpuoutofmemoryerror", @@ -13399,7 +13417,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUOutOfMemoryError() constructor creates a new\nGPUOutOfMemoryError object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUOutOfMemoryError() constructor creates a new\nGPUOutOfMemoryError object instance.", "parameters": { "message": "A string providing a human-readable message that explains why the error occurred." } @@ -13417,7 +13435,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineError interface of the WebGPU API describes a pipeline failure. This is the value received when a Promise returned by a GPUDevice.createComputePipelineAsync() or GPUDevice.createRenderPipelineAsync() call rejects." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineError interface of the WebGPU API describes a pipeline failure. This is the value received when a Promise returned by a GPUDevice.createComputePipelineAsync() or GPUDevice.createRenderPipelineAsync() call rejects." }, "gpupipelineerror.gpupipelineerror": { "url": "$MDN_URL$/web/api/gpupipelineerror/gpupipelineerror", @@ -13432,7 +13450,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineError() constructor creates a new\nGPUPipelineError object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineError() constructor creates a new\nGPUPipelineError object instance.", "parameters": { "message": "A string providing a human-readable message that explains why the error occurred. If not specified, message defaults to an empty string (\"\").", "options": "An object, which can contain the following properties:\n

    \n
    reason
    \n
    \n

    An enumerated value that defines the reason the pipeline creation failed in a machine-readable way. The value can be one of:\n

      \n
    • \"internal\": Pipeline creation failed because of an internal error (see GPUInternalError for more information about these kinds of error).
    • \n
    • \"validation\": Pipeline creation failed because of a validation error (see GPUValidationError for more information about these kinds of error).
    • \n
    \n
    \n
    " @@ -13451,7 +13469,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reason read-only property of the\nGPUPipelineError interface defines the reason the pipeline creation failed in a machine-readable way." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reason read-only property of the\nGPUPipelineError interface defines the reason the pipeline creation failed in a machine-readable way." }, "gpupipelinelayout": { "url": "$MDN_URL$/web/api/gpupipelinelayout", @@ -13466,7 +13484,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineLayout interface of the WebGPU API defines the GPUBindGroupLayouts used by a pipeline. GPUBindGroups used with the pipeline during command encoding must have compatible GPUBindGroupLayouts.\n

    A GPUPipelineLayout object instance is created using the GPUDevice.createPipelineLayout() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUPipelineLayout interface of the WebGPU API defines the GPUBindGroupLayouts used by a pipeline. GPUBindGroups used with the pipeline during command encoding must have compatible GPUBindGroupLayouts.\n

    A GPUPipelineLayout object instance is created using the GPUDevice.createPipelineLayout() method." }, "gpupipelinelayout.label": { "url": "$MDN_URL$/web/api/gpupipelinelayout/label", @@ -13481,7 +13499,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUPipelineLayout interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createPipelineLayout() call, or you can get and set it directly on the GPUPipelineLayout object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUPipelineLayout interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createPipelineLayout() call, or you can get and set it directly on the GPUPipelineLayout object." }, "gpuqueryset": { "url": "$MDN_URL$/web/api/gpuqueryset", @@ -13496,7 +13514,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUQuerySet interface of the WebGPU API is used to record the results of queries on passes, such as occlusion or timestamp queries.\n

    \n
    \n

    Note:\nThe timestamp-query feature needs to be enabled to use timestamp queries.\n

    \n

    A GPUQuerySet object instance is created using the GPUDevice.createQuerySet() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUQuerySet interface of the WebGPU API is used to record the results of queries on passes, such as occlusion or timestamp queries.\n

    \n
    \n

    Note:\nThe timestamp-query feature needs to be enabled to use timestamp queries.\n

    \n

    A GPUQuerySet object instance is created using the GPUDevice.createQuerySet() method." }, "gpuqueryset.count": { "url": "$MDN_URL$/web/api/gpuqueryset/count", @@ -13511,7 +13529,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The count read-only property of the\nGPUQuerySet interface is a number specifying the number of queries managed by the GPUQuerySet." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The count read-only property of the\nGPUQuerySet interface is a number specifying the number of queries managed by the GPUQuerySet." }, "gpuqueryset.destroy": { "url": "$MDN_URL$/web/api/gpuqueryset/destroy", @@ -13526,7 +13544,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUQuerySet interface destroys the GPUQuerySet.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUQuerySet interface destroys the GPUQuerySet.", "returns": "None (Undefined)." }, "gpuqueryset.label": { @@ -13542,7 +13560,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUQuerySet interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createQuerySet() call, or you can get and set it directly on the GPUQuerySet object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUQuerySet interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createQuerySet() call, or you can get and set it directly on the GPUQuerySet object." }, "gpuqueryset.type": { "url": "$MDN_URL$/web/api/gpuqueryset/type", @@ -13557,7 +13575,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The type read-only property of the\nGPUQuerySet interface is an enumerated value specifying the type of queries managed by the GPUQuerySet." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The type read-only property of the\nGPUQuerySet interface is an enumerated value specifying the type of queries managed by the GPUQuerySet." }, "gpuqueue": { "url": "$MDN_URL$/web/api/gpuqueue", @@ -13572,7 +13590,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUQueue interface of the WebGPU API controls execution of encoded commands on the GPU.\n

    A device's primary queue is accessed via the GPUDevice.queue property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUQueue interface of the WebGPU API controls execution of encoded commands on the GPU.\n

    A device's primary queue is accessed via the GPUDevice.queue property." }, "gpuqueue.copyexternalimagetotexture": { "url": "$MDN_URL$/web/api/gpuqueue/copyexternalimagetotexture", @@ -13587,7 +13605,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The copyExternalImageToTexture() method of the\nGPUQueue interface copies a snapshot taken from a source image, video, or canvas into a given GPUTexture.\n

    Using this function allows the user agent to determine the most efficient way to copy the data over for each source type.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The copyExternalImageToTexture() method of the\nGPUQueue interface copies a snapshot taken from a source image, video, or canvas into a given GPUTexture.\n

    Using this function allows the user agent to determine the most efficient way to copy the data over for each source type.", "parameters": { "source": "An object representing the source to write to the destination, and its origin. This can take the following properties:\n

    \n
    source
    \n
    \n

    An object providing the source of the snapshot to copy. This can be an HTMLCanvasElement, HTMLImageElement, HTMLVideoElement, ImageBitmap, ImageData, OffscreenCanvas, or VideoFrame object. The image source data is captured at the exact moment copyExternalImageToTexture() is invoked.\n

    \n
    origin Optional
    \n
    \n

    An object or array specifying the origin of the copy — the top-left corner of the source sub-region to copy from. Together with copySize, this defines the full extent of the source sub-region. The x and y values default to 0 if any of all of origin is omitted.\n

    For example, you can pass an array like [0, 0], or its equivalent object { x: 0, y: 0 }.\n

    \n
    flipY Optional
    \n
    \n

    A boolean. If set to true, the image capture is flipped vertically. If omitted, flipY defaults to false.\n

    \n
    ", "destination": "An object defining the texture subresource and origin to write the captured image to, plus encoding metadata. This can take the following properties:\n
    \n
    aspect Optional
    \n
    \n

    An enumerated value defining which aspects of the texture to write the image to. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be written to, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be written to.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be written to.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    colorSpace Optional
    \n
    \n

    An enumerated value describing the color space and encoding used to encode data into the destination texture. Possible values are \"srgb\" and \"display-p3\". If omitted, colorSpace defaults to \"srgb\".\n

    \n

    Note:\nThe encoding may result in values outside of the range [0, 1] being written to the target texture, if its format can represent them. Otherwise, the results are clamped to the target texture format's range. Conversion may not be necessary if colorSpace matches the source image color space.\n

    \n
    \n
    mipLevel Optional
    \n
    \n

    A number representing the mip-map level of the texture to write the image to. If omitted, mipLevel defaults to 0.\n

    \n
    origin Optional
    \n
    \n

    An object or array specifying the origin of the copy — the minimum corner of the texture region to write the image data to. Together with copySize, this defines the full extent of the region to copy to. The x, y, and z values default to 0 if any of all of origin is omitted.\n

    For example, you can pass an array like [0, 0, 0], or its equivalent object { x: 0, y: 0, z: 0 }.\n

    \n
    premultipliedAlpha Optional
    \n
    \n

    A boolean. If set to true, the image data written into the texture will have its RGB channels premultiplied by the alpha channel. If omitted, premultipliedAlpha defaults to false.\n

    \n

    Note:\nIf this option is set to true and the source is also premultiplied, the source RGB values must be preserved even if they exceed their corresponding alpha values.\n

    \n
    \n
    texture
    \n
    \n

    A GPUTexture object representing the texture to write the data to.\n

    \n
    ", @@ -13612,7 +13630,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUQueue interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    You can get and set it directly on the GPUQueue object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPUQueue interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    You can get and set it directly on the GPUQueue object." }, "gpuqueue.onsubmittedworkdone": { "url": "$MDN_URL$/web/api/gpuqueue/onsubmittedworkdone", @@ -13627,7 +13645,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The onSubmittedWorkDone() method of the\nGPUQueue interface returns a Promise that resolves when all the work submitted to the GPU via this GPUQueue at the point the method is called has been processed.\n

    This includes the completion of any mapAsync() calls made on GPUBuffers used in commands submitted to the queue, before onSubmittedWorkDone() is called.\n

    Note: In most cases, you do not need to call onSubmittedWorkDone(). You do not need to call it for mapping a buffer. mapAsync guarantees work submitted to the queue before calling mapAsync happens before the mapAsync returns (see WebGPU spec).\n

    The two use cases for onSubmittedWorkDone\n

      \n
    1. \n

      Waiting for multiple buffer mapping (slow)\n

      \n```js\n// good\nawait Promise.all([\n  buffer1.mapAsync(),\n  buffer2.mapAsync(),\n  buffer3.mapAsync(),\n]);\ndata1 = buffer1.getMappedRange();\ndata2 = buffer2.getMappedRange();\ndata3 = buffer3.getMappedRange();\n```\n
      \n
      \n```js\n// works but slow\nbuffer1.mapAsync();\nbuffer2.mapAsync();\nbuffer3.mapAsync();\nawait device.queue.onSubmittedWorkDone();\ndata1 = buffer1.getMappedRange();\ndata2 = buffer2.getMappedRange();\ndata3 = buffer3.getMappedRange();\n```\n
      \n

      The reason the second method is slow is, the implementation may be able to map the buffers before all the submitted work is done.\nFor example, if all the buffers are finished being used, but more work (unrelated to the buffers) is already submitted, then\nyou'll end up waiting longer using the second method than the first.\n

    2. \n
    3. \n

      Throttling work\n

      If you are doing heavy compute work and you submit too much work at once, the browser may kill your work.\nYou can throttle the work by only submitting more work when the work you've already submitted is done.\n

    4. \n
    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The onSubmittedWorkDone() method of the\nGPUQueue interface returns a Promise that resolves when all the work submitted to the GPU via this GPUQueue at the point the method is called has been processed.\n

    This includes the completion of any mapAsync() calls made on GPUBuffers used in commands submitted to the queue, before onSubmittedWorkDone() is called.\n

    Note: In most cases, you do not need to call onSubmittedWorkDone(). You do not need to call it for mapping a buffer. mapAsync guarantees work submitted to the queue before calling mapAsync happens before the mapAsync returns (see WebGPU spec).\n

    The two use cases for onSubmittedWorkDone\n

      \n
    1. \n

      Waiting for multiple buffer mapping (slow)\n

      \n```js\n// good\nawait Promise.all([\n  buffer1.mapAsync(),\n  buffer2.mapAsync(),\n  buffer3.mapAsync(),\n]);\ndata1 = buffer1.getMappedRange();\ndata2 = buffer2.getMappedRange();\ndata3 = buffer3.getMappedRange();\n```\n
      \n
      \n```js\n// works but slow\nbuffer1.mapAsync();\nbuffer2.mapAsync();\nbuffer3.mapAsync();\nawait device.queue.onSubmittedWorkDone();\ndata1 = buffer1.getMappedRange();\ndata2 = buffer2.getMappedRange();\ndata3 = buffer3.getMappedRange();\n```\n
      \n

      The reason the second method is slow is, the implementation may be able to map the buffers before all the submitted work is done.\nFor example, if all the buffers are finished being used, but more work (unrelated to the buffers) is already submitted, then\nyou'll end up waiting longer using the second method than the first.\n

    2. \n
    3. \n

      Throttling work\n

      If you are doing heavy compute work and you submit too much work at once, the browser may kill your work.\nYou can throttle the work by only submitting more work when the work you've already submitted is done.\n

    4. \n
    ", "returns": "A Promise that resolves with Undefined." }, "gpuqueue.submit": { @@ -13643,7 +13661,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The submit() method of the\nGPUQueue interface schedules the execution of command buffers represented by one or more GPUCommandBuffer objects by the GPU.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The submit() method of the\nGPUQueue interface schedules the execution of command buffers represented by one or more GPUCommandBuffer objects by the GPU.", "parameters": { "commandBuffers": "An array of GPUCommandBuffer objects containing the commands to be enqueued for processing by the GPU. The array must not contain duplicate GPUCommandBuffer objects — each one can only be submitted once per submit() call." }, @@ -13662,7 +13680,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeBuffer() method of the\nGPUQueue interface writes a provided data source into a given GPUBuffer.\n

    This is a convenience function, which provides an alternative to setting buffer data via buffer mapping and buffer-to-buffer copies. It lets the user agent determine the most efficient way to copy the data over.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeBuffer() method of the\nGPUQueue interface writes a provided data source into a given GPUBuffer.\n

    This is a convenience function, which provides an alternative to setting buffer data via buffer mapping and buffer-to-buffer copies. It lets the user agent determine the most efficient way to copy the data over.", "parameters": { "buffer": "A GPUBuffer object representing the buffer to write data to.", "bufferOffset": "A number representing the offset, in bytes, to start writing the data at inside the GPUBuffer.", @@ -13688,7 +13706,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeTexture() method of the\nGPUQueue interface writes a provided data source into a given GPUTexture.\n

    This is a convenience function, which provides an alternative to setting texture data via buffer mapping and buffer-to-texture copies. It lets the user agent determine the most efficient way to copy the data over.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writeTexture() method of the\nGPUQueue interface writes a provided data source into a given GPUTexture.\n

    This is a convenience function, which provides an alternative to setting texture data via buffer mapping and buffer-to-texture copies. It lets the user agent determine the most efficient way to copy the data over.", "parameters": { "destination": "An object defining the texture subresource and origin to write the data source to, which can take the following properties:\n

    \n
    aspect Optional
    \n
    \n

    An enumerated value defining which aspects of the texture to write the data to. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be written to, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be written to.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be written to.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    mipLevel Optional
    \n
    \n

    A number representing the mip-map level of the texture to write the data to. If omitted, mipLevel defaults to 0.\n

    \n
    origin Optional
    \n
    \n

    An object or array specifying the origin of the copy — the minimum corner of the texture region to write the data to. Together with size, this defines the full extent of the region to copy to. The x, y, and z values default to 0 if any of all of origin is omitted.\n

    For example, you can pass an array like [0, 0, 0], or its equivalent object { x: 0, y: 0, z: 0 }.\n

    \n
    texture
    \n
    \n

    A GPUTexture object representing the texture to write the data to.\n

    \n
    ", "data": "An object representing the data source to write into the GPUTexture. This can be an ArrayBuffer, TypedArray, or DataView.", @@ -13710,7 +13728,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderBundle interface of the WebGPU API represents a container for pre-recorded bundles of commands.\n

    The command bundles are encoded using a GPURenderBundleEncoder; once the desired commands have been encoded, they are recorded into a GPURenderBundle object instance using the GPURenderBundleEncoder.finish() method.\n

    These command bundles can then be reused across multiple render passes by passing the GPURenderBundle objects into GPURenderPassEncoder.executeBundles() calls. Reusing pre-recoded commands can significantly improve app performance in situations where JavaScript draw call overhead is a bottleneck. Render bundles are most effective in situations where a batch of objects will be drawn the same way across multiple views or frames, with the only differences being the buffer content being used (such as updated matrix uniforms).\n

    A good example is VR rendering. Recording the rendering as a render bundle and then tweaking the view matrix and replaying it for each eye is a more efficient way to issue draw calls for both renderings of the scene." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderBundle interface of the WebGPU API represents a container for pre-recorded bundles of commands.\n

    The command bundles are encoded using a GPURenderBundleEncoder; once the desired commands have been encoded, they are recorded into a GPURenderBundle object instance using the GPURenderBundleEncoder.finish() method.\n

    These command bundles can then be reused across multiple render passes by passing the GPURenderBundle objects into GPURenderPassEncoder.executeBundles() calls. Reusing pre-recoded commands can significantly improve app performance in situations where JavaScript draw call overhead is a bottleneck. Render bundles are most effective in situations where a batch of objects will be drawn the same way across multiple views or frames, with the only differences being the buffer content being used (such as updated matrix uniforms).\n

    A good example is VR rendering. Recording the rendering as a render bundle and then tweaking the view matrix and replaying it for each eye is a more efficient way to issue draw calls for both renderings of the scene." }, "gpurenderbundle.label": { "url": "$MDN_URL$/web/api/gpurenderbundle/label", @@ -13725,7 +13743,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderBundle interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPURenderBundleEncoder.finish() call, or you can get and set it directly on the GPURenderBundle object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderBundle interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPURenderBundleEncoder.finish() call, or you can get and set it directly on the GPURenderBundle object." }, "gpurenderbundleencoder": { "url": "$MDN_URL$/web/api/gpurenderbundleencoder", @@ -13740,7 +13758,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderBundleEncoder interface of the WebGPU API is used to pre-record bundles of commands.\n

    The command bundles are encoded by calling the methods of GPURenderBundleEncoder; once the desired commands have been encoded, they are recorded into a GPURenderBundle object instance using the GPURenderBundleEncoder.finish() method. These render bundles can then be reused across multiple render passes by passing the GPURenderBundle objects into GPURenderPassEncoder.executeBundles() calls.\n

    In effect, this is like a partial render pass — GPURenderBundleEncoders have all the same functionality available as GPURenderPassEncoders, except that they can't begin and end occlusion queries, and can't set the scissor rect, viewport, blend constant, and stencil reference. The GPURenderBundle will inherit all these values from the GPURenderPassEncoder that executes it.\n

    \n

    Note:\nCurrently set vertex buffers, index buffers, bind groups, and pipeline are all cleared prior to executing a render bundle, and once the render bundle has finished executing.\n

    \n

    Reusing pre-recoded commands can significantly improve app performance in situations where JavaScript draw call overhead is a bottleneck. Render bundles are most effective in situations where a batch of objects will be drawn the same way across multiple views or frames, with the only differences being the buffer content being used (such as updated matrix uniforms). A good example is VR rendering. Recording the rendering as a render bundle and then tweaking the view matrix and replaying it for each eye is a more efficient way to issue draw calls for both renderings of the scene.\n

    A GPURenderBundleEncoder object instance is created via the GPUDevice.createRenderBundleEncoder() property.\n

    \n

    Note:\nThe methods of GPURenderBundleEncoder are functionally identical to their equivalents available on GPURenderPassEncoder, except for GPURenderBundleEncoder.finish(), which is similar in purpose to GPUCommandEncoder.finish().\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderBundleEncoder interface of the WebGPU API is used to pre-record bundles of commands.\n

    The command bundles are encoded by calling the methods of GPURenderBundleEncoder; once the desired commands have been encoded, they are recorded into a GPURenderBundle object instance using the GPURenderBundleEncoder.finish() method. These render bundles can then be reused across multiple render passes by passing the GPURenderBundle objects into GPURenderPassEncoder.executeBundles() calls.\n

    In effect, this is like a partial render pass — GPURenderBundleEncoders have all the same functionality available as GPURenderPassEncoders, except that they can't begin and end occlusion queries, and can't set the scissor rect, viewport, blend constant, and stencil reference. The GPURenderBundle will inherit all these values from the GPURenderPassEncoder that executes it.\n

    \n

    Note:\nCurrently set vertex buffers, index buffers, bind groups, and pipeline are all cleared prior to executing a render bundle, and once the render bundle has finished executing.\n

    \n

    Reusing pre-recoded commands can significantly improve app performance in situations where JavaScript draw call overhead is a bottleneck. Render bundles are most effective in situations where a batch of objects will be drawn the same way across multiple views or frames, with the only differences being the buffer content being used (such as updated matrix uniforms). A good example is VR rendering. Recording the rendering as a render bundle and then tweaking the view matrix and replaying it for each eye is a more efficient way to issue draw calls for both renderings of the scene.\n

    A GPURenderBundleEncoder object instance is created via the GPUDevice.createRenderBundleEncoder() property.\n

    \n

    Note:\nThe methods of GPURenderBundleEncoder are functionally identical to their equivalents available on GPURenderPassEncoder, except for GPURenderBundleEncoder.finish(), which is similar in purpose to GPUCommandEncoder.finish().\n

    " }, "gpurenderbundleencoder.draw": { "url": "$MDN_URL$/web/api/gpurenderbundleencoder/draw", @@ -13755,7 +13773,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The draw() method of the\nGPURenderBundleEncoder interface draws primitives based on the vertex buffers provided by setVertexBuffer().\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — draw().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The draw() method of the\nGPURenderBundleEncoder interface draws primitives based on the vertex buffers provided by setVertexBuffer().\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — draw().\n

    ", "parameters": { "vertexCount": "A number defining the number of vertices to draw.", "instanceCount": "A number defining the number of instances to draw. If omitted, instanceCount defaults to 1.", @@ -13777,7 +13795,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexed() method of the\nGPURenderBundleEncoder interface draws indexed primitives based on the vertex and index buffers provided by setVertexBuffer() and setIndexBuffer().\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndexed().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexed() method of the\nGPURenderBundleEncoder interface draws indexed primitives based on the vertex and index buffers provided by setVertexBuffer() and setIndexBuffer().\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndexed().\n

    ", "parameters": { "indexCount": "A number defining the number of indices to draw.", "instanceCount": "A number defining the number of instances to draw. If omitted, instanceCount defaults to 1.", @@ -13800,7 +13818,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexedIndirect() method of the\nGPURenderBundleEncoder interface draws indexed primitives using parameters read from a GPUBuffer.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndexedIndirect().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexedIndirect() method of the\nGPURenderBundleEncoder interface draws indexed primitives using parameters read from a GPUBuffer.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndexedIndirect().\n

    ", "parameters": { "indirectBuffer": "A GPUBuffer containing the indexCount, instanceCount, firstIndex, baseVertex, and firstInstance values needed to carry out the drawing operation. The buffer must contain a tightly packed block of five 32-bit unsigned integer values representing the values (20 bytes total), given in the same order as the arguments for GPURenderBundleEncoder.drawIndexed(). So for example:\n
    \n```js\nconst uint32 = new Uint32Array(5);\nuint32[0] = 3; // The indexCount value\nuint32[1] = 1; // The instanceCount value\nuint32[2] = 0; // The firstIndex value\nuint32[3] = 0; // The baseVertex value\nuint32[4] = 0; // The firstInstance value\n// Write values into a GPUBuffer\ndevice.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);\n```\n
    \n
    \n

    Note:\nThe indirect-first-instance feature needs to be enabled for non-zero firstInstance values to be used. If the indirect-first-instance feature is not enabled and firstInstance is not zero, the drawIndexedIndirect() call will be treated as a no-op.\n

    ", "indirectOffset": "The offset, in bytes, into indirectBuffer where the value data begins." @@ -13820,7 +13838,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndirect() method of the\nGPURenderBundleEncoder interface draws primitives using parameters read from a GPUBuffer.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndirect().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndirect() method of the\nGPURenderBundleEncoder interface draws primitives using parameters read from a GPUBuffer.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — drawIndirect().\n

    ", "parameters": { "indirectBuffer": "A GPUBuffer containing the vertexCount, instanceCount, firstVertex, and firstInstance values needed to carry out the drawing operation. The buffer must contain a tightly packed block of four 32-bit unsigned integer values representing the values (16 bytes total), given in the same order as the arguments for GPURenderBundleEncoder.draw(). So for example:\n
    \n```js\nconst uint32 = new Uint32Array(4);\nuint32[0] = 3; // The vertexCount value\nuint32[1] = 1; // The instanceCount value\nuint32[2] = 0; // The firstVertex value\nuint32[3] = 0; // The firstInstance value\n// Write values into a GPUBuffer\ndevice.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);\n```\n
    \n
    \n

    Note:\nThe indirect-first-instance feature needs to be enabled for non-zero firstInstance values to be used. If the indirect-first-instance feature is not enabled and firstInstance is not zero, the drawIndirect() call will be treated as a no-op.\n

    ", "indirectOffset": "The offset, in bytes, into indirectBuffer where the value data begins." @@ -13840,7 +13858,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The finish() method of the\nGPURenderBundleEncoder interface completes recording of the current render bundle command sequence, returning a GPURenderBundle object that can be passed into a GPURenderPassEncoder.executeBundles() call to execute those commands in a specific render pass.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The finish() method of the\nGPURenderBundleEncoder interface completes recording of the current render bundle command sequence, returning a GPURenderBundle object that can be passed into a GPURenderPassEncoder.executeBundles() call to execute those commands in a specific render pass.", "parameters": { "descriptor": "An object containing the following properties:\n

    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    " }, @@ -13859,7 +13877,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPURenderBundleEncoder interface marks a specific point in a series of encoded render bundle pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — InsertDebugMarker().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPURenderBundleEncoder interface marks a specific point in a series of encoded render bundle pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — InsertDebugMarker().\n

    ", "parameters": { "markerLabel": "A string representing the label to insert." }, @@ -13878,7 +13896,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderBundleEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createRenderBundleEncoder() call, or you can get and set it directly on the GPURenderBundleEncoder object.\n

    \n

    Note:\nThis property is functionally identical to its equivalent on GPURenderPassEncoder — label.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderBundleEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createRenderBundleEncoder() call, or you can get and set it directly on the GPURenderBundleEncoder object.\n

    \n

    Note:\nThis property is functionally identical to its equivalent on GPURenderPassEncoder — label.\n

    " }, "gpurenderbundleencoder.popdebuggroup": { "url": "$MDN_URL$/web/api/gpurenderbundleencoder/popdebuggroup", @@ -13893,7 +13911,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPURenderBundleEncoder interface ends a render bundle debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — popDebugGroup().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPURenderBundleEncoder interface ends a render bundle debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — popDebugGroup().\n

    ", "returns": "None (Undefined)." }, "gpurenderbundleencoder.pushdebuggroup": { @@ -13909,7 +13927,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPURenderBundleEncoder interface begins a render bundle debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — pushDebugGroup().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPURenderBundleEncoder interface begins a render bundle debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — pushDebugGroup().\n

    ", "parameters": { "groupLabel": "A string representing the label for the debug group." }, @@ -13928,7 +13946,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPURenderBundleEncoder interface sets the GPUBindGroup to use for subsequent render bundle commands, for a given index.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setBindGroup().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPURenderBundleEncoder interface sets the GPUBindGroup to use for subsequent render bundle commands, for a given index.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setBindGroup().\n

    ", "parameters": { "index": "The index to set the bind group at. This matches the n index value of the corresponding @group(n) attribute in the shader code (GPUShaderModule) used in the related pipeline.", "bindGroup": "The GPUBindGroup to use for subsequent render bundle commands, or null, in which case any previously-set bind group in the given slot is unset.", @@ -13951,7 +13969,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setIndexBuffer() method of the\nGPURenderBundleEncoder interface sets the current GPUBuffer that will provide index data for subsequent drawing commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setIndexBuffer().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setIndexBuffer() method of the\nGPURenderBundleEncoder interface sets the current GPUBuffer that will provide index data for subsequent drawing commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setIndexBuffer().\n

    ", "parameters": { "buffer": "A GPUBuffer representing the buffer containing the index data to use for subsequent drawing commands.", "indexFormat": "An enumerated value that defines the format of the index data contained in buffer. Possible values are:\n", @@ -13973,7 +13991,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPURenderBundleEncoder interface sets the GPURenderPipeline to use for subsequent render bundle commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setPipeline().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPURenderBundleEncoder interface sets the GPURenderPipeline to use for subsequent render bundle commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setPipeline().\n

    ", "parameters": { "pipeline": "The GPURenderPipeline to use for subsequent render bundle commands." }, @@ -13992,7 +14010,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setVertexBuffer() method of the\nGPURenderBundleEncoder interface sets or unsets the current GPUBuffer for the given slot that will provide vertex data for subsequent drawing commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setVertexBuffer().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setVertexBuffer() method of the\nGPURenderBundleEncoder interface sets or unsets the current GPUBuffer for the given slot that will provide vertex data for subsequent drawing commands.\n

    \n

    Note:\nThis method is functionally identical to its equivalent on GPURenderPassEncoder — setVertexBuffer().\n

    ", "parameters": { "slot": "A number referencing the vertex buffer slot to set the vertex buffer for.", "buffer": "A GPUBuffer representing the buffer containing the vertex data to use for subsequent drawing commands, or null, in which case any previously-set buffer in the given slot is unset.", @@ -14014,7 +14032,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderPassEncoder interface of the WebGPU API encodes commands related to controlling the vertex and fragment shader stages, as issued by a GPURenderPipeline. It forms part of the overall encoding activity of a GPUCommandEncoder.\n

    A render pipeline renders graphics to GPUTexture attachments, typically intended for display in a <canvas> element, but it could also render to textures used for other purposes that never appear onscreen. It has two main stages:\n

    \n

    A GPURenderPassEncoder object instance is created via the GPUCommandEncoder.beginRenderPass() property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderPassEncoder interface of the WebGPU API encodes commands related to controlling the vertex and fragment shader stages, as issued by a GPURenderPipeline. It forms part of the overall encoding activity of a GPUCommandEncoder.\n

    A render pipeline renders graphics to GPUTexture attachments, typically intended for display in a <canvas> element, but it could also render to textures used for other purposes that never appear onscreen. It has two main stages:\n

    \n

    A GPURenderPassEncoder object instance is created via the GPUCommandEncoder.beginRenderPass() property." }, "gpurenderpassencoder.beginocclusionquery": { "url": "$MDN_URL$/web/api/gpurenderpassencoder/beginocclusionquery", @@ -14029,7 +14047,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginOcclusionQuery() method of the\nGPURenderPassEncoder interface begins an occlusion query at the specified index of the relevant GPUQuerySet (provided as the value of the occlusionQuerySet descriptor property when invoking GPUCommandEncoder.beginRenderPass() to run the render pass).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The beginOcclusionQuery() method of the\nGPURenderPassEncoder interface begins an occlusion query at the specified index of the relevant GPUQuerySet (provided as the value of the occlusionQuerySet descriptor property when invoking GPUCommandEncoder.beginRenderPass() to run the render pass).", "parameters": { "queryIndex": "The index in the GPUQuerySet to begin the occlusion query at." }, @@ -14048,7 +14066,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The draw() method of the\nGPURenderPassEncoder interface draws primitives based on the vertex buffers provided by setVertexBuffer().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The draw() method of the\nGPURenderPassEncoder interface draws primitives based on the vertex buffers provided by setVertexBuffer().", "parameters": { "vertexCount": "A number defining the number of vertices to draw.", "instanceCount": "A number defining the number of instances to draw. If omitted, instanceCount defaults to 1.", @@ -14070,7 +14088,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexed() method of the\nGPURenderPassEncoder interface draws indexed primitives based on the vertex and index buffers provided by setVertexBuffer() and setIndexBuffer().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexed() method of the\nGPURenderPassEncoder interface draws indexed primitives based on the vertex and index buffers provided by setVertexBuffer() and setIndexBuffer().", "parameters": { "indexCount": "A number defining the number of indices to draw.", "instanceCount": "A number defining the number of instances to draw. If omitted, instanceCount defaults to 1.", @@ -14093,7 +14111,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexedIndirect() method of the\nGPURenderPassEncoder interface draws indexed primitives using parameters read from a GPUBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndexedIndirect() method of the\nGPURenderPassEncoder interface draws indexed primitives using parameters read from a GPUBuffer.", "parameters": { "indirectBuffer": "A GPUBuffer containing the indexCount, instanceCount, firstIndex, baseVertex, and firstInstance values needed to carry out the drawing operation. The buffer must contain a tightly packed block of five 32-bit unsigned integer values representing the values (20 bytes total), given in the same order as the arguments for GPURenderPassEncoder.drawIndexed(). So for example:\n

    \n```js\nconst uint32 = new Uint32Array(5);\nuint32[0] = 3; // The indexCount value\nuint32[1] = 1; // The instanceCount value\nuint32[2] = 0; // The firstIndex value\nuint32[3] = 0; // The baseVertex value\nuint32[4] = 0; // The firstInstance value\n// Write values into a GPUBuffer\ndevice.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);\n```\n
    \n
    \n

    Note:\nThe indirect-first-instance feature needs to be enabled for non-zero firstInstance values to be used. If the indirect-first-instance feature is not enabled and firstInstance is not zero, the drawIndexedIndirect() call will be treated as a no-op.\n

    ", "indirectOffset": "The offset, in bytes, into indirectBuffer where the value data begins." @@ -14113,7 +14131,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndirect() method of the\nGPURenderPassEncoder interface draws primitives using parameters read from a GPUBuffer.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The drawIndirect() method of the\nGPURenderPassEncoder interface draws primitives using parameters read from a GPUBuffer.", "parameters": { "indirectBuffer": "A GPUBuffer containing the vertexCount, instanceCount, firstVertex, and firstInstance values needed to carry out the drawing operation. The buffer must contain a tightly packed block of four 32-bit unsigned integer values representing the values (16 bytes total), given in the same order as the arguments for GPURenderPassEncoder.draw(). So for example:\n

    \n```js\nconst uint32 = new Uint32Array(4);\nuint32[0] = 3; // The vertexCount value\nuint32[1] = 1; // The instanceCount value\nuint32[2] = 0; // The firstVertex value\nuint32[3] = 0; // The firstInstance value\n// Write values into a GPUBuffer\ndevice.queue.writeBuffer(buffer, 0, uint32, 0, uint32.length);\n```\n
    \n
    \n

    Note:\nThe indirect-first-instance feature needs to be enabled for non-zero firstInstance values to be used. If the indirect-first-instance feature is not enabled and firstInstance is not zero, the drawIndirect() call will be treated as a no-op.\n

    ", "indirectOffset": "The offset, in bytes, into indirectBuffer where the value data begins." @@ -14133,7 +14151,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The end() method of the\nGPURenderPassEncoder interface completes recording of the current render pass command sequence.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The end() method of the\nGPURenderPassEncoder interface completes recording of the current render pass command sequence.", "returns": "None (Undefined)." }, "gpurenderpassencoder.endocclusionquery": { @@ -14149,7 +14167,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The endOcclusionQuery() method of the\nGPURenderPassEncoder interface ends an active occlusion query previously started with beginOcclusionQuery().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The endOcclusionQuery() method of the\nGPURenderPassEncoder interface ends an active occlusion query previously started with beginOcclusionQuery().", "returns": "None (Undefined)." }, "gpurenderpassencoder.executebundles": { @@ -14165,7 +14183,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The executeBundles() method of the\nGPURenderPassEncoder interface executes commands previously recorded into the referenced GPURenderBundles, as part of this render pass.\n

    \n

    Note:\nAfter calling executeBundles() the currently set vertex buffers, index buffers, bind groups, and pipeline are all cleared, even if no bundles are actually executed.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The executeBundles() method of the\nGPURenderPassEncoder interface executes commands previously recorded into the referenced GPURenderBundles, as part of this render pass.\n

    \n

    Note:\nAfter calling executeBundles() the currently set vertex buffers, index buffers, bind groups, and pipeline are all cleared, even if no bundles are actually executed.\n

    ", "parameters": { "bundles": "An array of GPURenderBundle objects, containing the pre-recorded commands to execute." }, @@ -14184,7 +14202,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPURenderPassEncoder interface marks a specific point in a series of encoded render pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The insertDebugMarker() method of the\nGPURenderPassEncoder interface marks a specific point in a series of encoded render pass commands with a label.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "markerLabel": "A string representing the label to insert." }, @@ -14203,7 +14221,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderPassEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.beginRenderPass() call, or you can get and set it directly on the GPURenderPassEncoder object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label read-only property of the\nGPURenderPassEncoder interface is a string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUCommandEncoder.beginRenderPass() call, or you can get and set it directly on the GPURenderPassEncoder object." }, "gpurenderpassencoder.popdebuggroup": { "url": "$MDN_URL$/web/api/gpurenderpassencoder/popdebuggroup", @@ -14218,7 +14236,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPURenderPassEncoder interface ends a render pass debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The popDebugGroup() method of the\nGPURenderPassEncoder interface ends a render pass debug group, which is begun with a pushDebugGroup() call.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "returns": "None (Undefined)." }, "gpurenderpassencoder.pushdebuggroup": { @@ -14234,7 +14252,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPURenderPassEncoder interface begins a render pass debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushDebugGroup() method of the\nGPURenderPassEncoder interface begins a render pass debug group, which is marked with a specified label, and will contain all subsequent encoded commands up until a popDebugGroup() method is invoked.\n

    This could be used for telemetry, or may be utilized in GPUError messages, browser dev tools, or other services in the future to help with debugging.", "parameters": { "groupLabel": "A string representing the label for the debug group." }, @@ -14253,7 +14271,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPURenderPassEncoder interface sets the GPUBindGroup to use for subsequent render commands, for a given index.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBindGroup() method of the\nGPURenderPassEncoder interface sets the GPUBindGroup to use for subsequent render commands, for a given index.", "parameters": { "index": "The index to set the bind group at. This matches the n index value of the corresponding @group(n) attribute in the shader code (GPUShaderModule) used in the related pipeline.", "bindGroup": "The GPUBindGroup to use for subsequent render commands, or null, in which case any previously-set bind group in the given slot is unset.", @@ -14276,7 +14294,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBlendConstant() method of the\nGPURenderPassEncoder interface sets the constant blend color and alpha values used with \"constant\" and \"one-minus-constant\" blend factors (as set in the descriptor of the GPUDevice.createRenderPipeline() method, in the blend property).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setBlendConstant() method of the\nGPURenderPassEncoder interface sets the constant blend color and alpha values used with \"constant\" and \"one-minus-constant\" blend factors (as set in the descriptor of the GPUDevice.createRenderPipeline() method, in the blend property).", "parameters": { "color": "An object or array representing the color to use when blending — the r, g, b, and a components are represented as floating point numbers between 0.0 and 1.0.\n

    What follows is an object example:\n

    \n```js\nconst color = { r: 0.0, g: 0.5, b: 1.0, a: 1.0 };\n```\n
    \n

    The array equivalent would look like this:\n

    \n```js\nconst color = [0.0, 0.5, 1.0, 1.0];\n```\n
    " }, @@ -14295,7 +14313,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setIndexBuffer() method of the\nGPURenderPassEncoder interface sets the current GPUBuffer that will provide index data for subsequent drawing commands.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setIndexBuffer() method of the\nGPURenderPassEncoder interface sets the current GPUBuffer that will provide index data for subsequent drawing commands.", "parameters": { "buffer": "A GPUBuffer representing the buffer containing the index data to use for subsequent drawing commands.", "indexFormat": "An enumerated value that defines the format of the index data contained in buffer. Possible values are:\n

    ", @@ -14317,7 +14335,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPURenderPassEncoder interface sets the GPURenderPipeline to use for subsequent render pass commands.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setPipeline() method of the\nGPURenderPassEncoder interface sets the GPURenderPipeline to use for subsequent render pass commands.", "parameters": { "pipeline": "The GPURenderPipeline to use for subsequent render pass commands." }, @@ -14336,7 +14354,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setScissorRect() method of the\nGPURenderPassEncoder interface sets the scissor rectangle used during the rasterization stage. After transformation into viewport coordinates any fragments that fall outside the scissor rectangle will be discarded.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setScissorRect() method of the\nGPURenderPassEncoder interface sets the scissor rectangle used during the rasterization stage. After transformation into viewport coordinates any fragments that fall outside the scissor rectangle will be discarded.", "parameters": { "x": "A number representing the minimum X value of the scissor rectangle, in pixels.", "y": "A number representing the minimum Y value of the scissor rectangle, in pixels.", @@ -14358,7 +14376,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setStencilReference() method of the\nGPURenderPassEncoder interface sets the stencil reference value using during stencil tests with the \"replace\" stencil operation (as set in the descriptor of the GPUDevice.createRenderPipeline() method, in the properties defining the various stencil operations).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setStencilReference() method of the\nGPURenderPassEncoder interface sets the stencil reference value using during stencil tests with the \"replace\" stencil operation (as set in the descriptor of the GPUDevice.createRenderPipeline() method, in the properties defining the various stencil operations).", "parameters": { "reference": "A number representing the new stencil reference value to set for the render pass." }, @@ -14377,7 +14395,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setVertexBuffer() method of the\nGPURenderPassEncoder interface sets or unsets the current GPUBuffer for the given slot that will provide vertex data for subsequent drawing commands.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setVertexBuffer() method of the\nGPURenderPassEncoder interface sets or unsets the current GPUBuffer for the given slot that will provide vertex data for subsequent drawing commands.", "parameters": { "slot": "A number referencing the vertex buffer slot to set the vertex buffer for.", "buffer": "A GPUBuffer representing the buffer containing the vertex data to use for subsequent drawing commands, or null, in which case any previously-set buffer in the given slot is unset.", @@ -14399,7 +14417,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setViewport() method of the\nGPURenderPassEncoder interface sets the viewport used during the rasterization stage to linearly map from normalized device coordinates to viewport coordinates.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setViewport() method of the\nGPURenderPassEncoder interface sets the viewport used during the rasterization stage to linearly map from normalized device coordinates to viewport coordinates.", "parameters": { "x": "A number representing the minimum X value of the viewport, in pixels.", "y": "A number representing the minimum Y value of the viewport, in pixels.", @@ -14423,7 +14441,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderPipeline interface of the WebGPU API represents a pipeline that controls the vertex and fragment shader stages and can be used in a GPURenderPassEncoder or GPURenderBundleEncoder.\n

    A GPURenderPipeline object instance can be created using the GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() methods." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPURenderPipeline interface of the WebGPU API represents a pipeline that controls the vertex and fragment shader stages and can be used in a GPURenderPassEncoder or GPURenderBundleEncoder.\n

    A GPURenderPipeline object instance can be created using the GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() methods." }, "gpurenderpipeline.getbindgrouplayout": { "url": "$MDN_URL$/web/api/gpurenderpipeline/getbindgrouplayout", @@ -14438,7 +14456,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getBindGroupLayout() method of the\nGPURenderPipeline interface returns the pipeline's GPUBindGroupLayout object with the given index (i.e., included in the originating GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() call's pipeline layout).\n

    If the GPURenderPipeline was created with layout: \"auto\", this method is the only way to retrieve the GPUBindGroupLayouts generated by the pipeline.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getBindGroupLayout() method of the\nGPURenderPipeline interface returns the pipeline's GPUBindGroupLayout object with the given index (i.e., included in the originating GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() call's pipeline layout).\n

    If the GPURenderPipeline was created with layout: \"auto\", this method is the only way to retrieve the GPUBindGroupLayouts generated by the pipeline.", "parameters": { "index": "A number representing the index of the GPUBindGroupLayout to return." }, @@ -14457,7 +14475,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPURenderPipeline interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() call, or you can get and set it directly on the GPURenderPipeline object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPURenderPipeline interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createRenderPipeline() or GPUDevice.createRenderPipelineAsync() call, or you can get and set it directly on the GPURenderPipeline object." }, "gpusampler": { "url": "$MDN_URL$/web/api/gpusampler", @@ -14472,7 +14490,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSampler interface of the WebGPU API represents an object that can control how shaders transform and filter texture resource data.\n

    A GPUSampler object instance is created using the GPUDevice.createSampler() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSampler interface of the WebGPU API represents an object that can control how shaders transform and filter texture resource data.\n

    A GPUSampler object instance is created using the GPUDevice.createSampler() method." }, "gpusampler.label": { "url": "$MDN_URL$/web/api/gpusampler/label", @@ -14487,7 +14505,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUSampler interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createSampler() call, or you can get and set it directly on the GPUSampler object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUSampler interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createSampler() call, or you can get and set it directly on the GPUSampler object." }, "gpushadermodule": { "url": "$MDN_URL$/web/api/gpushadermodule", @@ -14502,7 +14520,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUShaderModule interface of the WebGPU API represents an internal shader module object, a container for WGSL shader code that can be submitted to the GPU for execution by a pipeline.\n

    A GPUShaderModule object instance is created using GPUDevice.createShaderModule()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUShaderModule interface of the WebGPU API represents an internal shader module object, a container for WGSL shader code that can be submitted to the GPU for execution by a pipeline.\n

    A GPUShaderModule object instance is created using GPUDevice.createShaderModule()." }, "gpushadermodule.getcompilationinfo": { "url": "$MDN_URL$/web/api/gpushadermodule/getcompilationinfo", @@ -14517,7 +14535,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getCompilationInfo() method of the\nGPUShaderModule interface returns a Promise that fulfills with a GPUCompilationInfo object containing messages generated during the GPUShaderModule's compilation.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getCompilationInfo() method of the\nGPUShaderModule interface returns a Promise that fulfills with a GPUCompilationInfo object containing messages generated during the GPUShaderModule's compilation.", "returns": "A Promise that fulfills with a GPUCompilationInfo object.\n

    GPUCompilationInfo contains a messages property, which is an array of GPUCompilationMessage objects, each one containing the details of an individual compilation message." }, "gpushadermodule.label": { @@ -14533,7 +14551,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUShaderModule interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createShaderModule() call, or you can get and set it directly on the GPUShaderModule object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUShaderModule interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createShaderModule() call, or you can get and set it directly on the GPUShaderModule object." }, "gpusupportedfeatures": { "url": "$MDN_URL$/web/api/gpusupportedfeatures", @@ -14548,7 +14566,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSupportedFeatures interface of the WebGPU API is a Set-like object that describes additional functionality supported by a GPUAdapter.\n

    The GPUSupportedFeatures object for the current adapter is accessed via the GPUAdapter.features property — use this to test what features your current setup supports. To create a GPUDevice with a specific feature enabled, you need to specify it in the requiredFeatures array of the GPUAdapter.requestDevice() descriptor.\n

    You should note that not all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. This could be due to constraints in the underlying system, browser, or adapter. For example:\n

    \n

    If you are hoping to take advantage of a specific additional feature in a WebGPU app, thorough testing is advised." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSupportedFeatures interface of the WebGPU API is a Set-like object that describes additional functionality supported by a GPUAdapter.\n

    The GPUSupportedFeatures object for the current adapter is accessed via the GPUAdapter.features property — use this to test what features your current setup supports. To create a GPUDevice with a specific feature enabled, you need to specify it in the requiredFeatures array of the GPUAdapter.requestDevice() descriptor.\n

    You should note that not all features will be available to WebGPU in all browsers that support it, even if the features are supported by the underlying hardware. This could be due to constraints in the underlying system, browser, or adapter. For example:\n

    \n

    If you are hoping to take advantage of a specific additional feature in a WebGPU app, thorough testing is advised." }, "gpusupportedlimits": { "url": "$MDN_URL$/web/api/gpusupportedlimits", @@ -14563,7 +14581,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSupportedLimits interface of the WebGPU API describes the limits supported by a GPUAdapter.\n

    The GPUSupportedLimits object for the current adapter is accessed via the GPUAdapter.limits property.\n

    You should note that, rather than reporting the exact limits of each GPU, browsers will likely report different tier values of different limits to reduce the unique information available to drive-by fingerprinting. For example, the tiers of a certain limit might be 2048, 8192, and 32768. If your GPU's actual limit is 16384, the browser will still report 8192.\n

    Given that different browsers will handle this differently and the tier values may change over time, it is hard to provide an accurate account of what limit values to expect — thorough testing is advised." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUSupportedLimits interface of the WebGPU API describes the limits supported by a GPUAdapter.\n

    The GPUSupportedLimits object for the current adapter is accessed via the GPUAdapter.limits property.\n

    You should note that, rather than reporting the exact limits of each GPU, browsers will likely report different tier values of different limits to reduce the unique information available to drive-by fingerprinting. For example, the tiers of a certain limit might be 2048, 8192, and 32768. If your GPU's actual limit is 16384, the browser will still report 8192.\n

    Given that different browsers will handle this differently and the tier values may change over time, it is hard to provide an accurate account of what limit values to expect — thorough testing is advised." }, "gputexture": { "url": "$MDN_URL$/web/api/gputexture", @@ -14578,7 +14596,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUTexture interface of the WebGPU API represents a container used to store 1D, 2D, or 3D arrays of data, such as images, to use in GPU rendering operations.\n

    A GPUTexture object instance is created using the GPUDevice.createTexture() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUTexture interface of the WebGPU API represents a container used to store 1D, 2D, or 3D arrays of data, such as images, to use in GPU rendering operations.\n

    A GPUTexture object instance is created using the GPUDevice.createTexture() method." }, "gputexture.createview": { "url": "$MDN_URL$/web/api/gputexture/createview", @@ -14593,9 +14611,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createView() method of the\nGPUTexture interface creates a GPUTextureView representing a specific view of the GPUTexture.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createView() method of the\nGPUTexture interface creates a GPUTextureView representing a specific view of the GPUTexture.", "parameters": { - "descriptor": "An object containing the following properties:\n

    \n
    arrayLayerCount Optional
    \n
    \n

    A number defining how many array layers are accessible to the view, starting with the baseArrayLayer value.\n

    If arrayLayerCount is omitted, it is given a value as follows:\n

      \n
    • If dimension is \"1d\", \"2d\", or \"3d\", arrayLayerCount is 1.
    • \n
    • If dimension is \"cube\", arrayLayerCount is 6.
    • \n
    • If dimension is \"2d-array\", or \"cube-array\", arrayLayerCount is GPUTexture.depthOrArrayLayers - baseArrayLayer.
    • \n
    \n
    \n
    aspect Optional
    \n
    \n

    An enumerated value specifying which aspect(s) of the texture are accessible to the texture view. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be accessible to the view, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be accessible to the view.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be accessible to the view.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    baseArrayLayer Optional
    \n
    \n

    A number defining the index of the first array layer accessible to the view. If omitted, baseArrayLayer takes a value of 0.\n

    \n
    baseMipLevel Optional
    \n
    \n

    A number representing the first (most detailed) mipmap level accessible to the view. If omitted, baseMipLevel takes a value of 0.\n

    \n
    dimension Optional
    \n
    \n

    An enumerated value specifying the format to view the texture as. Possible values are:\n

      \n
    • \"1d\": The texture is viewed as a one-dimensional image.
    • \n
    • \"2d\": The texture is viewed as a single two-dimensional image.
    • \n
    • \"2d-array\": The texture is viewed as an array of two-dimensional images.
    • \n
    • \"cube\": The texture is viewed as a cubemap. The view has 6 array layers, corresponding to the [+X, -X, +Y, -Y, +Z, -Z] faces of the cube. Sampling is done seamlessly across the faces of the cubemap.
    • \n
    • \"cube-array\": The texture is viewed as a packed array of N cubemaps, each with 6 array layers corresponding to the [+X, -X, +Y, -Y, +Z, -Z] faces of the cube. Sampling is done seamlessly across the faces of the cubemaps.
    • \n
    • \"3d\": The texture is viewed as a three-dimensional image.
    • \n
    \n

    If dimension is omitted, it is given a value as follows:\n

    \n
    \n
    format Optional
    \n
    \n

    An enumerated value specifying the format of the texture view. See the Texture formats section of the specification for all the possible values.\n

    If format is omitted, it will be given a value as follows:\n

    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    mipLevelCount Optional
    \n
    \n

    A number defining how many mipmap levels are accessible to the view, starting with the baseMipLevel value.\n

    If mipLevelCount is omitted, it will be given a value of GPUTexture.mipLevelCount - baseMipLevel.\n

    \n
    usage Optional
    \n
    \n

    A set of bitwise flags representing a subset of the source texture's usage flags (available in the GPUTexture.usage property) that are compatible with the chosen view format. This can be used to restrict the allowed view usage in cases where the view format is incompatible with certain usages. The available usage flags are listed in the GPUTexture.usage value table.\n

    The default value is 0, which represents the source texture's full set of usage flags. If the view's format doesn't support all of the texture's usages, the default will fail, and the view's usage must be specified explicitly.\n

    \n
    " + "descriptor": "An object containing the following properties:\n
    \n
    arrayLayerCount Optional
    \n
    \n

    A number defining how many array layers are accessible to the view, starting with the baseArrayLayer value.\n

    If arrayLayerCount is omitted, it is given a value as follows:\n

      \n
    • If dimension is \"1d\", \"2d\", or \"3d\", arrayLayerCount is 1.
    • \n
    • If dimension is \"cube\", arrayLayerCount is 6.
    • \n
    • If dimension is \"2d-array\", or \"cube-array\", arrayLayerCount is GPUTexture.depthOrArrayLayers - baseArrayLayer.
    • \n
    \n
    \n
    aspect Optional
    \n
    \n

    An enumerated value specifying which aspect(s) of the texture are accessible to the texture view. Possible values are:\n

    \n
    \"all\"
    \n
    \n

    All available aspects of the texture format will be accessible to the view, which can mean all or any of color, depth, and stencil, depending on what kind of format you are dealing with.\n

    \n
    \"depth-only\"
    \n
    \n

    Only the depth aspect of a depth-or-stencil format will be accessible to the view.\n

    \n
    \"stencil-only\"
    \n
    \n

    Only the stencil aspect of a depth-or-stencil format will be accessible to the view.\n

    \n
    \n

    If omitted, aspect takes a value of \"all\".\n

    \n
    baseArrayLayer Optional
    \n
    \n

    A number defining the index of the first array layer accessible to the view. If omitted, baseArrayLayer takes a value of 0.\n

    \n
    baseMipLevel Optional
    \n
    \n

    A number representing the first (most detailed) mipmap level accessible to the view. If omitted, baseMipLevel takes a value of 0.\n

    \n
    dimension Optional
    \n
    \n

    An enumerated value specifying the format to view the texture as. Possible values are:\n

      \n
    • \"1d\": The texture is viewed as a one-dimensional image.
    • \n
    • \"2d\": The texture is viewed as a single two-dimensional image.
    • \n
    • \"2d-array\": The texture is viewed as an array of two-dimensional images.
    • \n
    • \"cube\": The texture is viewed as a cubemap. The view has 6 array layers, corresponding to the [+X, -X, +Y, -Y, +Z, -Z] faces of the cube. Sampling is done seamlessly across the faces of the cubemap.
    • \n
    • \"cube-array\": The texture is viewed as a packed array of N cubemaps, each with 6 array layers corresponding to the [+X, -X, +Y, -Y, +Z, -Z] faces of the cube. Sampling is done seamlessly across the faces of the cubemaps.
    • \n
    • \"3d\": The texture is viewed as a three-dimensional image.
    • \n
    \n

    If dimension is omitted, it is given a value as follows:\n

    \n
    \n
    format Optional
    \n
    \n

    An enumerated value specifying the format of the texture view. See the Texture formats section of the specification for all the possible values.\n

    If format is omitted, it will be given a value as follows:\n

    \n
    \n
    label Optional
    \n
    \n

    A string providing a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    \n
    mipLevelCount Optional
    \n
    \n

    A number defining how many mipmap levels are accessible to the view, starting with the baseMipLevel value.\n

    If mipLevelCount is omitted, it will be given a value of GPUTexture.mipLevelCount - baseMipLevel.\n

    \n
    swizzle Optional
    \n
    \n

    A string containing four characters. The position of each character maps to the texture view's red, green, blue, and alpha channel values, respectively. The value of each character specifies the value each of those channels will take when the view is accessed by a shader. Possible values are:\n

    \n
    r
    \n
    \n

    The texture's red channel value.\n

    \n
    g
    \n
    \n

    The texture's green channel value.\n

    \n
    b
    \n
    \n

    The texture's blue channel value.\n

    \n
    a
    \n
    \n

    The texture's alpha channel value.\n

    \n
    0
    \n
    \n

    Enforces a value of 0.\n

    \n
    1
    \n
    \n

    Enforces a value of 1.\n

    \n
    \n

    For example, swizzle: \"grba\" would result in the texture's red and green channel values being swapped when a shader accesses the view. Texture component swizzle allows developers to optimize performance, correct component ordering mismatches, and reuse shader code across various texture formats when sampling textures.\n

    \n

    Note:\nTo use the swizzle property, you must enable the texture-component-swizzle feature in your GPUDevice by specifying it in the requiredFeatures array of the GPUAdapter.requestDevice() descriptor. If this feature is not enabled, the swizzle property will have no effect.\n

    \n
    \n
    usage Optional
    \n
    \n

    A set of bitwise flags representing a subset of the source texture's usage flags (available in the GPUTexture.usage property) that are compatible with the chosen view format. This can be used to restrict the allowed view usage in cases where the view format is incompatible with certain usages. The available usage flags are listed in the GPUTexture.usage value table.\n

    The default value is 0, which represents the source texture's full set of usage flags. If the view's format doesn't support all of the texture's usages, the default will fail, and the view's usage must be specified explicitly.\n

    \n
    " }, "returns": "A GPUTextureView object instance." }, @@ -14612,7 +14630,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The depthOrArrayLayers read-only property of the\nGPUTexture interface represents the depth or layer count of the GPUTexture.\n

    This is set based on the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The depthOrArrayLayers read-only property of the\nGPUTexture interface represents the depth or layer count of the GPUTexture.\n

    This is set based on the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." }, "gputexture.destroy": { "url": "$MDN_URL$/web/api/gputexture/destroy", @@ -14627,7 +14645,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUTexture interface destroys the GPUTexture.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The destroy() method of the\nGPUTexture interface destroys the GPUTexture.", "returns": "None (Undefined)." }, "gputexture.dimension": { @@ -14643,7 +14661,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dimension read-only property of the\nGPUTexture interface represents the dimension of the set of texels for each GPUTexture subresource.\n

    This is set via the dimension property in the descriptor object passed into the originating GPUDevice.createTexture() call, which defaults to \"2d\" if omitted." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dimension read-only property of the\nGPUTexture interface represents the dimension of the set of texels for each GPUTexture subresource.\n

    This is set via the dimension property in the descriptor object passed into the originating GPUDevice.createTexture() call, which defaults to \"2d\" if omitted." }, "gputexture.format": { "url": "$MDN_URL$/web/api/gputexture/format", @@ -14658,7 +14676,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The format read-only property of the\nGPUTexture interface represents the format of the GPUTexture.\n

    This is set via the format property in the descriptor object passed into the originating GPUDevice.createTexture() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The format read-only property of the\nGPUTexture interface represents the format of the GPUTexture.\n

    This is set via the format property in the descriptor object passed into the originating GPUDevice.createTexture() call." }, "gputexture.height": { "url": "$MDN_URL$/web/api/gputexture/height", @@ -14673,7 +14691,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The height read-only property of the\nGPUTexture interface represents the height of the GPUTexture.\n

    This is set based on the value of the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The height read-only property of the\nGPUTexture interface represents the height of the GPUTexture.\n

    This is set based on the value of the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." }, "gputexture.label": { "url": "$MDN_URL$/web/api/gputexture/label", @@ -14688,7 +14706,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUTexture interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createTexture() call, or you can get and set it directly on the GPUTexture object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUTexture interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUDevice.createTexture() call, or you can get and set it directly on the GPUTexture object." }, "gputexture.miplevelcount": { "url": "$MDN_URL$/web/api/gputexture/miplevelcount", @@ -14703,7 +14721,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mipLevelCount read-only property of the\nGPUTexture interface represents the number of mip levels of the GPUTexture.\n

    This is set via the mipLevelCount property in the descriptor object passed into the originating GPUDevice.createTexture() call. If omitted, this defaults to 1." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mipLevelCount read-only property of the\nGPUTexture interface represents the number of mip levels of the GPUTexture.\n

    This is set via the mipLevelCount property in the descriptor object passed into the originating GPUDevice.createTexture() call. If omitted, this defaults to 1." }, "gputexture.samplecount": { "url": "$MDN_URL$/web/api/gputexture/samplecount", @@ -14718,7 +14736,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sampleCount read-only property of the\nGPUTexture interface represents the sample count of the GPUTexture.\n

    This is set via the sampleCount property in the descriptor object passed into the originating GPUDevice.createTexture() call. If omitted, this defaults to 1." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sampleCount read-only property of the\nGPUTexture interface represents the sample count of the GPUTexture.\n

    This is set via the sampleCount property in the descriptor object passed into the originating GPUDevice.createTexture() call. If omitted, this defaults to 1." }, "gputexture.usage": { "url": "$MDN_URL$/web/api/gputexture/usage", @@ -14733,7 +14751,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usage read-only property of the\nGPUTexture interface is the bitwise flags representing the allowed usages of the GPUTexture.\n

    This is set via the usage property in the descriptor object passed into the originating GPUDevice.createTexture() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usage read-only property of the\nGPUTexture interface is the bitwise flags representing the allowed usages of the GPUTexture.\n

    This is set via the usage property in the descriptor object passed into the originating GPUDevice.createTexture() call." }, "gputexture.width": { "url": "$MDN_URL$/web/api/gputexture/width", @@ -14748,7 +14766,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The width read-only property of the\nGPUTexture interface represents the width of the GPUTexture.\n

    This is set based on the value of the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The width read-only property of the\nGPUTexture interface represents the width of the GPUTexture.\n

    This is set based on the value of the size property in the descriptor object passed into the originating GPUDevice.createTexture() call." }, "gputextureview": { "url": "$MDN_URL$/web/api/gputextureview", @@ -14763,7 +14781,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUTextureView interface of the WebGPU API represents a view into a subset of the texture resources defined by a particular GPUTexture.\n

    A GPUTextureView object instance is created using the GPUTexture.createView() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUTextureView interface of the WebGPU API represents a view into a subset of the texture resources defined by a particular GPUTexture.\n

    A GPUTextureView object instance is created using the GPUTexture.createView() method." }, "gputextureview.label": { "url": "$MDN_URL$/web/api/gputextureview/label", @@ -14778,7 +14796,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUTextureView interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUTexture.createView() call, or you can get and set it directly on the GPUTextureView object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The label property of the\nGPUTextureView interface provides a label that can be used to identify the object, for example in GPUError messages or console warnings.\n

    This can be set by providing a label property in the descriptor object passed into the originating GPUTexture.createView() call, or you can get and set it directly on the GPUTextureView object." }, "gpuuncapturederrorevent": { "url": "$MDN_URL$/web/api/gpuuncapturederrorevent", @@ -14793,7 +14811,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUUncapturedErrorEvent interface of the WebGPU API is the event object type for the GPUDevice uncapturederror event, used for telemetry and to report unexpected errors.\n

    Known error cases should be handled using pushErrorScope() and popErrorScope()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUUncapturedErrorEvent interface of the WebGPU API is the event object type for the GPUDevice uncapturederror event, used for telemetry and to report unexpected errors.\n

    Known error cases should be handled using pushErrorScope() and popErrorScope()." }, "gpuuncapturederrorevent.error": { "url": "$MDN_URL$/web/api/gpuuncapturederrorevent/error", @@ -14808,7 +14826,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The error read-only property of the\nGPUUncapturedErrorEvent interface is a GPUError object instance providing access to the details of the error." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The error read-only property of the\nGPUUncapturedErrorEvent interface is a GPUError object instance providing access to the details of the error." }, "gpuuncapturederrorevent.gpuuncapturederrorevent": { "url": "$MDN_URL$/web/api/gpuuncapturederrorevent/gpuuncapturederrorevent", @@ -14823,7 +14841,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUUncapturedErrorEvent() constructor creates a new\nGPUUncapturedErrorEvent object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUUncapturedErrorEvent() constructor creates a new\nGPUUncapturedErrorEvent object instance.", "parameters": { "type": "An enumerated value specifying the type of error. Possible values are:\n

    \n
    \"internal\"
    \n
    \n

    The error is a GPUInternalError.\n

    \n
    \"out-of-memory\"
    \n
    \n

    The error is a GPUOutOfMemoryError.\n

    \n
    \"validation\"
    \n
    \n

    The error is a GPUValidationError.\n

    \n
    ", "options": "An object, which can contain the following properties:\n
    \n
    error
    \n
    \n

    A GPUError object instance providing access to the details of the error.\n

    \n
    " @@ -14842,7 +14860,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUValidationError interface of the WebGPU API describes an application error indicating that an operation did not pass the WebGPU API's validation constraints.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Validation errors occur whenever invalid inputs are given to a WebGPU call. These are consistent, predictable, and should not occur provided your app is well-formed. They will occur in the same way on every device your code runs on, so once you've fixed any errors that show up during development you probably don't need to observe them directly most of the time. An exception to that rule is if you're consuming user-supplied assets, shaders, etc., in which case watching for validation errors while loading could be helpful.\n

    \n

    Note:\nWe have attempted to provide useful information to help you understand why validation errors are occurring in your WebGPU code in \"Validation\" sections where appropriate, which list criteria to meet to avoid validation errors. See for example the GPUDevice.createBindGroup() Validation section.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUValidationError interface of the WebGPU API describes an application error indicating that an operation did not pass the WebGPU API's validation constraints.\n

    It represents one of the types of errors surfaced by GPUDevice.popErrorScope and the uncapturederror event.\n

    Validation errors occur whenever invalid inputs are given to a WebGPU call. These are consistent, predictable, and should not occur provided your app is well-formed. They will occur in the same way on every device your code runs on, so once you've fixed any errors that show up during development you probably don't need to observe them directly most of the time. An exception to that rule is if you're consuming user-supplied assets, shaders, etc., in which case watching for validation errors while loading could be helpful.\n

    \n

    Note:\nWe have attempted to provide useful information to help you understand why validation errors are occurring in your WebGPU code in \"Validation\" sections where appropriate, which list criteria to meet to avoid validation errors. See for example the GPUDevice.createBindGroup() Validation section.\n

    " }, "gpuvalidationerror.gpuvalidationerror": { "url": "$MDN_URL$/web/api/gpuvalidationerror/gpuvalidationerror", @@ -14857,7 +14875,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUValidationError() constructor creates a new\nGPUValidationError object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The GPUValidationError() constructor creates a new\nGPUValidationError object instance.", "parameters": { "message": "A string providing a human-readable message that explains why the error occurred." } @@ -14876,7 +14894,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GravitySensor interface of the Sensor APIs provides on each reading the gravity applied to the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'accelerometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GravitySensor interface of the Sensor APIs provides on each reading the gravity applied to the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'accelerometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." }, "gravitysensor.gravitysensor": { "url": "$MDN_URL$/web/api/gravitysensor/gravitysensor", @@ -14892,7 +14910,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GravitySensor()\nconstructor creates a new GravitySensor object which\nprovides on each reading the gravity applied to the device along all three axes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The GravitySensor()\nconstructor creates a new GravitySensor object which\nprovides on each reading the gravity applied to the device along all three axes.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should\nbe taken, meaning the number of times per second that the\nreading event will be called. A whole number or decimal may be\nused, the latter for frequencies less than a second. The actual reading frequency\ndepends on device hardware and consequently may be less than requested. The default\nfrequency is the one defined by the underlying platform.\n

    \n
    referenceFrame Optional
    \n
    \n

    The local coordinate system representing\nthe reference frame. It can be either 'device' or\n'screen'. The default is 'device'.\n

    \n
    " }, @@ -14914,7 +14932,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gyroscope interface of the Sensor APIs provides on each reading the angular velocity of the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'gyroscope' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gyroscope interface of the Sensor APIs provides on each reading the angular velocity of the device along all three axes.\n

    To use this sensor, the user must grant permission to the 'gyroscope' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." }, "gyroscope.gyroscope": { "url": "$MDN_URL$/web/api/gyroscope/gyroscope", @@ -14930,7 +14948,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gyroscope() constructor\ncreates a new Gyroscope object which provides on each reading the\nangular velocity of the device along all three axes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Gyroscope() constructor\ncreates a new Gyroscope object which provides on each reading the\nangular velocity of the device along all three axes.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should\nbe taken, meaning the number of times per second that the\nreading event will be called. A whole number or decimal may be\nused, the latter for frequencies less than a second. The actual reading frequency\ndepends device hardware and consequently may be less than requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or\n'screen'. The default is 'device'.\n

    \n
    " }, @@ -14952,7 +14970,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The x read-only property of the\nGyroscope interface returns a number specifying the\nangular velocity of the device along its x-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The x read-only property of the\nGyroscope interface returns a number specifying the\nangular velocity of the device along its x-axis." }, "gyroscope.y": { "url": "$MDN_URL$/web/api/gyroscope/y", @@ -14968,7 +14986,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The y read-only property of the Gyroscope interface returns a number specifying the angular velocity of the device along its y-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The y read-only property of the Gyroscope interface returns a number specifying the angular velocity of the device along its y-axis." }, "gyroscope.z": { "url": "$MDN_URL$/web/api/gyroscope/z", @@ -14984,7 +15002,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The z read-only property of the\nGyroscope interface returns a number specifying the\nangular velocity of the device along its z-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The z read-only property of the\nGyroscope interface returns a number specifying the\nangular velocity of the device along its z-axis." }, "hashchangeevent": { "url": "$MDN_URL$/web/api/hashchangeevent", @@ -15238,7 +15256,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The get() method of the Headers interface\nreturns a byte string of all the values of a header within a Headers object\nwith a given name. If the requested header doesn't exist in the Headers\nobject, it returns null.\n

    For security reasons, some headers can only be controlled by the user agent. These\nheaders include the forbidden request headers\nand forbidden response header names.", "parameters": { - "name": "The name of the HTTP header whose values you want to retrieve from the\nHeaders object. If the given name is not the name of an HTTP header, this\nmethod throws a TypeError. The name is case-insensitive." + "name": "The name of the HTTP header whose values you want to retrieve from the\nHeaders object. If the given name doesn't match the\nfield-name\nproduction in the HTTP specification, this method throws a TypeError.\nThe name is case-insensitive." }, "returns": "A String sequence representing the values of the retrieved header or\nnull if this header is not set." }, @@ -15414,7 +15432,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HID interface provides methods for connecting to HID devices, listing attached HID devices and event handlers for connected HID devices." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HID interface provides methods for connecting to HID devices, listing attached HID devices and event handlers for connected HID devices." }, "hid.getdevices": { "url": "$MDN_URL$/web/api/hid/getdevices", @@ -15430,7 +15448,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The getDevices() method of the HID interface gets a list of connected HID devices that the user has previously been granted access to in response to a requestDevice() call.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The getDevices() method of the HID interface gets a list of connected HID devices that the user has previously been granted access to in response to a requestDevice() call.", "returns": "A Promise that resolves with a list of HIDDevice objects." }, "hid.requestdevice": { @@ -15447,9 +15465,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestDevice() method of the HID interface requests access to a HID device.\n

    The user agent will present a permission dialog including a list of connected devices, and ask the user to select and grant permission to one of these devices.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestDevice() method of the HID interface requests access to a HID device.\n

    The user agent will present a permission dialog including a list of connected devices, and ask the user to select and grant permission to one of these devices.", "parameters": { - "options": "An object containing an array of filter objects for possible devices to pair with. Each filter object can have the following properties:\n

    \n
    vendorId Optional
    \n
    \n

    An integer representing the vendorId of the requested HID device\n

    \n
    productId Optional
    \n
    \n

    An integer representing the productId of the requested HID device.\n

    \n
    usagePage Optional
    \n
    \n

    An integer representing the usage page component of the HID usage of the requested device. The usage for a top level collection is used to identify the device type.\n

    Standard HID usage values can be found in the HID Usage Tables document\n

    \n
    usage Optional
    \n
    \n

    An integer representing the usage ID component of the HID usage of the requested device.\n

    \n
    " + "options": "An object containing an array of filter objects for possible devices to pair with. Each filter object can have the following properties:\n
    \n
    vendorId Optional
    \n
    \n

    An integer representing the vendorId of the requested HID device\n

    \n
    productId Optional
    \n
    \n

    An integer representing the productId of the requested HID device.\n

    \n
    usagePage Optional
    \n
    \n

    An integer representing the usage page component of the HID usage of the requested device. The usage for a top level collection is used to identify the device type.\n

    Standard HID usage values can be found in the HID Usage Tables document\n

    \n
    usage Optional
    \n
    \n

    An integer representing the usage ID component of the HID usage of the requested device.\n

    \n
    " }, "returns": "A Promise that resolves with an array of connected HIDDevice objects that match the filters passed in.", "throws": { @@ -15470,7 +15488,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDConnectionEvent interface of the WebHID API represents HID connection events, and is the event type passed to connect and disconnect event handlers when a device's connection state changes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDConnectionEvent interface of the WebHID API represents HID connection events, and is the event type passed to connect and disconnect event handlers when a device's connection state changes." }, "hidconnectionevent.device": { "url": "$MDN_URL$/web/api/hidconnectionevent/device", @@ -15486,7 +15504,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The device read-only property of the HIDConnectionEvent interface returns the HIDDevice associated with this connection event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The device read-only property of the HIDConnectionEvent interface returns the HIDDevice associated with this connection event." }, "hidconnectionevent.hidconnectionevent": { "url": "$MDN_URL$/web/api/hidconnectionevent/hidconnectionevent", @@ -15502,7 +15520,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDConnectionEvent() constructor creates a new HIDConnectionEvent object. Typically this constructor is not used as events are created when a device's connection state changes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDConnectionEvent() constructor creates a new HIDConnectionEvent object. Typically this constructor is not used as events are created when a device's connection state changes.", "parameters": { "type": "A string with the name of the event.\nIt 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:\n

    \n
    device
    \n
    \n

    The HIDDevice instance representing the device being connected or disconnected.\n

    \n
    " @@ -15523,7 +15541,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDDevice interface of the WebHID API represents a HID Device. It provides properties for accessing information about the device, methods for opening and closing the connection, and the sending and receiving of reports." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDDevice interface of the WebHID API represents a HID Device. It provides properties for accessing information about the device, methods for opening and closing the connection, and the sending and receiving of reports." }, "hiddevice.close": { "url": "$MDN_URL$/web/api/hiddevice/close", @@ -15539,7 +15557,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The close() method of the HIDDevice interface closes the connection to the HID device.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The close() method of the HIDDevice interface closes the connection to the HID device.", "returns": "A Promise that resolves with undefined once the connection is closed." }, "hiddevice.collections": { @@ -15556,7 +15574,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The collections read-only property of the HIDDevice interface returns an array of report formats" + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The collections read-only property of the HIDDevice interface returns an array of report formats" }, "hiddevice.forget": { "url": "$MDN_URL$/web/api/hiddevice/forget", @@ -15572,7 +15590,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The forget() method of the HIDDevice interface closes the connection to the HID device and forgets the device.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The forget() method of the HIDDevice interface closes the connection to the HID device and forgets the device.", "returns": "A Promise that resolves with undefined once the connection is closed, the device is forgotten, and the permission is reset." }, "hiddevice.open": { @@ -15589,7 +15607,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The open() method of the HIDDevice interface requests that the operating system opens the HID device.\n

    \n

    Note:\nHID devices are not opened automatically. Therefore, a HIDDevice returned by HID.requestDevice() must be opened with this method before it is available to transfer data.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The open() method of the HIDDevice interface requests that the operating system opens the HID device.\n

    \n

    Note:\nHID devices are not opened automatically. Therefore, a HIDDevice returned by HID.requestDevice() must be opened with this method before it is available to transfer data.\n

    ", "returns": "A Promise that resolves with undefined once the connection is opened.", "throws": { "InvalidStateError DOMException": "Thrown if the connection is already open.", @@ -15610,7 +15628,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The opened read-only property of the HIDDevice interface returns true if the connection to the HIDDevice is open and ready to transfer data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The opened read-only property of the HIDDevice interface returns true if the connection to the HIDDevice is open and ready to transfer data." }, "hiddevice.productid": { "url": "$MDN_URL$/web/api/hiddevice/productid", @@ -15626,7 +15644,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The productId read-only property of the HIDDevice interface returns the product ID of the connected HID device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The productId read-only property of the HIDDevice interface returns the product ID of the connected HID device." }, "hiddevice.productname": { "url": "$MDN_URL$/web/api/hiddevice/productname", @@ -15642,7 +15660,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The productName read-only property of the HIDDevice interface returns the product name of the connected HID device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The productName read-only property of the HIDDevice interface returns the product name of the connected HID device." }, "hiddevice.receivefeaturereport": { "url": "$MDN_URL$/web/api/hiddevice/receivefeaturereport", @@ -15658,7 +15676,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The receiveFeatureReport() method of the HIDDevice interface receives a feature report from the HID device. Feature reports are a way for HID devices and applications to exchange non-standardized HID data.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The receiveFeatureReport() method of the HIDDevice interface receives a feature report from the HID device. Feature reports are a way for HID devices and applications to exchange non-standardized HID data.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", "parameters": { "reportId": "An 8-bit report ID. If the HID device does not use report IDs, send 0." }, @@ -15681,7 +15699,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The sendFeatureReport() method of the HIDDevice interface sends a feature report to the HID device. Feature reports are a way for HID devices and applications to exchange non-standardized HID data.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The sendFeatureReport() method of the HIDDevice interface sends a feature report to the HID device. Feature reports are a way for HID devices and applications to exchange non-standardized HID data.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", "parameters": { "reportId": "An 8-bit report ID. If the HID device does not use report IDs, send 0.", "data": "Bytes as an ArrayBuffer, a TypedArray, or a DataView." @@ -15705,7 +15723,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The sendReport() method of the HIDDevice interface sends an output report to the HID device.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The sendReport() method of the HIDDevice interface sends an output report to the HID device.\n

    The reportId for each of the report formats that this device supports can be retrieved from HIDDevice.collections.", "parameters": { "reportId": "An 8-bit report ID. If the HID device does not use report IDs, send 0.", "data": "Bytes as an ArrayBuffer, a TypedArray, or a DataView." @@ -15729,7 +15747,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The vendorId read-only property of the HIDDevice interface returns the vendor ID of the connected HID device. This identifies the vendor of the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The vendorId read-only property of the HIDDevice interface returns the vendor ID of the connected HID device. This identifies the vendor of the device." }, "hidinputreportevent": { "url": "$MDN_URL$/web/api/hidinputreportevent", @@ -15745,7 +15763,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDInputReportEvent interface of the WebHID API is passed to inputreport event of HIDDevice when an input report is received from any associated HID device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The HIDInputReportEvent interface of the WebHID API is passed to inputreport event of HIDDevice when an input report is received from any associated HID device." }, "hidinputreportevent.data": { "url": "$MDN_URL$/web/api/hidinputreportevent/data", @@ -15761,7 +15779,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The data property of the HIDInputReportEvent interface returns a DataView containing the data from the input report, excluding the reportId if the HID interface uses report IDs." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The data property of the HIDInputReportEvent interface returns a DataView containing the data from the input report, excluding the reportId if the HID interface uses report IDs." }, "hidinputreportevent.device": { "url": "$MDN_URL$/web/api/hidinputreportevent/device", @@ -15777,7 +15795,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The device property of the HIDInputReportEvent interface returns the HIDDevice instance that represents the HID interface that sent the input report." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The device property of the HIDInputReportEvent interface returns the HIDDevice instance that represents the HID interface that sent the input report." }, "hidinputreportevent.reportid": { "url": "$MDN_URL$/web/api/hidinputreportevent/reportid", @@ -15793,7 +15811,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The reportId property of the HIDInputReportEvent interface returns the one-byte identification prefix for this report, or 0 if the HID interface does not use report IDs." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Shared Web Workers.

    \n

    The reportId property of the HIDInputReportEvent interface returns the one-byte identification prefix for this report, or 0 if the HID interface does not use report IDs." }, "highlight": { "url": "$MDN_URL$/web/api/highlight", @@ -16027,7 +16045,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "The priority property of the Highlight interface is a number used to determine which highlight's styles should be used to resolve style conflicts in overlapping parts. Highlights with a higher priority number have preference over those with a lower priority.\n

    It is possible to create Range objects that overlap in a document.\n

    When overlapping ranges are used by multiple different Highlight objects, and when those highlights are styled using ::highlight pseudo-elements, this may lead to conflicting styles.\n

    If two text ranges overlap and are both highlighted using the CSS Custom Highlight API, and if they're both styled using the color CSS property, the browser needs to decide which color should be used for styling the text in the overlapping part.\n

    If no priority is set, all highlights have the same priority, and the browser chooses the most recently registered highlight to style the overlapping parts.\n

    Note that all the styles of a highlight are applied and the browser only needs to resolve conflicts when the same CSS properties are used by multiple overlapping highlights. The highlight style conflict resolution also does not depend on the order in which the ::highlight pseudo-elements rules appear in the source, or whether or not CSS properties are marked as !important." + "doc": "The priority property of the Highlight interface is a number used to determine which highlight's styles should be used to resolve style conflicts in overlapping parts. Highlights with a higher priority number have preference over those with a lower priority.\n

    It is possible to create Range objects that overlap in a document.\n

    When overlapping ranges are used by multiple different Highlight objects, and when those highlights are styled using ::highlight pseudo-elements, this may lead to conflicting styles.\n

    If two text ranges overlap and are both highlighted using the CSS Custom Highlight API, and if they're both styled using the color CSS property, the browser needs to decide which color should be used for styling the text in the overlapping part.\n

    If no priority is set, all highlights have the same priority, and the browser chooses the most recently registered highlight to style the overlapping parts.\n

    Note that all the styles of a highlight are applied and the browser only needs to resolve conflicts when the same CSS properties are used by multiple overlapping highlights. The highlight style conflict resolution also does not depend on the order in which the ::highlight pseudo-elements rules appear in the source, or whether or not CSS properties are marked as !important." }, "highlight.size": { "url": "$MDN_URL$/web/api/highlight/size", @@ -16754,8 +16772,8 @@ "htmlanchorelement.attributionsrc": { "url": "$MDN_URL$/web/api/htmlanchorelement/attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -16763,10 +16781,7 @@ "Edge": "125", "Opera": "111" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The attributionSrc property of the HTMLAnchorElement interface gets and sets the attributionsrc attribute on an <a> element programmatically, reflecting the value of that attribute. attributionsrc specifies that you want the browser to send an Attribution-Reporting-Eligible header. On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source header in the response, to register of a navigation-based attribution source.\n

    The browser stores the source data associated with the navigation-based attribution source (as provided in the Attribution-Reporting-Register-Source response header) when it receives the navigation response.\n

    See the Attribution Reporting API for more details.\n

    \n

    Note:\n<a> elements cannot be used as attribution triggers, only sources.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    The attributionSrc property of the HTMLAnchorElement interface gets and sets the attributionsrc attribute on an <a> element programmatically, reflecting the value of that attribute. attributionsrc specifies that you want the browser to send an Attribution-Reporting-Eligible header. On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source header in the response, to register of a navigation-based attribution source.\n

    The browser stores the source data associated with the navigation-based attribution source (as provided in the Attribution-Reporting-Register-Source response header) when it receives the navigation response.\n

    See the Attribution Reporting API for more details.\n

    \n

    Note:\n<a> elements cannot be used as attribution triggers, only sources.\n

    " }, "htmlanchorelement.download": { "url": "$MDN_URL$/web/api/htmlanchorelement/download", @@ -16876,7 +16891,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLAnchorElement.href property is a\nstringifier that returns a string containing the whole URL, and allows\nthe href to be updated." + "doc": "The href property of the HTMLAnchorElement interface is a stringifier that returns the absolute URL corresponding to the element's href attribute (or an empty string if href is unset). Setting this property updates the element's href attribute to the provided value." }, "htmlanchorelement.hreflang": { "url": "$MDN_URL$/web/api/htmlanchorelement/hreflang", @@ -16900,6 +16915,21 @@ }, "doc": "The hreflang property of the HTMLAnchorElement interface is a string that is the language of the linked resource.\n

    It reflects the hreflang attribute of the <a> element and is the empty string (\"\") if there is no hreflang element.\n

    Web browsers and search engines may use this information to understand the language of the linked content better, but they are not required to follow it. The value provided for the hreflang attribute adheres to the BCP 47 language tag format. If not, it is ignored.\n

    Web browsers do not rely solely on the hreflang attribute after fetching the linked resource. Instead, they use language information directly associated with the resource (e.g., through HTTP headers) to determine its language." }, + "htmlanchorelement.interestforelement": { + "url": "$MDN_URL$/web/api/htmlanchorelement/interestforelement", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The interestForElement property of the HTMLAnchorElement interface gets or sets the target element of an interest invoker, in cases where the associated <a> element is specified as an interest invoker.\n

    See Creating an interest invoker for more details." + }, "htmlanchorelement.origin": { "url": "$MDN_URL$/web/api/htmlanchorelement/origin", "status": [ @@ -17092,7 +17122,7 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "The HTMLAnchorElement.relList read-only property reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <a> element and the current document.\n

    The property itself is read-only, meaning you can't substitute the\nDOMTokenList with another one, but its contents can still be changed." + "doc": "The read-only relList property of the HTMLAnchorElement returns a live DOMTokenList object containing the set of link types indicating the relationship between the resource represented by the <a> element and the current document. It reflects the <a> element's rel content attribute." }, "htmlanchorelement.search": { "url": "$MDN_URL$/web/api/htmlanchorelement/search", @@ -17403,6 +17433,21 @@ }, "doc": "The HTMLAreaElement.href property is a\nstringifier that returns a string containing the whole URL, and allows\nthe href to be updated." }, + "htmlareaelement.interestforelement": { + "url": "$MDN_URL$/web/api/htmlareaelement/interestforelement", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The interestForElement property of the HTMLAreaElement interface gets or sets the target element of an interest invoker, in cases where the associated <area> element is specified as an interest invoker.\n

    See Creating an interest invoker for more details." + }, "htmlareaelement.origin": { "url": "$MDN_URL$/web/api/htmlareaelement/origin", "status": [ @@ -17595,7 +17640,7 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "The HTMLAreaElement.relList read-only property reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <area> element and the current document.\n

    The property itself is read-only, meaning you can't substitute the\nDOMTokenList by another one, but the content of the returned list can be\nchanged." + "doc": "The read-only relList property of the HTMLAreaElement returns a live DOMTokenList object containing the set of link types indicating the relationship between the resource represented by the <area> element and the current document. It reflects the <area> element's rel content attribute." }, "htmlareaelement.search": { "url": "$MDN_URL$/web/api/htmlareaelement/search", @@ -17908,7 +17953,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLButtonElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect. It always returns true if the <button> element's type is \"button\" or \"reset\", because such buttons are never candidates for constraint validation.\n

    \n

    Note:\nAn HTML <button> element of the \"submit\" type with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLButtonElement.setCustomValidity() method to set the HTMLButtonElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", + "doc": "The checkValidity() method of the HTMLButtonElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect. It always returns true if the <button> element's type is \"button\" or \"reset\", because such buttons are never candidates for constraint validation.\n
    \n

    Note:\nAn HTML <button> element of the \"submit\" type with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLButtonElement.setCustomValidity() method to set the HTMLButtonElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", "returns": "Returns true if the element's value has no validity problems; otherwise, returns false." }, "htmlbuttonelement.command": { @@ -17923,10 +17968,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The command property of the HTMLButtonElement interface gets and sets the action to be performed on an element being controlled by this button. For this to have an effect, commandfor must be set.\n

    It reflects the command HTML attribute." }, @@ -17942,10 +17989,12 @@ "Firefox": "144", "FirefoxAndroid": "144", "Opera": "120", - "Safari": "preview" + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The commandForElement property of the HTMLButtonElement interface gets and sets the element to control via a button.\n

    It is the JavaScript equivalent of the commandfor HTML attribute." }, @@ -18103,6 +18152,21 @@ }, "doc": "The formTarget property of the HTMLButtonElement interface is the tab, window, or iframe where the response of the submitted <form> is to be displayed. It reflects the value of the <button> element's formtarget attribute.\n

    The value overrides the target property of the HTMLFormElement interface if the form is submitted via the button. This property can be retrieved or set. If not set, the value is the empty string (\"\")." }, + "htmlbuttonelement.interestforelement": { + "url": "$MDN_URL$/web/api/htmlbuttonelement/interestforelement", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The interestForElement property of the HTMLButtonElement interface gets or sets the target element of an interest invoker, in cases where the associated <button> element is specified as an interest invoker.\n

    See Creating an interest invoker for more details." + }, "htmlbuttonelement.labels": { "url": "$MDN_URL$/web/api/htmlbuttonelement/labels", "status": [ @@ -18187,7 +18251,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "The popoverTargetElement property of the HTMLButtonElement interface gets and sets the popover element to control via a button.\n

    It is the JavaScript equivalent of the popovertarget HTML attribute.\n

    Establishing a relationship between a popover and its invoker button using the popoverTargetElement property has two additional useful effects:\n

    " + "doc": "The popoverTargetElement property of the HTMLButtonElement interface gets and sets the popover element to control via a button.\n

    It is the JavaScript equivalent of the popovertarget HTML attribute.\n

    Establishing a relationship between a popover and its invoker button using the popoverTargetElement property has two additional useful effects:\n

    " }, "htmlbuttonelement.reportvalidity": { "url": "$MDN_URL$/web/api/htmlbuttonelement/reportvalidity", @@ -18914,9 +18978,9 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The close() method of the HTMLDialogElement interface closes the <dialog>.\nAn optional string may be passed as an argument, updating the returnValue of the dialog.", + "doc": "The close() method of the HTMLDialogElement interface closes the <dialog>.\nAn optional string may be passed as an argument, updating the returnValue of the dialog.\n

    The close event is fired after the dialog has closed.\nUnlike when calling HTMLDialogElement.requestClose(), the close operation cannot be cancelled.", "parameters": { - "returnValue": "A string representing an updated value for the HTMLDialogElement.returnValue of the dialog." + "returnValue": "A string that replaces the existing value of HTMLDialogElement.returnValue." }, "returns": "None (undefined)." }, @@ -18979,7 +19043,7 @@ "level": "LOW", "lowDate": "2025-05-27" }, - "doc": "The requestClose() method of the HTMLDialogElement interface requests to close the <dialog>.\nAn optional string may be passed as an argument, updating the returnValue of the dialog.\n

    This method differs from the HTMLDialogElement.close() method in that it fires a cancel event before firing the close event.\nAuthors can call Event.preventDefault() in the handler for the cancel event to prevent the dialog from closing.\n

    This method exposes the same behavior as the dialog's internal close watcher.", + "doc": "The requestClose() method of the HTMLDialogElement interface requests to close the <dialog>.\nAn optional string may be passed as an argument, updating the returnValue of the dialog.\n

    This method differs from close() in that it fires a cancel event before firing the close event.\nAuthors can call Event.preventDefault() in the handler for the cancel event to prevent the dialog from closing.\n

    This method exposes the same behavior as the dialog's internal close watcher.", "parameters": { "returnValue": "A string representing an updated value for the HTMLDialogElement.returnValue of the dialog." }, @@ -19027,7 +19091,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The show() method of the HTMLDialogElement\ninterface displays the dialog modelessly, i.e., still allowing interaction with content\noutside of the dialog.", + "doc": "The show() method of the HTMLDialogElement interface displays the dialog as a non-modal dialog.\n

    A non-modal dialog is one where users can interact with content outside/behind the open dialog.", "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the dialog is already open and modal (i.e., if the dialog has already been opened with HTMLDialogElement.showModal())." @@ -19053,7 +19117,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The showModal() method of the\nHTMLDialogElement interface displays the dialog as a modal, over the top\nof any other dialogs that might be present. It displays in the top layer, along with a\n::backdrop pseudo-element. Elements inside the same document as the dialog, except the dialog and its descendants, become inert (as if the inert attribute is specified). Only the containing document becomes blocked; if the dialog is rendered inside an iframe, the rest of the page remains interactive.", + "doc": "The showModal() method of the HTMLDialogElement interface displays the dialog as a modal dialog, over the top of any other dialogs or elements that might be visible.\n

    A modal dialog displays in the top layer, along with a ::backdrop pseudo-element.\nElements inside the same document as the dialog, except the dialog and its descendants, become inert (as if the inert attribute is specified).\nOnly the containing document becomes blocked; if the dialog is rendered inside an iframe, the rest of the page remains interactive.", "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the dialog is already open and non-modal (i.e., if the dialog has already been opened with HTMLDialogElement.show())." @@ -19119,7 +19183,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The compact property of the HTMLDListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <dl> element." + "doc": "

    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.

    \n

    The compact property of the HTMLDListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <dl> element." }, "htmldocument": { "url": "$MDN_URL$/web/api/htmldocument", @@ -19209,7 +19273,7 @@ "Experimental" ], "compatibility": {}, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The anchorElement property of the HTMLElement interface returns a reference to the element's anchor element. This works only in the case of elements associated with their anchors via the anchor HTML attribute, not elements associated with their anchors via the CSS anchor-name and position-anchor properties." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The anchorElement property of the HTMLElement interface returns a reference to the element's anchor element. This works only in the case of elements associated with their anchors via the anchor HTML attribute, not elements associated with their anchors via the CSS anchor-name and position-anchor properties." }, "htmlelement.attachinternals": { "url": "$MDN_URL$/web/api/htmlelement/attachinternals", @@ -19253,7 +19317,7 @@ "baseline": { "level": "NONE" }, - "doc": "The attributeStyleMap read-only property of the HTMLElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the HTMLElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." + "doc": "The attributeStyleMap read-only property of the HTMLElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the HTMLElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." }, "htmlelement.autocapitalize": { "url": "$MDN_URL$/web/api/htmlelement/autocapitalize", @@ -19310,7 +19374,7 @@ "lowDate": "2023-02-14", "highDate": "2025-08-14" }, - "doc": "The autofocus property of the HTMLElement interface represents a boolean value reflecting the autofocus HTML global attribute, which indicates whether the control should be focused when the page loads, or when dialog or popover become shown if specified in an element inside <dialog> elements or elements whose popover attribute is set.\n

    Only one form-associated element inside a document, or a <dialog> element, or an element whose popover attribute is set, can have this attribute specified. If there are several, the first element with the attribute set inserted, usually the first such element on the page, gets the initial focus.\n

    \n

    Note:\nSetting this property doesn't set the focus to the associated element: it merely tells the browser to focus to it when the element is inserted in the document. Setting it after the insertion, that is most of the time after the document load, has no visible effect.\n

    " + "doc": "The autofocus property of the HTMLElement interface represents a boolean value reflecting the autofocus HTML global attribute. This indicates whether the element should be focused on page load or, if it is nested inside a <dialog> or popover element, when the <dialog> or popover is shown.\n

    Only one element inside a document, <dialog> element, or popover may have this attribute specified. If applied to multiple elements, the first focusable one will receive focus.\n

    \n

    Note:\nSetting this property doesn't set the focus to the associated element: it merely tells the browser to focus to it when the element is inserted in the document. Setting it after the insertion, that is most of the time after the document load, has no visible effect.\n

    " }, "htmlelement.blur": { "url": "$MDN_URL$/web/api/htmlelement/blur", @@ -19400,7 +19464,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The dataset read-only property\nof the HTMLElement interface provides read/write access to custom data attributes\n(data-*) on elements. It exposes a map of strings\n(DOMStringMap) with an entry for each data-* attribute.\n
    \n

    Note:\nThe dataset property itself can be read, but not directly written.\nInstead, all writes must be to the individual properties within the\ndataset, which in turn represent the data attributes.\n

    \n

    An HTML data-* attribute and its corresponding DOM\ndataset.property modify their shared name according to where\nthey are read or written:\n

    \n
    In HTML
    \n
    \n

    The attribute name begins with data-. It can contain only letters,\nnumbers, dashes (-), periods (.), colons (:),\nand underscores (_). Any ASCII capital letters (A to\nZ) are converted to lowercase.\n

    \n
    In JavaScript
    \n
    \n

    The property name of a custom data attribute is the same as the HTML attribute\nwithout the data- prefix. Single dashes (-) are removed, and the next ASCII\ncharacter after a removed dash is capitalized to form the property's camel-cased name.\n

    \n
    \n

    Details and examples of converting between the HTML and JavaScript forms is described in more detail in the next section.\n

    In addition to the information below, you'll find a how-to guide for using HTML data\nattributes in our article Using data attributes." + "doc": "The dataset read-only property\nof the HTMLElement interface provides read/write access to custom data attributes\n(data-*) on elements. It exposes a map of strings\n(DOMStringMap) with an entry for each data-* attribute.\n

    \n

    Note:\nThe dataset property itself can be read, but not directly written.\nInstead, all writes must be to the individual properties within the\ndataset, which in turn represent the data attributes.\n

    " }, "htmlelement.dir": { "url": "$MDN_URL$/web/api/htmlelement/dir", @@ -19754,7 +19818,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLElement.offsetParent read-only property returns a\nreference to the element which is the closest (nearest in the containment hierarchy)\npositioned ancestor element.\n

    A positioned ancestor might be:\n

    \n

    If there is no positioned ancestor element, the body is returned.\n

    \n

    Note:\noffsetParent returns null in the following\nsituations:\n

      \n
    • The element or any ancestor has the display property set to\nnone.
    • \n
    • The element has the position property set to fixed\n(Firefox returns <body>).
    • \n
    • The element is <body> or <html>.
    • \n
    \n
    \n

    offsetParent is useful because\noffsetTop and\noffsetLeft are relative to its padding edge." + "doc": "The HTMLElement.offsetParent read-only property returns a\nreference to the element which is the closest (nearest in the containment hierarchy)\npositioned ancestor element.\n

    A positioned ancestor might be:\n

    \n

    If there is no positioned ancestor element, the body is returned.\n

    \n

    Note:\noffsetParent returns null in the following\nsituations:\n

      \n
    • The element or any ancestor has the display property set to\nnone.
    • \n
    • The element has the position property set to fixed\n(Firefox returns <body>).
    • \n
    • The element is <body> or <html>.
    • \n
    \n
    \n

    offsetParent is useful because\noffsetTop and\noffsetLeft are relative to its padding edge." }, "htmlelement.offsettop": { "url": "$MDN_URL$/web/api/htmlelement/offsettop", @@ -19864,7 +19928,7 @@ }, "doc": "The showPopover() method of the HTMLElement interface shows a popover element (i.e., one that has a valid popover attribute) by adding it to the top layer.\n

    When showPopover() is called on an element with the popover attribute that is currently hidden, a beforetoggle event will be fired, followed by the popover showing, and then the toggle event firing. If the element is already showing, an error will be thrown.", "parameters": { - "options": "An object that can contain the following properties:\n

    \n
    source Optional
    \n
    \n

    An HTMLElement reference; programmatically defines the invoker of the popover associated with the show action, that is, its control element. Establishing a relationship between a popover and its invoker using the source option has two useful effects:\n

      \n
    • The browser places the popover in a logical position in the keyboard focus navigation order when shown. This makes the popover more accessible to keyboard users (see also Popover accessibility features).
    • \n
    • The browser creates an implicit anchor reference between the two, making it very convenient to position popovers relative to their controls using CSS anchor positioning. See Popover anchor positioning for more details.
    • \n
    \n
    \n
    " + "options": "An object that can contain the following properties:\n
    \n
    source Optional
    \n
    \n

    An HTMLElement reference; programmatically defines the invoker of the popover associated with the show action, that is, its control element. Establishing a relationship between a popover and its invoker using the source option has two useful effects:\n

      \n
    • The browser places the popover in a logical position in the keyboard focus navigation order when shown. This makes the popover more accessible to keyboard users (see also Popover accessibility features).
    • \n
    • The browser creates an implicit anchor reference between the two, making it very convenient to position popovers relative to their controls using CSS anchor positioning. See Popover anchor positioning for more details.
    • \n
    \n
    \n
    " }, "returns": "None (undefined).", "throws": { @@ -19913,7 +19977,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only style property of the HTMLElement returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." + "doc": "The read-only style property of the HTMLElement interface returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." }, "htmlelement.tabindex": { "url": "$MDN_URL$/web/api/htmlelement/tabindex", @@ -19981,7 +20045,7 @@ "doc": "The togglePopover() method of the HTMLElement interface toggles a popover element (i.e., one that has a valid popover attribute) between the hidden and showing states.\n

    When togglePopover() is called on an element with the popover attribute:\n

      \n
    1. A beforetoggle event is fired.
    2. \n
    3. The popover toggles between hidden and showing:\n
        \n
      1. If it was initially showing, it toggles to hidden.
      2. \n
      3. If it was initially hidden, it toggles to showing.
      4. \n
      \n
    4. \n
    5. A toggle event is fired.
    6. \n
    ", "parameters": { "force": "A boolean, which causes togglePopover() to behave like showPopover() or hidePopover(), except that it doesn't throw an exception if the popover is already in the target state.\n", - "options": "An object that can contain the following properties:\n
    \n
    force Optional
    \n
    \n

    A boolean; see the force description above.\n

    \n
    source Optional
    \n
    \n

    An HTMLElement reference; programmatically defines the invoker of the popover associated with the toggle action, that is, its control element. Establishing a relationship between a popover and its invoker using the source option has two useful effects:\n

      \n
    • The browser places the popover in a logical position in the keyboard focus navigation order when shown. This makes the popover more accessible to keyboard users (see also Popover accessibility features).
    • \n
    • The browser creates an implicit anchor reference between the two, making it very convenient to position popovers relative to their controls using CSS anchor positioning. See Popover anchor positioning for more details.
    • \n
    \n
    \n
    " + "options": "An object that can contain the following properties:\n
    \n
    force Optional
    \n
    \n

    A boolean; see the force description above.\n

    \n
    source Optional
    \n
    \n

    An HTMLElement reference; programmatically defines the invoker of the popover associated with the toggle action, that is, its control element. Establishing a relationship between a popover and its invoker using the source option has two useful effects:\n

      \n
    • The browser places the popover in a logical position in the keyboard focus navigation order when shown. This makes the popover more accessible to keyboard users (see also Popover accessibility features).
    • \n
    • The browser creates an implicit anchor reference between the two, making it very convenient to position popovers relative to their controls using CSS anchor positioning. See Popover anchor positioning for more details.
    • \n
    \n
    \n
    " }, "returns": "true if the popup is open after the call, and false otherwise.\n

    None (undefined) may be returned in older browser versions (see browser compatibility)." }, @@ -20302,7 +20366,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLFieldSetElement interface checks if the element is valid, but always returns true because <fieldset> elements are never candidates for constraint validation.\n

    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <fieldset> elements based on the validity of its descendant form controls, not the fieldset itself.\n

    ", + "doc": "The checkValidity() method of the HTMLFieldSetElement interface checks if the element is valid, but always returns true because <fieldset> elements are never candidates for constraint validation.\n
    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <fieldset> elements based on the validity of its descendant form controls, not the fieldset itself.\n

    ", "returns": "A boolean value, true." }, "htmlfieldsetelement.disabled": { @@ -20325,7 +20389,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The disabled property of the HTMLFieldSetElement interface is a boolean value that reflects the <fieldset> element's disabled attribute, which indicates whether the control is disabled.\n

    When disabled, all the form control descendants of the <fieldset> element, excluding elements that are descendants of the <legend> child of the <fieldset>, if any, are disabled. A disabled element is unusable and un-clickable, and match the :disabled selector, even if their disabled property value is false." + "doc": "The disabled property of the HTMLFieldSetElement interface is a boolean value that reflects the <fieldset> element's disabled attribute, which indicates whether the control is disabled.\n

    When disabled, all the form control descendants of the <fieldset> element, excluding elements that are descendants of the <legend> child of the <fieldset>, if any, are disabled. A disabled element is unusable and un-clickable, and match the :disabled selector, even if their disabled property value is false." }, "htmlfieldsetelement.elements": { "url": "$MDN_URL$/web/api/htmlfieldsetelement/elements", @@ -20506,7 +20570,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The validity read-only property of the HTMLFieldSetElement interface returns a ValidityState object that represents the validity states this element is in. Although <fieldset> elements are never candidates for constraint validation, the validity state may still be invalid if a custom validity message has been set.\n

    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <fieldset> elements based on the validity of its descendant form controls, not the fieldset itself.\n

    " + "doc": "The validity read-only property of the HTMLFieldSetElement interface returns a ValidityState object that represents the validity states this element is in. Although <fieldset> elements are never candidates for constraint validation, the validity state may still be invalid if a custom validity message has been set.\n
    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <fieldset> elements based on the validity of its descendant form controls, not the fieldset itself.\n

    " }, "htmlfieldsetelement.willvalidate": { "url": "$MDN_URL$/web/api/htmlfieldsetelement/willvalidate", @@ -20564,7 +20628,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The obsolete\nHTMLFontElement.color\nproperty is a string that reflects the color HTML attribute, containing either a named color or a color specified in the\nhexadecimal #RRGGBB format.\n

    The format of the string must follow one of the following HTML microsyntaxes (see <color>):\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    MicrosyntaxDescriptionExamples
    Valid name color stringnameOfColor (case insensitive)Green, green, GREEN
    Valid hex color string#RRGGBB#008000
    RGB using decimal valuesrgb(x x x) (x in 0-255 range)rgb(0 128 0)
    " + "doc": "

    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.

    \n

    The obsolete\nHTMLFontElement.color\nproperty is a string that reflects the color HTML attribute, containing either a named color or a color specified in the\nhexadecimal #RRGGBB format.\n

    The format of the string must follow one of the following HTML microsyntaxes (see <color>):\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    MicrosyntaxDescriptionExamples
    Valid name color stringnameOfColor (case insensitive)Green, green, GREEN
    Valid hex color string#RRGGBB#008000
    RGB using decimal valuesrgb(x x x) (x in 0-255 range)rgb(0 128 0)
    " }, "htmlfontelement.face": { "url": "$MDN_URL$/web/api/htmlfontelement/face", @@ -20648,7 +20712,7 @@ "parameters": { "name": "A string which will be used to match against the name or id attributes of the controls in this HTMLFormControlsCollection object." }, - "returns": "" + "returns": "\n
    \n

    Note:\nThe returned RadioNodeList is live, meaning that its contents automatically update if elements that match the given name are added to or removed from the collection. Furthermore, it may contain non-radio input elements despite the collection's name.\n

    " }, "htmlformelement": { "url": "$MDN_URL$/web/api/htmlformelement", @@ -20758,7 +20822,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLFormElement interface returns a boolean value which indicates if all associated controls meet any constraint validation rules applied to them. The method also fires an invalid event on each invalid element, but not on the form element itself. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n
    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <form> elements based on the validity of its owned form controls, not the validity of the <form> element itself.\n

    ", + "doc": "The checkValidity() method of the HTMLFormElement interface returns a boolean value which indicates if all associated controls meet any constraint validation rules applied to them. The method also fires an invalid event on each invalid element, but not on the form element itself. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n
    \n

    Note:\nThe :valid and :invalid CSS pseudo-classes are applied to <form> elements based on the validity of its owned form controls, not the validity of the <form> element itself.\n

    ", "returns": "Returns true if the associated controls' values have no validity problems; otherwise, returns false." }, "htmlformelement.elements": { @@ -20957,7 +21021,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "The relList read-only property of the HTMLFormElement interface reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <form> element and the current document.\n

    The property itself is read-only, meaning you can not reassign the property with another DOMTokenList, but the content of the returned list can be changed.\n

    To retrieve a string containing the values as space-separated tokens, use HTMLFormElement.rel. The rel property can also be used to set the rel attribute value." + "doc": "The read-only relList property of the HTMLFormElement returns a live DOMTokenList object containing the set of link types indicating the relationship between the resource represented by the <form> element and the current document. It reflects the <form> element's rel content attribute." }, "htmlformelement.reportvalidity": { "url": "$MDN_URL$/web/api/htmlformelement/reportvalidity", @@ -21283,7 +21347,7 @@ "htmliframeelement.browsingtopics": { "url": "$MDN_URL$/web/api/htmliframeelement/browsingtopics", "status": [ - "Experimental" + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -21291,10 +21355,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n
    \n

    Warning:\nThis feature is currently opposed by two browser vendors. See the Standards positions section for details of opposition.\n

    \n

    The browsingTopics property of the HTMLIFrameElement interface is a boolean specifying that the selected topics for the current user should be sent with the request for the associated <iframe>'s source in a Sec-Browsing-Topics header. This reflects the browsingtopics HTML attribute.\n

    See Using the Topics API for more details." + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    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.

    \n
    \n

    Warning:\nThis feature is currently opposed by two browser vendors. See the Standards positions section for details of opposition.\n

    \n

    The browsingTopics property of the HTMLIFrameElement interface is a boolean specifying that the selected topics for the current user should be sent with the request for the associated <iframe>'s source in a Sec-Browsing-Topics header. This reflects the browsingtopics HTML attribute.\n

    See Using the Topics API for more details." }, "htmliframeelement.contentdocument": { "url": "$MDN_URL$/web/api/htmliframeelement/contentdocument", @@ -21316,7 +21377,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "If the iframe and the iframe's parent document are Same Origin, returns a Document (that is, the active document in the inline frame's nested browsing context), else returns null." + "doc": "If the iframe and the iframe's parent document are Same Origin, returns a Document (that is, the active document in the inline frame's nested browsing context), else returns null." }, "htmliframeelement.contentwindow": { "url": "$MDN_URL$/web/api/htmliframeelement/contentwindow", @@ -21355,7 +21416,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The credentialless property of the HTMLIFrameElement interface indicates whether the <iframe> is credentialless, meaning that documents inside will be loaded using new, ephemeral contexts.\n

    Those contexts do not have access to their network, cookies and storage data associated with their origin. Instead, they use new ones, local to the top-level document lifetime. It means any data stored won't be accessible anymore after the user navigates away from the page or reloads it.\n

    In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not. See IFrame credentialless for a deeper explanation." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The credentialless property of the HTMLIFrameElement interface indicates whether the <iframe> is credentialless, meaning that documents inside will be loaded using new, ephemeral contexts.\n

    Those contexts do not have access to their network, cookies and storage data associated with their origin. Instead, they use new ones, local to the top-level document lifetime. It means any data stored won't be accessible anymore after the user navigates away from the page or reloads it.\n

    In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not. See IFrame credentialless for a deeper explanation." }, "htmliframeelement.csp": { "url": "$MDN_URL$/web/api/htmliframeelement/csp", @@ -21476,6 +21537,20 @@ }, "doc": "The name property of the HTMLIFrameElement interface is a string value that reflects the name attribute of the <iframe> element, indicating the specific name of the <iframe> element." }, + "htmliframeelement.privatetoken": { + "url": "$MDN_URL$/web/api/htmliframeelement/privatetoken", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", + "Opera": "103" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The privateToken property of the HTMLIFrameElement interface returns a string representation of an options object representing a private state token operation; this object has the same structure as the RequestInit dictionary's privateToken property.\n

    This attribute mirrors the content of the associated <iframe> element's privateToken attribute." + }, "htmliframeelement.referrerpolicy": { "url": "$MDN_URL$/web/api/htmliframeelement/referrerpolicy", "status": [ @@ -21518,7 +21593,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The sandbox read-only property of the HTMLIFrameElement interface returns a DOMTokenList indicating extra restrictions on the behavior of the nested content.\n

    It reflects the sandbox attribute of the <iframe> element." + "doc": "The read-only sandbox property of the HTMLIFrameElement returns a live DOMTokenList object indicating extra restrictions on the behavior of the nested content. It reflects the <iframe> element's sandbox content attribute." }, "htmliframeelement.src": { "url": "$MDN_URL$/web/api/htmliframeelement/src", @@ -21562,7 +21637,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the frame's DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The srcdoc property of the HTMLIFrameElement interface gets or sets the inline HTML markup of the frame's document.\n

    This reflects the srcdoc attribute of the <iframe>.", + "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the frame's DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The srcdoc property of the HTMLIFrameElement interface gets or sets the inline HTML markup of the frame's document.\n

    This reflects the srcdoc attribute of the <iframe>.", "throws": { "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." } @@ -21627,7 +21702,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The obsolete align\nproperty of the HTMLImageElement interface is a string which indicates\nhow to position the image relative to its container.\n

    You should instead use the\nCSS property vertical-align, which does in fact also work on images\ndespite its name. You can also use the float property to float the image\nto the left or right margin.\n

    The align property reflects the HTML align\ncontent attribute." + "doc": "

    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.

    \n

    The deprecated align property of the HTMLImageElement interface is a string which indicates how to position the image relative to its container. It reflects the <img> element's align content attribute.\n

    You should instead use the CSS property vertical-align, which does in fact also work on images despite its name. You can also use the float property to float the image to the left or right margin." }, "htmlimageelement.alt": { "url": "$MDN_URL$/web/api/htmlimageelement/alt", @@ -21649,13 +21724,13 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement property alt provides fallback (alternate) text to display when the image specified by the <img> element is not loaded.\n

    This may be the case because of an error, because the user has disabled the loading of images, or because the image hasn't finished loading yet.\n

    Perhaps the most important reason to use the alt property is to support accessibility, as the alt text may be used by screen readers and other assistive technologies to help people with a disability make full use of your content.\nIt will be read aloud or sent to a braille output device, for example, to support blind or visually impaired users.\n

    \n

    Think of it like this: When choosing alt strings for your images, imagine what you would say when reading the page to someone over the phone without mentioning that there's an image on the page.\n

    \n

    The alternate text is displayed in the space the image would occupy and should be able to take the place of the image without altering the meaning of the page." + "doc": "The alt property of the HTMLImageElement interface provides fallback (alternate) text to display when the image specified by the <img> element is not displayed, whether because of an error, because the user has disabled the loading of images, or because the image hasn't finished loading yet. It reflects the <img> element's alt content attribute.\n

    There are important accessibility implications of providing appropriate alt text, and the requirements may differ based on the purpose of the image. See the HTML <img> reference for more information." }, "htmlimageelement.attributionsrc": { "url": "$MDN_URL$/web/api/htmlimageelement/attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -21663,10 +21738,7 @@ "Edge": "125", "Opera": "111" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The\nattributionSrc property of the HTMLImageElement interface gets and sets the attributionsrc attribute on an <img> element programmatically, reflecting the value of that attribute. attributionsrc specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the image request.\n

    On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register an image-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    The source/trigger is registered once the browser receives the response containing the image file.\n

    \n

    Note:\nBear in mind that users might not necessarily be able to perceive the image at all — it might be a 1x1 transparent tracking pixel that is only being used for attribution reporting.\n

    \n

    See the Attribution Reporting API for more details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    The attributionSrc property of the HTMLImageElement interface that you want the browser to send an Attribution-Reporting-Eligible header along with the image request. It reflects the <img> element's attributionsrc content attribute.\n

    See the Attribution Reporting API for more details." }, "htmlimageelement.border": { "url": "$MDN_URL$/web/api/htmlimageelement/border", @@ -21684,7 +21756,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The obsolete HTMLImageElement\nproperty border specifies the number of pixels thick the\nborder surrounding the image should be. A value of 0, the default, indicates that no\nborder should be drawn.\n

    You should not use this property! Instead, you should use CSS to style the\nborder. The border property or its longhand properties to not only set\nthe thickness of the border but to potentially apply a wide variety of other styling\noptions to it.\n

    The width, specifically, is controlled using the writing-mode aware\nborder-block-start-width, border-block-end-width,\nborder-inline-start-width, and border-inline-end-width\nproperties.\n

    For compatibility (or perhaps other) reasons, you can use the older properties instead\n(or in addition): border-top-width, border-right-width,\nborder-bottom-width, and border-left-width." + "doc": "

    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.

    \n

    The deprecated border property of the HTMLImageElement interface specifies the number of pixels thick the border surrounding the image should be. A value of 0, the default, indicates that no border should be drawn. It reflects the <img> element's border content attribute.\n

    You should instead use the CSS property border or its longhand properties to not only set the thickness of the border but also to potentially apply a wide variety of other styling options to it." }, "htmlimageelement.complete": { "url": "$MDN_URL$/web/api/htmlimageelement/complete", @@ -21706,7 +21778,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only HTMLImageElement interface's\ncomplete attribute is a Boolean value which indicates\nwhether or not the image has completely loaded." + "doc": "The complete read-only property of the HTMLImageElement interface is a Boolean value indicating whether or not the image has completely loaded." }, "htmlimageelement.crossorigin": { "url": "$MDN_URL$/web/api/htmlimageelement/crossorigin", @@ -21728,7 +21800,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement\ninterface's crossOrigin attribute is a string which\nspecifies the Cross-Origin Resource Sharing (CORS) setting to use when\nretrieving the image." + "doc": "The crossOrigin property of the HTMLImageElement interface is a string which specifies the Cross-Origin Resource Sharing (CORS) setting to use when retrieving the image. It reflects the <img> element's crossorigin content attribute." }, "htmlimageelement.currentsrc": { "url": "$MDN_URL$/web/api/htmlimageelement/currentsrc", @@ -21745,7 +21817,7 @@ "Safari": "9.1", "SafariIOS": "9.3" }, - "doc": "The read-only HTMLImageElement property\ncurrentSrc indicates the URL of the image which is\ncurrently presented in the <img> element it represents." + "doc": "The currentSrc read-only property of the HTMLImageElement interface indicates the URL of the image selected by the browser to load." }, "htmlimageelement.decode": { "url": "$MDN_URL$/web/api/htmlimageelement/decode", @@ -21767,10 +21839,10 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The decode()\nmethod of the HTMLImageElement interface returns a\nPromise that resolves once the image is decoded and it is safe to append\nit to the DOM.\n

    This can be used to initiate loading of the image prior\nto attaching it to an element in the DOM (or adding it to the DOM as a new element), so\nthat the image can be rendered immediately upon being added to the DOM. This, in turn,\nprevents the rendering of the next frame after adding the image to the DOM from causing\na delay while the image loads.", + "doc": "The decode() method of the HTMLImageElement interface returns a Promise that resolves once the image is decoded and is safe to be appended to the DOM.\n

    This can be used to initiate loading of the image prior to attaching it to an element in the DOM (or adding it to the DOM as a new element), so that the image can be rendered immediately upon being added to the DOM. This, in turn, prevents the rendering of the next frame after adding the image to the DOM from causing a delay while the image loads.", "returns": "A Promise that fulfills with undefined once the image data is ready to be used.", "throws": { - "EncodingError": "A DOMException indicating that an error occurred while decoding the\nimage." + "EncodingError DOMException": "An error occurred while decoding the image. This can happen if:\n

    " } }, "htmlimageelement.decoding": { @@ -21793,7 +21865,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The decoding property of the HTMLImageElement interface provides a hint to the browser as to how it should decode the image. More specifically, whether it should wait for the image to be decoded before presenting other content updates or not." + "doc": "The decoding property of the HTMLImageElement interface provides a hint to the browser as to how it should decode the image. More specifically, whether it should wait for the image to be decoded before presenting other content updates or not. It reflects the <img> element's decoding content attribute." }, "htmlimageelement.fetchpriority": { "url": "$MDN_URL$/web/api/htmlimageelement/fetchpriority", @@ -21814,7 +21886,7 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "The fetchPriority property of the HTMLImageElement interface represents a hint to the browser indicating how it should prioritize fetching a particular image relative to other images.\nIt reflects the fetchpriority attribute of the corresponding <img> element.\n

    The property allows a developer to signal that fetching a particular image early in the loading process has more or less impact on user experience than a browser can reasonably infer when assigning an internal priority.\nThis in turn allows the browser to increase or decrease the priority, and potentially load the image earlier or later than it would otherwise.\nThe property should be used sparingly, as excessive or incorrect prioritization can degrade performance.\n

    The fetch priority can be used to complement preloading, allowing a developer to boost the priority ahead of less-impactful resources that have a higher default priority.\nFor example, if a developer knows that a particular image significantly contributes to the website's Largest Contentful Paint (LCP) they could add <link rel=\"preload\"> for the image and then further boost the priority using the fetchpriority property.\n

    Note that both the internal priority of any fetch operation, and the impact of fetchPriority on the priority, are entirely browser dependent." + "doc": "The fetchPriority property of the HTMLImageElement interface represents a hint to the browser indicating how it should prioritize fetching a particular image relative to other images. It reflects the <img> element's fetchpriority content attribute." }, "htmlimageelement.height": { "url": "$MDN_URL$/web/api/htmlimageelement/height", @@ -21836,7 +21908,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height property of the\nHTMLImageElement interface indicates the height at which the image is\ndrawn, in CSS pixels if the image is being drawn or rendered to any\nvisual medium such as the screen or a printer; otherwise, it's the natural, pixel\ndensity corrected height of the image." + "doc": "The height property of the HTMLImageElement interface indicates the height at which the image is drawn, in CSS pixels, if the image is being drawn or rendered to any visual medium such as a screen or printer. Otherwise, it's the natural, pixel density-corrected height of the image." }, "htmlimageelement.hspace": { "url": "$MDN_URL$/web/api/htmlimageelement/hspace", @@ -21854,7 +21926,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The\nobsolete hspace property of the\nHTMLImageElement interface specifies the number of pixels of empty\nspace to leave empty on the left and right sides of the <img> element\nwhen laying out the page.\n

    This property reflects the HTML hspace\nattribute." + "doc": "

    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.

    \n

    The deprecated hspace property of the HTMLImageElement interface specifies the number of pixels of empty space to leave empty on the left and right sides of the <img> element when laying out the page. It reflects the <img> element's hspace content attribute.\n

    You should instead use the CSS property margin or its longhand properties to establish margin space around an image." }, "htmlimageelement.image": { "url": "$MDN_URL$/web/api/htmlimageelement/image", @@ -21876,7 +21948,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Image()\nconstructor creates a new HTMLImageElement instance. It is functionally\nequivalent to document.createElement('img').\n

    \n

    Note:\nThis function should not be confused with the CSS image() function.\n

    ", + "doc": "The Image()\nconstructor creates a new HTMLImageElement instance. It is functionally\nequivalent to document.createElement('img').\n
    \n

    Note:\nThis function should not be confused with the CSS image() function.\n

    ", "parameters": { "width": "The width of the image (i.e., the value for the width\nattribute).", "height": "The height of the image (i.e., the value for the height\nattribute)." @@ -21902,7 +21974,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement property isMap is a\nBoolean value which indicates that the image is to be used by a server-side image map.\nThis may only be used on images located within an <a> element.\n
    \n

    Note:\nFor accessibility reasons, you should generally avoid using\nserver-side image maps, as they require the use of a mouse. Use a client-side image map instead.\n

    " + "doc": "The isMap property of the HTMLImageElement interface indicates that the image is part of a server-side map. If so, the coordinates where the user clicked on the image are sent to the server. It reflects the <img> element's ismap content attribute. This attribute is allowed only if the <img> element is a descendant of an <a> element with a valid href attribute.\n
    \n

    Note:\nFor accessibility reasons, you should generally avoid using server-side image maps, as they require the use of a mouse. Use a client-side image map instead.\n

    " }, "htmlimageelement.loading": { "url": "$MDN_URL$/web/api/htmlimageelement/loading", @@ -21924,7 +21996,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The HTMLImageElement property loading is a string whose value provides a hint to the user agent on how to handle the loading of the image which is currently outside the window's visual viewport.\n

    This helps to optimize the loading of the document's contents by postponing loading the image until it's expected to be needed, rather than immediately during the initial page load." + "doc": "The loading property of the HTMLImageElement interface provides a hint to the user agent on how to handle the loading of the image which is currently outside the window's visual viewport. This helps to optimize the loading of the document's contents by postponing loading the image until it's expected to be needed, rather than immediately during the initial page load. It reflects the <img> element's loading content attribute." }, "htmlimageelement.longdesc": { "url": "$MDN_URL$/web/api/htmlimageelement/longdesc", @@ -21942,7 +22014,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The deprecated property longDesc on\nthe HTMLImageElement interface specifies the URL of a text or HTML file\nwhich contains a long-form description of the image. This can be used to\nprovide optional added details beyond the short description provided in the\ntitle attribute." + "doc": "

    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.

    \n

    The deprecated longDesc property of the HTMLImageElement interface specifies the URL of a text or HTML file which contains a long-form description of the image. This can be used to provide optional added details beyond the short description provided in the title attribute. It reflects the <img> element's longdesc content attribute.\n

    This attribute is considered obsolete in the HTML spec. It has an uncertain future; authors should use a WAI-ARIA alternative such as aria-describedby or aria-details. You can also encapsulate the image within a link using the <a> element." }, "htmlimageelement.name": { "url": "$MDN_URL$/web/api/htmlimageelement/name", @@ -21960,7 +22032,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The HTMLImageElement\ninterface's deprecated name property specifies\na name for the element. This has been replaced by the id\nproperty available on all elements." + "doc": "

    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.

    \n

    The deprecated name property of the HTMLImageElement interface specifies a name for the element. It reflects the <img> element's name content attribute. It has been replaced by the id property available on all elements, and is kept only for compatibility reasons." }, "htmlimageelement.naturalheight": { "url": "$MDN_URL$/web/api/htmlimageelement/naturalheight", @@ -21982,7 +22054,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement interface's\nnaturalHeight property is a read-only value which\nreturns the intrinsic (natural), density-corrected height of the image in\nCSS pixels.\n

    This is the height the image is if\ndrawn with nothing constraining its height; if you don't specify a height for the image,\nor place the image inside a container that either limits or expressly specifies the\nimage height, it will be rendered this tall.\n

    \n

    Note:\nMost of the time the natural height is the actual height of the image sent by the server.\nNevertheless, browsers can modify an image before pushing it to the renderer. For example, Chrome\ndegrades the resolution of images on low-end devices. In such cases, naturalHeight will consider the height of the image modified\nby such browser interventions as the natural height, and returns this value.\n

    " + "doc": "The read-only naturalHeight property of the HTMLImageElement interface returns the intrinsic (natural), density-corrected height of the image in CSS pixels.\n

    This is the height the image is if drawn with nothing constraining its height; if you neither specify a height for the image nor place the image inside a container that limits or expressly specifies the image height, it will be rendered this tall.\n

    \n

    Note:\nMost of the time the natural height is the actual height of the image sent by the server. Nevertheless, browsers can modify an image before pushing it to the renderer. For example, Chrome degrades the resolution of images on low-end devices. In such cases, naturalHeight will consider the height of the image modified by such browser interventions as the natural height, and returns this value.\n

    " }, "htmlimageelement.naturalwidth": { "url": "$MDN_URL$/web/api/htmlimageelement/naturalwidth", @@ -22004,7 +22076,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement interface's read-only\nnaturalWidth property returns the intrinsic (natural),\ndensity-corrected width of the image in CSS pixels.\n

    This is the width the image is if drawn with nothing constraining\nits width; if you neither specify a width for the image nor place the image inside a\ncontainer that limits or expressly specifies the image width, this is the number of CSS\npixels wide the image will be.\n

    The corresponding naturalHeight method\nreturns the natural height of the image.\n

    \n

    Note:\nMost of the time the natural width is the actual width of the image sent by the server.\nNevertheless, browsers can modify an image before pushing it to the renderer. For example, Chrome\ndegrades the resolution of images on low-end devices. In such cases, naturalWidth will consider the width of the image modified\nby such browser interventions as the natural width, and returns this value.\n

    " + "doc": "The read-only naturalWidth property of the HTMLImageElement interface returns the intrinsic (natural), density-corrected width of the image in CSS pixels.\n

    This is the width the image is if drawn with nothing constraining its width; if you neither specify a width for the image nor place the image inside a container that limits or expressly specifies the image width, it will be rendered this wide.\n

    \n

    Note:\nMost of the time the natural width is the actual width of the image sent by the server. Nevertheless, browsers can modify an image before pushing it to the renderer. For example, Chrome degrades the resolution of images on low-end devices. In such cases, naturalWidth will consider the width of the image modified by such browser interventions as the natural width, and returns this value.\n

    " }, "htmlimageelement.referrerpolicy": { "url": "$MDN_URL$/web/api/htmlimageelement/referrerpolicy", @@ -22026,7 +22098,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The\nHTMLImageElement.referrerPolicy\nproperty reflects the HTML referrerpolicy attribute of the\n<img> element defining which referrer is sent when fetching the\nresource." + "doc": "The referrerPolicy property of the HTMLImageElement interface defining which referrer is sent when fetching the resource. It reflects the <img> element's referrerpolicy content attribute." }, "htmlimageelement.sizes": { "url": "$MDN_URL$/web/api/htmlimageelement/sizes", @@ -22048,7 +22120,7 @@ "lowDate": "2016-03-21", "highDate": "2018-09-21" }, - "doc": "The HTMLImageElement property\nsizes allows you to specify the layout width of the\nimage for each of a list of media conditions. This provides the ability to\nautomatically select among different images—even images of different orientations or\naspect ratios—as the document state changes to match different media\nconditions.\n

    Each condition is specified using the same conditional format used\nby media queries." + "doc": "The sizes property of the HTMLImageElement interface allows you to specify the layout width of the image for each of a list of media queries. This provides the ability to automatically select among different images—even images of different orientations or aspect ratios—as the document state changes to match different media conditions. It reflects the <img> element's sizes content attribute." }, "htmlimageelement.sizes.sizes": { "url": "$MDN_URL$/web/api/htmlimageelement/sizes", @@ -22070,7 +22142,7 @@ "lowDate": "2016-03-21", "highDate": "2018-09-21" }, - "doc": "The HTMLImageElement property\nsizes allows you to specify the layout width of the\nimage for each of a list of media conditions. This provides the ability to\nautomatically select among different images—even images of different orientations or\naspect ratios—as the document state changes to match different media\nconditions.\n

    Each condition is specified using the same conditional format used\nby media queries." + "doc": "The sizes property of the HTMLImageElement interface allows you to specify the layout width of the image for each of a list of media queries. This provides the ability to automatically select among different images—even images of different orientations or aspect ratios—as the document state changes to match different media conditions. It reflects the <img> element's sizes content attribute." }, "htmlimageelement.src": { "url": "$MDN_URL$/web/api/htmlimageelement/src", @@ -22092,7 +22164,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement property\nsrc, which reflects the HTML src attribute, specifies the image to display in the <img>\nelement." + "doc": "The src property of the HTMLImageElement interface specifies the image to display in the <img> element. It reflects the <img> element's src content attribute." }, "htmlimageelement.srcset": { "url": "$MDN_URL$/web/api/htmlimageelement/srcset", @@ -22114,7 +22186,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The HTMLImageElement property\nsrcset is a string which identifies one or more\nimage candidate strings, separated using commas (,) each\nspecifying image resources to use under given circumstances.\n

    Each image\ncandidate string contains an image URL and an optional width or pixel density descriptor\nthat indicates the conditions under which that candidate should be used instead of the\nimage specified by the src property.\n

    The srcset property, along with the sizes\nproperty, are a crucial component in designing responsive websites, as they\ncan be used together to make pages that use appropriate images for the rendering\nsituation.\n

    \n

    Note:\nIf the srcset attribute uses width descriptors, the sizes attribute must also be present, or the srcset itself will be ignored.\n

    " + "doc": "The srcset property of the HTMLImageElement interface identifies one or more image candidate strings, separated using commas (,), each specifying image resources to use under given circumstances. Each image candidate string contains an image URL and an optional width or pixel density descriptor that indicates the conditions under which that candidate should be used instead of the image specified by the src property. It reflects the <img> element's srcset content attribute.\n

    The srcset property, along with the sizes property, are a crucial component in designing responsive websites, as they can be used together to make pages that use appropriate images for the rendering situation." }, "htmlimageelement.usemap": { "url": "$MDN_URL$/web/api/htmlimageelement/usemap", @@ -22136,7 +22208,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The useMap property on the\nHTMLImageElement interface reflects the value of the\nHTML usemap attribute, which is a string\nproviding the name of the client-side image map to apply to the image." + "doc": "The useMap property of the HTMLImageElement interface providing the name of the client-side image map to apply to the image. It reflects the <img> element's usemap content attribute." }, "htmlimageelement.vspace": { "url": "$MDN_URL$/web/api/htmlimageelement/vspace", @@ -22154,7 +22226,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The obsolete vspace property of the\nHTMLImageElement interface specifies the number of pixels of empty space\nto leave empty on the top and bottom of the <img> element when laying\nout the page." + "doc": "

    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.

    \n

    The deprecated vspace property of the HTMLImageElement interface specifies the number of pixels of empty space to leave empty on the top and bottom sides of the <img> element when laying out the page. It reflects the <img> element's vspace content attribute.\n

    You should instead use the CSS property margin or its longhand properties to establish margin space around an image." }, "htmlimageelement.width": { "url": "$MDN_URL$/web/api/htmlimageelement/width", @@ -22176,7 +22248,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width property of the\nHTMLImageElement interface indicates the width at which an image is\ndrawn in CSS pixels if it's being drawn or rendered to\nany visual medium such as a screen or printer. Otherwise, it's the natural, pixel\ndensity-corrected width of the image." + "doc": "The width property of the HTMLImageElement interface indicates the width at which the image is drawn, in CSS pixels, if the image is being drawn or rendered to any visual medium such as a screen or printer. Otherwise, it's the natural, pixel density-corrected width of the image." }, "htmlimageelement.x": { "url": "$MDN_URL$/web/api/htmlimageelement/x", @@ -22198,7 +22270,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only HTMLImageElement property\nx indicates the x-coordinate of the\n<img> element's left border edge relative to the root element's\norigin.\n

    The x and y properties are only valid\nfor an image if its display property has the computed value\ntable-column or table-column-group. In other words: it has\neither of those values set explicitly on it, or it has inherited it from a containing\nelement, or by being located within a column described by either <col>\nor <colgroup>." + "doc": "The read-only x property of the HTMLImageElement interface indicates the x-coordinate of the <img> element's left border edge relative to the root element's origin.\n

    The x and y properties are only valid for an image if its display property has the computed value table-column or table-column-group. In other words: it has either of those values set explicitly on it, or it has inherited it from a containing element, or by being located within a column described by either <col> or <colgroup>." }, "htmlimageelement.y": { "url": "$MDN_URL$/web/api/htmlimageelement/y", @@ -22220,7 +22292,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only HTMLImageElement property\ny indicates the y-coordinate of the\n<img> element's top border edge relative to the root element's\norigin.\n

    The x and y properties are only valid\nfor an image if its display property has the computed value\ntable-column or table-column-group. In other words: it has\neither of those values set explicitly on it, or it has inherited it from a containing\nelement, or by being located within a column described by either\n<col> or <colgroup>." + "doc": "The read-only y property of the HTMLImageElement interface indicates the y-coordinate of the <img> element's top border edge relative to the root element's origin.\n

    The x and y properties are only valid for an image if its display property has the computed value table-column or table-column-group. In other words: it has either of those values set explicitly on it, or it has inherited it from a containing element, or by being located within a column described by either <col> or <colgroup>." }, "htmlinputelement": { "url": "$MDN_URL$/web/api/htmlinputelement", @@ -22382,7 +22454,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLInputElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n

    \n

    Note:\nAn HTML <input> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLInputElement.setCustomValidity() method to set the HTMLInputElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", + "doc": "The checkValidity() method of the HTMLInputElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n
    \n

    Note:\nAn HTML <input> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLInputElement.setCustomValidity() method to set the HTMLInputElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", "returns": "Returns true if the element's value has no validity problems; otherwise, returns false." }, "htmlinputelement.colorspace": { @@ -22945,7 +23017,7 @@ "level": "LOW", "lowDate": "2024-04-16" }, - "doc": "The popoverTargetElement property of the HTMLInputElement interface gets and sets the popover element to control via an <input> element of type=\"button\".\n

    It is the JavaScript equivalent of the popovertarget HTML attribute.\n

    Establishing a relationship between a popover and its invoker button using the popoverTargetElement property has two additional useful effects:\n

    " + "doc": "The popoverTargetElement property of the HTMLInputElement interface gets and sets the popover element to control via an <input> element of type=\"button\".\n

    It is the JavaScript equivalent of the popovertarget HTML attribute.\n

    Establishing a relationship between a popover and its invoker button using the popoverTargetElement property has two additional useful effects:\n

    " }, "htmlinputelement.readonly": { "url": "$MDN_URL$/web/api/htmlinputelement/readonly", @@ -23079,7 +23151,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The selectionEnd property of the HTMLInputElement interface is a number that represents the end index of the selected text. When there is no selection, this returns the offset of the character immediately following the current text input cursor position.\n
    \n

    Note:\nAccording to the WHATWG forms spec selectionEnd property applies only to inputs of types text, search, URL, tel, and password. In modern browsers, throws an exception while setting selectionEnd property on the rest of input types. Additionally, this property returns null while accessing selectionEnd property on non-text input elements.\n

    \n

    If selectionEnd is less than selectionStart, then both are\ntreated as the value of selectionEnd." + "doc": "The selectionEnd property of the HTMLInputElement interface is a number that represents the end index of the selected text. That is, it represents the index of the character immediately following the selection. Likewise, when there is no selection, this returns the offset of the character immediately following the current text input cursor position.\n

    \n

    Note:\nAccording to the WHATWG forms spec selectionEnd property applies only to inputs of types text, search, URL, tel, and password. In modern browsers, throws an exception while setting selectionEnd property on the rest of input types. Additionally, this property returns null while accessing selectionEnd property on non-text input elements.\n

    \n

    If selectionEnd is less than selectionStart, then both are\ntreated as the value of selectionEnd." }, "htmlinputelement.selectionstart": { "url": "$MDN_URL$/web/api/htmlinputelement/selectionstart", @@ -23477,6 +23549,10 @@ "Safari": "11.1", "SafariIOS": "18.4" }, + "baseline": { + "level": "LOW", + "lowDate": "2025-08-19" + }, "doc": "The webkitdirectory property of the HTMLInputElement interface reflects the webkitdirectory HTML attribute, which indicates that <input type=\"file\"> elements can only select directories instead of files.\n

    When a directory is selected, the directory and its entire hierarchy of contents are included in the set of selected items.\nThe selected file system entries can be obtained using the webkitEntries property.\n

    \n

    Note:\nThis property is called webkitdirectory in the specification due to its origins as a Google Chrome-specific API.\n

    " }, "htmlinputelement.webkitentries": { @@ -23493,6 +23569,9 @@ "Safari": "11.1", "SafariIOS": "11.3" }, + "baseline": { + "level": "NONE" + }, "doc": "The read-only webkitEntries\nproperty of the HTMLInputElement interface contains an array of file\nsystem entries (as objects based on FileSystemEntry) representing files\nand/or directories selected by the user using an <input> element of\ntype file, but only if that selection was made using drag-and-drop:\nselecting a file in the dialog will leave the property empty.\n

    The array can only contain directories if the\nwebkitdirectory property is\ntrue. This means the <input> element was configured to\nlet the user choose directories.\n

    \n

    Note:\nThis property is called webkitEntries in the specification due to its\norigins as a Google Chrome-specific API. It's likely to be renamed someday.\n

    " }, "htmlinputelement.width": { @@ -23515,7 +23594,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width property of the HTMLInputElement interface specifies the width of a control. It reflects the <input> element's width attribute.\n

    The width property is valid for the image type only. It defines the preferred horizontal size of the image button, in pixels. The property value is the width of the content-box of the rendered button. CSS box model properties impacting the size of the control take precedence.\n

    If no width is set and no CSS width properties impact the control, the width will be the intrinsic width of the image. If the image didn't load, the value will be the maximum intrinsic width of the alt text. The width will be 0 if the width is not known; if no width is set, no CSS dimensions apply, no image loaded, and either the value of the alt is the empty string or no src is set." + "doc": "The width property of the HTMLInputElement interface specifies the width of a control. It reflects the <input> element's width attribute.\n

    The width property is valid for the image type only. It defines the preferred horizontal size of the image button, in pixels. The property value is the width of the content-box of the rendered button. CSS box model properties impacting the size of the control take precedence.\n

    If no width is set and no CSS width properties impact the control, the width will be the intrinsic width of the image. If the image didn't load, the value will be the maximum intrinsic width of the alt text. The width will be 0 if the width is not known; if no width is set, no CSS dimensions apply, no image loaded, and either the value of the alt is the empty string or no src is set." }, "htmlinputelement.willvalidate": { "url": "$MDN_URL$/web/api/htmlinputelement/willvalidate", @@ -23775,7 +23854,7 @@ "baseline": { "level": "NONE" }, - "doc": "The blocking property of the HTMLLinkElement interface is a string indicating that certain operations should be blocked on the fetching of an external resource.\n

    It reflects the blocking attribute of the <link> element." + "doc": "The read-only blocking property of the HTMLLinkElement returns a live DOMTokenList object containing the operations that should be blocked on the fetching of an external resource. It reflects the <link> element's blocking content attribute." }, "htmllinkelement.crossorigin": { "url": "$MDN_URL$/web/api/htmllinkelement/crossorigin", @@ -23840,7 +23919,7 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "The fetchPriority property of the HTMLLinkElement interface represents a hint to the browser indicating how it should prioritize fetching a particular resource relative to other resources of the same type.\nIt reflects the fetchpriority attribute of the corresponding <link> element.\n

    The property allows a developer to signal that fetching a particular resource early in the loading process has more or less impact on user experience than a browser can reasonably infer when assigning an internal priority, in particular when preloading resources.\nThis in turn allows the browser to increase or decrease the priority, and potentially load the resource earlier or later than it would otherwise.\nThe property should be used sparingly, as excessive or incorrect prioritization can degrade performance.\n

    The fetch priority can be used to complement preloading, allowing a developer to boost the priority of a resource ahead of less-impactful resources that are by default preloaded with a higher priority.\nFor example, if a particular image significantly contributes to the website's Largest Contentful Paint (LCP) it might be set to be preloaded and with a high fetch priority.\n

    Note that both the internal priority of any fetch operation, and the impact of fetchPriority on the priority, are entirely browser dependent." + "doc": "The fetchPriority property of the HTMLLinkElement interface represents a hint to the browser indicating how it should prioritize fetching a particular resource relative to other resources of the same type.\nIt reflects the <link> element's fetchpriority content attribute." }, "htmllinkelement.href": { "url": "$MDN_URL$/web/api/htmllinkelement/href", @@ -23905,7 +23984,7 @@ "level": "LOW", "lowDate": "2023-12-11" }, - "doc": "The imageSizes property of the HTMLLinkElement interface indicates the size and conditions for the preloaded images defined by the imageSrcset property. It reflects the value of the <link> element's imagesizes attribute. This property can retrieve or set the imagesizes attribute value.\n

    The <link> element's imagesizes attribute is the same as the <img> element's sizes attribute: a comma-separated source size list. Each source size includes a media condition, the size of the image as a <length>, or the keyword auto, which must come first. For more information about the syntax of the sizes attribute, see <img>.\n

    The imagesrcset and imagesizes attributes are only relevant on <link> elements that have both a rel attribute set to preload and the as attribute set to image." + "doc": "The imageSizes property of the HTMLLinkElement interface indicates the size and conditions for the preloaded images defined by the imageSrcset property. It reflects the value of the <link> element's imagesizes attribute. This property can retrieve or set the imagesizes attribute value.\n

    The <link> element's imagesizes attribute is the same as the <img> element's sizes attribute: a comma-separated source size list. Each source size includes a media condition, the size of the image as a <length>, or the keyword auto, which must come first. For more information about the syntax of the sizes attribute, see <img>.\n

    The imagesrcset and imagesizes attributes are only relevant on <link> elements that have both a rel attribute set to preload and the as attribute set to image." }, "htmllinkelement.imagesrcset": { "url": "$MDN_URL$/web/api/htmllinkelement/imagesrcset", @@ -24036,7 +24115,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "The relList read-only property of the HTMLLinkElement interface reflects the rel attribute. It is a live DOMTokenList containing the set of link types indicating the relationship between the resource represented by the <link> element and the current document.\n

    The property itself is read-only, meaning you can not substitute the\nDOMTokenList by another one, but the content of the returned list can be\nchanged." + "doc": "The read-only relList property of the HTMLLinkElement returns a live DOMTokenList object containing the set of link types indicating the relationship between the resource represented by the <link> element and the current document. It reflects the <link> element's rel content attribute." }, "htmllinkelement.sheet": { "url": "$MDN_URL$/web/api/htmllinkelement/sheet", @@ -24080,7 +24159,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The sizes read-only property of the HTMLLinkElement interfaces defines the sizes of the icons for visual media contained in the resource. It reflects the <link> element's sizes attribute, which takes a list of space-separated sizes, each in the format <width in pixels>x<height in pixels>, or the keyword any.\n

    It is only relevant if the rel is icon or a non-standard type like apple-touch-icon." + "doc": "The read-only sizes property of the HTMLLinkElement interface defines the sizes of the icons for visual media contained in the resource. It reflects the <link> element's sizes attribute, which takes a list of space-separated sizes, each in the format <width in pixels>x<height in pixels>, or the keyword any.\n

    It is only relevant if the rel is icon or a non-standard type like apple-touch-icon." }, "htmllinkelement.type": { "url": "$MDN_URL$/web/api/htmllinkelement/type", @@ -24681,7 +24760,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only HTMLMediaElement.mediaKeys property returns a MediaKeys object, that is a set of keys that the element can use for decryption of media data during playback." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only HTMLMediaElement.mediaKeys property returns a MediaKeys object, that is a set of keys that the element can use for decryption of media data during playback." }, "htmlmediaelement.muted": { "url": "$MDN_URL$/web/api/htmlmediaelement/muted", @@ -24991,7 +25070,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setMediaKeys() method of the HTMLMediaElement interface sets the MediaKeys that will be used to decrypt media during playback.\n

    It returns a Promise that fulfils if the new keys are successfully set, or rejects if keys cannot be set.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setMediaKeys() method of the HTMLMediaElement interface sets the MediaKeys that will be used to decrypt media during playback.\n

    It returns a Promise that fulfils if the new keys are successfully set, or rejects if keys cannot be set.", "parameters": { "mediaKeys": "A MediaKeys object that the HTMLMediaElement can use for decryption of media data during playback." }, @@ -25015,7 +25094,7 @@ "Safari": "18.4", "SafariIOS": "18.4" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setSinkId() method of the HTMLMediaElement interface sets the ID of the audio device to use for output and returns a Promise.\n

    This only works when the application is permitted to use the specified device.\nFor more information see the security requirements below.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setSinkId() method of the HTMLMediaElement interface sets the ID of the audio device to use for output and returns a Promise.\n

    This only works when the application is permitted to use the specified device.\nFor more information see the security requirements below.", "parameters": { "sinkId": "The MediaDeviceInfo.deviceId of the audio output device." }, @@ -25039,7 +25118,7 @@ "Safari": "18.4", "SafariIOS": "18.4" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sinkId read-only property of the HTMLMediaElement interface returns a string that is the unique ID of the device to be used for playing audio output.\n

    This ID should be one of the MediaDeviceInfo.deviceId values returned from MediaDevices.enumerateDevices().\nIf the user agent default device is being used, it returns an empty string." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sinkId read-only property of the HTMLMediaElement interface returns a string that is the unique ID of the device to be used for playing audio output.\n

    This ID should be one of the MediaDeviceInfo.deviceId values returned from MediaDevices.enumerateDevices().\nIf the user agent default device is being used, it returns an empty string." }, "htmlmediaelement.src": { "url": "$MDN_URL$/web/api/htmlmediaelement/src", @@ -25170,7 +25249,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The compact property of the HTMLMenuElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <menu> element." + "doc": "

    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.

    \n

    The compact property of the HTMLMenuElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <menu> element." }, "htmlmetaelement": { "url": "$MDN_URL$/web/api/htmlmetaelement", @@ -25957,7 +26036,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The compact property of the HTMLOListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <ol> element." + "doc": "

    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.

    \n

    The compact property of the HTMLOListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <ol> element." }, "htmlolistelement.reversed": { "url": "$MDN_URL$/web/api/htmlolistelement/reversed", @@ -26023,7 +26102,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The type property of the HTMLOListElement interface indicates the kind of marker to be used to display ordered list.\n

    It reflects the type attribute of the <ol> element.\n

    \n

    Note:\nThe type can be defined in CSS with the list-style-type property. The list-style-type property provides many more values.\n

    " + "doc": "The type property of the HTMLOListElement interface indicates the kind of marker to be used to display ordered list.\n

    It reflects the type attribute of the <ol> element.\n

    \n

    Note:\nThe type can be defined in CSS with the list-style-type property. The list-style-type property provides many more values.\n

    " }, "htmloptgroupelement": { "url": "$MDN_URL$/web/api/htmloptgroupelement", @@ -26064,7 +26143,7 @@ "baseline": { "level": "NONE" }, - "doc": "The disabled property of the HTMLOptGroupElement interface is a boolean value that reflects the <optgroup> element's disabled attribute, which indicates whether the control is disabled.\n

    When disabled, the <option> element descendants of the <optgroup> element are unusable, un-clickable, and unselectable. These disabled <option>s will match the :disabled selector, even if their disabled property value is false." + "doc": "The disabled property of the HTMLOptGroupElement interface is a boolean value that reflects the <optgroup> element's disabled attribute, which indicates whether the control is disabled.\n

    When disabled, the <option> element descendants of the <optgroup> element are unusable, un-clickable, and unselectable. These disabled <option>s will match the :disabled selector, even if their disabled property value is false." }, "htmloptgroupelement.label": { "url": "$MDN_URL$/web/api/htmloptgroupelement/label", @@ -26498,7 +26577,7 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "The htmlFor property of the HTMLOutputElement interface is a string containing a space-separated list of other elements' ids, indicating that those elements contributed input values to (or otherwise affected) the calculation. It reflects the for attribute of the <output> element." + "doc": "The read-only htmlFor property of the HTMLOutputElement returns a live DOMTokenList object containing a list of ids of those elements contributing input values to (or otherwise affected) the calculation. It reflects the <output> element's for content attribute." }, "htmloutputelement.labels": { "url": "$MDN_URL$/web/api/htmloutputelement/labels", @@ -26961,7 +27040,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "HTML <script> elements expose the HTMLScriptElement interface, which provides special properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited HTMLElement interface).\n

    JavaScript files should be served with the text/javascript MIME type, but browsers are lenient and block them only if the script is served with an image type (image/*), video type (video/*), audio type (audio/*), or text/csv. If the script is blocked, its element receives an error event; otherwise, it receives a load event." + "doc": "HTML <script> elements expose the HTMLScriptElement interface, which provides special properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited HTMLElement interface).\n

    JavaScript files should be served with the text/javascript MIME type, but browsers are lenient and block them only if the script is served with an image type (image/*), video type (video/*), audio type (audio/*), or text/csv. If the script is blocked, its element receives an error event; otherwise, it receives a load event.\n

    \n

    Note:\nWhen inserted using the Document.write() method, <script> elements execute (typically synchronously), but when inserted using Element.innerHTML or Element.outerHTML, they do not execute at all.\n

    " }, "htmlscriptelement.async": { "url": "$MDN_URL$/web/api/htmlscriptelement/async", @@ -26988,8 +27067,8 @@ "htmlscriptelement.attributionsrc": { "url": "$MDN_URL$/web/api/htmlscriptelement/attributionsrc", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -26997,10 +27076,7 @@ "Edge": "125", "Opera": "111" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The attributionSrc property of the HTMLScriptElement interface gets and sets the attributionsrc attribute on a <script> element programmatically, reflecting the value of that attribute. attributionsrc specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the script resource request.\n

    On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register a JavaScript-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    \n

    Note:\nAlternatively, JavaScript-based attribution sources or triggers can be registered by sending a fetch() request containing the attributionReporting option (either set directly on the fetch() call or on a Request object passed into the fetch() call), or by sending an XMLHttpRequest with setAttributionReporting() invoked on the request object.\n

    \n

    See the Attribution Reporting API for more details." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    The attributionSrc property of the HTMLScriptElement interface gets and sets the attributionsrc attribute on a <script> element programmatically, reflecting the value of that attribute. attributionsrc specifies that you want the browser to send an Attribution-Reporting-Eligible header along with the script resource request.\n

    On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source or Attribution-Reporting-Register-Trigger header in the response, to register a JavaScript-based attribution source or attribution trigger, respectively. Which response header should be sent back depends on the value of the Attribution-Reporting-Eligible header that triggered the registration.\n

    \n

    Note:\nAlternatively, JavaScript-based attribution sources or triggers can be registered by sending a fetch() request containing the attributionReporting option (either set directly on the fetch() call or on a Request object passed into the fetch() call), or by sending an XMLHttpRequest with setAttributionReporting() invoked on the request object.\n

    \n

    See the Attribution Reporting API for more details." }, "htmlscriptelement.blocking": { "url": "$MDN_URL$/web/api/htmlscriptelement/blocking", @@ -27018,7 +27094,7 @@ "baseline": { "level": "NONE" }, - "doc": "The blocking property of the HTMLScriptElement interface is a string indicating that certain operations should be blocked on the fetching of the script.\n

    It reflects the blocking attribute of the <script> element." + "doc": "The read-only blocking property of the HTMLScriptElement returns a live DOMTokenList object containing the operations that should be blocked on the fetching of an external resource. It reflects the <script> element's blocking content attribute." }, "htmlscriptelement.crossorigin": { "url": "$MDN_URL$/web/api/htmlscriptelement/crossorigin", @@ -27083,7 +27159,27 @@ "level": "LOW", "lowDate": "2024-10-29" }, - "doc": "The fetchPriority property of the HTMLScriptElement interface represents a hint to the browser indicating how it should prioritize fetching an external script relative to other external scripts.\nIt reflects the fetchpriority attribute of the <script> element.\n

    The property allows a developer to signal that fetching a particular script early or late in the loading process has more or less impact on user experience than a browser can reasonably infer when assigning an internal priority.\nThis in turn allows the browser to increase or decrease the priority, and potentially load the script earlier or later than it would otherwise.\nThe property should be used sparingly, as excessive or incorrect prioritization can degrade performance.\n

    The fetch priority allows you to decrease the priority of late-body scripts, or to increase the priority of async scripts without having to use preloading.\nWhen early loading of a script is important, the priority can be used to complement preloading, boosting the priority ahead of less-impactful resources that have a higher default priority.\n

    Note that both the internal priority of any fetch operation, and the impact of fetchPriority on the priority, are entirely browser dependent." + "doc": "The fetchPriority property of the HTMLScriptElement interface represents a hint to the browser indicating how it should prioritize fetching an external script relative to other external scripts.\nIt reflects the <script> element's fetchpriority content attribute." + }, + "htmlscriptelement.innertext": { + "url": "$MDN_URL$/web/api/htmlscriptelement/innertext", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "", + "ChromeAndroid": "", + "Edge": "", + "Firefox": "45", + "FirefoxAndroid": "45", + "Opera": "9.6", + "Safari": "3", + "SafariIOS": "2" + }, + "doc": "

    \n

    Warning:\nThis property represents the text content of a script element, which may be executable depending on the script type.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The innerText property of the HTMLScriptElement interface represents the text content of the <script> element.\nIt behaves in the same way as the textContent and text properties.", + "throws": { + "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." + } }, "htmlscriptelement.integrity": { "url": "$MDN_URL$/web/api/htmlscriptelement/integrity", @@ -27166,7 +27262,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The src property of the HTMLScriptElement interface is a string representing the URL of an external script; this can be used as an alternative to embedding a script directly within a document.\n

    It reflects the src attribute of the <script> element." + "doc": "

    \n

    Warning:\nThis property represents the URI of an external script loaded into the script element, which may be executable depending on the script type.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The src property of the HTMLScriptElement interface is a string representing the URL of an external script; this can be used as an alternative to embedding a script directly within a document.\n

    It reflects the src attribute of the <script> element.", + "throws": { + "TypeError": "Thrown if the property is set with a string when Trusted Types are enforced by a CSP and no default policy is defined.\nThis is also thrown if the fetched URL cannot be successfully parsed as its indicated type, such as a module or importmap." + } }, "htmlscriptelement.supports": { "url": "$MDN_URL$/web/api/htmlscriptelement/supports_static", @@ -27214,7 +27313,30 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    \n

    Warning:\nThis property represents the text content of a script element, which may be executable depending on the script type.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The text property of the HTMLScriptElement interface represents the inline text content of the script element.\nIt acts the same way as the textContent property." + "doc": "

    \n

    Warning:\nThis property represents the text content of a script element, which may be executable depending on the script type.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The text property of the HTMLScriptElement interface represents the inline text content of the <script> element.\nIt behaves in the same way as the textContent and innerText property.", + "throws": { + "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." + } + }, + "htmlscriptelement.textcontent": { + "url": "$MDN_URL$/web/api/htmlscriptelement/textcontent", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "", + "ChromeAndroid": "", + "Edge": "", + "Firefox": "", + "FirefoxAndroid": "4", + "Opera": "9", + "Safari": "3", + "SafariIOS": "" + }, + "doc": "

    \n

    Warning:\nThis property represents the text content of a script element, which may be executable depending on the script type.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The textContent property of the HTMLScriptElement interface represents the inline text content of the <script> element.\nIt behaves in the same way as the text and innerText properties.", + "throws": { + "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." + } }, "htmlscriptelement.type": { "url": "$MDN_URL$/web/api/htmlscriptelement/type", @@ -27346,7 +27468,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLSelectElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n

    \n

    Note:\nAn HTML <select> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLSelectElement.setCustomValidity() method to set the HTMLSelectElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", + "doc": "The checkValidity() method of the HTMLSelectElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n
    \n

    Note:\nAn HTML <select> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLSelectElement.setCustomValidity() method to set the HTMLSelectElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", "returns": "Returns true if the element's value has no validity problems; otherwise, returns false." }, "htmlselectelement.disabled": { @@ -28027,7 +28149,7 @@ "Safari": "3.1", "SafariIOS": "2" }, - "doc": "The media property of the HTMLSourceElement interface is a string representing the intended destination medium for the resource. The value is a media query, which is a comma separated list of media-types, media-features, and logical operators.\n

    It reflects the media attribute of the <source> element." + "doc": "The media property of the HTMLSourceElement interface is a string representing the intended destination medium for the resource. The value is a media query, which is a comma separated list of media-types, media-features, and logical operators.\n

    It reflects the media attribute of the <source> element." }, "htmlsourceelement.sizes": { "url": "$MDN_URL$/web/api/htmlsourceelement/sizes", @@ -28184,7 +28306,7 @@ "baseline": { "level": "NONE" }, - "doc": "The blocking property of the HTMLStyleElement interface is a string indicating that certain operations should be blocked on the fetching of critical subresources.\n

    It reflects the blocking attribute of the <style> element." + "doc": "The read-only blocking property of the HTMLStyleElement returns a live DOMTokenList object containing the operations that should be blocked on the fetching of an external resource. It reflects the <style> element's blocking content attribute." }, "htmlstyleelement.disabled": { "url": "$MDN_URL$/web/api/htmlstyleelement/disabled", @@ -28250,7 +28372,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only sheet property of the HTMLStyleElement interface\ncontains the stylesheet associated with that element.\n

    An StyleSheet is always associated with a HTMLStyleElement, unless its type attribute is not text/css." + "doc": "The read-only sheet property of the HTMLStyleElement interface\ncontains the stylesheet associated with that element.\n

    A StyleSheet is always associated with a HTMLStyleElement, unless its type attribute is not text/css." }, "htmlstyleelement.type": { "url": "$MDN_URL$/web/api/htmlstyleelement/type", @@ -28308,7 +28430,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The align property of the HTMLTableCaptionElement interface is a string indicating how to horizontally align text in the <caption> table element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in the caption cell instead.\n

    " + "doc": "

    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.

    \n

    The align property of the HTMLTableCaptionElement interface is a string indicating how to horizontally align text in the <caption> table element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in the caption cell instead.\n

    " }, "htmltablecellelement": { "url": "$MDN_URL$/web/api/htmltablecellelement", @@ -28370,7 +28492,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The align property of the HTMLTableCellElement interface is a string indicating how to horizontally align text in the <th> or <td> table cell.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in a cell instead.\n

    " + "doc": "

    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.

    \n

    The align property of the HTMLTableCellElement interface is a string indicating how to horizontally align text in the <th> or <td> table cell.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in a cell instead.\n

    " }, "htmltablecellelement.bgcolor": { "url": "$MDN_URL$/web/api/htmltablecellelement/bgcolor", @@ -28388,7 +28510,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The HTMLTableCellElement.bgColor property is used to set the background color of a cell or get the value of the obsolete bgColor attribute, if present.\n

    \n

    Note:\nThis property is deprecated and CSS should be used to set the background color. Use the background-color property instead.\n

    " + "doc": "

    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.

    \n

    The HTMLTableCellElement.bgColor property is used to set the background color of a cell or get the value of the obsolete bgColor attribute, if present.\n

    \n

    Note:\nThis property is deprecated and CSS should be used to set the background color. Use the background-color property instead.\n

    " }, "htmltablecellelement.cellindex": { "url": "$MDN_URL$/web/api/htmltablecellelement/cellindex", @@ -28428,7 +28550,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The ch property of the HTMLTableCellElement interface does nothing. It reflects the char attribute of the cell element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The ch property of the HTMLTableCellElement interface does nothing. It reflects the char attribute of the cell element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablecellelement.choff": { "url": "$MDN_URL$/web/api/htmltablecellelement/choff", @@ -28446,7 +28568,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The chOff property of the HTMLTableCellElement interface does nothing. It reflects the charoff attribute of the cell element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The chOff property of the HTMLTableCellElement interface does nothing. It reflects the charoff attribute of the cell element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablecellelement.colspan": { "url": "$MDN_URL$/web/api/htmltablecellelement/colspan", @@ -28508,7 +28630,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The noWrap property of the HTMLTableCellElement interface returns a Boolean value indicating if the text of the cell may be wrapped on several lines or not.\n

    \n

    Note:\nThis property is deprecated and you should use the CSS white-space property with the value nowrap instead.\n

    " + "doc": "

    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.

    \n

    The noWrap property of the HTMLTableCellElement interface returns a Boolean value indicating if the text of the cell may be wrapped on several lines or not.\n

    \n

    Note:\nThis property is deprecated and you should use the CSS white-space property with the value nowrap instead.\n

    " }, "htmltablecellelement.rowspan": { "url": "$MDN_URL$/web/api/htmltablecellelement/rowspan", @@ -28570,7 +28692,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The vAlign property of the HTMLTableCellElement interface is a string indicating how to vertically align text in a <th> or <td> table cell.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in a cell instead.\n

    " + "doc": "

    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.

    \n

    The vAlign property of the HTMLTableCellElement interface is a string indicating how to vertically align text in a <th> or <td> table cell.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in a cell instead.\n

    " }, "htmltablecolelement": { "url": "$MDN_URL$/web/api/htmltablecolelement", @@ -28610,7 +28732,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The align property of the HTMLTableColElement interface is a string indicating how to horizontally align text in a table <col> column element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a column. Use the CSS text-align property, which takes precedence, to horizontally align text in a column instead.\n

    As <td> are not children of <col>, you can't set it directly on a <col> element, you need to select the cells of the column using a td:nth-last-child(n) or similar (n is the column number, counting from the end).\n

    " + "doc": "

    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.

    \n

    The align property of the HTMLTableColElement interface is a string indicating how to horizontally align text in a table <col> column element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a column. Use the CSS text-align property, which takes precedence, to horizontally align text in a column instead.\n

    As <td> are not children of <col>, you can't set it directly on a <col> element, you need to select the cells of the column using a td:nth-last-child(n) or similar (n is the column number, counting from the end).\n

    " }, "htmltablecolelement.ch": { "url": "$MDN_URL$/web/api/htmltablecolelement/ch", @@ -28628,7 +28750,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The ch property of the HTMLTableColElement interface does nothing. It reflects the char attribute of the <col> element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The ch property of the HTMLTableColElement interface does nothing. It reflects the char attribute of the <col> element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablecolelement.choff": { "url": "$MDN_URL$/web/api/htmltablecolelement/choff", @@ -28646,7 +28768,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The chOff property of the HTMLTableColElement interface does nothing. It reflects the charoff attribute of the <col> element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The chOff property of the HTMLTableColElement interface does nothing. It reflects the charoff attribute of the <col> element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablecolelement.span": { "url": "$MDN_URL$/web/api/htmltablecolelement/span", @@ -28686,7 +28808,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The vAlign property of the HTMLTableColElement interface is a string indicating how to vertically align text in a table <col> column element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text vertically in a column. Use the CSS vertical-align property, which takes precedence, to vertically align text in each column cell instead.\n

    As <td> are not children of <col>, you can't set it directly on a <col> element, you need to select the cells of the column using a td:nth-child(n) or similar (n is the column number).\n

    " + "doc": "

    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.

    \n

    The vAlign property of the HTMLTableColElement interface is a string indicating how to vertically align text in a table <col> column element.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text vertically in a column. Use the CSS vertical-align property, which takes precedence, to vertically align text in each column cell instead.\n

    As <td> are not children of <col>, you can't set it directly on a <col> element, you need to select the cells of the column using a td:nth-child(n) or similar (n is the column number).\n

    " }, "htmltableelement": { "url": "$MDN_URL$/web/api/htmltableelement", @@ -28744,7 +28866,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The bgcolor property of the HTMLTableElement represents the\nbackground color of the table.\n

    \n

    Note:\nDo not use this attribute anymore. Instead, use the CSS background-color property by modifying the element's style attribute or using a style rule.\n

    " + "doc": "

    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.

    \n

    The bgcolor property of the HTMLTableElement represents the\nbackground color of the table.\n

    \n

    Note:\nDo not use this attribute anymore. Instead, use the CSS background-color property by modifying the element's style attribute or using a style rule.\n

    " }, "htmltableelement.border": { "url": "$MDN_URL$/web/api/htmltableelement/border", @@ -28820,7 +28942,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    While you should instead use the CSS\nborder-spacing property, the obsolete HTMLTableElement\ninterface's cellSpacing property represents the spacing\naround the individual <th> and <td> elements\nrepresenting a table's cells. Any two cells are separated by the sum of the\ncellSpacing of each of the two cells." + "doc": "

    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.

    \n

    While you should instead use the CSS\nborder-spacing property, the obsolete HTMLTableElement\ninterface's cellSpacing property represents the spacing\naround the individual <th> and <td> elements\nrepresenting a table's cells. Any two cells are separated by the sum of the\ncellSpacing of each of the two cells." }, "htmltableelement.createcaption": { "url": "$MDN_URL$/web/api/htmltableelement/createcaption", @@ -29239,7 +29361,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The align property of the HTMLTableRowElement interface is a string indicating how to horizontally align text in the <tr> table row. Individual cells can override it.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in a row instead.\n

    " + "doc": "

    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.

    \n

    The align property of the HTMLTableRowElement interface is a string indicating how to horizontally align text in the <tr> table row. Individual cells can override it.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in a row instead.\n

    " }, "htmltablerowelement.bgcolor": { "url": "$MDN_URL$/web/api/htmltablerowelement/bgcolor", @@ -29257,7 +29379,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The HTMLTableRowElement.bgColor property is used to set the background color of a row or retrieve the value of the obsolete bgColor attribute, if present.\n

    \n

    Note:\nThis property is deprecated and CSS should be used to set the background color. Use the background-color property instead.\n

    " + "doc": "

    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.

    \n

    The HTMLTableRowElement.bgColor property is used to set the background color of a row or retrieve the value of the obsolete bgColor attribute, if present.\n

    \n

    Note:\nThis property is deprecated and CSS should be used to set the background color. Use the background-color property instead.\n

    " }, "htmltablerowelement.cells": { "url": "$MDN_URL$/web/api/htmltablerowelement/cells", @@ -29297,7 +29419,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The ch property of the HTMLTableRowElement interface does nothing. It reflects the char attribute of the <tr> element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The ch property of the HTMLTableRowElement interface does nothing. It reflects the char attribute of the <tr> element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablerowelement.choff": { "url": "$MDN_URL$/web/api/htmltablerowelement/choff", @@ -29315,7 +29437,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The chOff property of the HTMLTableRowElement interface does nothing. It reflects the charoff attribute of the <tr> element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The chOff property of the HTMLTableRowElement interface does nothing. It reflects the charoff attribute of the <tr> element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablerowelement.deletecell": { "url": "$MDN_URL$/web/api/htmltablerowelement/deletecell", @@ -29435,7 +29557,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The vAlign property of the HTMLTableRowElement interface is a string indicating how to vertically align text in a <tr> table row. Individual cells can override it.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in a row instead.\n

    " + "doc": "

    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.

    \n

    The vAlign property of the HTMLTableRowElement interface is a string indicating how to vertically align text in a <tr> table row. Individual cells can override it.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in a row instead.\n

    " }, "htmltablesectionelement": { "url": "$MDN_URL$/web/api/htmltablesectionelement", @@ -29475,7 +29597,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The align property of the HTMLTableSectionElement interface is a string indicating how to horizontally align text in a <thead>, <tbody> or <tfoot> table section. Individual rows and cells can override it.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in section cells instead.\n

    " + "doc": "

    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.

    \n

    The align property of the HTMLTableSectionElement interface is a string indicating how to horizontally align text in a <thead>, <tbody> or <tfoot> table section. Individual rows and cells can override it.\n

    \n

    Note:\nThis property is deprecated, and CSS should be used to align text horizontally in a cell. Use the CSS text-align property, which takes precedence, to horizontally align text in section cells instead.\n

    " }, "htmltablesectionelement.ch": { "url": "$MDN_URL$/web/api/htmltablesectionelement/ch", @@ -29493,7 +29615,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The ch property of the HTMLTableSectionElement interface does nothing. It reflects the char attribute of the section element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The ch property of the HTMLTableSectionElement interface does nothing. It reflects the char attribute of the section element.\n

    \n

    Note:\nThis property was designed to participate to the ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablesectionelement.choff": { "url": "$MDN_URL$/web/api/htmltablesectionelement/choff", @@ -29511,7 +29633,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The chOff property of the HTMLTableSectionElement interface does nothing. It reflects the charoff attribute of the section element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " + "doc": "

    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.

    \n

    The chOff property of the HTMLTableSectionElement interface does nothing. It reflects the charoff attribute of the section element.\n

    \n

    Note:\nThis property was designed to participate in an ability to align table cell content on a specific character (typically the decimal point), but was never implemented by browsers.\n

    To achieve such alignment, watch for the support of a string value with the text-align CSS property.\n

    " }, "htmltablesectionelement.deleterow": { "url": "$MDN_URL$/web/api/htmltablesectionelement/deleterow", @@ -29609,7 +29731,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The vAlign property of the HTMLTableSectionElement interface is a string indicating how to vertically align text in a <thead>, <tbody> or <tfoot> table section. Individual rows and cells can override it.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in section cells instead.\n

    " + "doc": "

    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.

    \n

    The vAlign property of the HTMLTableSectionElement interface is a string indicating how to vertically align text in a <thead>, <tbody> or <tfoot> table section. Individual rows and cells can override it.\n

    \n

    Note:\nThis property is deprecated. Use the CSS vertical-align property to horizontally align text in section cells instead.\n

    " }, "htmltemplateelement": { "url": "$MDN_URL$/web/api/htmltemplateelement", @@ -29653,7 +29775,7 @@ "lowDate": "2015-11-12", "highDate": "2018-05-12" }, - "doc": "The HTMLTemplateElement.content property returns a\n<template> element's template contents (a\nDocumentFragment)." + "doc": "The content property of the HTMLTemplateElement interface returns the <template> element's template contents as a DocumentFragment. This content's ownerDocument is a separate Document from the one that contains the <template> element itself — unless the containing document is itself constructed for the purpose of holding template content.\n

    The Node.cloneNode() and Document.importNode() methods both create a copy of a node. The difference is that importNode() clones the node in the context of the calling document, whereas cloneNode() uses the document of the node being cloned. The document context determines the CustomElementRegistry for constructing any custom elements. For this reason, use document.importNode() to clone the content fragment so that custom element descendants are constructed using the definitions in the current document, rather than the separate document that owns the template content. See the Node.cloneNode() page's examples for more details." }, "htmltemplateelement.shadowrootclonable": { "url": "$MDN_URL$/web/api/htmltemplateelement/shadowrootclonable", @@ -29803,7 +29925,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The checkValidity() method of the HTMLTextAreaElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n

    \n

    Note:\nAn HTML <textarea> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLTextAreaElement.setCustomValidity() method to set the HTMLTextAreaElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", + "doc": "The checkValidity() method of the HTMLTextAreaElement interface returns a boolean value which indicates if the element meets any constraint validation rules applied to it. If false, the method also fires an invalid event on the element. Because there's no default browser behavior for checkValidity(), canceling this invalid event has no effect.\n
    \n

    Note:\nAn HTML <textarea> element with a non-null validationMessage is considered invalid, will match the CSS :invalid pseudo-class, and will cause checkValidity() to return false. Use the HTMLTextAreaElement.setCustomValidity() method to set the HTMLTextAreaElement.validationMessage to the empty string to set the validity state to be valid.\n

    ", "returns": "Returns true if the element's value has no validity problems; otherwise, returns false." }, "htmltextareaelement.cols": { @@ -30179,7 +30301,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The selectionEnd property of the HTMLTextAreaElement interface specifies the end position of the current text selection in a <textarea> element. It is a number representing the last index of the selected text. It can be used to both retrieve and set the index of the end of a <textarea>s selected text.\n

    When nothing is selected, the value of both the selectionStart and selectionEnd is the position of the cursor (caret) inside the <textarea> element.\n

    Setting selectionEnd to a value less than the current value of selectionStart updates both the selectionEnd and selectionStart properties to that value. If both value are less than 0, both properties are set to the textLength property value.\n

    The property value can be retrieved and set without the <textarea> having focus, but the element does need to have focus for the ::selection pseudo-element to match the selected text.\n

    Setting the selectionEnd to a new value fires the selectionchange and select events." + "doc": "The selectionEnd property of the HTMLTextAreaElement interface specifies the end position of the current text selection in a <textarea> element. It is a number representing the last index of the selected text. It can be used to both retrieve and set the index of the end of a <textarea>s selected text.\n

    When nothing is selected, the value of both the selectionStart and selectionEnd is the position of the cursor (caret) inside the <textarea> element.\n

    Setting selectionEnd to a value less than the current value of selectionStart updates both the selectionEnd and selectionStart properties to that value. If both value are less than 0, both properties are set to the textLength property value.\n

    The property value can be retrieved and set without the <textarea> having focus, but the element does need to have focus for the ::selection pseudo-element to match the selected text.\n

    Setting the selectionEnd to a new value fires the selectionchange and select events." }, "htmltextareaelement.selectionstart": { "url": "$MDN_URL$/web/api/htmltextareaelement/selectionstart", @@ -30201,7 +30323,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The selectionStart property of the HTMLTextAreaElement interface specifies the start position of the current text selection in a <textarea> element. It is a number representing the beginning index of the selected text. It can be used to both retrieve and set the start of the index of the beginning of a <textarea>s selected text.\n

    When nothing is selected, the value of both the selectionStart and selectionEnd is the position of the cursor (caret) inside the <textarea> element.\n

    Setting selectionStart to a value greater than the current value of selectionEnd updates both the selectionStart and selectionEnd properties to that value. If that value is equal to or greater than the textLength, both properties are both set to the textLength property value.\n

    The property value can be retrieved and set without the <textarea> having focus, but the element does need to have focus for the ::selection pseudo-element to match the selected text.\n

    Setting the selectionStart to a new value fires the selectionchange and select events." + "doc": "The selectionStart property of the HTMLTextAreaElement interface specifies the start position of the current text selection in a <textarea> element. It is a number representing the beginning index of the selected text. It can be used to both retrieve and set the start of the index of the beginning of a <textarea>s selected text.\n

    When nothing is selected, the value of both the selectionStart and selectionEnd is the position of the cursor (caret) inside the <textarea> element.\n

    Setting selectionStart to a value greater than the current value of selectionEnd updates both the selectionStart and selectionEnd properties to that value. If that value is equal to or greater than the textLength, both properties are both set to the textLength property value.\n

    The property value can be retrieved and set without the <textarea> having focus, but the element does need to have focus for the ::selection pseudo-element to match the selected text.\n

    Setting the selectionStart to a new value fires the selectionchange and select events." }, "htmltextareaelement.setcustomvalidity": { "url": "$MDN_URL$/web/api/htmltextareaelement/setcustomvalidity", @@ -30742,7 +30864,7 @@ "Safari": "3", "SafariIOS": "" }, - "doc": "

    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.

    \n

    The compact property of the HTMLUListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <ul> element." + "doc": "

    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.

    \n

    The compact property of the HTMLUListElement interface indicates that spacing between list items should be reduced. The exact handling of the compact attribute is browser-specific. Instead of using this property, consider using CSS line-height instead.\n

    It reflects the compact attribute of the <ul> element." }, "htmlunknownelement": { "url": "$MDN_URL$/web/api/htmlunknownelement", @@ -30909,7 +31031,7 @@ "baseline": { "level": "NONE" }, - "doc": "The HTMLVideoElement method\nrequestPictureInPicture() issues an asynchronous request\nto display the video in picture-in-picture mode.\n

    It's not guaranteed that the video will be put into picture-in-picture. If permission\nto enter that mode is granted, the returned Promise will resolve and the\nvideo will receive a enterpictureinpicture event to let it know that it's now in picture-in-picture.", + "doc": "The HTMLVideoElement method\nrequestPictureInPicture() issues an asynchronous request\nto display the video in picture-in-picture mode.\n

    It's not guaranteed that the video will be put into picture-in-picture. If permission\nto enter that mode is granted, the returned Promise will resolve and the\nvideo will receive an enterpictureinpicture event to let it know that it's now in picture-in-picture.", "returns": "A Promise that will resolve to a PictureInPictureWindow\nobject that can be used to listen when a user will resize that floating window.", "throws": { "NotSupportedError DOMException": "Thrown if the feature is not supported (for example, disabled by a user preference or by a platform limitation).", @@ -31660,7 +31782,7 @@ "name": "The name of the database you want to delete. Note that attempting to delete a\ndatabase that doesn't exist does not throw an exception, in contrast to\nIDBDatabase.deleteObjectStore(), which does throw an exception if the\nnamed object store does not exist.", "options": "In Gecko, since version 26, you can include\na non-standard optional storage parameter that specifies whether you want to delete a\npermanent (the default value) IndexedDB, or an indexedDB in\ntemporary storage (aka shared pool.)" }, - "returns": "A IDBOpenDBRequest on which subsequent events related to this request are fired.\n

    If the operation is successful, the value of the request's result property is null." + "returns": "An IDBOpenDBRequest on which subsequent events related to this request are fired.\n

    If the operation is successful, the value of the request's result property is null." }, "idbfactory.open": { "url": "$MDN_URL$/web/api/idbfactory/open", @@ -31687,7 +31809,7 @@ "name": "The name of the database.", "version": "Optional. The version to open the database with. If the version is not provided and the database exists, then a connection to the database will be opened without changing its version.\nIf the version is not provided and the database does not exist, then it will be created with version 1." }, - "returns": "A IDBOpenDBRequest object on which subsequent events related to this request are fired.\n

    If the operation is successful, the value of the request's result property is a IDBDatabase object representing the connection to the database.", + "returns": "An IDBOpenDBRequest object on which subsequent events related to this request are fired.\n

    If the operation is successful, the value of the request's result property is an IDBDatabase object representing the connection to the database.", "throws": { "TypeError": "Thrown if the value of version is not a number greater than zero." } @@ -31738,7 +31860,7 @@ "parameters": { "key": "The key or key range that identifies the record to be counted." }, - "returns": "A IDBRequest object on which subsequent events related to this operation are fired.\n

    If the operation is successful, the value of the request's result property is the number of records that match the given key or key range.", + "returns": "An IDBRequest object on which subsequent events related to this operation are fired.\n

    If the operation is successful, the value of the request's result property is the number of records that match the given key or key range.", "throws": { "TransactionInactiveError DOMException": "Thrown if this IDBIndex's transaction is inactive.", "DataError DOMException": "Thrown if the key or key range provided contains an invalid key.", @@ -31851,12 +31973,13 @@ "compatibility": { "Chrome": "141", "ChromeAndroid": "141", - "Edge": "141" + "Edge": "141", + "Opera": "125" }, "baseline": { "level": "NONE" }, - "doc": "The getAllRecords() method of the IDBIndex\ninterface retrieves all records (including index keys, primary keys, and values) from the index.\n

    getAllRecords() effectively combines the functionality of getAllKeys() and getAll() by enumerating both primary keys and values at the same time. This combined operation enables certain data retrieval patterns to be significantly faster than alternatives such as iteration with cursors.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getAllRecords() method of the IDBIndex\ninterface retrieves all records (including index keys, primary keys, and values) from the index.\n

    getAllRecords() effectively combines the functionality of getAllKeys() and getAll() by enumerating both primary keys and values at the same time. This combined operation enables certain data retrieval patterns to be significantly faster than alternatives such as iteration with cursors.", "parameters": { "query": "A key or an IDBKeyRange identifying the records to retrieve. If this value is null or not specified, the browser will use an unbound key range.", "count": "The number of records to return. If this value exceeds the number of records in the query, the browser will retrieve only the queried records. If the value is less than 0 or greater than 2^32 - 1, a TypeError exception will be thrown.", @@ -32525,7 +32648,7 @@ "throws": { "ConstraintError DOMException": "Thrown if an index with the same name already exists in the database. Index names are case-sensitive.", "InvalidAccessError DOMException": "Thrown if the provided key path is a sequence, and multiEntry is set to true in the objectParameters object.", - "InvalidStateError DOMException": "Thrown if:\n

    ", + "InvalidStateError DOMException": "Thrown if:\n", "SyntaxError DOMException": "Thrown if the provided keyPath is not a valid key path.", "TransactionInactiveError DOMException": "Thrown if the transaction this IDBObjectStore\nbelongs to is not active (e.g., has been deleted or removed.) In Firefox\nprevious to version 41, an InvalidStateError was raised in\nthis case as well, which was misleading; this has now been fixed (see\nFirefox bug 1176165.)" } @@ -32550,7 +32673,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the\nIDBObjectStore interface returns an IDBRequest object,\nand, in a separate thread, deletes the specified record or records.\n

    Either a key or an IDBKeyRange can be passed, allowing one or multiple\nrecords to be deleted from a store. To delete all records in a store, use\nIDBObjectStore.clear.\n

    Bear in mind that if you are using a IDBCursor, you can use\nthe IDBCursor.delete() method to more efficiently delete the current\nrecord — without having to explicitly look up the record's key.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The delete() method of the\nIDBObjectStore interface returns an IDBRequest object,\nand, in a separate thread, deletes the specified record or records.\n

    Either a key or an IDBKeyRange can be passed, allowing one or multiple\nrecords to be deleted from a store. To delete all records in a store, use\nIDBObjectStore.clear.\n

    Bear in mind that if you are using an IDBCursor, you can use\nthe IDBCursor.delete() method to more efficiently delete the current\nrecord — without having to explicitly look up the record's key.", "parameters": { "key": "The key of the record to be deleted, or an IDBKeyRange to delete all\nrecords with keys in range." }, @@ -32701,12 +32824,13 @@ "compatibility": { "Chrome": "141", "ChromeAndroid": "141", - "Edge": "141" + "Edge": "141", + "Opera": "125" }, "baseline": { "level": "NONE" }, - "doc": "The getAllRecords() method of the IDBObjectStore\ninterface retrieves all records (including primary keys and values) from the object store.\n

    getAllRecords() effectively combines the functionality of getAllKeys() and getAll() by enumerating both primary keys and values at the same time. This combined operation enables certain data retrieval patterns to be significantly faster than alternatives such as iteration with cursors.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getAllRecords() method of the IDBObjectStore\ninterface retrieves all records (including primary keys and values) from the object store.\n

    getAllRecords() effectively combines the functionality of getAllKeys() and getAll() by enumerating both primary keys and values at the same time. This combined operation enables certain data retrieval patterns to be significantly faster than alternatives such as iteration with cursors.", "parameters": { "query": "A key or an IDBKeyRange identifying the records to retrieve. If this value is null or not specified, the browser will use an unbound key range.", "count": "The number of records to return. If this value exceeds the number of records in the query, the browser will retrieve only the queried records. If the value is less than 0 or greater than 2^32 - 1, a TypeError exception will be thrown.", @@ -32905,7 +33029,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The put() method of the IDBObjectStore interface updates a given record in a database, or inserts a new record if the given item does not already exist.\n

    It returns an IDBRequest object, and, in a separate thread, creates a structured clone of the value and stores the cloned value in the object store. This is for adding new records, or updating existing records in an object store when the transaction's mode is readwrite. If the record is successfully stored, then a success event is fired on the returned request object with the result set to the key for the stored record, and the transaction set to the transaction in which this object store is opened.\n

    The put method is an update or insert method.\nSee the IDBObjectStore.add method for an insert only method.\n

    Bear in mind that if you have a IDBCursor to the record you\nwant to update, updating it with IDBCursor.update() is preferable to\nusing IDBObjectStore.put(). Doing so makes it clear that an existing\nrecord will be updated, instead of a new record being inserted.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The put() method of the IDBObjectStore interface updates a given record in a database, or inserts a new record if the given item does not already exist.\n

    It returns an IDBRequest object, and, in a separate thread, creates a structured clone of the value and stores the cloned value in the object store. This is for adding new records, or updating existing records in an object store when the transaction's mode is readwrite. If the record is successfully stored, then a success event is fired on the returned request object with the result set to the key for the stored record, and the transaction set to the transaction in which this object store is opened.\n

    The put method is an update or insert method.\nSee the IDBObjectStore.add method for an insert only method.\n

    Bear in mind that if you have an IDBCursor to the record you\nwant to update, updating it with IDBCursor.update() is preferable to\nusing IDBObjectStore.put(). Doing so makes it clear that an existing\nrecord will be updated, instead of a new record being inserted.", "parameters": { "item": "The item you wish to update (or insert).", "key": "The primary key of the record you want to update (e.g., from\nIDBCursor.primaryKey)." @@ -33216,7 +33340,7 @@ "level": "LOW", "lowDate": "2024-05-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The durability read-only property of the IDBTransaction interface returns the durability hint the transaction was created with.\nThis is a hint to the user agent of whether to prioritize performance or durability when committing the transaction.\n

    The value of this property is defined in the options.durability parameter when creating a transaction using IDBDatabase.transaction()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The durability read-only property of the IDBTransaction interface returns the durability hint the transaction was created with.\nThis is a hint to the user agent of whether to prioritize performance or durability when committing the transaction.\n

    The value of this property is defined in the options.durability parameter when creating a transaction using IDBDatabase.transaction()." }, "idbtransaction.error": { "url": "$MDN_URL$/web/api/idbtransaction/error", @@ -33356,7 +33480,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IDBVersionChangeEvent() constructor\ncreates a new IDBVersionChangeEvent object, which is used to represent\nwhen a version of the database has changed, as a result of the\nonupgradeneeded event handler.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IDBVersionChangeEvent() constructor\ncreates a new IDBVersionChangeEvent object, which is used to represent\nwhen a version of the database has changed, as a result of the\nonupgradeneeded event handler.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to versionchange, success, or blocked.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    oldVersion Optional
    \n
    \n

    A number representing the previous version of the database. It defaults to 0.\n

    \n
    newVersion Optional
    \n
    \n

    An unsigned long representing the new version of the database,\nor null if the database is being deleted. It defaults is null.\n

    \n
    " @@ -33422,7 +33546,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IdentityCredential interface of the Federated Credential Management API (FedCM) represents a user identity credential arising from a successful federated sign-in.\n

    A successful navigator.credentials.get() call that includes an identity option fulfills with an IdentityCredential instance." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IdentityCredential interface of the Federated Credential Management API (FedCM) represents a user identity credential arising from a successful federated sign-in.\n

    A successful navigator.credentials.get() call that includes an identity option fulfills with an IdentityCredential instance." }, "identitycredential.configurl": { "url": "$MDN_URL$/web/api/identitycredential/configurl", @@ -33436,7 +33560,7 @@ "Edge": "136", "Opera": "121" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The configURL read-only property of the IdentityCredential interface returns a string specifying the config file URL of the identity provider (IdP) used for sign-in.\n

    See Provide a config file for more information." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The configURL read-only property of the IdentityCredential interface returns a string specifying the config file URL of the identity provider (IdP) used for sign-in.\n

    See Provide a config file for more information." }, "identitycredential.disconnect": { "url": "$MDN_URL$/web/api/identitycredential/disconnect_static", @@ -33450,15 +33574,15 @@ "Edge": "122", "Opera": "108" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The disconnect() static method of the IdentityCredential interface disconnects a specified federated sign-in account from the IdP used to obtain the credential.\n

    Afterwards, using that account for federated login requires starting the federated sign-in process again.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The disconnect() static method of the IdentityCredential interface disconnects a specified federated sign-in account from the IdP used to obtain the credential.\n

    Afterwards, using that account for federated login requires starting the federated sign-in process again.", "parameters": { "options": "An options object, which can contain the following properties:\n

    \n
    accountHint
    \n
    \n

    A string specifying an account hint that the IdP uses to identify the account to disconnect. The hint can be an arbitrary string as long as the disconnect endpoint can identify the account — for example an email address or user ID. This will not necessarily match the account ID provided by the accounts list endpoint.\n

    \n
    clientId
    \n
    \n

    A string specifying the RP's client identifier, as specified in the providers clientId property during sign-in.\n

    \n
    configURL
    \n
    \n

    A string specifying the config file URL of the IdP, as specified in the providers configURL property during sign-in.\n

    \n
    " }, "returns": "A Promise that fulfills with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if:\n", - "NetworkError DOMException": "Thrown if:\n", - "NotAllowedError DOMException": "Thrown if the embedding <iframe> does not have a identity-credentials-get Permissions-Policy set to allow the use of disconnect() or if the FedCM API is disabled globally by a policy set on the top-level document." + "NetworkError DOMException": "Thrown if:\n", + "NotAllowedError DOMException": "Thrown if the embedding <iframe> does not have an identity-credentials-get Permissions-Policy set to allow the use of disconnect() or if the FedCM API is disabled globally by a policy set on the top-level document." } }, "identitycredential.isautoselected": { @@ -33473,7 +33597,7 @@ "Edge": "120", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The isAutoSelected read-only property of the IdentityCredential interface indicates whether the federated sign-in flow was carried out using auto-reauthentication (i.e., without user mediation) or not.\n

    Automatic reauthentication can occur when a navigator.credentials.get() call is issued with a mediation option value of \"optional\" or \"silent\". It is useful for a relying party (RP) to know whether auto reauthentication occurred for analytics/performance evaluation and for UX purposes — automatic sign-in may warrant a different UI flow to non-automatic sign-in." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The isAutoSelected read-only property of the IdentityCredential interface indicates whether the federated sign-in flow was carried out using auto-reauthentication (i.e., without user mediation) or not.\n

    Automatic reauthentication can occur when a navigator.credentials.get() call is issued with a mediation option value of \"optional\" or \"silent\". It is useful for a relying party (RP) to know whether auto reauthentication occurred for analytics/performance evaluation and for UX purposes — automatic sign-in may warrant a different UI flow to non-automatic sign-in." }, "identitycredential.token": { "url": "$MDN_URL$/web/api/identitycredential/token", @@ -33490,7 +33614,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The token read-only property of the IdentityCredential interface returns the token used to validate the associated sign-in.\n

    The token includes user identity information that has been signed with the IdP's digital certificate.\n

    The relying party (RP) sends the token to its server to validate the certificate, and on success can use the (now trusted) identity information in the token to sign them into their service (starting a new session), sign them up to their service if they are a new user, etc.\n

    If the user has never signed into the IdP or is logged out, the associated get() call rejects with an error and the RP can direct the user to the IdP login page to sign in or create an account.\n

    \n

    Note:\nThe exact structure and content of the validation token is opaque to the FedCM API, and to the browser. The IdP decides on the syntax and usage of it, and the RP needs to follow the instructions provided by the IdP (see Verify the Google ID token on your server side, for example) to make sure they are using it correctly.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The token read-only property of the IdentityCredential interface returns the token used to validate the associated sign-in.\n

    The FedCM API does not define the structure of the token object or what the RP should do with it: this depends entirely on the federated identity protocol that the IdP implements.\n

    When an RP chooses to work with a particular IdP, they will provide instructions for how to interpret and use the returned token value." }, "identitycredentialerror": { "url": "$MDN_URL$/web/api/identitycredentialerror", @@ -33504,7 +33628,7 @@ "Edge": "120", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The IdentityCredentialError interface of the FedCM API describes an authentication error indicating that the user agent did not receive an identity assertion after the user has requested to use a federated account. This can happen if the client is unauthorized or if the server is temporarily unavailable, for example.\n

    Browsers can use this error type to show the error message in the user interface." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The IdentityCredentialError interface of the FedCM API describes an authentication error indicating that the user agent did not receive an identity assertion after the user has requested to use a federated account. This can happen if the client is unauthorized or if the server is temporarily unavailable, for example.\n

    Browsers can use this error type to show the error message in the user interface." }, "identitycredentialerror.error": { "url": "$MDN_URL$/web/api/identitycredentialerror/error", @@ -33512,7 +33636,11 @@ "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The error read-only property of the IdentityCredentialError interface is either one of the values listed in the OAuth 2.0 specified error list or an arbitrary string giving more information about the error." }, "identitycredentialerror.identitycredentialerror": { @@ -33552,7 +33680,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The IdentityCredentialRequestOptions dictionary represents the object passed to CredentialsContainer.get() as the value of the identity option.\n

    When an identity option is provided in a get() call made on a relying party (RP) website, the user is offered a list of federated identity providers (IdPs) as sign-in options. Once the user signs in successfully using one of these options, the promise returned by the get() call returns an IdentityCredential object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The IdentityCredentialRequestOptions dictionary represents the object passed to CredentialsContainer.get() as the value of the identity option.\n

    When an identity option is provided in a get() call made on a relying party (RP) website, the user is offered a list of federated identity providers (IdPs) as sign-in options. Once the user signs in successfully using one of these options, the promise returned by the get() call returns an IdentityCredential object." }, "identityprovider": { "url": "$MDN_URL$/web/api/identityprovider", @@ -33566,7 +33694,7 @@ "Edge": "116", "Opera": "102" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IdentityProvider interface of the Federated Credential Management (FedCM) API represents an IdP and provides access to related information and functionality." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IdentityProvider interface of the Federated Credential Management (FedCM) API represents an IdP and provides access to related information and functionality." }, "identityprovider.close": { "url": "$MDN_URL$/web/api/identityprovider/close_static", @@ -33580,7 +33708,7 @@ "Edge": "120", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The close() static method of the IdentityProvider interface provides a manual signal to the browser that an IdP sign-in flow is finished.\n

    close() needs to be called from the same origin as the specified IdP's sign-in dialog, as defined in the IdP config.\n

    close() is used to close the IdP sign-in dialog when sign-in is completely finished and the IdP has finished collecting data from the user. A primary use case for close() is closing the IdP sign-in dialog in cases where the browser and the IdP login status become out of sync, and the browser initiates a dynamic sign-in flow to correct the issue.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The close() static method of the IdentityProvider interface provides a manual signal to the browser that an IdP sign-in flow is finished.\n

    close() needs to be called from the same origin as the specified IdP's sign-in dialog, as defined in the IdP config.\n

    close() is used to close the IdP sign-in dialog when sign-in is completely finished and the IdP has finished collecting data from the user. A primary use case for close() is closing the IdP sign-in dialog in cases where the browser and the IdP login status become out of sync, and the browser initiates a dynamic sign-in flow to correct the issue.", "returns": "undefined." }, "identityprovider.getuserinfo": { @@ -33595,7 +33723,7 @@ "Edge": "116", "Opera": "102" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getUserInfo() static method of the IdentityProvider interface returns information about a user that has signed in, which can be used to provide a personalized welcome message and sign-in button. This method has to be called from within an IdP origin <iframe> so that relying party (RP) scripts cannot access the data. This must occur after a user has been signed in to a RP site.\n

    This pattern is already common on sites that use identity federation for sign-in, but getUserInfo() provides a way to achieve it without relying on third-party cookies.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getUserInfo() static method of the IdentityProvider interface returns information about a user that has signed in, which can be used to provide a personalized welcome message and sign-in button. This method has to be called from within an IdP origin <iframe> so that relying party (RP) scripts cannot access the data. This must occur after a user has been signed in to a RP site.\n

    This pattern is already common on sites that use identity federation for sign-in, but getUserInfo() provides a way to achieve it without relying on third-party cookies.", "parameters": { "config": "A configuration object, which can contain the following properties:\n

    \n
    configURL
    \n
    \n

    The URL of the configuration file for the identity provider from which you want to get user information.\n

    \n
    clientId
    \n
    \n

    The RP's client identifier issued by the IdP.\n

    \n
    " }, @@ -33603,7 +33731,7 @@ "throws": { "InvalidStateError DOMException": "Thrown if the provided configURL is invalid or if the embedded document's origin does not match the configURL.", "NetworkError DOMException": "Thrown if the browser is unable to connect to the IdP or if getUserInfo() is invoked from the top-level document.", - "NotAllowedError DOMException": "Thrown if the embedding <iframe> does not have a identity-credentials-get Permissions-Policy set to allow the use of getUserInfo() or if the FedCM API is disabled globally by a policy set on the top-level document." + "NotAllowedError DOMException": "Thrown if the embedding <iframe> does not have an identity-credentials-get Permissions-Policy set to allow the use of getUserInfo() or if the FedCM API is disabled globally by a policy set on the top-level document." } }, "idledeadline": { @@ -33676,7 +33804,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The IdleDetector interface of the Idle Detection API provides methods and events for detecting user activity on a device or screen.\n

    This interface requires a secure context." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The IdleDetector interface of the Idle Detection API provides methods and events for detecting user activity on a device or screen.\n

    This interface requires a secure context." }, "idledetector.idledetector": { "url": "$MDN_URL$/web/api/idledetector/idledetector", @@ -33693,7 +33821,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The IdleDetector() constructor creates a new IdleDetector\nobject which provides events indicating when the user is no longer interacting\nwith their device or the screen has locked." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The IdleDetector() constructor creates a new IdleDetector\nobject which provides events indicating when the user is no longer interacting\nwith their device or the screen has locked." }, "idledetector.requestpermission": { "url": "$MDN_URL$/web/api/idledetector/requestpermission_static", @@ -33710,7 +33838,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestPermission() static method of the IdleDetector\ninterface returns a Promise that resolves with a string when the user has chosen\nwhether to grant the origin access to their idle state. Resolves with\n\"granted\" on acceptance and \"denied\" on refusal.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The requestPermission() static method of the IdleDetector\ninterface returns a Promise that resolves with a string when the user has chosen\nwhether to grant the origin access to their idle state. Resolves with\n\"granted\" on acceptance and \"denied\" on refusal.", "returns": "A Promise that resolves with \"granted\" or \"denied\"." }, "idledetector.screenstate": { @@ -33728,7 +33856,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The screenState read-only property of the IdleDetector interface\nreturns a string indicating whether the screen is locked, one of \"locked\" or\n\"unlocked\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The screenState read-only property of the IdleDetector interface\nreturns a string indicating whether the screen is locked, one of \"locked\" or\n\"unlocked\"." }, "idledetector.start": { "url": "$MDN_URL$/web/api/idledetector/start", @@ -33745,7 +33873,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The start() method of the IdleDetector interface returns a\nPromise that resolves when the detector starts listening for changes in the\nuser's idle state. This\nmethod takes an optional options object with the threshold in milliseconds\nwhere inactivity should be reported and signal for an AbortSignal to abort\nthe idle detector.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The start() method of the IdleDetector interface returns a\nPromise that resolves when the detector starts listening for changes in the\nuser's idle state. This\nmethod takes an optional options object with the threshold in milliseconds\nwhere inactivity should be reported and signal for an AbortSignal to abort\nthe idle detector.", "parameters": { "options": "An object with the following properties:\n

    \n
    threshold
    \n
    \n

    The minimum number of idle milliseconds before reporting should begin.\n

    \n
    signal
    \n
    \n

    A reference to an AbortSignal instance allowing you to abort idle detection.\n

    \n
    " }, @@ -33769,7 +33897,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    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()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    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()." }, "iirfilternode": { "url": "$MDN_URL$/web/api/iirfilternode", @@ -33791,7 +33919,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "The IIRFilterNode interface of the Web Audio API is a AudioNode processor which implements a general infinite impulse response (IIR) filter; this type of filter can be used to implement tone control devices and graphic equalizers as well. It lets the parameters of the filter response be specified, so that it can be tuned as needed.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs1
    Number of outputs1
    Channel count mode\"max\"
    Channel countSame as on the input
    Channel interpretation\"speakers\"
    \n

    Typically, it's best to use the BiquadFilterNode interface to implement higher-order filters. There are several reasons why:\n

    \n

    However, if you need to create an odd-ordered IIR filter, you'll need to use IIRFilterNode. You may also find this interface useful if you don't need automation, or for other reasons.\n

    \n

    Note:\nOnce the node has been created, you can't change its coefficients.\n

    \n

    IIRFilterNodes have a tail-time reference; they continue to output non-silent audio with zero input. As an IIR filter, the non-zero input continues forever, but this can be limited after some finite time in practice, when the output has approached zero closely enough. The actual time that takes depends on the filter coefficients provided." + "doc": "The IIRFilterNode interface of the Web Audio API is an AudioNode processor which implements a general infinite impulse response (IIR) filter; this type of filter can be used to implement tone control devices and graphic equalizers as well. It lets the parameters of the filter response be specified, so that it can be tuned as needed.\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    Number of inputs1
    Number of outputs1
    Channel count mode\"max\"
    Channel countSame as on the input
    Channel interpretation\"speakers\"
    \n

    Typically, it's best to use the BiquadFilterNode interface to implement higher-order filters. There are several reasons why:\n

    \n

    However, if you need to create an odd-ordered IIR filter, you'll need to use IIRFilterNode. You may also find this interface useful if you don't need automation, or for other reasons.\n

    \n

    Note:\nOnce the node has been created, you can't change its coefficients.\n

    \n

    IIRFilterNodes have a tail-time reference; they continue to output non-silent audio with zero input. As an IIR filter, the non-zero input continues forever, but this can be limited after some finite time in practice, when the output has approached zero closely enough. The actual time that takes depends on the filter coefficients provided." }, "iirfilternode.getfrequencyresponse": { "url": "$MDN_URL$/web/api/iirfilternode/getfrequencyresponse", @@ -34010,7 +34138,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The ImageBitmapRenderingContext.transferFromImageBitmap()\nmethod displays the given ImageBitmap in the canvas associated with this\nrendering context. The ownership of the ImageBitmap is transferred to the\ncanvas as well.\n

    This method was previously named transferImageBitmap(), but was renamed in\na spec change. The old name is being kept as an alias to avoid code breakage.", "parameters": { - "bitmap": "An ImageBitmap object to transfer." + "bitmap": "An ImageBitmap object to transfer, or null. If the value is null, the canvas is reset to blank." }, "returns": "None (undefined)." }, @@ -34082,7 +34210,7 @@ "Safari": "26", "SafariIOS": "26" }, - "doc": "The grabFrame() method of the\nImageCapture interface takes a snapshot of the live video in a\nMediaStreamTrack and returns a Promise that resolves with\na ImageBitmap containing the snapshot.", + "doc": "The grabFrame() method of the\nImageCapture interface takes a snapshot of the live video in a\nMediaStreamTrack and returns a Promise that resolves with\nan ImageBitmap containing the snapshot.", "returns": "A Promise that resolves to an ImageBitmap object.", "throws": { "InvalidStateError DOMException": "Thrown if readyState property of the MediaStreamTrack passing in the constructor is not live.", @@ -34324,7 +34452,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder interface of the WebCodecs API provides a way to unpack and decode encoded image data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder interface of the WebCodecs API provides a way to unpack and decode encoded image data." }, "imagedecoder.close": { "url": "$MDN_URL$/web/api/imagedecoder/close", @@ -34342,7 +34470,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the ImageDecoder interface ends all pending work and releases system resources.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the ImageDecoder interface ends all pending work and releases system resources.", "returns": "None (undefined)." }, "imagedecoder.complete": { @@ -34361,7 +34489,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The complete read-only property of the ImageDecoder interface returns true if encoded data has completed buffering." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The complete read-only property of the ImageDecoder interface returns true if encoded data has completed buffering." }, "imagedecoder.completed": { "url": "$MDN_URL$/web/api/imagedecoder/completed", @@ -34379,7 +34507,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The completed read-only property of the ImageDecoder interface returns a promise that resolves once encoded data has finished buffering." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The completed read-only property of the ImageDecoder interface returns a promise that resolves once encoded data has finished buffering." }, "imagedecoder.decode": { "url": "$MDN_URL$/web/api/imagedecoder/decode", @@ -34397,7 +34525,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the ImageDecoder interface enqueues a control message to decode the frame of an image.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the ImageDecoder interface enqueues a control message to decode the frame of an image.", "parameters": { "options": "An object containing the following members:\n

    \n
    frameIndex Optional
    \n
    \n

    An integer representing the index of the frame to decode. Defaults to 0 (the first frame).\n

    \n
    completeFramesOnly Optional
    \n
    \n

    A boolean defaulting to true. When false indicates that for progressive images the decoder may output an image with reduced detail. When false, the promise returned by decode() will resolve exactly once for each new level of detail.\n

    \n
    " }, @@ -34422,7 +34550,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder() constructor creates a new ImageDecoder object which unpacks and decodes image data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder() constructor creates a new ImageDecoder object which unpacks and decodes image data.", "parameters": { "init": "An object containing the following members:\n

    \n
    type
    \n
    \n

    A string containing the MIME type of the image file to be decoded.\n

    \n
    data
    \n
    \n

    An ArrayBuffer, a TypedArray, a DataView, or a ReadableStream of bytes representing an encoded image type as described by type.\n

    \n
    premultiplyAlpha Optional
    \n
    \n

    Specifies whether the decoded image's color channels should be premultiplied by the alpha channel. If not provided set as \"default\":\n

      \n
    • \"none\"
    • \n
    • \"premultiply\"
    • \n
    • \"default\"
    • \n
    \n
    \n
    colorSpaceConversion Optional
    \n
    \n

    Specifies whether the image should be decoded using color space conversion. If not provided set as \"default\". The value \"default\" indicates that implementation-specific behavior is used:\n

      \n
    • \"none\"
    • \n
    • \"default\"
    • \n
    \n
    \n
    desiredWidth Optional
    \n
    \n

    An integer indicating the desired width for the decoded output. Has no effect unless the image codec supports variable resolution decoding.\n

    \n
    desiredHeight Optional
    \n
    \n

    An integer indicating the desired height for the decoded output. Has no effect unless the image codec supports variable resolution decoding.\n

    \n
    preferAnimation Optional
    \n
    \n

    A Boolean indicating whether the initial track selection should prefer an animated track.\n

    \n
    transfer
    \n
    \n

    An array of ArrayBuffers that ImageDecoder will detach and take ownership of. If the array contains the ArrayBuffer backing data, ImageDecoder will use that buffer directly instead of copying from it.\n

    \n
    " } @@ -34443,7 +34571,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder.isTypeSupported() static method checks if a given MIME type can be decoded by the user agent.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The ImageDecoder.isTypeSupported() static method checks if a given MIME type can be decoded by the user agent.", "parameters": { "type": "A string containing the MIME type to check for decoding support." }, @@ -34465,7 +34593,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the ImageDecoder interface aborts all pending decode() operations; rejecting all pending promises. All other state will be unchanged. Class methods can continue to be invoked after reset(). E.g., calling decode() after reset() is permitted.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the ImageDecoder interface aborts all pending decode() operations; rejecting all pending promises. All other state will be unchanged. Class methods can continue to be invoked after reset(). E.g., calling decode() after reset() is permitted.", "returns": "None (undefined)." }, "imagedecoder.tracks": { @@ -34484,7 +34612,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The tracks read-only property of the ImageDecoder interface returns a list of the tracks in the encoded image data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The tracks read-only property of the ImageDecoder interface returns a list of the tracks in the encoded image data." }, "imagedecoder.type": { "url": "$MDN_URL$/web/api/imagedecoder/type", @@ -34502,7 +34630,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The type read-only property of the ImageDecoder interface reflects the MIME type configured during construction." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The type read-only property of the ImageDecoder interface reflects the MIME type configured during construction." }, "imagetrack": { "url": "$MDN_URL$/web/api/imagetrack", @@ -34809,7 +34937,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The InputDeviceInfo interface of the Media Capture and Streams API gives access to the capabilities of the input device that it represents.\n

    InputDeviceInfo objects are returned by MediaDevices.enumerateDevices() if the returned device is an audio or video input device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The InputDeviceInfo interface of the Media Capture and Streams API gives access to the capabilities of the input device that it represents.\n

    InputDeviceInfo objects are returned by MediaDevices.enumerateDevices() if the returned device is an audio or video input device." }, "inputdeviceinfo.getcapabilities": { "url": "$MDN_URL$/web/api/inputdeviceinfo/getcapabilities", @@ -34827,7 +34955,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCapabilities() method of the InputDeviceInfo interface returns a MediaTrackCapabilities object describing the primary audio or video track of the device's MediaStream.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCapabilities() method of the InputDeviceInfo interface returns a MediaTrackCapabilities object describing the primary audio or video track of the device's MediaStream.", "returns": "A MediaTrackCapabilities object which specifies the value or range of values which are supported for each of the user agent's supported constrainable properties. It is required to return identical information as returned by calling getCapabilities() on the first MediaStreamTrack of the same kind as this device (video or audio) in the MediaStream returned by getUserMedia({ deviceId: deviceInfo.deviceId }).\n

    See MediaStreamTrack.getCapabilities() for a list of commonly supported properties and their types.\n

    \n

    Note:\nIf the user has not granted permission to access the input device an empty object will be returned.\n

    " }, "inputevent": { @@ -35060,7 +35188,56 @@ }, "integrityviolationreportbody": { "url": "$MDN_URL$/web/api/integrityviolationreportbody", - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The IntegrityViolationReportBody dictionary is an extension of the Reporting API that represents the body of an Integrity Policy violation report.\n

    Integrity violation reports can be reported to reporting server endpoints or via a ReportingObserver.\nThey have a type of \"integrity-violation\", a url indicating the document that contains the violation, and a body property that is an object matching this dictionary." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The IntegrityViolationReportBody dictionary is an extension of the Reporting API that represents the body of an Integrity Policy violation report.\n

    Integrity violation reports can be reported to reporting server endpoints or via a ReportingObserver.\nThey have a type of \"integrity-violation\", a url indicating the document that contains the violation, and a body property that is an object matching this dictionary." + }, + "interestevent": { + "url": "$MDN_URL$/web/api/interestevent", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The InterestEvent interface represents an event that fires when interest is shown or lost on an interest invoker.\n

    This is the event object for the interest and loseinterest events, which fire on the target element when interest is shown or lost, respectively." + }, + "interestevent.interestevent": { + "url": "$MDN_URL$/web/api/interestevent/interestevent", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The InterestEvent() constructor creates a new InterestEvent object.", + "parameters": { + "type": "A string representing the type of event. For InterestEvent, this is always interest or loseinterest.", + "init": "An object containing the following property:\n

    \n
    source Optional
    \n
    \n

    An Element representing the interest invoker element on which interest was shown or lost.\n

    \n
    " + } + }, + "interestevent.source": { + "url": "$MDN_URL$/web/api/interestevent/source", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The source read-only property of the InterestEvent interface is an Element object instance that represents the interest invoker element on which interest was shown or lost to fire the event." }, "intersectionobserver": { "url": "$MDN_URL$/web/api/intersectionobserver", @@ -35147,7 +35324,7 @@ "doc": "The IntersectionObserver() constructor creates and returns a new IntersectionObserver object.", "parameters": { "callback": "A function which is called when the percentage of the target element is visible crosses a threshold.\nThe callback receives as input two parameters:\n

    \n
    entries
    \n
    \n

    An array of IntersectionObserverEntry objects, each representing one threshold which was crossed, either becoming more or less visible than the percentage specified by that threshold.\nYou should not assume the number of entries, because multiple threshold-crossing events may be reported in a single callback invocation.\nThe entries are dispatched using a queue, so they should be ordered by the time they were generated, but you should preferably use IntersectionObserverEntry.time to correctly order them.\n

    \n
    observer
    \n
    \n

    The IntersectionObserver for which the callback is being invoked.\n

    \n
    ", - "options": "An optional object which customizes the observer.\n

    You can provide any combination (or none) of the following options:\n

    \n
    delay
    \n
    \n

    A number specifying the minimum permitted delay between notifications from the observer, in milliseconds.\n

    The delay is used to limit the rate at which notifications will be provided when tracking visibility, as this is a computationally intensive operation.\nThe recommendation when tracking visibility is that you set the delay to the largest tolerable value.\n

    When trackVisibility is true the minimum value is 100.\nThe browser will set the value to 100 if any smaller value is used, or if the value is not specified.\nThe default value is 0.\n

    \n
    root
    \n
    \n

    An Element or Document object which is an ancestor of the intended target, whose bounding rectangle will be considered the viewport.\nAny part of the target not visible in the visible area of the root is not considered visible.\nIf not specified, the observer uses the document's\nviewport as the root, with no margin, and a 0% threshold (meaning that even a one-pixel change is enough to trigger a callback).\n

    \n
    rootMargin
    \n
    \n

    A string which specifies a set of offsets to add to the root's bounding_box when calculating intersections, effectively shrinking\nor growing the root for calculation purposes. Each offset value can be only expressed in pixels (px) or percentages (%).\nThe syntax is approximately the same as that for the CSS margin property;\nsee The intersection root and root margin for more information on how the margin works and the syntax.\nThe default is \"0px 0px 0px 0px\".\n

    \n
    scrollMargin
    \n
    \n

    A string that specifies the offsets to add to every scroll container on path to the target when calculating intersections, effectively shrinking or growing the clip rectangles used to calculate intersections.\nThis allows, for example, better observation of targets inside nested scroll containers that are currently clipped away by the scroll containers.\nThe syntax is the same as rootMargin.\nThe default is \"0px 0px 0px 0px\".\n

    \n
    threshold
    \n
    \n

    Either a single number or an array of numbers between 0.0 and 1.0, specifying a ratio of intersection area to total bounding box area for the observed target.\nA value of 0.0 means that even a single visible pixel counts as the target being visible.\n1.0 means that the entire target element is visible.\nSee Thresholds for a more in-depth description of how thresholds are used.\nThe default is a threshold of \"0\".\n

    \n
    trackVisibility
    \n
    \n

    A boolean indicating whether the observer should track visibility.\n

    When true, the browser will check that the target does not have compromised visibility when calculating intersections;\nfor example, that it hasn't been covered by other elements or potentially been distorted or hidden by a filter, reduced opacity, or some transform.\n

    Tracking visibility is an expensive operation, and should only be done when necessary.\nA delay should also be set when this value is true.\nThe default is false.\n

    \n
    " + "options": "An optional object which customizes the observer.\n

    You can provide any combination (or none) of the following options:\n

    \n
    delay
    \n
    \n

    A number specifying the minimum permitted delay between notifications from the observer, in milliseconds.\n

    The delay is used to limit the rate at which notifications will be provided when tracking visibility, as this is a computationally intensive operation.\nThe recommendation when tracking visibility is that you set the delay to the largest tolerable value.\n

    When trackVisibility is true the minimum value is 100.\nThe browser will set the value to 100 if any smaller value is used, or if the value is not specified.\nThe default value is 0.\n

    \n
    root
    \n
    \n

    An Element or Document object which is an ancestor of the intended target, whose bounding rectangle will be considered the viewport.\nAny part of the target not visible in the visible area of the root is not considered visible.\nIf not specified, the observer uses the document's\nviewport as the root, with no margin, and a 0% threshold (meaning that even a one-pixel change is enough to trigger a callback).\n

    \n
    rootMargin
    \n
    \n

    A string which specifies a set of offsets to add to the root's bounding_box when calculating intersections, effectively shrinking\nor growing the root for calculation purposes. Each offset value can be only expressed in pixels (px) or percentages (%).\nThe syntax is approximately the same as that for the CSS margin property;\nsee The intersection root and root margin for more information on how the margin works and the syntax.\nThe default is \"0px 0px 0px 0px\".\n

    \n
    scrollMargin
    \n
    \n

    A string that specifies the offsets to add to every scroll container on path to the target when calculating intersections, effectively shrinking or growing the clip rectangles used to calculate intersections.\nThis allows, for example, better observation of targets inside nested scroll containers that are currently clipped away by the scroll containers.\nThe syntax is the same as rootMargin.\nThe default is \"0px 0px 0px 0px\".\n

    \n
    threshold
    \n
    \n

    Either a single number or an array of numbers between 0.0 and 1.0, specifying a ratio of intersection area to total bounding box area for the observed target.\nA value of 0.0 means that even a single visible pixel counts as the target being visible.\n1.0 means that the entire target element is visible.\nSee Thresholds for a more in-depth description of how thresholds are used.\nThe default is a threshold of \"0\".\n

    \n
    trackVisibility
    \n
    \n

    A boolean indicating whether the observer should track visibility.\n

    When true, the browser will check that the target does not have compromised visibility when calculating intersections;\nfor example, that it hasn't been covered by other elements or potentially been distorted or hidden by a filter, reduced opacity, or some transform.\n

    Tracking visibility is an expensive operation, and should only be done when necessary.\nA delay should also be set when this value is true.\nThe default is false.\n

    \n
    " }, "returns": "A new IntersectionObserver which can be used to watch for the visibility of a target element within the specified root crossing through any of the specified visibility thresholds.\n

    Call its observe() method to begin watching for the visibility changes on a given target.", "throws": { @@ -35223,7 +35400,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "The rootMargin read-only property of the IntersectionObserver interface is a string with syntax similar to that of the CSS margin property.\n

    Each side of the rectangle represented by rootMargin is added to the corresponding side in the root element's bounding box before the intersection test is performed.\nThis lets you, for example, adjust the bounds outward so that the target element is considered 100% visible even if a certain number of pixels worth of width or height is clipped away, or treat the target as partially hidden if an edge is too close to the edge of the root's bounding box.\n

    See how intersections are calculated for a more in-depth look at the root margin and how it works with the root's bounding box." + "doc": "The rootMargin read-only property of the IntersectionObserver interface is a string with syntax similar to that of the CSS margin property.\n

    Each side of the rectangle represented by rootMargin is added to the corresponding side in the root element's bounding box before the intersection test is performed.\nThis lets you, for example, adjust the bounds outward so that the target element is considered 100% visible even if a certain number of pixels worth of width or height is clipped away, or treat the target as partially hidden if an edge is too close to the edge of the root's bounding box.\n

    See how intersections are calculated for a more in-depth look at the root margin and how it works with the root's bounding box." }, "intersectionobserver.scrollmargin": { "url": "$MDN_URL$/web/api/intersectionobserver/scrollmargin", @@ -35650,7 +35827,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "The isSecureContext read-only property of the Window interface returns a boolean indicating whether the current context is secure (true) or not (false)." + "doc": "The isSecureContext read-only property of the Window interface returns a boolean indicating whether the current context is secure (true) or not (false)." }, "keyboard": { "url": "$MDN_URL$/web/api/keyboard", @@ -35667,7 +35844,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Keyboard interface of the Keyboard API provides functions that retrieve keyboard layout maps and toggle capturing of key presses from the physical keyboard.\n

    A list of valid code values is found in the UI Events KeyboardEvent code Values spec." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Keyboard interface of the Keyboard API provides functions that retrieve keyboard layout maps and toggle capturing of key presses from the physical keyboard.\n

    A list of valid code values is found in the UI Events KeyboardEvent code Values spec." }, "keyboard.getlayoutmap": { "url": "$MDN_URL$/web/api/keyboard/getlayoutmap", @@ -35684,7 +35861,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getLayoutMap() method of the\nKeyboard interface returns a Promise that resolves with\nan instance of KeyboardLayoutMap which is a map-like object with\nfunctions for retrieving the strings associated with specific physical keys.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getLayoutMap() method of the\nKeyboard interface returns a Promise that resolves with\nan instance of KeyboardLayoutMap which is a map-like object with\nfunctions for retrieving the strings associated with specific physical keys.", "returns": "A Promise that resolves with an instance of\nKeyboardLayoutMap.", "throws": { "SecurityError DOMException": "Thrown if the call is blocked by a permission policy." @@ -35705,7 +35882,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The lock() method of the\nKeyboard interface returns a Promise that resolves after enabling the\ncapture of key presses for any or all of the keys on the physical keyboard. This method\ncan only capture keys that are granted access by the underlying operating\nsystem.\n

    If lock() is called multiple times then only the key codes specified in the most recent call will be locked.\nAny keys locked by a previous call to lock() are unlocked.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The lock() method of the\nKeyboard interface returns a Promise that resolves after enabling the\ncapture of key presses for any or all of the keys on the physical keyboard. This method\ncan only capture keys that are granted access by the underlying operating\nsystem.\n

    If lock() is called multiple times then only the key codes specified in the most recent call will be locked.\nAny keys locked by a previous call to lock() are unlocked.", "parameters": { "keyCodes": "An Array of one or more key codes to lock. If no keycodes are provided\nall keys will be locked. A list of valid code values is found in the UI Events KeyboardEvent code Values spec." }, @@ -35731,7 +35908,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The unlock() method of the\nKeyboard interface unlocks all keys captured by the\nKeyboard.lock() method and returns synchronously.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The unlock() method of the\nKeyboard interface unlocks all keys captured by the\nKeyboard.lock() method and returns synchronously.", "returns": "None (undefined)." }, "keyboardevent": { @@ -36297,7 +36474,7 @@ "highDate": "2023-01-27" }, "doc": "The getKeyframes() method of a KeyframeEffect returns an Array of the computed keyframes that make up this animation along with their computed offsets.", - "returns": "Returns a sequence of objects with the following format:\n

    \n
    property value pairs
    \n
    \n

    As many property value pairs as are contained in each keyframe of the animation.\n

    \n
    offset
    \n
    \n

    The offset of the keyframe specified as a number between 0.0 and 1.0 inclusive or null. This is equivalent to specifying start and end states in percentages in CSS stylesheets using @keyframes. This will be null if the keyframe is automatically spaced.\n

    \n
    computedOffset
    \n
    \n

    The computed offset for this keyframe, calculated when the list of computed keyframes was produced. Unlike offset, above, the computedOffset is never null.\n

    \n
    easing
    \n
    \n

    The easing function used from this keyframe until the next keyframe in the series.\n

    \n
    composite
    \n
    \n

    The KeyframeEffect.composite operation used to combine the values specified in this keyframe with the underlying value. This will be absent if the composite operation specified on the effect is being used.\n

    \n
    " + "returns": "Returns a sequence of objects with the following format:\n
    \n
    property value pairs
    \n
    \n

    As many property value pairs as are contained in each keyframe of the animation.\n

    \n
    offset
    \n
    \n

    The offset of the keyframe specified as a number between 0.0 and 1.0 inclusive or null. This is equivalent to specifying start and end states in percentages in CSS stylesheets using @keyframes. This will be null if the keyframe is automatically spaced.\n

    \n
    computedOffset
    \n
    \n

    The computed offset for this keyframe, calculated when the list of computed keyframes was produced. Unlike offset, above, the computedOffset is never null.\n

    \n
    easing
    \n
    \n

    The easing function used from this keyframe until the next keyframe in the series.\n

    \n
    composite
    \n
    \n

    The KeyframeEffect.composite operation used to combine the values specified in this keyframe with the underlying value. This will be absent if the composite operation specified on the effect is being used.\n

    \n
    " }, "keyframeeffect.iterationcomposite": { "url": "$MDN_URL$/web/api/keyframeeffect/iterationcomposite", @@ -36339,7 +36516,7 @@ "parameters": { "target": "The DOM element to be animated, or null.", "keyframes": "A keyframes object or null.", - "options": "Either an integer representing the animation's duration (in milliseconds), or an object containing one or more of the following:\n
    \n
    delay Optional
    \n
    \n

    The number of milliseconds to delay the start of the animation. Defaults to 0.\n

    \n
    direction Optional
    \n
    \n

    Whether the animation runs forwards (normal), backwards (reverse), switches direction after each iteration (alternate), or runs backwards and switches direction after each iteration (alternate-reverse). Defaults to \"normal\".\n

    \n
    duration Optional
    \n
    \n

    The number of milliseconds each iteration of the animation takes to complete. Defaults to 0. Although this is technically optional, keep in mind that your animation will not run if this value is 0.\n

    \n
    easing Optional
    \n
    \n

    The rate of the animation's change over time. Accepts an <easing-function>, such as \"linear\", \"ease-in\", \"step-end\", or \"cubic-bezier(0.42, 0, 0.58, 1)\". Defaults to \"linear\".\n

    \n
    endDelay Optional
    \n
    \n

    The number of milliseconds to delay after the end of an animation. This is primarily of use when sequencing animations based on the end time of another animation. Defaults to 0.\n

    \n
    fill Optional
    \n
    \n

    Dictates whether the animation's effects should be reflected by the element(s) prior to playing (\"backwards\"), retained after the animation has completed playing (\"forwards\"), or both. Defaults to \"none\".\n

    \n
    iterationStart Optional
    \n
    \n

    Describes at what point in the iteration the animation should start. 0.5 would indicate starting halfway through the first iteration for example, and with this value set, an animation with 2 iterations would end halfway through a third iteration. Defaults to 0.0.\n

    \n
    iterations Optional
    \n
    \n

    The number of times the animation should repeat. Defaults to 1, and can also take a value of Infinity to make it repeat for as long as the element exists.\n

    \n
    composite Optional
    \n
    \n

    Determines how values are combined between this animation and other, separate\nanimations that do not specify their own specific composite operation. Defaults to\nreplace.\n

      \n
    • add dictates an additive effect, where each successive iteration\nbuilds on the last. For instance with transform, a\ntranslateX(-200px) would not override an earlier\nrotate(20deg) value but result in\ntranslateX(-200px) rotate(20deg).
    • \n
    • accumulate is similar but a little smarter: blur(2)\nand blur(5) become blur(7), not\nblur(2) blur(5).
    • \n
    • replace overwrites the previous value with the new one.
    • \n
    \n
    \n
    iterationComposite Optional
    \n
    \n

    Determines how values build from iteration to iteration in this animation. Can be\nset to accumulate or replace (see above). Defaults\nto replace.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string containing a pseudo-element selector, such as \"::before\". If present, the effect is applied to the selected pseudo-element of target, rather than to target itself.\n

    \n
    ", + "options": "Either an integer representing the animation's duration (in milliseconds), or an object containing one or more of the following:\n
    \n
    delay Optional
    \n
    \n

    The number of milliseconds to delay the start of the animation. Defaults to 0.\n

    \n
    direction Optional
    \n
    \n

    Whether the animation runs forwards (normal), backwards (reverse), switches direction after each iteration (alternate), or runs backwards and switches direction after each iteration (alternate-reverse). Defaults to \"normal\".\n

    \n
    duration Optional
    \n
    \n

    The number of milliseconds each iteration of the animation takes to complete. Defaults to 0. Although this is technically optional, keep in mind that your animation will not run if this value is 0.\n

    \n
    easing Optional
    \n
    \n

    The rate of the animation's change over time. Accepts an <easing-function>, such as \"linear\", \"ease-in\", \"step-end\", or \"cubic-bezier(0.42, 0, 0.58, 1)\". Defaults to \"linear\".\n

    \n
    endDelay Optional
    \n
    \n

    The number of milliseconds to delay after the end of an animation. This is primarily of use when sequencing animations based on the end time of another animation. Defaults to 0.\n

    \n
    fill Optional
    \n
    \n

    Dictates whether the animation's effects should be reflected by the element(s) prior to playing (\"backwards\"), retained after the animation has completed playing (\"forwards\"), or both. Defaults to \"none\".\n

    \n
    iterationStart Optional
    \n
    \n

    Describes at what point in the iteration the animation should start. 0.5 would indicate starting halfway through the first iteration for example, and with this value set, an animation with 2 iterations would end halfway through a third iteration. Defaults to 0.0.\n

    \n
    iterations Optional
    \n
    \n

    The number of times the animation should repeat. Defaults to 1, and can also take a value of Infinity to make it repeat for as long as the element exists.\n

    \n
    composite Optional
    \n
    \n

    Determines how values are combined between this animation and other, separate\nanimations that do not specify their own specific composite operation. Defaults to\nreplace.\n

      \n
    • add dictates an additive effect, where each successive iteration\nbuilds on the last. For instance with transform, a\ntranslateX(-200px) would not override an earlier\nrotate(20deg) value but result in\ntranslateX(-200px) rotate(20deg).
    • \n
    • accumulate is similar but a little smarter: blur(2)\nand blur(5) become blur(7), not\nblur(2) blur(5).
    • \n
    • replace overwrites the previous value with the new one.
    • \n
    \n
    \n
    iterationComposite Optional
    \n
    \n

    Determines how values build from iteration to iteration in this animation. Can be\nset to accumulate or replace (see above). Defaults\nto replace.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string containing a pseudo-element selector, such as \"::before\". If present, the effect is applied to the selected pseudo-element of target, rather than to target itself.\n

    \n
    ", "sourceKeyFrames": "A KeyframeEffect object that you want to clone." } }, @@ -36363,7 +36540,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The pseudoElement property of a KeyframeEffect interface is a string representing the pseudo-element being animated. It may be null for animations that do not target a pseudo-element. It performs as both a getter and a setter, except with animations and transitions generated by CSS.\n
    \n

    Note:\nIf set to the legacy single-colon syntax of :before, :after, :first-letter, or :first-line, the string is transformed into its double-colon modern version (::before, ::after, ::first-letter, and ::first-line, respectively).\n

    ", + "doc": "The pseudoElement property of a KeyframeEffect interface is a string representing the pseudo-element being animated. It may be null for animations that do not target a pseudo-element. It performs as both a getter and a setter, except with animations and transitions generated by CSS.\n
    \n

    Note:\nIf set to the legacy single-colon syntax of :before, :after, :first-letter, or :first-line, the string is transformed into its double-colon modern version (::before, ::after, ::first-letter, and ::first-line, respectively).\n

    ", "throws": { "SyntaxError DOMException": "Thrown when trying to set this property to an element, an invalid pseudo-element (either non-existent or misspelled). The property is then left unchanged." } diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-index.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-index.json index 833ed0922ecd..a94dae7d6ccc 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-index.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-index.json @@ -4,8 +4,9 @@ "abstractrange.endoffset": "staticrange.endoffset", "abstractrange.startcontainer": "staticrange.startcontainer", "abstractrange.startoffset": "staticrange.startoffset", - "animationframeprovider.cancelanimationframe": "window.cancelanimationframe", - "animationframeprovider.requestanimationframe": "window.requestanimationframe", + "animatable.animate": "element.animate", + "animatable.getanimations": "element.getanimations", + "ariamixin.ariaactivedescendantelement": "elementinternals.ariaactivedescendantelement", "ariamixin.ariaatomic": "elementinternals.ariaatomic", "ariamixin.ariaautocomplete": "elementinternals.ariaautocomplete", "ariamixin.ariabraillelabel": "elementinternals.ariabraillelabel", @@ -16,25 +17,33 @@ "ariamixin.ariacolindex": "elementinternals.ariacolindex", "ariamixin.ariacolindextext": "elementinternals.ariacolindextext", "ariamixin.ariacolspan": "elementinternals.ariacolspan", + "ariamixin.ariacontrolselements": "elementinternals.ariacontrolselements", "ariamixin.ariacurrent": "elementinternals.ariacurrent", + "ariamixin.ariadescribedbyelements": "elementinternals.ariadescribedbyelements", "ariamixin.ariadescription": "elementinternals.ariadescription", + "ariamixin.ariadetailselements": "elementinternals.ariadetailselements", "ariamixin.ariadisabled": "elementinternals.ariadisabled", + "ariamixin.ariaerrormessageelements": "elementinternals.ariaerrormessageelements", "ariamixin.ariaexpanded": "elementinternals.ariaexpanded", + "ariamixin.ariaflowtoelements": "elementinternals.ariaflowtoelements", "ariamixin.ariahaspopup": "elementinternals.ariahaspopup", "ariamixin.ariahidden": "elementinternals.ariahidden", "ariamixin.ariainvalid": "elementinternals.ariainvalid", "ariamixin.ariakeyshortcuts": "elementinternals.ariakeyshortcuts", "ariamixin.arialabel": "elementinternals.arialabel", + "ariamixin.arialabelledbyelements": "elementinternals.arialabelledbyelements", "ariamixin.arialevel": "elementinternals.arialevel", "ariamixin.arialive": "elementinternals.arialive", "ariamixin.ariamodal": "elementinternals.ariamodal", "ariamixin.ariamultiline": "elementinternals.ariamultiline", "ariamixin.ariamultiselectable": "elementinternals.ariamultiselectable", "ariamixin.ariaorientation": "elementinternals.ariaorientation", + "ariamixin.ariaownselements": "elementinternals.ariaownselements", "ariamixin.ariaplaceholder": "elementinternals.ariaplaceholder", "ariamixin.ariaposinset": "elementinternals.ariaposinset", "ariamixin.ariapressed": "elementinternals.ariapressed", "ariamixin.ariareadonly": "elementinternals.ariareadonly", + "ariamixin.ariarelevant": "elementinternals.ariarelevant", "ariamixin.ariarequired": "elementinternals.ariarequired", "ariamixin.ariaroledescription": "elementinternals.ariaroledescription", "ariamixin.ariarowcount": "elementinternals.ariarowcount", @@ -49,6 +58,14 @@ "ariamixin.ariavaluenow": "elementinternals.ariavaluenow", "ariamixin.ariavaluetext": "elementinternals.ariavaluetext", "ariamixin.role": "elementinternals.role", + "body.arraybuffer": "request.arraybuffer", + "body.blob": "request.blob", + "body.body": "request.body", + "body.bodyused": "request.bodyused", + "body.bytes": "request.bytes", + "body.formdata": "request.formdata", + "body.json": "request.json", + "body.text": "request.text", "canvascompositing.globalalpha": "offscreencanvasrenderingcontext2d.globalalpha", "canvascompositing.globalcompositeoperation": "offscreencanvasrenderingcontext2d.globalcompositeoperation", "canvasdrawimage.drawimage": "offscreencanvasrenderingcontext2d.drawimage", @@ -90,6 +107,7 @@ "canvasrect.clearrect": "offscreencanvasrenderingcontext2d.clearrect", "canvasrect.fillrect": "offscreencanvasrenderingcontext2d.fillrect", "canvasrect.strokerect": "offscreencanvasrenderingcontext2d.strokerect", + "canvassettings.getcontextattributes": "canvasrenderingcontext2d.getcontextattributes", "canvasshadowstyles.shadowblur": "offscreencanvasrenderingcontext2d.shadowblur", "canvasshadowstyles.shadowcolor": "offscreencanvasrenderingcontext2d.shadowcolor", "canvasshadowstyles.shadowoffsetx": "offscreencanvasrenderingcontext2d.shadowoffsetx", @@ -119,26 +137,38 @@ "canvastransform.transform": "offscreencanvasrenderingcontext2d.transform", "canvastransform.translate": "offscreencanvasrenderingcontext2d.translate", "canvasuserinterface.drawfocusifneeded": "canvasrenderingcontext2d.drawfocusifneeded", - "childnode.after": "documenttype.after", - "childnode.before": "documenttype.before", - "childnode.remove": "documenttype.remove", - "childnode.replacewith": "documenttype.replacewith", + "childnode.after": "element.after", + "childnode.before": "element.before", + "childnode.remove": "element.remove", + "childnode.replacewith": "element.replacewith", "credential.id": "publickeycredential.id", "cssgroupingrule.cssrules": "cssstylerule.cssrules", "cssgroupingrule.deleterule": "cssstylerule.deleterule", "cssgroupingrule.insertrule": "cssstylerule.insertrule", + "documentorshadowroot.activeelement": "shadowroot.activeelement", + "documentorshadowroot.adoptedstylesheets": "shadowroot.adoptedstylesheets", + "documentorshadowroot.elementfrompoint": "shadowroot.elementfrompoint", + "documentorshadowroot.elementsfrompoint": "shadowroot.elementsfrompoint", + "documentorshadowroot.fullscreenelement": "shadowroot.fullscreenelement", + "documentorshadowroot.getanimations": "shadowroot.getanimations", + "documentorshadowroot.pictureinpictureelement": "shadowroot.pictureinpictureelement", + "documentorshadowroot.pointerlockelement": "shadowroot.pointerlockelement", + "documentorshadowroot.stylesheets": "shadowroot.stylesheets", "domrect.height": "svgrect.height", "domrect.width": "svgrect.width", "domrect.x": "svgrect.x", "domrect.y": "svgrect.y", + "element.textcontent": "htmlscriptelement.textcontent", "elementcontenteditable.contenteditable": "htmlelement.contenteditable", "elementcontenteditable.enterkeyhint": "htmlelement.enterkeyhint", "elementcontenteditable.inputmode": "htmlelement.inputmode", "elementcontenteditable.iscontenteditable": "htmlelement.iscontenteditable", "elementcssinlinestyle.attributestylemap": "svgelement.attributestylemap", "elementcssinlinestyle.style": "svgelement.style", + "fontfacesource.fonts": "document.fonts", "htmlcollectionbase.item": "htmlcollection.item", "htmlcollectionbase.length": "htmlcollection.length", + "htmlelement.innertext": "htmlscriptelement.innertext", "htmlhyperlinkelementutils.hash": "htmlareaelement.hash", "htmlhyperlinkelementutils.host": "htmlareaelement.host", "htmlhyperlinkelementutils.hostname": "htmlareaelement.hostname", @@ -206,15 +236,18 @@ "navigatorplugins.pdfviewerenabled": "navigator.pdfviewerenabled", "navigatorplugins.plugins": "navigator.plugins", "navigatorstorage.storage": "navigator.storage", - "parentnode.append": "documentfragment.append", - "parentnode.childelementcount": "documentfragment.childelementcount", - "parentnode.children": "documentfragment.children", - "parentnode.firstelementchild": "documentfragment.firstelementchild", - "parentnode.lastelementchild": "documentfragment.lastelementchild", - "parentnode.prepend": "documentfragment.prepend", - "parentnode.queryselector": "documentfragment.queryselector", - "parentnode.queryselectorall": "documentfragment.queryselectorall", - "parentnode.replacechildren": "documentfragment.replacechildren", + "nondocumenttypechildnode.nextelementsibling": "element.nextelementsibling", + "nondocumenttypechildnode.previouselementsibling": "element.previouselementsibling", + "parentnode.append": "element.append", + "parentnode.childelementcount": "element.childelementcount", + "parentnode.children": "element.children", + "parentnode.firstelementchild": "element.firstelementchild", + "parentnode.lastelementchild": "element.lastelementchild", + "parentnode.prepend": "element.prepend", + "parentnode.queryselector": "element.queryselector", + "parentnode.queryselectorall": "element.queryselectorall", + "parentnode.replacechildren": "element.replacechildren", + "performanceentry.tojson": "performancepainttiming.tojson", "popoverinvokerelement.popovertargetaction": "htmlinputelement.popovertargetaction", "popoverinvokerelement.popovertargetelement": "htmlinputelement.popovertargetelement", "readablestreamgenericreader.cancel": "readablestreamdefaultreader.cancel", @@ -245,6 +278,7 @@ "set.keys": "highlight.keys", "set.size": "highlight.size", "set.values": "highlight.values", + "slottable.assignedslot": "text.assignedslot", "subtlecrypto.derivebits": "subtlecrypto.derivebits.derivebits", "subtlecrypto.derivekey": "subtlecrypto.derivekey.derivekey", "subtlecrypto.exportkey": "subtlecrypto.exportkey.exportkey", @@ -443,6 +477,7 @@ "webglrenderingcontextbase.stencilmaskseparate": "webglrenderingcontext.stencilmaskseparate", "webglrenderingcontextbase.stencilop": "webglrenderingcontext.stencilop", "webglrenderingcontextbase.stencilopseparate": "webglrenderingcontext.stencilopseparate", + "webglrenderingcontextbase.unpackcolorspace": "webglrenderingcontext.unpackcolorspace", "webglrenderingcontextbase.useprogram": "webglrenderingcontext.useprogram", "webglrenderingcontextbase.validateprogram": "webglrenderingcontext.validateprogram", "webglrenderingcontextbase.vertexattribpointer": "webglrenderingcontext.vertexattribpointer", diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-l.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-l.json index 10432999373d..8bb260e81999 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-l.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-l.json @@ -19,7 +19,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LanguageDetector interface of the Translator and Language Detector APIs contains all the language detection functionality, including checking AI model availability, creating a new LanguageDetector instance, using it to detect a language, and more." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LanguageDetector interface of the Translator and Language Detector APIs contains all the language detection functionality, including checking AI model availability, creating a new LanguageDetector instance, using it to detect a language, and more." }, "languagedetector.availability": { "url": "$MDN_URL$/web/api/languagedetector/availability_static", @@ -31,7 +31,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the LanguageDetector interface returns an enumerated value that indicates whether the browser AI model supports a given LanguageDetector configuration.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the LanguageDetector interface returns an enumerated value that indicates whether the browser AI model supports a given LanguageDetector configuration.", "parameters": { "options": "An object specifying configuration options for the LanguageDetector. Possible values include:\n

    \n
    expectedInputLanguages
    \n
    \n

    An array of strings specifying the expected languages of the input text to have its language detected. These should be valid BCP 47 language tags. Defaults to [\"en\"]\n

    \n
    " }, @@ -52,9 +52,9 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the LanguageDetector interface creates a new LanguageDetector instance to detect languages.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the LanguageDetector interface creates a new LanguageDetector instance to detect languages.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", "parameters": { - "options": "An object specifying configuration options for the LanguageDetector. Possible values include:\n
    \n
    expectedInputLanguages
    \n
    \n

    An array of strings specifying the expected languages of the input text, which helps improve the accuracy of the language detection. These should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    monitor Optional
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance, which allows the create() operation to be aborted via the associated AbortController.\n

    \n
    " + "options": "An object specifying configuration options for the LanguageDetector. Possible values include:\n
    \n
    expectedInputLanguages
    \n
    \n

    An array of strings specifying the expected languages of the input text, which helps improve the accuracy of the language detection. These should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    monitor Optional
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance, which allows a create() operation to be aborted via the associated AbortController. The exact effect is dependant on when AbortController.abort() is called:\n

      \n
    • If abort() is called before the create() promise resolves, the create() operation is cancelled.
    • \n
    • If abort() is called after the create() promise fulfills, it has the same effect as calling LanguageDetector.destroy(): The resources assigned to the resulting LanguageDetector instance are released, and any ongoing and subsequent LanguageDetector method calls will reject with an AbortError.
    • \n
    \n
    \n
    " }, "returns": "A Promise that fulfills with a LanguageDetector object instance.", "throws": { @@ -75,7 +75,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the LanguageDetector interface destroys the LanguageDetector instance it is called on. It makes sense to destroy these objects if they are no longer going to be used, as they tie up significant resources in their handling.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the LanguageDetector interface releases the resources assigned to the LanguageDetector instance it is called on and stops any further activity on it. This means that any ongoing and subsequent method calls made on the LanguageDetector will reject with an AbortError.\n

    It makes sense to destroy LanguageDetector objects if they are no longer being used, as they tie up significant resources in their handling.", "returns": "None (undefined)." }, "languagedetector.detect": { @@ -88,13 +88,14 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The detect() method of the LanguageDetector interface detects the closest matching language or languages that a given text string is most likely to be written in.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The detect() method of the LanguageDetector interface detects the closest matching language or languages that a given text string is most likely to be written in.", "parameters": { "input": "A string representing the text to have its language detected.", "options": "An object specifying configuration options for the detect() operation. Possible values include:\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the detect() operation to be aborted via the associated AbortController.\n

    \n
    " }, "returns": "A Promise that fulfills with an array of objects representing the detected languages. Each object contains the following properties:\n
    \n
    detectedLanguage
    \n
    \n

    A BCP 47 language tag representing the detected language.\n

    \n
    confidence
    \n
    \n

    A number between 0 and 1 representing the AI model's confidence that the detected language is correct.\n

    \n
    \n

    The sum of all the returned confidence values should theoretically be 1, however, it may be lower because very low confidence values are excluded from the results.\n

    The last array element returned will always have a detectedLanguage value of und — this is an abbreviation of \"undetermined\", and represents the probability that the text is not written in a language the model knows.", "throws": { + "AbortError DOMException": "Thrown if the LanguageDetector was previously destroyed (had LanguageDetector.destroy() called on it, or was aborted via its abort signal after creation).", "InvalidStateError DOMException": "Thrown if the current Document is not active.", "QuotaExceededError": "Thrown if the language detection operation exceeds the available inputQuota." } @@ -109,7 +110,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedInputLanguages read-only property of the LanguageDetector interface returns the expected languages to be detected in the input text. Specifying expected input languages helps improve the accuracy of the language detection.\n

    A LanguageDetector instance's expectedInputLanguages are set when creating it via a create() call." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedInputLanguages read-only property of the LanguageDetector interface returns the expected languages to be detected in the input text. Specifying expected input languages helps improve the accuracy of the language detection.\n

    A LanguageDetector instance's expectedInputLanguages are set when creating it via a create() call." }, "languagedetector.inputquota": { "url": "$MDN_URL$/web/api/languagedetector/inputquota", @@ -121,7 +122,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the LanguageDetector interface returns the input quota available to the browser for detecting languages." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the LanguageDetector interface returns the input quota available to the browser for detecting languages." }, "languagedetector.measureinputusage": { "url": "$MDN_URL$/web/api/languagedetector/measureinputusage", @@ -133,7 +134,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the LanguageDetector interface reports how much input quota would be used by a language detection operation for a given text input.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the LanguageDetector interface reports how much input quota would be used by a language detection operation for a given text input.", "parameters": { "input": "A string representing the input text you want an input usage measurement for.", "options": "An object specifying configuration options for the measureInputUsage() operation. Possible values include:\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the measureInputUsage() operation to be aborted via the associated AbortController.\n

    \n
    " @@ -155,10 +156,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The LargestContentfulPaint interface provides timing information about the largest image or text paint before user input on a web page." }, @@ -173,10 +177,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The element read-only property of the LargestContentfulPaint interface returns an object representing the Element that is the largest contentful paint." }, @@ -191,10 +198,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The id read-only property of the LargestContentfulPaint interface returns the ID of the element that is the largest contentful paint." }, @@ -209,10 +219,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The loadTime read-only property of the LargestContentfulPaint interface returns the time that the element was loaded." }, @@ -227,10 +240,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The renderTime read-only property of the LargestContentfulPaint interface represents the time that the element was rendered to the screen." }, @@ -245,10 +261,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The size read-only property of the LargestContentfulPaint interface returns the intrinsic size of the element that is the largest contentful paint.\n

    The size of the element is the width times height of the rectangle that this element creates on the screen." }, @@ -263,10 +282,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The toJSON() method of the LargestContentfulPaint interface is a serializer; it returns a JSON representation of the LargestContentfulPaint object.", "returns": "A JSON object that is the serialization of the LargestContentfulPaint object.\n

    The JSON doesn't contain the element property because it is of type Element, which doesn't provide a toJSON() operation." @@ -282,10 +304,13 @@ "Edge": "79", "Firefox": "122", "FirefoxAndroid": "122", - "Opera": "64" + "Opera": "64", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The url read-only property of the LargestContentfulPaint interface returns the request URL of the element, if the element is an image." }, @@ -576,7 +601,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LinearAccelerationSensor interface of the Sensor APIs provides on each reading the acceleration applied to the device along all three axes, but without the contribution of gravity.\n

    To use this sensor, the user must grant permission to the 'accelerometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LinearAccelerationSensor interface of the Sensor APIs provides on each reading the acceleration applied to the device along all three axes, but without the contribution of gravity.\n

    To use this sensor, the user must grant permission to the 'accelerometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." }, "linearaccelerationsensor.linearaccelerationsensor": { "url": "$MDN_URL$/web/api/linearaccelerationsensor/linearaccelerationsensor", @@ -592,7 +617,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LinearAccelerationSensor()\nconstructor creates a new LinearAccelerationSensor object which\nprovides on each reading the acceleration applied to the device along all three axes,\nbut without the contribution of gravity.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The LinearAccelerationSensor()\nconstructor creates a new LinearAccelerationSensor object which\nprovides on each reading the acceleration applied to the device along all three axes,\nbut without the contribution of gravity.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should\nbe taken, meaning the number of times per second that the\nreading event will be called. A whole number or decimal may be\nused, the latter for frequencies less than a second. The actual reading frequency\ndepends on device hardware and consequently may be less than requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or\n'screen'. The default is 'device'.\n

    \n
    " }, @@ -631,6 +656,8 @@ "Chrome": "20", "ChromeAndroid": "25", "Edge": "79", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "15", "Safari": "6", "SafariIOS": "6" @@ -963,14 +990,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Lock interface of the Web Locks API provides the name and mode of a lock.\nThis may be a newly requested lock that is received in the callback to LockManager.request(), or a record of an active or queued lock returned by LockManager.query()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Lock interface of the Web Locks API provides the name and mode of a lock.\nThis may be a newly requested lock that is received in the callback to LockManager.request(), or a record of an active or queued lock returned by LockManager.query()." }, "lock.mode": { "url": "$MDN_URL$/web/api/lock/mode", @@ -985,14 +1013,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mode read-only property of the Lock interface returns the access mode passed to LockManager.request() when the lock was requested.\nThe mode is either \"exclusive\" (the default) or \"shared\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The mode read-only property of the Lock interface returns the access mode passed to LockManager.request() when the lock was requested.\nThe mode is either \"exclusive\" (the default) or \"shared\"." }, "lock.name": { "url": "$MDN_URL$/web/api/lock/name", @@ -1007,14 +1036,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The name read-only property of\nthe Lock interface returns the name passed to\nLockManager.request selected when the lock was requested.\n

    The name of a lock is passed by script when the lock is requested. The name is selected\nby the developer to represent an abstract resource for which use is being coordinated\nacross multiple tabs, workers, or other code within the origin. For example, if only one\ntab of a web application should be synchronizing network resources with an offline\ndatabase, it could use a lock name such as \"net_db_sync\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The name read-only property of\nthe Lock interface returns the name passed to\nLockManager.request selected when the lock was requested.\n

    The name of a lock is passed by script when the lock is requested. The name is selected\nby the developer to represent an abstract resource for which use is being coordinated\nacross multiple tabs, workers, or other code within the origin. For example, if only one\ntab of a web application should be synchronizing network resources with an offline\ndatabase, it could use a lock name such as \"net_db_sync\"." }, "lockmanager": { "url": "$MDN_URL$/web/api/lockmanager", @@ -1029,14 +1059,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The LockManager interface of the Web Locks API provides methods for requesting a new Lock object and querying for an existing Lock object. To get an instance of LockManager, call navigator.locks." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The LockManager interface of the Web Locks API provides methods for requesting a new Lock object and querying for an existing Lock object. To get an instance of LockManager, call navigator.locks." }, "lockmanager.query": { "url": "$MDN_URL$/web/api/lockmanager/query", @@ -1051,14 +1082,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The query() method of the LockManager interface returns a Promise that resolves with an object containing information about held and pending locks.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The query() method of the LockManager interface returns a Promise that resolves with an object containing information about held and pending locks.", "returns": "A Promise that resolves with an object containing a snapshot of the LockManager state.\nThe object has the following properties:\n

    \n
    held
    \n
    \n

    An array of LockInfo objects for held locks.\n

    \n
    pending
    \n
    \n

    An array of LockInfo objects for pending lock requests.\n

    \n
    \n

    The LockInfo object can have the following properties:\n

    \n
    name
    \n
    \n

    The name passed to LockManager.request() when the lock was requested.\n

    \n
    mode
    \n
    \n

    The access mode passed to LockManager.request() when the lock was requested. The mode is either \"exclusive\" or \"shared\".\n

    \n
    clientId
    \n
    \n

    The unique identity of the context where LockManager.request() is called. This is the same value as Client.id.\n

    \n
    ", "throws": { "InvalidStateError DOMException": "Thrown if the environments document is not fully active.", @@ -1078,14 +1110,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The request() method of the LockManager interface requests a Lock object with parameters specifying its name and characteristics.\nThe requested Lock is passed to a callback, while the function itself returns a Promise that resolves (or rejects) with the result of the callback after the lock is released, or rejects if the request is aborted.\n

    The mode property of the options parameter may be either \"exclusive\" or \"shared\".\n

    Request an \"exclusive\" lock when it should only be held by one code instance at a time.\nThis applies to code in both tabs and workers. Use this to represent mutually exclusive access to a resource.\nWhen an \"exclusive\" lock for a given name is held, no other lock with the same name can be held.\n

    Request a \"shared\" lock when multiple instances of the code can share access to a resource.\nWhen a \"shared\" lock for a given name is held, other \"shared\" locks for the same name can be granted, but no \"exclusive\" locks with that name can be held or granted.\n

    This shared/exclusive lock pattern is common in database transaction architecture, for example to allow multiple simultaneous readers (each requests a \"shared\" lock) but only one writer (a single \"exclusive\" lock).\nThis is known as the readers-writer pattern.\nIn the IndexedDB API, this is exposed as \"readonly\" and \"readwrite\" transactions which have the same semantics.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The request() method of the LockManager interface requests a Lock object with parameters specifying its name and characteristics.\nThe requested Lock is passed to a callback, while the function itself returns a Promise that resolves (or rejects) with the result of the callback after the lock is released, or rejects if the request is aborted.\n

    The mode property of the options parameter may be either \"exclusive\" or \"shared\".\n

    Request an \"exclusive\" lock when it should only be held by one code instance at a time.\nThis applies to code in both tabs and workers. Use this to represent mutually exclusive access to a resource.\nWhen an \"exclusive\" lock for a given name is held, no other lock with the same name can be held.\n

    Request a \"shared\" lock when multiple instances of the code can share access to a resource.\nWhen a \"shared\" lock for a given name is held, other \"shared\" locks for the same name can be granted, but no \"exclusive\" locks with that name can be held or granted.\n

    This shared/exclusive lock pattern is common in database transaction architecture, for example to allow multiple simultaneous readers (each requests a \"shared\" lock) but only one writer (a single \"exclusive\" lock).\nThis is known as the readers-writer pattern.\nIn the IndexedDB API, this is exposed as \"readonly\" and \"readwrite\" transactions which have the same semantics.", "parameters": { "name": "An identifier for the lock you want to request.", "options": "An object describing characteristics of the lock you want to create.\nValid values are:\n

    \n
    mode Optional
    \n
    \n

    Either \"exclusive\" or \"shared\".\nThe default value is \"exclusive\".\n

    \n
    ifAvailable Optional
    \n
    \n

    If true, the lock request will only be granted if it is not already held.\nIf it cannot be granted, the callback will be invoked with null instead of a Lock instance.\nThe default value is false.\n

    \n
    steal Optional
    \n
    \n

    If true, then any held locks with the same name will be released, and the request will be granted, preempting any queued requests for it.\nThe default value is false.\n

    \n

    Warning:\nUse with care!\nCode that was previously running inside the lock continues to run, and may clash with the code that now holds the lock.\n

    \n
    \n
    signal Optional
    \n
    \n

    An AbortSignal (the signal property of an AbortController);\nif specified and the AbortController is aborted, the lock request is dropped if it was not already granted.\n

    \n
    ", @@ -1109,7 +1142,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Magnetometer interface of the Sensor APIs provides information about the magnetic field as detected by the device's primary magnetometer sensor.\n

    To use this sensor, the user must grant permission to the 'magnetometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Magnetometer interface of the Sensor APIs provides information about the magnetic field as detected by the device's primary magnetometer sensor.\n

    To use this sensor, the user must grant permission to the 'magnetometer' device sensor through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." }, "magnetometer.magnetometer": { "url": "$MDN_URL$/web/api/magnetometer/magnetometer", @@ -1121,7 +1154,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Magnetometer() constructor\ncreates a new Magnetometer object which returns information about the\nmagnetic field as detected by a device's primary magnetometer sensor.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Magnetometer() constructor\ncreates a new Magnetometer object which returns information about the\nmagnetic field as detected by a device's primary magnetometer sensor.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample should\nbe taken, meaning the number of times per second that the\nreading event will be called. A whole number or decimal may be\nused, the latter for frequencies less than a second. The actual reading frequency\ndepends on device hardware and consequently may be less than requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or\n'screen'. The default is 'device'.\n

    \n
    " }, @@ -1139,7 +1172,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The x read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's x-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The x read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's x-axis." }, "magnetometer.y": { "url": "$MDN_URL$/web/api/magnetometer/y", @@ -1151,7 +1184,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The y read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's y-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The y read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's y-axis." }, "magnetometer.z": { "url": "$MDN_URL$/web/api/magnetometer/z", @@ -1163,7 +1196,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The z read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's z-axis." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The z read-only property of the\nMagnetometer interface returns a number specifying\nthe magnetic field around the device's z-axis." }, "mathmlelement": { "url": "$MDN_URL$/web/api/mathmlelement", @@ -1203,7 +1236,7 @@ "baseline": { "level": "NONE" }, - "doc": "The attributeStyleMap read-only property of the MathMLElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the MathMLElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." + "doc": "The attributeStyleMap read-only property of the MathMLElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the MathMLElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." }, "mathmlelement.autofocus": { "url": "$MDN_URL$/web/api/mathmlelement/autofocus", @@ -1318,7 +1351,7 @@ "lowDate": "2023-01-12", "highDate": "2025-07-12" }, - "doc": "The read-only style property of the MathMLElement returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." + "doc": "The read-only style property of the MathMLElement interface returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." }, "mathmlelement.tabindex": { "url": "$MDN_URL$/web/api/mathmlelement/tabindex", @@ -1444,7 +1477,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaDeviceInfo interface of the Media Capture and Streams API contains information that describes a single media input or output device.\n

    The list of devices obtained by calling navigator.mediaDevices.enumerateDevices() is an array of MediaDeviceInfo objects, one per media device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaDeviceInfo interface of the Media Capture and Streams API contains information that describes a single media input or output device.\n

    The list of devices obtained by calling navigator.mediaDevices.enumerateDevices() is an array of MediaDeviceInfo objects, one per media device." }, "mediadeviceinfo.deviceid": { "url": "$MDN_URL$/web/api/mediadeviceinfo/deviceid", @@ -1466,7 +1499,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deviceId read-only property\nof the MediaDeviceInfo interface returns a string\nthat is an identifier for the represented device and is persisted across\nsessions.\n

    It is un-guessable by other applications, and unique to the origin of\nthe calling application. It is reset when the user clears cookies. For private browsing,\na different identifier is used that is not persisted across sessions." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deviceId read-only property\nof the MediaDeviceInfo interface returns a string\nthat is an identifier for the represented device and is persisted across\nsessions.\n

    It is un-guessable by other applications, and unique to the origin of\nthe calling application. It is reset when the user clears cookies. For private browsing,\na different identifier is used that is not persisted across sessions." }, "mediadeviceinfo.groupid": { "url": "$MDN_URL$/web/api/mediadeviceinfo/groupid", @@ -1488,7 +1521,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The groupId read-only property of\nthe MediaDeviceInfo interface returns a string that\nis a group identifier.\n

    Two devices have the same group identifier if they\nbelong to the same physical device; for example, a monitor with both a built-in camera\nand microphone." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The groupId read-only property of\nthe MediaDeviceInfo interface returns a string that\nis a group identifier.\n

    Two devices have the same group identifier if they\nbelong to the same physical device; for example, a monitor with both a built-in camera\nand microphone." }, "mediadeviceinfo.kind": { "url": "$MDN_URL$/web/api/mediadeviceinfo/kind", @@ -1510,7 +1543,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The kind read-only property of\nthe MediaDeviceInfo interface returns an enumerated value, that is\neither \"videoinput\", \"audioinput\" or \"audiooutput\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The kind read-only property of\nthe MediaDeviceInfo interface returns an enumerated value, that is\neither \"videoinput\", \"audioinput\" or \"audiooutput\"." }, "mediadeviceinfo.label": { "url": "$MDN_URL$/web/api/mediadeviceinfo/label", @@ -1532,7 +1565,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The label read-only\nproperty of the MediaDeviceInfo interface returns a\nstring describing this device (for example\n\"External USB Webcam\").\n

    Only available during active MediaStream\nuse, or when persistent permissions have been granted." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The label read-only\nproperty of the MediaDeviceInfo interface returns a\nstring describing this device (for example\n\"External USB Webcam\").\n

    Only available during active MediaStream\nuse, or when persistent permissions have been granted." }, "mediadeviceinfo.tojson": { "url": "$MDN_URL$/web/api/mediadeviceinfo/tojson", @@ -1554,7 +1587,7 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the MediaDeviceInfo interface is a serializer; it returns a JSON representation of the MediaDeviceInfo object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the MediaDeviceInfo interface is a serializer; it returns a JSON representation of the MediaDeviceInfo object.", "returns": "A JSON object that is the serialization of the MediaDeviceInfo object." }, "mediadevices": { @@ -1577,7 +1610,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaDevices interface of the Media Capture and Streams API provides access to connected media input devices like cameras and microphones, as well as screen sharing. In essence, it lets you obtain access to any hardware source of media data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaDevices interface of the Media Capture and Streams API provides access to connected media input devices like cameras and microphones, as well as screen sharing. In essence, it lets you obtain access to any hardware source of media data." }, "mediadevices.enumeratedevices": { "url": "$MDN_URL$/web/api/mediadevices/enumeratedevices", @@ -1598,7 +1631,7 @@ "level": "LOW", "lowDate": "2023-08-01" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The enumerateDevices() method of the MediaDevices interface requests a list of the currently available media input and output devices, such as microphones, cameras, headsets, and so forth.\nThe returned Promise is resolved with an array of MediaDeviceInfo objects describing the devices.\n

    The returned list will omit any devices that are blocked by the document Permission Policy: microphone, camera, speaker-selection (for output devices), and so on.\nAccess to particular non-default devices is also gated by the Permissions API, and the list will omit devices for which the user has not granted explicit permission.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The enumerateDevices() method of the MediaDevices interface requests a list of the currently available media input and output devices, such as microphones, cameras, headsets, and so forth.\nThe returned Promise is resolved with an array of MediaDeviceInfo objects describing the devices.\n

    The returned list will omit any devices that are blocked by the document Permission Policy: microphone, camera, speaker-selection (for output devices), and so on.\nAccess to particular non-default devices is also gated by the Permissions API, and the list will omit devices for which the user has not granted explicit permission.", "returns": "A Promise that is fulfilled with an array of MediaDeviceInfo objects.\nEach object in the array describes one of the available media input and output devices.\nThe order is significant — the default capture devices will be listed first.\n

    Other than default devices, only devices for which permission has been granted are \"available\".\n

    If the media device is an input device, an InputDeviceInfo object will be returned instead.\n

    If enumeration fails, the promise is rejected." }, "mediadevices.getdisplaymedia": { @@ -1616,7 +1649,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getDisplayMedia() method of the MediaDevices interface prompts the user to select and grant permission to capture the contents of a display or portion thereof (such as a window) as a MediaStream.\n

    The resulting stream can then be recorded using the MediaStream Recording API or transmitted as part of a WebRTC session.\n

    See Using the Screen Capture API for more details and an example.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getDisplayMedia() method of the MediaDevices interface prompts the user to select and grant permission to capture the contents of a display or portion thereof (such as a window) as a MediaStream.\n

    The resulting stream can then be recorded using the MediaStream Recording API or transmitted as part of a WebRTC session.\n

    See Using the Screen Capture API for more details and an example.", "parameters": { "options": "An object specifying requirements for the returned MediaStream.\nThe options for getDisplayMedia() work in the same as the constraints for the MediaDevices.getUserMedia() method, although in that case only audio and video can be specified.\nThe list of possible option properties for getDisplayMedia() is as follows:\n

    \n
    video Optional
    \n
    \n

    A boolean or a MediaTrackConstraints instance; the default value is true.\nIf this option is omitted or set to true, the returned MediaStream will contain a video track.\nSince getDisplayMedia() requires a video track, if this option is set to false the promise will reject with a TypeError.\n

    \n
    audio Optional
    \n
    \n

    A boolean or a MediaTrackConstraints instance; the default value is false.\nA value of true indicates that the returned MediaStream will contain an audio track, if audio is supported and available for the display surface chosen by the user.\n

    \n
    controller Optional
    \n
    \n

    A CaptureController object instance containing methods that can be used to further manipulate the capture session if included.\n

    \n
    monitorTypeSurfaces Optional
    \n
    \n

    An enumerated value specifying whether the browser should offer entire screens in the screen capture options presented to the user alongside tab and window options.\nThis option is intended to protect companies from leakage of private information through employee error when using video conferencing apps.\nPossible values are:\n

      \n
    • include: Hints that the browser should include screen options.
    • \n
    • exclude: Hints that screen options should be excluded.
    • \n
    \n
    \n

    Note:\nYou cannot set monitorTypeSurfaces: \"exclude\" at the same time as displaySurface: \"monitor\" as the two settings are contradictory.\nTrying to do so will result in the getDisplayMedia() call failing with a TypeError.\n

    \n
    \n
    preferCurrentTab Optional
    \n
    \n

    A boolean; a value of true instructs the browser to offer the current tab as the most prominent capture source, that is, as a separate \"This Tab\" option in the \"Choose what to share\" options presented to the user.\nThis is useful as many app types generally just want to share the current tab.\nFor example, a slide deck app might want to let the user stream the current tab containing the presentation to a virtual conference.\n

    \n
    selfBrowserSurface Optional
    \n
    \n

    An enumerated value specifying whether the browser should allow the user to select the current tab for capture.\nThis helps to avoid the \"infinite hall of mirrors\" effect experienced when a video conferencing app inadvertently shares its own display.\nPossible values are:\n

      \n
    • include: Hints that the browser should include the current tab in the choices offered for capture.
    • \n
    • exclude: Hints that the current tab should be excluded from the choices.
    • \n
    \n
    \n
    surfaceSwitching Optional
    \n
    \n

    An enumerated value specifying whether the browser should display a control to allow the user to dynamically switch the shared tab during screen-sharing.\nThis is more convenient than having to go through the whole sharing process again each time a user wants to switch the shared tab.\nPossible values are:\n

      \n
    • include: Hints that the browser should include the control.
    • \n
    • exclude: Hints that the control should not be shown.
    • \n
    \n
    \n
    systemAudio Optional
    \n
    \n

    An enumerated value specifying whether the browser should include the system audio among the possible audio sources offered to the user.\nPossible values are:\n

      \n
    • include: Hints that the browser should include the system audio in the list of choices.
    • \n
    • exclude: Hints that system audio should be excluded from the choices shown.
    • \n
    \n
    \n
    windowAudio Optional
    \n
    \n

    An enumerated value that hints to the browser what audio sharing option the user should be presented with alongside window sharing options. Possible values are:\n

      \n
    • exclude: Hints that audio should not be shareable when a window sharing option is chosen.
    • \n
    • window: Hints that when a window sharing option is chosen, only audio originating from that window should be shared.
    • \n
    • system: Hints that when a window sharing option is chosen, all system audio should be shared.
    • \n
    \n
    \n
    " }, @@ -1651,7 +1684,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getSupportedConstraints() method of the MediaDevices interface returns an object based on the MediaTrackSupportedConstraints dictionary, whose member fields each specify one of the constrainable properties the user agent understands.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getSupportedConstraints() method of the MediaDevices interface returns an object based on the MediaTrackSupportedConstraints dictionary, whose member fields each specify one of the constrainable properties the user agent understands.", "returns": "A new object based on the MediaTrackSupportedConstraints dictionary listing the constraints supported by the user agent.\nBecause only constraints supported by the user agent are included in the list, each of these Boolean properties has the value true." }, "mediadevices.getusermedia": { @@ -1674,7 +1707,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getUserMedia() method of the MediaDevices interface prompts the user for permission to use a media input which produces a MediaStream with tracks containing the requested types of media.\n

    That stream can include, for example, a video track (produced by either a hardware or virtual video source such as a camera, video recording device, screen sharing service, and so forth), an audio track (similarly, produced by a physical or virtual audio source like a microphone, A/D converter, or the like), and possibly other track types.\n

    It returns a Promise that resolves to a MediaStream object.\nIf the user denies permission, or matching media is not available, then the promise is rejected with NotAllowedError or NotFoundError DOMException respectively.\n

    \n

    Note:\nIt's possible for the returned promise to neither resolve nor reject, as the user is not required to make a choice at all and may ignore the request.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getUserMedia() method of the MediaDevices interface prompts the user for permission to use a media input which produces a MediaStream with tracks containing the requested types of media.\n

    That stream can include, for example, a video track (produced by either a hardware or virtual video source such as a camera, video recording device, screen sharing service, and so forth), an audio track (similarly, produced by a physical or virtual audio source like a microphone, A/D converter, or the like), and possibly other track types.\n

    It returns a Promise that resolves to a MediaStream object.\nIf the user denies permission, or matching media is not available, then the promise is rejected with NotAllowedError or NotFoundError DOMException respectively.\n

    \n

    Note:\nIt's possible for the returned promise to neither resolve nor reject, as the user is not required to make a choice at all and may ignore the request.\n

    ", "parameters": { "constraints": "An object specifying the types of media to request, along with any requirements for each type.\n

    The constraints parameter is an object with two members: video and audio, describing the media types requested.\nEither or both must be specified.\nIf the browser cannot find all media tracks with the specified types that meet the constraints given, then the returned promise is rejected with NotFoundError DOMException.\n

    For both video and audio, its value is either a boolean or an object.\nThe default value is false.\n

    " }, @@ -1699,7 +1732,7 @@ "compatibility": { "Firefox": "116" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The selectAudioOutput() method of the MediaDevices interface prompts the user to select an audio output device, such as a speaker or headset. If the user selects a device, the method grants user permission to use the selected device as an audio output sink.\n

    Following selection, if the device is available it can be enumerated using MediaDevices.enumerateDevices() and set as the audio output sink using HTMLMediaElement.setSinkId().\n

    On success, the returned Promise is resolved with a MediaDeviceInfo describing the selected device.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The selectAudioOutput() method of the MediaDevices interface prompts the user to select an audio output device, such as a speaker or headset. If the user selects a device, the method grants user permission to use the selected device as an audio output sink.\n

    Following selection, if the device is available it can be enumerated using MediaDevices.enumerateDevices() and set as the audio output sink using HTMLMediaElement.setSinkId().\n

    On success, the returned Promise is resolved with a MediaDeviceInfo describing the selected device.", "parameters": { "options": "An object that configures what device(s) may be offered in the user prompt.\n

    \n
    deviceId Optional
    \n
    \n

    A string representing the ID of a single previously exposed/permitted device.\nIf not set, a prompt with all available audio output devices will be displayed.\n

    The option is intended for applications that want to store a device id so that the same device can be used by default in future sessions.\nNote that the method may return a new ID for the same device, and that persisted ids must be passed through selectAudioOutput() successfully before they will work with setSinkId().\n

    \n

    Note:\nA user agent may choose to skip prompting the user if a specified non-null id was previously exposed to the user by selectAudioOutput() in an earlier session.\nIn this case the user agent may simply resolve with this device id, or a new id for the same device if it has changed.\nIf permission for the specified device was previously granted but has since been revoked, the user-agent might display all allowed devices, highlighting the one with the specified ID.\n

    \n
    \n
    " }, @@ -1960,7 +1993,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent interface of the Encrypted Media Extensions API contains the content and related data when the content decryption module generates a message for the session." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent interface of the Encrypted Media Extensions API contains the content and related data when the content decryption module generates a message for the session." }, "mediakeymessageevent.mediakeymessageevent": { "url": "$MDN_URL$/web/api/mediakeymessageevent/mediakeymessageevent", @@ -1982,7 +2015,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent constructor creates a new MediaKeyMessageEvent object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent constructor creates a new MediaKeyMessageEvent object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to message.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    messageType
    \n
    \n

    A message type that allows applications to differentiate messages without parsing them.\nAllowed values are: license-request, license-renewal, license-renewal, or individualization-request.\n

    \n
    message
    \n
    \n

    An array containing the message generated by the content decryption module.\n

    \n
    " @@ -2009,7 +2042,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent.message read-only property\nreturns an ArrayBuffer with a message from the content decryption module.\nMessages vary by key system." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent.message read-only property\nreturns an ArrayBuffer with a message from the content decryption module.\nMessages vary by key system." }, "mediakeymessageevent.messagetype": { "url": "$MDN_URL$/web/api/mediakeymessageevent/messagetype", @@ -2031,7 +2064,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent.messageType read-only property indicates the\ntype of message. It may be one of license-request,\nlicense-renewal, license-release, or\nindividualization-request." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyMessageEvent.messageType read-only property indicates the\ntype of message. It may be one of license-request,\nlicense-renewal, license-release, or\nindividualization-request." }, "mediakeys": { "url": "$MDN_URL$/web/api/mediakeys", @@ -2053,7 +2086,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeys interface of Encrypted Media Extensions API represents a set of keys that an associated HTMLMediaElement can use for decryption of media data during playback." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeys interface of Encrypted Media Extensions API represents a set of keys that an associated HTMLMediaElement can use for decryption of media data during playback." }, "mediakeys.createsession": { "url": "$MDN_URL$/web/api/mediakeys/createsession", @@ -2075,7 +2108,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createSession() method of the MediaKeys interface returns a new MediaKeySession object, which represents a context for message exchange with a content decryption module (CDM).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createSession() method of the MediaKeys interface returns a new MediaKeySession object, which represents a context for message exchange with a content decryption module (CDM).", "parameters": { "mediaKeySessionType": "A string. Either \"temporary\" or \"persistent-license\". The default value is \"temporary\"." }, @@ -2097,7 +2130,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getStatusForPolicy() method of the MediaKeys interface is used to check whether the Content Decryption Module (CDM) would allow the presentation of encrypted media data using the keys, based on the specified policy requirements.\n

    The method returns a Promise that resolves with a string that indicates the status of the key with respect to all the specified policy requirements.\nIf the value resolves to \"usable\" then the content can be decrypted and presented at the ideal quality.\nOther values indicate reasons why the keys cannot be used for presenting the content; in some cases they hint at fallback options, such as playing the content at a lower quality.\n

    The policy restrictions currently only include a restriction on the minimum supported HDCP version.\n

    Note that the method checks a \"hypothetical key\" against the restrictions.\nThe application does not need to first create a real key and fetch a real license using MediaKeySession, and the MediaKeys doesn't even have to be attached to audio or video elements.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getStatusForPolicy() method of the MediaKeys interface is used to check whether the Content Decryption Module (CDM) would allow the presentation of encrypted media data using the keys, based on the specified policy requirements.\n

    The method returns a Promise that resolves with a string that indicates the status of the key with respect to all the specified policy requirements.\nIf the value resolves to \"usable\" then the content can be decrypted and presented at the ideal quality.\nOther values indicate reasons why the keys cannot be used for presenting the content; in some cases they hint at fallback options, such as playing the content at a lower quality.\n

    The policy restrictions currently only include a restriction on the minimum supported HDCP version.\n

    Note that the method checks a \"hypothetical key\" against the restrictions.\nThe application does not need to first create a real key and fetch a real license using MediaKeySession, and the MediaKeys doesn't even have to be attached to audio or video elements.", "parameters": { "policy": "An object with the following optional properties:\n

    \n
    minHdcpVersion Optional
    \n
    \n

    A string indicating the semantic version of the minimum HDCP version to check for usability, such as 1.0, 1.4, 2.2, 2.3.\n

    \n
    " }, @@ -2127,7 +2160,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setServerCertificate() method of the MediaKeys interface provides a server certificate to be used to encrypt messages to the license server.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setServerCertificate() method of the MediaKeys interface provides a server certificate to be used to encrypt messages to the license server.", "parameters": { "serverCertificate": "An ArrayBuffer, a TypedArray, or a DataView object containing the server certificate.\nThe contents are Key System-specific. It MUST NOT contain executable code." }, @@ -2153,7 +2186,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySession interface of the Encrypted Media Extensions API represents a context for message exchange with a content decryption module (CDM)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySession interface of the Encrypted Media Extensions API represents a context for message exchange with a content decryption module (CDM)." }, "mediakeysession.close": { "url": "$MDN_URL$/web/api/mediakeysession/close", @@ -2175,7 +2208,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The close() method of the MediaKeySession interface notifies that the current media session is no longer needed, and that the content decryption module should release any resources associated with this object and close it.\nThen, it returns a Promise.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The close() method of the MediaKeySession interface notifies that the current media session is no longer needed, and that the content decryption module should release any resources associated with this object and close it.\nThen, it returns a Promise.", "returns": "A Promise." }, "mediakeysession.closed": { @@ -2198,7 +2231,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The closed read-only property of the MediaKeySession interface returns a Promise signaling when a MediaKeySession closes.\nThis promise can only be fulfilled and is never rejected.\nClosing a session means that licenses and keys associated with it are no longer valid for decrypting media data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The closed read-only property of the MediaKeySession interface returns a Promise signaling when a MediaKeySession closes.\nThis promise can only be fulfilled and is never rejected.\nClosing a session means that licenses and keys associated with it are no longer valid for decrypting media data." }, "mediakeysession.expiration": { "url": "$MDN_URL$/web/api/mediakeysession/expiration", @@ -2220,7 +2253,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expiration read-only property of the MediaKeySession interface returns the time after which the keys in the current session can no longer be used to decrypt media data, or NaN if no such time exists.\n

    This value is determined by the CDM and measured in milliseconds since January 1, 1970, UTC.\nThis value may change during a session lifetime, such as when an action triggers the start of a window." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expiration read-only property of the MediaKeySession interface returns the time after which the keys in the current session can no longer be used to decrypt media data, or NaN if no such time exists.\n

    This value is determined by the CDM and measured in milliseconds since January 1, 1970, UTC.\nThis value may change during a session lifetime, such as when an action triggers the start of a window." }, "mediakeysession.generaterequest": { "url": "$MDN_URL$/web/api/mediakeysession/generaterequest", @@ -2242,7 +2275,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The generateRequest() method of the MediaKeySession interface returns a Promise after generating a license request based on initialization data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The generateRequest() method of the MediaKeySession interface returns a Promise after generating a license request based on initialization data.", "parameters": { "initDataType": "A string that specifies the format of the initData parameter. This must be one of the following values:\n

    ", "initData": "Initialization data for the request, in the format specified by initDataType. It is an instance of any of the following types:\n" @@ -2275,7 +2308,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keyStatuses read-only property of the MediaKeySession interface returns a reference to a read-only MediaKeyStatusMap of the current session's keys and their statuses." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keyStatuses read-only property of the MediaKeySession interface returns a reference to a read-only MediaKeyStatusMap of the current session's keys and their statuses." }, "mediakeysession.load": { "url": "$MDN_URL$/web/api/mediakeysession/load", @@ -2297,7 +2330,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The load() method of the MediaKeySession interface returns a Promise that resolves to a boolean value after loading data for a specified session object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The load() method of the MediaKeySession interface returns a Promise that resolves to a boolean value after loading data for a specified session object.", "parameters": { "sessionId": "A unique string generated by the content description module for the current media object and its associated keys or licenses." }, @@ -2323,7 +2356,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The remove() method of the MediaKeySession interface returns a Promise after removing any session data associated with the current object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The remove() method of the MediaKeySession interface returns a Promise after removing any session data associated with the current object.", "returns": "A Promise that resolves to undefined." }, "mediakeysession.sessionid": { @@ -2346,7 +2379,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sessionId read-only property of the MediaKeySession interface contains a unique string generated by the content decryption module (CDM) for the current media object and its associated keys or licenses." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sessionId read-only property of the MediaKeySession interface contains a unique string generated by the content decryption module (CDM) for the current media object and its associated keys or licenses." }, "mediakeysession.update": { "url": "$MDN_URL$/web/api/mediakeysession/update", @@ -2368,7 +2401,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The update() method of the MediaKeySession interface loads messages and licenses to the CDM, and then returns a Promise.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The update() method of the MediaKeySession interface loads messages and licenses to the CDM, and then returns a Promise.", "parameters": { "response": "An instance that is either an ArrayBuffer, a TypedArray, or a DataView." }, @@ -2394,7 +2427,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyStatusMap interface of the Encrypted Media Extensions API is a read-only map of media key statuses by key IDs." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeyStatusMap interface of the Encrypted Media Extensions API is a read-only map of media key statuses by key IDs." }, "mediakeystatusmap.entries": { "url": "$MDN_URL$/web/api/mediakeystatusmap/entries", @@ -2466,7 +2499,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The get() method of the MediaKeyStatusMap interface returns the status value associated with the given key, or undefined if there is none.\n

    The status value indicates whether or not the specific key can be used for decryption.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The get() method of the MediaKeyStatusMap interface returns the status value associated with the given key, or undefined if there is none.\n

    The status value indicates whether or not the specific key can be used for decryption.", "parameters": { "key": "The key whose value you want returned." }, @@ -2492,7 +2525,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The has() method of the\nMediaKeyStatusMap interface returns a Boolean, asserting\nwhether a value has been associated with the given key.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The has() method of the\nMediaKeyStatusMap interface returns a Boolean, asserting\nwhether a value has been associated with the given key.", "parameters": { "key": "The key whose value you want returned" }, @@ -2541,7 +2574,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The size read-only property of\nthe MediaKeyStatusMap interface returns the number of key/value paIrs\nin the status map." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The size read-only property of\nthe MediaKeyStatusMap interface returns the number of key/value paIrs\nin the status map." }, "mediakeystatusmap.values": { "url": "$MDN_URL$/web/api/mediakeystatusmap/values", @@ -2586,7 +2619,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySystemAccess interface of the Encrypted Media Extensions API provides access to a Key System for decryption and/or a content protection provider. You can request an instance of this object using the Navigator.requestMediaKeySystemAccess() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySystemAccess interface of the Encrypted Media Extensions API provides access to a Key System for decryption and/or a content protection provider. You can request an instance of this object using the Navigator.requestMediaKeySystemAccess() method." }, "mediakeysystemaccess.createmediakeys": { "url": "$MDN_URL$/web/api/mediakeysystemaccess/createmediakeys", @@ -2608,7 +2641,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySystemAccess.createMediaKeys() method returns a\nPromise that resolves to a new MediaKeys object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MediaKeySystemAccess.createMediaKeys() method returns a\nPromise that resolves to a new MediaKeys object.", "returns": "A Promise." }, "mediakeysystemaccess.getconfiguration": { @@ -2631,7 +2664,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getConfiguration() method of the MediaKeySystemAccess interface returns an object with the supported combination of the following configuration options:\n

    \n
    initDataTypes Read only
    \n
    \n

    Returns a list of supported initialization data type names. An initialization data type is a string indicating the format of the initialization data.\n

    \n
    audioCapabilities Read only
    \n
    \n

    Returns a list of supported audio type and capability pairs.\n

    \n
    videoCapabilities Read only
    \n
    \n

    Returns a list of supported video type and capability pairs.\n

    \n
    distinctiveIdentifier Read only
    \n
    \n

    Indicates whether a persistent distinctive identifier is required.\n

    \n
    persistentState Read only
    \n
    \n

    Indicates whether the ability to persist state is required.\n

    \n
    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getConfiguration() method of the MediaKeySystemAccess interface returns an object with the supported combination of the following configuration options:\n

    \n
    initDataTypes Read only
    \n
    \n

    Returns a list of supported initialization data type names. An initialization data type is a string indicating the format of the initialization data.\n

    \n
    audioCapabilities Read only
    \n
    \n

    Returns a list of supported audio type and capability pairs.\n

    \n
    videoCapabilities Read only
    \n
    \n

    Returns a list of supported video type and capability pairs.\n

    \n
    distinctiveIdentifier Read only
    \n
    \n

    Indicates whether a persistent distinctive identifier is required.\n

    \n
    persistentState Read only
    \n
    \n

    Indicates whether the ability to persist state is required.\n

    \n
    ", "returns": "An object." }, "mediakeysystemaccess.keysystem": { @@ -2654,7 +2687,7 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keySystem read-only property of the MediaKeySystemAccess interface returns a string identifying the key system being used.\n

    This is the value that was passed to Navigator.requestMediaKeySystemAccess() when system access is requested." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keySystem read-only property of the MediaKeySystemAccess interface returns a string identifying the key system being used.\n

    This is the value that was passed to Navigator.requestMediaKeySystemAccess() when system access is requested." }, "medialist": { "url": "$MDN_URL$/web/api/medialist", @@ -2985,7 +3018,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "A MediaQueryList object stores information on a media query applied to a document, with support for both immediate and event-driven matching against the state of the document.\n

    You can create a MediaQueryList by calling matchMedia() on the window object. The resulting object handles sending notifications to listeners when the media query state changes (i.e., when the media query test starts or stops evaluating to true).\n

    This is very useful for adaptive design, since this makes it possible to observe a document to detect when its media queries change, instead of polling the values periodically, and allows you to programmatically make changes to a document based on media query status." + "doc": "A MediaQueryList object stores information on a media query applied to a document, with support for both immediate and event-driven matching against the state of the document.\n

    You can create a MediaQueryList by calling matchMedia() on the window object. The resulting object handles sending notifications to listeners when the media query state changes (i.e., when the media query test starts or stops evaluating to true).\n

    This is very useful for adaptive design, since this makes it possible to observe a document to detect when its media queries change, instead of polling the values periodically, and allows you to programmatically make changes to a document based on media query status." }, "mediaquerylist.addlistener": { "url": "$MDN_URL$/web/api/mediaquerylist/addlistener", @@ -4538,7 +4571,7 @@ "parameters": { "constraints": "A MediaTrackConstraints object listing the constraints to apply to the track's constrainable properties; any existing constraints are replaced with the new values specified, and any constrainable properties not included are restored to their default constraints.\nIf this parameter is omitted, all currently set custom constraints are cleared.\nThis object represents the basic set of constraints that must apply for the Promise to resolve.\nThe object may contain an advanced property containing an array of additional MediaTrackConstraints objects, which are treated as exact requires." }, - "returns": "A Promise which resolves when the constraints have been successfully applied.\nIf the constraints cannot be applied, the promise is rejected with a OverconstrainedError that is a DOMException whose name is OverconstrainedError with additional parameters, and, to indicate that the constraints could not be met.\nThis can happen if the specified constraints are too strict to find a match when attempting to configure the track." + "returns": "A Promise which resolves when the constraints have been successfully applied.\nIf the constraints cannot be applied, the promise is rejected with an OverconstrainedError that is a DOMException whose name is OverconstrainedError with additional parameters, and, to indicate that the constraints could not be met.\nThis can happen if the specified constraints are too strict to find a match when attempting to configure the track." }, "mediastreamtrack.clone": { "url": "$MDN_URL$/web/api/mediastreamtrack/clone", @@ -5452,7 +5485,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent interface of the Payment Request API enables a merchant to verify themselves as allowed to use a particular payment handler.\n

    Learn more about merchant validation." + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent interface of the Payment Request API enables a merchant to verify themselves as allowed to use a particular payment handler.\n

    Learn more about merchant validation." }, "merchantvalidationevent.complete": { "url": "$MDN_URL$/web/api/merchantvalidationevent/complete", @@ -5464,7 +5497,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent method complete() takes merchant-specific information previously received from the validationURL and uses it to validate the merchant.\n

    All you have to do is call complete() from your handler for the merchantvalidation event, passing in the data fetched from the validationURL.", + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent method complete() takes merchant-specific information previously received from the validationURL and uses it to validate the merchant.\n

    All you have to do is call complete() from your handler for the merchantvalidation event, passing in the data fetched from the validationURL.", "parameters": { "validationData or merchantSessionPromise": "An object containing the data needed to complete the merchant validation process, or a Promise which resolves to the validation data." }, @@ -5483,7 +5516,7 @@ "Safari": "12.1", "SafariIOS": "12.2" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent() constructor creates a new MerchantValidationEvent object. You should not have to create these events yourself; instead, just handle the merchantvalidation event.", + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent() constructor creates a new MerchantValidationEvent object. You should not have to create these events yourself; instead, just handle the merchantvalidation event.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to merchantvalidation.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    methodName Optional
    \n
    \n

    A string containing the payment method identifier for the payment handler being used. This is an empty string by default.\n

    \n
    validationURL Optional
    \n
    \n

    The URL from which to retrieve payment handler specific verification information used to validate the merchant. This is an empty string by default.\n

    \n
    " @@ -5504,7 +5537,7 @@ "Safari": "12.1", "SafariIOS": "12.2" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent property\nmethodName is a read-only value which returns a string\nindicating the payment method identifier which represents the payment handler that\nrequires merchant validation." + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent property\nmethodName is a read-only value which returns a string\nindicating the payment method identifier which represents the payment handler that\nrequires merchant validation." }, "merchantvalidationevent.validationurl": { "url": "$MDN_URL$/web/api/merchantvalidationevent/validationurl", @@ -5516,7 +5549,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent property\nvalidationURL is a read-only string value providing the\nURL from which to fetch the payment handler-specific data needed to validate the\nmerchant.\n

    This data should be passed into the complete() method to let the user agent complete the transaction." + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MerchantValidationEvent property\nvalidationURL is a read-only string value providing the\nURL from which to fetch the payment handler-specific data needed to validate the\nmerchant.\n

    This data should be passed into the complete() method to let the user agent complete the transaction." }, "messagechannel": { "url": "$MDN_URL$/web/api/messagechannel", @@ -5946,7 +5979,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIAccess interface of the Web MIDI API provides methods for listing MIDI input and output devices, and obtaining access to those devices.\n

    MIDIAccess is a transferable object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIAccess interface of the Web MIDI API provides methods for listing MIDI input and output devices, and obtaining access to those devices.\n

    MIDIAccess is a transferable object." }, "midiaccess.inputs": { "url": "$MDN_URL$/web/api/midiaccess/inputs", @@ -5963,7 +5996,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputs read-only property of the MIDIAccess interface provides access to any available MIDI input ports." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputs read-only property of the MIDIAccess interface provides access to any available MIDI input ports." }, "midiaccess.outputs": { "url": "$MDN_URL$/web/api/midiaccess/outputs", @@ -5980,7 +6013,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The outputs read-only property of the MIDIAccess interface provides access to any available MIDI output ports." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The outputs read-only property of the MIDIAccess interface provides access to any available MIDI output ports." }, "midiaccess.sysexenabled": { "url": "$MDN_URL$/web/api/midiaccess/sysexenabled", @@ -5997,7 +6030,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sysexEnabled read-only property of the MIDIAccess interface indicates whether system exclusive support is enabled on the current MIDIAccess instance." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sysexEnabled read-only property of the MIDIAccess interface indicates whether system exclusive support is enabled on the current MIDIAccess instance." }, "midiconnectionevent": { "url": "$MDN_URL$/web/api/midiconnectionevent", @@ -6014,7 +6047,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIConnectionEvent interface of the Web MIDI API is the event passed to the statechange event of the MIDIAccess interface and the statechange event of the MIDIPort interface. This occurs any time a new port becomes available, or when a previously available port becomes unavailable. For example, this event is fired whenever a MIDI device is either plugged in to or unplugged from a computer." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIConnectionEvent interface of the Web MIDI API is the event passed to the statechange event of the MIDIAccess interface and the statechange event of the MIDIPort interface. This occurs any time a new port becomes available, or when a previously available port becomes unavailable. For example, this event is fired whenever a MIDI device is either plugged in to or unplugged from a computer." }, "midiconnectionevent.midiconnectionevent": { "url": "$MDN_URL$/web/api/midiconnectionevent/midiconnectionevent", @@ -6031,7 +6064,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIConnectionEvent() constructor creates a new MIDIConnectionEvent object. Typically this constructor is not used as events are created when a new port becomes available, and the object is passed to the statechange event.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIConnectionEvent() constructor creates a new MIDIConnectionEvent object. Typically this constructor is not used as events are created when a new port becomes available, and the object is passed to the statechange event.", "parameters": { "type": "A string with one of \"connect\" or \"disconnect\".", "midiConnectionEventInit": "A dictionary including the following fields:\n

    \n
    port
    \n
    \n

    The MIDIPort instance representing the port that has connected or disconnected.\n

    \n
    bubbles Optional
    \n
    \n

    A boolean value indicating whether the event bubbles. The default is\nfalse.\n

    \n
    cancelable Optional
    \n
    \n

    A boolean value indicating whether the event can be cancelled. The\ndefault is false.\n

    \n
    composed Optional
    \n
    \n

    A boolean value indicating whether the event will trigger listeners\noutside of a shadow root (see Event.composed for more details). The\ndefault is false.\n

    \n
    " @@ -6052,7 +6085,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The port read-only property of the MIDIConnectionEvent interface returns the port that has been disconnected or connected." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The port read-only property of the MIDIConnectionEvent interface returns the port that has been disconnected or connected." }, "midiinput": { "url": "$MDN_URL$/web/api/midiinput", @@ -6069,7 +6102,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIInput interface of the Web MIDI API receives messages from a MIDI input port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIInput interface of the Web MIDI API receives messages from a MIDI input port." }, "midiinputmap": { "url": "$MDN_URL$/web/api/midiinputmap", @@ -6086,7 +6119,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIInputMap read-only interface of the Web MIDI API provides the set of MIDI input ports that are currently available.\n

    A MIDIInputMap instance is a read-only Map-like object, in which each key is the ID string for MIDI input, and the associated value is the corresponding MIDIInput object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIInputMap read-only interface of the Web MIDI API provides the set of MIDI input ports that are currently available.\n

    A MIDIInputMap instance is a read-only Map-like object, in which each key is the ID string for MIDI input, and the associated value is the corresponding MIDIInput object." }, "midimessageevent": { "url": "$MDN_URL$/web/api/midimessageevent", @@ -6103,7 +6136,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIMessageEvent interface of the Web MIDI API represents the event passed to the midimessage event of the MIDIInput interface. A midimessage event is fired every time a MIDI message is sent from a device represented by a MIDIInput, for example when a MIDI keyboard key is pressed, a knob is tweaked, or a slider is moved." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIMessageEvent interface of the Web MIDI API represents the event passed to the midimessage event of the MIDIInput interface. A midimessage event is fired every time a MIDI message is sent from a device represented by a MIDIInput, for example when a MIDI keyboard key is pressed, a knob is tweaked, or a slider is moved." }, "midimessageevent.data": { "url": "$MDN_URL$/web/api/midimessageevent/data", @@ -6120,7 +6153,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The data read-only property of the MIDIMessageEvent interface returns the MIDI data bytes of a single MIDI message." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The data read-only property of the MIDIMessageEvent interface returns the MIDI data bytes of a single MIDI message." }, "midimessageevent.midimessageevent": { "url": "$MDN_URL$/web/api/midimessageevent/midimessageevent", @@ -6137,7 +6170,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIMessageEvent() constructor creates a new MIDIMessageEvent object. Typically this constructor is not used as events are created when a MIDIInput finishes receiving one or more MIDI messages.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIMessageEvent() constructor creates a new MIDIMessageEvent object. Typically this constructor is not used as events are created when a MIDIInput finishes receiving one or more MIDI messages.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to MIDIMessageEvent.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    data
    \n
    \n

    A Uint8Array instance containing the data bytes of the MIDI message.\n

    \n
    " @@ -6159,7 +6192,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIOutput interface of the Web MIDI API provides methods to add messages to the queue of an output device, and to clear the queue of messages." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIOutput interface of the Web MIDI API provides methods to add messages to the queue of an output device, and to clear the queue of messages." }, "midioutput.clear": { "url": "$MDN_URL$/web/api/midioutput/clear", @@ -6172,7 +6205,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clear() method of the MIDIOutput interface clears the queue of messages being sent to the output device.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clear() method of the MIDIOutput interface clears the queue of messages being sent to the output device.", "returns": "None (undefined)." }, "midioutput.send": { @@ -6190,7 +6223,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The send() method of the MIDIOutput interface queues messages for the corresponding MIDI port. The message can be sent immediately, or with an optional timestamp to delay sending.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The send() method of the MIDIOutput interface queues messages for the corresponding MIDI port. The message can be sent immediately, or with an optional timestamp to delay sending.", "parameters": { "data": "A sequence of one or more valid MIDI messages. Each entry represents a single byte of data.", "timestamp": "A DOMHighResTimestamp with the time in milliseconds when the message should be sent (relative to Performance.timeOrigin)." @@ -6198,7 +6231,7 @@ "returns": "None (undefined).", "throws": { "TypeError": "Thrown if data is not a valid sequence, or does not contain a valid MIDI message.", - "InvalidAccessError DOMException": "Thrown if data is a system exclusive message, and the MIDIAccess did not enable exclusive access.", + "NotAllowedError DOMException": "Thrown if data is a system exclusive message, and the MIDIAccess did not enable exclusive access.", "InvalidStateError DOMException": "Thrown if the port is disconnected." } }, @@ -6217,7 +6250,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIOutputMap read-only interface of the Web MIDI API provides the set of MIDI output ports that are currently available.\n

    A MIDIOutputMap instance is a read-only Map-like object, in which each key is the ID string for MIDI output, and the associated value is the corresponding MIDIOutput object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIOutputMap read-only interface of the Web MIDI API provides the set of MIDI output ports that are currently available.\n

    A MIDIOutputMap instance is a read-only Map-like object, in which each key is the ID string for MIDI output, and the associated value is the corresponding MIDIOutput object." }, "midiport": { "url": "$MDN_URL$/web/api/midiport", @@ -6234,7 +6267,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIPort interface of the Web MIDI API represents a MIDI input or output port.\n

    A MIDIPort instance is created when a new MIDI device is connected. Therefore it has no constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The MIDIPort interface of the Web MIDI API represents a MIDI input or output port.\n

    A MIDIPort instance is created when a new MIDI device is connected. Therefore it has no constructor." }, "midiport.close": { "url": "$MDN_URL$/web/api/midiport/close", @@ -6251,7 +6284,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The close() method of the MIDIPort interface makes the access to the MIDI device connected to this MIDIPort unavailable.\n

    If the port is successfully closed a new MIDIConnectionEvent is queued to the MIDIPort statechange and MIDIAccess statechange events, and the MIDIPort.connection property is changed to \"closed\".", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The close() method of the MIDIPort interface makes the access to the MIDI device connected to this MIDIPort unavailable.\n

    If the port is successfully closed a new MIDIConnectionEvent is queued to the MIDIPort statechange and MIDIAccess statechange events, and the MIDIPort.connection property is changed to \"closed\".", "returns": "Returns a Promise which resolves once the port has been closed." }, "midiport.connection": { @@ -6269,7 +6302,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The connection read-only property of the MIDIPort interface returns the connection state of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The connection read-only property of the MIDIPort interface returns the connection state of the port." }, "midiport.id": { "url": "$MDN_URL$/web/api/midiport/id", @@ -6286,7 +6319,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the MIDIPort interface returns the unique ID of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the MIDIPort interface returns the unique ID of the port." }, "midiport.manufacturer": { "url": "$MDN_URL$/web/api/midiport/manufacturer", @@ -6303,7 +6336,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The manufacturer read-only property of the MIDIPort interface returns the manufacturer of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The manufacturer read-only property of the MIDIPort interface returns the manufacturer of the port." }, "midiport.name": { "url": "$MDN_URL$/web/api/midiport/name", @@ -6320,7 +6353,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The name read-only property of the MIDIPort interface returns the system name of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The name read-only property of the MIDIPort interface returns the system name of the port." }, "midiport.open": { "url": "$MDN_URL$/web/api/midiport/open", @@ -6337,10 +6370,10 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The open() method of the MIDIPort interface makes the MIDI device connected to this MIDIPort explicitly available.\n

    If the port is successfully opened a new MIDIConnectionEvent is queued to the MIDIPort statechange and MIDIAccess statechange events, and the MIDIPort.connection property is changed to \"open\".\n

    If the port is already open when this method is called, then the promise will resolve successfully.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The open() method of the MIDIPort interface makes the MIDI device connected to this MIDIPort explicitly available.\n

    If the port is successfully opened a new MIDIConnectionEvent is queued to the MIDIPort statechange and MIDIAccess statechange events, and the MIDIPort.connection property is changed to \"open\".\n

    If the port is already open when this method is called, then the promise will resolve successfully.", "returns": "A Promise which resolves once access to the port has been successfully obtained.", "throws": { - "InvalidAccessError DOMException": "The promise is rejected with this error if the port is unavailable and cannot be opened." + "NotAllowedError DOMException": "The promise is rejected with this error if the port is unavailable and cannot be opened." } }, "midiport.state": { @@ -6358,7 +6391,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The state read-only property of the MIDIPort interface returns the state of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The state read-only property of the MIDIPort interface returns the state of the port." }, "midiport.type": { "url": "$MDN_URL$/web/api/midiport/type", @@ -6375,7 +6408,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the MIDIPort interface returns the type of the port, indicating whether this is an input or output MIDI port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the MIDIPort interface returns the type of the port, indicating whether this is an input or output MIDI port." }, "midiport.version": { "url": "$MDN_URL$/web/api/midiport/version", @@ -6392,7 +6425,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The version read-only property of the MIDIPort interface returns the version of the port." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The version read-only property of the MIDIPort interface returns the version of the port." }, "mimetype": { "url": "$MDN_URL$/web/api/mimetype", @@ -6738,7 +6771,7 @@ "baseline": { "level": "NONE" }, - "doc": "The movementX read-only property of the MouseEvent interface provides the difference in the X coordinate of the mouse pointer between the given event and the previous mousemove event.\nIn other words, the value of the property is computed like this: currentEvent.movementX = currentEvent.screenX - previousEvent.screenX.\n

    \n

    Warning:\nBrowsers use different units for movementX and screenX than what the specification defines. Depending on the browser and operating system, the movementX units may be a physical pixel, a logical pixel, or a CSS pixel. You may want to avoid the movement properties, and instead calculate the delta between the current client values (screenX, screenY) and the previous client values.\n

    " + "doc": "The movementX read-only property of the MouseEvent interface provides the difference in the X coordinate of the mouse (or pointer) between the given move event and the previous move event of the same type.\n

    In other words, the value of the property is computed like this: currentEvent.movementX = currentEvent.screenX - previousEvent.screenX.\nThe value is zero for all events other than mousemove, pointermove, and pointerrawupdate.\n

    \n

    Warning:\nBrowsers use different units for movementX and screenX than what the specification defines.\nDepending on the browser and operating system, the movementX units may be a physical pixel, a logical pixel, or a CSS pixel. You may want to avoid the movement properties, and instead calculate the delta between the current client values (screenX, screenY) and the previous client values.\n

    " }, "mouseevent.movementy": { "url": "$MDN_URL$/web/api/mouseevent/movementy", @@ -6757,7 +6790,7 @@ "baseline": { "level": "NONE" }, - "doc": "The movementY read-only property of the MouseEvent interface provides the difference in the Y coordinate of the mouse pointer between the given event and the previous mousemove event.\nIn other words, the value of the property is computed like this: currentEvent.movementY = currentEvent.screenY - previousEvent.screenY.\n
    \n

    Warning:\nBrowsers use different units for movementY and screenY than what the specification defines. Depending on the browser and operating system, the movementY units may be a physical pixel, a logical pixel, or a CSS pixel. You may want to avoid the movement properties, and instead calculate the delta between the current client values (screenX, screenY) and the previous client values.\n

    " + "doc": "The movementY read-only property of the MouseEvent interface provides the difference in the Y coordinate of the mouse (or pointer) between the given move event and the previous move event of the same type.\n

    In other words, the value of the property is computed like this: currentEvent.movementY = currentEvent.screenY - previousEvent.screenY.\nThe value is zero for all events other than mousemove, pointermove, and pointerrawupdate.\n

    \n

    Warning:\nBrowsers use different units for movementY and screenY than what the specification defines.\nDepending on the browser and operating system, the movementY units may be a physical pixel, a logical pixel, or a CSS pixel.\nYou may want to avoid the movement properties, and instead calculate the delta between the current client values (screenX, screenY) and the previous client values.\n

    " }, "mouseevent.mozinputsource": { "url": "$MDN_URL$/web/api/mouseevent/mozinputsource", @@ -6827,7 +6860,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The pageX read-only property of the MouseEvent interface returns the X (horizontal) coordinate (in pixels) at which the mouse was clicked, relative to the left edge of the entire document.\nThis includes any portion of the document not currently visible.\n

    Being based on the edge of the document as it is, this property takes into account any horizontal scrolling of the page.\nFor example, if the page is scrolled such that 200 pixels of the left side of the document are scrolled out of view, and the mouse is clicked 100 pixels inward from the left edge of the view, the value returned by pageX will be 300.\n

    Originally, this property was defined as a long integer. The CSSOM View Module redefined it as a\ndouble float. See the Browser compatibility section for\ndetails.\n

    See Coordinate systems for additional information about coordinates specified in this fashion." + "doc": "The pageX read-only property of the MouseEvent interface returns the X (horizontal) coordinate (in pixels) at which the mouse was clicked, relative to the left edge of the entire document.\nThis includes any portion of the document not currently visible.\n

    Being based on the edge of the document as it is, this property takes into account any horizontal scrolling of the page.\nFor example, if the page is scrolled such that 200 pixels of the left side of the document are scrolled out of view, and the mouse is clicked 100 pixels inward from the left edge of the view, the value returned by pageX will be 300.\n

    Originally, this property was defined as a long integer. The CSSOM View Module redefined it as a\ndouble float. See the Browser compatibility section for\ndetails.\n

    See Coordinate systems for additional information about coordinates specified in this fashion." }, "mouseevent.pagey": { "url": "$MDN_URL$/web/api/mouseevent/pagey", @@ -7053,7 +7086,7 @@ "prevValue": "A string representing the previous value of the modified node, if any. Sets the value of MutationEvent.prevValue.", "newValue": "A string representing the new value of the modified node, if any. Sets the value of MutationEvent.newValue.", "attrName": "A string representing the name of the Attr node changed, if any. Sets the value of MutationEvent.attrName.", - "attrChange": "A integer representing the reason attribute node changed. Sets the value of MutationEvent.attrChange." + "attrChange": "An integer representing the reason attribute node changed. Sets the value of MutationEvent.attrChange." }, "returns": "None (undefined)." }, @@ -7674,157 +7707,193 @@ "navigateevent": { "url": "$MDN_URL$/web/api/navigateevent", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigateEvent interface of the Navigation API is the event object for the navigate event, which fires when any type of navigation is initiated (this includes usage of History API features like History.go()). NavigateEvent provides access to information about that navigation, and allows developers to intercept and control the navigation handling." + "doc": "The NavigateEvent interface of the Navigation API is the event object for the navigate event, which fires when any type of navigation is initiated (this includes usage of History API features like History.go()). NavigateEvent provides access to information about that navigation, and allows developers to intercept and control the navigation handling." }, "navigateevent.canintercept": { "url": "$MDN_URL$/web/api/navigateevent/canintercept", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "105", "ChromeAndroid": "105", "Edge": "105", - "Opera": "91" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "91", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The canIntercept read-only property of the\nNavigateEvent interface returns true if the navigation can be intercepted and have its URL rewritten, or false otherwise\n

    There are several rules around when a navigation can be intercepted. For example:\n

    \n

    See the spec for more explanation on when a Document can have its URL rewritten, including a table of examples." + "doc": "The canIntercept read-only property of the\nNavigateEvent interface returns true if the navigation can be intercepted and have its URL rewritten, or false otherwise\n

    There are several rules around when a navigation can be intercepted. For example:\n

    \n

    See the spec for more explanation on when a Document can have its URL rewritten, including a table of examples." }, "navigateevent.destination": { "url": "$MDN_URL$/web/api/navigateevent/destination", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The destination read-only property of the\nNavigateEvent interface returns a NavigationDestination object representing the destination being navigated to." + "doc": "The destination read-only property of the\nNavigateEvent interface returns a NavigationDestination object representing the destination being navigated to." }, "navigateevent.downloadrequest": { "url": "$MDN_URL$/web/api/navigateevent/downloadrequest", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The downloadRequest read-only property of the\nNavigateEvent interface returns the filename of the file requested for download, in the case of a download navigation (e.g., an <a> or <area> element with a download attribute), or null otherwise." + "doc": "The downloadRequest read-only property of the\nNavigateEvent interface returns the filename of the file requested for download, in the case of a download navigation (e.g., an <a> or <area> element with a download attribute), or null otherwise." }, "navigateevent.formdata": { "url": "$MDN_URL$/web/api/navigateevent/formdata", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The formData read-only property of the\nNavigateEvent interface returns the FormData object representing the submitted data in the case of a POST form submission, or null otherwise." + "doc": "The formData read-only property of the\nNavigateEvent interface returns the FormData object representing the submitted data in the case of a POST form submission, or null otherwise." }, "navigateevent.hashchange": { "url": "$MDN_URL$/web/api/navigateevent/hashchange", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hashChange read-only property of the\nNavigateEvent interface returns true if the navigation is a fragment navigation (i.e., to a fragment identifier in the same document), or false otherwise." + "doc": "The hashChange read-only property of the\nNavigateEvent interface returns true if the navigation is a fragment navigation (i.e., to a fragment identifier in the same document), or false otherwise." }, "navigateevent.hasuavisualtransition": { "url": "$MDN_URL$/web/api/navigateevent/hasuavisualtransition", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "118", "ChromeAndroid": "118", "Edge": "118", - "Opera": "104" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "104", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The hasUAVisualTransition read-only property of the NavigateEvent interface returns true if the user agent performed a visual transition for this navigation before dispatching this event, or false otherwise.\n

    User agents may provide a built-in visual transition when executing site navigations. If the site author also adds a visual transition, user agent and author transitions may conflict and confuse a visitor. The property lets you detect whether a UA transition was provided so that you can skip author transitions for a better user experience." + "doc": "The hasUAVisualTransition read-only property of the NavigateEvent interface returns true if the user agent performed a visual transition for this navigation before dispatching this event, or false otherwise.\n

    User agents may provide a built-in visual transition when executing site navigations. If the site author also adds a visual transition, user agent and author transitions may conflict and confuse a visitor. The property lets you detect whether a UA transition was provided so that you can skip author transitions for a better user experience." }, "navigateevent.info": { "url": "$MDN_URL$/web/api/navigateevent/info", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The info read-only property of the\nNavigateEvent interface returns the info data value passed by the initiating navigation operation (e.g., Navigation.back(), or Navigation.navigate()), or undefined if no info data was passed." + "doc": "The info read-only property of the\nNavigateEvent interface returns the info data value passed by the initiating navigation operation (e.g., Navigation.back(), or Navigation.navigate()), or undefined if no info data was passed." }, "navigateevent.intercept": { "url": "$MDN_URL$/web/api/navigateevent/intercept", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "105", "ChromeAndroid": "105", "Edge": "105", - "Opera": "91" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "91", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The intercept() method of the\nNavigateEvent interface intercepts this navigation, turning it into a same-document navigation to the destination URL.", + "doc": "The intercept() method of the\nNavigateEvent interface intercepts this navigation, turning it into a same-document navigation to the destination URL.", "parameters": { - "options": "An options object containing the following properties:\n

    \n
    handler Optional
    \n
    \n

    A callback function that defines what the navigation handling behavior should be; it returns a promise. This function will run after the currentEntry property has been updated.\n

    \n
    precommitHandler Optional
    \n
    \n

    A callback function that defines any behavior that should occur just before the navigation has committed; it accepts a controller object as an argument and returns a promise. This function will run before the currentEntry property has been updated.\n

    \n
    focusReset Optional
    \n
    \n

    Defines the navigation's focus behavior. This may take one of the following values:\n

    \n
    after-transition
    \n
    \n

    Once the promise returned by your handler function resolves, the browser will focus the first element with the autofocus attribute, or the <body> element if no element has autofocus set. This is the default value.\n

    \n
    manual
    \n
    \n

    Disable the default behavior.\n

    \n
    \n
    \n
    scroll Optional
    \n
    \n

    Defines the navigation's scrolling behavior. This may take one of the following values:\n

    \n
    after-transition
    \n
    \n

    Allow the browser to handle scrolling, for example by scrolling to the relevant fragment identifier if the URL contains a fragment, or restoring the scroll position to the same place as last time if the page is reloaded or a page in the history is revisited. This is the default value.\n

    \n
    manual
    \n
    \n

    Disable the default behavior.\n

    \n
    \n
    \n
    " + "options": "An options object containing the following properties:\n
    \n
    handler Optional
    \n
    \n

    A callback function that defines what the navigation handling behavior should be; it returns a promise. This function will run after the currentEntry property has been updated.\n

    \n
    precommitHandler Optional
    \n
    \n

    A callback function that defines any behavior that should occur just before the navigation has committed; it accepts a NavigationPrecommitController object as an argument and returns a promise. This function will run before the currentEntry property has been updated.\n

    \n
    focusReset Optional
    \n
    \n

    Defines the navigation's focus behavior. This may take one of the following values:\n

    \n
    after-transition
    \n
    \n

    Once the promise returned by your handler function resolves, the browser will focus the first element with the autofocus attribute, or the <body> element if no element has autofocus set. This is the default value.\n

    \n
    manual
    \n
    \n

    Disable the default behavior.\n

    \n
    \n
    \n
    scroll Optional
    \n
    \n

    Defines the navigation's scrolling behavior. This may take one of the following values:\n

    \n
    after-transition
    \n
    \n

    Allow the browser to handle scrolling, for example by scrolling to the relevant fragment identifier if the URL contains a fragment, or restoring the scroll position to the same place as last time if the page is reloaded or a page in the history is revisited. This is the default value.\n

    \n
    manual
    \n
    \n

    Disable the default behavior.\n

    \n
    \n
    \n
    " }, "returns": "None (undefined).", "throws": { @@ -7835,19 +7904,23 @@ "navigateevent.navigateevent": { "url": "$MDN_URL$/web/api/navigateevent/navigateevent", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigateEvent() constructor creates a new NavigateEvent object instance.", + "doc": "The NavigateEvent() constructor creates a new NavigateEvent object instance.", "parameters": { "type": "A string representing the type of event.", "init": "An object that, in addition to the properties defined in Event(), has the following properties:\n

    \n
    canIntercept Optional
    \n
    \n

    A boolean defining whether the navigation can be intercepted or not (e.g., you can't intercept a cross-origin navigation). Defaults to false.\n

    \n
    destination
    \n
    \n

    A NavigationDestination object representing the location being navigated to.\n

    \n
    downloadRequest Optional
    \n
    \n

    The filename of the file requested for download, in the case of a download navigation (e.g., an <a> or <area> element with a download attribute). Defaults to null.\n

    \n
    formData Optional
    \n
    \n

    The FormData object representing the submitted data in the case of a POST form submission. Defaults to null.\n

    \n
    hashChange Optional
    \n
    \n

    A boolean defining if the navigation is a fragment navigation (i.e., to a fragment identifier in the same document). Defaults to false.\n

    \n
    hasUAVisualTransition Optional
    \n
    \n

    A boolean defining whether the user agent has performed a visual transition for this navigation before dispatching this event. Defaults to false.\n

    \n
    info Optional
    \n
    \n

    The info data value passed by the initiating navigation operation (e.g., Navigation.back(), or Navigation.navigate()).\n

    \n
    navigationType Optional
    \n
    \n

    The type of the navigation. Possible values — push, reload, replace, and traverse. Defaults to push.\n

    \n
    signal
    \n
    \n

    An AbortSignal, which will become aborted if the navigation is cancelled (e.g., by the user pressing the browser's \"Stop\" button, or another navigation starting and thus cancelling the ongoing one).\n

    \n
    sourceElement Optional
    \n
    \n

    An Element object representing the initiating element in cases where the navigation was initiated by an element, or null if the navigation was not initiated by an element. Defaults to null.\n

    \n
    userInitiated Optional
    \n
    \n

    A boolean defining whether the navigation was initiated by the user (e.g., by clicking a link, submitting a form, or pressing the browser's \"Back\"/\"Forward\" buttons). Defaults to false.\n

    \n
    " @@ -7857,36 +7930,44 @@ "navigateevent.navigationtype": { "url": "$MDN_URL$/web/api/navigateevent/navigationtype", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigationType read-only property of the\nNavigateEvent interface returns the type of the navigation — push, reload, replace, or traverse." + "doc": "The navigationType read-only property of the\nNavigateEvent interface returns the type of the navigation — push, reload, replace, or traverse." }, "navigateevent.scroll": { "url": "$MDN_URL$/web/api/navigateevent/scroll", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "105", "ChromeAndroid": "105", "Edge": "105", - "Opera": "91" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "91", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The scroll() method of the\nNavigateEvent interface can be called to manually trigger the browser-driven scrolling behavior that occurs in response to the navigation, if you want it to happen before the navigation handling has completed.", + "doc": "The scroll() method of the\nNavigateEvent interface can be called to manually trigger the browser-driven scrolling behavior that occurs in response to the navigation, if you want it to happen before the navigation handling has completed.", "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the current Document is not yet active, or if the navigation has been cancelled.", @@ -7896,100 +7977,124 @@ "navigateevent.signal": { "url": "$MDN_URL$/web/api/navigateevent/signal", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The signal read-only property of the\nNavigateEvent interface returns an AbortSignal, which will become aborted if the navigation is cancelled (e.g., by the user pressing the browser's \"Stop\" button, or another navigation starting and thus cancelling the ongoing one)." + "doc": "The signal read-only property of the\nNavigateEvent interface returns an AbortSignal, which will become aborted if the navigation is cancelled (e.g., by the user pressing the browser's \"Stop\" button, or another navigation starting and thus cancelling the ongoing one)." }, "navigateevent.sourceelement": { "url": "$MDN_URL$/web/api/navigateevent/sourceelement", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "135", + "ChromeAndroid": "135", "Edge": "135", - "Opera": "120" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "120", + "Safari": "26.2", + "SafariIOS": "26.2" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The sourceElement read-only property of the\nNavigateEvent interface returns an Element object representing the initiating element, in cases where the navigation was initiated by an element.\n

    The initiating element can be:\n

    " + "doc": "The sourceElement read-only property of the\nNavigateEvent interface returns an Element object representing the initiating element, in cases where the navigation was initiated by an element.\n

    The initiating element can be:\n

    " }, "navigateevent.userinitiated": { "url": "$MDN_URL$/web/api/navigateevent/userinitiated", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The userInitiated read-only property of the\nNavigateEvent interface returns true if the navigation was initiated by the user (e.g., by clicking a link, submitting a form, or pressing the browser's \"Back\"/\"Forward\" buttons), or false otherwise.\n

    \n

    Note:\nThe table found at Appendix: types of navigations shows which navigation types are user-initiated.\n

    " + "doc": "The userInitiated read-only property of the\nNavigateEvent interface returns true if the navigation was initiated by the user (e.g., by clicking a link, submitting a form, or pressing the browser's \"Back\"/\"Forward\" buttons), or false otherwise.\n
    \n

    Note:\nThe table found at Appendix: types of navigations shows which navigation types are user-initiated.\n

    " }, "navigation": { "url": "$MDN_URL$/web/api/navigation", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Navigation interface of the Navigation API allows control over all navigation actions for the current window in one central place, including initiating navigations programmatically, examining navigation history entries, and managing navigations as they happen.\n

    It is accessed via the Window.navigation property.\n

    The Navigation API only exposes history entries created in the current browsing context that have the same origin as the current page (e.g., not navigations inside embedded <iframe>s, or cross-origin navigations), providing an accurate list of all previous history entries just for your app. This makes traversing the history a much less fragile proposition than with the older History API." + "doc": "The Navigation interface of the Navigation API allows control over all navigation actions for the current window in one central place, including initiating navigations programmatically, examining navigation history entries, and managing navigations as they happen.\n

    It is accessed via the Window.navigation property.\n

    The Navigation API only exposes history entries created in the current browsing context that have the same origin as the current page (e.g., not navigations inside embedded <iframe>s, or cross-origin navigations), providing an accurate list of all previous history entries just for your app. This makes traversing the history a much less fragile proposition than with the older History API." }, "navigation.activation": { "url": "$MDN_URL$/web/api/navigation/activation", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "123", "ChromeAndroid": "123", "Edge": "123", - "Opera": "109" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "109", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The activation read-only property of the Navigation interface returns a NavigationActivation object containing information about the most recent cross-document navigation, which \"activated\" this Document. The property will stay constant during same-document navigations." + "doc": "The activation read-only property of the Navigation interface returns a NavigationActivation object containing information about the most recent cross-document navigation, which \"activated\" this Document. The property will stay constant during same-document navigations." }, "navigation.back": { "url": "$MDN_URL$/web/api/navigation/back", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The back() method of the\nNavigation interface navigates backwards by one entry in the navigation history.", + "doc": "The back() method of the\nNavigation interface navigates backwards by one entry in the navigation history.", "parameters": { "options": "An options object containing the following properties:\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info. This can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home). A string indicating which animation to use could be passed in as info.\n

    \n
    " }, @@ -8001,88 +8106,108 @@ "navigation.cangoback": { "url": "$MDN_URL$/web/api/navigation/cangoback", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The canGoBack read-only property of the\nNavigation interface returns true\nif it is possible to navigate backwards in the navigation history\n(i.e., the currentEntry is\nnot the first one in the history entry list),\nand false if it is not." + "doc": "The canGoBack read-only property of the\nNavigation interface returns true\nif it is possible to navigate backwards in the navigation history\n(i.e., the currentEntry is\nnot the first one in the history entry list),\nand false if it is not." }, "navigation.cangoforward": { "url": "$MDN_URL$/web/api/navigation/cangoforward", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The canGoForward read-only property of the\nNavigation interface returns true if it is possible to navigate forwards in the navigation history\n(i.e., the currentEntry is not the last one in the history entry list),\nand false if it is not." + "doc": "The canGoForward read-only property of the\nNavigation interface returns true if it is possible to navigate forwards in the navigation history\n(i.e., the currentEntry is not the last one in the history entry list),\nand false if it is not." }, "navigation.currententry": { "url": "$MDN_URL$/web/api/navigation/currententry", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The currentEntry read-only property of the\nNavigation interface returns a NavigationHistoryEntry object representing the location the user is currently navigated to right now." + "doc": "The currentEntry read-only property of the\nNavigation interface returns a NavigationHistoryEntry object representing the location the user is currently navigated to right now." }, "navigation.entries": { "url": "$MDN_URL$/web/api/navigation/entries", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The entries() method of the\nNavigation interface returns an array of NavigationHistoryEntry objects representing all existing history entries.", + "doc": "The entries() method of the\nNavigation interface returns an array of NavigationHistoryEntry objects representing all existing history entries.", "returns": "An array of NavigationHistoryEntry objects." }, "navigation.forward": { "url": "$MDN_URL$/web/api/navigation/forward", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The forward() method of the\nNavigation interface navigates forwards by one entry in the navigation history.", + "doc": "The forward() method of the\nNavigation interface navigates forwards by one entry in the navigation history.", "parameters": { "options": "An options object containing the following properties:\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info. This can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home). A string indicating which animation to use could be passed in as info.\n

    \n
    " }, @@ -8094,48 +8219,57 @@ "navigation.navigate": { "url": "$MDN_URL$/web/api/navigation/navigate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigate() method of the\nNavigation interface navigates to a specific URL, updating any provided state in the history entries list.", + "doc": "The navigate() method of the\nNavigation interface navigates to a specific URL, updating any provided state in the history entries list.", "parameters": { - "url": "The destination URL to navigate to. Note that when calling navigate() on a another window's navigation object, the URL will be resolved relative to the target window's URL, not the calling window's URL. This matches the behavior of the History API, but not the behavior of the Location API.", + "url": "The destination URL to navigate to. Note that when calling navigate() on another window's navigation object, the URL will be resolved relative to the target window's URL, not the calling window's URL. This matches the behavior of the History API, but not the behavior of the Location API. Note also that javascript: URLs are not allowed for security reasons.", "options": "An options object containing the following properties:\n

    \n
    state Optional
    \n
    \n

    Developer-defined information to be stored in the associated NavigationHistoryEntry once the navigation is complete, retrievable via getState(). This can be any data type. You might, for example, wish to store a page visit count for analytics purposes, or store UI state details so the view can be shown exactly as the user last left it. Any data stored in state must be structured-cloneable.\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info. This can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home). A string indicating which animation to use could be passed in as info.\n

    \n
    history Optional
    \n
    \n

    An enumerated value that sets the history behavior of this navigation. The available values are:\n

      \n
    • auto: The default value; will usually perform a push navigation but will perform a replace navigation under special circumstances (see the NotSupportedError description below).
    • \n
    • push: Will push a new NavigationHistoryEntry onto the entries list, or fail under special circumstances (see the NotSupportedError description below).
    • \n
    • replace: Will replace the current NavigationHistoryEntry.
    • \n
    \n
    \n
    " }, "returns": "An object with the following properties:\n
    \n
    committed
    \n
    \n

    A Promise which will fulfill when the visible URL has changed and a new NavigationHistoryEntry has been created.\n

    \n
    finished
    \n
    \n

    A Promise which will fulfill when all promises returned by the intercept() handler are fulfilled. This is equivalent to the NavigationTransition.finished promise fulfilling, when the navigatesuccess event fires.\n

    \n
    \n

    Either one of these promises rejects if the navigation has failed for some reason.", "throws": { - "DataCloneError DOMException": "Thrown if the state parameter had values included in it that are not structured-cloneable.", + "DataCloneError DOMException": "Thrown if the state parameter contains values that are not structured-cloneable.", + "InvalidStateError DOMException": "Thrown if the document is not currently active.", "SyntaxError DOMException": "Thrown if the url parameter is not a valid URL.", - "NotSupportedError DOMException": "Thrown if the history option is set to push, and any of the following special circumstances are true:\n

    " + "NotSupportedError DOMException": "Thrown if:\n" } }, "navigation.reload": { "url": "$MDN_URL$/web/api/navigation/reload", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The reload() method of the\nNavigation interface reloads the current URL, updating any provided state in the history entries list.", + "doc": "The reload() method of the Navigation interface reloads the current URL, updating any provided state in the history entries list.\n

    Note that reload() does not trigger the popstate event, as this is only fired for soft navigations that cause a \"traversal\" of the history entries.", "parameters": { - "options": "An options object containing the following properties:\n

    \n
    state Optional
    \n
    \n

    Developer-defined information to be stored in the associated NavigationHistoryEntry once the navigation is complete, retrievable via getState(). This can be any data type. You might, for example, wish to store a page visit count for analytics purposes, or store UI state details so the view can be shown exactly as the user last left it. Any data stored in state must be structured-cloneable.\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info. This can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home). A string indicating which animation to use could be passed in as info.\n

    \n
    " + "options": "An options object containing the following properties:\n
    \n
    state Optional
    \n
    \n

    Developer-defined information to be stored in the associated NavigationHistoryEntry once the navigation is complete, retrievable via getState().\nThis can be any data type. You might, for example, wish to store a page visit count for analytics purposes, or store UI state details so the view can be shown exactly as the user last left it.\nAny data stored in state must be structured-cloneable.\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info.\nThis can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home).\nA string indicating which animation to use may be passed in as info.\n

    \n
    " }, "returns": "An object with the following properties:\n
    \n
    committed
    \n
    \n

    A Promise which will fulfill when the visible URL has changed and a new NavigationHistoryEntry has been created.\n

    \n
    finished
    \n
    \n

    A Promise which will fulfill when all promises returned by the intercept() handler are fulfilled. This is equivalent to the NavigationTransition.finished promise fulfilling, when the navigatesuccess event fires.\n

    \n
    \n

    Either one of these promises rejects if the navigation has failed for some reason.", "throws": { @@ -8145,36 +8279,44 @@ "navigation.transition": { "url": "$MDN_URL$/web/api/navigation/transition", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The transition read-only property of the Navigation interface returns a NavigationTransition object representing the status of an in-progress navigation, which can be used to track it." + "doc": "The transition read-only property of the Navigation interface returns a NavigationTransition object representing the status of an in-progress navigation, which can be used to track it." }, "navigation.traverseto": { "url": "$MDN_URL$/web/api/navigation/traverseto", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The traverseTo() method of the Navigation interface navigates to the NavigationHistoryEntry identified by the given key.", + "doc": "The traverseTo() method of the Navigation interface navigates to the NavigationHistoryEntry identified by the given key.", "parameters": { "key": "The key of the NavigationHistoryEntry to navigate to.", "options": "An options object containing the following properties:\n

    \n
    info Optional
    \n
    \n

    Developer-defined information to be passed along to the navigate event, made available in NavigateEvent.info. This can be any data type. You might, for example, wish to display newly-navigated content with a different animation depending on how it was navigated to (swipe left, swipe right, or go home). A string indicating which animation to use could be passed in as info.\n

    \n
    " @@ -8187,19 +8329,23 @@ "navigation.updatecurrententry": { "url": "$MDN_URL$/web/api/navigation/updatecurrententry", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The updateCurrentEntry() method of the Navigation interface updates the state of the currentEntry; used in cases where the state change will be independent of a navigation or reload.", + "doc": "The updateCurrentEntry() method of the Navigation interface updates the state of the currentEntry; used in cases where the state change will be independent of a navigation or reload.", "parameters": { "options": "An options object containing the following properties:\n

    \n
    state
    \n
    \n

    Developer-defined information to be stored in the associated NavigationHistoryEntry once the navigation is complete, retrievable via getState(). This can be any data type. You might, for example, wish to store a page visit count for analytics purposes, or store UI state details so the view can be shown exactly as the user last left it. Any data stored in state must be structured-cloneable.\n

    \n
    " }, @@ -8212,121 +8358,149 @@ "navigationactivation": { "url": "$MDN_URL$/web/api/navigationactivation", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "123", "ChromeAndroid": "123", "Edge": "123", - "Opera": "109" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "109", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationActivation interface of the Navigation API represents a recent cross-document navigation. It contains the navigation type and outgoing and inbound document history entries.\n

    This object is accessed via the PageSwapEvent.activation and Navigation.activation properties. Note that, in each case, the NavigationActivation represents a different navigation:\n

    " + "doc": "The NavigationActivation interface of the Navigation API represents a recent cross-document navigation. It contains the navigation type and outgoing and inbound document history entries.\n

    This object is accessed via the PageSwapEvent.activation and Navigation.activation properties. Note that, in each case, the NavigationActivation represents a different navigation:\n

    " }, "navigationactivation.entry": { "url": "$MDN_URL$/web/api/navigationactivation/entry", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "123", "ChromeAndroid": "123", "Edge": "123", - "Opera": "109" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "109", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The entry read-only property of the NavigationActivation interface contains a NavigationHistoryEntry object representing the history entry for the inbound (\"to\") document in the navigation. This is equivalent to the Navigation.currentEntry property at the moment the inbound document was activated.\n

    There are some cases in which either the from or entry NavigationHistoryEntry objects would not be viable targets for the traverseTo() method, as they might not be retained in history. For example, the document can be activated using location.replace() or its initial entry could be replaced by history.replaceState(). However, those entries' url properties and getState() methods are still accessible." + "doc": "The entry read-only property of the NavigationActivation interface contains a NavigationHistoryEntry object representing the history entry for the inbound (\"to\") document in the navigation. This is equivalent to the Navigation.currentEntry property at the moment the inbound document was activated.\n

    There are some cases in which either the from or entry NavigationHistoryEntry objects would not be viable targets for the traverseTo() method, as they might not be retained in history. For example, the document can be activated using location.replace() or its initial entry could be replaced by history.replaceState(). However, those entries' url properties and getState() methods are still accessible." }, "navigationactivation.from": { "url": "$MDN_URL$/web/api/navigationactivation/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "123", "ChromeAndroid": "123", "Edge": "123", - "Opera": "109" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "109", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The from read-only property of the NavigationActivation interface contains a NavigationHistoryEntry object representing the history entry for the outgoing (\"from\") document in the navigation." + "doc": "The from read-only property of the NavigationActivation interface contains a NavigationHistoryEntry object representing the history entry for the outgoing (\"from\") document in the navigation." }, "navigationactivation.navigationtype": { "url": "$MDN_URL$/web/api/navigationactivation/navigationtype", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "123", "ChromeAndroid": "123", "Edge": "123", - "Opera": "109" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "109", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigationType read-only property of the NavigationActivation interface contains a string indicating the type of navigation." + "doc": "The navigationType read-only property of the NavigationActivation interface contains a string indicating the type of navigation." }, "navigationcurrententrychangeevent": { "url": "$MDN_URL$/web/api/navigationcurrententrychangeevent", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationCurrentEntryChangeEvent interface of the Navigation API is the event object for the currententrychange event, which fires when the Navigation.currentEntry has changed.\n

    This event will fire for same-document navigations (e.g., back() or traverseTo()), replacements (i.e., a navigate() call with history set to replace), or other calls that change the entry's state (e.g., updateCurrentEntry(), or the History API's History.replaceState()).\n

    This event fires after the navigation is committed, meaning that the visible URL has changed and the NavigationHistoryEntry update has occurred. It is useful for migrating from usage of older API features like the hashchange or popstate events." + "doc": "The NavigationCurrentEntryChangeEvent interface of the Navigation API is the event object for the currententrychange event, which fires when the Navigation.currentEntry has changed.\n

    This event will fire for same-document navigations (e.g., back() or traverseTo()), replacements (i.e., a navigate() call with history set to replace), or other calls that change the entry's state (e.g., updateCurrentEntry(), or the History API's History.replaceState()).\n

    This event fires after the navigation is committed, meaning that the visible URL has changed and the NavigationHistoryEntry update has occurred. It is useful for migrating from usage of older API features like the hashchange or popstate events." }, "navigationcurrententrychangeevent.from": { "url": "$MDN_URL$/web/api/navigationcurrententrychangeevent/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The from read-only property of the NavigationCurrentEntryChangeEvent interface returns the NavigationHistoryEntry that was navigated from." + "doc": "The from read-only property of the NavigationCurrentEntryChangeEvent interface returns the NavigationHistoryEntry that was navigated from." }, "navigationcurrententrychangeevent.navigationcurrententrychangeevent": { "url": "$MDN_URL$/web/api/navigationcurrententrychangeevent/navigationcurrententrychangeevent", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationCurrentEntryChangeEvent() constructor creates a new NavigationCurrentEntryChangeEvent object.", + "doc": "The NavigationCurrentEntryChangeEvent() constructor creates a new NavigationCurrentEntryChangeEvent object.", "parameters": { "type": "A string representing the type of event.", "init": "An object that, in addition to the properties defined in Event(), has the following properties:\n

    \n
    from
    \n
    \n

    A NavigationHistoryEntry object representing the location being navigated to.\n

    \n
    navigationType Optional
    \n
    \n

    The type of the navigation that resulted in the change. Possible values are push, reload, replace, and traverse. Defaults to null.\n

    \n
    " @@ -8336,225 +8510,317 @@ "navigationcurrententrychangeevent.navigationtype": { "url": "$MDN_URL$/web/api/navigationcurrententrychangeevent/navigationtype", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigationType read-only property of the NavigationCurrentEntryChangeEvent interface returns the type of the navigation that resulted in the change. The property may be null if the change occurs due to Navigation.updateCurrentEntry()." + "doc": "The navigationType read-only property of the NavigationCurrentEntryChangeEvent interface returns the type of the navigation that resulted in the change. The property may be null if the change occurs due to Navigation.updateCurrentEntry()." }, "navigationdestination": { "url": "$MDN_URL$/web/api/navigationdestination", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationDestination interface of the Navigation API represents the destination being navigated to in the current navigation.\n

    It is accessed via the NavigateEvent.destination property." + "doc": "The NavigationDestination interface of the Navigation API represents the destination being navigated to in the current navigation.\n

    It is accessed via the NavigateEvent.destination property." }, "navigationdestination.getstate": { "url": "$MDN_URL$/web/api/navigationdestination/getstate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getState() method of the\nNavigationDestination interface returns a clone of the developer-supplied state associated with the destination NavigationHistoryEntry, or navigation operation (e.g., navigate()) as appropriate.", + "doc": "The getState() method of the\nNavigationDestination interface returns a clone of the developer-supplied state associated with the destination NavigationHistoryEntry, or navigation operation (e.g., navigate()) as appropriate.", "returns": "A value representing the state. This can be any type.\n

    If no state is defined, it returns undefined." }, "navigationdestination.id": { "url": "$MDN_URL$/web/api/navigationdestination/id", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The id read-only property of the\nNavigationDestination interface returns the id value of the destination NavigationHistoryEntry if the NavigateEvent.navigationType is traverse, or an empty string otherwise.\n

    The id is a unique, UA-generated value that always represents the history entry, useful to correlate a history entry with an external resource such as a storage cache." + "doc": "The id read-only property of the\nNavigationDestination interface returns the id value of the destination NavigationHistoryEntry if the NavigateEvent.navigationType is traverse, or an empty string otherwise.\n

    The id is a unique, UA-generated value that always represents the history entry, useful to correlate a history entry with an external resource such as a storage cache." }, "navigationdestination.key": { "url": "$MDN_URL$/web/api/navigationdestination/key", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The key read-only property of the\nNavigationDestination interface returns the key value of the destination NavigationHistoryEntry if the NavigateEvent.navigationType is traverse, or an empty string otherwise.\n

    The key is a unique, UA-generated value that represents the history entry's slot in the history entries list, used to navigate to this place in the history via Navigation.traverseTo(). It will be reused by other entries that replace the entry in the list (i.e., if the NavigateEvent.navigationType is replace)." + "doc": "The key read-only property of the\nNavigationDestination interface returns the key value of the destination NavigationHistoryEntry if the NavigateEvent.navigationType is traverse, or an empty string otherwise.\n

    The key is a unique, UA-generated value that represents the history entry's slot in the history entries list, used to navigate to this place in the history via Navigation.traverseTo(). It will be reused by other entries that replace the entry in the list (i.e., if the NavigateEvent.navigationType is replace)." }, "navigationdestination.samedocument": { "url": "$MDN_URL$/web/api/navigationdestination/samedocument", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The sameDocument read-only property of the\nNavigationDestination interface returns true if the navigation is to the same document as the current Document value, or false otherwise.\n

    This is useful for checking whether the navigation will be same-document or cross-document." + "doc": "The sameDocument read-only property of the\nNavigationDestination interface returns true if the navigation is to the same document as the current Document value, or false otherwise.\n

    This is useful for checking whether the navigation will be same-document or cross-document." }, "navigationdestination.url": { "url": "$MDN_URL$/web/api/navigationdestination/url", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The url read-only property of the\nNavigationDestination interface returns the URL being navigated to." + "doc": "The url read-only property of the\nNavigationDestination interface returns the URL being navigated to." }, "navigationhistoryentry": { "url": "$MDN_URL$/web/api/navigationhistoryentry", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationHistoryEntry interface of the Navigation API represents a single navigation history entry.\n

    These objects are commonly accessed via the Navigation.currentEntry property and Navigation.entries() method.\n

    The Navigation API only exposes history entries created in the current browsing context that have the same origin as the current page (e.g., not navigations inside embedded <iframe>s, or cross-origin navigations), providing an accurate list of all previous history entries just for your app. This makes traversing the history a much less fragile proposition than with the older History API." + "doc": "The NavigationHistoryEntry interface of the Navigation API represents a single navigation history entry.\n

    These objects are commonly accessed via the Navigation.currentEntry property and Navigation.entries() method.\n

    The Navigation API only exposes history entries created in the current browsing context that have the same origin as the current page (e.g., not navigations inside embedded <iframe>s, or cross-origin navigations), providing an accurate list of all previous history entries just for your app. This makes traversing the history a much less fragile proposition than with the older History API." }, "navigationhistoryentry.getstate": { "url": "$MDN_URL$/web/api/navigationhistoryentry/getstate", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The getState() method of the NavigationHistoryEntry interface returns a clone of the developer-supplied state associated with this history entry.", + "doc": "The getState() method of the NavigationHistoryEntry interface returns a clone of the developer-supplied state associated with this history entry.", "returns": "A value representing the state. This can be any structured-cloneable data type.\n

    If no state is defined or if current document is not fully active, it returns undefined." }, "navigationhistoryentry.id": { "url": "$MDN_URL$/web/api/navigationhistoryentry/id", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The id read-only property of the NavigationHistoryEntry interface returns the id of the history entry, or an empty string if current document is not fully active. This is a unique, UA-generated value that always represents a specific history entry, useful to correlate it with an external resource such as a storage cache.\n

    This differs from the key of a history entry. The key is a unique, UA-generated value that represents the history entry's slot in the entries list rather than the entry itself. It is used to navigate that particular slot via Navigation.traverseTo(). The key will be reused by other entries that replace the entry in the list (that is, if the NavigateEvent.navigationType is replace)." + "doc": "The id read-only property of the NavigationHistoryEntry interface returns the id of the history entry, or an empty string if current document is not fully active. This is a unique, UA-generated value that always represents a specific history entry, useful to correlate it with an external resource such as a storage cache.\n

    This differs from the key of a history entry. The key is a unique, UA-generated value that represents the history entry's slot in the entries list rather than the entry itself. It is used to navigate that particular slot via Navigation.traverseTo(). The key will be reused by other entries that replace the entry in the list (that is, if the NavigateEvent.navigationType is replace)." }, "navigationhistoryentry.key": { "url": "$MDN_URL$/web/api/navigationhistoryentry/key", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The key read-only property of the NavigationHistoryEntry interface returns the key of the history entry, or an empty string if current document is not fully active. This is a unique, UA-generated value that represents the history entry's slot in the entries list. It is used to navigate that particular slot via Navigation.traverseTo(). The key will be reused by other entries that replace the entry in the list (that is, if the NavigateEvent.navigationType is replace).\n

    This differs from the id of a history entry. The id is a unique, UA-generated value that always represents a specific history entry rather than its slot in the entries list. This is useful to correlate it with an external resource such as a storage cache." + "doc": "The key read-only property of the NavigationHistoryEntry interface returns the key of the history entry, or an empty string if current document is not fully active. This is a unique, UA-generated value that represents the history entry's slot in the entries list. It is used to navigate that particular slot via Navigation.traverseTo(). The key will be reused by other entries that replace the entry in the list (that is, if the NavigateEvent.navigationType is replace).\n

    This differs from the id of a history entry. The id is a unique, UA-generated value that always represents a specific history entry rather than its slot in the entries list. This is useful to correlate it with an external resource such as a storage cache." }, "navigationhistoryentry.samedocument": { "url": "$MDN_URL$/web/api/navigationhistoryentry/samedocument", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The sameDocument read-only property of the NavigationHistoryEntry interface returns true if this history entry is for the same document as the current Document value and current document is fully active, or false otherwise." + "doc": "The sameDocument read-only property of the NavigationHistoryEntry interface returns true if this history entry is for the same document as the current Document value and current document is fully active, or false otherwise." }, "navigationhistoryentry.url": { "url": "$MDN_URL$/web/api/navigationhistoryentry/url", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The url read-only property of the NavigationHistoryEntry interface returns the absolute URL of this history entry. If the entry corresponds to a different Document than the current one (like sameDocument property is false), and that Document was fetched with a Referrer-Policy header set to no-referrer or origin, the property returns null. If current document is not fully active, it returns an empty string." + "doc": "The url read-only property of the NavigationHistoryEntry interface returns the absolute URL of this history entry. If the entry corresponds to a different Document than the current one (like sameDocument property is false), and that Document was fetched with a Referrer-Policy header set to no-referrer or origin, the property returns null. If current document is not fully active, it returns an empty string." + }, + "navigationprecommitcontroller": { + "url": "$MDN_URL$/web/api/navigationprecommitcontroller", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "141", + "ChromeAndroid": "141", + "Edge": "141", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "125" + }, + "doc": "The NavigationPrecommitController interface of the Navigation API defines redirect behavior for a navigation precommit handler." + }, + "navigationprecommitcontroller.redirect": { + "url": "$MDN_URL$/web/api/navigationprecommitcontroller/redirect", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "141", + "ChromeAndroid": "141", + "Edge": "141", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "125" + }, + "doc": "The redirect() method of the\nNavigationPrecommitController interface redirects the browser to a specified URL and specifies history behavior and any desired state information.", + "parameters": { + "url": "The URL to redirect to.", + "options": "An options object, the properties of which can include:\n

    \n
    state Optional
    \n
    \n

    Contains any state information you want to pass along with the navigation; for example, for logging or tracking purposes. This can be represented by any value type. The state for the navigation can subsequently be retrieved via the NavigationHistoryEntry.getState() method of the resulting history entry.\n

    \n
    history Optional
    \n
    \n

    An enumerated value that specifies how this redirect should be added to the navigation history. It can take one of the following values:\n

    \n
    auto
    \n
    \n

    The default value, which lets the browser decide how to handle it:\n

      \n
    • If the original navigation occurred as a result of a Navigation.navigate() call, the value will be whatever was specified in the navigate() call's history option.
    • \n
    • Otherwise, the value used is usually push, but it will become replace if the redirect points to the same URL as the pre-navigation URL.
    • \n
    \n
    \n
    push
    \n
    \n

    Adds a new NavigationHistoryEntry to the navigation history, and clears any available forward navigation (that is, if the user previously navigated to other locations, then used the back button to return back through the history before initiating the navigation that caused the redirect).\n

    \n
    replace
    \n
    \n

    Replaces the Navigation.currentEntry with the resulting new NavigationHistoryEntry.\n

    \n
    \n
    \n
    " + }, + "returns": "None (undefined).", + "throws": { + "InvalidStateError DOMException": "Thrown if:\n", + "SyntaxError DOMException": "Thrown if the specified url is invalid.", + "SecurityError DOMException": "Thrown if the current document is unable to have its URL rewritten to the provided redirect url." + } }, "navigationpreloadmanager": { "url": "$MDN_URL$/web/api/navigationpreloadmanager", @@ -8576,7 +8842,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The NavigationPreloadManager interface of the Service Worker API provides methods for managing the preloading of resources in parallel with service worker bootup.\n

    If supported, an object of this type is returned by ServiceWorkerRegistration.navigationPreload.\nThe result of a preload fetch request is waited on using the promise returned by FetchEvent.preloadResponse." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The NavigationPreloadManager interface of the Service Worker API provides methods for managing the preloading of resources in parallel with service worker bootup.\n

    If supported, an object of this type is returned by ServiceWorkerRegistration.navigationPreload.\nThe result of a preload fetch request is waited on using the promise returned by FetchEvent.preloadResponse." }, "navigationpreloadmanager.disable": { "url": "$MDN_URL$/web/api/navigationpreloadmanager/disable", @@ -8598,7 +8864,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The disable() method of the NavigationPreloadManager interface halts the automatic preloading of service-worker-managed resources previously started using enable()\nIt returns a promise that resolves with undefined.\n

    The method may be called in the service worker's activate event handler (before the fetch event handler can be called).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The disable() method of the NavigationPreloadManager interface halts the automatic preloading of service-worker-managed resources previously started using enable()\nIt returns a promise that resolves with undefined.\n

    The method may be called in the service worker's activate event handler (before the fetch event handler can be called).", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "There is no active worker associated with the registration to which this NavigationPreloadManager belongs." @@ -8624,7 +8890,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The enable() method of the NavigationPreloadManager interface is used to enable preloading of resources managed by the service worker.\nIt returns a promise that resolves with undefined.\n

    The method should be called in the service worker's activate event handler, which ensures it is called before any fetch event handler can fire.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The enable() method of the NavigationPreloadManager interface is used to enable preloading of resources managed by the service worker.\nIt returns a promise that resolves with undefined.\n

    The method should be called in the service worker's activate event handler, which ensures it is called before any fetch event handler can fire.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "There is no active worker associated with the registration to which this NavigationPreloadManager belongs." @@ -8650,7 +8916,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getState() method of the NavigationPreloadManager interface returns a Promise that resolves to an object with properties that indicate whether preload is enabled and what value will be sent in the Service-Worker-Navigation-Preload HTTP header.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getState() method of the NavigationPreloadManager interface returns a Promise that resolves to an object with properties that indicate whether preload is enabled and what value will be sent in the Service-Worker-Navigation-Preload HTTP header.", "returns": "A Promise that resolves with an object that has the following properties:\n

    \n
    enabled
    \n
    \n

    true if preloading is enabled, and false otherwise.\n

    \n
    headerValue
    \n
    \n

    A string containing the value that will be sent in the Service-Worker-Navigation-Preload HTTP header following a preloading fetch().\nThis defaults to true unless the value was changed using NavigationPreloadManager.setHeaderValue().\n

    \n
    ", "throws": { "InvalidStateError DOMException": "There is no active worker associated with the registration to which this NavigationPreloadManager belongs." @@ -8676,7 +8942,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setHeaderValue() method of the NavigationPreloadManager interface sets the value of the Service-Worker-Navigation-Preload header that will be sent with requests resulting from a fetch() operation made during service worker navigation preloading.\nIt returns an empty Promise that resolves with undefined.\n

    The presence of the Service-Worker-Navigation-Preload header in preloading requests allows servers to configure the returned resource differently for preloading fetch requests than from normal fetch requests.\nThe default directive is set to true: this method allows the possibility of configuring multiple different responses to preload requests.\n

    \n

    Note:\nIf a different response may result from setting this header, the server must set Vary: Service-Worker-Navigation-Preload to ensure that the different responses are cached.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The setHeaderValue() method of the NavigationPreloadManager interface sets the value of the Service-Worker-Navigation-Preload header that will be sent with requests resulting from a fetch() operation made during service worker navigation preloading.\nIt returns an empty Promise that resolves with undefined.\n

    The presence of the Service-Worker-Navigation-Preload header in preloading requests allows servers to configure the returned resource differently for preloading fetch requests than from normal fetch requests.\nThe default directive is set to true: this method allows the possibility of configuring multiple different responses to preload requests.\n

    \n

    Note:\nIf a different response may result from setting this header, the server must set Vary: Service-Worker-Navigation-Preload to ensure that the different responses are cached.\n

    ", "parameters": { "value": "An arbitrary string value, which the target server uses to determine what should returned for the requested resource." }, @@ -8688,70 +8954,86 @@ "navigationtransition": { "url": "$MDN_URL$/web/api/navigationtransition", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NavigationTransition interface of the Navigation API represents an ongoing navigation, that is, a navigation that hasn't yet reached the navigatesuccess or navigateerror stage.\n

    It is accessed via the Navigation.transition property." + "doc": "The NavigationTransition interface of the Navigation API represents an ongoing navigation, that is, a navigation that hasn't yet reached the navigatesuccess or navigateerror stage.\n

    It is accessed via the Navigation.transition property." }, "navigationtransition.finished": { "url": "$MDN_URL$/web/api/navigationtransition/finished", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The finished read-only property of the\nNavigationTransition interface returns a Promise that fulfills at the same time the navigatesuccess event fires, or rejects at the same time the navigateerror event fires." + "doc": "The finished read-only property of the\nNavigationTransition interface returns a Promise that fulfills at the same time the navigatesuccess event fires, or rejects at the same time the navigateerror event fires." }, "navigationtransition.from": { "url": "$MDN_URL$/web/api/navigationtransition/from", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The from read-only property of the\nNavigationTransition interface returns the NavigationHistoryEntry that the transition is coming from." + "doc": "The from read-only property of the\nNavigationTransition interface returns the NavigationHistoryEntry that the transition is coming from." }, "navigationtransition.navigationtype": { "url": "$MDN_URL$/web/api/navigationtransition/navigationtype", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigationType read-only property of the\nNavigationTransition interface returns the type of the ongoing navigation." + "doc": "The navigationType read-only property of the\nNavigationTransition interface returns the type of the ongoing navigation." }, "navigator": { "url": "$MDN_URL$/web/api/navigator", @@ -8783,7 +9065,7 @@ "Deprecated" ], "compatibility": {}, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The activeVRDisplays read-only property of the\nNavigator interface returns an array containing every\nVRDisplay object that is currently presenting\n(VRDisplay.isPresenting is true).\n

    \n

    Note:\nThis property was part of the old WebVR API. It has been superseded by the WebXR Device API.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The activeVRDisplays read-only property of the\nNavigator interface returns an array containing every\nVRDisplay object that is currently presenting\n(VRDisplay.isPresenting is true).\n

    \n

    Note:\nThis property was part of the old WebVR API. It has been superseded by the WebXR Device API.\n

    " }, "navigator.appcodename": { "url": "$MDN_URL$/web/api/navigator/appcodename", @@ -8834,7 +9116,7 @@ "Safari": "", "SafariIOS": "" }, - "doc": "Returns either \"4.0\" or a string representing version information about\nthe browser.\n
    \n

    Note:\nDo not rely on this property to return the correct browser version.\n

    " + "doc": "The Navigator.appVersion read-only property of the Navigator interface returns a string representing version information about the browser." }, "navigator.bluetooth": { "url": "$MDN_URL$/web/api/navigator/bluetooth", @@ -8848,7 +9130,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The bluetooth read-only property of the Navigator interface returns a Bluetooth object for the current document, providing access to Web Bluetooth API functionality." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The bluetooth read-only property of the Navigator interface returns a Bluetooth object for the current document, providing access to Web Bluetooth API functionality." }, "navigator.buildid": { "url": "$MDN_URL$/web/api/navigator/buildid", @@ -8875,7 +9157,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The canShare() method of the Navigator interface returns true if the equivalent call to navigator.share() would succeed.\n

    The method returns false if the data cannot be validated. Reasons the data might be invalid include:\n

    \n

    The Web Share API is gated by the web-share permission policy.\nThe canShare() method will return false if the permission is supported but has not been granted.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The canShare() method of the Navigator interface returns true if the equivalent call to navigator.share() would succeed.\n

    The method returns false if the data cannot be validated. Reasons the data might be invalid include:\n

    \n

    The Web Share API is gated by the web-share permission policy.\nThe canShare() method will return false if the permission is supported but has not been granted.", "parameters": { "data": "An object defining the share data to test.\nTypically, an object with the same properties is passed to navigator.share() if this call returns true.\n

    Properties that are unknown to the user agent are ignored; share data is only assessed on properties understood by the user agent.\nAll properties are optional but at least one known data property must be specified or the method will return false.\n

    Possible values are:\n

    \n
    url Optional
    \n
    \n

    A string representing a URL to be shared.\n

    \n
    text Optional
    \n
    \n

    A string representing text to be shared.\n

    \n
    title Optional
    \n
    \n

    A string representing the title to be shared.\n

    \n
    files Optional
    \n
    \n

    An array of File objects representing files to be shared.\n

    \n
    " }, @@ -8896,11 +9178,11 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearAppBadge() method of the Navigator interface clears a badge on the current app's icon by setting it to nothing. The value nothing indicates that no badge is currently set, and the status of the badge is cleared.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearAppBadge() method of the Navigator interface clears a badge on the current app's icon by setting it to nothing. The value nothing indicates that no badge is currently set, and the status of the badge is cleared.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if the document is not fully active.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", "NotAllowedError DOMException": "Thrown if PermissionStatus.state is not granted." } }, @@ -8924,7 +9206,7 @@ "lowDate": "2020-03-24", "highDate": "2022-09-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clipboard read-only property of the Navigator interface returns a Clipboard object used to read and write the clipboard's contents.\n

    This is the entry point to the Clipboard API, which can be used to implement cut, copy, and paste features within a web application." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clipboard read-only property of the Navigator interface returns a Clipboard object used to read and write the clipboard's contents.\n

    This is the entry point to the Clipboard API, which can be used to implement cut, copy, and paste features within a web application." }, "navigator.connection": { "url": "$MDN_URL$/web/api/navigator/connection", @@ -8954,7 +9236,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The contacts read-only property of the\nNavigator interface returns a ContactsManager interface\nwhich allows users to select entries from their contact list and share limited details\nof the selected entries with a website or application." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The contacts read-only property of the\nNavigator interface returns a ContactsManager interface\nwhich allows users to select entries from their contact list and share limited details\nof the selected entries with a website or application." }, "navigator.cookieenabled": { "url": "$MDN_URL$/web/api/navigator/cookieenabled", @@ -8997,7 +9279,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The credentials read-only property of the Navigator interface returns the CredentialsContainer object associated with the current document, which exposes methods to request credentials. The CredentialsContainer interface also notifies the user agent when an interesting event occurs, such as a successful sign-in or sign-out. This interface can be used for feature detection." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The credentials read-only property of the Navigator interface returns the CredentialsContainer object associated with the current document, which exposes methods to request credentials. The CredentialsContainer interface also notifies the user agent when an interesting event occurs, such as a successful sign-in or sign-out. This interface can be used for feature detection." }, "navigator.deprecatedreplaceinurn": { "url": "$MDN_URL$/web/api/navigator/deprecatedreplaceinurn", @@ -9016,7 +9298,7 @@ }, "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The deprecatedReplaceInURN() method of the Navigator interface substitutes specified strings inside the mapped URL corresponding to a given opaque URN or FencedFrameConfig's internal url property.\n

    A FencedFrameConfig or opaque URN is returned from a source such as the Protected Audience API runAdAuction() method, and then set as the value of HTMLFencedFrameElement.config. The content URL associated with the FencedFrameConfig or opaque URN is mapped to it internally by the browser, and can't be accessed via JavaScript.\n

    However, you may wish to substitute parts of that internal URL. This is a common approach for passing runtime data into ad creatives to use in rendering. deprecatedReplaceInURN() has been made available as a temporary measure to enable that substitution for fenced frame URLs, helping ad tech providers to migrate existing implementations across to privacy sandbox APIs.", "parameters": { - "UrnOrConfig": "A FencedFrameConfig object or a opaque URN for which you want to substitute parts of the corresponding internal URL.", + "UrnOrConfig": "A FencedFrameConfig object or an opaque URN for which you want to substitute parts of the corresponding internal URL.", "replacements": "An object containing one or more properties representing the substitutions you wish to make in the internal URL. Each property key is a URL subsection you wish to replace, and each property value is the string to replace it with. Note that:\n

    " }, "returns": "A Promise that fulfills with undefined.", @@ -9038,7 +9320,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deviceMemory read-only\nproperty of the Navigator interface returns the approximate amount of\ndevice memory in gigabytes.\n

    The reported value is imprecise to curtail fingerprinting. It's approximated by\nrounding down to the nearest power of 2, then dividing that number by 1024. It is then\nclamped within lower and upper bounds to protect the privacy of owners of very low-memory or\nhigh-memory devices." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deviceMemory read-only property of the Navigator interface returns the approximate amount of device memory in gigabytes.\n

    The reported value is imprecise to curtail fingerprinting.\nIt's approximated by rounding the actual memory to the nearest power of 2, then dividing that number by 1024.\nIt is then clamped within lower and upper bounds to protect the privacy of owners of very low-memory or high-memory devices.\nThese bounds may change over time (see browser compatibility table)." }, "navigator.deviceposture": { "url": "$MDN_URL$/web/api/navigator/deviceposture", @@ -9092,7 +9374,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.geolocation read-only property returns a\nGeolocation object that gives Web content access to the location of the\ndevice. This allows a website or app to offer customized results based on the user's\nlocation.\n

    \n

    Note:\nFor security reasons, when a web page tries to access location\ninformation, the user is notified and asked to grant permission. Be aware that each\nbrowser has its own policies and methods for requesting this permission.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.geolocation read-only property returns a\nGeolocation object that gives Web content access to the location of the\ndevice. This allows a website or app to offer customized results based on the user's\nlocation.\n

    \n

    Note:\nFor security reasons, when a web page tries to access location\ninformation, the user is notified and asked to grant permission. Be aware that each\nbrowser has its own policies and methods for requesting this permission.\n

    " }, "navigator.getautoplaypolicy": { "url": "$MDN_URL$/web/api/navigator/getautoplaypolicy", @@ -9129,7 +9411,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getBattery() method provides information about the system's battery.\nIt returns a battery promise, which resolves with a BatteryManager object providing some properties to get the battery status also some events you can handle to monitor the battery status.\nThis implements the Battery Status API; see that documentation for additional details, a guide to using the API, and sample code.\n

    Since Chrome 103, the Navigator.getBattery() method of Battery Status API only expose to secure context.\n

    \n

    Note:\nAccess to this feature may be controlled by the Permissions-Policy directive battery.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getBattery() method provides information about the system's battery.\nIt returns a battery promise, which resolves with a BatteryManager object providing some properties to get the battery status also some events you can handle to monitor the battery status.\nThis implements the Battery Status API; see that documentation for additional details, a guide to using the API, and sample code.\n

    Since Chrome 103, the Navigator.getBattery() method of Battery Status API only expose to secure context.\n

    \n

    Note:\nAccess to this feature may be controlled by the Permissions-Policy directive battery.\n

    ", "returns": "A Promise that fulfills with a BatteryManager object which you can use to get information about the battery's state.", "throws": { "NotAllowedError DOMException": "Use of this feature was blocked by a Permissions Policy.", @@ -9156,7 +9438,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.getGamepads() method returns an array of\nGamepad objects, one for each gamepad connected to the device.\n

    Elements in the array may be null if a gamepad disconnects during a\nsession, so that the remaining gamepads retain the same index.", + "doc": "The Navigator.getGamepads() method returns an array of\nGamepad objects, one for each gamepad connected to the device.\n

    Elements in the array may be null if a gamepad disconnects during a\nsession, so that the remaining gamepads retain the same index.", "returns": "An Array of Gamepad objects, eventually empty.", "throws": { "SecurityError DOMException": "Use of this feature was blocked by a Permissions Policy." @@ -9174,7 +9456,10 @@ "Edge": "85", "Opera": "71" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getInstalledRelatedApps() method returns a promise that resolves with an array of objects representing any related platform-specific apps or Progressive Web Apps that the user has installed. This could be used for content personalization such as removing \"install our app\" banners from the web app if the platform-specific app and/or PWA is already installed.\n

    \n

    Note:\nThis method must be invoked in a top-level secure context, that is, not embedded in an <iframe>.\n

    ", + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getInstalledRelatedApps() method returns a promise that resolves with an array of objects representing any related platform-specific apps or Progressive Web Apps that the user has installed. This could be used for content personalization such as removing \"install our app\" banners from the web app if the platform-specific app and/or PWA is already installed.\n

    \n

    Note:\nThis method must be invoked in a top-level secure context, that is, not embedded in an <iframe>.\n

    ", "returns": "A Promise that fulfills with an array of objects representing any installed related apps. Each object can contain the following properties:\n
    \n
    id Optional
    \n
    \n

    A string representing the ID used to represent the application on the specified platform. The exact form of the string will vary by platform.\n

    \n
    platform
    \n
    \n

    A string representing the platform (ecosystem or operating system) the related app is associated with. This can be:\n

    \n
    \n
    url Optional
    \n
    \n

    A string representing the URL associated with the app. This is usually where you can read information about it and install it.\n

    \n
    version Optional
    \n
    \n

    A string representing the related app's version.\n

    \n
    \n

    The related app information must have been previously specified in the related_applications member of the invoking web app's manifest file.", "throws": { "InvalidStateError DOMException": "The method was not invoked in a top-level browsing context." @@ -9192,7 +9477,7 @@ "Edge": "", "Opera": "40" }, - "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deprecated Navigator.getUserMedia() method prompts the user for permission to use up to one video input device (such as a camera or shared screen) and up to one audio input device (such as a microphone) as the source for a MediaStream.\n

    If permission is granted, a MediaStream whose video and/or audio tracks come from those devices is delivered to the specified success callback.\nIf permission is denied, no compatible input devices exist, or any other error condition occurs, the error callback is executed with an object describing what went wrong.\nIf the user instead doesn't make a choice at all, neither callback is executed.\n

    \n

    Note:\nThis is a legacy method.\nPlease use the newer navigator.mediaDevices.getUserMedia() instead.\nWhile technically not deprecated, this old callback version is marked as such, since the specification strongly encourages using the newer promise returning version.\n

    ", + "doc": "

    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.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The deprecated Navigator.getUserMedia() method prompts the user for permission to use up to one video input device (such as a camera or shared screen) and up to one audio input device (such as a microphone) as the source for a MediaStream.\n

    If permission is granted, a MediaStream whose video and/or audio tracks come from those devices is delivered to the specified success callback.\nIf permission is denied, no compatible input devices exist, or any other error condition occurs, the error callback is executed with an object describing what went wrong.\nIf the user instead doesn't make a choice at all, neither callback is executed.\n

    \n

    Note:\nThis is a legacy method.\nPlease use the newer navigator.mediaDevices.getUserMedia() instead.\nWhile technically not deprecated, this old callback version is marked as such, since the specification strongly encourages using the newer promise returning version.\n

    ", "parameters": { "constraints": "An object specifying the types of media to\nrequest, along with any requirements for each type. For details, see the constraints\nsection under the modern MediaDevices.getUserMedia() method, as well\nas the article Capabilities, constraints, and settings.", "successCallback": "A function which is invoked when the request for media access is approved. The\nfunction is called with one parameter: the MediaStream object that\ncontains the media stream. Your callback can then assign the stream to the desired\nobject (such as an <audio> or <video> element), as\nshown in the following example:\n
    \n```js\nfunction successCallback(stream) {\n  const video = document.querySelector(\"video\");\n  video.srcObject = stream;\n  video.onloadedmetadata = (e) => {\n    // Do something with the video here.\n  };\n}\n```\n
    ", @@ -9237,7 +9522,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.gpu read-only property returns the GPU object for the current browsing context, which is the entry point for the WebGPU API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.gpu read-only property returns the GPU object for the current browsing context, which is the entry point for the WebGPU API." }, "navigator.hardwareconcurrency": { "url": "$MDN_URL$/web/api/navigator/hardwareconcurrency", @@ -9277,7 +9562,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.hid\nread-only property returns an HID object providing methods for accessing HID device connections and events that fire when the user agent connects to or disconnects from a device.\n

    Where a defined Permissions Policy blocks WebHID usage, the Navigator.hid property will not be available." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.hid\nread-only property returns an HID object providing methods for accessing HID device connections and events that fire when the user agent connects to or disconnects from a device.\n

    Where a defined Permissions Policy blocks WebHID usage, the Navigator.hid property will not be available." }, "navigator.ink": { "url": "$MDN_URL$/web/api/navigator/ink", @@ -9329,7 +9614,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keyboard read-only property\nof the Navigator interface returns a Keyboard object\nwhich provides access to functions that retrieve keyboard layout maps and toggle\ncapturing of key presses from the physical keyboard." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The keyboard read-only property\nof the Navigator interface returns a Keyboard object\nwhich provides access to functions that retrieve keyboard layout maps and toggle\ncapturing of key presses from the physical keyboard." }, "navigator.language": { "url": "$MDN_URL$/web/api/navigator/language", @@ -9392,14 +9677,15 @@ "FirefoxAndroid": "96", "Opera": "56", "Safari": "15.4", - "SafariIOS": "15.4" + "SafariIOS": "15.4", + "Nodejs": "24.5.0" }, "baseline": { "level": "HIGH", "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The locks read-only property of\nthe Navigator interface returns a LockManager object\nwhich provides methods for requesting a new Lock object and querying\nfor an existing Lock object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The locks read-only property of\nthe Navigator interface returns a LockManager object\nwhich provides methods for requesting a new Lock object and querying\nfor an existing Lock object." }, "navigator.login": { "url": "$MDN_URL$/web/api/navigator/login", @@ -9414,7 +9700,7 @@ "FirefoxAndroid": "138", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The login read-only property of the Navigator interface provides access to the browser's NavigatorLogin object, which a federated identity provider (IdP) can use to set its login status when a user signs into or out of the IdP.\n

    See Update login status using the Login Status API for more details of how this is used." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The login read-only property of the Navigator interface provides access to the browser's NavigatorLogin object, which a federated identity provider (IdP) can use to set its login status when a user signs into or out of the IdP.\n

    See Update login status using the Login Status API for more details of how this is used." }, "navigator.maxtouchpoints": { "url": "$MDN_URL$/web/api/navigator/maxtouchpoints", @@ -9480,7 +9766,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The mediaDevices read-only property of the Navigator interface returns a MediaDevices object, which provides access to connected media input devices like cameras and microphones, as well as screen sharing." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The mediaDevices read-only property of the Navigator interface returns a MediaDevices object, which provides access to connected media input devices like cameras and microphones, as well as screen sharing." }, "navigator.mediasession": { "url": "$MDN_URL$/web/api/navigator/mediasession", @@ -9614,7 +9900,7 @@ "SafariIOS": "", "Nodejs": "21.2.0" }, - "doc": "The platform property read-only property of the Navigator interface returns a string identifying the platform on which the user's browser is running.\n

    \n

    Note:\nIn general, you should whenever possible avoid writing code that uses methods or properties like this one to try to find out information about the user's environment, and instead write code that does feature detection.\n

    " + "doc": "The platform property read-only property of the Navigator interface returns a string identifying the platform on which the user's browser is running." }, "navigator.plugins": { "url": "$MDN_URL$/web/api/navigator/plugins", @@ -9647,7 +9933,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The presentation read-only property of Navigator serves as the entry\npoint for the Presentation API and\nreturns a reference to Presentation object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The presentation read-only property of Navigator serves as the entry\npoint for the Presentation API and\nreturns a reference to Presentation object." }, "navigator.product": { "url": "$MDN_URL$/web/api/navigator/product", @@ -9698,7 +9984,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator method registerProtocolHandler() lets websites register their ability to open or handle particular URL schemes (also known as protocols).\n

    For example, this API lets webmail sites open mailto: URLs, or VoIP sites open tel: URLs.\n

    To register a protocol handler, a website calls registerProtocolHandler(), passing in the protocol to register and a template URL.\n

    When the user activates a link that uses the registered protocol, the browser will insert the href from the activated link into the URL template supplied during handler registration, and navigate the current page to the resulting URL.\n

    The browser may ask the user to confirm that they want the page to be allowed to handle the protocol, either when the protocol is registered or when the user activates the link.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator method registerProtocolHandler() lets websites register their ability to open or handle particular URL schemes (also known as protocols).\n

    For example, this API lets webmail sites open mailto: URLs, or VoIP sites open tel: URLs.\n

    To register a protocol handler, a website calls registerProtocolHandler(), passing in the protocol to register and a template URL.\n

    When the user activates a link that uses the registered protocol, the browser will insert the href from the activated link into the URL template supplied during handler registration, and navigate the current page to the resulting URL.\n

    The browser may ask the user to confirm that they want the page to be allowed to handle the protocol, either when the protocol is registered or when the user activates the link.", "parameters": { "scheme": "A string containing the scheme for the protocol that the site wishes to handle.\n

    This may be a custom scheme, in which case the scheme's name:\n

    \n

    Otherwise, the scheme must be one of the following:\n

    ", "url": "A string containing the URL of the handler.\nThis URL must include %s, as a placeholder that will be replaced with the escaped URL to be handled.\n

    The handler URL must use the https scheme, and must be of the same origin as the webpage that is attempting to register the handler." @@ -9729,10 +10015,10 @@ "lowDate": "2019-03-25", "highDate": "2021-09-25" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestMediaKeySystemAccess() method of the Navigator interface returns a Promise which delivers a MediaKeySystemAccess object that can be used to access a particular media key system, which can in turn be used to create keys for decrypting a media stream.\n

    This method is part of the Encrypted Media Extensions API, which brings support for encrypted media and DRM-protected video to the web.\n

    This method may have user-visible effects such as asking for permission to access one or more system resources.\nConsider that when deciding when to call requestMediaKeySystemAccess(); you don't want those requests to happen at inconvenient times.\nAs a general rule, this function should be called only when it's about time to create and use a MediaKeys object by calling the returned MediaKeySystemAccess object's createMediaKeys() method.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestMediaKeySystemAccess() method of the Navigator interface returns a Promise which delivers a MediaKeySystemAccess object that can be used to access a particular media key system, which can in turn be used to create keys for decrypting a media stream.\n

    This method is part of the Encrypted Media Extensions API, which brings support for encrypted media and DRM-protected video to the web.\n

    This method may have user-visible effects such as asking for permission to access one or more system resources.\nConsider that when deciding when to call requestMediaKeySystemAccess(); you don't want those requests to happen at inconvenient times.\nAs a general rule, this function should be called only when it's about time to create and use a MediaKeys object by calling the returned MediaKeySystemAccess object's createMediaKeys() method.", "parameters": { "keySystem": "A string identifying the key system.\nFor example com.example.some-system or org.w3.clearkey.", - "supportedConfigurations": "A non-empty Array of objects conforming to the object returned by MediaKeySystemAccess.getConfiguration.\nThe first element with a satisfiable configuration will be used.\n

    Each object may have the following properties:\n

    \n

    Note:\nEither videoCapabilities or audioCapabilities may be empty, but not both!\n

    \n
    \n
    label Optional
    \n
    \n

    An optional label for the configuration, which defaults to \"\".\nThis label is preserved for configurations fetched using MediaKeySystemAccess.getConfiguration\n

    \n
    initDataTypes
    \n
    \n

    An array of strings that indicate the data type names for the supported initialization data formats (default to an empty array).\nThese names are names like \"cenc\", \"keyids\" and \"webm\" that are defined in the Encrypted Media Extensions Initialization Data Format Registry.\n

    \n
    audioCapabilities
    \n
    \n

    An array of supported audio capabilities.\nIf the array is empty the content type does not support audio capabilities.\n

    Each object in the array has the following properties:\n

    \n
    contentType
    \n
    \n

    A string indicating the media MIME-type of the media resource, such as \"audio/mp4;codecs=\\\"mp4a.40.2\\\".\nNote that the empty string is invalid, and that if the MIME-type definition includes parameters, such as codecs, these must also be included.\n

    \n
    encryptionScheme
    \n
    \n

    The encryption scheme associated with the content type, such as cenc, cbcs, cbcs-1-9.\nThis value should be set by an application (it defaults to null, indicating that any encryption scheme may be used).\n

    \n
    robustness
    \n
    \n

    The robustness level associated with the content type.\nThe empty string indicates that any ability to decrypt and decode the content type is acceptable.\n

    \n
    \n
    \n
    videoCapabilities
    \n
    \n

    An array of supported video capabilities.\nThe objects in the array have the same form as those in audioCapabilities.\n

    \n
    distinctiveIdentifier
    \n
    \n

    A string indicating whether the implementation may use \"distinctive identifiers\" (or distinctive permanent identifiers) for any operations associated with any object created from this configuration.\nThe allowed values are:\n

    \n
    required
    \n
    \n

    The returned object must support this feature.\n

    \n
    optional
    \n
    \n

    The returned object may support this feature.\nThis is the default\n

    \n
    not-allowed
    \n
    \n

    The returned object must not support or use this feature.\n

    \n
    \n
    \n
    persistentState
    \n
    \n

    A string indicating whether the returned object must be able to persist session data or any other type of state.\nThe values are the same as for distinctiveIdentifier and have the same meaning: required, optional (default), not-allowed.\nOnly \"temporary\" sessions may be created when persistent state is not allowed.\n

    \n
    sessionTypes
    \n
    \n

    An array of strings indicating the session types that must be supported.\nPermitted values include:\n

    \n
    temporary
    \n
    \n

    A session for which the license, key(s) and record of or data related to the session are not persisted.\nThe application does not need to manage such storage.\nImplementations must support this option, and it is the default.\n

    \n
    persistent-license
    \n
    \n

    A session for which the license (and potentially other data related to the session) will be persisted.\nA record of the license and associated keys persists even if the license is destroyed, providing an attestation that the license and key(s) it contains are no longer usable by the client.\n

    \n
    \n
    \n
    " + "supportedConfigurations": "A non-empty Array of objects conforming to the object returned by MediaKeySystemAccess.getConfiguration.\nThe first element with a satisfiable configuration will be used.\n

    Each object may have the following properties:\n

    \n

    Note:\nEither videoCapabilities or audioCapabilities may be empty, but not both!\n

    \n
    \n
    label Optional
    \n
    \n

    An optional label for the configuration, which defaults to \"\".\nThis label is preserved for configurations fetched using MediaKeySystemAccess.getConfiguration\n

    \n
    initDataTypes
    \n
    \n

    An array of strings that indicate the data type names for the supported initialization data formats (defaults to an empty array).\nThese names are names like \"cenc\", \"keyids\" and \"webm\" that are defined in the Encrypted Media Extensions Initialization Data Format Registry.\n

    \n
    audioCapabilities
    \n
    \n

    An array of supported audio capabilities.\nIf the array is empty the content type does not support audio capabilities.\n

    Each object in the array has the following properties:\n

    \n
    contentType
    \n
    \n

    A string indicating the media MIME-type of the media resource, such as \"audio/mp4;codecs=\\\"mp4a.40.2\\\".\nNote that the empty string is invalid, and that if the MIME-type definition includes parameters, such as codecs, these must also be included.\n

    \n
    encryptionScheme
    \n
    \n

    The encryption scheme associated with the content type, such as cenc, cbcs, cbcs-1-9.\nThis value should be set by an application (it defaults to null, indicating that any encryption scheme may be used).\n

    \n
    robustness
    \n
    \n

    The robustness level associated with the content type.\nThe empty string indicates that any ability to decrypt and decode the content type is acceptable.\n

    \n
    \n
    \n
    videoCapabilities
    \n
    \n

    An array of supported video capabilities.\nThe objects in the array have the same form as those in audioCapabilities.\n

    \n
    distinctiveIdentifier
    \n
    \n

    A string indicating whether the implementation may use \"distinctive identifiers\" (or distinctive permanent identifiers) for any operations associated with any object created from this configuration.\nThe allowed values are:\n

    \n
    required
    \n
    \n

    The returned object must support this feature.\n

    \n
    optional
    \n
    \n

    The returned object may support this feature.\nThis is the default\n

    \n
    not-allowed
    \n
    \n

    The returned object must not support or use this feature.\n

    \n
    \n
    \n
    persistentState
    \n
    \n

    A string indicating whether the returned object must be able to persist session data or any other type of state.\nThe values are the same as for distinctiveIdentifier and have the same meaning: required, optional (default), not-allowed.\nOnly \"temporary\" sessions may be created when persistent state is not allowed.\n

    \n
    sessionTypes
    \n
    \n

    An array of strings indicating the session types that must be supported.\nPermitted values include:\n

    \n
    temporary
    \n
    \n

    A session for which the license, key(s) and record of or data related to the session are not persisted.\nThe application does not need to manage such storage.\nImplementations must support this option, and it is the default.\n

    \n
    persistent-license
    \n
    \n

    A session for which the license (and potentially other data related to the session) will be persisted.\nA record of the license and associated keys persists even if the license is destroyed, providing an attestation that the license and key(s) it contains are no longer usable by the client.\n

    \n
    \n
    \n
    " }, "returns": "A Promise that fulfils with a MediaKeySystemAccess object representing the media key system configuration described by keySystem and supportedConfigurations.", "throws": { @@ -9756,7 +10042,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestMIDIAccess() method of the Navigator interface returns a Promise representing a request for access to MIDI devices on a user's system.\nThis method is part of the Web MIDI API, which provides a means for accessing, enumerating, and manipulating MIDI devices.\n

    This method may prompt the user for access to MIDI devices available to their system, or it may use a previously established preference to grant or deny access.\nIf permission is granted then the Promise resolves and a MIDIAccess object is returned.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestMIDIAccess() method of the Navigator interface returns a Promise representing a request for access to MIDI devices on a user's system.\nThis method is part of the Web MIDI API, which provides a means for accessing, enumerating, and manipulating MIDI devices.\n

    This method may prompt the user for access to MIDI devices available to their system, or it may use a previously established preference to grant or deny access.\nIf permission is granted then the Promise resolves and a MIDIAccess object is returned.", "parameters": { "MIDIOptions": "An Object representing options to pass into the method. These options are:\n

    \n
    sysex
    \n
    \n

    A Boolean value that, if set to true, allows the ability to send and receive system exclusive (sysex) messages. The default value is false.\n

    \n
    software
    \n
    \n

    A Boolean value that, if set to true, allows the system to utilize any installed software synthesizers. The default value is false.\n

    \n
    " }, @@ -9765,7 +10051,7 @@ "AbortError DOMException": "Thrown if the document or page is closed due to user navigation.", "InvalidStateError DOMException": "Thrown if the underlying system raises any errors.", "NotSupportedError DOMException": "Thrown if the feature or options are not supported by the system.", - "SecurityError DOMException": "Thrown if the user or system denies the application from creating a MIDIAccess object with the requested options, or if the document is not allowed to use the feature (for example, because of a Permission Policy, or because the user previously denied a permission request)." + "NotAllowedError DOMException": "Thrown if the user or system denies the application from creating a MIDIAccess object with the requested options, or if the document is not allowed to use the feature (for example, because of a Permission Policy, or because the user previously denied a permission request)." } }, "navigator.scheduling": { @@ -9806,7 +10092,8 @@ "parameters": { "url": "The URL that will receive the data. Can be relative or absolute.", "data": "An ArrayBuffer, a TypedArray, a DataView, a Blob,\na string literal or object, a FormData or a URLSearchParams\nobject containing the data to send." - } + }, + "returns": "Returns true if the\nuser agent successfully queued the data for transfer.\nOtherwise, it returns false." }, "navigator.serial": { "url": "$MDN_URL$/web/api/navigator/serial", @@ -9822,7 +10109,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serial read-only property of the Navigator interface returns a Serial object which represents the entry point into the Web Serial API.\n

    When getting, the same instance of the Serial object will always be returned." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serial read-only property of the Navigator interface returns a Serial object which represents the entry point into the Web Serial API.\n

    When getting, the same instance of the Serial object will always be returned." }, "navigator.serviceworker": { "url": "$MDN_URL$/web/api/navigator/serviceworker", @@ -9844,7 +10131,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serviceWorker read-only property of the Navigator interface returns the ServiceWorkerContainer object for the associated document, which provides access to registration, removal, upgrade, and communication with the ServiceWorker.\n

    The feature may not be available in private mode.\n

    Note that a worker can similarly access the ServiceWorkerContainer for a document using WorkerNavigator.serviceWorker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serviceWorker read-only property of the Navigator interface returns the ServiceWorkerContainer object for the associated document, which provides access to registration, removal, upgrade, and communication with the ServiceWorker.\n

    The feature may not be available in private mode.\n

    Note that a worker can similarly access the ServiceWorkerContainer for a document using WorkerNavigator.serviceWorker." }, "navigator.setappbadge": { "url": "$MDN_URL$/web/api/navigator/setappbadge", @@ -9860,14 +10147,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setAppBadge() method of the Navigator interface sets a badge on the icon associated with this app. If a value is passed to the method, this will be set as the value of the badge. Otherwise the badge will display as a dot, or other indicator as defined by the platform.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setAppBadge() method of the Navigator interface sets a badge on the icon associated with this app. If a value is passed to the method, this will be set as the value of the badge. Otherwise the badge will display as a dot, or other indicator as defined by the platform.", "parameters": { "contents": "A number which will be used as the value of the badge. If contents is 0 then the badge will be set to nothing, indicating a cleared badge." }, "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if the document is not fully active.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", "NotAllowedError DOMException": "Thrown if PermissionStatus.state is not granted." } }, @@ -9888,7 +10175,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The share() method of the Navigator interface invokes the native sharing mechanism of the device to share data such as text, URLs, or files. The available share targets depend on the device, but might include the clipboard, contacts and email applications, websites, Bluetooth, etc.\n

    The method resolves a Promise with undefined.\nOn Windows this happens when the share popup is launched, while on Android the promise resolves once the data has successfully been passed to the share target.\n

    The Web Share API is gated by the web-share permission policy.\nThe share() method will throw exceptions if the permission is supported but has not been granted.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The share() method of the Navigator interface invokes the native sharing mechanism of the device to share data such as text, URLs, or files. The available share targets depend on the device, but might include the clipboard, contacts and email applications, websites, Bluetooth, etc.\n

    The method resolves a Promise with undefined.\nOn Windows this happens when the share popup is launched, while on Android the promise resolves once the data has successfully been passed to the share target.\n

    The Web Share API is gated by the web-share permission policy.\nThe share() method will throw exceptions if the permission is supported but has not been granted.", "parameters": { "data": "An object containing data to share.\n

    Properties that are unknown to the user agent are ignored; share data is only assessed on properties understood by the user agent.\nAll properties are optional but at least one known data property must be specified.\n

    Possible values are:\n

    \n
    url Optional
    \n
    \n

    A string representing a URL to be shared.\n

    \n
    text Optional
    \n
    \n

    A string representing text to be shared.\n

    \n
    title Optional
    \n
    \n

    A string representing a title to be shared. May be ignored by the target.\n

    \n
    files Optional
    \n
    \n

    An array of File objects representing files to be shared. See below for shareable file types.\n

    \n
    " }, @@ -9921,7 +10208,7 @@ "lowDate": "2021-12-13", "highDate": "2024-06-13" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.storage\nread-only property returns the singleton StorageManager object used to\naccess the overall storage capabilities of the browser for the current site or app.\nThe returned object lets you examine and configure persistence of data stores and\nlearn approximately how much more space your browser has available for local storage\nuse." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator.storage\nread-only property returns the singleton StorageManager object used to\naccess the overall storage capabilities of the browser for the current site or app.\nThe returned object lets you examine and configure persistence of data stores and\nlearn approximately how much more space your browser has available for local storage\nuse." }, "navigator.taintenabled": { "url": "$MDN_URL$/web/api/navigator/taintenabled", @@ -9948,7 +10235,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator method unregisterProtocolHandler() removes a protocol handler for a given URL scheme.\n

    This method is the inverse of registerProtocolHandler().", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Navigator method unregisterProtocolHandler() removes a protocol handler for a given URL scheme.\n

    This method is the inverse of registerProtocolHandler().", "parameters": { "scheme": "A string containing the permitted scheme in the protocol handler that will be unregistered.\nFor example, you can unregister the handler for SMS text message links by passing the \"sms\" scheme.", "url": "A string containing the URL of the handler.\nThis URL should match the one that was used to register the handler (e.g., it must include %s)." @@ -9973,7 +10260,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The usb read-only property of the Navigator interface returns a USB object for the current document, providing access to WebUSB API functionality." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The usb read-only property of the Navigator interface returns a USB object for the current document, providing access to WebUSB API functionality." }, "navigator.useractivation": { "url": "$MDN_URL$/web/api/navigator/useractivation", @@ -10018,7 +10305,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Navigator.userAgent read-only property returns the\nuser agent string for the current browser.\n

    \n

    Note:\nThe specification asks browsers to provide as little information via this field as\npossible. Never assume that the value of this property will stay the same in future\nversions of the same browser. Try not to use it at all, or only for current and past\nversions of a browser. New browsers may start using the same UA, or part of it, as an\nolder browser: you really have no guarantee that the browser agent is indeed the one\nadvertised by this property.\n

    Also keep in mind that users of a browser can change the value of this field if they\nwant (UA spoofing).\n

    \n

    Browser identification based on detecting the user agent string is\nunreliable and is not recommended, as the user agent\nstring is user configurable. For example:\n

    " + "doc": "The Navigator.userAgent read-only property of the Navigator interface returns the User-Agent (UA) string for the current browser." }, "navigator.useragentdata": { "url": "$MDN_URL$/web/api/navigator/useragentdata", @@ -10035,7 +10322,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The userAgentData read-only property of the Navigator interface returns a NavigatorUAData object\nwhich can be used to access the User-Agent Client Hints API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The userAgentData read-only property of the Navigator interface returns a NavigatorUAData object\nwhich can be used to access the User-Agent Client Hints API." }, "navigator.vendor": { "url": "$MDN_URL$/web/api/navigator/vendor", @@ -10106,7 +10393,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The virtualKeyboard read-only property\nof the navigator interface returns a reference to the VirtualKeyboard instance object.\n

    The VirtualKeyboard API gives developers control over the layout of their applications when the on-screen virtual keyboard appears and disappears on devices such as tablets, mobile phones, or other devices where a hardware keyboard may not be available." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The virtualKeyboard read-only property\nof the navigator interface returns a reference to the VirtualKeyboard instance object.\n

    The VirtualKeyboard API gives developers control over the layout of their applications when the on-screen virtual keyboard appears and disappears on devices such as tablets, mobile phones, or other devices where a hardware keyboard may not be available." }, "navigator.wakelock": { "url": "$MDN_URL$/web/api/navigator/wakelock", @@ -10127,7 +10414,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The wakeLock read-only property of the Navigator interface returns a WakeLock interface that allows a document to acquire a screen wake lock.\nWhile a screen wake lock is active, the user agent will try to prevent the device from dimming the screen, turning it off completely, or showing a screensaver." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The wakeLock read-only property of the Navigator interface returns a WakeLock interface that allows a document to acquire a screen wake lock.\nWhile a screen wake lock is active, the user agent will try to prevent the device from dimming the screen, turning it off completely, or showing a screensaver." }, "navigator.webdriver": { "url": "$MDN_URL$/web/api/navigator/webdriver", @@ -10164,7 +10451,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The windowControlsOverlay read-only property of the Navigator\ninterface returns the WindowControlsOverlay interface, which exposes\ninformation about the title bar geometry in desktop Progressive Web Apps that use the Window Controls Overlay API.\n

    Progressive Web Apps installed on desktop Operating Systems can opt-in to the\nWindow Controls Overlay feature by using the window-controls-overlay value in the\ndisplay_override web app manifest member.\n

    Doing so hides the default window title bar and gives the app access to the full area\nof the app window." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The windowControlsOverlay read-only property of the Navigator\ninterface returns the WindowControlsOverlay interface, which exposes\ninformation about the title bar geometry in desktop Progressive Web Apps that use the Window Controls Overlay API.\n

    Progressive Web Apps installed on desktop Operating Systems can opt-in to the\nWindow Controls Overlay feature by using the window-controls-overlay value in the\ndisplay_override web app manifest member.\n

    Doing so hides the default window title bar and gives the app access to the full area\nof the app window." }, "navigator.xr": { "url": "$MDN_URL$/web/api/navigator/xr", @@ -10181,7 +10468,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only xr property\nprovided by the Navigator interface returns an XRSystem object\nwhich can be used to access the WebXR Device API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The read-only xr property\nprovided by the Navigator interface returns an XRSystem object\nwhich can be used to access the WebXR Device API." }, "navigatorlogin": { "url": "$MDN_URL$/web/api/navigatorlogin", @@ -10196,7 +10483,7 @@ "FirefoxAndroid": "138", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The NavigatorLogin interface of the Federated Credential Management (FedCM) API defines login functionality for federated identity providers (IdPs). Specifically, it enables a federated identity provider (IdP) to set its login status when a user signs into or out of the IdP.\n

    See Update login status using the Login Status API for more details of how this is used.\n

    NavigatorLogin is accessed via the Navigator.login property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The NavigatorLogin interface of the Federated Credential Management (FedCM) API defines login functionality for federated identity providers (IdPs). Specifically, it enables a federated identity provider (IdP) to set its login status when a user signs into or out of the IdP.\n

    See Update login status using the Login Status API for more details of how this is used.\n

    NavigatorLogin is accessed via the Navigator.login property." }, "navigatorlogin.setstatus": { "url": "$MDN_URL$/web/api/navigatorlogin/setstatus", @@ -10211,7 +10498,7 @@ "FirefoxAndroid": "138", "Opera": "106" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setStatus() method of the NavigatorLogin interface sets the login status of a federated identity provider (IdP), when called from the IdP's origin. By this, we mean \"whether any users are logged into the IdP on the current browser or not\". This should be called by the IdP site following a user login or logout.\n

    The browser stores this state for each IdP; the FedCM API then uses it to reduce the number of requests it makes to the IdP (because it does not need to waste time requesting accounts when there are no users logged in to the IdP). It also mitigates potential timing attacks.\n

    See Update login status using the Login Status API for more information about FedCM login status.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setStatus() method of the NavigatorLogin interface sets the login status of a federated identity provider (IdP), when called from the IdP's origin. By this, we mean \"whether any users are logged into the IdP on the current browser or not\". This should be called by the IdP site following a user login or logout.\n

    The browser stores this state for each IdP; the FedCM API then uses it to reduce the number of requests it makes to the IdP (because it does not need to waste time requesting accounts when there are no users logged in to the IdP). It also mitigates potential timing attacks.\n

    See Update login status using the Login Status API for more information about FedCM login status.", "parameters": { "status": "A string representing the login status to set for the IdP. Possible values are:\n

    " }, @@ -10235,7 +10522,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The NavigatorUAData interface of the User-Agent Client Hints API returns information about the browser and operating system of a user.\n

    An instance of this object is returned by calling Navigator.userAgentData or WorkerNavigator.userAgentData. Therefore, this interface has no constructor.\n

    \n

    Note:\nThe terms high entropy and low entropy refer to the amount of information these values reveal about the browser. The values returned as properties are deemed low entropy, and unlikely to identify a user. The values returned by NavigatorUAData.getHighEntropyValues() could potentially reveal more information. These values are therefore retrieved via a Promise, allowing time for the browser to request user permission, or make other checks.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The NavigatorUAData interface of the User-Agent Client Hints API returns information about the browser and operating system of a user.\n

    An instance of this object is returned by calling Navigator.userAgentData or WorkerNavigator.userAgentData. Therefore, this interface has no constructor.\n

    \n

    Note:\nThe terms high entropy and low entropy refer to the amount of information these values reveal about the browser. The values returned as properties are deemed low entropy, which are unlikely to identify a user. The NavigatorUAData.getHighEntropyValues() can be used to request additional high entropy values, which could potentially reveal more identifying information. These values are therefore retrieved via a Promise, allowing time for the browser to request user permission, or make other checks.\n

    " }, "navigatoruadata.brands": { "url": "$MDN_URL$/web/api/navigatoruadata/brands", @@ -10269,11 +10556,11 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getHighEntropyValues() method of the NavigatorUAData interface is a Promise that resolves with a dictionary object containing the high entropy values the user-agent returns.\n

    \n

    Note:\nThe terms high entropy and low entropy refer to the amount of information these values reveal about the browser.\nThe values returned as properties are deemed low entropy, and unlikely to identify a user.\nThe values returned by getHighEntropyValues() could potentially reveal more information.\nThese values are therefore retrieved via a Promise, allowing time for the browser to request user permission, or make other checks.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getHighEntropyValues() method of the NavigatorUAData interface returns a Promise that resolves with a dictionary object containing low entropy information and requested high entropy information about the browser.\n

    The resolved object has the \"low entropy\" properties available on the NavigatorUAData object included by default — these are the values that are unlikely to enable fingerprinting of the user.\nIt also contains the subset of \"high entropy\" values requested in the parameter object, and for which permission has been granted.\nThese are the values that are more likely to enable fingerprinting.\nNote that meaning of the terms low entropy and high entropy is the same as defined in the HTTP User Agent Client Hints mechanism.\n

    \n

    Note:\nUsage of the getHighEntropyValues() method to retrieve high-entropy user-agent data can be controlled via the ch-ua-high-entropy-values Permissions-Policy.\nIf the permission is not allowed, the method will only return the brands, mobile, and platform low-entropy data.\n

    ", "parameters": { - "hints": "An array containing the hints to be returned, one or more of:\n" + "hints": "An array containing the high-entropy hints to be returned.\nThis may include one or more of:\n" }, - "returns": "A Promise that resolves to an object containing some or all of the following values (based on the hints requested):\n
    \n
    brands
    \n
    \n

    Returns an array of objects containing brand and version specifying the browser brand and its version (the same information as provided by NavigatorUAData.brands).\nNote that this information can be sent to a server in the Sec-CH-UA header (a low-entropy client hint).\n

    \n
    mobile
    \n
    \n

    Returns true if the user agent is running on a mobile device (the same information as provided by NavigatorUAData.mobile).\nNote that this information can be sent to a server in the Sec-CH-UA-Mobile header (a low-entropy client hint).\n

    \n
    platform
    \n
    \n

    Returns a string describing the platform the user agent is running on, like \"Windows\" (the same information as provided by NavigatorUAData.platform).\nNote that this information can be sent to a server in the Sec-CH-UA-Platform header (a low-entropy client hint).\n

    \n
    architecture
    \n
    \n

    A string containing the platform architecture. For example, \"x86\".\nNote that this information can be sent to a server in the Sec-CH-UA-Arch header after the server explicitly requests it in the Accept-CH header.\n

    \n
    bitness
    \n
    \n

    A string containing the architecture bitness. For example, \"32\" or \"64\".\nNote that this information can be sent to a server in the Sec-CH-UA-Bitness header if the server explicitly requests it in the Accept-CH header.\n

    \n
    formFactors
    \n
    \n

    An array of strings containing the form-factors of a device. For example, [\"Tablet\", \"XR\"].\nNote that this information can be sent to a server in the Sec-CH-UA-Form-Factors header if the server explicitly requests it in the Accept-CH header.\n

    \n
    fullVersionList
    \n
    \n

    An array of objects with properties \"brand\" and \"version\" representing the browser name and full version respectively.\nFor example, {\"brand\": \"Google Chrome\", \"version\": \"103.0.5060.134\"}, {\"brand\": \"Chromium\", \"version\": \"103.0.5060.134\"}.\nPlease note that one object may intentionally contain invalid information to prevent sites from relying on a fixed list of browsers.\nNote that this information can be sent to a server in the Sec-CH-UA-Full-Version-List header if the server explicitly requests it in the Accept-CH header.\n

    \n
    model
    \n
    \n

    A string containing the model of mobile device. For example, \"Pixel 2XL\". If device is not a mobile device or if device model is not known, model will be \"\".\nNote that this information can be sent to a server in the Sec-CH-UA-Model header if the server explicitly requests it in the Accept-CH header.\n

    \n
    platformVersion
    \n
    \n

    A string containing the platform version. Platform name itself is always available as low-entropy hint platform. For example, \"10.0\".\nNote that this information can be sent to a server in the Sec-CH-UA-Platform-Version header if the server explicitly requests it in the Accept-CH header.\n

    \n
    uaFullVersion \nDeprecated\n
    \n
    \n

    A string containing the full browser version. For example, \"103.0.5060.134\". Deprecated in favor of fullVersionList.\nNote that this information can be sent to a server in the Sec-CH-UA-Full-Version header if the server explicitly requests it in the Accept-CH header.\n

    \n
    wow64
    \n
    \n

    A boolean indicating if the user agent's binary is running in 32-bit mode on 64-bit Windows.\nNote that this information can be sent to a server in the Sec-CH-UA-WoW64 header if the server explicitly requests it in the Accept-CH header.\n

    \n
    ", + "returns": "A Promise that resolves to an object containing some or all of the following values (based on the hints requested and granted):\n
    \n
    brands
    \n
    \n

    Returns an array of objects containing brand and version specifying the browser brand and its version (the same information as provided by NavigatorUAData.brands).\nNote that this information can be sent to a server in the Sec-CH-UA header (a low-entropy client hint).\n

    \n
    mobile
    \n
    \n

    Returns true if the user agent is running on a mobile device (the same information as provided by NavigatorUAData.mobile).\nNote that this information can be sent to a server in the Sec-CH-UA-Mobile header (a low-entropy client hint).\n

    \n
    platform
    \n
    \n

    Returns a string describing the platform the user agent is running on, like \"Windows\" (the same information as provided by NavigatorUAData.platform).\nNote that this information can be sent to a server in the Sec-CH-UA-Platform header (a low-entropy client hint).\n

    \n
    architecture
    \n
    \n

    A string containing the platform architecture. For example, \"x86\".\nNote that this information can be sent to a server in the Sec-CH-UA-Arch header after the server explicitly requests it in the Accept-CH header.\n

    \n
    bitness
    \n
    \n

    A string containing the architecture bitness. For example, \"32\" or \"64\".\nNote that this information can be sent to a server in the Sec-CH-UA-Bitness header if the server explicitly requests it in the Accept-CH header.\n

    \n
    formFactors
    \n
    \n

    An array of strings containing the form-factors of a device. For example, [\"Tablet\", \"XR\"].\nNote that this information can be sent to a server in the Sec-CH-UA-Form-Factors header if the server explicitly requests it in the Accept-CH header.\n

    \n
    fullVersionList
    \n
    \n

    An array of objects with properties \"brand\" and \"version\" representing the browser name and full version respectively.\nFor example, {\"brand\": \"Google Chrome\", \"version\": \"103.0.5060.134\"}, {\"brand\": \"Chromium\", \"version\": \"103.0.5060.134\"}.\nPlease note that one object may intentionally contain invalid information to prevent sites from relying on a fixed list of browsers.\nNote that this information can be sent to a server in the Sec-CH-UA-Full-Version-List header if the server explicitly requests it in the Accept-CH header.\n

    \n
    model
    \n
    \n

    A string containing the model of mobile device. For example, \"Pixel 2XL\". If device is not a mobile device or if device model is not known, model will be \"\".\nNote that this information can be sent to a server in the Sec-CH-UA-Model header if the server explicitly requests it in the Accept-CH header.\n

    \n
    platformVersion
    \n
    \n

    A string containing the platform version. Platform name itself is always available as low-entropy hint platform. For example, \"10.0\".\nNote that this information can be sent to a server in the Sec-CH-UA-Platform-Version header if the server explicitly requests it in the Accept-CH header.\n

    \n
    uaFullVersion \nDeprecated\n
    \n
    \n

    A string containing the full browser version. For example, \"103.0.5060.134\". Deprecated in favor of fullVersionList.\nNote that this information can be sent to a server in the Sec-CH-UA-Full-Version header if the server explicitly requests it in the Accept-CH header.\n

    \n
    wow64
    \n
    \n

    A boolean indicating if the user agent's binary is running in 32-bit mode on 64-bit Windows.\nNote that this information can be sent to a server in the Sec-CH-UA-WoW64 header if the server explicitly requests it in the Accept-CH header.\n

    \n
    ", "throws": { "NotAllowedError DOMException": "Thrown if the user-agent decides that one or more of the hints requested should not be returned." } @@ -10342,7 +10629,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFMessage interface of the Web NFC API represents the content of an NDEF message that has been read from or could be written to an NFC tag. An instance is acquired by calling the NDEFMessage() constructor or from the NDEFReadingEvent.message property, which is passed to the reading event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFMessage interface of the Web NFC API represents the content of an NDEF message that has been read from or could be written to an NFC tag. An instance is acquired by calling the NDEFMessage() constructor or from the NDEFReadingEvent.message property, which is passed to the reading event." }, "ndefmessage.ndefmessage": { "url": "$MDN_URL$/web/api/ndefmessage/ndefmessage", @@ -10356,7 +10643,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFMessage() constructor creates a new NDEFMessage object, initialized with the given NDEF records.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFMessage() constructor creates a new NDEFMessage object, initialized with the given NDEF records.", "parameters": { "records": "An array of objects with the following members:\n

    \n
    data Optional
    \n
    \n

    Contains the data to be transmitted; one of a string, an ArrayBuffer, a TypedArray, a DataView, or an array of nested records.\n

    \n
    encoding Optional
    \n
    \n

    A string specifying the record's encoding.\n

    \n
    id Optional
    \n
    \n

    A developer-defined identifier for the record.\n

    \n
    lang Optional
    \n
    \n

    A valid BCP 47 language tag.\n

    \n
    mediaType Optional
    \n
    \n

    A valid MIME type.\n

    \n
    recordType
    \n
    \n

    A string indicating the type of data stored in data. It must be one of the following values:\n

    \n
    \"absolute-url\"
    \n
    \n

    An absolute URL to the data.\n

    \n
    \"empty\"
    \n
    \n

    An empty NDEFRecord.\n

    \n
    \"mime\"
    \n
    \n

    A valid MIME type.\n

    \n
    \"smart-poster\"
    \n
    \n

    A smart poster as defined by the NDEF-SMARTPOSTER specification.\n

    \n
    \"text\"
    \n
    \n

    Text as defined by the NDEF-TEXT specification.\n

    \n
    \"unknown\"
    \n
    \n

    The record type is not known.\n

    \n
    \"URL\"
    \n
    \n

    A URL as defined by the NDEF-URI specification.\n

    \n
    \n
    \n
    " } @@ -10373,7 +10660,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The records property of\nNDEFMessage interface represents a list of NDEFRecords\npresent in the NDEF message." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The records property of\nNDEFMessage interface represents a list of NDEFRecords\npresent in the NDEF message." }, "ndefreader": { "url": "$MDN_URL$/web/api/ndefreader", @@ -10387,7 +10674,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReader interface of the Web NFC API is used to read from and write data to compatible NFC devices, e.g., NFC tags supporting NDEF, when these devices are within the reader's magnetic induction field." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReader interface of the Web NFC API is used to read from and write data to compatible NFC devices, e.g., NFC tags supporting NDEF, when these devices are within the reader's magnetic induction field." }, "ndefreader.ndefreader": { "url": "$MDN_URL$/web/api/ndefreader/ndefreader", @@ -10401,7 +10688,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReader()\nconstructor of the NDEFReader interface returns a\nnew NDEFReader object, which is used to read NDEF messages from\ncompatible NFC devices, e.g., NDEF tags, within the reader's magnetic induction\nfield.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReader()\nconstructor of the NDEFReader interface returns a\nnew NDEFReader object, which is used to read NDEF messages from\ncompatible NFC devices, e.g., NDEF tags, within the reader's magnetic induction\nfield.", "returns": "A new NDEFReader." }, "ndefreader.scan": { @@ -10416,7 +10703,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The scan() method of the NDEFReader interface activates a reading device and returns a Promise that either resolves when an NFC tag read operation is scheduled or rejects if a hardware or permission error is encountered. This method triggers a permission prompt if the \"nfc\" permission has not been previously granted.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The scan() method of the NDEFReader interface activates a reading device and returns a Promise that either resolves when an NFC tag read operation is scheduled or rejects if a hardware or permission error is encountered. This method triggers a permission prompt if the \"nfc\" permission has not been previously granted.", "parameters": { "options": "An object with the following properties:\n

    \n
    signal
    \n
    \n

    An AbortSignal that allows cancelling this scan() operation.\n

    \n
    " }, @@ -10440,7 +10727,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The write() method of the NDEFReader interface attempts to write an NDEF message to a tag and returns a Promise that either resolves when a message has been written to the tag or rejects if a hardware or permission error is encountered. This method triggers a permission prompt if the \"nfc\" permission has not been previously granted.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The write() method of the NDEFReader interface attempts to write an NDEF message to a tag and returns a Promise that either resolves when a message has been written to the tag or rejects if a hardware or permission error is encountered. This method triggers a permission prompt if the \"nfc\" permission has not been previously granted.", "parameters": { "message": "The message to be written, either a string, an ArrayBuffer, a TypedArray,\na DataView, or an array of records. A record has the following members:\n

    \n
    data Optional
    \n
    \n

    Contains the data to be transmitted, a string, an ArrayBuffer, a TypedArray,\na DataView, or an array of nested records\n

    \n
    encoding Optional
    \n
    \n

    A string specifying the record's encoding.\n

    \n
    id Optional
    \n
    \n

    A developer-defined identifier for the record.\n

    \n
    lang Optional
    \n
    \n

    A valid BCP 47 language tag.\n

    \n
    mediaType Optional
    \n
    \n

    A valid MIME type.\n

    \n
    recordType
    \n
    \n

    A string indicating the type of data stored in data. It must be one of the following values:\n

    \n
    \"absolute-url\"
    \n
    \n

    An absolute URL to the data.\n

    \n
    \"empty\"
    \n
    \n

    An empty NDEFRecord.\n

    \n
    \"mime\"
    \n
    \n

    A valid MIME type.\n

    \n
    \"smart-poster\"
    \n
    \n

    A smart poster as defined by the NDEF-SMARTPOSTER specification.\n

    \n
    \"text\"
    \n
    \n

    Text as defined by the NDEF-TEXT specification.\n

    \n
    \"unknown\"
    \n
    \n

    The record type is not known.\n

    \n
    \"URL\"
    \n
    \n

    A URL as defined by the NDEF-URI specification.\n

    \n
    \n
    \n
    ", "options": "An object with the following properties:\n
    \n
    overwrite
    \n
    \n

    A boolean value specifying whether or not existing records should be overwritten, if such exists.\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal that allows the current write operation to be canceled.\n

    \n
    " @@ -10466,7 +10753,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReadingEvent interface of the Web NFC API represents events dispatched on new NFC readings obtained by NDEFReader." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReadingEvent interface of the Web NFC API represents events dispatched on new NFC readings obtained by NDEFReader." }, "ndefreadingevent.message": { "url": "$MDN_URL$/web/api/ndefreadingevent/message", @@ -10480,7 +10767,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The message property of the NDEFReadingEvent interface returns an NDEFMessage object containing the received message." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The message property of the NDEFReadingEvent interface returns an NDEFMessage object containing the received message." }, "ndefreadingevent.ndefreadingevent": { "url": "$MDN_URL$/web/api/ndefreadingevent/ndefreadingevent", @@ -10494,7 +10781,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReadingEvent() constructor creates a new NDEFReadingEvent object which represents events dispatched on new NFC readings obtained by NDEFReader.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFReadingEvent() constructor creates a new NDEFReadingEvent object which represents events dispatched on new NFC readings obtained by NDEFReader.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to reading.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    serialNumber Optional
    \n
    \n

    The serial number of the device a message was read from. It default to \"\", and can be set to null.\n

    \n
    message
    \n
    \n

    An object with the following members:\n

    \n
    data Optional
    \n
    \n

    Contains the data to be transmitted. It can be a string, an ArrayBuffer, a TypedArray, a DataView, or an array of nested records.\n

    \n
    encoding Optional
    \n
    \n

    A string specifying the record's encoding.\n

    \n
    id Optional
    \n
    \n

    A developer-defined identifier for the record.\n

    \n
    lang Optional
    \n
    \n

    A valid BCP 47 language tag.\n

    \n
    mediaType Optional
    \n
    \n

    A valid MIME type.\n

    \n
    recordType
    \n
    \n

    A string indicating the type of data stored in data. It must be one of the following values:\n

    \n
    \"absolute-url\"
    \n
    \n

    An absolute URL to the data.\n

    \n
    \"empty\"
    \n
    \n

    An empty NDEFRecord.\n

    \n
    \"mime\"
    \n
    \n

    A valid MIME type.\n

    \n
    \"smart-poster\"
    \n
    \n

    A smart poster as defined by the NDEF-SMARTPOSTER specification.\n

    \n
    \"text\"
    \n
    \n

    Text as defined by the NDEF-TEXT specification.\n

    \n
    \"unknown\"
    \n
    \n

    The record type is not known.\n

    \n
    \"URL\"
    \n
    \n

    A URL as defined by the NDEF-URI specification.\n

    \n
    \n
    \n
    \n
    \n
    " @@ -10513,7 +10800,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The serialNumber property of the NDEFReadingEvent interface returns the serial number of the device, which is used for anti-collision and identification, or an empty string if no serial number is available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The serialNumber property of the NDEFReadingEvent interface returns the serial number of the device, which is used for anti-collision and identification, or an empty string if no serial number is available." }, "ndefrecord": { "url": "$MDN_URL$/web/api/ndefrecord", @@ -10527,7 +10814,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFRecord interface of the Web NFC API provides data that can be read from, or written to, compatible NFC devices, e.g., NFC tags supporting NDEF." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFRecord interface of the Web NFC API provides data that can be read from, or written to, compatible NFC devices, e.g., NFC tags supporting NDEF." }, "ndefrecord.data": { "url": "$MDN_URL$/web/api/ndefrecord/data", @@ -10541,7 +10828,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The data\nproperty of the NDEFRecord interface returns a\nDataView containing the raw bytes of the record's payload." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The data\nproperty of the NDEFRecord interface returns a\nDataView containing the raw bytes of the record's payload." }, "ndefrecord.encoding": { "url": "$MDN_URL$/web/api/ndefrecord/encoding", @@ -10555,7 +10842,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The encoding\nproperty of the NDEFRecord interface returns the encoding of\na textual payload, or null otherwise." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The encoding\nproperty of the NDEFRecord interface returns the encoding of\na textual payload, or null otherwise." }, "ndefrecord.id": { "url": "$MDN_URL$/web/api/ndefrecord/id", @@ -10569,7 +10856,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The id property of the\nNDEFRecord interface returns the record identifier, which is an\nabsolute or relative URL used to identify the record.\n

    This identifier is created by the generator of the record which is solely responsible\nfor enforcing record identifier uniqueness. Web NFC does not sign the NFC content, thus\nrecord consumer should not make any assumptions about integrity or authenticity of the\nidentifier or any other part of the records." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The id property of the\nNDEFRecord interface returns the record identifier, which is an\nabsolute or relative URL used to identify the record.\n

    This identifier is created by the generator of the record which is solely responsible\nfor enforcing record identifier uniqueness. Web NFC does not sign the NFC content, thus\nrecord consumer should not make any assumptions about integrity or authenticity of the\nidentifier or any other part of the records." }, "ndefrecord.lang": { "url": "$MDN_URL$/web/api/ndefrecord/lang", @@ -10583,7 +10870,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The lang\nproperty of the NDEFRecord interface returns the language of\na textual payload, or null if one was not supplied.\n

    The record might be missing a language tag, for example, if the recorded information is\nnot locale-specific." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The lang\nproperty of the NDEFRecord interface returns the language of\na textual payload, or null if one was not supplied.\n

    The record might be missing a language tag, for example, if the recorded information is\nnot locale-specific." }, "ndefrecord.mediatype": { "url": "$MDN_URL$/web/api/ndefrecord/mediatype", @@ -10597,7 +10884,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The mediaType\nproperty of the NDEFRecord interface returns the MIME type of the record. This value will be null if recordType is not equal to \"mime\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The mediaType\nproperty of the NDEFRecord interface returns the MIME type of the record. This value will be null if recordType is not equal to \"mime\"." }, "ndefrecord.ndefrecord": { "url": "$MDN_URL$/web/api/ndefrecord/ndefrecord", @@ -10611,7 +10898,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFRecord()\nconstructor of the Web NFC API returns a\nnewly constructed NDEFRecord object that represents data that can be\nread from, or written to, compatible NFC devices; e.g., NFC tags supporting NDEF.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The NDEFRecord()\nconstructor of the Web NFC API returns a\nnewly constructed NDEFRecord object that represents data that can be\nread from, or written to, compatible NFC devices; e.g., NFC tags supporting NDEF.", "parameters": { "options": "An object with the following properties:\n

    \n
    data Optional
    \n
    \n

    Contains the data to be transmitted. It can be a string, an ArrayBuffer, a TypedArray, a DataView, or an array of nested records.\n

    \n
    encoding Optional
    \n
    \n

    A string specifying the record's encoding.\n

    \n
    id Optional
    \n
    \n

    A developer-defined identifier for the record.\n

    \n
    lang Optional
    \n
    \n

    A valid BCP 47 language tag.\n

    \n
    mediaType Optional
    \n
    \n

    A valid MIME type.\n

    \n
    recordType
    \n
    \n

    A string indicating the type of data stored in data. It must be one of the following values:\n

    \n
    \"absolute-url\"
    \n
    \n

    An absolute URL to the data.\n

    \n
    \"empty\"
    \n
    \n

    An empty NDEFRecord.\n

    \n
    \"mime\"
    \n
    \n

    A valid MIME type.\n

    \n
    \"smart-poster\"
    \n
    \n

    A smart poster as defined by the NDEF-SMARTPOSTER specification.\n

    \n
    \"text\"
    \n
    \n

    Text as defined by the NDEF-TEXT specification.\n

    \n
    \"unknown\"
    \n
    \n

    The record type is not known.\n

    \n
    \"URL\"
    \n
    \n

    A URL as defined by the NDEF-URI specification.\n

    \n
    \n
    \n
    " }, @@ -10629,7 +10916,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The recordType\nproperty of the NDEFRecord interface returns the record type of the record." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The recordType\nproperty of the NDEFRecord interface returns the record type of the record." }, "ndefrecord.torecords": { "url": "$MDN_URL$/web/api/ndefrecord/torecords", @@ -10643,7 +10930,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The toRecords()\nmethod of the NDEFRecord interface converts\nNDEFRecord.data to a sequence of records based on\nNDEFRecord.recordType, and returns the result. This allows\nparsing the payloads of record types which may contain nested records, such\nas smart poster and external type records.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The toRecords()\nmethod of the NDEFRecord interface converts\nNDEFRecord.data to a sequence of records based on\nNDEFRecord.recordType, and returns the result. This allows\nparsing the payloads of record types which may contain nested records, such\nas smart poster and external type records.", "returns": "A list of NDEFRecords.", "throws": { "NotSupported DOMException": "Indicates that the User Agent does not know how to parse this combination of\nNDEFRecord.data and NDEFRecord.recordType." @@ -10852,7 +11139,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only childNodes property of the Node interface returns a live\nNodeList of child nodes of the given element where\nthe first child node is assigned index 0. Child nodes include elements, text and\ncomments.\n

    \n

    Note:\nThe NodeList being live means that its content is changed each time\nnew children are added or removed.\n

    Browsers insert text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.childNodes[0]\nmay refer to a whitespace text node rather than the actual element the author intended to get.\n

    See Working with whitespace in the DOM for more information.\n

    \n

    The items in the collection of nodes are objects, not strings. To get data from node\nobjects, use their properties. For example, to get the name of the first\nchildNode, you can use elementNodeReference.childNodes[0].nodeName.\n

    The document object itself has two children: the Doctype declaration and the\nroot element, typically referred to as documentElement. In HTML\ndocuments the latter is the <html> element.\n

    It is important to keep in mind that childNodes includes all child nodes,\nincluding non-element nodes like text and comment.\nTo get a collection containing only elements, use Element.children instead." + "doc": "The read-only childNodes property of the Node interface returns a live\nNodeList of child nodes of the given element where\nthe first child node is assigned index 0. Child nodes include elements, text and\ncomments.\n

    \n

    Note:\nThe NodeList being live means that its content is changed each time\nnew children are added or removed.\n

    Browsers insert text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.childNodes[0]\nmay refer to a whitespace text node rather than the actual element the author intended to get.\n

    See Working with whitespace in the DOM for more information.\n

    \n

    The items in the collection of nodes are objects, not strings. To get data from node\nobjects, use their properties. For example, to get the name of the first\nchildNode, you can use elementNodeReference.childNodes[0].nodeName.\n

    The document object itself has two children: the Doctype declaration and the\nroot element, typically referred to as documentElement. In HTML\ndocuments the latter is the <html> element.\n

    It is important to keep in mind that childNodes includes all child nodes,\nincluding non-element nodes like text and comment.\nTo get a collection containing only elements, use Element.children instead." }, "node.clonenode": { "url": "$MDN_URL$/web/api/node/clonenode", @@ -10874,9 +11161,9 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The cloneNode() method of the Node interface\nreturns a duplicate of the node on which this method was called.\nIts parameter controls if the subtree contained in a node is also cloned or not.\n

    Cloning a node copies all of its attributes and their values,\nincluding intrinsic (inline) listeners. It does not copy event listeners added\nusing addEventListener() or\nthose assigned to element properties (e.g., node.onclick = someFunction).\nAdditionally, for a <canvas> element, the painted image is not copied.\n

    \n

    Warning:\ncloneNode() may lead to duplicate element IDs in a document!\n

    If the original node has an id attribute, and the clone\nwill be placed in the same document, then you should modify the clone's ID to be\nunique.\n

    Also, name attributes may need to be modified,\ndepending on whether duplicate names are expected.\n

    \n

    To clone a node to insert into a different document, use\nDocument.importNode() instead.", + "doc": "The cloneNode() method of the Node interface returns a duplicate of the node on which this method was called. Its parameter controls if the subtree contained in the node is also cloned or not.\n

    By default, cloning a node copies all of its attributes and their values, including event listeners specified via attributes. By setting the deep parameter, you can also copy the subtree contained in the node. It does not copy any other internal data, such as event listeners added using addEventListener() or onevent properties (e.g., node.onclick = someFunction), or the painted image for a <canvas> element.\n

    The Document.importNode() method also creates a copy of a node. The difference is that importNode() clones the node in the context of the calling document, whereas cloneNode() uses the document of the node being cloned. The document context determines the CustomElementRegistry for constructing any custom elements. For this reason, to clone nodes to be used in another document, use importNode() on the target document. The HTMLTemplateElement.content is owned by a separate document, so it should also be cloned using document.importNode() so that custom element descendants are constructed using the definitions in the current document.\n

    \n

    Warning:\ncloneNode() may lead to duplicate element IDs in a document! If the original node has an id attribute, and the clone will be placed in the same document, then you should modify the clone's ID to be unique.\n

    Also, name attributes may need to be modified, depending on whether duplicate names are expected.\n

    ", "parameters": { - "deep": "If true, then the node and its whole subtree,\nincluding text that may be in child Text nodes,\nis also copied.\n

    If false, only the node will be cloned.\nThe subtree, including any text that the node contains, is not cloned.\n

    Note that deep has no effect on void elements,\nsuch as the <img> and <input> elements." + "deep": "If true, then the node and its whole subtree,\nincluding text that may be in child Text nodes,\nis also copied.\n

    If false or omitted, only the node will be cloned.\nThe subtree, including any text that the node contains, is not cloned.\n

    Note that deep has no effect on void elements,\nsuch as the <img> and <input> elements." }, "returns": "The new Node cloned.\nThe cloned node has no parent and is not part of the document,\nuntil it is added to another node that is part of the document,\nusing Node.appendChild() or a similar method." }, @@ -11224,7 +11511,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only nextSibling property of the Node interface\nreturns the node immediately following the specified one in their\nparent's childNodes, or returns null\nif the specified node is the last child in the parent element.\n

    \n

    Note:\nBrowsers insert Text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.firstChild\nor Node.previousSibling\nmay refer to a whitespace text node rather than the actual element the author\nintended to get.\n

    The section Working with whitespace in the DOM\ncontains more information about this behavior.\n

    You can use Element.nextElementSibling to obtain the next element\nskipping any whitespace nodes, other between-element text, or comments.\n

    To navigate the opposite way through the child nodes list use Node.previousSibling.\n

    " + "doc": "The read-only nextSibling property of the Node interface\nreturns the node immediately following the specified one in their\nparent's childNodes, or returns null\nif the specified node is the last child in the parent element.\n
    \n

    Note:\nBrowsers insert Text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.firstChild\nor Node.previousSibling\nmay refer to a whitespace text node rather than the actual element the author\nintended to get.\n

    The section Working with whitespace in the DOM\ncontains more information about this behavior.\n

    You can use Element.nextElementSibling to obtain the next element\nskipping any whitespace nodes, other between-element text, or comments.\n

    To navigate the opposite way through the child nodes list use Node.previousSibling.\n

    " }, "node.nodename": { "url": "$MDN_URL$/web/api/node/nodename", @@ -11268,7 +11555,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only nodeType property of a Node interface is an integer\nthat identifies what the node is. It distinguishes different kind of nodes from each other,\nsuch as elements, text and comments." + "doc": "The read-only nodeType property of a Node interface is an integer\nthat identifies what the node is. It distinguishes different kinds of nodes from each other,\nsuch as elements, text, and comments." }, "node.nodevalue": { "url": "$MDN_URL$/web/api/node/nodevalue", @@ -11401,7 +11688,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only previousSibling property of the Node interface\nreturns the node immediately preceding the specified one in its parent's\nchildNodes list,\nor null if the specified node is the first in that list.\n
    \n

    Note:\nBrowsers insert text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.firstChild\nor Node.previousSibling\nmay refer to a whitespace text node rather than the actual element the author intended to get.\n

    See Working with whitespace in the DOM for more information.\n

    You can use previousElementSibling\nto get the previous element node (skipping text nodes and any other non-element nodes).\n

    To navigate the opposite way through the child nodes list use Node.nextSibling.\n

    " + "doc": "The read-only previousSibling property of the Node interface\nreturns the node immediately preceding the specified one in its parent's\nchildNodes list,\nor null if the specified node is the first in that list.\n
    \n

    Note:\nBrowsers insert text nodes into a document to represent whitespace in the source markup.\nTherefore a node obtained, for example, using Node.firstChild\nor Node.previousSibling\nmay refer to a whitespace text node rather than the actual element the author intended to get.\n

    See Working with whitespace in the DOM for more information.\n

    You can use previousElementSibling\nto get the previous element node (skipping text nodes and any other non-element nodes).\n

    To navigate the opposite way through the child nodes list use Node.nextSibling.\n

    " }, "node.removechild": { "url": "$MDN_URL$/web/api/node/removechild", @@ -11484,7 +11771,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The textContent property of the Node\ninterface represents the text content of the node and its descendants.\n
    \n

    Note:\ntextContent and HTMLElement.innerText are easily confused,\nbut the two properties are different in important ways.\n

    " + "doc": "The textContent property of the Node interface represents the text content of the node and its descendants.\n
    \n

    Note:\ntextContent and HTMLElement.innerText are easily confused, but the two properties are different in important ways.\n

    " }, "nodeiterator": { "url": "$MDN_URL$/web/api/nodeiterator", @@ -11866,7 +12153,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Notification interface of the Notifications API is used to configure and display desktop notifications to the user.\n

    These notifications' appearance and specific functionality vary across platforms but generally they provide a way to asynchronously provide information to the user." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Notification interface of the Notifications API is used to configure and display desktop notifications to the user.\n

    These notifications' appearance and specific functionality vary across platforms but generally they provide a way to asynchronously provide information to the user." }, "notification.actions": { "url": "$MDN_URL$/web/api/notification/actions", @@ -11884,7 +12171,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The actions read-only property of the Notification interface provides the actions available for users to choose from for interacting with the notification.\n

    The actions are set using the actions option of the second argument for the showNotification() method and Notification() constructor.\n

    \n

    Note:\nBrowsers typically limit the maximum number of actions they will display for a particular notification. Check the static Notification.maxActions property to determine the limit.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The actions read-only property of the Notification interface provides the actions available for users to choose from for interacting with the notification.\n

    The actions are set using the actions option of the second argument for the showNotification() method and Notification() constructor.\n

    \n

    Note:\nBrowsers typically limit the maximum number of actions they will display for a particular notification. Check the static Notification.maxActions property to determine the limit.\n

    " }, "notification.badge": { "url": "$MDN_URL$/web/api/notification/badge", @@ -11900,7 +12187,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The badge read-only property of the Notification interface returns a string containing the URL of an image to represent the notification when there is not enough space to display the notification itself such as for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96 by 96 px, and the image will be automatically masked." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The badge read-only property of the Notification interface returns a string containing the URL of an image to represent the notification when there is not enough space to display the notification itself such as for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96 by 96 px, and the image will be automatically masked." }, "notification.body": { "url": "$MDN_URL$/web/api/notification/body", @@ -11920,7 +12207,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The body read-only property of the\nNotification interface indicates the body string of the notification, as\nspecified in the body option of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The body read-only property of the\nNotification interface indicates the body string of the notification, as\nspecified in the body option of the\nNotification() constructor." }, "notification.close": { "url": "$MDN_URL$/web/api/notification/close", @@ -11940,7 +12227,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the Notification interface is used to\nclose/remove a previously displayed notification.\n

    \n

    Note:\nThis API shouldn't be used just to have the notification\nremoved from the screen after a fixed delay since this method will also remove the\nnotification from any notification tray, preventing users from interacting with it\nafter it was initially shown. A valid use for this API would be to remove a\nnotification that is no longer relevant (e.g., the user already read the notification\non the webpage in the case of a messaging app or the following song is already playing\nin a music app).\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the Notification interface is used to\nclose/remove a previously displayed notification.\n

    \n

    Note:\nThis API shouldn't be used just to have the notification\nremoved from the screen after a fixed delay since this method will also remove the\nnotification from any notification tray, preventing users from interacting with it\nafter it was initially shown. A valid use for this API would be to remove a\nnotification that is no longer relevant (e.g., the user already read the notification\non the webpage in the case of a messaging app or the following song is already playing\nin a music app).\n

    ", "returns": "None (undefined)." }, "notification.data": { @@ -11961,7 +12248,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The data read-only property of the\nNotification interface returns a structured clone of the notification's\ndata, as specified in the data option of the\nNotification() constructor.\n

    The notification's data can be any arbitrary data that you want associated with the\nnotification." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The data read-only property of the\nNotification interface returns a structured clone of the notification's\ndata, as specified in the data option of the\nNotification() constructor.\n

    The notification's data can be any arbitrary data that you want associated with the\nnotification." }, "notification.dir": { "url": "$MDN_URL$/web/api/notification/dir", @@ -11981,7 +12268,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dir read-only property of the Notification interface indicates the text direction of the notification, as specified in the dir option of the Notification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The dir read-only property of the Notification interface indicates the text direction of the notification, as specified in the dir option of the Notification() constructor." }, "notification.icon": { "url": "$MDN_URL$/web/api/notification/icon", @@ -11999,7 +12286,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The icon read-only property of the\nNotification interface contains the URL of an icon to be displayed as\npart of the notification, as specified in the icon option of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The icon read-only property of the\nNotification interface contains the URL of an icon to be displayed as\npart of the notification, as specified in the icon option of the\nNotification() constructor." }, "notification.image": { "url": "$MDN_URL$/web/api/notification/image", @@ -12016,7 +12303,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The image read-only property of the\nNotification interface contains the URL of an image to be displayed as\npart of the notification, as specified in the image option of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The image read-only property of the\nNotification interface contains the URL of an image to be displayed as\npart of the notification, as specified in the image option of the\nNotification() constructor." }, "notification.lang": { "url": "$MDN_URL$/web/api/notification/lang", @@ -12035,7 +12322,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lang read-only property of the\nNotification interface indicates the language used in the notification,\nas specified in the lang option of the\nNotification() constructor.\n

    The language itself is specified using a string representing a BCP 47 language tag." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The lang read-only property of the\nNotification interface indicates the language used in the notification,\nas specified in the lang option of the\nNotification() constructor.\n

    The language itself is specified using a string representing a BCP 47 language tag." }, "notification.maxactions": { "url": "$MDN_URL$/web/api/notification/maxactions_static", @@ -12053,7 +12340,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The maxActions read-only static property of the\nNotification interface returns the maximum number of actions supported by\nthe device and the User Agent. Effectively, this is the maximum number of elements in\nNotification.actions array which will be respected by the User Agent." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The maxActions read-only static property of the\nNotification interface returns the maximum number of actions supported by\nthe device and the User Agent. Effectively, this is the maximum number of elements in\nNotification.actions array which will be respected by the User Agent." }, "notification.notification": { "url": "$MDN_URL$/web/api/notification/notification", @@ -12071,7 +12358,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Notification() constructor creates a new Notification object instance, which represents a user notification.\n

    Trying to create a notification inside the ServiceWorkerGlobalScope using the Notification() constructor will throw a TypeError. Use ServiceWorkerRegistration.showNotification() instead.\n

    You must first get permission before being able to display notifications, using Notification.requestPermission(). The permission may not be grantable, for example if the page is in private browsing mode.\n

    This constructor throws a TypeError when called in nearly all mobile browsers and this is unlikely to change, because web pages on mobile devices almost never \"run in the background\", which is the main use case for notifications. Instead, you need to register a service worker and use ServiceWorkerRegistration.showNotification(). See Chrome issue for more information.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The Notification() constructor creates a new Notification object instance, which represents a user notification.\n

    Trying to create a notification inside the ServiceWorkerGlobalScope using the Notification() constructor will throw a TypeError. Use ServiceWorkerRegistration.showNotification() instead.\n

    You must first get permission before being able to display notifications, using Notification.requestPermission(). The permission may not be grantable, for example if the page is in private browsing mode.\n

    This constructor throws a TypeError when called in nearly all mobile browsers and this is unlikely to change, because web pages on mobile devices almost never \"run in the background\", which is the main use case for notifications. Instead, you need to register a service worker and use ServiceWorkerRegistration.showNotification(). See Chrome issue for more information.", "parameters": { "title": "Defines a title for the notification, which is shown at the top of the notification window.", "options": "An options object containing any custom settings that you want to apply to the notification. The possible options are:\n

    \n
    actions Optional
    \n
    \n

    Must be unspecified or an empty array. actions is only supported for persistent notifications fired from a service worker using ServiceWorkerRegistration.showNotification().\n

    \n
    badge Optional
    \n
    \n

    A string containing the URL of the image used to represent the notification when there isn't enough space to display the notification itself; for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96x96px, and the image will be automatically masked.\n

    \n
    body Optional
    \n
    \n

    A string representing the body text of the notification, which is displayed below the title. The default is the empty string.\n

    \n
    data Optional
    \n
    \n

    Arbitrary data that you want associated with the notification. This can be of any structured-clonable data type. The default is null.\n

    \n
    dir Optional
    \n
    \n

    The direction in which to display the notification. It defaults to auto, which just adopts the browser's language setting behavior, but you can override that behavior by setting values of ltr and rtl (although most browsers seem to ignore these settings.)\n

    \n
    icon Optional
    \n
    \n

    A string containing the URL of an icon to be displayed in the notification.\n

    \n
    image Optional
    \n
    \n

    A string containing the URL of an image to be displayed in the notification.\n

    \n
    lang Optional
    \n
    \n

    The notification's language, as specified using a string representing a BCP 47 language tag. The default is the empty string.\n

    \n
    renotify Optional
    \n
    \n

    A boolean value specifying whether the user should be notified after a new notification replaces an old one. The default is false, which means they won't be notified. If true, then tag also must be set.\n

    \n
    requireInteraction Optional
    \n
    \n

    Indicates that a notification should remain active until the user clicks or dismisses it, rather than closing automatically. The default value is false.\n

    \n
    silent Optional
    \n
    \n

    A boolean value specifying whether the notification should be silent, i.e., no sounds or vibrations should be issued regardless of the device settings. If set to true, the notification is silent; if set to null (the default value), the device's default settings are respected.\n

    \n
    tag Optional
    \n
    \n

    A string representing an identifying tag for the notification. The default is the empty string.\n

    \n
    timestamp Optional
    \n
    \n

    A timestamp, given as Unix time in milliseconds, representing the time associated with the notification. This could be in the past when a notification is used for a message that couldn't immediately be delivered because the device was offline, or in the future for a meeting that is about to start.\n

    \n
    vibrate Optional
    \n
    \n

    A vibration pattern for the device's vibration hardware to emit with the notification. If specified, silent must not be true.\n

    \n
    " @@ -12099,7 +12386,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The permission read-only static property of the Notification\ninterface indicates the current permission granted by the user for the current origin to\ndisplay web notifications." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The permission read-only static property of the Notification\ninterface indicates the current permission granted by the user for the current origin to\ndisplay web notifications." }, "notification.renotify": { "url": "$MDN_URL$/web/api/notification/renotify", @@ -12116,7 +12403,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The renotify read-only property of the\nNotification interface specifies whether the user should be notified\nafter a new notification replaces an old one, as specified in the renotify\noption of the Notification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The renotify read-only property of the\nNotification interface specifies whether the user should be notified\nafter a new notification replaces an old one, as specified in the renotify\noption of the Notification() constructor." }, "notification.requestpermission": { "url": "$MDN_URL$/web/api/notification/requestpermission_static", @@ -12135,7 +12422,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestPermission() static method of the Notification interface requests permission from the user for the current origin to display notifications.\n

    The method returns a Promise that fulfills with a string indicating whether permission was granted or denied.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestPermission() static method of the Notification interface requests permission from the user for the current origin to display notifications.\n

    The method returns a Promise that fulfills with a string indicating whether permission was granted or denied.", "parameters": { "callback": "An optional callback function that is called with the permission value.\nDeprecated in favor of the Promise return value." }, @@ -12155,7 +12442,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requireInteraction read-only property of the Notification interface returns a boolean value indicating that a notification should remain active until the user clicks or dismisses it, rather than closing automatically.\n

    \n

    Note:\nThis can be set when the notification is first created by setting the requireInteraction option to true in the options object of the Notification() constructor.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requireInteraction read-only property of the Notification interface returns a boolean value indicating that a notification should remain active until the user clicks or dismisses it, rather than closing automatically.\n

    \n

    Note:\nThis can be set when the notification is first created by setting the requireInteraction option to true in the options object of the Notification() constructor.\n

    " }, "notification.silent": { "url": "$MDN_URL$/web/api/notification/silent", @@ -12174,7 +12461,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The silent read-only property of the\nNotification interface specifies whether the notification should be\nsilent, i.e., no sounds or vibrations should be issued regardless of the device\nsettings. This is controlled via the silent option of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The silent read-only property of the\nNotification interface specifies whether the notification should be\nsilent, i.e., no sounds or vibrations should be issued regardless of the device\nsettings. This is controlled via the silent option of the\nNotification() constructor." }, "notification.tag": { "url": "$MDN_URL$/web/api/notification/tag", @@ -12192,7 +12479,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The tag read-only property of the\nNotification interface signifies an identifying tag for the notification,\nas specified in the tag option of the\nNotification() constructor.\n

    The idea of notification tags is that more than one notification can share the same\ntag, linking them together. One notification can then be programmatically replaced with\nanother to avoid the users' screen being filled up with a huge number of similar\nnotifications." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The tag read-only property of the\nNotification interface signifies an identifying tag for the notification,\nas specified in the tag option of the\nNotification() constructor.\n

    The idea of notification tags is that more than one notification can share the same\ntag, linking them together. One notification can then be programmatically replaced with\nanother to avoid the users' screen being filled up with a huge number of similar\nnotifications." }, "notification.timestamp": { "url": "$MDN_URL$/web/api/notification/timestamp", @@ -12209,7 +12496,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The timestamp read-only property of the\nNotification interface returns a number, as\nspecified in the timestamp option of the\nNotification() constructor.\n

    The notification's timestamp can represent the time, in milliseconds since 00:00:00 UTC\non 1 January 1970, of the event for which the notification was created, or it can be an\narbitrary timestamp that you want associated with the notification. For example, a\ntimestamp for an upcoming meeting could be set in the future, whereas a timestamp for a\nmissed message could be set in the past." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The timestamp read-only property of the\nNotification interface returns a number, as\nspecified in the timestamp option of the\nNotification() constructor.\n

    The notification's timestamp can represent the time, in milliseconds since 00:00:00 UTC\non 1 January 1970, of the event for which the notification was created, or it can be an\narbitrary timestamp that you want associated with the notification. For example, a\ntimestamp for an upcoming meeting could be set in the future, whereas a timestamp for a\nmissed message could be set in the past." }, "notification.title": { "url": "$MDN_URL$/web/api/notification/title", @@ -12228,7 +12515,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The title read-only property of the\nNotification interface indicates the title of the notification, as\nspecified in the title parameter of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The title read-only property of the\nNotification interface indicates the title of the notification, as\nspecified in the title parameter of the\nNotification() constructor." }, "notification.vibrate": { "url": "$MDN_URL$/web/api/notification/vibrate", @@ -12245,7 +12532,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vibrate read-only property of the Notification\ninterface specifies a vibration pattern\nfor the device's vibration hardware to emit when the notification fires. This is\nspecified in the vibrate option of the\nNotification() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vibrate read-only property of the Notification\ninterface specifies a vibration pattern\nfor the device's vibration hardware to emit when the notification fires. This is\nspecified in the vibrate option of the\nNotification() constructor." }, "notificationevent": { "url": "$MDN_URL$/web/api/notificationevent", @@ -12846,7 +13133,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The OffscreenCanvas.getContext() method returns a drawing context for an offscreen canvas, or null if the context identifier is not supported, or the offscreen canvas has already been set to a different context mode.", "parameters": { - "contextType": "A string containing the context identifier defining the drawing context associated to the canvas. Possible values are:\n

    \n
    2d
    \n
    \n

    Creates a OffscreenCanvasRenderingContext2D object representing a two-dimensional rendering context.\n

    \n
    webgl
    \n
    \n

    Creates a WebGLRenderingContext object representing a three-dimensional rendering context. This context is only available on browsers that implement WebGL version 1 (OpenGL ES 2.0).\n

    \n
    webgl2
    \n
    \n

    Creates a WebGL2RenderingContext object representing a three-dimensional rendering context. This context is only available on browsers that implement WebGL version 2 (OpenGL ES 3.0).\n

    \n
    \"webgpu\"
    \n
    \n

    Creates a GPUCanvasContext object representing a three-dimensional rendering context for WebGPU render pipelines. This context is only available on browsers that implement WebGPU API.\n

    \n
    bitmaprenderer
    \n
    \n

    Creates a ImageBitmapRenderingContext which only provides functionality to replace the content of the canvas with a given ImageBitmap.\n

    \n
    \n
    \n

    Note:\nThe identifiers \"experimental-webgl\" or \"experimental-webgl2\" are also used in implementations of WebGL.\nThese implementations have not reached test suite conformance, or the graphic drivers situation on the platform is not yet stable.\nThe Khronos Group certifies WebGL implementations under certain conformance rules.\n

    ", + "contextType": "A string containing the context identifier defining the drawing context associated to the canvas. Possible values are:\n
    \n
    2d
    \n
    \n

    Creates an OffscreenCanvasRenderingContext2D object representing a two-dimensional rendering context.\n

    \n
    webgl
    \n
    \n

    Creates a WebGLRenderingContext object representing a three-dimensional rendering context. This context is only available on browsers that implement WebGL version 1 (OpenGL ES 2.0).\n

    \n
    webgl2
    \n
    \n

    Creates a WebGL2RenderingContext object representing a three-dimensional rendering context. This context is only available on browsers that implement WebGL version 2 (OpenGL ES 3.0).\n

    \n
    \"webgpu\"
    \n
    \n

    Creates a GPUCanvasContext object representing a three-dimensional rendering context for WebGPU render pipelines. This context is only available on browsers that implement WebGPU API.\n

    \n
    bitmaprenderer
    \n
    \n

    Creates an ImageBitmapRenderingContext which only provides functionality to replace the content of the canvas with a given ImageBitmap.\n

    \n
    \n
    \n

    Note:\nThe identifiers \"experimental-webgl\" or \"experimental-webgl2\" are also used in implementations of WebGL.\nThese implementations have not reached test suite conformance, or the graphic drivers situation on the platform is not yet stable.\nThe Khronos Group certifies WebGL implementations under certain conformance rules.\n

    ", "contextAttributes": "You can use several context attributes when creating your rendering context, for example:\n
    \n```js\nconst gl = canvas.getContext(\"webgl\", {\n  antialias: false,\n  depth: false,\n});\n```\n
    \n

    2d context attributes:\n

    \n
    alpha
    \n
    \n

    A boolean value that indicates if the canvas contains an alpha channel. If set to false, the browser now knows that the backdrop is always opaque, which can speed up drawing of transparent content and images.\n

    \n
    colorSpace Optional
    \n
    \n

    Specifies the color space of the rendering context. Possible values are:\n

    \n
    \n
    colorType Optional
    \n
    \n

    Specifies the color type of the rendering context. Possible values are:\n

      \n
    • \"unorm8\" sets the color channels to 8 bit unsigned values. This is the default value.
    • \n
    • \"float16\" sets the color channels to 16-bit floating-point values.
    • \n
    \n
    \n
    desynchronized
    \n
    \n

    A boolean value that hints the user agent to reduce the latency by desynchronizing the canvas paint cycle from the event loop.\n

    \n
    willReadFrequently
    \n
    \n

    A boolean value that indicates whether or not a lot of read-back operations are planned. This will force the use of a software (instead of hardware accelerated) 2D canvas and can save memory when calling getImageData() frequently.\n

    \n
    \n

    WebGL context attributes:\n

    \n
    alpha
    \n
    \n

    A boolean value that indicates if the canvas contains an alpha buffer.\n

    \n
    depth
    \n
    \n

    A boolean value that indicates that the drawing buffer is requested to have a depth buffer of at least 16 bits.\n

    \n
    stencil
    \n
    \n

    A boolean value that indicates that the drawing buffer is requested to have a stencil buffer of at least 8 bits.\n

    \n
    desynchronized
    \n
    \n

    A boolean value that hints the user agent to reduce the latency by desynchronizing the canvas paint cycle from the event loop.\n

    \n
    antialias
    \n
    \n

    A boolean value that indicates whether or not to perform anti-aliasing if possible.\n

    \n
    failIfMajorPerformanceCaveat
    \n
    \n

    A boolean value that indicates if a context will be created if the system performance is low or if no hardware GPU is available.\n

    \n
    powerPreference
    \n
    \n

    A hint to the user agent indicating what configuration of GPU is suitable for the WebGL context. Possible values are:\n

    \n
    \"default\"
    \n
    \n

    Let the user agent decide which GPU configuration is most suitable. This is the default value.\n

    \n
    \"high-performance\"
    \n
    \n

    Prioritizes rendering performance over power consumption.\n

    \n
    \"low-power\"
    \n
    \n

    Prioritizes power saving over rendering performance.\n

    \n
    \n
    \n
    premultipliedAlpha
    \n
    \n

    A boolean value that indicates that the page compositor will assume the drawing buffer contains colors with pre-multiplied alpha.\n

    \n
    preserveDrawingBuffer
    \n
    \n

    If the value is true the buffers will not be cleared and will preserve their values until cleared or overwritten by the author.\n

    \n
    xrCompatible
    \n
    \n

    A boolean value that hints to the user agent to use a compatible graphics adapter for an immersive XR device. Setting this synchronous flag at context creation is discouraged; rather call the asynchronous WebGLRenderingContext.makeXRCompatible() method the moment you intend to start an XR session.\n

    \n
    \n
    \n

    Note:\nThe WebGPU specification does not define any specific context attributes for getContext(). Instead, it provides configuration options via the GPUCanvasContext.configure() method.\n

    " }, "returns": "A rendering context which is either a\n\n

    If the context identifier is not supported, or the canvas has already been set to a different context mode, null is returned.", @@ -13229,7 +13516,7 @@ "x": "The x-axis coordinate of the center of the gradient.", "y": "The y-axis coordinate of the center of the gradient." }, - "returns": "

    \n
    CanvasGradient
    \n
    \n

    A conic CanvasGradient.\n

    \n
    " + "returns": "A conic CanvasGradient." }, "offscreencanvasrenderingcontext2d.createimagedata": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/createimagedata", @@ -13320,7 +13607,7 @@ "image": "An image to be used as the pattern's image.\nIt can be any of the following:\n", "repetition": "A string indicating how to repeat the pattern's image.\nPossible values are:\n\n

    A null value is treated the same as the empty string (\"\"): both are synonyms of \"repeat\"." }, - "returns": "

    \n
    CanvasPattern
    \n
    \n

    An opaque object describing a pattern.\n

    \n
    \n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." + "returns": "An opaque CanvasPattern describing a pattern.\n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." }, "offscreencanvasrenderingcontext2d.createradialgradient": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/createradialgradient", @@ -13573,7 +13860,7 @@ "baseline": { "level": "NONE" }, - "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." + "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." }, "offscreencanvasrenderingcontext2d.font": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/font", @@ -13594,7 +13881,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.font property of the Canvas 2D API specifies the current text style to use when drawing text.\nThis string uses the same syntax as the CSS font specifier." + "doc": "The CanvasRenderingContext2D.font property of the Canvas 2D API specifies the current text style to use when drawing text.\nThis string uses the same syntax as the CSS font specifier." }, "offscreencanvasrenderingcontext2d.fontkerning": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontkerning", @@ -13612,7 +13899,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontKerning property of the Canvas API specifies how font kerning information is used.\n

    Kerning adjusts how adjacent letters are spaced in a proportional font, allowing them to edge into each other's visual area if there is space available.\nFor example, in well-kerned fonts, the characters AV, Ta and We nest together and make character spacing more uniform and pleasant to read than the equivalent text without kerning.\n

    The property corresponds to the font-kerning CSS property." + "doc": "The CanvasRenderingContext2D.fontKerning property of the Canvas API specifies how font kerning information is used.\n

    Kerning adjusts how adjacent letters are spaced in a proportional font, allowing them to edge into each other's visual area if there is space available.\nFor example, in well-kerned fonts, the characters AV, Ta and We nest together and make character spacing more uniform and pleasant to read than the equivalent text without kerning.\n

    The property corresponds to the font-kerning CSS property." }, "offscreencanvasrenderingcontext2d.fontstretch": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontstretch", @@ -13630,7 +13917,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontStretch property of the Canvas API specifies how the font may be expanded or condensed when drawing text.\n

    The property corresponds to the font-stretch CSS property when used with keywords (percentage values are not supported)." + "doc": "The CanvasRenderingContext2D.fontStretch property of the Canvas API specifies how the font may be expanded or condensed when drawing text.\n

    The property corresponds to the font-stretch CSS property when used with keywords (percentage values are not supported)." }, "offscreencanvasrenderingcontext2d.fontvariantcaps": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/fontvariantcaps", @@ -13648,7 +13935,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.fontVariantCaps property of the Canvas API specifies an alternative capitalization of the rendered text.\n

    This corresponds to the CSS font-variant-caps property." + "doc": "The CanvasRenderingContext2D.fontVariantCaps property of the Canvas API specifies an alternative capitalization of the rendered text.\n

    This corresponds to the CSS font-variant-caps property." }, "offscreencanvasrenderingcontext2d.getcontextattributes": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/getcontextattributes", @@ -13882,7 +14169,7 @@ "fillRule": "The algorithm by which to determine if a point is inside or outside the path.\nPossible values:\n

    \n
    nonzero
    \n
    \n

    The non-zero winding rule.\nDefault rule.\n

    \n
    evenodd
    \n
    \n

    The even-odd winding rule.\n

    \n
    ", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the specified point is contained in the\ncurrent or specified path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the specified point is contained in the current or specified path, otherwise false." }, "offscreencanvasrenderingcontext2d.ispointinstroke": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/ispointinstroke", @@ -13910,7 +14197,7 @@ "y": "The y-axis coordinate of the point to check.", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the point is inside the area contained by\nthe stroking of a path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the point is inside the area contained by the stroking of a path, otherwise false." }, "offscreencanvasrenderingcontext2d.lang": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/lang", @@ -13948,7 +14235,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.letterSpacing property of the Canvas API specifies the spacing between letters when drawing text.\n

    This corresponds to the CSS letter-spacing property." + "doc": "The CanvasRenderingContext2D.letterSpacing property of the Canvas API specifies the spacing between letters when drawing text.\n

    This corresponds to the CSS letter-spacing property." }, "offscreencanvasrenderingcontext2d.linecap": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/linecap", @@ -14299,7 +14586,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", + "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", "returns": "None (undefined)." }, "offscreencanvasrenderingcontext2d.rotate": { @@ -14348,13 +14635,13 @@ "lowDate": "2023-04-11", "highDate": "2025-10-11" }, - "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", + "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", "parameters": { "x": "The x-axis coordinate of the rectangle's starting point, in pixels.", "y": "The y-axis coordinate of the rectangle's starting point, in pixels.", "width": "The rectangle's width. Positive values are to the right, and negative to the left.", "height": "The rectangle's height. Positive values are down, and negative are up.", - "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." + "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." }, "returns": "None (undefined).", "throws": { @@ -14722,7 +15009,7 @@ "baseline": { "level": "NONE" }, - "doc": "The CanvasRenderingContext2D.textRendering property of the Canvas API provides information to the rendering engine about what to optimize for when rendering text.\n

    The values correspond to the SVG text-rendering attribute (and CSS text-rendering property)." + "doc": "The CanvasRenderingContext2D.textRendering property of the Canvas API provides information to the rendering engine about what to optimize for when rendering text.\n

    The values correspond to the SVG text-rendering attribute (and CSS text-rendering property)." }, "offscreencanvasrenderingcontext2d.transform": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/transform", @@ -14801,7 +15088,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "The CanvasRenderingContext2D.wordSpacing property of the Canvas API specifies the spacing between words when drawing text.\n

    This corresponds to the CSS word-spacing property." + "doc": "The CanvasRenderingContext2D.wordSpacing property of the Canvas API specifies the spacing between words when drawing text.\n

    This corresponds to the CSS word-spacing property." }, "orientationsensor": { "url": "$MDN_URL$/web/api/orientationsensor", @@ -14817,7 +15104,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The OrientationSensor interface of the Sensor APIs is the base class for orientation sensors. This interface cannot be used directly. Instead it provides properties and methods accessed by interfaces that inherit from it.\n

    This feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The OrientationSensor interface of the Sensor APIs is the base class for orientation sensors. This interface cannot be used directly. Instead it provides properties and methods accessed by interfaces that inherit from it.\n

    This feature may be blocked by a Permissions Policy set on your server." }, "orientationsensor.populatematrix": { "url": "$MDN_URL$/web/api/orientationsensor/populatematrix", @@ -14833,7 +15120,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The populateMatrix() method of the\nOrientationSensor interface populates the given target matrix with the\nrotation matrix based on the latest sensor reading. The rotation matrix is shown\nbelow.\n

    where:\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The populateMatrix() method of the\nOrientationSensor interface populates the given target matrix with the\nrotation matrix based on the latest sensor reading. The rotation matrix is shown\nbelow.\n

    where:\n

    ", "parameters": { "targetMatrix": "TBD" }, @@ -14853,7 +15140,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The quaternion read-only\nproperty of the OrientationSensor interface returns a four element\nArray whose elements contain the components of the unit\nquaternion representing the device's orientation.\n

    Because OrientationSensor is a base class, quaternion may\nonly be read from one of its derived classes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The quaternion read-only\nproperty of the OrientationSensor interface returns a four element\nArray whose elements contain the components of the unit\nquaternion representing the device's orientation.\n

    Because OrientationSensor is a base class, quaternion may\nonly be read from one of its derived classes." }, "origin": { "url": "$MDN_URL$/web/api/window/origin", @@ -15031,7 +15318,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The OTPCredential interface of the WebOTP API is returned when a WebOTP navigator.credentials.get() call (i.e., invoked with an otp option) fulfills. It includes a code property that contains the retrieved one-time password (OTP)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The OTPCredential interface of the WebOTP API is returned when a WebOTP navigator.credentials.get() call (i.e., invoked with an otp option) fulfills. It includes a code property that contains the retrieved one-time password (OTP)." }, "otpcredential.code": { "url": "$MDN_URL$/web/api/otpcredential/code", @@ -15048,7 +15335,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The code read-only property of the OTPCredential interface contains the one-time password (OTP)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The code read-only property of the OTPCredential interface contains the one-time password (OTP)." }, "overconstrainederror": { "url": "$MDN_URL$/web/api/overconstrainederror", @@ -15164,7 +15451,7 @@ "baseline": { "level": "NONE" }, - "doc": "The viewTransition read-only property of the PageRevealEvent interface contains a ViewTransition object representing the active view transition for the cross-document navigation." + "doc": "The viewTransition read-only property of the PageRevealEvent interface contains a ViewTransition object representing the active view transition for the cross-document navigation.\n

    \n

    Note:\nThe active view transition can also be accessed via the Document.activeViewTransition property.\n

    " }, "pageswapevent": { "url": "$MDN_URL$/web/api/pageswapevent", @@ -15240,7 +15527,7 @@ "baseline": { "level": "NONE" }, - "doc": "The viewTransition read-only property of the PageRevealEvent interface contains a ViewTransition object representing the active view transition for the cross-document navigation." + "doc": "The viewTransition read-only property of the PageRevealEvent interface contains a ViewTransition object representing the active view transition for the cross-document navigation.\n
    \n

    Note:\nThe active view transition can also be accessed via the Document.activeViewTransition property.\n

    " }, "pagetransitionevent": { "url": "$MDN_URL$/web/api/pagetransitionevent", @@ -15465,7 +15752,7 @@ "image": "An image to be used as the pattern's image.\nIt can be any of the following:\n", "repetition": "A string indicating how to repeat the pattern's image.\nPossible values are:\n\n

    A null value is treated the same as the empty string (\"\"): both are synonyms of \"repeat\"." }, - "returns": "

    \n
    CanvasPattern
    \n
    \n

    An opaque object describing a pattern.\n

    \n
    \n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." + "returns": "An opaque CanvasPattern describing a pattern.\n

    If the image is not fully loaded (HTMLImageElement.complete is false), then null is returned." }, "paintrenderingcontext2d.createradialgradient": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/createradialgradient", @@ -15634,7 +15921,7 @@ "baseline": { "level": "NONE" }, - "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." + "doc": "The\nCanvasRenderingContext2D.filter\nproperty of the Canvas 2D API provides filter effects such as blurring and grayscaling.\nIt is similar to the CSS filter property and accepts the same values." }, "paintrenderingcontext2d.getlinedash": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/getlinedash", @@ -15793,7 +16080,7 @@ "fillRule": "The algorithm by which to determine if a point is inside or outside the path.\nPossible values:\n

    \n
    nonzero
    \n
    \n

    The non-zero winding rule.\nDefault rule.\n

    \n
    evenodd
    \n
    \n

    The even-odd winding rule.\n

    \n
    ", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the specified point is contained in the\ncurrent or specified path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the specified point is contained in the current or specified path, otherwise false." }, "paintrenderingcontext2d.ispointinstroke": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/ispointinstroke", @@ -15821,7 +16108,7 @@ "y": "The y-axis coordinate of the point to check.", "path": "A Path2D path to check against. If unspecified, the current path is\nused." }, - "returns": "
    \n
    A boolean value
    \n
    \n

    A Boolean, which is true if the point is inside the area contained by\nthe stroking of a path, otherwise false.\n

    \n
    " + "returns": "A boolean value, which is true if the point is inside the area contained by the stroking of a path, otherwise false." }, "paintrenderingcontext2d.linecap": { "url": "$MDN_URL$/web/api/canvasrenderingcontext2d/linecap", @@ -15976,7 +16263,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", + "doc": "The\nCanvasRenderingContext2D.restore()\nmethod of the Canvas 2D API restores the most recently saved canvas state by popping the\ntop entry in the drawing state stack. If there is no saved state, this method does\nnothing.\n

    For more information about the drawing state, see CanvasRenderingContext2D.save().", "returns": "None (undefined)." }, "paintrenderingcontext2d.rotate": { @@ -16878,7 +17165,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PasswordCredential interface of the Credential Management API provides information about a username/password pair. In supporting browsers an instance of this class may be passed in the credential member of the init object for global fetch().\n

    \n

    Note:\nThis interface is restricted to top-level contexts and cannot be used from an <iframe>.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PasswordCredential interface of the Credential Management API provides information about a username/password pair. In supporting browsers an instance of this class may be passed in the credential member of the init object for global fetch().\n

    \n

    Note:\nThis interface is restricted to top-level contexts and cannot be used from an <iframe>.\n

    " }, "passwordcredential.iconurl": { "url": "$MDN_URL$/web/api/passwordcredential/iconurl", @@ -16895,7 +17182,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The iconURL read-only property\nof the PasswordCredential interface returns a string\ncontaining a URL pointing to an image for an icon. This image is intended for display\nin a credential chooser. The URL must be accessible without authentication." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The iconURL read-only property\nof the PasswordCredential interface returns a string\ncontaining a URL pointing to an image for an icon. This image is intended for display\nin a credential chooser. The URL must be accessible without authentication." }, "passwordcredential.name": { "url": "$MDN_URL$/web/api/passwordcredential/name", @@ -16912,7 +17199,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The name read-only property of\nthe PasswordCredential interface returns a string\ncontaining a human-readable public name for display in a credential chooser." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The name read-only property of\nthe PasswordCredential interface returns a string\ncontaining a human-readable public name for display in a credential chooser." }, "passwordcredential.password": { "url": "$MDN_URL$/web/api/passwordcredential/password", @@ -16929,7 +17216,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The password read-only property\nof the PasswordCredential interface returns a string\ncontaining the password of the credential." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The password read-only property\nof the PasswordCredential interface returns a string\ncontaining the password of the credential." }, "passwordcredential.passwordcredential": { "url": "$MDN_URL$/web/api/passwordcredential/passwordcredential", @@ -16946,9 +17233,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PasswordCredential() constructor creates a new PasswordCredential object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PasswordCredential() constructor creates a new PasswordCredential object.", "parameters": { - "data": "An object with the following properties:\n

    \n
    iconURL Optional
    \n
    \n

    A string representing the URL of an icon or avatar to be associated with the credential.\n

    \n
    id
    \n
    \n

    A string representing a unique ID for the credential.\n

    \n
    name Optional
    \n
    \n

    A string representing the credential username.\n

    \n
    origin
    \n
    \n

    A string representing the credential's origin. PasswordCredential objects are origin-bound, which means that they will only be usable on the specified origin they were intended to be used on.\n

    \n
    password
    \n
    \n

    A string representing the credential password.\n

    \n
    ", + "data": "An object with the following properties:\n
    \n
    iconURL Optional
    \n
    \n

    A string representing the URL of an icon or avatar to be associated with the credential.\n

    \n
    id
    \n
    \n

    A string representing the username portion of the username/password combination.\n

    \n
    name Optional
    \n
    \n

    A string representing a human-understandable name associated with the credential, intended to help the user select this credential in a user interface.\n

    \n
    origin
    \n
    \n

    A string representing the credential's origin. PasswordCredential objects are origin-bound, which means that they will only be usable on the specified origin they were intended to be used on.\n

    \n
    password
    \n
    \n

    A string representing the credential password.\n

    \n
    ", "form": "A reference to an HTMLFormElement with appropriate input fields.\nThe form should, at the very least, contain an id and password.\nIt could also require a CSRF token." }, "throws": { @@ -17233,10 +17520,10 @@ "lowDate": "2016-08-02", "highDate": "2019-02-02" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The Path2D() constructor returns a newly instantiated\nPath2D object, optionally with another path as an argument (creates a\ncopy), or optionally with a string consisting of SVG path data.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The Path2D() constructor returns a newly instantiated Path2D object, optionally with another path as an argument (creates a copy), or optionally with a string consisting of SVG path data.", "parameters": { - "path": "When invoked with another Path2D object, a copy of the\npath argument is created.", - "d": "When invoked with a string consisting of SVG path data, a new path is created\nfrom that description." + "path": "When invoked with another Path2D object, a copy of the path argument is created.", + "d": "When invoked with a string consisting of SVG path data, a new path is created from that description." } }, "path2d.quadraticcurveto": { @@ -17317,13 +17604,13 @@ "lowDate": "2023-04-11", "highDate": "2025-10-11" }, - "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", + "doc": "The CanvasRenderingContext2D.roundRect() method of the Canvas 2D API adds a rounded rectangle to the current path.\n

    The radii of the corners can be specified in much the same way as the CSS border-radius property.\n

    Like other methods that modify the current path, this method does not directly render anything.\nTo draw the rounded rectangle onto a canvas, you can use the fill() or stroke() methods.", "parameters": { "x": "The x-axis coordinate of the rectangle's starting point, in pixels.", "y": "The y-axis coordinate of the rectangle's starting point, in pixels.", "width": "The rectangle's width. Positive values are to the right, and negative to the left.", "height": "The rectangle's height. Positive values are down, and negative are up.", - "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." + "radii": "A number or list specifying the radii of the circular arc to be used for the corners of the rectangle.\nThe number and order of the radii function in the same way as the border-radius CSS property when width and height are positive:\n

    \n

    If width is negative the rounded rectangle is flipped horizontally, so the radius values that normally apply to the left corners are used on the right and vice versa.\nSimilarly, when height is negative, the rounded rect is flipped vertically.\nThe specified radii may be scaled (reduced) if any of the edges are shorter than the combined radius of the vertices on either end.\n

    The radii parameter can also be a DOMPoint or DOMPointReadOnly instance, or an object containing the same properties ({x: 0, y: 0}), or a list of such objects, or a list mixing numbers and such objects." }, "returns": "None (undefined).", "throws": { @@ -17343,7 +17630,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The PaymentAddress interface of the Payment Request API is used to store shipping or payment address information.\n

    It may be useful to refer to the Universal Postal Union website's Addressing S42 standard materials, which provide information about international standards for postal addresses." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The PaymentAddress interface of the Payment Request API is used to store shipping or payment address information.\n

    It may be useful to refer to the Universal Postal Union website's Addressing S42 standard materials, which provide information about international standards for postal addresses." }, "paymentaddress.addressline": { "url": "$MDN_URL$/web/api/paymentaddress/addressline", @@ -17358,7 +17645,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The addressLine read-only\nproperty of the PaymentAddress interface is an array of\nstrings, each specifying a line of the address that is not\ncovered by one of the other properties of PaymentAddress.\n

    These\nlines may include the street name, house number, apartment number, rural delivery route,\ndescriptive instructions, or post office box." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The addressLine read-only\nproperty of the PaymentAddress interface is an array of\nstrings, each specifying a line of the address that is not\ncovered by one of the other properties of PaymentAddress.\n

    These\nlines may include the street name, house number, apartment number, rural delivery route,\ndescriptive instructions, or post office box." }, "paymentaddress.city": { "url": "$MDN_URL$/web/api/paymentaddress/city", @@ -17373,7 +17660,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The city read-only property of\nthe PaymentAddress interface returns a string containing the city or\ntown portion of the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The city read-only property of\nthe PaymentAddress interface returns a string containing the city or\ntown portion of the address." }, "paymentaddress.country": { "url": "$MDN_URL$/web/api/paymentaddress/country", @@ -17388,7 +17675,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The country read-only property of the\nPaymentAddress interface is a string identifying the address's country\nusing the ISO 3166-1 alpha-2 standard. The string is\nalways in its canonical upper-case form.\n

    Some examples of valid country values: \"US\",\n\"GB\", \"CN\", or \"JP\"." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The country read-only property of the\nPaymentAddress interface is a string identifying the address's country\nusing the ISO 3166-1 alpha-2 standard. The string is\nalways in its canonical upper-case form.\n

    Some examples of valid country values: \"US\",\n\"GB\", \"CN\", or \"JP\"." }, "paymentaddress.dependentlocality": { "url": "$MDN_URL$/web/api/paymentaddress/dependentlocality", @@ -17403,7 +17690,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only dependentLocality\nproperty of the PaymentAddress interface is a string containing a\nsublocality designation within a city, such as a neighborhood, borough, district, or,\nin the United Kingdom, a dependent locality. Also known as a post\ntown." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only dependentLocality\nproperty of the PaymentAddress interface is a string containing a\nsublocality designation within a city, such as a neighborhood, borough, district, or,\nin the United Kingdom, a dependent locality. Also known as a post\ntown." }, "paymentaddress.organization": { "url": "$MDN_URL$/web/api/paymentaddress/organization", @@ -17418,7 +17705,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The organization read-only\nproperty of the PaymentAddress interface returns a string containing\nthe name of the organization, firm, company, or institution at the address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The organization read-only\nproperty of the PaymentAddress interface returns a string containing\nthe name of the organization, firm, company, or institution at the address." }, "paymentaddress.phone": { "url": "$MDN_URL$/web/api/paymentaddress/phone", @@ -17433,7 +17720,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only phone property of the\nPaymentAddress interface returns a string containing the telephone number\nof the recipient or contact person." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only phone property of the\nPaymentAddress interface returns a string containing the telephone number\nof the recipient or contact person." }, "paymentaddress.postalcode": { "url": "$MDN_URL$/web/api/paymentaddress/postalcode", @@ -17448,7 +17735,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The postalCode read-only property of the\nPaymentAddress interface returns a string containing a code used by a\njurisdiction for mail routing, for example, the ZIP Code\nin the United States or the Postal Index Number (PIN code)\nin India." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The postalCode read-only property of the\nPaymentAddress interface returns a string containing a code used by a\njurisdiction for mail routing, for example, the ZIP Code\nin the United States or the Postal Index Number (PIN code)\nin India." }, "paymentaddress.recipient": { "url": "$MDN_URL$/web/api/paymentaddress/recipient", @@ -17463,7 +17750,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only recipient property of the\nPaymentAddress interface returns a string containing the name of the\nrecipient, purchaser, or contact person at the payment address." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only recipient property of the\nPaymentAddress interface returns a string containing the name of the\nrecipient, purchaser, or contact person at the payment address." }, "paymentaddress.region": { "url": "$MDN_URL$/web/api/paymentaddress/region", @@ -17478,7 +17765,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only region property of the\nPaymentAddress interface returns a string containing the top-level\nadministrative subdivision of the country in which the address is located. For example,\nthis may be a state, province, oblast, or prefecture." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The read-only region property of the\nPaymentAddress interface returns a string containing the top-level\nadministrative subdivision of the country in which the address is located. For example,\nthis may be a state, province, oblast, or prefecture." }, "paymentaddress.sortingcode": { "url": "$MDN_URL$/web/api/paymentaddress/sortingcode", @@ -17493,7 +17780,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The sortingCode read-only property of the\nPaymentAddress interface returns a string containing a postal sorting\ncode such as is used in France." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The sortingCode read-only property of the\nPaymentAddress interface returns a string containing a postal sorting\ncode such as is used in France." }, "paymentaddress.tojson": { "url": "$MDN_URL$/web/api/paymentaddress/tojson", @@ -17508,7 +17795,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The toJSON() method of the PaymentAddress interface is a standard serializer that returns a JSON representation of the PaymentAddress object's properties.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The toJSON() method of the PaymentAddress interface is a standard serializer that returns a JSON representation of the PaymentAddress object's properties.", "returns": "A JSON object." }, "paymentmanager": { @@ -17526,7 +17813,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentManager interface of the Payment Handler API is used to manage various aspects of payment app functionality.\n

    It is accessed via the ServiceWorkerRegistration.paymentManager property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentManager interface of the Payment Handler API is used to manage various aspects of payment app functionality.\n

    It is accessed via the ServiceWorkerRegistration.paymentManager property." }, "paymentmanager.enabledelegations": { "url": "$MDN_URL$/web/api/paymentmanager/enabledelegations", @@ -17543,7 +17830,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The enableDelegations() method of the PaymentManager interface delegates responsibility for providing various parts of the required payment information to the payment app rather than collecting it from the browser (for example, via autofill).\n

    For example, if the requestShipping option is set to true in the options object when invoking the PaymentRequest() constructor, a shipping address will be returned.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The enableDelegations() method of the PaymentManager interface delegates responsibility for providing various parts of the required payment information to the payment app rather than collecting it from the browser (for example, via autofill).\n

    For example, if the requestShipping option is set to true in the options object when invoking the PaymentRequest() constructor, a shipping address will be returned.\n

    ", "parameters": { "delegations": "An array containing one or more enumerated values that specify the payment information you want to delegate to the payment app. Possible values can be:\n
    \n
    payerEmail
    \n
    \n

    The payment app will provide the payer's email whenever it is needed.\n

    \n
    payerName
    \n
    \n

    The payment app will provide the payer's name whenever it is needed.\n

    \n
    payerPhone
    \n
    \n

    The payment app will provide the payer's phone number whenever it is needed.\n

    \n
    shippingAddress
    \n
    \n

    The payment app will provide the shipping address whenever it is needed.\n

    \n
    " }, @@ -17564,7 +17851,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The userHint property of the PaymentManager interface provides a hint for the browser to display along with the payment app's name and icon in the Payment Handler UI." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The userHint property of the PaymentManager interface provides a hint for the browser to display along with the payment app's name and icon in the Payment Handler UI." }, "paymentmethodchangeevent": { "url": "$MDN_URL$/web/api/paymentmethodchangeevent", @@ -17582,7 +17869,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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)." }, "paymentmethodchangeevent.methoddetails": { "url": "$MDN_URL$/web/api/paymentmethodchangeevent/methoddetails", @@ -17600,7 +17887,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only methodDetails property of the PaymentMethodChangeEvent interface is an object\ncontaining any data the payment handler may provide to describe the change the user\nhas made to their payment method. The value is null if no details\nare available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only methodDetails property of the PaymentMethodChangeEvent interface is an object\ncontaining any data the payment handler may provide to describe the change the user\nhas made to their payment method. The value is null if no details\nare available." }, "paymentmethodchangeevent.methodname": { "url": "$MDN_URL$/web/api/paymentmethodchangeevent/methodname", @@ -17618,7 +17905,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only methodName property of the PaymentMethodChangeEvent interface is a string which\nuniquely identifies the payment handler currently selected by the user. The\npayment handler may be a payment technology, such as Apple Pay or Android Pay, and each\npayment handler may support multiple payment methods; changes to the payment method\nwithin the payment handler are described by the PaymentMethodChangeEvent." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only methodName property of the PaymentMethodChangeEvent interface is a string which\nuniquely identifies the payment handler currently selected by the user. The\npayment handler may be a payment technology, such as Apple Pay or Android Pay, and each\npayment handler may support multiple payment methods; changes to the payment method\nwithin the payment handler are described by the PaymentMethodChangeEvent." }, "paymentmethodchangeevent.paymentmethodchangeevent": { "url": "$MDN_URL$/web/api/paymentmethodchangeevent/paymentmethodchangeevent", @@ -17636,7 +17923,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentMethodChangeEvent()\nconstructor creates a new PaymentMethodChangeEvent object providing\ndetails about a paymentmethodchange event.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentMethodChangeEvent()\nconstructor creates a new PaymentMethodChangeEvent object providing\ndetails about a paymentmethodchange event.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to paymentmethodchange.", "options": "An object that, in addition of the properties defined in Event(),\ncan have the following properties:\n

    \n
    methodName Optional
    \n
    \n

    A string containing the payment method identifier for the\npayment handler being used. This is an empty string by default.\n

    \n
    methodDetails Optional
    \n
    \n

    An object providing payment method-specific information describing the changes\nmade to the payment, or null if there is no additional information\navailable or required. This is null by default.\n

    \n
    " @@ -17659,7 +17946,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Payment Request API's PaymentRequest interface is the primary access point into the API, and lets web content and apps accept payments from the end user on behalf of the operator of the site or the publisher of the app." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Payment Request API's PaymentRequest interface is the primary access point into the API, and lets web content and apps accept payments from the end user on behalf of the operator of the site or the publisher of the app." }, "paymentrequest.abort": { "url": "$MDN_URL$/web/api/paymentrequest/abort", @@ -17677,7 +17964,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest.abort() method of the PaymentRequest\ninterface causes the user agent to end the payment request and to remove any user\ninterface that might be shown.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest.abort() method of the PaymentRequest\ninterface causes the user agent to end the payment request and to remove any user\ninterface that might be shown.", "returns": "None (undefined)." }, "paymentrequest.canmakepayment": { @@ -17696,7 +17983,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest method\ncanMakePayment() determines whether or not the request\nis configured in a way that is compatible with at least one payment method supported\nby the user agent.\n

    You can call this before calling\nshow() to provide a streamlined user experience\nwhen the user's browser can't handle any of the payment methods you accept.\n

    For instance, you might call canMakePayment() to determine if the browser\nwill let the user pay using Payment Request API, and if it won't, you could fall back to\nanother payment method, or offer a list of methods that aren't handled by Payment\nRequest API (or even provide instructions for paying by mail or by phone).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest method\ncanMakePayment() determines whether or not the request\nis configured in a way that is compatible with at least one payment method supported\nby the user agent.\n

    You can call this before calling\nshow() to provide a streamlined user experience\nwhen the user's browser can't handle any of the payment methods you accept.\n

    For instance, you might call canMakePayment() to determine if the browser\nwill let the user pay using Payment Request API, and if it won't, you could fall back to\nanother payment method, or offer a list of methods that aren't handled by Payment\nRequest API (or even provide instructions for paying by mail or by phone).", "returns": "A Promise to a boolean value that resolves to true\nif the user agent supports any of the payment methods supplied when instantiating the\nrequest using the PaymentRequest\nconstructor. If the payment can't be processed, the promise receives a value of\nfalse.\n

    \n

    Note:\nIf you call this too often, the browser may reject the\nreturned promise with a DOMException.\n

    " }, "paymentrequest.id": { @@ -17715,7 +18002,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only attribute of the\nPaymentRequest interface returns a unique identifier for a particular\nPaymentRequest instance.\n

    When constructing an instance of the PaymentRequest, you are able to\nsupply an custom id. If none is provided, the browser automatically sets the id value to a UUID." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only attribute of the\nPaymentRequest interface returns a unique identifier for a particular\nPaymentRequest instance.\n

    When constructing an instance of the PaymentRequest, you are able to\nsupply a custom id. If none is provided, the browser automatically sets the id value to a UUID." }, "paymentrequest.paymentrequest": { "url": "$MDN_URL$/web/api/paymentrequest/paymentrequest", @@ -17733,7 +18020,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest() constructor\ncreates a new PaymentRequest object which will be used to handle the\nprocess of generating, validating, and submitting a payment request.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest() constructor\ncreates a new PaymentRequest object which will be used to handle the\nprocess of generating, validating, and submitting a payment request.", "parameters": { "methodData": "Contains an array of identifiers for the payment methods the merchant website\naccepts and any associated payment method specific data. Each item in the array\ncontains the following fields:\n

    \n
    supportedMethods
    \n
    \n

    A string containing a payment method identifier. This is either a URL or one of the standardized payment method identifiers. The value and structure of the data field will vary depending on the value of the supportedMethods field.\n

    \n
    data
    \n
    \n

    A JSON-serializable object that provides optional information that might be\nneeded by the supported payment methods. This has to conform to the type expected\nby the payment handler indicated by supportedMethods. Developers need to consult\nwhomever controls the payment methods for the expected shape of the data object. If supportedMethods is secure-payment-confirmation, then data needs to conform to the SecurePaymentConfirmationRequest dictionary.\n

    \n
    ", "details": "Provides information about the requested transaction. This parameter contains the\nfollowing fields:\n
    \n
    total
    \n
    \n

    The total amount of the payment request.\n

    \n
    id Optional
    \n
    \n

    A free-form identifier for this payment request. If a value is not supplied, the\nbrowser will construct one.\n

    \n
    displayItems
    \n
    \n

    An array of optional line items for the payment request that the user agent may\ndisplay, such as product details, tax, and shipping.\n

    \n
    shippingOptions
    \n
    \n

    The shipping options the user may choose from. If this sequence is blank, it\nindicates the merchant cannot ship to the current shipping address. The default\nshipping option may be indicated in this sequence.\n

    \n
    modifiers
    \n
    \n

    Modifiers for specific payment methods; for example, adjusting the total amount\nbased on the payment method. This parameter contains the following fields:\n

    \n
    additionalDisplayItems
    \n
    \n

    An array of items to be appended to the details.displayItems\nproperty. This property is commonly used to add a discount or surcharge line\nitem indicating the different amount in details.modifiers.total.\n

    \n
    data
    \n
    \n

    A JSON-serializable object that provides optional information that might be\nneeded by the supported payment methods.\n

    \n
    total
    \n
    \n

    A total amount for the payment request that overrides value in\ndetails.total. This is typically used when\ndetails.modifiers.additionalItems adds a discount or a purchase\nto the request.\n

    \n
    \n
    \n
    ", @@ -17759,7 +18046,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The securePaymentConfirmationAvailability() static method of the PaymentRequest interface indicates whether the Secure payment confirmation (SPC) feature is available.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The securePaymentConfirmationAvailability() static method of the PaymentRequest interface indicates whether the Secure payment confirmation (SPC) feature is available.", "returns": "A Promise that resolves with an enumerated value indicating whether SPC is available, and if not, a reason for non-availability.\n

    Possible values are:\n

    \n
    available
    \n
    \n

    SPC is available in the calling frame. This doesn't guarantee that an SPC-compatible credential is available to authenticate against.\n

    \n
    unavailable-unknown-reason
    \n
    \n

    SPC is not available in the calling frame, for an unknown reason. The browser may return this result instead of a more specific reason, in order to protect user privacy.\n

    \n
    unavailable-feature-not-enabled
    \n
    \n

    SPC is not available in the calling frame because it is not enabled.\n

    \n
    unavailable-no-permission-policy
    \n
    \n

    SPC is not available in the calling frame, because it is blocked by a payment Permissions Policy.\n

    \n
    unavailable-no-user-verifying-platform-authenticator
    \n
    \n

    SPC is not available in the calling frame, because there is no user-verifying platform authenticator available (PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable() can also be used to discern this information).\n

    \n
    " }, "paymentrequest.shippingaddress": { @@ -17775,7 +18062,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingAddress read-only property of\nthe PaymentRequest interface returns the shipping address provided by the\nuser. It is null by default." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingAddress read-only property of\nthe PaymentRequest interface returns the shipping address provided by the\nuser. It is null by default." }, "paymentrequest.shippingoption": { "url": "$MDN_URL$/web/api/paymentrequest/shippingoption", @@ -17790,7 +18077,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingOption read-only attribute of the PaymentRequest interface returns either the id of a selected shipping option, null (if no shipping option was set to be selected) or a shipping option selected by the user.\nIt is initially null by when no \"selected\" shipping options are provided.\n

    This attribute is only populated if the constructor is called with the requestShipping flag set to true.\nIf requestShipping was false (or missing), shippingOption returns null, even the developer provides a selected a shipping option." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingOption read-only attribute of the PaymentRequest interface returns either the id of a selected shipping option, null (if no shipping option was set to be selected) or a shipping option selected by the user.\nIt is initially null by when no \"selected\" shipping options are provided.\n

    This attribute is only populated if the constructor is called with the requestShipping flag set to true.\nIf requestShipping was false (or missing), shippingOption returns null, even the developer provides a selected a shipping option." }, "paymentrequest.shippingtype": { "url": "$MDN_URL$/web/api/paymentrequest/shippingtype", @@ -17805,7 +18092,7 @@ "Safari": "11.1", "SafariIOS": "11.3" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingType read-only property of the\nPaymentRequest interface returns one of \"shipping\",\n\"delivery\", \"pickup\", or null if one was not\nprovided by the constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The shippingType read-only property of the\nPaymentRequest interface returns one of \"shipping\",\n\"delivery\", \"pickup\", or null if one was not\nprovided by the constructor." }, "paymentrequest.show": { "url": "$MDN_URL$/web/api/paymentrequest/show", @@ -17823,7 +18110,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest interface's\nshow() method instructs the user agent to begin the\nprocess of showing and handling the user interface for the payment request to the\nuser.\n

    Only one payment request can be in the process of being handled at once, across all\ndocuments. Once one PaymentRequest's show() method has been\ncalled, any other call to show() will by rejected with an\nAbortError until the returned promise has been concluded, either by being\nfulfilled with a PaymentResponse indicating the results of the payment\nrequest, or by being rejected with an error.\n

    \n

    Note:\nIn reality, despite the fact that the specification says this\ncan't be done, some browsers, including Firefox, support multiple active payment\nrequests at a time.\n

    \n

    If your architecture doesn't necessarily have all of the data ready to go at the moment\nit instantiates the payment interface by calling show(), specify the\ndetailsPromise parameter, providing a Promise that is\nfulfilled once the data is ready. If this is provided, show() will not\nallow the user to interact with the payment interface until the promise is fulfilled, so\nthat data can be updated prior to the user engaging with the payment process.\n

    Processing the result and, if necessary, calling PaymentResponse.retry()\nto retry a failed payment can all be done either asynchronously or synchronously,\ndepending on your needs. For the best user experience, asynchronous solutions are\ntypically the best way to go. Most examples on MDN and elsewhere use\nasync/await\nto wait asynchronously while results are validated and so forth.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest interface's\nshow() method instructs the user agent to begin the\nprocess of showing and handling the user interface for the payment request to the\nuser.\n

    Only one payment request can be in the process of being handled at once, across all\ndocuments. Once one PaymentRequest's show() method has been\ncalled, any other call to show() will by rejected with an\nAbortError until the returned promise has been concluded, either by being\nfulfilled with a PaymentResponse indicating the results of the payment\nrequest, or by being rejected with an error.\n

    \n

    Note:\nIn reality, despite the fact that the specification says this\ncan't be done, some browsers, including Firefox, support multiple active payment\nrequests at a time.\n

    \n

    If your architecture doesn't necessarily have all of the data ready to go at the moment\nit instantiates the payment interface by calling show(), specify the\ndetailsPromise parameter, providing a Promise that is\nfulfilled once the data is ready. If this is provided, show() will not\nallow the user to interact with the payment interface until the promise is fulfilled, so\nthat data can be updated prior to the user engaging with the payment process.\n

    Processing the result and, if necessary, calling PaymentResponse.retry()\nto retry a failed payment can all be done either asynchronously or synchronously,\ndepending on your needs. For the best user experience, asynchronous solutions are\ntypically the best way to go. Most examples on MDN and elsewhere use\nasync/await\nto wait asynchronously while results are validated and so forth.", "parameters": { "details": "Either an object or a Promise that resolves to an object. Provide this if your architecture requires\nthat the payment request's details need to be updated between instantiating the\npayment interface and the user beginning to interact with it. The object should contain the updated information:\n

    \n
    displayItems Optional
    \n
    \n

    An array of objects, each describing one line item for the payment request. These represent the line items on a receipt or invoice, each with the following properties:\n

    \n
    amount
    \n
    \n

    An object describing the monetary value of the item. This object includes the following fields:\n

    \n
    currency
    \n
    \n

    A string containing a valid 3-letter ISO 4217 currency identifier (ISO 4217) indicating the currency used for the payment value.\n

    \n
    value
    \n
    \n

    A string containing a valid decimal value representing the mount of currency constituting the payment amount. This string must only contain an optional leading \"-\" to indicate a negative value, then one or more digits from 0 to 9, and an optional decimal point (\".\", regardless of locale) followed by at least one more digit. No whitespace is permitted.\n

    \n
    \n
    \n
    label
    \n
    \n

    A string specifying a human-readable name or description of the item or service being charged for. This may be displayed to the user by the user agent, depending on the design of the interface.\n

    \n
    pending
    \n
    \n

    A Boolean value which is true if the specified amount has not yet been finalized. This can be used to show items such as shipping or tax amounts that depend upon the selection of shipping address, shipping option, or so forth. The user agent may show this information but is not required to do so.\n

    \n
    \n
    \n
    error Optional
    \n
    \n

    A string specifying an error message to present to the user. When calling updateWith(), including error in the updated data causes the user agent to display the text as a general error message. For address-field specific errors, use the shippingAddressErrors field.\n

    \n
    modifiers Optional
    \n
    \n

    An array of objects, each describing a modifier for particular payment method identifiers, each with the following properties:\n

    \n
    supportedMethods
    \n
    \n

    A string that represents the payment method identifier. The payment method identifier only applies if the user selects this payment method.\n

    \n
    total Optional
    \n
    \n

    An object that overrides the total property of the detailsPromise parameter if this payment method is selected by the user. The property takes the same input with the total property of the detailsPromise parameter.\n

    \n
    additionalDisplayItems Optional
    \n
    \n

    An Array of objects provide additional display items that are appended to the displayItems property of the detailsPromise parameter if this payment method is selected by the user. This property is commonly used to add a discount or surcharge line item indicating the reason for the different total amount for the selected payment method that the user agent may display. The property takes the same input with the displayItems property of the detailsPromise parameter.\n

    \n
    data Optional
    \n
    \n

    A serializable object that provides optional information that might be needed by the supported payment methods.\n

    \n
    \n

    For example, you can use one to adjust the total payment amount based on the selected payment method (\"5% cash discount!\").\n

    \n
    shippingAddressErrors Optional
    \n
    \n

    An object which includes an error message for each property of the shipping address that could not be validated.\n

    \n
    shippingOptions Optional
    \n
    \n

    An array of objects, each describing one available shipping option from which the user may choose.\n

    \n
    total Optional
    \n
    \n

    An object with the same properties as the objects in displayItems providing an updated total for the payment. Make sure this equals the sum of all of the items in displayItems. This is not calculated automatically. You must update this value yourself anytime the total amount due changes. This lets you have flexibility for how to handle things like tax, discounts, and other adjustments to the total price charged.\n

    \n
    " }, @@ -18056,7 +18343,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequestUpdateEvent interface is used for events sent to a PaymentRequest instance when changes are made to shipping-related information for a pending PaymentRequest. Those events are:\n

    \n
    shippingaddresschange
    \n
    \n

    Dispatched whenever the user changes their shipping address.\n

    \n
    shippingoptionchange
    \n
    \n

    Dispatched whenever the user changes a shipping option.\n

    \n
    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequestUpdateEvent interface is used for events sent to a PaymentRequest instance when changes are made to shipping-related information for a pending PaymentRequest. Those events are:\n

    \n
    shippingaddresschange
    \n
    \n

    Dispatched whenever the user changes their shipping address.\n

    \n
    shippingoptionchange
    \n
    \n

    Dispatched whenever the user changes a shipping option.\n

    \n
    " }, "paymentrequestupdateevent.paymentrequestupdateevent": { "url": "$MDN_URL$/web/api/paymentrequestupdateevent/paymentrequestupdateevent", @@ -18074,7 +18361,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequestUpdateEvent() constructor creates a new\nPaymentRequestUpdateEvent object which enables a web page to update the\ndetails of a PaymentRequest in response to a user action. Actual updates\nare made by passing options to the\nupdateWith() method.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequestUpdateEvent() constructor creates a new\nPaymentRequestUpdateEvent object which enables a web page to update the\ndetails of a PaymentRequest in response to a user action. Actual updates\nare made by passing options to the\nupdateWith() method.", "returns": "A new PaymentRequestUpdateEvent." }, "paymentrequestupdateevent.updatewith": { @@ -18093,7 +18380,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The updateWith() method of the\nPaymentRequestUpdateEvent interface updates the details of an existing\nPaymentRequest.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The updateWith() method of the\nPaymentRequestUpdateEvent interface updates the details of an existing\nPaymentRequest.", "parameters": { "details": "Either an object or a Promise that resolves to an object, specifying the changes applied to the payment request:\n

    \n
    displayItems Optional
    \n
    \n

    An array of objects, each describing one line item for the payment request. These represent the line items on a receipt or invoice, each with the following properties:\n

    \n
    amount
    \n
    \n

    An object describing the monetary value of the item. This object includes the following fields:\n

    \n
    currency
    \n
    \n

    A string containing a valid 3-letter ISO 4217 currency identifier (ISO 4217) indicating the currency used for the payment value.\n

    \n
    value
    \n
    \n

    A string containing a valid decimal value representing the mount of currency constituting the payment amount. This string must only contain an optional leading \"-\" to indicate a negative value, then one or more digits from 0 to 9, and an optional decimal point (\".\", regardless of locale) followed by at least one more digit. No whitespace is permitted.\n

    \n
    \n
    \n
    label
    \n
    \n

    A string specifying a human-readable name or description of the item or service being charged for. This may be displayed to the user by the user agent, depending on the design of the interface.\n

    \n
    pending
    \n
    \n

    A Boolean value which is true if the specified amount has not yet been finalized. This can be used to show items such as shipping or tax amounts that depend upon the selection of shipping address, shipping option, or so forth. The user agent may show this information but is not required to do so.\n

    \n
    \n
    \n
    error Optional
    \n
    \n

    A string specifying an error message to present to the user. When calling updateWith(), including error in the updated data causes the user agent to display the text as a general error message. For address field-specific errors, use the shippingAddressErrors field.\n

    \n
    modifiers Optional
    \n
    \n

    An Array of PaymentDetailsModifier objects, whose properties are described in PaymentRequestEvent.modifiers.\n

    For example, you can use one to adjust the total payment amount based on the selected payment method (\"5% cash discount!\").\n

    \n
    shippingAddressErrors Optional
    \n
    \n

    An object which includes an error message for each property of the shipping address that could not be validated.\n

    \n
    shippingOptions Optional
    \n
    \n

    An array of objects, each describing one available shipping option from which the user may choose.\n

    \n
    total Optional
    \n
    \n

    An object with the same properties as the objects in displayItems providing an updated total for the payment. Make sure this equals the sum of all of the items in displayItems. This is not calculated automatically. You must update this value yourself anytime the total amount due changes. This lets you have flexibility for how to handle things like tax, discounts, and other adjustments to the total price charged.\n

    \n
    " }, @@ -18115,7 +18402,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentResponse interface of the Payment Request API is returned after a user selects a payment method and approves a payment request." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentResponse interface of the Payment Request API is returned after a user selects a payment method and approves a payment request." }, "paymentresponse.complete": { "url": "$MDN_URL$/web/api/paymentresponse/complete", @@ -18133,7 +18420,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest method\ncomplete() of the Payment Request API notifies the\nuser agent that the user interaction is over, and causes any remaining\nuser interface to be closed.\n

    This method must be called after the user accepts\nthe payment request and the Promise returned by the\nPaymentRequest.show() method is resolved.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentRequest method\ncomplete() of the Payment Request API notifies the\nuser agent that the user interaction is over, and causes any remaining\nuser interface to be closed.\n

    This method must be called after the user accepts\nthe payment request and the Promise returned by the\nPaymentRequest.show() method is resolved.", "parameters": { "result": "A string indicating the state of the payment operation upon\ncompletion. It must be one of the following:\n

    \n
    success
    \n
    \n

    The payment was successfully processed. The user agent may or may not present\nsome form of \"payment successful\" indication to the user.\n

    \n
    fail
    \n
    \n

    The payment was not successfully processed. The failure may or may not be\nannounced to the user by the user agent, depending on its design.\n

    \n
    unknown
    \n
    \n

    The success or failure status of the transaction is unknown or irrelevant, and\nthe user agent should not present any notification, even if it normally would.\nThis is the default value.\n

    \n
    \n
    \n

    Note:\nIn older versions of the specification, an empty string,\n\"\", was used instead of unknown to indicate a completion\nwithout a known result state. See the Browser compatibility section\nbelow for details.\n

    " }, @@ -18159,7 +18446,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The details read-only property of the\nPaymentResponse interface returns a JSON-serializable object that\nprovides a payment method specific message used by the merchant to process the\ntransaction and determine a successful funds transfer." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The details read-only property of the\nPaymentResponse interface returns a JSON-serializable object that\nprovides a payment method specific message used by the merchant to process the\ntransaction and determine a successful funds transfer." }, "paymentresponse.methodname": { "url": "$MDN_URL$/web/api/paymentresponse/methodname", @@ -18177,7 +18464,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The methodName read-only\nproperty of the PaymentResponse interface returns a string uniquely\nidentifying the payment handler selected by the user.\n

    This string may be either\none of the standardized payment method identifiers or a URL used by the payment handler\nto process payments." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The methodName read-only\nproperty of the PaymentResponse interface returns a string uniquely\nidentifying the payment handler selected by the user.\n

    This string may be either\none of the standardized payment method identifiers or a URL used by the payment handler\nto process payments." }, "paymentresponse.payeremail": { "url": "$MDN_URL$/web/api/paymentresponse/payeremail", @@ -18195,7 +18482,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerEmail read-only property of the PaymentResponse\ninterface returns the email address supplied by the user. This option is only present\nwhen the requestPayerEmail option is set to true in the\noptions object passed to the\nPaymentRequest constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerEmail read-only property of the PaymentResponse\ninterface returns the email address supplied by the user. This option is only present\nwhen the requestPayerEmail option is set to true in the\noptions object passed to the\nPaymentRequest constructor." }, "paymentresponse.payername": { "url": "$MDN_URL$/web/api/paymentresponse/payername", @@ -18213,7 +18500,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerName read-only property of the\nPaymentResponse interface returns the name supplied by the user. This\noption is only present when the requestPayerName option is set to\ntrue in the options parameter of the\nPaymentRequest() constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerName read-only property of the\nPaymentResponse interface returns the name supplied by the user. This\noption is only present when the requestPayerName option is set to\ntrue in the options parameter of the\nPaymentRequest() constructor." }, "paymentresponse.payerphone": { "url": "$MDN_URL$/web/api/paymentresponse/payerphone", @@ -18231,7 +18518,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerPhone read-only property of the PaymentResponse\ninterface returns the phone number supplied by the user. This option is only present\nwhen the requestPayerPhone option is set to true in the\noptions object passed to the\nPaymentRequest constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The payerPhone read-only property of the PaymentResponse\ninterface returns the phone number supplied by the user. This option is only present\nwhen the requestPayerPhone option is set to true in the\noptions object passed to the\nPaymentRequest constructor." }, "paymentresponse.requestid": { "url": "$MDN_URL$/web/api/paymentresponse/requestid", @@ -18249,7 +18536,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestId read-only property of the\nPaymentResponse interface returns the free-form identifier supplied by\nthe PaymentResponse() constructor by details.id." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestId read-only property of the\nPaymentResponse interface returns the free-form identifier supplied by\nthe PaymentResponse() constructor by details.id." }, "paymentresponse.retry": { "url": "$MDN_URL$/web/api/paymentresponse/retry", @@ -18267,7 +18554,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentResponse interface's\nretry() method makes it possible to ask the user to\nretry a payment after an error occurs during processing.\n

    This lets your app\ngracefully deal with situations such as invalid shipping addresses or declined credit\ncards.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PaymentResponse interface's\nretry() method makes it possible to ask the user to\nretry a payment after an error occurs during processing.\n

    This lets your app\ngracefully deal with situations such as invalid shipping addresses or declined credit\ncards.", "parameters": { "errorFields": "An object, with the following properties:\n

    \n
    error Optional
    \n
    \n

    A general description of a payment error from which the user may attempt to recover by retrying the payment, possibly after correcting mistakes in the payment information. error can be provided all by itself to provide only a generic error message, or in concert with the other properties to serve as an overview while other properties' values guide the user to errors in specific fields in the payment form.\n

    \n
    paymentMethod Optional
    \n
    \n

    Any payment-method-specific errors which may have occurred. This object's contents will vary depending on the payment method used.\n

    \n
    " }, @@ -18289,7 +18576,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The shippingAddress read-only property of\nthe PaymentRequest interface returns a PaymentAddress object\ncontaining the shipping address provided by the user." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The shippingAddress read-only property of\nthe PaymentRequest interface returns a PaymentAddress object\ncontaining the shipping address provided by the user." }, "paymentresponse.shippingoption": { "url": "$MDN_URL$/web/api/paymentresponse/shippingoption", @@ -18307,7 +18594,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The shippingOption read-only property of\nthe PaymentRequest interface returns the ID attribute of the shipping\noption selected by the user. This option is only present when the\nrequestShipping option is set to true in the\noptions object passed to the\nPaymentRequest constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The shippingOption read-only property of\nthe PaymentRequest interface returns the ID attribute of the shipping\noption selected by the user. This option is only present when the\nrequestShipping option is set to true in the\noptions object passed to the\nPaymentRequest constructor." }, "paymentresponse.tojson": { "url": "$MDN_URL$/web/api/paymentresponse/tojson", @@ -18325,7 +18612,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the PaymentResponse interface is a serializer; it returns a JSON representation of the PaymentResponse object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the PaymentResponse interface is a serializer; it returns a JSON representation of the PaymentResponse object.", "returns": "A JSON object that is the serialization of the PaymentResponse object." }, "pbkdf2params": { @@ -18447,12 +18734,15 @@ "Edge": "85", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "71" + "Opera": "71", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, - "doc": "The read-only performance.eventCounts property is an EventCounts map containing the number of events which have been dispatched per event type.\n

    Not all event types are exposed. You can only get counts for event types supported by the PerformanceEventTiming interface." + "doc": "The read-only performance.eventCounts property is an EventCounts map containing the number of events which have been dispatched per event type since the page was loaded.\n

    Not all event types are exposed. You can only get counts for event types supported by the PerformanceEventTiming interface." }, "performance.getentries": { "url": "$MDN_URL$/web/api/performance/getentries", @@ -18536,6 +18826,22 @@ }, "returns": "An Array of PerformanceEntry objects that have the specified type. The items will be in chronological order based on the entries' startTime. If no objects have the specified type, or no argument is provided, an empty array is returned." }, + "performance.interactioncount": { + "url": "$MDN_URL$/web/api/performance/interactioncount", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", + "Firefox": "144", + "FirefoxAndroid": "144", + "Safari": "26.2", + "SafariIOS": "26.2" + }, + "doc": "The read-only performance.interactionCount property represents the number of real-user interactions that have occurred on the page since it was loaded.\n

    Only discrete interactions with an interactionId — such as clicks and key events — are counted. Other interactions, such as scroll interactions, are excluded.\n

    This is useful when calculating Interaction to Next Paint (INP), and in particular to exclude outliers for long-lived pages. INP takes the 98th percentile of interactions for a page and so excludes 1 in every 50 interactions as \"outliers\" that are not reflective of overall page responsiveness." + }, "performance.mark": { "url": "$MDN_URL$/web/api/performance/mark", "status": [ @@ -18561,7 +18867,7 @@ "doc": "

    Note: This feature is available in Web Workers.

    \n

    The mark() method creates a named PerformanceMark object representing a high resolution timestamp marker in the browser's performance timeline.", "parameters": { "name": "A string representing the name of the mark. Must not be the same name as one of the properties of the deprecated PerformanceTiming interface.", - "markOptions": "An object for specifying a timestamp and additional metadata for the mark.\n

    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to include in the mark. Defaults to null. Must be structured-cloneable.\n

    \n
    startTime Optional
    \n
    \n

    DOMHighResTimeStamp to use as the mark time. Defaults to performance.now().\n

    \n
    " + "markOptions": "An object for specifying a timestamp and additional metadata for the mark.\n
    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to include in the mark. Defaults to null. Must be structured-cloneable.\n

    \n
    devtools Optional
    \n
    \n

    Some browsers have use a structured devtools object within the detail object as part of an Extensibility API that surfaces these in custom tracks in performance traces. See the Chrome's Extensibility API documentation for more information.\n

    \n
    dataType
    \n
    \n

    A string which must be set to marker. Identifies as a marker.\n

    \n
    color Optional
    \n
    \n

    Defaults to \"primary\". Must be one of \"primary\", \"primary-light\", \"primary-dark\", \"secondary\", \"secondary-light\", \"secondary-dark\", \"tertiary\", \"tertiary-light\", \"tertiary-dark\", \"error\".\n

    \n
    properties Optional
    \n
    \n

    Array of key-value pairs. Values can be any JSON-compatible type.\n

    \n
    tooltipText Optional
    \n
    \n

    Short description for tooltip.\n

    \n
    \n
    \n
    \n
    \n
    startTime Optional
    \n
    \n

    DOMHighResTimeStamp to use as the mark time. Defaults to performance.now().\n

    \n
    " }, "returns": "The PerformanceMark entry that was created." }, @@ -18590,7 +18896,7 @@ "doc": "

    Note: This feature is available in Web Workers.

    \n

    The measure() method creates a named PerformanceMeasure object representing a time measurement between two marks in the browser's performance timeline.\n

    When measuring between two marks, there is a start mark and end mark, respectively.\nThe named timestamp is referred to as a measure.", "parameters": { "measureName": "A string representing the name of the measure.", - "measureOptions": "An object that may contain measure options.\n

    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to be included in the measure. Defaults to null. Must be structured-cloneable.\n

    \n
    start Optional
    \n
    \n

    Timestamp (DOMHighResTimeStamp) to be used as the start time, or string that names a PerformanceMark to use for the start time.\n

    If this is a string naming a PerformanceMark, then it is defined in the same way as startMark.\n

    \n
    duration Optional
    \n
    \n

    Duration (in milliseconds) between the start and end mark times. If omitted, this defaults to performance.now(); the time that has elapsed since the context was created. If provided, you must also specify either start or end but not both.\n

    \n
    end Optional
    \n
    \n

    Timestamp (DOMHighResTimeStamp) to be used as the end time, or string that names a PerformanceMark to use for the end time.\n

    If this is a string naming a PerformanceMark, then it is defined in the same way as endMark.\n

    \n
    ", + "measureOptions": "An object that may contain measure options.\n
    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to be included in the measure. Defaults to null. Must be structured-cloneable.\n

    \n
    devtools
    \n
    \n

    Some browsers have use a structured devtools object within the detail object as part of an Extensibility API that surfaces these in custom tracks in performance traces. See the Chrome's Extensibility API documentation for more information.\n

    \n
    dataType
    \n
    \n

    String with a value of track-entry (for defining a new track) or marker (for defining an entry in a track).\n

    \n
    color Optional
    \n
    \n

    Defaults to \"primary\". Must be one of \"primary\", \"primary-light\", \"primary-dark\", \"secondary\", \"secondary-light\", \"secondary-dark\", \"tertiary\", \"tertiary-light\", \"tertiary-dark\", \"error\".\n

    \n
    track Optional
    \n
    \n

    String of the name of the custom track (required for track-entry)\n

    \n
    trackGroup Optional
    \n
    \n

    String of the name of the grouping withing a custom track (required for track-entry)\n

    \n
    properties Optional
    \n
    \n

    Array of key-value pairs. Values can be any JSON-compatible type.\n

    \n
    tooltipText Optional
    \n
    \n

    Short description for tooltip.\n

    \n
    \n
    \n
    \n
    \n
    start Optional
    \n
    \n

    Timestamp (DOMHighResTimeStamp) to be used as the start time, or string that names a PerformanceMark to use for the start time.\n

    If this is a string naming a PerformanceMark, then it is defined in the same way as startMark.\n

    \n
    duration Optional
    \n
    \n

    Duration (in milliseconds) between the start and end mark times. If omitted, this defaults to performance.now(); the time that has elapsed since the context was created. If provided, you must also specify either start or end but not both.\n

    \n
    end Optional
    \n
    \n

    Timestamp (DOMHighResTimeStamp) to be used as the end time, or string that names a PerformanceMark to use for the end time.\n

    If this is a string naming a PerformanceMark, then it is defined in the same way as endMark.\n

    \n
    ", "startMark": "A string naming a PerformanceMark in the performance timeline. The PerformanceEntry.startTime property of this mark will be used for calculating the measure.", "endMark": "A string naming a PerformanceMark in the performance timeline. The PerformanceEntry.startTime property of this mark will be used for calculating the measure.\nIf you want to pass this argument, you must also pass either startMark or an empty measureOptions object." }, @@ -19117,10 +19423,13 @@ "Edge": "79", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "63" + "Opera": "63", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The PerformanceEventTiming interface of the Event Timing API provides insights into the latency of certain event types triggered by user interaction." }, @@ -19135,10 +19444,13 @@ "Edge": "79", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "63" + "Opera": "63", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The read-only cancelable property returns the associated event's cancelable property, indicating whether the event can be canceled." }, @@ -19153,10 +19465,13 @@ "Edge": "96", "Firefox": "144", "FirefoxAndroid": "144", - "Opera": "82" + "Opera": "82", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The read-only interactionId property of the PerformanceEventTiming interface returns an ID that uniquely identifies a user interaction which triggered a series of associated events." }, @@ -19171,10 +19486,13 @@ "Edge": "79", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "63" + "Opera": "63", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The read-only processingEnd property returns the time the last event handler finished executing.\n

    It's equal to PerformanceEventTiming.processingStart when there are no such event handlers." }, @@ -19189,10 +19507,13 @@ "Edge": "79", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "63" + "Opera": "63", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The read-only processingStart property returns the time at which event dispatch started. This is when event handlers are about to be executed." }, @@ -19207,10 +19528,13 @@ "Edge": "85", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "71" + "Opera": "71", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The read-only target property returns the associated event's last target which is the node onto which the event was last dispatched." }, @@ -19225,10 +19549,13 @@ "Edge": "79", "Firefox": "89", "FirefoxAndroid": "89", - "Opera": "63" + "Opera": "63", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2025-12-12" }, "doc": "The toJSON() method of the PerformanceEventTiming interface is a serializer; it returns a JSON representation of the PerformanceEventTiming object.", "returns": "A JSON object that is the serialization of the PerformanceEventTiming object.\n

    The JSON doesn't contain the target property because it is of type Node, which doesn't provide a toJSON() operation." @@ -19478,7 +19805,7 @@ "doc": "

    Note: This feature is available in Web Workers.

    \n

    The PerformanceMark() constructor creates a timestamp with the given name.\n

    Unlike performance.mark(), performance marks created by the constructor aren't added to the browser's performance timeline. This means that calls to the Performance interface's getEntries*() methods (getEntries(), getEntriesByName() or getEntriesByType()) won't show entries for these marks.", "parameters": { "name": "A string representing the name of the mark.", - "markOptions": "An object for specifying a timestamp and additional metadata for the mark.\n

    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to include in the mark. Defaults to null.\n

    \n
    startTime Optional
    \n
    \n

    DOMHighResTimeStamp to use as the mark time. Defaults to performance.now().\n

    \n
    " + "markOptions": "An object for specifying a timestamp and additional metadata for the mark.\n
    \n
    detail Optional
    \n
    \n

    Arbitrary metadata to include in the mark. Defaults to null.\n

    \n
    devtools Optional
    \n
    \n

    Some browsers have use a structured devtools object within the detail object as part of an Extensibility API that surfaces these in custom tracks in performance traces. See the Chrome's Extensibility API documentation for more information.\n

    \n
    dataType
    \n
    \n

    A string which must be set to marker. Identifies as a marker.\n

    \n
    color Optional
    \n
    \n

    Defaults to \"primary\". Must be one of \"primary\", \"primary-light\", \"primary-dark\", \"secondary\", \"secondary-light\", \"secondary-dark\", \"tertiary\", \"tertiary-light\", \"tertiary-dark\", \"error\".\n

    \n
    properties Optional
    \n
    \n

    Array of key-value pairs. Values can be any JSON-compatible type.\n

    \n
    tooltipText Optional
    \n
    \n

    Short description for tooltip.\n

    \n
    \n
    \n
    \n
    \n
    startTime Optional
    \n
    \n

    DOMHighResTimeStamp to use as the mark time. Defaults to performance.now().\n

    \n
    " }, "returns": "A PerformanceMark object." }, @@ -20191,6 +20518,29 @@ }, "doc": "The PerformancePaintTiming interface provides timing information about \"paint\" (also called \"render\") operations during web page construction. \"Paint\" refers to conversion of the render tree to on-screen pixels.\n

    There are two key paint moments this API provides:\n

    \n

    A third key paint moment is provided by the LargestContentfulPaint API:\n

    \n

    The data this API provides helps you minimize the time that users have to wait before they can see the site's content start to appear. Decreasing the time until these key paint moments make sites feel more responsive, performant, and engaging for your users.\n

    Like other Performance APIs, this API extends PerformanceEntry." }, + "performancepainttiming.tojson": { + "url": "$MDN_URL$/web/api/performancepainttiming/tojson", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "60", + "ChromeAndroid": "60", + "Edge": "79", + "Firefox": "84", + "FirefoxAndroid": "84", + "Opera": "47", + "Safari": "14.1", + "SafariIOS": "14.5" + }, + "baseline": { + "level": "HIGH", + "lowDate": "2021-04-26", + "highDate": "2023-10-26" + }, + "doc": "The toJSON() method of the PerformancePaintTiming interface is a serializer; it returns a JSON representation of the PerformancePaintTiming object.", + "returns": "A JSON object that is the serialization of the PerformancePaintTiming object." + }, "performanceresourcetiming": { "url": "$MDN_URL$/web/api/performanceresourcetiming", "status": [ @@ -20568,7 +20918,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The requestStart read-only property returns a timestamp of the time immediately before the browser starts requesting the resource from the server, cache, or local resource. If the transport connection fails and the browser retires the request, the value returned will be the start of the retry request.\n

    There is no end property for requestStart. To measure the request time, calculate responseStart - requestStart (see the example below)." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The requestStart read-only property returns a timestamp of the time immediately before the browser starts requesting the resource from the server, cache, or local resource. If the transport connection fails and the browser retries the request, the value returned will be the start of the retry request.\n

    There is no end property for requestStart. To measure the request time, calculate responseStart - requestStart (see the example below)." }, "performanceresourcetiming.responseend": { "url": "$MDN_URL$/web/api/performanceresourcetiming/responseend", @@ -20678,7 +21028,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serverTiming read-only property returns an array of PerformanceServerTiming entries containing server timing metrics.\n

    Server timing metrics require the server to send the Server-Timing header. For example:\n

    \n```http\nServer-Timing: cache;desc=\"Cache Read\";dur=23.2\n```\n
    \n

    The serverTiming entries can live on navigation and resource entries." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The serverTiming read-only property returns an array of PerformanceServerTiming entries containing server timing metrics.\n

    Server timing metrics require the server to send the Server-Timing header. For example:\n

    \n```http\nServer-Timing: cache;desc=\"Cache Read\";dur=23.2\n```\n
    \n

    The serverTiming entries can live on navigation and resource entries." }, "performanceresourcetiming.tojson": { "url": "$MDN_URL$/web/api/performanceresourcetiming/tojson", @@ -20975,7 +21325,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PerformanceServerTiming interface surfaces server metrics that are sent with the response in the Server-Timing HTTP header.\n

    This interface is restricted to the same origin, but you can use the Timing-Allow-Origin header to specify the domains that are allowed to access the server metrics. Note that this interface is only available in secure contexts (HTTPS) in some browsers." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PerformanceServerTiming interface surfaces server metrics that are sent with the response in the Server-Timing HTTP header.\n

    This interface is restricted to the same origin, but you can use the Timing-Allow-Origin header to specify the domains that are allowed to access the server metrics. Note that this interface is only available in secure contexts (HTTPS) in some browsers." }, "performanceservertiming.description": { "url": "$MDN_URL$/web/api/performanceservertiming/description", @@ -21019,7 +21369,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The duration read-only property returns a double that contains the server-specified metric duration, or the value 0.0." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The duration read-only property returns a double that contains the server-specified metric duration (usually in milliseconds), or the value 0.0." }, "performanceservertiming.name": { "url": "$MDN_URL$/web/api/performanceservertiming/name", @@ -22033,7 +22383,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCoalescedEvents() method of the PointerEvent interface returns a sequence of PointerEvent instances that were coalesced (merged) into a single pointermove or pointerrawupdate event.\nInstead of a stream of many pointermove events, user agents coalesce multiple updates into a single event.\nThis helps with performance as the user agent has less event handling to perform, but there is a reduction in the granularity and accuracy when tracking, especially with fast and large movements.\n

    The getCoalescedEvents() method lets applications access all un-coalesced position changes for precise handling of pointer movement data where necessary.\nUn-coalesced position changes are desirable in drawing applications, for instance, where having access to all events helps to build smoother curves that better match the movement of a pointer.\n

    For an illustration of coalesced events, see Figure 7 in the specification.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getCoalescedEvents() method of the PointerEvent interface returns a sequence of PointerEvent instances that were coalesced (merged) into a single pointermove or pointerrawupdate event.\nInstead of a stream of many pointermove events, user agents coalesce multiple updates into a single event.\nThis helps with performance as the user agent has less event handling to perform, but there is a reduction in the granularity and accuracy when tracking, especially with fast and large movements.\n

    The getCoalescedEvents() method lets applications access all un-coalesced position changes for precise handling of pointer movement data where necessary.\nUn-coalesced position changes are desirable in drawing applications, for instance, where having access to all events helps to build smoother curves that better match the movement of a pointer.\n

    For an illustration of coalesced events, see Figure 7 in the specification.", "returns": "A sequence of PointerEvent instances." }, "pointerevent.getpredictedevents": { @@ -22462,7 +22812,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Presentation can be defined as two possible user agents in the context: Controlling user agent and Receiving user agent.\n

    In controlling browsing context, the Presentation interface provides a mechanism to override the browser default behavior of launching presentation to external screen. In receiving browsing context, Presentation interface provides the access to the available presentation connections." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Presentation can be defined as two possible user agents in the context: Controlling user agent and Receiving user agent.\n

    In controlling browsing context, the Presentation interface provides a mechanism to override the browser default behavior of launching presentation to external screen. In receiving browsing context, Presentation interface provides the access to the available presentation connections." }, "presentation.defaultrequest": { "url": "$MDN_URL$/web/api/presentation/defaultrequest", @@ -22479,7 +22829,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    In a controlling user agent, the defaultRequest attribute MUST return the default presentation request if any, otherwise null. In a receiving browsing context, it MUST return null.\n

    If set by the controller, the value of the defaultRequest attribute SHOULD be used by the controlling user agent as the default presentation request for that controlling browsing context. If the document object's active sandboxing flag set has the sandboxed presentation browsing context flag set, the controlling user agent SHOULD act as if the default request is not set for that browsing context. When the controlling user agent wishes to initiate a PresentationConnection on the behalf of that browsing context, it MUST start a presentation using the default presentation request for the controller (as if the controller had called defaultRequest.start()).\n

    The controlling user agent SHOULD initiate presentation using the default presentation request, only when the user has expressed an intention to do so via a user gesture. For example, by clicking a button in the browser.\n

    \n

    Note:\nSome controlling user agents may allow the user to initiate a default presentation connection and select a presentation display with the same user gesture. For example, the browser chrome could allow the user to pick a display from a menu, or allow the user to tap on an Near Field Communications (NFC) enabled display. In this case, when the controlling user agent asks for permission while starting a presentation, the browser could offer that display as the default choice, or consider the gesture as granting permission for the display and bypass display selection entirely.\n

    \n
    \n

    Note:\nIf a controlling user agent does not support initiation of a presentation connection from the browser chrome, setting defaultRequest will have no effect.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    In a controlling user agent, the defaultRequest attribute MUST return the default presentation request if any, otherwise null. In a receiving browsing context, it MUST return null.\n

    If set by the controller, the value of the defaultRequest attribute SHOULD be used by the controlling user agent as the default presentation request for that controlling browsing context. If the document object's active sandboxing flag set has the sandboxed presentation browsing context flag set, the controlling user agent SHOULD act as if the default request is not set for that browsing context. When the controlling user agent wishes to initiate a PresentationConnection on the behalf of that browsing context, it MUST start a presentation using the default presentation request for the controller (as if the controller had called defaultRequest.start()).\n

    The controlling user agent SHOULD initiate presentation using the default presentation request, only when the user has expressed an intention to do so via a user gesture. For example, by clicking a button in the browser.\n

    \n

    Note:\nSome controlling user agents may allow the user to initiate a default presentation connection and select a presentation display with the same user gesture. For example, the browser chrome could allow the user to pick a display from a menu, or allow the user to tap on a Near Field Communications (NFC) enabled display. In this case, when the controlling user agent asks for permission while starting a presentation, the browser could offer that display as the default choice, or consider the gesture as granting permission for the display and bypass display selection entirely.\n

    \n
    \n

    Note:\nIf a controlling user agent does not support initiation of a presentation connection from the browser chrome, setting defaultRequest will have no effect.\n

    " }, "presentation.receiver": { "url": "$MDN_URL$/web/api/presentation/receiver", @@ -22496,7 +22846,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only Presentation attribute\nreceiver, which is only available in browser contexts which are\nreceiving a presentation, returns the\nPresentationReceiver object which can be used to access and communicate\nwith the browser context which controls the presentation. This property is always\nnull when accessed from outside a browser context which is receiving a\npresentation." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only Presentation attribute\nreceiver, which is only available in browser contexts which are\nreceiving a presentation, returns the\nPresentationReceiver object which can be used to access and communicate\nwith the browser context which controls the presentation. This property is always\nnull when accessed from outside a browser context which is receiving a\npresentation." }, "presentationavailability": { "url": "$MDN_URL$/web/api/presentationavailability", @@ -22513,7 +22863,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A PresentationAvailability object is associated with available presentation displays and represents the presentation display availability for a presentation request. If the controlling user agent can monitor the list of available presentation displays in the background (without a pending request to start()), the PresentationAvailability object MUST be implemented in a controlling browsing context.\n

    The value attribute MUST return the last value it was set to. The value is updated by the monitor the list of available presentation displays algorithm.\n

    The onchange attribute is an event handler whose corresponding event handler event type is change." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A PresentationAvailability object is associated with available presentation displays and represents the presentation display availability for a presentation request. If the controlling user agent can monitor the list of available presentation displays in the background (without a pending request to start()), the PresentationAvailability object MUST be implemented in a controlling browsing context.\n

    The value attribute MUST return the last value it was set to. The value is updated by the monitor the list of available presentation displays algorithm.\n

    The onchange attribute is an event handler whose corresponding event handler event type is change." }, "presentationavailability.value": { "url": "$MDN_URL$/web/api/presentationavailability/value", @@ -22530,7 +22880,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The value attribute MUST return the last value from which it was set. The value is updated by the monitor the list of available presentation displays algorithm.\n

    The onchange attribute is an event handler whose corresponding event handler event type is change." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The value attribute MUST return the last value from which it was set. The value is updated by the monitor the list of available presentation displays algorithm.\n

    The onchange attribute is an event handler whose corresponding event handler event type is change." }, "presentationconnection": { "url": "$MDN_URL$/web/api/presentationconnection", @@ -22547,7 +22897,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnection interface of the Presentation API provides methods and properties for managing a single presentation. Each presentation connection is represented by a PresentationConnection object. Both the controlling user agent and receiving user agent MUST implement PresentationConnection." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnection interface of the Presentation API provides methods and properties for managing a single presentation. Each presentation connection is represented by a PresentationConnection object. Both the controlling user agent and receiving user agent MUST implement PresentationConnection." }, "presentationconnection.binarytype": { "url": "$MDN_URL$/web/api/presentationconnection/binarytype", @@ -22564,7 +22914,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    \n

    Note:\nThe 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.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    \n

    Note:\nThe 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.\n

    " }, "presentationconnection.close": { "url": "$MDN_URL$/web/api/presentationconnection/close", @@ -22581,7 +22931,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.", "returns": "None (undefined)." }, "presentationconnection.id": { @@ -22599,7 +22949,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id attribute specifies the presentation identifier of a presentation connection." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id attribute specifies the presentation identifier of a presentation connection." }, "presentationconnection.send": { "url": "$MDN_URL$/web/api/presentationconnection/send", @@ -22616,7 +22966,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The send() method of the\nPresentationConnection interface tells a controlling browsing context to\nsend binary or text data to a presenting browsing context.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The send() method of the\nPresentationConnection interface tells a controlling browsing context to\nsend binary or text data to a presenting browsing context.", "parameters": { "data": "The data to send to the presentation context. It will be one of the following:\n

    " }, @@ -22637,7 +22987,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    " }, "presentationconnection.terminate": { "url": "$MDN_URL$/web/api/presentationconnection/terminate", @@ -22654,7 +23004,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.", "returns": "None (undefined)." }, "presentationconnection.url": { @@ -22672,7 +23022,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The url read-only property of the\nPresentationConnection interface returns the URL used to create or\nreconnect to the presentation." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The url read-only property of the\nPresentationConnection interface returns the URL used to create or\nreconnect to the presentation." }, "presentationconnectionavailableevent": { "url": "$MDN_URL$/web/api/presentationconnectionavailableevent", @@ -22689,7 +23039,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionAvailableEvent interface of the Presentation API is fired on a PresentationRequest when a connection associated with the object is created.\n

    A controlling user agent fires a trusted event named connectionavailable on a PresentationRequest when a connection associated with the object is created. It is fired at the PresentationRequest instance, using the PresentationConnectionAvailableEvent interface, with the connection attribute set to the PresentationConnection object that was created. The event is fired for each connection that is created for the controller, either by the controller calling start() or reconnect(), or by the controlling user agent creating a connection on the controller's behalf via defaultRequest." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionAvailableEvent interface of the Presentation API is fired on a PresentationRequest when a connection associated with the object is created.\n

    A controlling user agent fires a trusted event named connectionavailable on a PresentationRequest when a connection associated with the object is created. It is fired at the PresentationRequest instance, using the PresentationConnectionAvailableEvent interface, with the connection attribute set to the PresentationConnection object that was created. The event is fired for each connection that is created for the controller, either by the controller calling start() or reconnect(), or by the controlling user agent creating a connection on the controller's behalf via defaultRequest." }, "presentationconnectionavailableevent.connection": { "url": "$MDN_URL$/web/api/presentationconnectionavailableevent/connection", @@ -22706,7 +23056,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When an incoming connection is created, a receiving user agent fires a trusted event, named connectionavailable, on a PresentationReceiver. The trusted event is fired at the presentation controller's monitor, using the PresentationConnectionAvailableEvent interface, with the connection attribute set to the PresentationConnection object that was created.\n

    The event is fired for all connections that are created when monitoring incoming presentation connections." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When an incoming connection is created, a receiving user agent fires a trusted event, named connectionavailable, on a PresentationReceiver. The trusted event is fired at the presentation controller's monitor, using the PresentationConnectionAvailableEvent interface, with the connection attribute set to the PresentationConnection object that was created.\n

    The event is fired for all connections that are created when monitoring incoming presentation connections." }, "presentationconnectionavailableevent.presentationconnectionavailableevent": { "url": "$MDN_URL$/web/api/presentationconnectionavailableevent/presentationconnectionavailableevent", @@ -22723,7 +23073,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionAvailableEvent() constructor creates a new PresentationConnectionAvailableEvent object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionAvailableEvent() constructor creates a new PresentationConnectionAvailableEvent object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to connectionavailable.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    connection
    \n
    \n

    The association PresentationConnection object.\n

    \n
    " @@ -22745,7 +23095,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionCloseEvent interface of the Presentation API is fired on a PresentationConnection when it is closed." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationConnectionCloseEvent interface of the Presentation API is fired on a PresentationConnection when it is closed." }, "presentationconnectionlist": { "url": "$MDN_URL$/web/api/presentationconnectionlist", @@ -22762,7 +23112,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    PresentationConnectionList is the collection of incoming presentation connections." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    PresentationConnectionList is the collection of incoming presentation connections." }, "presentationreceiver": { "url": "$MDN_URL$/web/api/presentationreceiver", @@ -22779,7 +23129,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The PresentationReceiver interface of the Presentation API provides a means for a receiving browsing context to access controlling browsing contexts and communicate with them." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The PresentationReceiver interface of the Presentation API provides a means for a receiving browsing context to access controlling browsing contexts and communicate with them." }, "presentationrequest": { "url": "$MDN_URL$/web/api/presentationrequest", @@ -22796,7 +23146,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A PresentationRequest object is used to initiate or reconnect to a presentation made by a controlling browsing context. The PresentationRequest object MUST be implemented in a controlling browsing context provided by a controlling user agent.\n

    When a PresentationRequest is constructed, the given urls MUST be used as the list of presentation request URLs which are each a possible presentation URL for the PresentationRequest instance." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    A PresentationRequest object is used to initiate or reconnect to a presentation made by a controlling browsing context. The PresentationRequest object MUST be implemented in a controlling browsing context provided by a controlling user agent.\n

    When a PresentationRequest is constructed, the given urls MUST be used as the list of presentation request URLs which are each a possible presentation URL for the PresentationRequest instance." }, "presentationrequest.getavailability": { "url": "$MDN_URL$/web/api/presentationrequest/getavailability", @@ -22813,7 +23163,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When the getAvailability() method is called, the user agent MUST run the following steps:\n

    \n
    Input
    \n
    \n

    presentationUrls, a list of presentation request URLs\n

    \n
    Output
    \n
    \n

    P, a Promise\n

    \n
    \n
      \n
    1. \n

      If one of the following conditions is true:\n

      \n

      Run the following substeps:\n

        \n
      1. Return a Promise rejected with a SecurityError DOMException.
      2. \n
      3. Abort these steps.
      4. \n
      \n
    2. \n
    3. \n

      Let P be a new Promise.\n

    4. \n
    5. \n

      Return P, but continue running these steps in parallel.\n

    6. \n
    7. \n

      If the user agent is unable to monitor the list of available presentation displays for the entire duration of the controlling browsing context (e.g., because the user has disabled this feature), then:\n

        \n
      1. Resolve P with a new PresentationAvailability object with its value property set to false.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    8. \n
    9. \n

      If the user agent is unable to continuously monitor the list of available presentation displays but can find presentation displays in order to start a connection, then:\n

        \n
      1. Reject P with a NotSupportedError DOMException.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    10. \n
    11. \n

      If there exists a tuple (A, presentationUrls) in the set of availability objects, then:\n

        \n
      1. Resolve P with A.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    12. \n
    13. \n

      Let A be a new PresentationAvailability object with its value property set as follows:\n

        \n
      1. false if the list of available presentation displays is empty.
      2. \n
      3. true if there is at least one compatible presentation display for some member of presentationUrls. Meaning there is an entry (presentationUrl, display) in the list of available presentation displays for some presentationUrl in presentationUrls.
      4. \n
      5. false otherwise.
      6. \n
      \n
    14. \n
    15. \n

      Create a tuple (A, presentationUrls) and add it to the set of availability objects.\n

    16. \n
    17. \n

      Run the algorithm to monitor the list of available presentation displays.\n

    18. \n
    19. \n

      Resolve P with A.\n

    20. \n
    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When the getAvailability() method is called, the user agent MUST run the following steps:\n

    \n
    Input
    \n
    \n

    presentationUrls, a list of presentation request URLs\n

    \n
    Output
    \n
    \n

    P, a Promise\n

    \n
    \n
      \n
    1. \n

      If one of the following conditions is true:\n

      \n

      Run the following substeps:\n

        \n
      1. Return a Promise rejected with a SecurityError DOMException.
      2. \n
      3. Abort these steps.
      4. \n
      \n
    2. \n
    3. \n

      Let P be a new Promise.\n

    4. \n
    5. \n

      Return P, but continue running these steps in parallel.\n

    6. \n
    7. \n

      If the user agent is unable to monitor the list of available presentation displays for the entire duration of the controlling browsing context (e.g., because the user has disabled this feature), then:\n

        \n
      1. Resolve P with a new PresentationAvailability object with its value property set to false.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    8. \n
    9. \n

      If the user agent is unable to continuously monitor the list of available presentation displays but can find presentation displays in order to start a connection, then:\n

        \n
      1. Reject P with a NotSupportedError DOMException.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    10. \n
    11. \n

      If there exists a tuple (A, presentationUrls) in the set of availability objects, then:\n

        \n
      1. Resolve P with A.
      2. \n
      3. Abort all the remaining steps.
      4. \n
      \n
    12. \n
    13. \n

      Let A be a new PresentationAvailability object with its value property set as follows:\n

        \n
      1. false if the list of available presentation displays is empty.
      2. \n
      3. true if there is at least one compatible presentation display for some member of presentationUrls. Meaning there is an entry (presentationUrl, display) in the list of available presentation displays for some presentationUrl in presentationUrls.
      4. \n
      5. false otherwise.
      6. \n
      \n
    14. \n
    15. \n

      Create a tuple (A, presentationUrls) and add it to the set of availability objects.\n

    16. \n
    17. \n

      Run the algorithm to monitor the list of available presentation displays.\n

    18. \n
    19. \n

      Resolve P with A.\n

    20. \n
    " }, "presentationrequest.presentationrequest": { "url": "$MDN_URL$/web/api/presentationrequest/presentationrequest", @@ -22830,7 +23180,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationRequest()\nconstructor creates a new PresentationRequest object which creates a\nnew PresentationRequest.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PresentationRequest()\nconstructor creates a new PresentationRequest object which creates a\nnew PresentationRequest.", "parameters": { "url or urls\\[]": "A URL or array of URLs that are possible URLs used to create, or reconnect, a\npresentation for the PresentationRequest instance." } @@ -22850,7 +23200,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When the reconnect(presentationId) method is called on a PresentationRequest presentationRequest, the user agent MUST run the following steps to reconnect to a presentation:" + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    When the reconnect(presentationId) method is called on a PresentationRequest presentationRequest, the user agent MUST run the following steps to reconnect to a presentation:" }, "presentationrequest.start": { "url": "$MDN_URL$/web/api/presentationrequest/start", @@ -22867,7 +23217,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The start() property of the PresentationRequest interface returns a Promise that resolves with a PresentationConnection after the user agent prompts the user to select a display and grant permission to use that display.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The start() property of the PresentationRequest interface returns a Promise that resolves with a PresentationConnection after the user agent prompts the user to select a display and grant permission to use that display.", "returns": "A Promise that resolves with a PresentationConnection." }, "pressureobserver": { @@ -22884,7 +23234,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureObserver interface is part of the Compute Pressure API and is used to observe the pressure changes of system resources such as the CPU." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureObserver interface is part of the Compute Pressure API and is used to observe the pressure changes of system resources such as the CPU." }, "pressureobserver.disconnect": { "url": "$MDN_URL$/web/api/pressureobserver/disconnect", @@ -22900,7 +23250,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The disconnect() method of the PressureObserver interface stops the pressure observer callback from receiving pressure records from all sources.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The disconnect() method of the PressureObserver interface stops the pressure observer callback from receiving pressure records from all sources.", "returns": "None (undefined)." }, "pressureobserver.knownsources": { @@ -22917,7 +23267,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static knownSources read-only property of the PressureObserver interface returns an array of the source values supported by the user agent in alphabetical order.\n

    \n

    Note:\nThe list of supported sources varies per browser, operating system, and hardware, and is evolving. This property is merely a hint about source types the user agents supports. Call observe() and check for a NotSupportedError to see if pressure observation is possible.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static knownSources read-only property of the PressureObserver interface returns an array of the source values supported by the user agent in alphabetical order.\n

    \n

    Note:\nThe list of supported sources varies per browser, operating system, and hardware, and is evolving. This property is merely a hint about source types the user agents supports. Call observe() and check for a NotSupportedError to see if pressure observation is possible.\n

    " }, "pressureobserver.observe": { "url": "$MDN_URL$/web/api/pressureobserver/observe", @@ -22933,7 +23283,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The observe() method of the PressureObserver interface tells the pressure observer to start observing pressure changes. After this method is called, the observer will call its callback function when a pressure record for the specified source is observed.\n

    When a matching PressureRecord is obtained, the pressure observer's callback function is invoked.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The observe() method of the PressureObserver interface tells the pressure observer to start observing pressure changes. After this method is called, the observer will call its callback function when a pressure record for the specified source is observed.\n

    When a matching PressureRecord is obtained, the pressure observer's callback function is invoked.", "parameters": { "source": "A string specifying which source to observe. See PressureRecord.source for a list of sources and PressureObserver.knownSources for a list of sources the user agent supports.", "options": "An object to configure observation with the following properties:\n

    \n
    sampleInterval Optional
    \n
    \n

    A number representing the requested sampling interval expressed in milliseconds. Defaults to 0 meaning it will get updates as fast as the system can handle it.\n

    \n
    " @@ -22958,7 +23308,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureObserver() constructor creates a new PressureObserver object to watch for changes to pressure changes of system resources such as the CPU.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureObserver() constructor creates a new PressureObserver object to watch for changes to pressure changes of system resources such as the CPU.", "parameters": { "callback": "A callback that will be invoked when pressure records are observed. When the callback is invoked, the following parameters are available:\n

    \n
    changes
    \n
    \n

    An array containing all PressureRecord objects recorded since the last time the callback was called, or the last time the observer's takeRecords() method was called.\n

    \n
    observer
    \n
    \n

    The observer object that is receiving the above records.\n

    \n
    " }, @@ -22981,7 +23331,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The takeRecords() method of the PressureObserver interface returns the current list of pressure records stored in the pressure observer, emptying it out.\n

    It is useful when you want to a stop observing a source but would like to be sure to get any records that have not yet been passed into the observer callback.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The takeRecords() method of the PressureObserver interface returns the current list of pressure records stored in the pressure observer, emptying it out.\n

    It is useful when you want to a stop observing a source but would like to be sure to get any records that have not yet been passed into the observer callback.", "returns": "An Array of PressureRecord objects." }, "pressureobserver.unobserve": { @@ -22998,7 +23348,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The unobserve() method of the PressureObserver interface stops the pressure observer callback from receiving pressure records from the specified source.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The unobserve() method of the PressureObserver interface stops the pressure observer callback from receiving pressure records from the specified source.", "parameters": { "source": "A string specifying which source to unobserve." }, @@ -23018,7 +23368,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureRecord interface is part of the Compute Pressure API and describes the pressure trend of a source at a specific moment of transition." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PressureRecord interface is part of the Compute Pressure API and describes the pressure trend of a source at a specific moment of transition." }, "pressurerecord.source": { "url": "$MDN_URL$/web/api/pressurerecord/source", @@ -23034,7 +23384,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only source property is a string indicating the origin source from which the record is coming." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only source property is a string indicating the origin source from which the record is coming." }, "pressurerecord.state": { "url": "$MDN_URL$/web/api/pressurerecord/state", @@ -23050,7 +23400,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only state property is a string indicating the pressure state recorded." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only state property is a string indicating the pressure state recorded." }, "pressurerecord.time": { "url": "$MDN_URL$/web/api/pressurerecord/time", @@ -23066,7 +23416,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only time property returns the timestamp recorded for a PressureRecord. It corresponds to the time the data was obtained from the system relative to the time origin of the global object in which the PressureObserver generated the notification." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only time property returns the timestamp recorded for a PressureRecord. It corresponds to the time the data was obtained from the system relative to the time origin of the global object in which the PressureObserver generated the notification." }, "pressurerecord.tojson": { "url": "$MDN_URL$/web/api/pressurerecord/tojson", @@ -23082,7 +23432,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method is a serializer; it returns a JSON representation of the PressureRecord object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method is a serializer; it returns a JSON representation of the PressureRecord object.", "returns": "A JSON object that is the serialization of the PressureRecord object." }, "processinginstruction": { @@ -23427,7 +23777,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredential interface provides information about a public key / private key pair, which is a credential for logging in to a service using an un-phishable and data-breach resistant asymmetric key pair instead of a password. It inherits from Credential, and is part of the Web Authentication API extension to the Credential Management API.\n

    \n

    Note:\nThis API is restricted to top-level contexts. Use from within an <iframe> element will not have any effect.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredential interface provides information about a public key / private key pair, which is a credential for logging in to a service using an un-phishable and data-breach resistant asymmetric key pair instead of a password. It inherits from Credential, and is part of the Web Authentication API extension to the Credential Management API.\n

    \n

    Note:\nThis API is restricted to top-level contexts. Use from within an <iframe> element will not have any effect.\n

    " }, "publickeycredential.authenticatorattachment": { "url": "$MDN_URL$/web/api/publickeycredential/authenticatorattachment", @@ -23448,7 +23798,7 @@ "level": "LOW", "lowDate": "2023-11-21" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The authenticatorAttachment read-only property of the PublicKeyCredential interface is a string that indicates the general category of authenticator used during the associated navigator.credentials.create() or navigator.credentials.get() call." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The authenticatorAttachment read-only property of the PublicKeyCredential interface is a string that indicates the general category of authenticator used during the associated navigator.credentials.create() or navigator.credentials.get() call." }, "publickeycredential.getclientcapabilities": { "url": "$MDN_URL$/web/api/publickeycredential/getclientcapabilities_static", @@ -23469,7 +23819,7 @@ "level": "LOW", "lowDate": "2025-02-06" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getClientCapabilities() static method of the PublicKeyCredential interface returns a Promise that resolves with an object that can be used to check whether or not particular WebAuthn client capabilities and extensions are supported.\n

    A relying party (RP) can use this information to appropriately customize its sign-in and sign-up user interfaces and workflows.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getClientCapabilities() static method of the PublicKeyCredential interface returns a Promise that resolves with an object that can be used to check whether or not particular WebAuthn client capabilities and extensions are supported.\n

    A relying party (RP) can use this information to appropriately customize its sign-in and sign-up user interfaces and workflows.", "returns": "A Promise that resolves to an object where the property names are the client capability strings, and the values are boolean values that indicate whether or not the corresponding capability or extension is supported.\n

    The WebAuthn client capability strings are:\n

    \n
    \"conditionalCreate\"
    \n
    \n

    The client is capable of creating discoverable credentials.\n

    \n
    \"conditionalGet\"
    \n
    \n

    The client is capable of authenticating using discoverable credentials.\nThis capability is equivalent to isConditionalMediationAvailable() resolving to true.\n

    \n
    \"hybridTransport\"
    \n
    \n

    The client supports usage of the hybrid transport.\nThis means that the client can use authenticators that rely on Bluetooth, NFC, or USB.\n

    \n
    \"passkeyPlatformAuthenticator\"
    \n
    \n

    The client allows usage of a passkey authenticator that supports multi-factor authentication mechanisms such as a PIN or biometric check.\nThe authenticator can be part of the same platform (device) as the client, or connected via a hybrid transport such as Bluetooth or USB.\nThe credentials are stored on the authenticator.\nSee Passkeys developer guide for relying parties.\n

    \n
    userVerifyingPlatformAuthenticator
    \n
    \n

    The client has a platform authenticator (part of the same device) that supports multi-factor authentication mechanisms, such as a PIN or biometric check.\nThe credentials may be stored on either the RP or the authenticator.\n

    \n
    relatedOrigins
    \n
    \n

    The client supports Related Origin Requests.\nThese clients allow a passkey to be used across multiple sites that have the same origin.\n

    \n
    signalAllAcceptedCredentials
    \n
    \n

    The client supports the PublicKeyCredential.signalAllAcceptedCredentials() static method.\nIf not supported, RP workflows will need to prompt the user to manually delete credentials on the authenticator.\n

    \n
    signalCurrentUserDetails
    \n
    \n

    The client supports the PublicKeyCredential.signalCurrentUserDetails() static method.\nIf not supported, RP workflows will need to prompt the user to manually update user details on the authenticator.\n

    \n
    signalUnknownCredential
    \n
    \n

    The client supports the PublicKeyCredential.signalUnknownCredential() static method.\nIf not supported, RP workflows will need to prompt the user to manually delete credentials from the authenticator.\n

    \n
    \n

    The web extension strings are formatted by prefixing the extension identifier with the prefix extension:.\nFor example, the key extension:appid can be used to check if the appid extension is supported.", "throws": { "SecurityError DOMException": "The RP domain is not valid." @@ -23495,7 +23845,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getClientExtensionResults() method of the PublicKeyCredential interface returns an object mapping the identifiers of extensions requested during credential creation or authentication, and their results after processing by the user agent.\n

    During the creation or fetching of a PublicKeyCredential (via navigator.credentials.create() and navigator.credentials.get() respectively), it is possible to request \"custom\" processing by the client for different extensions, specified in the publicKey option's extensions property. You can find more information about requesting the different extensions in Web Authentication extensions.\n

    \n

    Note:\ngetClientExtensionResults() only returns the results from extensions processed by the user agent (client). The results from extensions processed by the authenticator can be found in the authenticator data available in AuthenticatorAssertionResponse.authenticatorData.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getClientExtensionResults() method of the PublicKeyCredential interface returns an object mapping the identifiers of extensions requested during credential creation or authentication, and their results after processing by the user agent.\n

    During the creation or fetching of a PublicKeyCredential (via navigator.credentials.create() and navigator.credentials.get() respectively), it is possible to request \"custom\" processing by the client for different extensions, specified in the publicKey option's extensions property. You can find more information about requesting the different extensions in Web Authentication extensions.\n

    \n

    Note:\ngetClientExtensionResults() only returns the results from extensions processed by the user agent (client). The results from extensions processed by the authenticator can be found in the authenticator data available in AuthenticatorAssertionResponse.authenticatorData.\n

    ", "returns": "An object with each entry being an extensions' identifier string as the key, and the output from the processing of the extension by the client as the value.", "throws": { "SecurityError DOMException": "The RP domain is not valid." @@ -23503,7 +23853,7 @@ }, "publickeycredential.id": { "url": "$MDN_URL$/web/api/publickeycredential/id", - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the\nPublicKeyCredential interface is a string, inherited\nfrom Credential, which represents the identifier of the current\nPublicKeyCredential instance.\n

    This property is a base64url encoded version of PublicKeyCredential.rawId.\n

    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The id read-only property of the\nPublicKeyCredential interface is a string, inherited\nfrom Credential, which represents the identifier of the current\nPublicKeyCredential instance.\n

    This property is a base64url encoded version of PublicKeyCredential.rawId.\n

    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " }, "publickeycredential.isconditionalmediationavailable": { "url": "$MDN_URL$/web/api/publickeycredential/isconditionalmediationavailable_static", @@ -23524,7 +23874,7 @@ "level": "LOW", "lowDate": "2023-10-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isConditionalMediationAvailable() static method of the PublicKeyCredential interface returns a Promise which resolves to true if conditional mediation is available.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isConditionalMediationAvailable() static method of the PublicKeyCredential interface returns a Promise which resolves to true if conditional mediation is available.", "returns": "A Promise which resolves to a boolean value indicating whether or not conditional mediation is available.", "throws": { "SecurityError DOMException": "The RP domain is not valid." @@ -23550,7 +23900,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isUserVerifyingPlatformAuthenticatorAvailable() static method of the PublicKeyCredential interface returns a Promise which resolves to true if a user-verifying platform authenticator is present.\n

    A user-verifying platform authenticator is a kind of multi-factor authenticator that is part of the client device (it is generally not removable) and that involves an action from the user in order to identify them. Common user-verifying platform authenticators include:\n

    \n
    \n

    Note:\nThis method may only be used in top-level contexts and will not be available in an <iframe> for example.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isUserVerifyingPlatformAuthenticatorAvailable() static method of the PublicKeyCredential interface returns a Promise which resolves to true if a user-verifying platform authenticator is present.\n

    A user-verifying platform authenticator is a kind of multi-factor authenticator that is part of the client device (it is generally not removable) and that involves an action from the user in order to identify them. Common user-verifying platform authenticators include:\n

    \n
    \n

    Note:\nThis method may only be used in top-level contexts and will not be available in an <iframe> for example.\n

    ", "returns": "A Promise which resolves to a boolean value indicating whether or a not a user-verifying platform authenticator is available.\n
    \n

    Note:\nIn earlier versions of the specification, the boolean also conveyed the consent of the user to disclose such an authenticator existed.\n

    ", "throws": { "SecurityError DOMException": "The RP domain is not valid." @@ -23575,7 +23925,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The parseCreationOptionsFromJSON() static method of the PublicKeyCredential interface creates a PublicKeyCredentialCreationOptions object from a JSON representation of its properties.\n

    The method is a convenience function for converting credential options information provided by a relying party server to the form that a web app can use to create a credential.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The parseCreationOptionsFromJSON() static method of the PublicKeyCredential interface creates a PublicKeyCredentialCreationOptions object from a JSON representation of its properties.\n

    The method is a convenience function for converting credential options information provided by a relying party server to the form that a web app can use to create a credential.", "parameters": { "options": "An object with the same structure as a PublicKeyCredentialCreationOptions, but with base64url-encoded strings used in place of buffer properties." }, @@ -23604,7 +23954,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The parseRequestOptionsFromJSON() static method of the PublicKeyCredential interface converts a JSON type representation into a PublicKeyCredentialRequestOptions instance.\n

    The method is a convenience function for converting information provided by a relying server to a web app in order to request an existing credential.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The parseRequestOptionsFromJSON() static method of the PublicKeyCredential interface converts a JSON type representation into a PublicKeyCredentialRequestOptions instance.\n

    The method is a convenience function for converting information provided by a relying server to a web app in order to request an existing credential.", "parameters": { "options": "An object with the same structure as a PublicKeyCredentialRequestOptions instance, but with base64url-encoded strings used in place of buffer properties." }, @@ -23634,7 +23984,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The rawId read-only property of the\nPublicKeyCredential interface is an ArrayBuffer object\ncontaining the identifier of the credentials.\n

    The PublicKeyCredential.id property is a base64url encoded version of this identifier.\n

    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The rawId read-only property of the\nPublicKeyCredential interface is an ArrayBuffer object\ncontaining the identifier of the credentials.\n

    The PublicKeyCredential.id property is a base64url encoded version of this identifier.\n

    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " }, "publickeycredential.response": { "url": "$MDN_URL$/web/api/publickeycredential/response", @@ -23656,7 +24006,7 @@ "lowDate": "2021-09-07", "highDate": "2024-03-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The response read-only property of the\nPublicKeyCredential interface is an AuthenticatorResponse\nobject which is sent from the authenticator to the user agent for the creation/fetching\nof credentials. The information contained in this response will be used by the relying\nparty's server to verify the demand is legitimate.\n

    An AuthenticatorResponse is either:\n

    \n

    In order to validate the creation of credentials, a relying party's server\nneeds both:\n

    \n
    \n

    Note:\nWhen validating the fetching of existing credentials, the\nwhole PublicKeyCredential object and the client extensions are necessary\nfor the relying party's server.\n

    \n
    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The response read-only property of the\nPublicKeyCredential interface is an AuthenticatorResponse\nobject which is sent from the authenticator to the user agent for the creation/fetching\nof credentials. The information contained in this response will be used by the relying\nparty's server to verify the demand is legitimate.\n

    An AuthenticatorResponse is either:\n

    \n

    In order to validate the creation of credentials, a relying party's server\nneeds both:\n

    \n
    \n

    Note:\nWhen validating the fetching of existing credentials, the\nwhole PublicKeyCredential object and the client extensions are necessary\nfor the relying party's server.\n

    \n
    \n

    Note:\nThis property may only be used in top-level contexts and will\nnot be available in an <iframe> for example.\n

    " }, "publickeycredential.signalallacceptedcredentials": { "url": "$MDN_URL$/web/api/publickeycredential/signalallacceptedcredentials_static", @@ -23674,7 +24024,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalAllAcceptedCredentials() static method of the PublicKeyCredential interface signals to the authenticator all of the valid credential IDs that the relying party (RP) server still holds for a particular user.\n

    This allows the authenticator to update credential information, removing all credentials that are no longer recognized by the RP, such as those for deleted accounts. The method should be called each time a user authenticates with the RP.\n

    signalAllAcceptedCredentials() should only be called when the current user is authenticated — after sign up or sign-in, or when the user deletes a credential — as it exposes sensitive information belonging to the user.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalAllAcceptedCredentials() static method of the PublicKeyCredential interface signals to the authenticator all of the valid credential IDs that the relying party (RP) server still holds for a particular user.\n

    This allows the authenticator to update credential information, removing all credentials that are no longer recognized by the RP, such as those for deleted accounts. The method should be called each time a user authenticates with the RP.\n

    signalAllAcceptedCredentials() should only be called when the current user is authenticated — after sign up or sign-in, or when the user deletes a credential — as it exposes sensitive information belonging to the user.", "parameters": { "options": "An object representing the valid credentials, which contains the following properties:\n

    \n
    allAcceptedCredentialIds
    \n
    \n

    An array of base64url-encoded strings representing the ids of the credentials that are still valid.\n

    \n
    rpId
    \n
    \n

    A string representing the id of the RP that sent the signal.\n

    \n
    userId
    \n
    \n

    A base64url-encoded string representing the id of the user the credentials relate to.\n

    \n
    " }, @@ -23700,7 +24050,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalCurrentUserDetails() static method of the PublicKeyCredential interface signals to the authenticator that a particular user has updated their user name and/or display name on the relying party (RP) server.\n

    This allows the authenticator to update user account details, to make sure they stay in sync with those held by the RP. It should only be used when the current user is authenticated — after sign in, or when they change the metadata associated with their credentials on the RP web app.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalCurrentUserDetails() static method of the PublicKeyCredential interface signals to the authenticator that a particular user has updated their user name and/or display name on the relying party (RP) server.\n

    This allows the authenticator to update user account details, to make sure they stay in sync with those held by the RP. It should only be used when the current user is authenticated — after sign in, or when they change the metadata associated with their credentials on the RP web app.", "parameters": { "options": "An object representing the updated user information, which contains the following properties:\n

    \n
    displayName
    \n
    \n

    A string representing the updated user displayName.\n

    \n
    name
    \n
    \n

    A string representing the updated user name.\n

    \n
    rpId
    \n
    \n

    A string representing the id of the RP that sent the signal.\n

    \n
    userId
    \n
    \n

    A base64url-encoded string representing the id of the user the credentials relate to.\n

    \n
    " }, @@ -23726,7 +24076,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalUnknownCredential() static method of the PublicKeyCredential interface signals to the authenticator that a credential ID was not recognized by the relying party (RP) server.\n

    This allows the authenticator to remove credentials that are not allowed by the RP, such as those for deleted accounts, or accounts that were created and stored on the authenticator but not properly updated on the server. Generally the method is called after sign in fails because the account details were not available to the RP. It can be used even when the current user is not authenticated because it does not expose sensitive information.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The signalUnknownCredential() static method of the PublicKeyCredential interface signals to the authenticator that a credential ID was not recognized by the relying party (RP) server.\n

    This allows the authenticator to remove credentials that are not allowed by the RP, such as those for deleted accounts, or accounts that were created and stored on the authenticator but not properly updated on the server. Generally the method is called after sign in fails because the account details were not available to the RP. It can be used even when the current user is not authenticated because it does not expose sensitive information.", "parameters": { "options": "An object representing the unrecognized credential, which contains the following properties:\n

    \n
    credentialId
    \n
    \n

    A base64url-encoded string representing the id of the credential that was unrecognized.\n

    \n
    rpId
    \n
    \n

    A string representing the id of the RP that sent the signal.\n

    \n
    " }, @@ -23755,7 +24105,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the PublicKeyCredential interface returns a JSON type representation of a PublicKeyCredential.\n

    The properties of the returned object depend on whether the credential is returned by navigator.credentials.create() when creating a key pair and registering a user, or navigator.credentials.get() when authenticating a user.\n

    This method is automatically invoked when web app code calls JSON.stringify() to serialize a PublicKeyCredential so that it can be sent to relying party server when registering or authenticating a user.\nIt not intended to be called directly in web app code.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The toJSON() method of the PublicKeyCredential interface returns a JSON type representation of a PublicKeyCredential.\n

    The properties of the returned object depend on whether the credential is returned by navigator.credentials.create() when creating a key pair and registering a user, or navigator.credentials.get() when authenticating a user.\n

    This method is automatically invoked when web app code calls JSON.stringify() to serialize a PublicKeyCredential so that it can be sent to relying party server when registering or authenticating a user.\nIt not intended to be called directly in web app code.", "returns": "A JSON type representation of a PublicKeyCredential object.\n

    The included properties depend on whether the credential was returned by navigator.credentials.create() on registration, or navigator.credentials.get() when authenticating a user.\nThe values and types of included properties are the same as for PublicKeyCredential, with the exception that base64url-encoded strings are used in place of buffer properties.\n

    The object properties are:\n

    \n
    id
    \n
    \n

    The value returned by PublicKeyCredential.id.\n

    \n
    rawId
    \n
    \n

    A base64url-encoded version of PublicKeyCredential.rawId.\n

    \n
    authenticatorAttachment Optional
    \n
    \n

    The value returned by PublicKeyCredential.authenticatorAttachment.\n

    \n
    type
    \n
    \n

    The string \"public-key\".\n

    \n
    clientExtensionResults
    \n
    \n

    An array containing base64url-encoded versions of the values returned by PublicKeyCredential.getClientExtensionResults().\n

    \n
    response
    \n
    \n

    The response property object depends on whether the credentials are returned following a registration or authentication operation.\n

    \n
    \n
    ", "throws": { "SecurityError DOMException": "The RP domain is not valid." @@ -23768,7 +24118,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredentialCreationOptions dictionary represents the object passed to CredentialsContainer.create() as the value of the publicKey option: that is, when using create() to create a public key credential using the Web Authentication API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredentialCreationOptions dictionary represents the object passed to CredentialsContainer.create() as the value of the publicKey option: that is, when using create() to create a public key credential using the Web Authentication API." }, "publickeycredentialrequestoptions": { "url": "$MDN_URL$/web/api/publickeycredentialrequestoptions", @@ -23777,7 +24127,7 @@ "lowDate": "2019-09-19", "highDate": "2022-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredentialRequestOptions dictionary represents the object passed to CredentialsContainer.get() as the value of the publicKey option.\n

    It is used to request a PublicKeyCredential provided by an authenticator that supports the Web Authentication API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The PublicKeyCredentialRequestOptions dictionary represents the object passed to CredentialsContainer.get() as the value of the publicKey option.\n

    It is used to request a PublicKeyCredential provided by an authenticator that supports the Web Authentication API." }, "pushevent": { "url": "$MDN_URL$/web/api/pushevent", @@ -23799,7 +24149,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushEvent interface of the Push API represents a push message that has been received. This event is sent to the global scope of a ServiceWorker. It contains the information sent from an application server to a PushSubscription." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushEvent interface of the Push API represents a push message that has been received. This event is sent to the global scope of a ServiceWorker. It contains the information sent from an application server to a PushSubscription." }, "pushevent.data": { "url": "$MDN_URL$/web/api/pushevent/data", @@ -23821,7 +24171,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The data read-only property of the PushEvent interface returns a reference to a PushMessageData object containing data sent to the PushSubscription." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The data read-only property of the PushEvent interface returns a reference to a PushMessageData object containing data sent to the PushSubscription." }, "pushevent.pushevent": { "url": "$MDN_URL$/web/api/pushevent/pushevent", @@ -23843,7 +24193,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushEvent() constructor creates a new\nPushEvent object. Note that this constructor is exposed only to a\nservice worker context.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushEvent() constructor creates a new\nPushEvent object. Note that this constructor is exposed only to a\nservice worker context.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to push or pushsubscriptionchange.", "options": "An object that, in addition of the properties defined in ExtendableEvent(), can have the following properties:\n

    \n
    data
    \n
    \n

    The data you want the PushEvent to contain, if any.\nWhen the constructor is invoked, the PushEvent.data property of the resulting object will be set\nto a new PushMessageData object containing these bytes.\n

    \n
    " @@ -23870,7 +24220,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushManager interface of the Push API provides a way to receive notifications from third-party servers as well as request URLs for push notifications.\n

    This interface is accessed via the ServiceWorkerRegistration.pushManager property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushManager interface of the Push API provides a way to receive notifications from third-party servers as well as request URLs for push notifications.\n

    This interface is accessed via the ServiceWorkerRegistration.pushManager property." }, "pushmanager.getsubscription": { "url": "$MDN_URL$/web/api/pushmanager/getsubscription", @@ -23892,7 +24242,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushManager.getSubscription() method of the PushManager interface retrieves an existing push subscription.\n

    It returns a Promise that resolves to a PushSubscription object containing details of an existing subscription. If no existing subscription exists, this resolves to a null value.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushManager.getSubscription() method of the PushManager interface retrieves an existing push subscription.\n

    It returns a Promise that resolves to a PushSubscription object containing details of an existing subscription. If no existing subscription exists, this resolves to a null value.", "returns": "A Promise that resolves to a PushSubscription object or null." }, "pushmanager.haspermission": { @@ -23931,7 +24281,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The permissionState() method of the\nPushManager interface returns a Promise that resolves to a\nstring indicating the permission state of the push manager. Possible\nvalues are 'prompt', 'denied', or 'granted'.\n

    \n

    Note:\nAs of Firefox 44, the permissions for Notifications and Push have been merged. If permission is\ngranted for notifications, push will also be enabled.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The permissionState() method of the\nPushManager interface returns a Promise that resolves to a\nstring indicating the permission state of the push manager. Possible\nvalues are 'prompt', 'denied', or 'granted'.\n

    \n

    Note:\nAs of Firefox 44, the permissions for Notifications and Push have been merged. If permission is\ngranted for notifications, push will also be enabled.\n

    ", "parameters": { "options": "An object containing optional configuration parameters. It can have the following\nproperties:\n
    \n
    userVisibleOnly
    \n
    \n

    A boolean indicating that the returned push\nsubscription will only be used for messages whose effect is made visible to the\nuser.\n

    \n
    applicationServerKey
    \n
    \n

    A public key your push server will use to\nsend messages to client apps via a push server. This value is part of a signing\nkey pair generated by your application server and usable with elliptic curve\ndigital signature (ECDSA) over the P-256 curve.\n

    \n
    " }, @@ -23989,7 +24339,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subscribe() method of the PushManager\ninterface subscribes to a push service.\n

    It returns a Promise that resolves to a PushSubscription\nobject containing details of a push subscription. A new push subscription is created if\nthe current service worker does not have an existing subscription.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subscribe() method of the PushManager\ninterface subscribes to a push service.\n

    It returns a Promise that resolves to a PushSubscription\nobject containing details of a push subscription. A new push subscription is created if\nthe current service worker does not have an existing subscription.", "parameters": { "options": "An object containing optional configuration parameters. It can have the following\nproperties:\n

    \n
    userVisibleOnly
    \n
    \n

    A boolean indicating that the returned push\nsubscription will only be used for messages whose effect is made visible to the\nuser.\n

    \n
    applicationServerKey
    \n
    \n

    A Base64-encoded string or\nArrayBuffer containing an ECDSA\nP-256 public key that the push server will use to authenticate your application\nserver. If specified, all messages from your application server must use the VAPID authentication scheme, and\ninclude a JWT signed with the corresponding private key. This key IS\nNOT the same ECDH key that you use to encrypt the data. For more\ninformation, see \"Using VAPID with WebPush\".\n

    \n
    \n
    \n

    Note:\nThis parameter is required in some browsers like\nChrome and Edge. They will reject the Promise if userVisibleOnly is not set to true.\n

    " }, @@ -24014,7 +24364,7 @@ "level": "LOW", "lowDate": "2025-01-07" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The supportedContentEncodings read-only static property of the PushManager interface returns an array of supported content codings that can be used to encrypt the payload of a push message.\n

    User agents must support the aes128gcm content coding defined in RFC 8291, and may also support content codings defined from previous versions of the specification.\nThe returned array is frozen, and may not be modified by the recipient.\n

    The application server requires this coding in order to encrypt push messages for sending to the push server.\nThe coding used for encryption is also included by the app server in the Content-Encoding HTTP header field of each push message.\n

    The specification does not define how the client code should send the application server the supported codings, or the information in the PushSubscription that it also needs in order to encrypt and send a push message.\nOne approach is shown in the examples section below.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The supportedContentEncodings read-only static property of the PushManager interface returns an array of supported content codings that can be used to encrypt the payload of a push message.\n

    User agents must support the aes128gcm content coding defined in RFC 8291, and may also support content codings defined from previous versions of the specification.\nThe returned array is frozen, and may not be modified by the recipient.\n

    The application server requires this coding in order to encrypt push messages for sending to the push server.\nThe coding used for encryption is also included by the app server in the Content-Encoding HTTP header field of each push message.\n

    The specification does not define how the client code should send the application server the supported codings, or the information in the PushSubscription that it also needs in order to encrypt and send a push message.\nOne approach is shown in the examples section below.", "throws": { "TypeError": "This is thrown when attempting to set a value in the returned array." } @@ -24058,7 +24408,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushMessageData interface of the Push API provides methods which let you retrieve the push data sent by a server in various formats.\n

    Unlike the similar methods in the Fetch API, which only allow the method to be invoked once, these methods can be called multiple times.\n

    Messages received through the Push API are sent encrypted by push services and then automatically decrypted by browsers before they are made accessible through the methods of the PushMessageData interface." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The PushMessageData interface of the Push API provides methods which let you retrieve the push data sent by a server in various formats.\n

    Unlike the similar methods in the Fetch API, which only allow the method to be invoked once, these methods can be called multiple times.\n

    Messages received through the Push API are sent encrypted by push services and then automatically decrypted by browsers before they are made accessible through the methods of the PushMessageData interface." }, "pushmessagedata.arraybuffer": { "url": "$MDN_URL$/web/api/pushmessagedata/arraybuffer", @@ -24080,7 +24430,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The arrayBuffer() method of the PushMessageData interface extracts push message data as an ArrayBuffer object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The arrayBuffer() method of the PushMessageData interface extracts push message data as an ArrayBuffer object.", "returns": "An ArrayBuffer." }, "pushmessagedata.blob": { @@ -24103,7 +24453,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The blob() method of the PushMessageData interface extracts push message data as a Blob object.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The blob() method of the PushMessageData interface extracts push message data as a Blob object.", "returns": "A Blob." }, "pushmessagedata.bytes": { @@ -24125,8 +24475,8 @@ "level": "LOW", "lowDate": "2025-01-17" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The bytes() method of the PushMessageData interface extracts push message data as an Uint8Array object.", - "returns": "An Uint8Array." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The bytes() method of the PushMessageData interface extracts push message data as a Uint8Array object.", + "returns": "A Uint8Array." }, "pushmessagedata.json": { "url": "$MDN_URL$/web/api/pushmessagedata/json", @@ -24148,7 +24498,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The json() method of the PushMessageData interface extracts push message data by parsing it as a JSON string and returning the result.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The json() method of the PushMessageData interface extracts push message data by parsing it as a JSON string and returning the result.", "returns": "The result of parsing push event data as JSON. This could be anything that can be represented by JSON — an object, an array, a string, a number…" }, "pushmessagedata.text": { @@ -24171,7 +24521,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The text() method of the PushMessageData interface extracts push message data as a plain text string.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The text() method of the PushMessageData interface extracts push message data as a plain text string.", "returns": "A string." }, "pushsubscription": { @@ -24194,7 +24544,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushSubscription interface of the Push API provides a subscription's URL endpoint along with the public key and secrets that should be used for encrypting push messages to this subscription.\nThis information must be passed to the application server, using any desired application-specific method.\n

    The interface also provides information about when the subscription will expire, and a method to unsubscribe from the subscription." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushSubscription interface of the Push API provides a subscription's URL endpoint along with the public key and secrets that should be used for encrypting push messages to this subscription.\nThis information must be passed to the application server, using any desired application-specific method.\n

    The interface also provides information about when the subscription will expire, and a method to unsubscribe from the subscription." }, "pushsubscription.endpoint": { "url": "$MDN_URL$/web/api/pushsubscription/endpoint", @@ -24216,7 +24566,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The endpoint read-only property of the\nPushSubscription interface returns a string containing\nthe endpoint associated with the push subscription.\n

    The endpoint takes the form of a custom URL pointing to a push server, which can be\nused to send a push message to the particular service worker instance that subscribed to\nthe push service. For this reason, it is a good idea to keep your endpoint a secret, so\nothers do not hijack it and abuse the push functionality." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The endpoint read-only property of the\nPushSubscription interface returns a string containing\nthe endpoint associated with the push subscription.\n

    The endpoint takes the form of a custom URL pointing to a push server, which can be\nused to send a push message to the particular service worker instance that subscribed to\nthe push service. For this reason, it is a good idea to keep your endpoint a secret, so\nothers do not hijack it and abuse the push functionality." }, "pushsubscription.expirationtime": { "url": "$MDN_URL$/web/api/pushsubscription/expirationtime", @@ -24238,7 +24588,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The expirationTime read-only property of the\nPushSubscription interface returns a DOMHighResTimeStamp\nof the subscription expiration time associated with the push subscription, if there is\none, or null otherwise." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The expirationTime read-only property of the\nPushSubscription interface returns a DOMHighResTimeStamp\nof the subscription expiration time associated with the push subscription, if there is\none, or null otherwise." }, "pushsubscription.getkey": { "url": "$MDN_URL$/web/api/pushsubscription/getkey", @@ -24260,7 +24610,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getKey() method of the PushSubscription interface\nreturns an ArrayBuffer representing a client public key, which can then\nbe sent to a server and used in encrypting push message data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getKey() method of the PushSubscription interface\nreturns an ArrayBuffer representing a client public key, which can then\nbe sent to a server and used in encrypting push message data.", "parameters": { "name": "A string representing the encryption method used to generate a\nclient key. The value can be:\n

    \n
    p256dh
    \n
    \n

    An Elliptic curve Diffie–Hellman public key on the P-256 curve (that is, the NIST\nsecp256r1 elliptic curve). The resulting key is an uncompressed point in ANSI\nX9.62 format.\n

    \n
    auth
    \n
    \n

    An authentication secret, as described in Message Encryption for Web Push.\n

    \n
    " }, @@ -24286,7 +24636,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The options read-only property\nof the PushSubscription interface is an object containing the options\nused to create the subscription." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The options read-only property\nof the PushSubscription interface is an object containing the options\nused to create the subscription." }, "pushsubscription.subscriptionid": { "url": "$MDN_URL$/web/api/pushsubscription/subscriptionid", @@ -24299,7 +24649,7 @@ "Edge": "17", "Opera": "29" }, - "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subscriptionId read-only property of the\nPushSubscription interface returns a string containing\nthe subscription ID associated with the push subscription.\n

    \n

    Warning:\nInstead of this feature, use the PushSubscription.endpoint property on the same interface.\n

    " + "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The subscriptionId read-only property of the\nPushSubscription interface returns a string containing\nthe subscription ID associated with the push subscription.\n

    \n

    Warning:\nInstead of this feature, use the PushSubscription.endpoint property on the same interface.\n

    " }, "pushsubscription.tojson": { "url": "$MDN_URL$/web/api/pushsubscription/tojson", @@ -24321,7 +24671,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The toJSON() method of the PushSubscription interface is a\nstandard serializer: it returns a JSON representation of the subscription properties,\nproviding a useful shortcut.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The toJSON() method of the PushSubscription interface is a\nstandard serializer: it returns a JSON representation of the subscription properties,\nproviding a useful shortcut.", "returns": "A JSON object. It contains the subscription endpoint, expirationTime and public keys, as an\nendpoint member, an expirationTime member and a keys member." }, "pushsubscription.unsubscribe": { @@ -24344,7 +24694,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unsubscribe() method of the PushSubscription interface\nreturns a Promise that resolves to a boolean value when the\ncurrent subscription is successfully unsubscribed.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unsubscribe() method of the PushSubscription interface\nreturns a Promise that resolves to a boolean value when the\ncurrent subscription is successfully unsubscribed.", "returns": "A Promise that resolves to a boolean value when the current\nsubscription is successfully unsubscribed." }, "pushsubscriptionoptions": { @@ -24367,7 +24717,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushSubscriptionOptions interface of the Push API represents the options associated with a push subscription.\n

    The read-only PushSubscriptionOptions object is returned by calling PushSubscription.options on a PushSubscription. This interface has no constructor of its own." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The PushSubscriptionOptions interface of the Push API represents the options associated with a push subscription.\n

    The read-only PushSubscriptionOptions object is returned by calling PushSubscription.options on a PushSubscription. This interface has no constructor of its own." }, "pushsubscriptionoptions.applicationserverkey": { "url": "$MDN_URL$/web/api/pushsubscriptionoptions/applicationserverkey", @@ -24389,7 +24739,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The applicationServerKey read-only property of the PushSubscriptionOptions interface contains the public key used by the push server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The applicationServerKey read-only property of the PushSubscriptionOptions interface contains the public key used by the push server." }, "pushsubscriptionoptions.uservisibleonly": { "url": "$MDN_URL$/web/api/pushsubscriptionoptions/uservisibleonly", @@ -24407,7 +24757,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The userVisibleOnly read-only property of the PushSubscriptionOptions interface indicates if the returned push subscription will only be used for messages whose effect is made visible to the user." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The userVisibleOnly read-only property of the PushSubscriptionOptions interface indicates if the returned push subscription will only be used for messages whose effect is made visible to the user." }, "queuemicrotask": { "url": "$MDN_URL$/web/api/window/queuemicrotask", diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-r.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-r.json index 85fa99569a44..d384517e1ccb 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-r.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-r.json @@ -131,33 +131,33 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The collapse() method of the Range interface collapses the\nRange to one of its boundary points.\n

    A collapsed Range is empty, containing no content, specifying a\nsingle-point in a DOM tree. To determine if a Range is already collapsed,\nsee the Range.collapsed property.", + "doc": "The collapse() method of the Range interface collapses the\nRange to one of its boundary points.\n

    A collapsed Range is empty, containing no content, specifying a\nsingle-point in a DOM tree. To determine if a Range is already collapsed,\nsee the AbstractRange.collapsed property.", "parameters": { "toStart": "A boolean value: true collapses the Range\nto its start, false to its end. If omitted, it defaults to\nfalse." }, "returns": "None (undefined)." }, "range.collapsed": { - "url": "$MDN_URL$/web/api/range/collapsed", + "url": "$MDN_URL$/web/api/abstractrange/collapsed", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Opera": "9", - "Safari": "1", - "SafariIOS": "1" + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The Range.collapsed read-only property returns a\nboolean flag indicating whether the start and end points of the\nRange are at the same position. It returns true if the start\nand end boundary points of the Range are the same point in the DOM,\nfalse if not.\n

    A collapsed Range is empty (containing no content), and specifies a\nsingle point in a DOM tree. To collapse a range, see the Range.collapse()\nmethod." + "doc": "The read-only collapsed property of the AbstractRange interface returns true if the range's start position and end position are the same.\n

    A collapsed range is empty (containing no content), and specifies a single point in a DOM tree. To collapse a range, see the Range.collapse() method." }, "range.commonancestorcontainer": { "url": "$MDN_URL$/web/api/range/commonancestorcontainer", @@ -179,7 +179,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Range.commonAncestorContainer read-only property\nreturns the deepest — or furthest down the document tree — Node that\ncontains both boundary points of the Range. This means that if\nRange.startContainer and Range.endContainer both refer to\nthe same node, this node is the common ancestor container.\n

    Since a Range need not be continuous, and may also partially select nodes,\nthis is a convenient way to find a Node which encloses a\nRange.\n

    This property is read-only. To change the ancestor container of a Node,\nconsider using the various methods available to set the start and end positions of the\nRange, such as Range.setStart() and\nRange.setEnd()." + "doc": "The Range.commonAncestorContainer read-only property\nreturns the deepest — or furthest down the document tree — Node that\ncontains both boundary points of the Range. This means that if\nstartContainer and endContainer both refer to\nthe same node, this node is the common ancestor container.\n

    Since a Range need not be continuous, and may also partially select nodes,\nthis is a convenient way to find a Node which encloses a\nRange.\n

    This property is read-only. To change the ancestor container of a Node,\nconsider using the various methods available to set the start and end positions of the\nRange, such as Range.setStart() and\nRange.setEnd()." }, "range.compareboundarypoints": { "url": "$MDN_URL$/web/api/range/compareboundarypoints", @@ -273,11 +273,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Range.createContextualFragment() method returns a\nDocumentFragment by invoking the HTML fragment parsing algorithm or the\nXML fragment parsing algorithm with the start of the range (the parent of the\nselected node) as the context node. The HTML fragment parsing algorithm is used if the\nrange belongs to a Document whose HTMLness bit is set. In the HTML case, if\nthe context node would be html, for historical reasons the fragment parsing\nalgorithm is invoked with body as the context instead.", + "doc": "

    \n

    Warning:\nThis method parses its input as HTML or XML, writing the result into a DocumentFragment that might subsequently be injected into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can reduce the risk by assigning TrustedHTML objects instead of strings, and enforcing trusted types using the require-trusted-types-for CSP directive.\nThis ensures that the input is passed through a transformation function, which has the chance to sanitize the input to remove potentially dangerous markup, such as <script> elements and event handler attributes.\n

    \n

    The Range.createContextualFragment() method of the Range interface returns a DocumentFragment representing the parsed input HTML or XML.", "parameters": { - "tagString": "Text that contains text and tags to be converted to a document fragment." + "input": "A TrustedHTML instance or string that represents the text and tags to be converted to a document fragment." }, - "returns": "A DocumentFragment object." + "returns": "A DocumentFragment object.", + "throws": { + "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." + } }, "range.deletecontents": { "url": "$MDN_URL$/web/api/range/deletecontents", @@ -305,12 +308,15 @@ "range.detach": { "url": "$MDN_URL$/web/api/range/detach", "status": [ - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "1", "ChromeAndroid": "18", "Edge": "12", + "Firefox": "", + "FirefoxAndroid": "4", "Opera": "9", "Safari": "1", "SafariIOS": "1" @@ -318,52 +324,52 @@ "baseline": { "level": "NONE" }, - "doc": "The Range.detach() method does nothing. It used to\ndisable the Range object and enable the browser to release associated\nresources. The method has been kept for compatibility.", + "doc": "

    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.

    \n

    The Range.detach() method does nothing. It used to\ndisable the Range object and enable the browser to release associated\nresources. The method has been kept for compatibility.", "returns": "None (undefined)." }, "range.endcontainer": { - "url": "$MDN_URL$/web/api/range/endcontainer", + "url": "$MDN_URL$/web/api/abstractrange/endcontainer", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Opera": "9", - "Safari": "1", - "SafariIOS": "1" + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The Range.endContainer read-only property returns the\nNode within which the Range ends. To change the end\nposition of a node, use the Range.setEnd() method or a similar one." + "doc": "The read-only endContainer property of the AbstractRange interface returns the Node in which the end of the range is located.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "range.endoffset": { - "url": "$MDN_URL$/web/api/range/endoffset", + "url": "$MDN_URL$/web/api/abstractrange/endoffset", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Opera": "9", - "Safari": "1", - "SafariIOS": "1" + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The Range.endOffset read-only property returns a number\nrepresenting where in the Range.endContainer the Range\nends.\n

    If the endContainer is a Node of type Text,\nComment, or CDATASection, then the offset is the number of\ncharacters from the start of the endContainer to the boundary point of the\nRange. For other Node types, the endOffset is\nthe number of child nodes between the start of the endContainer and the\nboundary point of the Range. This property is read-only. To change the\nendOffset of a Range, use one of the\nRange.setEnd methods." + "doc": "The endOffset property of the AbstractRange interface returns the offset into the end node of the range's end position.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "range.extractcontents": { "url": "$MDN_URL$/web/api/range/extractcontents", @@ -533,7 +539,7 @@ "lowDate": "2017-04-05", "highDate": "2019-10-05" }, - "doc": "The Range() constructor returns a newly created\nRange object whose start and end is the global Document\nobject." + "doc": "The Range() constructor returns a newly created\nRange object whose start and end are offset 0 of the global document\nobject." }, "range.selectnode": { "url": "$MDN_URL$/web/api/range/selectnode", @@ -750,48 +756,48 @@ "returns": "None (undefined)." }, "range.startcontainer": { - "url": "$MDN_URL$/web/api/range/startcontainer", + "url": "$MDN_URL$/web/api/abstractrange/startcontainer", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Opera": "9", - "Safari": "1", - "SafariIOS": "1" + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The Range.startContainer read-only property returns the\nNode within which the Range starts. To change the start\nposition of a node, use one of the Range.setStart() methods." + "doc": "The read-only startContainer property of the AbstractRange interface returns the Node in which the start of the range is located.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "range.startoffset": { - "url": "$MDN_URL$/web/api/range/startoffset", + "url": "$MDN_URL$/web/api/abstractrange/startoffset", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "1", - "ChromeAndroid": "18", - "Edge": "12", - "Firefox": "1", - "FirefoxAndroid": "4", - "Opera": "9", - "Safari": "1", - "SafariIOS": "1" + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", + "Firefox": "69", + "FirefoxAndroid": "79", + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2015-07-29", - "highDate": "2018-01-29" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The Range.startOffset read-only property returns a number\nrepresenting where in the startContainer the Range starts.\n

    If the startContainer is a Node of type\nText, Comment, or CDATASection, then the\noffset is the number of characters from the start of the startContainer to\nthe boundary point of the Range. For other Node types, the\nstartOffset is the number of child nodes between the start of the\nstartContainer and the boundary point of the Range.\n

    To change the startOffset of a Range, use the\nRange.setStart method." + "doc": "The read-only startOffset property of the AbstractRange interface returns the offset into the start node of the range's start position.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "range.surroundcontents": { "url": "$MDN_URL$/web/api/range/surroundcontents", @@ -1026,7 +1032,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The Symbol.asyncIterator static data property represents the well-known symbol Symbol.asyncIterator. The async iterable protocol looks up this symbol for the method that returns the async iterator for an object. In order for an object to be async iterable, it must have an [Symbol.asyncIterator] key." + "doc": "The Symbol.asyncIterator static data property represents the well-known symbol Symbol.asyncIterator. The async iterable protocol looks up this symbol for the method that returns the async iterator for an object. In order for an object to be async iterable, it must have a [Symbol.asyncIterator] key." }, "readablestream.cancel": { "url": "$MDN_URL$/web/api/readablestream/cancel", @@ -1107,7 +1113,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The getReader() method of the ReadableStream interface creates a reader and locks the stream to it.\nWhile the stream is locked, no other reader can be acquired until this one is released.", "parameters": { - "options": "An object containing the following properties:\n

    \n
    mode Optional
    \n
    \n

    An property that specifies the type of reader to create.\nValues can be:\n

      \n
    • \"byob\", which results in a ReadableStreamBYOBReader being created that can read readable byte streams (streams that support zero-copy transfer from an underlying byte source to the reader when internal stream buffers are empty).
    • \n
    • undefined (or not specified at all — this is the default), which results in a ReadableStreamDefaultReader being created that can read individual chunks from a stream.
    • \n
    \n
    \n
    " + "options": "An object containing the following properties:\n
    \n
    mode Optional
    \n
    \n

    A property that specifies the type of reader to create.\nValues can be:\n

      \n
    • \"byob\", which results in a ReadableStreamBYOBReader being created that can read readable byte streams (streams that support zero-copy transfer from an underlying byte source to the reader when internal stream buffers are empty).
    • \n
    • undefined (or not specified at all — this is the default), which results in a ReadableStreamDefaultReader being created that can read individual chunks from a stream.
    • \n
    \n
    \n
    " }, "returns": "A ReadableStreamDefaultReader or ReadableStreamBYOBReader object instance, depending on the mode value.", "throws": { @@ -1839,7 +1845,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The RelativeOrientationSensor interface of the Sensor APIs describes the device's physical orientation without regard to the Earth's reference coordinate system.\n

    To use this sensor, the user must grant permission to the 'accelerometer', and 'gyroscope' device sensors through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The RelativeOrientationSensor interface of the Sensor APIs describes the device's physical orientation without regard to the Earth's reference coordinate system.\n

    To use this sensor, the user must grant permission to the 'accelerometer', and 'gyroscope' device sensors through the Permissions API. In addition, this feature may be blocked by a Permissions Policy set on your server." }, "relativeorientationsensor.relativeorientationsensor": { "url": "$MDN_URL$/web/api/relativeorientationsensor/relativeorientationsensor", @@ -1855,7 +1861,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The RelativeOrientationSensor()\nconstructor creates a new RelativeOrientationSensor object which\ndescribes the device's physical orientation.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The RelativeOrientationSensor()\nconstructor creates a new RelativeOrientationSensor object which\ndescribes the device's physical orientation.", "parameters": { "options": "Options are as follows:\n

    \n
    frequency Optional
    \n
    \n

    The desired number of times per second a sample\nshould be taken, meaning the number of times per second that the\nreading event will be called. A whole number or decimal\nmay be used, the latter for frequencies less than a second. The actual\nreading frequency depends device hardware and consequently may be less\nthan requested.\n

    \n
    referenceFrame Optional
    \n
    \n

    Either 'device' or\n'screen'. The default is 'device'.\n

    \n
    " }, @@ -2051,7 +2057,7 @@ "Safari": "16.4", "SafariIOS": "16.4" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The ReportBody interface of the Reporting API represents the body of a report. Individual report types inherit from this interface, adding specific attributes relevant to the particular report." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The ReportBody interface of the Reporting API represents the body of a report. Individual report types inherit from this interface, adding specific attributes relevant to the particular report.\n

    The following interfaces inherit from ReportBody:\n

    \n

    An instance of ReportBody is returned as the value of Report.body. The interface has no constructor." }, "reportbody.tojson": { "url": "$MDN_URL$/web/api/reportbody/tojson", @@ -2088,7 +2094,7 @@ }, "doc": "The reportError() method of the Window interface may be used to report errors to the console or event handlers of global scopes, emulating an uncaught JavaScript exception.\n

    This feature is primarily intended for custom event-dispatching or callback-manipulating libraries.\nLibraries can use this feature to catch errors in callback code and re-throw them to the top level handler.\nThis ensures that an exception in one callback will not prevent others from being handled, while at the same time ensuring that stack trace information is still readily available for debugging at the top level.", "parameters": { - "throwable": "An error object such as a TypeError." + "throwable": "Any JavaScript value, but preferably an error object such as a TypeError." }, "returns": "None (undefined).", "throws": { @@ -2239,7 +2245,11 @@ "highDate": "2019-09-27" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The arrayBuffer() method of the Request interface\nreads the request body and returns it as a promise that resolves with an ArrayBuffer.", - "returns": "A promise that resolves with an ArrayBuffer." + "returns": "A promise that resolves with an ArrayBuffer.", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    ", + "RangeError": "Thrown if there is a problem creating the associated ArrayBuffer (for example, if the data size is too large)." + } }, "request.blob": { "url": "$MDN_URL$/web/api/request/blob", @@ -2264,7 +2274,10 @@ "highDate": "2019-09-27" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The blob() method of the Request interface\nreads the request body and returns it as a promise that resolves with a Blob.", - "returns": "A promise that resolves with a Blob." + "returns": "A promise that resolves with a Blob whose data is the body's bytes and the media type is the request's Content-Type header's value.", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    " + } }, "request.body": { "url": "$MDN_URL$/web/api/request/body", @@ -2331,8 +2344,12 @@ "level": "LOW", "lowDate": "2025-01-17" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The bytes() method of the Request interface reads the request body and returns it as a promise that resolves with an Uint8Array.", - "returns": "A promise that resolves with an Uint8Array." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The bytes() method of the Request interface reads the request body and returns it as a promise that resolves with a Uint8Array.", + "returns": "A promise that resolves with a Uint8Array.", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    ", + "RangeError": "Thrown if there is a problem creating the associated ArrayBuffer (for example, if the data size is too large)." + } }, "request.cache": { "url": "$MDN_URL$/web/api/request/cache", @@ -2468,7 +2485,10 @@ "highDate": "2023-10-26" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The formData() method of the Request interface\nreads the request body and returns it as a promise that resolves with a FormData object.", - "returns": "A Promise that resolves with a FormData object." + "returns": "A Promise that resolves with a FormData object.", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    " + } }, "request.headers": { "url": "$MDN_URL$/web/api/request/headers", @@ -2515,7 +2535,7 @@ "lowDate": "2017-03-27", "highDate": "2019-09-27" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The integrity read-only property of the Request interface contains the subresource integrity value of the request." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The integrity read-only property of the Request interface contains the subresource integrity value of the request." }, "request.ishistorynavigation": { "url": "$MDN_URL$/web/api/request/ishistorynavigation", @@ -2557,7 +2577,11 @@ "highDate": "2019-09-27" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The json() method of the Request interface\nreads the request body and returns it as a promise that resolves with the result of parsing the body text as JSON.\n

    Note that despite the method being named json(), the result is not JSON but is instead the result of taking JSON as input and parsing it to produce a JavaScript object.", - "returns": "A Promise that resolves to a JavaScript object. This object could be\nanything that can be represented by JSON — an object, an array, a string, a number…" + "returns": "A Promise that resolves to a JavaScript object. This object could be\nanything that can be represented by JSON — an object, an array, a string, a number…", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    ", + "SyntaxError": "The request body cannot be parsed as JSON." + } }, "request.keepalive": { "url": "$MDN_URL$/web/api/request/keepalive", @@ -2728,7 +2752,8 @@ "options": "A RequestInit object containing any custom settings that you want to apply to the request.\n

    If you construct a new Request from an existing Request, any options you set in an options argument for the new request replace any corresponding options set in the original Request. For example:\n

    \n```js\nconst oldRequest = new Request(\n  \"https://github.com/mdn/content/issues/12959\",\n  { headers: { From: \"webmaster@example.org\" } },\n);\noldRequest.headers.get(\"From\"); // \"webmaster@example.org\"\nconst newRequest = new Request(oldRequest, {\n  headers: { From: \"developer@example.org\" },\n});\nnewRequest.headers.get(\"From\"); // \"developer@example.org\"\n```\n
    " }, "throws": { - "TypeError": "The URL has credentials, such as http://user:password@example.com, or cannot be parsed." + "NotAllowedError DOMException": "Thrown if:\n", + "TypeError": "Thrown if:\n" } }, "request.signal": { @@ -2778,7 +2803,10 @@ "highDate": "2019-09-27" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The text() method of the Request interface\nreads the request body and returns it as a promise that resolves with a String.\nThe response is always decoded using UTF-8.", - "returns": "A Promise that resolves with a String." + "returns": "A Promise that resolves with a String.", + "throws": { + "TypeError": "Thrown for one of the following reasons:\n

    " + } }, "request.url": { "url": "$MDN_URL$/web/api/request/url", @@ -3079,7 +3107,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The ResizeObserverSize interface of the Resize Observer API is used by the ResizeObserverEntry interface to access the box sizing properties of the element being observed.\n
    \n

    Note:\nIn multi-column layout, which is a fragmented context, the sizing returned by ResizeObserverSize will be the size of the first column.\n

    " + "doc": "The ResizeObserverSize interface of the Resize Observer API is used by the ResizeObserverEntry interface to access the box sizing properties of the element being observed.\n
    \n

    Note:\nIn multi-column layout, which is a fragmented context, the sizing returned by ResizeObserverSize will be the size of the first column.\n

    " }, "resizeobserversize.blocksize": { "url": "$MDN_URL$/web/api/resizeobserversize/blocksize", @@ -3101,7 +3129,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The blockSize read-only property of the ResizeObserverSize interface returns the length of the observed element's border box in the block dimension. For boxes with a horizontal writing-mode, this is the vertical dimension, or height; if the writing-mode is vertical, this is the horizontal dimension, or width.\n
    \n

    Note:\nFor more explanation of writing modes and block and inline dimensions, read Handling different text directions.\n

    " + "doc": "The blockSize read-only property of the ResizeObserverSize interface returns the length of the observed element's border box in the block dimension. For boxes with a horizontal writing-mode, this is the vertical dimension, or height; if the writing-mode is vertical, this is the horizontal dimension, or width.\n
    \n

    Note:\nFor more explanation of writing modes and block and inline dimensions, read Handling different text directions.\n

    " }, "resizeobserversize.inlinesize": { "url": "$MDN_URL$/web/api/resizeobserversize/inlinesize", @@ -3123,7 +3151,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The inlineSize read-only property of the ResizeObserverSize interface returns the length of the observed element's border box in the inline dimension. For boxes with a horizontal writing-mode, this is the horizontal dimension, or width; if the writing-mode is vertical, this is the vertical dimension, or height.\n
    \n

    Note:\nFor more explanation of writing modes and block and inline dimensions, read Handling different text directions.\n

    " + "doc": "The inlineSize read-only property of the ResizeObserverSize interface returns the length of the observed element's border box in the inline dimension. For boxes with a horizontal writing-mode, this is the horizontal dimension, or width; if the writing-mode is vertical, this is the vertical dimension, or height.\n
    \n

    Note:\nFor more explanation of writing modes and block and inline dimensions, read Handling different text directions.\n

    " }, "response": { "url": "$MDN_URL$/web/api/response", @@ -3176,7 +3204,7 @@ "throws": { "AbortError DOMException": "The request was aborted.", "TypeError": "Thrown for one of the following reasons:\n", - "RangeError": "There was a problem creating the associated ArrayBuffer.\nFor example, if the data size is more than Number.MAX_SAFE_INTEGER." + "RangeError": "Thrown if there is a problem creating the associated ArrayBuffer (for example, if the data size is too large)." } }, "response.blob": { @@ -3202,7 +3230,7 @@ "highDate": "2019-09-27" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The blob() method of the Response interface takes\na Response stream and reads it to completion. It returns a promise that\nresolves with a Blob.", - "returns": "A promise that resolves with a Blob.", + "returns": "A promise that resolves with a Blob whose data is the body's bytes and the media type is the response's Content-Type header's value.", "throws": { "AbortError DOMException": "The request was aborted.", "TypeError": "Thrown for one of the following reasons:\n

    " @@ -3278,11 +3306,11 @@ "lowDate": "2025-01-17" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The bytes() method of the Response interface takes a Response stream and reads it to completion.\nIt returns a promise that resolves with a Uint8Array.", - "returns": "A promise that resolves with an Uint8Array.", + "returns": "A promise that resolves with a Uint8Array.", "throws": { "AbortError DOMException": "The request was aborted.", "TypeError": "Thrown for one of the following reasons:\n

    ", - "RangeError": "There was a problem creating the associated ArrayBuffer.\nFor example, if the data size is more than Number.MAX_SAFE_INTEGER." + "RangeError": "Thrown if there is a problem creating the associated ArrayBuffer (for example, if the data size is too large)." } }, "response.clone": { @@ -3361,7 +3389,7 @@ "returns": "A Promise that resolves with a FormData object.", "throws": { "AbortError DOMException": "The request was aborted.", - "TypeError": "Thrown for one of the following reasons:\n" + "TypeError": "Thrown for one of the following reasons:\n" } }, "response.headers": { @@ -3683,9 +3711,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fromElement() static method of the RestrictionTarget interface returns a RestrictionTarget instance that can be used to restrict a captured video track to a specified DOM element (plus its descendants).", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fromElement() static method of the RestrictionTarget interface returns a RestrictionTarget instance that can be used to restrict a captured video track to a specified DOM element (plus its descendants).", "parameters": { - "element": "A reference to an Element that you want to use as a restriction target. For an element to be used as a restriction target, it must:\n

    \n

    If it does not meet the above criteria, it is considered to be not eligible for restriction.\n

    In addition, the element will not be captured if the track being restricted has clones (that is, created by BrowserCaptureMediaStreamTrack.clone()) or is captured from a different tab to the current user's tab (passed via Window.postMessage(), for example)." + "element": "A reference to an Element that you want to use as a restriction target. For an element to be used as a restriction target, it must:\n

    \n

    If it does not meet the above criteria, it is considered to be not eligible for restriction.\n

    In addition, the element will not be captured if the track being restricted has clones (that is, created by BrowserCaptureMediaStreamTrack.clone()) or is captured from a different tab to the current user's tab (passed via Window.postMessage(), for example)." }, "returns": "A Promise that resolves to a RestrictionTarget object instance, which can then be passed to BrowserCaptureMediaStreamTrack.restrictTo() to restrict the video captured in the track to just the particular DOM element the RestrictionTarget was created with.\n

    RestrictionTarget objects are serializable. They can be passed to another document using mechanisms such as Window.postMessage().\n

    The promise will reject if the restriction target element is not eligible for restriction." }, @@ -3708,8 +3736,9 @@ "rtcaudiosourcestats": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The RTCAudioSourceStats dictionary of the WebRTC API provides statistics information about an audio track (MediaStreamTrack) that is attached to one or more senders (RTCRtpSender).\n

    These statistics can be obtained by iterating the RTCStatsReport returned by RTCRtpSender.getStats() or RTCPeerConnection.getStats() until you find a report with the type of media-source and a kind of audio.\n

    \n

    Note:\nFor audio information about remotely sourced tracks (that are being received), see RTCInboundRtpStreamStats.\n

    " }, @@ -3723,24 +3752,27 @@ "rtcaudiosourcestats.id": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats/id", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The id property of the RTCAudioSourceStats dictionary is a string which uniquely identifies the object for which this object provides statistics.\n

    Using the id, you can correlate this statistics object with others, in order to monitor statistics over time for a given WebRTC object, such as an RTCPeerConnection, or an RTCDataChannel." }, "rtcaudiosourcestats.kind": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats/kind", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The kind property of the RTCAudioSourceStats dictionary is a string with the value audio.\n

    The kind is used to differentiate between audio and video media sources when iterating an RTCStatsReport, which both have a type of media-source (a kind of video indicates an RTCVideoSourceStats object)." }, "rtcaudiosourcestats.timestamp": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats/timestamp", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The timestamp property of the RTCAudioSourceStats dictionary is a DOMHighResTimeStamp object specifying the time at which the data in the object was sampled.\n

    The time is given in milliseconds elapsed since the first moment of January 1, 1970, UTC (also known as Unix time)." }, @@ -3761,16 +3793,18 @@ "rtcaudiosourcestats.trackidentifier": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats/trackidentifier", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The trackIdentifier property of the RTCAudioSourceStats dictionary contains the id attribute of the associated MediaStreamTrack." }, "rtcaudiosourcestats.type": { "url": "$MDN_URL$/web/api/rtcaudiosourcestats/type", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The type property of the RTCAudioSourceStats dictionary is a string with value media-source.\n

    The type of media-source identifies the type of statistics as either RTCAudioSourceStats or RTCVideoSourceStats when iterating the RTCStatsReport returned by RTCRtpSender.getStats() or RTCPeerConnection.getStats().\nThe type of stats can further be differentiated using the kind, which will be audio for RTCAudioSourceStats." }, @@ -4778,8 +4812,33 @@ "level": "LOW", "lowDate": "2023-08-29" }, - "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getMetadata() method of the RTCEncodedAudioFrame interface returns an object containing the metadata associated with the frame.\n

    This includes information about the frame, including the audio encoding used, the synchronization source and contributing sources, and the sequence number (for incoming frames).", - "returns": "An object with the following properties:\n

    \n
    audioLevel
    \n
    \n

    A number representing the audio level of this frame. The value is between 0 and 1 inclusive (linear), where 1.0 represents 0 dBov (decibels relative to full scale (DBFS)), 0 represents silence, and 0.5 represents approximately 6 dB SPL change in the sound pressure level from 0 dBov. The value is converted from the -127 to 0 range specified in RFC6464 via the equation 10^(-rfc_level/20). If the RFC6464 header extension is not present in the received packets of the frame, audioLevel will be undefined.\n

    \n
    synchronizationSource
    \n
    \n

    A positive integer value indicating synchronization source (\"ssrc\") of the stream of RTP packets that are described by this frame.\nA source might be something like a microphone, or a mixer application that combines multiple sources.\nAll packets from the same source share the same time source and sequence space, and so can be ordered relative to each other.\nNote that two frames with the same value refer to the same source.\n

    \n
    payloadType
    \n
    \n

    A positive integer value in the range from 0 to 127 that describes the format of the RTP payload.\nThe mappings of values to formats is defined in RFC3550, and more specifically Section 6: Payload Type Definitions of RFC3551.\n

    \n
    contributingSources
    \n
    \n

    An Array of sources (ssrc) that have contributed to the frame.\nConsider the case of a conferencing application that combines audio from multiple users.\nThe synchronizationSource would include the ssrc of the application, while contributingSources would include the ssrc values of all the individual audio sources.\n

    \n
    sequenceNumber
    \n
    \n

    The sequence number of an incoming audio frame (not used for outgoing frames) that can be used for reconstructing the original send-order of frames.\nThis is number between 0 and 32767.\nNote that while numbers are allocated sequentially when sent, they will overflow at 32767 and restart back at 0.\nTherefore to compare two frame sequence numbers, in order to determine whether one is assumed to be after another, you must use serial number arithmetic. \n

    \n
    " + "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getMetadata() method of the RTCEncodedAudioFrame interface returns an object containing the metadata associated with the frame.\n

    This includes information about the frame, such as the audio encoding used, the synchronization source and contributing sources, and the sequence number (for incoming frames).", + "returns": "An object with the following properties:\n

    \n
    audioLevel
    \n
    \n

    A number representing the audio level of this frame.\nThe value is between 0 and 1 inclusive (linear), where 1.0 represents 0 dBov (decibels relative to full scale (DBFS)), 0 represents silence, and 0.5 represents approximately 6 dB SPL change in the sound pressure level from 0 dBov.\nThe value is converted from the -127 to 0 range specified in RFC6464 via the equation 10^(-rfc_level/20).\nIf the RFC6464 header extension is not present in the received packets of the frame, audioLevel will be undefined.\n

    \n
    captureTime
    \n
    \n

    A DOMHighResTimeStamp indicating the capture time of the frame relative to Performance.timeOrigin.\n

    \n
    contributingSources
    \n
    \n

    An Array of sources (ssrc) that have contributed to the frame.\nConsider the case of a conferencing application that combines audio from multiple users.\nThe synchronizationSource would include the ssrc of the application, while contributingSources would include the ssrc values of all the individual audio sources.\n

    \n
    mimeType
    \n
    \n

    A string containing the MIME type of the codec used, such as \"audio/opus\".\n

    \n
    payloadType
    \n
    \n

    A positive integer value in the range from 0 to 127 that describes the format of the RTP payload.\nThe mappings of values to formats is defined in RFC 3550, and more specifically Section 6: Payload Type Definitions of RFC 3551.\n

    \n
    receiveTime
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp of the last received packet of an incoming frame (from an RTCRtpReceiver) used to produce this media frame, relative to Performance.timeOrigin.\n

    \n
    rtpTimestamp
    \n
    \n

    A positive integer that reflects the sampling instant of the first octet in the RTP data packet (see RFC 3550).\n

    \n
    sequenceNumber
    \n
    \n

    The sequence number of an incoming audio frame (not used for outgoing frames) that can be used for reconstructing the original send-order of frames.\nThis is number between 0 and 32767.\nNote that while numbers are allocated sequentially when sent, they will overflow at 32767 and restart back at 0.\nTherefore to compare two frame sequence numbers, in order to determine whether one is assumed to be after another, you must use serial number arithmetic. \n

    \n
    synchronizationSource
    \n
    \n

    A positive integer value indicating the synchronization source (\"ssrc\") of the stream of RTP packets that are described by this frame.\nA source might be something like a microphone, or a mixer application that combines multiple sources.\nAll packets from the same source share the same time source and sequence space, and so can be ordered relative to each other.\nNote that two frames with the same value refer to the same source.\n

    \n
    " + }, + "rtcencodedaudioframe.rtcencodedaudioframe": { + "url": "$MDN_URL$/web/api/rtcencodedaudioframe/rtcencodedaudioframe", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "127", + "ChromeAndroid": "127", + "Edge": "127", + "Firefox": "145", + "FirefoxAndroid": "145", + "Opera": "113", + "Safari": "26", + "SafariIOS": "26" + }, + "baseline": { + "level": "LOW", + "lowDate": "2025-11-11" + }, + "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The RTCEncodedAudioFrame() constructor creates a new and fully independent RTCEncodedAudioFrame object.\n

    The new object is a deep clone of the original object data and metadata, with any metadata specified in the options parameter overwriting the copied values.", + "parameters": { + "originalFrame": "The frame to be copied.", + "options": "This is an object with the following property:\n

    \n
    metadata Optional
    \n
    \n

    An object setting the frame metadata.\nThis is an object with the same properties as the object returned by RTCEncodedAudioFrame.getMetadata().\n

    \n
    " + } }, "rtcencodedaudioframe.timestamp": { "url": "$MDN_URL$/web/api/rtcencodedaudioframe/timestamp", @@ -4859,8 +4918,33 @@ "level": "LOW", "lowDate": "2023-08-29" }, - "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getMetadata() method of the RTCEncodedVideoFrame interface returns an object containing the metadata associated with the frame.\n

    This includes information about the frame, including its size, video encoding, other frames needed to construct a full image, timestamp, and other information.", - "returns": "An object with the following properties:\n

    \n
    frameId
    \n
    \n

    A positive integer value indicating the id of this frame.\n

    \n
    dependencies
    \n
    \n

    An Array of positive integers indicating the frameIds of frames on which this frame depends.\nFor a key frame this will be empty, as a key frame contains all the information it needs to construct the image.\nFor a delta frame this will list all the frames needed to render this frame.\nThe type of frame can be determined using RTCEncodedVideoFrame.type.\n

    \n
    width
    \n
    \n

    A positive integer indicating the width of the frame.\nThe maximum value is 65535.\n

    \n
    height
    \n
    \n

    A positive integer indicating the height of the frame.\nThe maximum value is 65535.\n

    \n
    spatialIndex
    \n
    \n

    A positive integer indicating the spatial index of the frame.\nSome codecs allow generation of layers of frames with different layers of resolutions.\nFrames in higher layers can be selectively dropped in order to reduce bit rate when needed, while maintaining acceptable video quality.\n

    \n
    temporalIndex
    \n
    \n

    A positive integer indicating the temporal index of the frame.\nSome codecs group frames in layers, based on whether dropping the a frame will prevent others from being decoded.\nFrames in higher layers can be selectively dropped in order to reduce bit rate when needed, while maintaining acceptable video quality.\n

    \n
    synchronizationSource
    \n
    \n

    A positive integer value indicating synchronization source (\"ssrc\") of the stream of RTP packets that are described by this encoded video frame.\nA source might be something like a camera or microphone, or some kind of mixer app that combines multiple sources.\nAll packets from the same source share the same time source and sequence space, and so can be ordered relative to each other.\nNote two frames with the same value refer to the same source (for more information see RTCInboundRtpStreamStats.ssrc).\n

    \n
    payloadType
    \n
    \n

    A positive integer value in the range from 0 to 127 that describes the format of the RTP payload.\nThe mappings of values to formats is defined in RFC3550.\n

    \n
    contributingSources
    \n
    \n

    An Array of sources (ssrc) that have contributed to the frame.\nConsider the case of a conferencing application that combines the audio and video from multiple users.\nThe synchronizationSource would include the ssrc of the application, while contributingSources would include the ssrc values of all the individual video and audio sources.\n

    \n
    timestamp
    \n
    \n

    The media presentation timestamp (PTS) in microseconds of raw frame, matching the timestamp for raw frames which correspond to this frame.\nThis is used to synchronize separate video, audio, subtitle and other streams belonging to the same presentation.\n

    \n
    " + "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getMetadata() method of the RTCEncodedVideoFrame interface returns an object containing the metadata associated with the frame.\n

    This includes information about the frame, such as its size, video encoding, other frames needed to construct a full image, timestamp, and other information.", + "returns": "An object with the following properties:\n

    \n
    contributingSources
    \n
    \n

    An Array of sources (ssrc) that have contributed to the frame.\nConsider the case of a conferencing application that combines the audio and video from multiple users.\nThe synchronizationSource would include the ssrc of the application, while contributingSources would include the ssrc values of all the individual video and audio sources.\n

    \n
    dependencies
    \n
    \n

    An Array of positive integers indicating the frameIds of frames on which this frame depends.\nFor a key frame this will be empty, as a key frame contains all the information it needs to construct the image.\nFor a delta frame this will list all the frames needed to render this frame.\nThe type of frame can be determined using RTCEncodedVideoFrame.type.\n

    \n
    frameId
    \n
    \n

    A positive integer value indicating the id of this frame.\n

    \n
    height
    \n
    \n

    A positive integer indicating the height of the frame.\nThe maximum value is 65535.\n

    \n
    mimeType
    \n
    \n

    A string containing the MIME type of the codec used, such as \"video/VP8\".\n

    \n
    payloadType
    \n
    \n

    A positive integer value in the range from 0 to 127 that describes the format of the RTP payload.\nThe mappings of values to formats is defined in RFC3550.\n

    \n
    receiveTime
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp of the last received packet of an incoming frame (from an RTCRtpReceiver) used to produce this media frame, relative to Performance.timeOrigin.\n

    \n
    rtpTimestamp
    \n
    \n

    A positive integer that reflects the sampling instant of the first octet in the RTP data packet (see RFC 3550).\n

    \n
    spatialIndex
    \n
    \n

    A positive integer indicating the spatial index of the frame.\nSome codecs allow generation of layers of frames with different layers of resolutions.\nFrames in higher layers can be selectively dropped in order to reduce bit rate when needed, while maintaining acceptable video quality.\n

    \n
    synchronizationSource
    \n
    \n

    A positive integer value indicating synchronization source (\"ssrc\") of the stream of RTP packets that are described by this encoded video frame.\nA source might be something like a camera or microphone, or some kind of mixer app that combines multiple sources.\nAll packets from the same source share the same time source and sequence space, and so can be ordered relative to each other.\nNote two frames with the same value refer to the same source (for more information see RTCInboundRtpStreamStats.ssrc).\n

    \n
    temporalIndex
    \n
    \n

    A positive integer indicating the temporal index of the frame.\nSome codecs group frames in layers, based on whether dropping the a frame will prevent others from being decoded.\nFrames in higher layers can be selectively dropped in order to reduce bit rate when needed, while maintaining acceptable video quality.\n

    \n
    width
    \n
    \n

    A positive integer indicating the width of the frame.\nThe maximum value is 65535.\n

    \n
    " + }, + "rtcencodedvideoframe.rtcencodedvideoframe": { + "url": "$MDN_URL$/web/api/rtcencodedvideoframe/rtcencodedvideoframe", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "127", + "ChromeAndroid": "127", + "Edge": "127", + "Firefox": "145", + "FirefoxAndroid": "145", + "Opera": "113", + "Safari": "26", + "SafariIOS": "26" + }, + "baseline": { + "level": "LOW", + "lowDate": "2025-11-11" + }, + "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The RTCEncodedVideoFrame() constructor creates a new and fully independent RTCEncodedVideoFrame object.\n

    The new object is a deep clone of the original object data and metadata, with any metadata specified in the options parameter overwriting the copied values.", + "parameters": { + "originalFrame": "The frame to be copied.", + "options": "This is an object with the following property:\n

    \n
    metadata Optional
    \n
    \n

    An object setting the frame metadata.\nThis is an object with the same properties as the object returned by RTCEncodedVideoFrame.getMetadata().\n

    \n
    " + } }, "rtcencodedvideoframe.timestamp": { "url": "$MDN_URL$/web/api/rtcencodedvideoframe/timestamp", @@ -6826,8 +6910,9 @@ "SafariIOS": "11" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The connectionState read-only property of the RTCPeerConnection interface indicates the current state of the peer connection by returning one of the following string values: new, connecting, connected, disconnected, failed, or closed.\n

    This state essentially represents the aggregate state of all ICE transports (which are of type RTCIceTransport or RTCDtlsTransport) being used by the connection.\n

    When this property's value changes, a connectionstatechange event is sent to the RTCPeerConnection instance." }, @@ -7403,8 +7488,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The sctp read-only property of the RTCPeerConnection interface returns an RTCSctpTransport describing the SCTP transport over which SCTP data is being sent and received.\nIf SCTP hasn't been negotiated, this value is null.\n

    The SCTP transport is used for transmitting and receiving data for any and all RTCDataChannels on the peer connection." }, @@ -7655,48 +7741,54 @@ "rtcpeerconnectionstats": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The RTCPeerConnectionStats dictionary of the WebRTC API provides information about the high level peer connection (RTCPeerConnection).\n

    In particular, it provides the number of unique data channels that have been opened, and the number of opened channels that have been closed.\nThis allows the current number of open channels to be calculated.\n

    These statistics can be obtained by iterating the RTCStatsReport returned by RTCPeerConnection.getStats() until you find a report with the type of peer-connection." }, "rtcpeerconnectionstats.datachannelsclosed": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats/datachannelsclosed", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The dataChannelsClosed property of the RTCPeerConnectionStats dictionary indicates the number of unique RTCDataChannel objects that have left the open state during their lifetime.\n

    A channel will leave the open state if either end of the connection or the underlying transport is closed.\nNote that channels that transition to closing or closed without ever being open are not counted in this number." }, "rtcpeerconnectionstats.datachannelsopened": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats/datachannelsopened", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The dataChannelsOpened property of the RTCPeerConnectionStats dictionary indicates the number of unique RTCDataChannel objects that have entered the open state during their lifetime." }, "rtcpeerconnectionstats.id": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats/id", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The id property of the RTCPeerConnectionStats dictionary is a string which uniquely identifies the object for which this object provides statistics.\n

    Using the id, you can correlate this statistics object with others, in order to monitor statistics over time for a given WebRTC object, such as an RTCPeerConnection, or an RTCDataChannel." }, "rtcpeerconnectionstats.timestamp": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats/timestamp", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The timestamp property of the RTCPeerConnectionStats dictionary is a DOMHighResTimeStamp object specifying the time at which the data in the object was sampled." }, "rtcpeerconnectionstats.type": { "url": "$MDN_URL$/web/api/rtcpeerconnectionstats/type", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The type property of the RTCPeerConnectionStats dictionary is a string with the value \"peer-connection\".\n

    Different statistics are obtained by iterating the RTCStatsReport object returned by a call to RTCPeerConnection.getStats().\nThe type indicates the set of statistics available through the object in a particular iteration step.\nA value of \"peer-connection\" indicates that the statistics available in the current step are those defined in RTCPeerConnectionStats." }, @@ -7960,8 +8052,9 @@ "SafariIOS": "12.2" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The static method RTCRtpReceiver.getCapabilities() returns an object describing the codec and header extension capabilities supported by RTCRtpReceiver objects on the current device.\n

    You can, similarly, obtain the capabilities of RTCRtpSender objects by calling the static function RTCRtpSender.getCapabilities().", "parameters": { @@ -8114,6 +8207,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8156,6 +8250,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8176,6 +8271,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8204,6 +8300,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8249,6 +8346,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8269,6 +8367,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8289,6 +8388,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8313,6 +8413,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8382,8 +8483,9 @@ "SafariIOS": "12.2" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The static method RTCRtpSender.getCapabilities() returns an object describing the codec and header extension capabilities supported by the RTCRtpSender.\n

    You can, similarly, obtain the capabilities of RTCRtpReceiver objects on the device by calling the static function RTCRtpReceiver.getCapabilities().", "parameters": { @@ -8516,8 +8618,9 @@ "SafariIOS": "14.5" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The RTCRtpSender method setStreams() associates the sender's track with the specified MediaStream objects.", "parameters": { @@ -8561,6 +8664,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -8817,8 +8921,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The RTCSctpTransport interface provides information which describes a Stream Control Transmission Protocol (SCTP) transport. This provides information about limitations of the transport, but also provides a way to access the underlying Datagram Transport Layer Security (DTLS) transport over which SCTP packets for all of an RTCPeerConnection's data channels are sent and received.\n

    You don't create RTCSctpTransport objects yourself; instead, you get access to the RTCSctpTransport for a given RTCPeerConnection through its sctp property.\n

    Possibly the most useful property on this interface is its maxMessageSize property, which you can use to determine the upper limit on the size of messages you can send over a data channel on the peer connection." }, @@ -8838,8 +8943,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The maxChannels read-only property of the RTCSctpTransport interface indicates the maximum number of RTCDataChannel objects that can be opened simultaneously." }, @@ -8859,8 +8965,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The maxMessageSize read-only property of the RTCSctpTransport interface indicates the maximum size of a message that can be sent using the RTCDataChannel.send() method." }, @@ -8880,8 +8987,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The state read-only property of the RTCSctpTransport interface provides information which describes a Stream Control Transmission Protocol (SCTP) transport state." }, @@ -8901,8 +9009,9 @@ "SafariIOS": "15.4" }, "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The transport read-only property of the RTCSctpTransport interface returns a RTCDtlsTransport object representing the DTLS transport used for the transmission and receipt of data packets." }, @@ -9376,6 +9485,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -9396,6 +9506,7 @@ "Edge": "141", "Firefox": "117", "FirefoxAndroid": "117", + "Opera": "125", "Safari": "15.4", "SafariIOS": "15.4" }, @@ -9548,8 +9659,9 @@ "rtcvideosourcestats": { "url": "$MDN_URL$/web/api/rtcvideosourcestats", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The RTCVideoSourceStats dictionary of the WebRTC API provides statistics information about a video track (MediaStreamTrack) that is attached to one or more senders (RTCRtpSender).\n

    These statistics can be obtained by iterating the RTCStatsReport returned by RTCRtpSender.getStats() or RTCPeerConnection.getStats() until you find a report with the type of media-source and a kind of video.\n

    \n

    Note:\nFor video information about remotely sourced tracks (that are being received), see RTCInboundRtpStreamStats.\n

    " }, @@ -9577,40 +9689,45 @@ "rtcvideosourcestats.id": { "url": "$MDN_URL$/web/api/rtcvideosourcestats/id", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The id property of the RTCVideoSourceStats dictionary is a string which uniquely identifies the object for which this object provides statistics.\n

    Using the id, you can correlate this statistics object with others, in order to monitor statistics over time for a given WebRTC object, such as an RTCPeerConnection, or an RTCDataChannel." }, "rtcvideosourcestats.kind": { "url": "$MDN_URL$/web/api/rtcvideosourcestats/kind", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The kind property of the RTCVideoSourceStats dictionary is a string with the value video.\n

    The kind is used to differentiate between audio and video media sources when iterating an RTCStatsReport, which both have a type of media-source (a kind of audio indicates an RTCAudioSourceStats object)." }, "rtcvideosourcestats.timestamp": { "url": "$MDN_URL$/web/api/rtcvideosourcestats/timestamp", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The timestamp property of the RTCVideoSourceStats dictionary is a DOMHighResTimeStamp object specifying the time at which the data in the object was sampled.\n

    The time is given in milliseconds elapsed since the first moment of January 1, 1970, UTC (also known as Unix time)." }, "rtcvideosourcestats.trackidentifier": { "url": "$MDN_URL$/web/api/rtcvideosourcestats/trackidentifier", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The trackIdentifier property of the RTCVideoSourceStats dictionary contains the id attribute of the associated MediaStreamTrack." }, "rtcvideosourcestats.type": { "url": "$MDN_URL$/web/api/rtcvideosourcestats/type", "baseline": { - "level": "LOW", - "lowDate": "2023-05-09" + "level": "HIGH", + "lowDate": "2023-05-09", + "highDate": "2025-11-09" }, "doc": "The type property of the RTCVideoSourceStats dictionary is a string with value media-source.\n

    The type of media-source identifies the type of statistics as either RTCAudioSourceStats or RTCVideoSourceStats when iterating the RTCStatsReport returned by RTCRtpSender.getStats() or RTCPeerConnection.getStats().\nThe type of stats can further be differentiated using the kind, which will be video for RTCVideoSourceStats." }, @@ -9624,174 +9741,229 @@ "sanitizer": { "url": "$MDN_URL$/web/api/Sanitizer", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Sanitizer interface of the HTML Sanitizer API defines a configuration object that specifies what elements, attributes and comments are allowed or should be removed when inserting strings of HTML into an Element or ShadowRoot, or when parsing an HTML string into a Document.\n

    A Sanitizer instance is effectively a wrapper around a SanitizerConfig, and can be passed as a configuration alternative in the same sanitization methods:\n

    \n

    Note that Sanitizer is expected to be more efficient to reuse and modify when needed." + "doc": "The Sanitizer interface of the HTML Sanitizer API defines a configuration object that specifies what elements, attributes and comments are allowed or should be removed when inserting strings of HTML into an Element or ShadowRoot, or when parsing an HTML string into a Document.\n

    A Sanitizer instance is effectively a wrapper around a SanitizerConfig, and can be passed as a configuration alternative in the same sanitization methods:\n

    \n

    Note that Sanitizer is expected to be more efficient to reuse and modify when needed." }, "sanitizer.allowattribute": { "url": "$MDN_URL$/web/api/sanitizer/allowattribute", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The allowAttribute() method of the Sanitizer interface sets an attribute to be allowed on all elements.\n

    The specified attribute is added to the list of attributes in this sanitizer's configuration.\nThe attribute is removed from the removeAttributes list if present.\n

    Note that to allow/disallow attributes only on specific elements use Sanitizer.allowElement().", + "doc": "The allowAttribute() method of the Sanitizer interface sets an attribute to be allowed on all elements when the sanitizer is used.\n

    The method can be used with either an allow configuration or a remove configuration.\nIf used with an allow configuration, the specified attribute is added to the attributes array.\nIf used with a remove configuration, the attribute is removed from the removeAttributes array (if present).\n

    Note that to allow/disallow attributes only on specific elements use Sanitizer.allowElement().", "parameters": { "attribute": "A string indicating the name of the attribute to be allowed globally on elements, or an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    " }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration to allow the attribute, and false if the configuration already allowed the attribute.\n

    Note that false might be returned if the internal configuration:\n

    " }, "sanitizer.allowelement": { "url": "$MDN_URL$/web/api/sanitizer/allowelement", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The allowElement() method of the Sanitizer interface sets that the specified element is allowed in the output when the sanitizer is used.\nThe element can be specified with lists of attributes that are allowed or disallowed on elements of that type.\n

    The specified element is added to the elements list in this sanitizer's configuration.\nIf the element is already present in the list, then the existing entry is first removed and the new definition is appended to the end of the list.\nNote that if you need both per-element add-attribute and remove-attribute lists, they must be added in a single call to this method (since if done in two calls, the second call will replace the element definition added in the first call).\n

    The specified element is removed from the sanitizer configuration removeElements or replaceWithChildrenElements lists if present.", + "doc": "The allowElement() method of the Sanitizer interface sets that the specified element is allowed in the output when the sanitizer is used.\n

    It can also be used to specify per-element attribute allow or remove arrays on Sanitizer instances with an allow configuration.", "parameters": { - "element": "A string indicating the name of the allowed element, or an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the element.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the element.\nThe default namespace is \"http://www.w3.org/1999/xhtml\".\n

    \n
    attributes Optional
    \n
    \n

    An array indicating the attributes to allow on this (allowed) element when sanitizing HTML.\n

    Each attribute can be specified by name (a string), or as a object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    \n
    \n
    removeAttributes Optional
    \n
    \n

    An array indicating the attributes to remove on this (allowed) element when sanitizing HTML.\n

    Each attribute can be specified by name (a string), or as a object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    \n
    \n
    " + "element": "A string indicating the name of the allowed element, or an object with the following properties:\n
    \n
    name
    \n
    \n

    A string containing the name of the element.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the element.\nThe default namespace is \"http://www.w3.org/1999/xhtml\".\n

    \n
    attributes Optional
    \n
    \n

    An array indicating the attributes to allow on this (allowed) element when sanitizing HTML.\n

    Each attribute can be specified by name (a string), or as an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    \n
    \n
    removeAttributes Optional
    \n
    \n

    An array indicating the attributes to remove on this (allowed) element when sanitizing HTML.\n

    Each attribute can be specified by name (a string), or as an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    \n
    \n
    " }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration to allow the element, and false if the configuration was not changed (usually because the element was already allowed, but potentially because the change could not be made).\n

    Note that false might be returned if the internal configuration:\n

    " }, "sanitizer.get": { "url": "$MDN_URL$/web/api/sanitizer/get", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The get() method of the Sanitizer interface returns a SanitizerConfig dictionary instance that represents the current Sanitizer configuration.\n

    This may be used to create a sanitizer that is slightly modified from the default; by first getting and then modifying the default sanitizer configuration, and then using it to construct a new sanitizer.\n

    The returned configuration can also be used to inspect the configuration, and can be passed directly the HTML parsing functions.\nNote however that it will be more efficient to pass a Sanitizer rather than a configuration dictionary, particularly where the Sanitizer is to be used multiple times.", + "doc": "The get() method of the Sanitizer interface returns a SanitizerConfig dictionary instance that represents the current Sanitizer configuration.\n

    This may be used to create a sanitizer that is slightly modified from the default; by first getting and then modifying the default sanitizer configuration, and then using it to construct a new sanitizer.\n

    The returned configuration can also be used to inspect the configuration, and can be passed directly the HTML parsing functions.\nNote however that it will be more efficient to pass a Sanitizer rather than a configuration dictionary, particularly where the Sanitizer is to be used multiple times.", "returns": "A SanitizerConfig." }, "sanitizer.removeattribute": { "url": "$MDN_URL$/web/api/sanitizer/removeattribute", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The removeAttribute() method of the Sanitizer interface sets an attribute to be disallowed on all elements.\n

    The specified attribute is added to the list of removeAttributes in this sanitizer's configuration.\nThe attribute is removed from the attributes list if present.\n

    Note that to allow/disallow attributes only on specific elements use Sanitizer.allowElement().", + "doc": "The removeAttribute() method of the Sanitizer interface sets an attribute to be removed from all elements when the sanitizer is used.\n

    The method can be used with either an allow configuration or a remove configuration.\nIf used with a remove configuration, the specified attribute is added to the removeAttributes array.\nIf used with an allow configuration, the attribute is removed from the attributes array (if present).\n

    Note that to allow/disallow attributes only on specific elements use Sanitizer.allowElement().", "parameters": { "attribute": "A string indicating the name of the attribute to be disallowed globally on elements, or an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the attribute.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the attribute, which defaults to null.\n

    \n
    " }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration to disallow the attribute, and false if the attribute was already disallowed.\n

    Note that false might be returned if the internal configuration:\n

    " }, "sanitizer.removeelement": { "url": "$MDN_URL$/web/api/sanitizer/removeelement", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The removeElement() method of the Sanitizer interface sets an element to be disallowed — removed from input when the sanitizer is used.\n

    The specified element is added to the list of removeElements in this sanitizer's configuration.\nThe element is removed from the elements or replaceWithChildrenElements lists if present.", + "doc": "The removeElement() method of the Sanitizer interface sets the specified element be removed from the output when the sanitizer is used.\n

    The method can be used with either an allow configuration or a remove configuration.\nIf used with a remove configuration, the specified element is added to the removeElements array.\nIf used with an allow configuration, the element is removed from the elements array (if present).", "parameters": { "element": "A string indicating the name of the element to be disallowed, or an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the element.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the element.\nThe default namespace is \"http://www.w3.org/1999/xhtml\".\n

    \n
    " }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration to disallow the element, and false if the element was already disallowed.\n

    Note that false might be returned if the internal configuration:\n

    " }, "sanitizer.removeunsafe": { "url": "$MDN_URL$/web/api/sanitizer/removeunsafe", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The removeUnsafe() method of the Sanitizer interface configures the sanitizer configuration so that it will remove all elements, attributes, and event handler content attributes that are considered XSS-unsafe by the browser.\n

    The unsafe elements and attributes are added to the configuration by calling Sanitizer.removeElement() and Sanitizer.removeAttribute() for each, respectively.\nThis adds them to the sanitizer configuration disallow lists: removeElements and removeAttributes, and removes them (if present) from the configuration allow lists: elements, replaceWithChildrenElements and attributes.\n

    The method can be called to make any custom configuration XSS-safe.\nIf used with a configuration that uses the allow lists, it will remove the XSS-unsafe entities from those lists.\nIf used with a configuration that uses only the disallow (\"remove\") lists, then it ensures the configuration includes the unsafe elements in those lists.\n

    Note that if you're using the sanitizer with one of the \"safe\" HTML setters, such as Element.setHTML() and ShadowRoot.setHTML(), you do not need to call this method to make the sanitizer safe.\nWhen used in these setters the method is called implicitly, without modifying the Sanitizer instance that is passed.", - "returns": "None (undefined)." + "doc": "The removeUnsafe() method of the Sanitizer interface configures the sanitizer configuration so that it will remove all elements, attributes, and event handler content attributes that are considered XSS-unsafe by the browser.\n

    The method can be called to make any custom configuration XSS-safe.\nNote that if you're using the sanitizer with one of the \"safe\" HTML setters, such as Element.setHTML() and ShadowRoot.setHTML(), you do not need to call this method to make the sanitizer safe.\nWhen used in these setters the method is called implicitly, without modifying the Sanitizer instance that is passed.", + "returns": "true if the operation removed any elements, attributes, or event handler content attributes that are considered XSS-unsafe, and false if no elements or attributes were removed." }, "sanitizer.replaceelementwithchildren": { "url": "$MDN_URL$/web/api/sanitizer/replaceelementwithchildren", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The replaceElementWithChildren() method of the Sanitizer interface sets an element to be replaced by its child HTML elements when the sanitizer is used.\nThe is primarily used for stripping styles from text.\n

    The specified element, along with its namespace, is added to the list of replaceWithChildrenElements in this sanitizer's configuration.\nThe element is removed from the elements or removeElements lists if present.", + "doc": "The replaceElementWithChildren() method of the Sanitizer interface sets an element to be replaced by its child HTML elements when the sanitizer is used.\nThis is primarily used for stripping styles from text.", "parameters": { "element": "A string indicating the name of the element to be replaced, or an object with the following properties:\n

    \n
    name
    \n
    \n

    A string containing the name of the element.\n

    \n
    namespace Optional
    \n
    \n

    A string containing the namespace of the element.\nThe default namespace is \"http://www.w3.org/1999/xhtml\".\n

    \n
    " }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration to set the element to be replaced by its children, and false if the sanitizer was already replacing the element." }, "sanitizer.sanitizer": { "url": "$MDN_URL$/web/api/Sanitizer/Sanitizer", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Sanitizer() constructor creates a new Sanitizer object, which can be used to filter unwanted elements and attributes from HTML or documents before they are inserted/parsed into the DOM.\n

    The default Sanitizer() configuration allows only XSS-safe input by default, omitting elements such as <script>, <frame>, <iframe>, <object>, <use>, and event handler attributes from their respective allow lists, and disallowing data attributes, and comments.\n

    The constructor configuration option can be used to customize the sanitizer behavior.", + "doc": "The Sanitizer() constructor creates a new Sanitizer object, which can be used to filter unwanted elements and attributes from HTML or documents before they are inserted/parsed into the DOM.", "parameters": { - "configuration": "A SanitizerConfig defining a sanitizer configuration, or the string \"default\" to indicate the default configuration." + "configuration": "A SanitizerConfig defining a valid configuration, or the string \"default\" to indicate the default configuration." }, "throws": { - "TypeError": "Thrown if a non-normalized SanitizerConfig is passed (one that includes both \"allowed\" and \"removed\" configuration settings), or if a string is passed that isn't \"default\"." + "TypeError": "The configuration parameter is passed one of the following:\n

    " } }, "sanitizer.setcomments": { "url": "$MDN_URL$/web/api/sanitizer/setcomments", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The setComments() method of the Sanitizer interface sets whether comments will be allowed or removed by the sanitizer.\n

    The method sets the comments property in this sanitizer's configuration.", + "doc": "The setComments() method of the Sanitizer interface sets whether comments will be allowed or removed by the sanitizer.", "parameters": { "allow": "true if comments are allowed, and false if they are to be removed." }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration, and false if the configuration already set comments to the specified value." }, "sanitizer.setdataattributes": { "url": "$MDN_URL$/web/api/sanitizer/setdataattributes", "status": [ - "Experimental", "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "145", + "ChromeAndroid": "145", + "Edge": "145", + "Firefox": "148", + "FirefoxAndroid": "148" + }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The setDataAttributes() method of the Sanitizer interface sets whether data attributes will be allowed or removed by the sanitizer.\n

    The method sets the dataAttributes property in this sanitizer's configuration.", + "doc": "The setDataAttributes() method of the Sanitizer interface sets whether all data-* attributes will be allowed by the sanitizer, or if they must be individually specified.\n

    If this is set true, then data attributes are automatically allowed and you should not add them individually using Sanitizer.allowAttribute() (or Sanitizer.allowElement() for local attributes).\n

    Note that this method is useful for allow configurations which have a lot of data-* attributes that you want to allow.\nThe method returns false when used with remove configurations, which can allow all data-* attributes simply by omitting them.", "parameters": { - "allow": "true if data attributes are allowed, and false if they are to be removed." + "allow": "true if all data-* attributes are allowed, and false if they must be explicitly specified." }, - "returns": "None (undefined)." + "returns": "true if the operation changed the configuration, and false if the configuration already set dataAttributes to the specified value or dataAttributes cannot be set true because this sanitizer has a remove configuration." }, "sanitizerconfig": { "url": "$MDN_URL$/web/api/sanitizerconfig", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SanitizerConfig dictionary of the HTML Sanitizer API represents a sanitizer configuration object.\nThe configuration specifies what elements, attributes and comments are allowed or should be removed when inserting strings of HTML into an Element or ShadowRoot, or when parsing an HTML string into a Document.\n

    An instance of this type can be passed to the Sanitizer() constructor to configure a Sanitizer, and is returned by Sanitizer.get().\nIt can also be passed as the option.sanitizer parameter when calling the sanitization methods:\n

    \n

    Note that normally a Sanitizer instance would be passed as the option instead of SanitizerConfig in the above methods, in particular because sanitizer instances are more efficient to share and modify." + "doc": "The SanitizerConfig dictionary of the HTML Sanitizer API specifies what elements, attributes and comments are allowed or should be removed when inserting strings of HTML into an Element or ShadowRoot, or when parsing an HTML string into a Document.\n

    Note that normally Sanitizer instances are used instead of SanitizerConfig objects, as they are more efficient to share and modify." }, "scheduler": { "url": "$MDN_URL$/web/api/window/scheduler", @@ -9829,7 +10001,7 @@ }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The postTask() method of the Scheduler interface is used for adding tasks to be scheduled according to their priority.\n

    The method allows users to optionally specify a minimum delay before the task will run, a priority for the task, and a signal that can be used to modify the task priority and/or abort the task.\nIt returns a promise that is resolved with the result of the task callback function, or rejected with the abort reason or an error thrown in the task.\n

    Task priority can be mutable or immutable.\nIf the task priority will never need to change then it should be set using the options.priority parameter (any priority set through a signal will then be ignored).\nYou can still pass an AbortSignal (which has no priority) or TaskSignal to the options.signal parameter for aborting the task.\n

    If the task priority might need to be changed the options.priority parameter must not be set.\nInstead a TaskController should be created and its TaskSignal should be passed to options.signal.\nThe task priority will be initialized from the signal priority, and can later be modified using the signal's associated TaskController.\n

    If no priority is set then the task priority defaults to \"user-visible\".\n

    If a delay is specified and greater than 0, then the execution of the task will be delayed for at least that many milliseconds.\nOtherwise the task is immediately scheduled for prioritization.", "parameters": { - "callback": "An callback function that implements the task.\nThe return value of the callback is used to resolve the promise returned by this function.", + "callback": "A callback function that implements the task.\nThe return value of the callback is used to resolve the promise returned by this function.", "options": "Task options, including:\n

    \n
    priority Optional
    \n
    \n

    The immutable priority of the task.\nOne of: \"user-blocking\", \"user-visible\", \"background\".\nIf set, this priority is used for the lifetime of the task and priority set on the signal is ignored.\n

    \n
    signal Optional
    \n
    \n

    A TaskSignal or AbortSignal that can be used to abort the task (from its associated controller).\n

    If the options.priority parameter is set then the task priority cannot be changed, and any priority on the signal is ignored.\nOtherwise, if the signal is a TaskSignal its priority is used to set the initial task priority, and the signal's controller may later use it to change the task priority.\n

    \n
    delay Optional
    \n
    \n

    The minimum amount of time after which the task will be added to the scheduler queue, in whole milliseconds.\nThe actual delay may be higher than specified, but will not be less.\nThe default delay is 0.\n

    \n
    " }, "returns": "Returns a Promise that is resolved with the return value of the callback function, or which may be rejected with the signal's abort reason (AbortSignal.reason).\nThe promise may also be rejected with an error thrown by the callback during execution." @@ -9943,7 +10115,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availLeft read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.left property, plus the width of any OS UI element drawn on the left of the screen. Windows cannot be placed in those areas, so availLeft is useful for giving you the left boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availLeft property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availLeft read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.left property, plus the width of any OS UI element drawn on the left of the screen. Windows cannot be placed in those areas, so availLeft is useful for giving you the left boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availLeft property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screen.availtop": { "url": "$MDN_URL$/web/api/screendetailed/availtop", @@ -9959,7 +10131,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availTop read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.top property, plus the height of any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas, so availTop is useful for giving you the top boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availTop property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availTop read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.top property, plus the height of any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas, so availTop is useful for giving you the top boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availTop property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screen.availwidth": { "url": "$MDN_URL$/web/api/screen/availwidth", @@ -10042,7 +10214,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isExtended read-only property of the\nScreen interface returns true if the user's device has multiple screens, and false if not.\n

    This property is typically accessed via window.screen.isExtended, and can be used to test whether multiple screens are available before attempting to create a multi-window, multi-screen layout using the Window Management API." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isExtended read-only property of the\nScreen interface returns true if the user's device has multiple screens, and false if not.\n

    This property is typically accessed via window.screen.isExtended, and can be used to test whether multiple screens are available before attempting to create a multi-window, multi-screen layout using the Window Management API." }, "screen.left": { "url": "$MDN_URL$/web/api/screendetailed/left", @@ -10058,7 +10230,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The left read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true left-hand edge, ignoring any OS UI element drawn at the left of the screen. Windows cannot be placed in those areas; to get the left-hand coordinate of the screen area that windows can be placed in, use ScreenDetailed.availLeft.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the left property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The left read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true left-hand edge, ignoring any OS UI element drawn at the left of the screen. Windows cannot be placed in those areas; to get the left-hand coordinate of the screen area that windows can be placed in, use ScreenDetailed.availLeft.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the left property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screen.lockorientation": { "url": "$MDN_URL$/web/api/screen/lockorientation", @@ -10147,7 +10319,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The top read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true top edge, ignoring any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas; to get the top coordinate of the screen area that windows can be placed in, use ScreenDetailed.availTop.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the top property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The top read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true top edge, ignoring any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas; to get the top coordinate of the screen area that windows can be placed in, use ScreenDetailed.availTop.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the top property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screen.unlockorientation": { "url": "$MDN_URL$/web/api/screen/unlockorientation", @@ -10195,7 +10367,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ScreenDetailed interface of the Window Management API represents detailed information about one specific screen available to the user's device.\n

    ScreenDetailed objects can be accessed via the ScreenDetails.screens and ScreenDetails.currentScreen properties." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ScreenDetailed interface of the Window Management API represents detailed information about one specific screen available to the user's device.\n

    ScreenDetailed objects can be accessed via the ScreenDetails.screens and ScreenDetails.currentScreen properties." }, "screendetailed.availleft": { "url": "$MDN_URL$/web/api/screendetailed/availleft", @@ -10211,7 +10383,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availLeft read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.left property, plus the width of any OS UI element drawn on the left of the screen. Windows cannot be placed in those areas, so availLeft is useful for giving you the left boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availLeft property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availLeft read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.left property, plus the width of any OS UI element drawn on the left of the screen. Windows cannot be placed in those areas, so availLeft is useful for giving you the left boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availLeft property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screendetailed.availtop": { "url": "$MDN_URL$/web/api/screendetailed/availtop", @@ -10227,7 +10399,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availTop read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.top property, plus the height of any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas, so availTop is useful for giving you the top boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availTop property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availTop read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the available screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the ScreenDetailed.top property, plus the height of any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas, so availTop is useful for giving you the top boundary of the actual area available to open or place windows.\n

    \n

    Note:\nA non-standard implementation of the availTop property is available on the Screen interface in all browsers. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screendetailed.devicepixelratio": { "url": "$MDN_URL$/web/api/screendetailed/devicepixelratio", @@ -10243,7 +10415,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The devicePixelRatio read-only property of the\nScreenDetailed interface is a number representing the screen's device pixel ratio.\n

    This is the same as the value returned by Window.devicePixelRatio, except that Window.devicePixelRatio:\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The devicePixelRatio read-only property of the\nScreenDetailed interface is a number representing the screen's device pixel ratio.\n

    This is the same as the value returned by Window.devicePixelRatio, except that Window.devicePixelRatio:\n

    " }, "screendetailed.isinternal": { "url": "$MDN_URL$/web/api/screendetailed/isinternal", @@ -10259,7 +10431,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isInternal read-only property of the\nScreenDetailed interface is a boolean indicating whether the screen is internal to the device or external. External devices are generally manufactured separately from the device they are attached to and can be connected and disconnected as needed, whereas internal screens are part of the device and not intended to be disconnected." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isInternal read-only property of the\nScreenDetailed interface is a boolean indicating whether the screen is internal to the device or external. External devices are generally manufactured separately from the device they are attached to and can be connected and disconnected as needed, whereas internal screens are part of the device and not intended to be disconnected." }, "screendetailed.isprimary": { "url": "$MDN_URL$/web/api/screendetailed/isprimary", @@ -10275,7 +10447,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isPrimary read-only property of the\nScreenDetailed interface is a boolean indicating whether the screen is set as the operating system (OS) primary screen or not.\n

    The OS hosting the browser will have one primary screen, and one or more secondary screens. The primary screen can usually be specified by the user via OS settings, and generally contains OS UI features such as the taskbar/icon dock. The primary screen may change for a number of reasons, such as a screen being unplugged." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The isPrimary read-only property of the\nScreenDetailed interface is a boolean indicating whether the screen is set as the operating system (OS) primary screen or not.\n

    The OS hosting the browser will have one primary screen, and one or more secondary screens. The primary screen can usually be specified by the user via OS settings, and generally contains OS UI features such as the taskbar/icon dock. The primary screen may change for a number of reasons, such as a screen being unplugged." }, "screendetailed.label": { "url": "$MDN_URL$/web/api/screendetailed/label", @@ -10291,7 +10463,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The label read-only property of the\nScreenDetailed interface is a string providing a descriptive label for the screen, for example \"Built-in Retina Display\".\n

    This is useful for constructing a list of options to display to the user if you want them to choose a screen to display content on." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The label read-only property of the\nScreenDetailed interface is a string providing a descriptive label for the screen, for example \"Built-in Retina Display\".\n

    This is useful for constructing a list of options to display to the user if you want them to choose a screen to display content on." }, "screendetailed.left": { "url": "$MDN_URL$/web/api/screendetailed/left", @@ -10307,7 +10479,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The left read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true left-hand edge, ignoring any OS UI element drawn at the left of the screen. Windows cannot be placed in those areas; to get the left-hand coordinate of the screen area that windows can be placed in, use ScreenDetailed.availLeft.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the left property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The left read-only property of the\nScreenDetailed interface is a number representing the x-coordinate (left-hand edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true left-hand edge, ignoring any OS UI element drawn at the left of the screen. Windows cannot be placed in those areas; to get the left-hand coordinate of the screen area that windows can be placed in, use ScreenDetailed.availLeft.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the left property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screendetailed.top": { "url": "$MDN_URL$/web/api/screendetailed/top", @@ -10323,7 +10495,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The top read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true top edge, ignoring any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas; to get the top coordinate of the screen area that windows can be placed in, use ScreenDetailed.availTop.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the top property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The top read-only property of the\nScreenDetailed interface is a number representing the y-coordinate (top edge) of the total screen area inside the OS virtual screen arrangement, relative to the multi-screen origin.\n

    This is equal to the true top edge, ignoring any OS UI element drawn at the top of the screen. Windows cannot be placed in those areas; to get the top coordinate of the screen area that windows can be placed in, use ScreenDetailed.availTop.\n

    \n

    Note:\nIn Firefox, a non-standard implementation of the top property is available on the Screen interface. See the Non-standard example below for usage details, and see the Screen reference page for browser support information relating to the non-standard implementation.\n

    " }, "screendetails": { "url": "$MDN_URL$/web/api/screendetails", @@ -10339,7 +10511,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ScreenDetails interface of the Window Management API represents the details of all the screens available to the user's device.\n

    This information is accessed via the Window.getScreenDetails() method.\n

    \n

    Note:\nScreenDetails is a live object, meaning that it updates as the available screens change. You can therefore keep querying the same object to get updated values, rather than repeatedly calling getScreenDetails().\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The ScreenDetails interface of the Window Management API represents the details of all the screens available to the user's device.\n

    This information is accessed via the Window.getScreenDetails() method.\n

    \n

    Note:\nScreenDetails is a live object, meaning that it updates as the available screens change. You can therefore keep querying the same object to get updated values, rather than repeatedly calling getScreenDetails().\n

    " }, "screendetails.currentscreen": { "url": "$MDN_URL$/web/api/screendetails/currentscreen", @@ -10355,7 +10527,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The currentScreen read-only property of the\nScreenDetails interface contains a single ScreenDetailed object representing detailed information about the screen that the current browser window is displayed in." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The currentScreen read-only property of the\nScreenDetails interface contains a single ScreenDetailed object representing detailed information about the screen that the current browser window is displayed in." }, "screendetails.screens": { "url": "$MDN_URL$/web/api/screendetails/screens", @@ -10371,7 +10543,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The screens read-only property of the\nScreenDetails interface contains an array of ScreenDetailed objects, each one representing detailed information about one specific screen available to the user's device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The screens read-only property of the\nScreenDetails interface contains an array of ScreenDetailed objects, each one representing detailed information about one specific screen available to the user's device." }, "screenorientation": { "url": "$MDN_URL$/web/api/screenorientation", @@ -10536,7 +10708,7 @@ "baseline": { "level": "NONE" }, - "doc": "The ScrollTimeline interface of the Web Animations API represents a scroll progress timeline (see CSS scroll-driven animations for more details).\n

    Pass a ScrollTimeline instance to the Animation() constructor or the animate() method to specify it as the timeline that will control the progress of the animation." + "doc": "The ScrollTimeline interface of the Web Animations API represents a scroll progress timeline (see CSS scroll-driven animations for more details).\n

    Pass a ScrollTimeline instance to the Animation() constructor or the animate() method to specify it as the timeline that will control the progress of the animation." }, "scrolltimeline.axis": { "url": "$MDN_URL$/web/api/scrolltimeline/axis", @@ -11558,7 +11730,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Sensor interface of the Sensor APIs is the base class for all the other sensor interfaces. This interface cannot be used directly. Instead it provides properties, event handlers, and methods accessed by interfaces that inherit from it.\n

    This feature may be blocked by a Permissions Policy set on your server.\n

    When initially created, the Sensor object is idle, meaning it does not take measures. Once the start() method is called, it prepares itself to read data and, once ready, the activate event is sent and the sensor becomes activated. It then sends a reading event each time new data is available.\n

    In case of an error, the error event is sent, reading stops, and the Sensor object becomes idle again. The start() method needs to be called again before it can read further data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Sensor interface of the Sensor APIs is the base class for all the other sensor interfaces. This interface cannot be used directly. Instead it provides properties, event handlers, and methods accessed by interfaces that inherit from it.\n

    This feature may be blocked by a Permissions Policy set on your server.\n

    When initially created, the Sensor object is idle, meaning it does not take measures. Once the start() method is called, it prepares itself to read data and, once ready, the activate event is sent and the sensor becomes activated. It then sends a reading event each time new data is available.\n

    In case of an error, the error event is sent, reading stops, and the Sensor object becomes idle again. The start() method needs to be called again before it can read further data." }, "sensor.activated": { "url": "$MDN_URL$/web/api/sensor/activated", @@ -11574,7 +11746,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The activated read-only property\nof the Sensor interface returns a boolean value indicating\nwhether the sensor is active.\n

    Because Sensor is a base class, activated may only be read\nfrom one of its derived classes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The activated read-only property\nof the Sensor interface returns a boolean value indicating\nwhether the sensor is active.\n

    Because Sensor is a base class, activated may only be read\nfrom one of its derived classes." }, "sensor.hasreading": { "url": "$MDN_URL$/web/api/sensor/hasreading", @@ -11590,7 +11762,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hasReading read-only\nproperty of the Sensor interface returns a boolean value\nindicating whether the sensor has a reading.\n

    Because Sensor is a base class, hasReading may only be read\nfrom one of its derived classes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hasReading read-only\nproperty of the Sensor interface returns a boolean value\nindicating whether the sensor has a reading.\n

    Because Sensor is a base class, hasReading may only be read\nfrom one of its derived classes." }, "sensor.start": { "url": "$MDN_URL$/web/api/sensor/start", @@ -11606,7 +11778,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The start() method of the Sensor interface activates one of the sensors based on Sensor.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The start() method of the Sensor interface activates one of the sensors based on Sensor.", "returns": "None (undefined)." }, "sensor.stop": { @@ -11623,7 +11795,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The stop() method of the Sensor interface deactivates the current sensor.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The stop() method of the Sensor interface deactivates the current sensor.", "returns": "None (undefined)." }, "sensor.timestamp": { @@ -11640,7 +11812,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The timestamp read-only property\nof the Sensor interface returns the timestamp of the latest sensor\nreading.\n

    Because Sensor is a base class, timestamp may only be read\nfrom one of its derived classes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The timestamp read-only property\nof the Sensor interface returns the timestamp of the latest sensor\nreading.\n

    Because Sensor is a base class, timestamp may only be read\nfrom one of its derived classes." }, "sensorerrorevent": { "url": "$MDN_URL$/web/api/sensorerrorevent", @@ -11656,7 +11828,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The SensorErrorEvent interface of the Sensor APIs provides information about errors thrown by a Sensor or derived interface." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The SensorErrorEvent interface of the Sensor APIs provides information about errors thrown by a Sensor or derived interface." }, "sensorerrorevent.error": { "url": "$MDN_URL$/web/api/sensorerrorevent/error", @@ -11672,7 +11844,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The error read-only property of\nthe SensorErrorEvent interface returns the DOMException\nobject passed in the event's constructor." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The error read-only property of\nthe SensorErrorEvent interface returns the DOMException\nobject passed in the event's constructor." }, "sensorerrorevent.sensorerrorevent": { "url": "$MDN_URL$/web/api/sensorerrorevent/sensorerrorevent", @@ -11688,7 +11860,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The SensorErrorEvent() constructor\ncreates a new SensorErrorEvent object which provides information about\nerrors thrown by any of the interfaces based on Sensor.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The SensorErrorEvent() constructor\ncreates a new SensorErrorEvent object which provides information about\nerrors thrown by any of the interfaces based on Sensor.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to error.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    error
    \n
    \n

    A DOMException object describing the error.\n

    \n
    " @@ -11709,7 +11881,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The Serial interface of the Web Serial API provides attributes and methods for finding and connecting to serial ports from a web page." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The Serial interface of the Web Serial API provides attributes and methods for finding and connecting to serial ports from a web page." }, "serial.getports": { "url": "$MDN_URL$/web/api/serial/getports", @@ -11725,7 +11897,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getPorts() method of the Serial interface returns a Promise that resolves with an array of SerialPort objects representing serial ports connected to the host which the origin has permission to access.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getPorts() method of the Serial interface returns a Promise that resolves with an array of SerialPort objects representing serial ports connected to the host which the origin has permission to access.", "returns": "A Promise that resolves with an array of SerialPort objects.", "throws": { "SecurityError DOMException": "The returned Promise rejects with this error in either of the following situations:\n

    " @@ -11745,7 +11917,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Serial.requestPort() method of the Serial interface presents the user with a dialog asking them to select a serial device to connect to. It returns a Promise that resolves with an instance of SerialPort representing the device chosen by the user.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The Serial.requestPort() method of the Serial interface presents the user with a dialog asking them to select a serial device to connect to. It returns a Promise that resolves with an instance of SerialPort representing the device chosen by the user.", "parameters": { "options": "An object with the following properties:\n

    \n
    filters Optional
    \n
    \n

    A list of objects containing vendor, product, or Bluetooth service class IDs used to filter the specific device types made available for the user to request a connection to. If no filters are specified, the user is presented with a list of every available device to choose from. Filters can contain the following values:\n

    \n
    bluetoothServiceClassId Optional
    \n
    \n

    An unsigned long integer or string representing a Bluetooth service class ID. This can be a 16- or 32-bit UUID alias, any valid UUID, or a valid name from a GATT assigned services key.\n

    \n
    usbVendorId Optional
    \n
    \n

    An unsigned short integer that identifies a USB device vendor. The USB Implementors Forum assigns IDs to specific vendors.\n

    \n
    usbProductId Optional
    \n
    \n

    An unsigned short integer that identifies a USB device. Each vendor assigns IDs to its products.\n

    \n
    \n
    \n
    allowedBluetoothServiceClassIds Optional
    \n
    \n

    A list of unsigned long integers and/or strings representing Bluetooth service class IDs. Bluetooth ports with custom service class IDs are excluded from the list of ports presented to the user unless the service class ID is included in this list. This is true whether you filter the list or not.\n

    \n
    " }, @@ -11769,7 +11941,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort interface of the Web Serial API provides access to a serial port on the host device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort interface of the Web Serial API provides access to a serial port on the host device." }, "serialport.close": { "url": "$MDN_URL$/web/api/serialport/close", @@ -11785,7 +11957,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.close() method of the SerialPort interface returns a Promise that resolves when the port closes.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.close() method of the SerialPort interface returns a Promise that resolves when the port closes.", "returns": "A Promise." }, "serialport.connected": { @@ -11802,7 +11974,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The connected read-only property of the SerialPort interface returns a boolean value that indicates whether the port is logically connected to the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The connected read-only property of the SerialPort interface returns a boolean value that indicates whether the port is logically connected to the device." }, "serialport.forget": { "url": "$MDN_URL$/web/api/serialport/forget", @@ -11818,7 +11990,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.forget() method of the SerialPort interface returns a Promise that resolves when access to the serial port is revoked.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.forget() method of the SerialPort interface returns a Promise that resolves when access to the serial port is revoked.", "returns": "A Promise that resolves with undefined once the connection is revoked." }, "serialport.getinfo": { @@ -11835,7 +12007,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getInfo() method of the SerialPort interface returns an object containing identifying information for the device available via the port.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The getInfo() method of the SerialPort interface returns an object containing identifying information for the device available via the port.", "returns": "An object containing the following properties:\n

    \n
    usbVendorId
    \n
    \n

    If the port is part of a USB device, this property is an unsigned short integer that identifies the device's vendor. If not, it is undefined.\n

    \n
    usbProductId
    \n
    \n

    If the port is part of a USB device, this property is an unsigned short integer that identifies the USB device. If not, it is undefined.\n

    \n
    bluetoothServiceClassId \nExperimental\n
    \n
    \n

    If the port is a Bluetooth RFCOMM service, this property is an unsigned long integer or string representing the device's Bluetooth service class ID. If not, it is undefined.\n

    \n
    " }, "serialport.getsignals": { @@ -11852,7 +12024,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.getSignals() method of the SerialPort interface returns a Promise that resolves with an object containing the current state of the port's control signals.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The SerialPort.getSignals() method of the SerialPort interface returns a Promise that resolves with an object containing the current state of the port's control signals.", "returns": "Returns a Promise that resolves with an object containing the following members:\n

    \n
    clearToSend
    \n
    \n

    A boolean indicating to the other end of a serial connection that is clear to send data.\n

    \n
    dataCarrierDetect
    \n
    \n

    A boolean that toggles the control signal needed to communicate over a serial connection.\n

    \n
    dataSetReady
    \n
    \n

    A boolean indicating whether the device is ready to send and receive data.\n

    \n
    ringIndicator
    \n
    \n

    A boolean indicating whether a ring signal should be sent down the serial connection.\n

    \n
    ", "throws": { "InvalidStateError DOMException": "Returned if the port is not open. Call SerialPort.open() to avoid this error.", @@ -11873,7 +12045,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The open() method of the SerialPort interface returns a Promise that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking. The baudRate parameter is required.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The open() method of the SerialPort interface returns a Promise that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking. The baudRate parameter is required.", "parameters": { "options": "An object with any of the following values:\n

    \n
    baudRate
    \n
    \n

    A positive, non-zero value indicating the baud rate at which serial communication should be established.\n

    \n
    bufferSize Optional
    \n
    \n

    An unsigned long integer indicating the size of the read and write buffers that are to be established. If not passed, defaults to 255.\n

    \n
    dataBits Optional
    \n
    \n

    An integer value of 7 or 8 indicating the number of data bits per frame. If not passed, defaults to 8.\n

    \n
    flowControl Optional
    \n
    \n

    The flow control type, either \"none\" or \"hardware\". The default value is \"none\".\n

    \n
    parity Optional
    \n
    \n

    The parity mode, either \"none\", \"even\", or \"odd\". The default value is \"none\".\n

    \n
    stopBits Optional
    \n
    \n

    An integer value of 1 or 2 indicating the number of stop bits at the end of the frame. If not passed, defaults to 1.\n

    \n
    " }, @@ -11897,7 +12069,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The readable read-only property of the SerialPort interface returns a ReadableStream for receiving data from the device connected to the port. Chunks read from this stream are instances of Uint8Array. This property is non-null as long as the port is open and has not encountered a fatal error." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The readable read-only property of the SerialPort interface returns a ReadableStream for receiving data from the device connected to the port. Chunks read from this stream are instances of Uint8Array. This property is non-null as long as the port is open and has not encountered a fatal error." }, "serialport.setsignals": { "url": "$MDN_URL$/web/api/serialport/setsignals", @@ -11913,7 +12085,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The setSignals() method of the SerialPort interface sets control signals on the port and returns a Promise that resolves when they are set.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The setSignals() method of the SerialPort interface sets control signals on the port and returns a Promise that resolves when they are set.", "parameters": { "options": "An object with any of the following values:\n

    \n
    dataTerminalReady
    \n
    \n

    A boolean indicating whether to invoke the operating system to either assert (if true) or de-assert (if false) the \"data terminal ready\" or \"DTR\" signal on the serial port.\n

    \n
    requestToSend
    \n
    \n

    A boolean indicating whether to invoke the operating system to either assert (if true) or de-assert (if false) the \"request to send\" or \"RTS\" signal on the serial port.\n

    \n
    break
    \n
    \n

    A boolean indicating whether to invoke the operating system to either assert (if true) or de-assert (if false) the \"break\" signal on the serial port.\n

    \n
    " }, @@ -11937,7 +12109,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The writable read-only property of the SerialPort interface returns a WritableStream for sending data to the device connected to the port. Chunks written to this stream must be instances of ArrayBuffer, TypedArray, or DataView. This property is non-null as long as the port is open and has not encountered a fatal error." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The writable read-only property of the SerialPort interface returns a WritableStream for sending data to the device connected to the port. Chunks written to this stream must be instances of ArrayBuffer, TypedArray, or DataView. This property is non-null as long as the port is open and has not encountered a fatal error." }, "serviceworker": { "url": "$MDN_URL$/web/api/serviceworker", @@ -11959,7 +12131,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorker interface of the Service Worker API provides a reference to a service worker. Multiple browsing contexts (e.g., pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker object.\n

    A ServiceWorker object is available via a number of properties:\n

    \n

    The ServiceWorker.state property and statechange event can be used to check and observe changes in the lifecycle-state of the object's associated service worker.\nRelated lifecycle events, such as install and activate are fired at the service worker itself.\n

    Service workers allow static import of ECMAScript modules, if supported, using import.\nDynamic import is disallowed by the specification — calling import() will throw.\n

    Service workers can only be registered in the Window scope in some or all browsers, because the ServiceWorker object is not exposed to DedicatedWorkerGlobalScope and SharedWorkerGlobalScope.\nCheck the browser compatibility for information." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorker interface of the Service Worker API provides a reference to a service worker. Multiple browsing contexts (e.g., pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker object.\n

    A ServiceWorker object is available via a number of properties:\n

    \n

    The ServiceWorker.state property and statechange event can be used to check and observe changes in the lifecycle-state of the object's associated service worker.\nRelated lifecycle events, such as install and activate are fired at the service worker itself.\n

    Service workers allow static import of ECMAScript modules, if supported, using import.\nDynamic import is disallowed by the specification — calling import() will throw.\n

    Service workers can only be registered in the Window scope in some or all browsers, because the ServiceWorker object is not exposed to DedicatedWorkerGlobalScope and SharedWorkerGlobalScope.\nCheck the browser compatibility for information." }, "serviceworker.postmessage": { "url": "$MDN_URL$/web/api/serviceworker/postmessage", @@ -11981,7 +12153,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The postMessage() method of the ServiceWorker interface sends a message to the worker. The first parameter is the data to send to the worker. The data may be any JavaScript object which can be handled by the structured clone algorithm.\n

    The service worker can send back information to its clients by using the postMessage() method. The message will not be sent back to this ServiceWorker object but to the associated ServiceWorkerContainer available via navigator.serviceWorker.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The postMessage() method of the ServiceWorker interface sends a message to the worker. The first parameter is the data to send to the worker. The data may be any JavaScript object which can be handled by the structured clone algorithm.\n

    The service worker can send back information to its clients by using the postMessage() method. The message will not be sent back to this ServiceWorker object but to the associated ServiceWorkerContainer available via navigator.serviceWorker.", "parameters": { "message": "The object to deliver to the worker; this will be in the data field in the event delivered to the message event. This may be any JavaScript object handled by the structured clone algorithm.\n

    The message parameter is mandatory. If the data to be passed to the worker is unimportant, null or undefined must be passed explicitly.\n

    \n

    Note:\nA service worker is not in the same agent cluster as its client, and therefore cannot share memory. SharedArrayBuffer objects, or buffer views backed by one, cannot be posted across agent clusters. Trying to do so will generate a messageerror event containing a DataCloneError DOMException on the receiving end.\n

    ", "transfer": "An optional array of transferable objects to transfer ownership of. The ownership of these objects is given to the destination side and they are no longer usable on the sending side. These transferable objects should be attached to the message; otherwise they would be moved but not actually accessible on the receiving end.", @@ -12012,7 +12184,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Returns the ServiceWorker serialized script URL defined as part of ServiceWorkerRegistration.\nMust be on the same origin as the document that registers the\nServiceWorker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    Returns the ServiceWorker serialized script URL defined as part of ServiceWorkerRegistration.\nMust be on the same origin as the document that registers the\nServiceWorker." }, "serviceworker.state": { "url": "$MDN_URL$/web/api/serviceworker/state", @@ -12034,7 +12206,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The state read-only property of the\nServiceWorker interface returns a string representing the current state\nof the service worker. It can be one of the following values: parsed, installing,\ninstalled, activating, activated, or\nredundant." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The state read-only property of the\nServiceWorker interface returns a string representing the current state\nof the service worker. It can be one of the following values: parsed, installing,\ninstalled, activating, activated, or\nredundant." }, "serviceworkercontainer": { "url": "$MDN_URL$/web/api/serviceworkercontainer", @@ -12056,7 +12228,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorkerContainer interface of the Service Worker API provides an object representing the service worker as an overall unit in the network ecosystem, including facilities to register, unregister and update service workers, and access the state of service workers and their registrations.\n

    Most importantly, it exposes the ServiceWorkerContainer.register() method used to register service workers, and the ServiceWorkerContainer.controller property used to determine whether or not the current page is actively controlled.\n

    ServiceWorkerContainer objects are exposed in the Window scope through Navigator.serviceWorker and in workers using WorkerNavigator.serviceWorker (if supported — check browser compatibility)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorkerContainer interface of the Service Worker API provides an object representing the service worker as an overall unit in the network ecosystem, including facilities to register, unregister and update service workers, and access the state of service workers and their registrations.\n

    Most importantly, it exposes the ServiceWorkerContainer.register() method used to register service workers, and the ServiceWorkerContainer.controller property used to determine whether or not the current page is actively controlled.\n

    ServiceWorkerContainer objects are exposed in the Window scope through Navigator.serviceWorker and in workers using WorkerNavigator.serviceWorker (if supported — check browser compatibility)." }, "serviceworkercontainer.controller": { "url": "$MDN_URL$/web/api/serviceworkercontainer/controller", @@ -12078,7 +12250,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controller read-only property of the ServiceWorkerContainer interface represents the active service worker controlling the current page (associated with this ServiceWorkerContainer), or null if the page has no active or activating service worker.\n

    This is the same object returned by ServiceWorkerRegistration.active." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controller read-only property of the ServiceWorkerContainer interface represents the active service worker controlling the current page (associated with this ServiceWorkerContainer), or null if the page has no active or activating service worker.\n

    This is the same object returned by ServiceWorkerRegistration.active." }, "serviceworkercontainer.getregistration": { "url": "$MDN_URL$/web/api/serviceworkercontainer/getregistration", @@ -12100,7 +12272,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getRegistration() method of the\nServiceWorkerContainer interface gets a\nServiceWorkerRegistration object whose scope URL matches the provided\nclient URL. The method returns a Promise that resolves to\na ServiceWorkerRegistration or undefined.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getRegistration() method of the\nServiceWorkerContainer interface gets a\nServiceWorkerRegistration object whose scope URL matches the provided\nclient URL. The method returns a Promise that resolves to\na ServiceWorkerRegistration or undefined.", "parameters": { "clientURL": "The registration whose scope matches this URL will be returned. Relative URLs are resolved with the current client as the base. If this parameter is not provided, the current client's URL will be used by default." }, @@ -12126,7 +12298,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getRegistrations() method of the\nServiceWorkerContainer interface gets all\nServiceWorkerRegistrations associated with a\nServiceWorkerContainer, in an array. The method returns a\nPromise that resolves to an array of\nServiceWorkerRegistration.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getRegistrations() method of the\nServiceWorkerContainer interface gets all\nServiceWorkerRegistrations associated with a\nServiceWorkerContainer, in an array. The method returns a\nPromise that resolves to an array of\nServiceWorkerRegistration.", "returns": "A Promise that resolves to an array of\nServiceWorkerRegistration objects." }, "serviceworkercontainer.ready": { @@ -12149,7 +12321,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ready read-only property of the ServiceWorkerContainer interface provides a way of delaying code execution until a service worker is active.\n

    The property returns a Promise that will never reject, and which waits indefinitely until the ServiceWorkerRegistration associated with the current page has an active worker.\nOnce that condition is met, it resolves with the ServiceWorkerRegistration." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ready read-only property of the ServiceWorkerContainer interface provides a way of delaying code execution until a service worker is active.\n

    The property returns a Promise that will never reject, and which waits indefinitely until the ServiceWorkerRegistration associated with the current page has an active worker.\nOnce that condition is met, it resolves with the ServiceWorkerRegistration." }, "serviceworkercontainer.register": { "url": "$MDN_URL$/web/api/serviceworkercontainer/register", @@ -12171,9 +12343,9 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The register() method of the ServiceWorkerContainer interface creates or updates a ServiceWorkerRegistration for the given scope.\nIf successful, the registration associates the provided script URL to a scope, which is subsequently used for matching documents to a specific service worker.\n

    A single registration is created for each unique scope.\nIf register() is called for a scope that has an existing registration, the registration is updated with any changes to the scriptURL or options.\nIf there are no changes, then the existing registration is returned.\nCalling register() with the same scope and scriptURL does not restart the installation process, so it is generally safe to call this method unconditionally from a controlled page.\nHowever, it does send a network request for the service worker script, which may put more load on the server.\nIf this is a concern, you can first check for an existing registration using ServiceWorkerContainer.getRegistration().\n

    A document can potentially be within the scope of several registrations with different service workers and options.\nThe browser will associate the document with the matching registration that has the most specific scope.\nThis ensures that only one service worker runs for each document.\n

    \n

    Note:\nIt is generally safer not to define registrations that have overlapping scopes.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n
    \n

    Warning:\nThe scriptURL parameter passed to this method represents the URL of an external script loaded into a service worker.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The register() method of the ServiceWorkerContainer interface creates or updates a ServiceWorkerRegistration for the given scope.", "parameters": { - "scriptURL": "The URL of the service worker script.\nThe registered service worker file needs to have a valid JavaScript MIME type.", + "scriptURL": "A TrustedScriptURL instance or a string defining the URL of the service worker script.\nThe registered service worker file needs to be served with a valid JavaScript media type.", "options": "An object containing registration options. Currently available options are:\n

    \n
    scope
    \n
    \n

    A string representing a URL that defines a service worker's registration scope; that is, what range of URLs a service worker can control.\n

    This is usually specified as a URL that is relative to the base URL of the site (e.g., /some/path/), so that the resolved scope is the same irrespective of what page the registration code is called from.\nThe default scope for a service worker registration is the directory where the service worker script is located (resolving ./ against scriptURL).\n

    The scope should be used to specify documents that are in the same directory or more deeply nested than the service worker.\nIf you need a broader scope, this can be permitted via the HTTP Service-Worker-Allowed header.\nSee the Examples section for information on broadening the default scope of a service worker.\n

    \n
    type
    \n
    \n

    A string specifying the type of worker to create.\nValid values are:\n

    \n
    'classic'
    \n
    \n

    The loaded service worker is in a standard script.\nThis is the default.\n

    \n
    'module'
    \n
    \n

    The loaded service worker is in an ES module and the import statement is available on worker contexts.\nFor ES module compatibility info, see the browser compatibility data table for the ServiceWorker interface.\n

    \n
    \n
    \n
    updateViaCache
    \n
    \n

    A string indicating how the HTTP cache is used for service worker scripts resources during updates.\nNote: This only refers to the service worker script and its imports, not other resources fetched by these scripts.\n

    \n
    'all'
    \n
    \n

    The HTTP cache will be queried for the main script, and all imported scripts. If no fresh entry is found in the HTTP cache, then the scripts are fetched from the network.\n

    \n
    'imports'
    \n
    \n

    The HTTP cache will be queried for imports, but the main script will always be updated from the network. If no fresh entry is found in the HTTP cache for the imports, they're fetched from the network.\n

    \n
    'none'
    \n
    \n

    The HTTP cache will not be used for the main script or its imports. All service worker script resources will be updated from the network.\n

    \n
    \n
    \n
    " }, "returns": "A Promise that resolves with a ServiceWorkerRegistration object.", @@ -12202,7 +12374,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The startMessages() method of\nthe ServiceWorkerContainer interface explicitly starts the flow of\nmessages being dispatched from a service worker to pages under its control (e.g., sent\nvia Client.postMessage()). This can be used to react to sent messages\nearlier, even before that page's content has finished loading.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The startMessages() method of\nthe ServiceWorkerContainer interface explicitly starts the flow of\nmessages being dispatched from a service worker to pages under its control (e.g., sent\nvia Client.postMessage()). This can be used to react to sent messages\nearlier, even before that page's content has finished loading.", "returns": "undefined." }, "serviceworkerglobalscope": { @@ -12225,7 +12397,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ServiceWorkerGlobalScope interface of the Service Worker API represents the global execution context of a service worker.\n

    Developers should keep in mind that the ServiceWorker state is not persisted across the termination/restart cycle, so each event handler should assume it's being invoked with a bare, default global state.\n

    Once successfully registered, a service worker can and will be terminated when idle to conserve memory and processor power. An active service worker is automatically restarted to respond to events, such as fetch or message.\n

    Additionally, synchronous requests are not allowed from within a service worker — only asynchronous requests, like those initiated via the fetch() method, can be used.\n

    This interface inherits from the WorkerGlobalScope interface, and its parent EventTarget." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The ServiceWorkerGlobalScope interface of the Service Worker API represents the global execution context of a service worker.\n

    Developers should keep in mind that the ServiceWorker state is not persisted across the termination/restart cycle, so each event handler should assume it's being invoked with a bare, default global state.\n

    Once successfully registered, a service worker can and will be terminated when idle to conserve memory and processor power. An active service worker is automatically restarted to respond to events, such as fetch or message.\n

    Additionally, synchronous requests are not allowed from within a service worker — only asynchronous requests, like those initiated via the fetch() method, can be used.\n

    This interface inherits from the WorkerGlobalScope interface, and its parent EventTarget." }, "serviceworkerglobalscope.clients": { "url": "$MDN_URL$/web/api/serviceworkerglobalscope/clients", @@ -12247,7 +12419,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The clients read-only property of the\nServiceWorkerGlobalScope interface returns the Clients\nobject associated with the service worker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The clients read-only property of the\nServiceWorkerGlobalScope interface returns the Clients\nobject associated with the service worker." }, "serviceworkerglobalscope.cookiestore": { "url": "$MDN_URL$/web/api/serviceworkerglobalscope/cookiestore", @@ -12268,7 +12440,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The cookieStore read-only property of the ServiceWorkerGlobalScope interface returns a reference to the CookieStore object associated with this service worker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The cookieStore read-only property of the ServiceWorkerGlobalScope interface returns a reference to the CookieStore object associated with this service worker." }, "serviceworkerglobalscope.registration": { "url": "$MDN_URL$/web/api/serviceworkerglobalscope/registration", @@ -12290,7 +12462,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The registration read-only property of the ServiceWorkerGlobalScope interface returns a reference to the ServiceWorkerRegistration object, which represents the service worker's registration." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The registration read-only property of the ServiceWorkerGlobalScope interface returns a reference to the ServiceWorkerRegistration object, which represents the service worker's registration." }, "serviceworkerglobalscope.serviceworker": { "url": "$MDN_URL$/web/api/serviceworkerglobalscope/serviceworker", @@ -12308,7 +12480,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The serviceWorker read-only property of the ServiceWorkerGlobalScope interface returns a reference to the ServiceWorker object, which represents the service worker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The serviceWorker read-only property of the ServiceWorkerGlobalScope interface returns a reference to the ServiceWorker object, which represents the service worker." }, "serviceworkerglobalscope.skipwaiting": { "url": "$MDN_URL$/web/api/serviceworkerglobalscope/skipwaiting", @@ -12330,7 +12502,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The skipWaiting() method of the ServiceWorkerGlobalScope interface forces the waiting service worker to become the active service worker.\n

    Use this method with Clients.claim() to ensure that updates to the underlying service worker take effect immediately for both the current client and all other active clients.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Service Workers.

    \n

    The skipWaiting() method of the ServiceWorkerGlobalScope interface forces the waiting service worker to become the active service worker.\n

    Use this method with Clients.claim() to ensure that updates to the underlying service worker take effect immediately for both the current client and all other active clients.", "returns": "A Promise that resolves with undefined after trying to activate the newly installed service worker." }, "serviceworkerregistration": { @@ -12353,7 +12525,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorkerRegistration interface of the Service Worker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin.\n

    The lifetime of a service worker registration is beyond that of the ServiceWorkerRegistration objects that represent them within the lifetime of their corresponding service worker clients. The browser maintains a persistent list of active ServiceWorkerRegistration objects." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ServiceWorkerRegistration interface of the Service Worker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin.\n

    The lifetime of a service worker registration is beyond that of the ServiceWorkerRegistration objects that represent them within the lifetime of their corresponding service worker clients. The browser maintains a persistent list of active ServiceWorkerRegistration objects." }, "serviceworkerregistration.active": { "url": "$MDN_URL$/web/api/serviceworkerregistration/active", @@ -12375,7 +12547,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The active read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is activating or activated.\nThis property is initially set to null.\n

    An active worker controls a Client if the client's URL\nfalls within the scope of the registration (the scope option set when\nServiceWorkerContainer.register is first called.)\n

    \n

    Note:\nOnce an active worker is activating, neither a\nruntime script error nor a force termination of the active worker prevents the active\nworker from getting activated.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The active read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is activating or activated.\nThis property is initially set to null.\n

    An active worker controls a Client if the client's URL\nfalls within the scope of the registration (the scope option set when\nServiceWorkerContainer.register is first called.)\n

    \n

    Note:\nOnce an active worker is activating, neither a\nruntime script error nor a force termination of the active worker prevents the active\nworker from getting activated.\n

    " }, "serviceworkerregistration.backgroundfetch": { "url": "$MDN_URL$/web/api/serviceworkerregistration/backgroundfetch", @@ -12392,7 +12564,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The backgroundFetch read-only property of the\nServiceWorkerRegistration interface returns a reference to a\nBackgroundFetchManager object, which can be used to initiate background fetch operations." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The backgroundFetch read-only property of the\nServiceWorkerRegistration interface returns a reference to a\nBackgroundFetchManager object, which can be used to initiate background fetch operations." }, "serviceworkerregistration.cookies": { "url": "$MDN_URL$/web/api/serviceworkerregistration/cookies", @@ -12410,7 +12582,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The cookies read-only property of the ServiceWorkerRegistration interface returns a reference to the CookieStoreManager interface, which enables a web app to subscribe to and unsubscribe from cookie change events in a service worker. This is an entry point for the Cookie Store API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Service Workers.

    \n

    The cookies read-only property of the ServiceWorkerRegistration interface returns a reference to the CookieStoreManager interface, which enables a web app to subscribe to and unsubscribe from cookie change events in a service worker. This is an entry point for the Cookie Store API." }, "serviceworkerregistration.getnotifications": { "url": "$MDN_URL$/web/api/serviceworkerregistration/getnotifications", @@ -12432,7 +12604,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getNotifications() method of\nthe ServiceWorkerRegistration interface returns a list of the\nnotifications in the order that they were created from the current origin via the\ncurrent service worker registration. Origins can have many active but\ndifferently-scoped service worker registrations. Notifications created by one service\nworker on the same origin will not be available to other active service workers on\nthat same origin.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getNotifications() method of\nthe ServiceWorkerRegistration interface returns a list of the\nnotifications in the order that they were created from the current origin via the\ncurrent service worker registration. Origins can have many active but\ndifferently-scoped service worker registrations. Notifications created by one service\nworker on the same origin will not be available to other active service workers on\nthat same origin.", "parameters": { "options": "An object containing options to filter the notifications returned. The available\noptions are:\n

    \n
    tag Optional
    \n
    \n

    A string representing a notification tag. If\nspecified, only notifications that have this tag will be returned.\n

    \n
    " }, @@ -12458,7 +12630,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The installing read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is installing. This property is\ninitially set to null." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The installing read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is installing. This property is\ninitially set to null." }, "serviceworkerregistration.navigationpreload": { "url": "$MDN_URL$/web/api/serviceworkerregistration/navigationpreload", @@ -12480,7 +12652,7 @@ "lowDate": "2022-04-05", "highDate": "2024-10-05" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The navigationPreload read-only property of the ServiceWorkerRegistration interface returns the NavigationPreloadManager associated with the current service worker registration.\n

    The returned object allows resources managed by a service worker to be preemptively downloaded in parallel with service worker boot up." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The navigationPreload read-only property of the ServiceWorkerRegistration interface returns the NavigationPreloadManager associated with the current service worker registration.\n

    The returned object allows resources managed by a service worker to be preemptively downloaded in parallel with service worker boot up." }, "serviceworkerregistration.paymentmanager": { "url": "$MDN_URL$/web/api/serviceworkerregistration/paymentmanager", @@ -12497,7 +12669,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The paymentManager read-only property of the\nServiceWorkerRegistration interface returns a payment app's PaymentManager instance, which is used to manage various payment app functionality." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The paymentManager read-only property of the\nServiceWorkerRegistration interface returns a payment app's PaymentManager instance, which is used to manage various payment app functionality." }, "serviceworkerregistration.periodicsync": { "url": "$MDN_URL$/web/api/serviceworkerregistration/periodicsync", @@ -12514,7 +12686,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The periodicSync read-only property of\nthe ServiceWorkerRegistration interface returns a reference to the\nPeriodicSyncManager interface, which allows for registering of tasks to\nrun at specific intervals." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The periodicSync read-only property of\nthe ServiceWorkerRegistration interface returns a reference to the\nPeriodicSyncManager interface, which allows for registering of tasks to\nrun at specific intervals." }, "serviceworkerregistration.pushmanager": { "url": "$MDN_URL$/web/api/serviceworkerregistration/pushmanager", @@ -12536,7 +12708,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushManager read-only property of the\nServiceWorkerRegistration interface returns a reference to the\nPushManager interface for managing push subscriptions; this includes\nsupport for subscribing, getting an active subscription, and accessing push permission\nstatus." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The pushManager read-only property of the\nServiceWorkerRegistration interface returns a reference to the\nPushManager interface for managing push subscriptions; this includes\nsupport for subscribing, getting an active subscription, and accessing push permission\nstatus." }, "serviceworkerregistration.scope": { "url": "$MDN_URL$/web/api/serviceworkerregistration/scope", @@ -12558,7 +12730,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The scope read-only property of the ServiceWorkerRegistration interface returns a string representing a URL that defines a service worker's registration scope; that is, the range of URLs a service worker can control. This is set using the scope parameter specified in the call to ServiceWorkerContainer.register() which registered the service worker." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The scope read-only property of the ServiceWorkerRegistration interface returns a string representing a URL that defines a service worker's registration scope; that is, the range of URLs a service worker can control. This is set using the scope parameter specified in the call to ServiceWorkerContainer.register() which registered the service worker." }, "serviceworkerregistration.shownotification": { "url": "$MDN_URL$/web/api/serviceworkerregistration/shownotification", @@ -12580,7 +12752,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The showNotification() method of the\nServiceWorkerRegistration interface creates a notification on an active\nservice worker.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The showNotification() method of the\nServiceWorkerRegistration interface creates a notification on an active\nservice worker.", "parameters": { "title": "Defines a title for the notification, which is shown at the top of the notification window.", "options": "An options object containing any custom settings that you want to apply to the notification. The possible options are:\n

    \n
    actions Optional
    \n
    \n

    An array of actions to display in the notification, for which the default is an empty array. Each element in the array can be an object with the following members:\n

    \n
    action
    \n
    \n

    A string identifying a user action to be displayed on the notification.\n

    \n
    title
    \n
    \n

    A string containing action text to be shown to the user.\n

    \n
    icon Optional
    \n
    \n

    A string containing the URL of an icon to display with the action.\n

    \n
    \n

    Appropriate responses are built using event.action within the notificationclick event.\n

    \n
    badge Optional
    \n
    \n

    A string containing the URL of the image used to represent the notification when there isn't enough space to display the notification itself; for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96x96px, and the image will be automatically masked.\n

    \n
    body Optional
    \n
    \n

    A string representing the body text of the notification, which is displayed below the title. The default is the empty string.\n

    \n
    data Optional
    \n
    \n

    Arbitrary data that you want associated with the notification. This can be of any structured-clonable data type. The default is null.\n

    \n
    dir Optional
    \n
    \n

    The direction in which to display the notification. It defaults to auto, which just adopts the browser's language setting behavior, but you can override that behavior by setting values of ltr and rtl (although most browsers seem to ignore these settings.)\n

    \n
    icon Optional
    \n
    \n

    A string containing the URL of an icon to be displayed in the notification.\n

    \n
    image Optional
    \n
    \n

    A string containing the URL of an image to be displayed in the notification.\n

    \n
    lang Optional
    \n
    \n

    The notification's language, as specified using a string representing a BCP 47 language tag. The default is the empty string.\n

    \n
    renotify Optional
    \n
    \n

    A boolean value specifying whether the user should be notified after a new notification replaces an old one. The default is false, which means they won't be notified. If true, then tag also must be set.\n

    \n
    requireInteraction Optional
    \n
    \n

    Indicates that a notification should remain active until the user clicks or dismisses it, rather than closing automatically. The default value is false.\n

    \n
    silent Optional
    \n
    \n

    A boolean value specifying whether the notification is silent (no sounds or vibrations issued), regardless of the device settings. The default, null, means to respect device defaults. If true, then vibrate must not be present.\n

    \n
    tag Optional
    \n
    \n

    A string representing an identifying tag for the notification. The default is the empty string.\n

    \n
    timestamp Optional
    \n
    \n

    A timestamp, given as Unix time in milliseconds, representing the time associated with the notification. This could be in the past when a notification is used for a message that couldn't immediately be delivered because the device was offline, or in the future for a meeting that is about to start.\n

    \n
    vibrate Optional
    \n
    \n

    A vibration pattern for the device's vibration hardware to emit with the notification. If specified, silent must not be true.\n

    \n
    " @@ -12605,7 +12777,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sync read-only property of the\nServiceWorkerRegistration interface returns a reference to the\nSyncManager interface, which manages background synchronization\nprocesses." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sync read-only property of the\nServiceWorkerRegistration interface returns a reference to the\nSyncManager interface, which manages background synchronization\nprocesses." }, "serviceworkerregistration.unregister": { "url": "$MDN_URL$/web/api/serviceworkerregistration/unregister", @@ -12627,7 +12799,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unregister() method of the\nServiceWorkerRegistration interface unregisters the service worker\nregistration and returns a Promise. The promise will resolve to\nfalse if no registration was found, otherwise it resolves to\ntrue irrespective of whether unregistration happened or not (it may not\nunregister if someone else just called ServiceWorkerContainer.register()\nwith the same scope.) The service worker will finish any ongoing operations before it is\nunregistered.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unregister() method of the\nServiceWorkerRegistration interface unregisters the service worker\nregistration and returns a Promise. The promise will resolve to\nfalse if no registration was found, otherwise it resolves to\ntrue irrespective of whether unregistration happened or not (it may not\nunregister if someone else just called ServiceWorkerContainer.register()\nwith the same scope.) The service worker will finish any ongoing operations before it is\nunregistered.", "returns": "Promise resolves with a boolean indicating whether the service worker has\nunregistered or not." }, "serviceworkerregistration.update": { @@ -12650,7 +12822,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The update() method of the\nServiceWorkerRegistration interface attempts to update the service\nworker. It fetches the worker's script URL, and if the new worker is not byte-by-byte\nidentical to the current worker, it installs the new worker. The fetch of the worker\nbypasses any browser caches if the previous fetch occurred over 24 hours ago.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The update() method of the\nServiceWorkerRegistration interface attempts to update the service\nworker. It fetches the worker's script URL, and if the new worker is not byte-by-byte\nidentical to the current worker, it installs the new worker. The fetch of the worker\nbypasses any browser caches if the previous fetch occurred over 24 hours ago.", "returns": "A Promise that resolves with a ServiceWorkerRegistration\nobject." }, "serviceworkerregistration.updateviacache": { @@ -12673,7 +12845,7 @@ "lowDate": "2018-10-02", "highDate": "2021-04-02" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The updateViaCache read-only property of the ServiceWorkerRegistration interface returns the value of the setting used to determine the circumstances in which the browser will consult the HTTP cache when it tries to update the service worker or any scripts that are imported via importScripts()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The updateViaCache read-only property of the ServiceWorkerRegistration interface returns the value of the setting used to determine the circumstances in which the browser will consult the HTTP cache when it tries to update the service worker or any scripts that are imported via importScripts()." }, "serviceworkerregistration.waiting": { "url": "$MDN_URL$/web/api/serviceworkerregistration/waiting", @@ -12695,7 +12867,7 @@ "lowDate": "2018-04-30", "highDate": "2020-10-30" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The waiting read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is installed. This property is initially\nset to null." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The waiting read-only property of the\nServiceWorkerRegistration interface returns a service worker whose\nServiceWorker.state is installed. This property is initially\nset to null." }, "setinterval": { "url": "$MDN_URL$/web/api/window/setinterval", @@ -12718,14 +12890,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The setInterval() method of the Window interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.", + "doc": "

    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The setInterval() method of the Window interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.", "parameters": { - "func": "A function to be executed every delay milliseconds. The first execution happens after delay milliseconds.", - "code": "An optional syntax allows you to include a string instead of a function, which is compiled and executed every delay milliseconds.\nThis syntax is not recommended for the same reasons that make using eval() a security risk.", - "delay": "The time, in milliseconds (thousandths of a second), the timer should delay in between executions of the specified function or code. Defaults to 0 if not specified.\nSee Delay restrictions below for details on the permitted range of delay values.", - "arg1, …, argN": "Additional arguments which are passed through to the function specified by func once the timer expires." + "func": "A function to be executed every delay milliseconds.\nThe first execution happens after delay milliseconds.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The delay time between executions of the specified function or code, in milliseconds.\nDefaults to 0 if not specified.\nSee Delay restrictions below for details on the permitted range of delay values.", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func once the timer expires." }, - "returns": "The setInterval() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call. This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.\n

    Within the same global environment (e.g., a particular window or worker), the interval ID is ensured to remain unique and is not reused for any new interval timer as long as the original timer is still active. However, different global environments maintain their own independent pools of interval IDs.\n

    Be aware that setInterval() and setTimeout() share the same pool of IDs, and that clearInterval() and clearTimeout() can technically be used interchangeably.\nFor clarity, however, you should try to always match them to avoid confusion when maintaining your code.\n

    \n

    Note:\nThe delay argument is converted to a signed 32-bit integer.\nThis effectively limits delay to 2147483647 ms, roughly 24.8 days, since it's specified as a signed integer in the IDL.\n

    " + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call.\n

    This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "settimeout": { "url": "$MDN_URL$/web/api/window/settimeout", @@ -12748,14 +12924,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The setTimeout() method of the Window interface sets a timer which executes a function or specified piece of code once the timer expires.", + "doc": "

    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The setTimeout() method of the Window interface sets a timer which executes a function or specified piece of code once the timer expires.", "parameters": { - "functionRef": "A function to be executed after the timer expires.", - "code": "An alternative syntax that allows you to include a string instead of a function,\nwhich is compiled and executed when the timer expires. This syntax is not\nrecommended for the same reasons that make using\neval() a security risk.", - "delay": "The time, in milliseconds that the timer should wait before\nthe specified function or code is executed. If this parameter is omitted, a value of 0\nis used, meaning execute \"immediately\", or more accurately, the next event cycle.\n

    Note that in either case, the actual delay may be longer than intended; see Reasons for delays longer than specified below.\n

    Also note that if the value isn't a number, implicit type coercion is silently done on the value to convert it to a number — which can lead to unexpected and surprising results; see Non-number delay values are silently coerced into numbers for an example.", - "param1, …, paramN": "Additional arguments which are passed through to the function specified by functionRef." + "func": "A function to be executed after the timer expires.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The time that the timer should wait before the specified function or code is executed, in milliseconds.\nDefaults to 0 if not specified.\n

    Note:\n

    ", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func." }, - "returns": "The setTimeout() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call. This identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active. However, separate global environments maintain their own independent pools of timer IDs." + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call.\nThis identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active.\nHowever, separate global environments maintain their own independent pools of timer IDs.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "shadowroot": { "url": "$MDN_URL$/web/api/shadowroot", @@ -12816,7 +12996,7 @@ "lowDate": "2023-03-27", "highDate": "2025-09-27" }, - "doc": "The adoptedStyleSheets property of the ShadowRoot interface sets an array of constructed stylesheets to be used by the shadow DOM subtree.\n

    \n

    Note:\nA constructed stylesheet is a stylesheet created programmatically using the CSSStyleSheet() constructor (as compared to one created by a user-agent when importing a stylesheet from a script, imported using <style> and @import, or linked to via <link>).\n

    \n

    The same constructed stylesheet can be adopted by multiple ShadowRoot instances, and by the parent document (using the Document.adoptedStyleSheets property).\nChanging an adopted stylesheet will affect all the adopting objects.\n

    Stylesheets in the adoptedStyleSheets property are considered along with the shadow DOM's other stylesheets.\nFor the purpose of determining the final computed CSS of any element, they are considered to have been added after the other stylesheets in the shadow DOM (ShadowRoot.styleSheets).\n

    Only stylesheets created using the CSSStyleSheet() constructor, and from within the same parent Document as the shadow root, may be adopted." + "doc": "The adoptedStyleSheets property of the ShadowRoot interface sets an array of constructed stylesheets to be used by the shadow DOM subtree.\n

    \n

    Note:\nA constructed stylesheet is a stylesheet created programmatically using the CSSStyleSheet() constructor (as compared to one created by a user-agent when importing a stylesheet from a script, imported using <style> and @import, or linked to via <link>).\n

    \n

    The same constructed stylesheet can be adopted by multiple ShadowRoot instances, and by the parent document (using the Document.adoptedStyleSheets property).\nChanging an adopted stylesheet will affect all the adopting objects.\n

    Stylesheets in the adoptedStyleSheets property are considered along with the shadow DOM's other stylesheets.\nFor the purpose of determining the final computed CSS of any element, they are considered to have been added after the other stylesheets in the shadow DOM (ShadowRoot.styleSheets).\n

    Only stylesheets created using the CSSStyleSheet() constructor, and from within the same parent Document as the shadow root, may be adopted." }, "shadowroot.clonable": { "url": "$MDN_URL$/web/api/shadowroot/clonable", @@ -12873,7 +13053,7 @@ "Safari": "10.1", "SafariIOS": "10.3" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The elementFromPoint() method, available on the ShadowRoot object, returns the element at the topmost shadow root layer at the specified coordinates relative to the viewport (the shadow root highest in the display z-order, that is able to receive pointer events). Shadow root elements that have pointer-events set to none are ignored.\n

    If the specified point is outside the bounds of the shadow root, the result is undefined.", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The elementFromPoint() method, available on the ShadowRoot object, returns the element at the topmost shadow root layer at the specified coordinates relative to the viewport (the shadow root highest in the display z-order, that is able to receive pointer events). Shadow root elements that have pointer-events set to none are ignored.\n

    If the specified point is outside the bounds of the shadow root, the result is undefined.", "parameters": { "x": "The horizontal coordinate of a point, relative to the left edge of the current viewport.", "y": "The vertical coordinate of a point, relative to the top edge of the current viewport." @@ -12938,7 +13118,7 @@ "lowDate": "2020-09-16", "highDate": "2023-03-16" }, - "doc": "The getAnimations() method of the ShadowRoot interface\nreturns an array of all Animation objects currently in effect whose\ntarget elements are descendants of the shadow tree. This array includes CSS Animations, CSS Transitions, and Web Animations.", + "doc": "The getAnimations() method of the ShadowRoot interface\nreturns an array of all Animation objects currently in effect whose\ntarget elements are descendants of the shadow tree. This array includes CSS Animations, CSS Transitions, and Web Animations.", "returns": "An Array of Animation objects, each representing one\nanimation currently associated with elements which are descendants of the\nShadowRoot on which it's called." }, "shadowroot.gethtml": { @@ -13003,7 +13183,7 @@ "Safari": "10", "SafariIOS": "10" }, - "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The innerHTML property of the ShadowRoot interface gets or sets the HTML markup to the DOM tree inside the ShadowRoot.", + "doc": "

    \n

    Warning:\nThis property parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always assigning TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The innerHTML property of the ShadowRoot interface gets or sets the HTML markup to the DOM tree inside the ShadowRoot.", "throws": { "SyntaxError DOMException": "Thrown if an attempt was made to set the value of innerHTML using a string which is not properly-formed HTML.", "TypeError": "Thrown if the property is set to a string when Trusted Types are enforced by a CSP and no default policy is defined." @@ -13088,6 +13268,7 @@ "shadowroot.sethtml": { "url": "$MDN_URL$/web/api/shadowroot/sethtml", "status": [ + "Experimental", "StandardTrack" ], "compatibility": { @@ -13096,14 +13277,14 @@ "baseline": { "level": "NONE" }, - "doc": "The setHTML() method of the ShadowRoot interface provides an XSS-safe method to parse and sanitize a string of HTML into a DocumentFragment, which then replaces the existing tree in the Shadow DOM.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The setHTML() method of the ShadowRoot interface provides an XSS-safe method to parse and sanitize a string of HTML, which then replaces the existing tree in the Shadow DOM.\n

    The method removes any elements and attributes that are considered XSS-unsafe, even if allowed by a passed sanitizer.\nNotably, the following elements are always removed: <script>, <frame>, <iframe>, <embed>, <object>, <use>, and event handler attributes.\n

    It is recommended (if supported) as a drop-in replacement for ShadowRoot.innerHTML when setting a user-provided string of HTML.", "parameters": { "input": "A string defining HTML to be sanitized and injected into the shadow root.", - "options": "An options object with the following optional parameters:\n

    \n
    sanitizer
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed, or the string \"default\" for the default sanitizer configuration.\nNote that generally a \"Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to reused.\nIf not specified, the default sanitizer configuration is used.\n

    \n
    " + "options": "An options object with the following optional parameters:\n
    \n
    sanitizer
    \n
    \n

    A Sanitizer or SanitizerConfig object which defines what elements of the input will be allowed or removed, or the string \"default\" for the default configuration.\nThe method will remove any XSS-unsafe elements and attributes, even if allowed by the sanitizer.\n

    Note that generally a Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to be reused.\nIf not specified, the default sanitizer configuration is used.\n

    \n
    " }, "returns": "None (undefined).", "throws": { - "TypeError": "This is thrown if options.sanitizer is passed a:\n" + "TypeError": "This is thrown if options.sanitizer is passed a:\n" } }, "shadowroot.sethtmlunsafe": { @@ -13125,14 +13306,14 @@ "level": "LOW", "lowDate": "2025-09-15" }, - "doc": "
    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nShadowRoot.setHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The setHTMLUnsafe() method of the ShadowRoot interface can be used to parse HTML input into a DocumentFragment, optionally filtering out unwanted elements and attributes, and then use it to replace the existing tree in the Shadow DOM.", + "doc": "

    \n

    Warning:\nThis method parses its input as HTML, writing the result into the DOM.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks, if the input originally came from an attacker.\n

    You can mitigate this risk by always passing TrustedHTML objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n
    \n

    Note:\nShadowRoot.setHTML() should almost always be used instead of this method — on browsers where it is supported — as it always removes XSS-unsafe HTML entities.\n

    \n

    The setHTMLUnsafe() method of the ShadowRoot interface can be used to parse HTML input into a DocumentFragment, optionally filtering out unwanted elements and attributes, and then use it to replace the existing tree in the Shadow DOM.", "parameters": { "input": "A TrustedHTML or string instance defining HTML to be parsed.", "options": "An options object with the following optional parameters:\n

    \n
    sanitizer Optional
    \n
    \n

    A Sanitizer or SanitizerConfig object that defines what elements of the input will be allowed or removed.\nThis can also be a string with the value \"default\", which applies a Sanitizer with the default (XSS-safe) configuration.\nIf not specified, no sanitizer is used.\n

    Note that generally a Sanitizer is expected to be more efficient than a SanitizerConfig if the configuration is to reused.\n

    \n
    " }, "returns": "None (undefined).", "throws": { - "TypeError": "This is thrown if:\n" + "TypeError": "This is thrown if:\n" } }, "shadowroot.slotassignment": { @@ -13182,8 +13363,8 @@ "sharedstorage": { "url": "$MDN_URL$/web/api/sharedstorage", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13191,16 +13372,13 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorage interface of the Shared Storage API represents the shared storage for a particular origin, defining methods to write data to the shared storage.\n

    SharedStorage is the base class for:\n

    " + "doc": "

    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.

    \n

    The SharedStorage interface of the Shared Storage API represents the shared storage for a particular origin, defining methods to write data to the shared storage.\n

    SharedStorage is the base class for:\n

    " }, "sharedstorage.append": { "url": "$MDN_URL$/web/api/sharedstorage/append", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13208,10 +13386,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The append() method of the SharedStorage interface appends a string to the value of an existing key-value pair in the current origin's shared storage.", + "doc": "

    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.

    \n

    The append() method of the SharedStorage interface appends a string to the value of an existing key-value pair in the current origin's shared storage.", "parameters": { "key": "A string representing the key of the key-value pair to which you want to append a value.", "value": "A string that you want to append to the existing value of the key-value pair." @@ -13221,8 +13396,8 @@ "sharedstorage.clear": { "url": "$MDN_URL$/web/api/sharedstorage/clear", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13230,17 +13405,14 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The clear() method of the SharedStorage interface clears the current origin's shared storage, removing all data from it.", + "doc": "

    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.

    \n

    The clear() method of the SharedStorage interface clears the current origin's shared storage, removing all data from it.", "returns": "A Promise that fulfills with undefined." }, "sharedstorage.delete": { "url": "$MDN_URL$/web/api/sharedstorage/delete", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13248,10 +13420,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The delete() method of the SharedStorage interface deletes an existing key-value pair from the current origin's shared storage.", + "doc": "

    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.

    \n

    The delete() method of the SharedStorage interface deletes an existing key-value pair from the current origin's shared storage.", "parameters": { "key": "A string representing the key of the key-value pair you want to delete." }, @@ -13260,8 +13429,8 @@ "sharedstorage.set": { "url": "$MDN_URL$/web/api/sharedstorage/set", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13269,10 +13438,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The set() method of the SharedStorage interface either stores a new key-value pair in the current origin's shared storage or updates an existing one.", + "doc": "

    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.

    \n

    The set() method of the SharedStorage interface either stores a new key-value pair in the current origin's shared storage or updates an existing one.", "parameters": { "key": "A string representing the key in the key-value pair that you want to add or update.", "value": "A string representing the value you want to add or update.", @@ -13282,15 +13448,15 @@ }, "sharedstorageoperation": { "url": "$MDN_URL$/web/api/sharedstorageoperation", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorageOperation interface of the Shared Storage API represents the base class for all output gate operation types.\n

    The output gate types are detailed below:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    NameDescriptionDefined byInvoked by
    URL SelectionUsed to select a URL to display to the user based on shared storage data.SharedStorageSelectURLOperationselectURL()
    RunA generic way to process some shared storage data. Used, for example, by the Private Aggregation API to process shared storage data and generate aggregated reports. SharedStorageRunOperationrun()
    " + "doc": "

    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.

    \n

    The SharedStorageOperation interface of the Shared Storage API represents the base class for all output gate operation types.\n

    The output gate types are detailed below:\n

    \n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
    NameDescriptionDefined byInvoked by
    URL SelectionUsed to select a URL to display to the user based on shared storage data.SharedStorageSelectURLOperationselectURL()
    RunA generic way to process some shared storage data. Used, for example, by the Private Aggregation API to process shared storage data and generate aggregated reports. SharedStorageRunOperationrun()
    " }, "sharedstoragerunoperation": { "url": "$MDN_URL$/web/api/sharedstoragerunoperation", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorageRunOperation interface of the Shared Storage API represents a Run output gate operation." + "doc": "

    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.

    \n

    The SharedStorageRunOperation interface of the Shared Storage API represents a Run output gate operation." }, "sharedstoragerunoperation.run": { "url": "$MDN_URL$/web/api/sharedstoragerunoperation/run", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The run() method of the\nSharedStorageRunOperation interface defines the structure to which the run() method defined inside a Run output gate operation should conform.", + "doc": "

    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.

    \n

    The run() method of the\nSharedStorageRunOperation interface defines the structure to which the run() method defined inside a Run output gate operation should conform.", "parameters": { "data": "An object representing any data required for executing the operation." }, @@ -13298,11 +13464,11 @@ }, "sharedstorageselecturloperation": { "url": "$MDN_URL$/web/api/sharedstorageselecturloperation", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorageSelectURLOperation interface of the Shared Storage API represents a URL Selection output gate operation." + "doc": "

    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.

    \n

    The SharedStorageSelectURLOperation interface of the Shared Storage API represents a URL Selection output gate operation." }, "sharedstorageselecturloperation.run": { "url": "$MDN_URL$/web/api/sharedstorageselecturloperation/run", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The run() method of the SharedStorageSelectURLOperation interface defines the structure to which the run() method defined inside a URL Selection output gate operation should conform.", + "doc": "

    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.

    \n

    The run() method of the SharedStorageSelectURLOperation interface defines the structure to which the run() method defined inside a URL Selection output gate operation should conform.", "parameters": { "urls": "An array of objects representing the URLs to be chosen by the URL Selection operation. Each object contains two properties:\n

    \n
    url
    \n
    \n

    A string representing the URL.\n

    \n
    reportingMetadata Optional
    \n
    \n

    An object containing properties where names are event types and values are URLs pointing to reporting destinations, for example \"click\" : \"my-reports/report1.html\". The URLs act as destinations for reports submitted with a destination of type \"shared-storage-select-url\", typically submitted via a Fence.reportEvent() or Fence.setReportEventDataForAutomaticBeacons() method call.\n

    \n
    ", "data": "An object representing any data required for executing the operation." @@ -13312,8 +13478,8 @@ "sharedstorageworklet": { "url": "$MDN_URL$/web/api/sharedstorageworklet", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13321,16 +13487,13 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorageWorklet interface of the Shared Storage API represents the shared storage worklet for the current origin.\n

    SharedStorageWorklet does not have its own properties or methods. Rather, it inherits the addModule() method from the Worklet interface. This method is used for adding a module.\n

    Unlike a regular Worklet:\n

    \n

    SharedStorageWorklet is accessed via WindowSharedStorage.worklet." + "doc": "

    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.

    \n

    The SharedStorageWorklet interface of the Shared Storage API represents the shared storage worklet for the current origin.\n

    SharedStorageWorklet does not have its own properties or methods. Rather, it inherits the addModule() method from the Worklet interface. This method is used for adding a module.\n

    Unlike a regular Worklet:\n

    \n

    SharedStorageWorklet is accessed via WindowSharedStorage.worklet." }, "sharedstorageworkletglobalscope": { "url": "$MDN_URL$/web/api/sharedstorageworkletglobalscope", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13338,16 +13501,13 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SharedStorageWorkletGlobalScope interface of the Shared Storage API represents the global scope of a SharedStorageWorklet module." + "doc": "

    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.

    \n

    The SharedStorageWorkletGlobalScope interface of the Shared Storage API represents the global scope of a SharedStorageWorklet module." }, "sharedstorageworkletglobalscope.register": { "url": "$MDN_URL$/web/api/sharedstorageworkletglobalscope/register", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13355,10 +13515,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The register() method of the\nSharedStorageWorkletGlobalScope interface registers an operation defined inside the current worklet module.", + "doc": "

    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.

    \n

    The register() method of the\nSharedStorageWorkletGlobalScope interface registers an operation defined inside the current worklet module.", "parameters": { "name": "A string representing the name with which you want to register the operation. When the operation is invoked (say via WindowSharedStorage.run() or WindowSharedStorage.selectURL()), this name is used to identify the operation you want to run.", "operationCtor": "A string representing the class name of the operation to be registered. This is the class constructor that is invoked when the operation is run." @@ -13371,8 +13528,8 @@ "sharedstorageworkletglobalscope.sharedstorage": { "url": "$MDN_URL$/web/api/sharedstorageworkletglobalscope/sharedstorage", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -13380,10 +13537,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The context read-only property of the\nSharedStorageWorkletGlobalScope interface contains a WorkletSharedStorage object instance, which represents the shared storage for a particular origin as exposed to a worklet context." + "doc": "

    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.

    \n

    The context read-only property of the\nSharedStorageWorkletGlobalScope interface contains a WorkletSharedStorage object instance, which represents the shared storage for a particular origin as exposed to a worklet context." }, "sharedworker": { "url": "$MDN_URL$/web/api/sharedworker", @@ -13440,16 +13594,17 @@ "baseline": { "level": "NONE" }, - "doc": "The SharedWorker() constructor creates a\nSharedWorker object that executes the script at the specified URL. This\nscript must obey the same-origin policy.\n

    \n

    Note:\nThere is disagreement among browser manufacturers about\nwhether a data URL is of the same origin or not. Although Firefox 10.0\nand later accept data URLs, that's not the case in all other\nbrowsers.\n

    ", + "doc": "
    \n

    Warning:\nThis script passed to the url element is executed.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.\nSee Security considerations in the Worker() constructor for more information.\n

    \n

    The SharedWorker() constructor creates a SharedWorker object that executes the script at the specified URL.", "parameters": { - "url": "A string representing the URL of the script the worker will\nexecute. It must obey the same-origin policy.", - "name": "A string specifying an identifying name for the\nSharedWorkerGlobalScope representing the scope of the worker, which is useful for creating new instances of the same SharedWorker and debugging.", - "options": "An object containing option properties that can set when creating the object\ninstance. Available properties are as follows:\n

    \n
    type
    \n
    \n

    A string specifying the type of worker to\ncreate. The value can be classic or module. If not\nspecified, the default used is classic.\n

    \n
    credentials
    \n
    \n

    A string specifying the type of\ncredentials to use for the worker. The value can be omit,\nsame-origin, or include. If not\nspecified, or if type is classic, the default used is\nomit (no credentials required).\n

    \n
    name
    \n
    \n

    A string specifying an\nidentifying name for the SharedWorkerGlobalScope representing the\nscope of the worker, which is mainly useful for debugging purposes.\n

    \n
    sameSiteCookies
    \n
    \n

    A string indicating which SameSite cookies\nshould be available to the worker. Can have one of the following two values:\n

    \n
    'all'
    \n
    \n

    SameSite=Strict, SameSite=Lax, and SameSite=None cookies will all be available to the worker.\nThis option is only supported in first-party contexts, and is the default in first-party contexts.\n

    \n
    'none'
    \n
    \n

    Only SameSite=None cookies will be available to the worker. This option is supported in first-party\nand third-party contexts, and is the default in third-party contexts.\n

    \n
    \n
    \n
    " + "url": "A TrustedScriptURL object or a string representing the URL of the script or module that the worker will execute.\nThis must be same-origin with the caller's document, or a blob: or data: URL.\nThe URL is resolved relative to the current HTML page's location.", + "name": "A string specifying an identifying name for the SharedWorkerGlobalScope representing the scope of the worker, which is useful for creating new instances of the same SharedWorker and debugging.", + "options": "An object containing option properties that can set when creating the object instance.\nAvailable properties are as follows:\n
    \n
    type
    \n
    \n

    A string specifying the type of worker to create.\nThe value can be classic or module.\nThe default used is classic.\n

    \n
    credentials
    \n
    \n

    A string specifying whether the browser sends credentials when importing modules into a module worker.\nThe allowed values are the same as can be passed to the fetch() request: omit, same-origin, or include.\nThe default is same-origin (only include credentials for same-origin requests).\n

    This is ignored for classic workers.\n

    \n
    name
    \n
    \n

    A string specifying an\nidentifying name for the SharedWorkerGlobalScope representing the scope of the worker, which is mainly useful for debugging purposes.\n

    \n
    sameSiteCookies
    \n
    \n

    A string indicating which SameSite cookies should be available to the worker.\nCan have one of the following two values:\n

    \n
    'all'
    \n
    \n

    SameSite=Strict, SameSite=Lax, and SameSite=None cookies will all be available to the worker.\nThis option is only supported in first-party contexts, and is the default in first-party contexts.\n

    \n
    'none'
    \n
    \n

    Only SameSite=None cookies will be available to the worker.\nThis option is supported in first-party and third-party contexts, and is the default in third-party contexts.\n

    \n
    \n
    \n
    " }, "throws": { "SecurityError DOMException": "Thrown if the document is not allowed to start workers, for example if the URL has an invalid syntax or if the same-origin policy is violated, or if the sameSiteCookies value is not supported in the given context.", - "NetworkError DOMException": "Thrown if the MIME type of the worker script is incorrect. It should always be text/javascript (for historical reasons other JavaScript MIME types may be accepted).", - "SyntaxError DOMException": "Thrown if url cannot be parsed." + "NetworkError DOMException": "Thrown if the MIME type of the worker script is incorrect.\nIt should always be text/javascript (for historical reasons other JavaScript MIME types may be accepted).", + "SyntaxError DOMException": "Thrown if url cannot be parsed.", + "TypeError": "Thrown if the url parameter is a string when Trusted Types are enforced by a CSP and no default policy is defined." } }, "sharedworkerglobalscope": { @@ -13525,7 +13680,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SnapEvent interface defines the event object for the scrollsnapchanging and scrollsnapchange events. Respectively, these fire on a scroll container when the browser determines that a new scroll snap target is pending (will be selected when the current scroll gesture ends), and when a new snap target is selected.\n

    These events can be used to run code in response to new elements being snapped to; SnapEvent exposes references to the element snapped to in the inline and/or block direction. The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container:\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SnapEvent interface defines the event object for the scrollsnapchanging and scrollsnapchange events. Respectively, these fire on a scroll container when the browser determines that a new scroll snap target is pending (will be selected when the current scroll gesture ends), and when a new snap target is selected.\n

    These events can be used to run code in response to new elements being snapped to; SnapEvent exposes references to the element snapped to in the inline and/or block direction. The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container:\n

    " }, "snapevent.snapevent": { "url": "$MDN_URL$/web/api/snapevent/snapevent", @@ -13558,7 +13713,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The snapTargetBlock read-only property of the\nSnapEvent interface returns a reference to the element snapped to in the block direction when the event fired.\n

    Specifically:\n

    \n

    The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container. snapTargetBlock only returns an element reference if the snap axis is specified as block (or a physical axis value that equates to block in the current writing mode) or both." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The snapTargetBlock read-only property of the\nSnapEvent interface returns a reference to the element snapped to in the block direction when the event fired.\n

    Specifically:\n

    \n

    The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container. snapTargetBlock only returns an element reference if the snap axis is specified as block (or a physical axis value that equates to block in the current writing mode) or both." }, "snapevent.snaptargetinline": { "url": "$MDN_URL$/web/api/snapevent/snaptargetinline", @@ -13575,7 +13730,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The snapTargetInline read-only property of the\nSnapEvent interface returns a reference to the element snapped to in the inline direction when the event fired.\n

    Specifically:\n

    \n

    The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container. snapTargetInline only returns an element reference if the snap axis is specified as inline (or a physical axis value that equates to inline in the current writing mode) or both." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The snapTargetInline read-only property of the\nSnapEvent interface returns a reference to the element snapped to in the inline direction when the event fired.\n

    Specifically:\n

    \n

    The property values available on SnapEvent correspond directly to the value of the scroll-snap-type CSS property set on the scroll container. snapTargetInline only returns an element reference if the snap axis is specified as inline (or a physical axis value that equates to inline in the current writing mode) or both." }, "sourcebuffer": { "url": "$MDN_URL$/web/api/sourcebuffer", @@ -13881,7 +14036,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The updating read-only property of the\nSourceBuffer interface indicates whether the SourceBuffer is\ncurrently being updated — i.e., whether an SourceBuffer.appendBuffer() or SourceBuffer.remove()\noperation is currently in progress." + "doc": "

    Note: This feature is available in Dedicated Web Workers.

    \n

    The updating read-only property of the\nSourceBuffer interface indicates whether the SourceBuffer is\ncurrently being updated — i.e., whether an appendBuffer() or remove()\noperation is currently in progress." }, "sourcebuffer.videotracks": { "url": "$MDN_URL$/web/api/sourcebuffer/videotracks", @@ -14563,8 +14718,8 @@ }, "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The SpeechRecognitionPhrase() constructor creates a new SpeechRecognitionPhrase object.\n

    An array of SpeechRecognitionPhrase objects is passed into the speech recognition engine via the SpeechRecognition.phrases property for contextual biasing.", "parameters": { - "boost": "A floating point number between 0.0 and 10.0 (inclusive) that represents the weight you want to apply to the phrase. This value is roughly equivalent to the natural log of the number of times more likely the website thinks this phrase to appear than what the speech recognition model knows. Higher values make the phrase more likely to be recognized. A value of 0.0 means the phrase is not boosted at all, whereas a value of 10.0 means the phrase is extremely likely to appear. If not specified, the boost defaults to 1.0.\n

    \n

    Note:\nA high value such as 9.0 or 10.0 might make the recognition engine erroneously recognize other phrases as the specified phrase. Therefore, such values should be used rarely when constructing SpeechRecognitionPhrase objects.\n

    ", - "phrase": "A string containing a word or phrase you want boosted." + "phrase": "A string containing a word or phrase you want boosted.", + "boost": "A floating point number between 0.0 and 10.0 (inclusive) that represents the weight you want to apply to the phrase. This value is roughly equivalent to the natural log of the number of times more likely the website thinks this phrase to appear than what the speech recognition model knows. Higher values make the phrase more likely to be recognized. A value of 0.0 means the phrase is not boosted at all, whereas a value of 10.0 means the phrase is extremely likely to appear. If not specified, the boost defaults to 1.0.\n
    \n

    Note:\nA high value such as 9.0 or 10.0 might make the recognition engine erroneously recognize other phrases as the specified phrase. Therefore, such values should be used rarely when constructing SpeechRecognitionPhrase objects.\n

    " }, "returns": "A new SpeechRecognitionPhrase object.", "throws": { @@ -15468,114 +15623,114 @@ "doc": "The DOM StaticRange interface extends AbstractRange to provide a method to specify a range of content in the DOM whose contents don't update to reflect changes which occur within the DOM tree.\n

    This interface offers the same set of properties and methods as AbstractRange.\n

    AbstractRange and StaticRange are not available from web workers." }, "staticrange.collapsed": { - "url": "$MDN_URL$/web/api/staticrange/collapsed", + "url": "$MDN_URL$/web/api/abstractrange/collapsed", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "60", - "ChromeAndroid": "60", - "Edge": "18", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "69", "FirefoxAndroid": "79", - "Opera": "47", - "Safari": "10.1", - "SafariIOS": "10.3" + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2020-07-28", - "highDate": "2023-01-28" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The collapsed read-only property\nof the StaticRange interface returns true if the range's\nstart position and end position are the same." + "doc": "The read-only collapsed property of the AbstractRange interface returns true if the range's start position and end position are the same.\n

    A collapsed range is empty (containing no content), and specifies a single point in a DOM tree. To collapse a range, see the Range.collapse() method." }, "staticrange.endcontainer": { - "url": "$MDN_URL$/web/api/staticrange/endcontainer", + "url": "$MDN_URL$/web/api/abstractrange/endcontainer", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "60", - "ChromeAndroid": "60", - "Edge": "18", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "69", "FirefoxAndroid": "79", - "Opera": "47", - "Safari": "10.1", - "SafariIOS": "10.3" + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2020-07-28", - "highDate": "2023-01-28" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The endContainer property of the StaticRange interface returns the end Node for the range." + "doc": "The read-only endContainer property of the AbstractRange interface returns the Node in which the end of the range is located.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "staticrange.endoffset": { - "url": "$MDN_URL$/web/api/staticrange/endoffset", + "url": "$MDN_URL$/web/api/abstractrange/endoffset", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "60", - "ChromeAndroid": "60", - "Edge": "18", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "69", "FirefoxAndroid": "79", - "Opera": "47", - "Safari": "10.1", - "SafariIOS": "10.3" + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2020-07-28", - "highDate": "2023-01-28" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The endOffset property of the StaticRange\ninterface returns the offset into the end node of the range's end position." + "doc": "The endOffset property of the AbstractRange interface returns the offset into the end node of the range's end position.\n

    To change the end position, use the Range.setEnd() method or a similar one." }, "staticrange.startcontainer": { - "url": "$MDN_URL$/web/api/staticrange/startcontainer", + "url": "$MDN_URL$/web/api/abstractrange/startcontainer", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "60", - "ChromeAndroid": "60", - "Edge": "18", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "69", "FirefoxAndroid": "79", - "Opera": "47", - "Safari": "10.1", - "SafariIOS": "10.3" + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2020-07-28", - "highDate": "2023-01-28" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The read-only startContainer\nproperty of the StaticRange interface returns the start\nNode for the range." + "doc": "The read-only startContainer property of the AbstractRange interface returns the Node in which the start of the range is located.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "staticrange.startoffset": { - "url": "$MDN_URL$/web/api/staticrange/startoffset", + "url": "$MDN_URL$/web/api/abstractrange/startoffset", "status": [ "StandardTrack" ], "compatibility": { - "Chrome": "60", - "ChromeAndroid": "60", - "Edge": "18", + "Chrome": "90", + "ChromeAndroid": "90", + "Edge": "90", "Firefox": "69", "FirefoxAndroid": "79", - "Opera": "47", - "Safari": "10.1", - "SafariIOS": "10.3" + "Opera": "76", + "Safari": "14.1", + "SafariIOS": "14.5" }, "baseline": { "level": "HIGH", - "lowDate": "2020-07-28", - "highDate": "2023-01-28" + "lowDate": "2021-04-26", + "highDate": "2023-10-26" }, - "doc": "The read-only startOffset\nproperty of the StaticRange interface returns the offset into the start\nnode of the range's start position." + "doc": "The read-only startOffset property of the AbstractRange interface returns the offset into the start node of the range's start position.\n

    To change the start position, use the Range.setStart() method or a similar one." }, "staticrange.staticrange": { "url": "$MDN_URL$/web/api/staticrange/staticrange", @@ -16284,7 +16439,7 @@ "lowDate": "2021-12-13", "highDate": "2024-06-13" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The StorageManager interface of the Storage API provides an interface for managing persistence permissions and estimating available storage. You can get a reference to this interface using either navigator.storage or WorkerNavigator.storage." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The StorageManager interface of the Storage API provides an interface for managing persistence permissions and estimating available storage. You can get a reference to this interface using either navigator.storage or WorkerNavigator.storage." }, "storagemanager.estimate": { "url": "$MDN_URL$/web/api/storagemanager/estimate", @@ -16305,7 +16460,7 @@ "level": "LOW", "lowDate": "2023-09-18" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The estimate() method of the StorageManager interface asks the Storage Manager for how much storage the current origin takes up (usage), and how much space is available (quota).\n

    This method operates asynchronously, so it returns a Promise which resolves once the information is available. The promise's fulfillment handler is called with an object containing the usage and quota data.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The estimate() method of the StorageManager interface asks the Storage Manager for how much storage the current origin takes up (usage), and how much space is available (quota).\n

    This method operates asynchronously, so it returns a Promise which resolves once the information is available. The promise's fulfillment handler is called with an object containing the usage and quota data.", "returns": "A Promise that resolves to an object with the following properties:\n

    \n
    quota
    \n
    \n

    A numeric value in bytes which provides a conservative approximation of the total storage the user's device or computer has available for the site origin or Web app. It's possible that there's more than this amount of space available though you can't rely on that being the case.\n

    \n
    usage
    \n
    \n

    A numeric value in bytes approximating the amount of storage space currently being used by the site or Web app, out of the available space as indicated by quota. Unit is byte.\n

    \n
    usageDetails \nNon-standard\n
    \n
    \n

    An object containing a breakdown of usage by storage system. All included properties will have a usage greater than 0 and any storage system with 0 usage will be excluded from the object.\n

    \n
    \n
    \n

    Note:\nThe returned values are not exact: between compression, deduplication, and obfuscation for security reasons, they will be imprecise.\n

    \n

    You may find that the quota varies from origin to origin. This variance is based on factors such as:\n

    ", "throws": { "TypeError": "Thrown if obtaining a local storage shelf failed. For example, if the current origin is an opaque origin or if the user has disabled storage." @@ -16331,7 +16486,7 @@ "lowDate": "2023-03-14", "highDate": "2025-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDirectory() method of the StorageManager interface is used to obtain a reference to a FileSystemDirectoryHandle object allowing access to a directory and its contents, stored in the origin private file system (OPFS).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDirectory() method of the StorageManager interface is used to obtain a reference to a FileSystemDirectoryHandle object allowing access to a directory and its contents, stored in the origin private file system (OPFS).", "returns": "A Promise that fulfills with a FileSystemDirectoryHandle object.", "throws": { "SecurityError DOMException": "Thrown if the browser is not able to map the requested directory to the local OPFS, for example due to storage or memory constraints. Also thrown in some browsers if getDirectory() is called in private browsing mode.", @@ -16358,7 +16513,7 @@ "lowDate": "2021-12-13", "highDate": "2024-06-13" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The persist() method of the StorageManager interface requests permission to use persistent storage, and returns a Promise that resolves to true if permission is granted and bucket mode is persistent, and false otherwise. The browser may or may not honor the request, depending on browser-specific rules. (For more details, see the guide to Storage quotas and eviction criteria.)\n

    \n

    Note:\nThis method is not available in Web Workers, though the StorageManager interface is.\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The persist() method of the StorageManager interface requests permission to use persistent storage, and returns a Promise that resolves to true if permission is granted and bucket mode is persistent, and false otherwise. The browser may or may not honor the request, depending on browser-specific rules. (For more details, see the guide to Storage quotas and eviction criteria.)\n

    \n

    Note:\nThis method is not available in Web Workers, though the StorageManager interface is.\n

    ", "returns": "A Promise that resolves to a Boolean.", "throws": { "TypeError": "Thrown if obtaining a local storage shelf failed. For example, if the current origin is an opaque origin or if the user has disabled storage." @@ -16384,7 +16539,7 @@ "lowDate": "2021-12-13", "highDate": "2024-06-13" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The persisted() method of the StorageManager interface returns a Promise that resolves to true if your site's storage bucket is persistent.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The persisted() method of the StorageManager interface returns a Promise that resolves to true if your site's storage bucket is persistent.", "returns": "A Promise that resolves to a Boolean.", "throws": { "TypeError": "Thrown if obtaining a local storage shelf failed. For example, if the current origin is an opaque origin or if the user has disabled storage." @@ -16795,7 +16950,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The media property of the StyleSheet interface specifies the intended destination media for style information. It is a read-only, array-like MediaList object and can be removed with deleteMedium() and added with appendMedium()." + "doc": "The read-only media property of the StyleSheet interface contains a MediaList object representing the intended destination media for style information." }, "stylesheet.ownernode": { "url": "$MDN_URL$/web/api/stylesheet/ownernode", @@ -17048,7 +17203,7 @@ "lowDate": "2017-09-19", "highDate": "2020-03-19" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The SubtleCrypto interface of the Web Crypto API provides a number of low-level cryptographic functions.\n

    The interface name includes the term \"subtle\" to indicate that many of its algorithms have subtle usage requirements, and hence that it must be used carefully in order to provide suitable security guarantees.\n

    An instance of SubtleCrypto is available as the subtle property of the Crypto interface, which in turn is available in windows through the Window.crypto property and in workers through the WorkerGlobalScope.crypto property.\n

    \n

    Warning:\nThis API provides a number of low-level cryptographic primitives. It's very easy to misuse them, and the pitfalls involved can be very subtle.\n

    Even assuming you use the basic cryptographic functions correctly, secure key management and overall security system design are extremely hard to get right, and are generally the domain of specialist security experts.\n

    Errors in security system design and implementation can make the security of the system completely ineffective.\n

    Please learn and experiment, but don't guarantee or imply the security of your work before an individual knowledgeable in this subject matter thoroughly reviews it. The Crypto 101 Course can be a great place to start learning about the design and implementation of secure systems.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The SubtleCrypto interface of the Web Crypto API provides a number of low-level cryptographic functions.\n

    The interface name includes the term \"subtle\" to indicate that many of its algorithms have subtle usage requirements, and hence that it must be used carefully in order to provide suitable security guarantees.\n

    An instance of SubtleCrypto is available as the subtle property of the Crypto interface, which in turn is available in windows through the Window.crypto property and in workers through the WorkerGlobalScope.crypto property.\n

    \n

    Warning:\nThis API provides a number of low-level cryptographic primitives. It's very easy to misuse them, and the pitfalls involved can be very subtle.\n

    Even assuming you use the basic cryptographic functions correctly, secure key management and overall security system design are extremely hard to get right, and are generally the domain of specialist security experts.\n

    Errors in security system design and implementation can make the security of the system completely ineffective.\n

    Please learn and experiment, but don't guarantee or imply the security of your work before an individual knowledgeable in this subject matter thoroughly reviews it. The Crypto 101 Course can be a great place to start learning about the design and implementation of secure systems.\n

    " }, "subtlecrypto.decrypt": { "url": "$MDN_URL$/web/api/subtlecrypto/decrypt", @@ -17072,7 +17227,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The decrypt() method of the SubtleCrypto interface decrypts some encrypted data.\nIt takes as arguments a key to decrypt with, some optional extra parameters, and the data to decrypt (also known as \"ciphertext\").\nIt returns a Promise which will be fulfilled with the decrypted data (also known as \"plaintext\").", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The decrypt() method of the SubtleCrypto interface decrypts some encrypted data.\nIt takes as arguments a key to decrypt with, some optional extra parameters, and the data to decrypt (also known as \"ciphertext\").\nIt returns a Promise which will be fulfilled with the decrypted data (also known as \"plaintext\").", "parameters": { "algorithm": "An object specifying the algorithm to be used, and any extra parameters as required.\nThe values given for the extra parameters must match those passed into the corresponding encrypt() call.\n

    ", "key": "A CryptoKey containing the key to be used for decryption.\nIf using RSA-OAEP, this is the privateKey property of the CryptoKeyPair object.", @@ -17106,7 +17261,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveBits() method of the\nSubtleCrypto interface can be used to derive an array of bits from a base\nkey.\n

    It takes as its arguments the base key, the derivation algorithm to use, and the length\nof the bits to derive. It returns a Promise\nwhich will be fulfilled with an\nArrayBuffer\ncontaining the derived bits.\n

    This method is very similar to\nSubtleCrypto.deriveKey(),\nexcept that deriveKey() returns a\nCryptoKey object rather than an\nArrayBuffer. Essentially deriveKey() is composed of\nderiveBits() followed by\nimportKey().\n

    This function supports the same derivation algorithms as deriveKey(): ECDH, HKDF, PBKDF2, and X25519.\nSee Supported algorithms for some more detail on these algorithms.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveBits() method of the\nSubtleCrypto interface can be used to derive an array of bits from a base\nkey.\n

    It takes as its arguments the base key, the derivation algorithm to use, and the length\nof the bits to derive. It returns a Promise\nwhich will be fulfilled with an\nArrayBuffer\ncontaining the derived bits.\n

    This method is very similar to\nSubtleCrypto.deriveKey(),\nexcept that deriveKey() returns a\nCryptoKey object rather than an\nArrayBuffer. Essentially deriveKey() is composed of\nderiveBits() followed by\nimportKey().\n

    This function supports the same derivation algorithms as deriveKey(): ECDH, HKDF, PBKDF2, and X25519.\nSee Supported algorithms for some more detail on these algorithms.", "parameters": { "algorithm": "An object defining the derivation algorithm to use.\n

    ", "baseKey": "A CryptoKey representing the input\nto the derivation algorithm. If algorithm is ECDH, this will be the ECDH\nprivate key. Otherwise it will be the initial key material for the derivation\nfunction: for example, for PBKDF2 it might be a password, imported as a\nCryptoKey using SubtleCrypto.importKey().", @@ -17141,7 +17296,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveBits() method of the\nSubtleCrypto interface can be used to derive an array of bits from a base\nkey.\n

    It takes as its arguments the base key, the derivation algorithm to use, and the length\nof the bits to derive. It returns a Promise\nwhich will be fulfilled with an\nArrayBuffer\ncontaining the derived bits.\n

    This method is very similar to\nSubtleCrypto.deriveKey(),\nexcept that deriveKey() returns a\nCryptoKey object rather than an\nArrayBuffer. Essentially deriveKey() is composed of\nderiveBits() followed by\nimportKey().\n

    This function supports the same derivation algorithms as deriveKey(): ECDH, HKDF, PBKDF2, and X25519.\nSee Supported algorithms for some more detail on these algorithms.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveBits() method of the\nSubtleCrypto interface can be used to derive an array of bits from a base\nkey.\n

    It takes as its arguments the base key, the derivation algorithm to use, and the length\nof the bits to derive. It returns a Promise\nwhich will be fulfilled with an\nArrayBuffer\ncontaining the derived bits.\n

    This method is very similar to\nSubtleCrypto.deriveKey(),\nexcept that deriveKey() returns a\nCryptoKey object rather than an\nArrayBuffer. Essentially deriveKey() is composed of\nderiveBits() followed by\nimportKey().\n

    This function supports the same derivation algorithms as deriveKey(): ECDH, HKDF, PBKDF2, and X25519.\nSee Supported algorithms for some more detail on these algorithms.", "parameters": { "algorithm": "An object defining the derivation algorithm to use.\n

    ", "baseKey": "A CryptoKey representing the input\nto the derivation algorithm. If algorithm is ECDH, this will be the ECDH\nprivate key. Otherwise it will be the initial key material for the derivation\nfunction: for example, for PBKDF2 it might be a password, imported as a\nCryptoKey using SubtleCrypto.importKey().", @@ -17176,7 +17331,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveKey() method of the SubtleCrypto interface can be used to derive a secret key from a master key.\n

    It takes as arguments some initial key material, the derivation algorithm to use, and the desired properties for the key to derive.\nIt returns a Promise which will be fulfilled with a CryptoKey object representing the new key.\n

    It's worth noting that the supported key derivation algorithms have quite different characteristics and are appropriate in quite different situations.\nSee Supported algorithms for some more detail on this.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveKey() method of the SubtleCrypto interface can be used to derive a secret key from a master key.\n

    It takes as arguments some initial key material, the derivation algorithm to use, and the desired properties for the key to derive.\nIt returns a Promise which will be fulfilled with a CryptoKey object representing the new key.\n

    It's worth noting that the supported key derivation algorithms have quite different characteristics and are appropriate in quite different situations.\nSee Supported algorithms for some more detail on this.", "parameters": { "algorithm": "An object defining the derivation algorithm to use.\n

    ", "baseKey": "A CryptoKey representing the input to the derivation algorithm.\nIf algorithm is ECDH or X25519, then this will be the ECDH or X25519 private key.\nOtherwise it will be the initial key material for the derivation function: for example, for PBKDF2 it might be a password, imported as a CryptoKey using SubtleCrypto.importKey().", @@ -17213,7 +17368,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveKey() method of the SubtleCrypto interface can be used to derive a secret key from a master key.\n

    It takes as arguments some initial key material, the derivation algorithm to use, and the desired properties for the key to derive.\nIt returns a Promise which will be fulfilled with a CryptoKey object representing the new key.\n

    It's worth noting that the supported key derivation algorithms have quite different characteristics and are appropriate in quite different situations.\nSee Supported algorithms for some more detail on this.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deriveKey() method of the SubtleCrypto interface can be used to derive a secret key from a master key.\n

    It takes as arguments some initial key material, the derivation algorithm to use, and the desired properties for the key to derive.\nIt returns a Promise which will be fulfilled with a CryptoKey object representing the new key.\n

    It's worth noting that the supported key derivation algorithms have quite different characteristics and are appropriate in quite different situations.\nSee Supported algorithms for some more detail on this.", "parameters": { "algorithm": "An object defining the derivation algorithm to use.\n

    ", "baseKey": "A CryptoKey representing the input to the derivation algorithm.\nIf algorithm is ECDH or X25519, then this will be the ECDH or X25519 private key.\nOtherwise it will be the initial key material for the derivation function: for example, for PBKDF2 it might be a password, imported as a CryptoKey using SubtleCrypto.importKey().", @@ -17250,7 +17405,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The digest() method of the SubtleCrypto interface generates a digest of the given data, using the specified hash function.\nA digest is a short fixed-length value derived from some variable-length input.\nCryptographic digests should exhibit collision-resistance, meaning that it's hard to come up with two different inputs that have the same digest value.\n

    It takes as its arguments an identifier for the digest algorithm to use and the data to digest.\nIt returns a Promise which will be fulfilled with the digest.\n

    Note that this API does not support streaming input: you must read the entire input into memory before passing it into the digest function.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The digest() method of the SubtleCrypto interface generates a digest of the given data, using the specified hash function.\nA digest is a short fixed-length value derived from some variable-length input.\nCryptographic digests should exhibit collision-resistance, meaning that it's hard to come up with two different inputs that have the same digest value.\n

    It takes as its arguments an identifier for the digest algorithm to use and the data to digest.\nIt returns a Promise which will be fulfilled with the digest.\n

    Note that this API does not support streaming input: you must read the entire input into memory before passing it into the digest function.", "parameters": { "algorithm": "This may be a string or an object with a single property name that is a string. The string names the hash function to use. Supported values are:\n

    ", "data": "An ArrayBuffer, a TypedArray or a DataView object containing the data to be digested." @@ -17279,7 +17434,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The encrypt() method of the SubtleCrypto interface encrypts data.\n

    It takes as its arguments a key to encrypt with, some algorithm-specific parameters, and the data to encrypt (also known as \"plaintext\").\nIt returns a Promise which will be fulfilled with the encrypted data (also known as \"ciphertext\").", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The encrypt() method of the SubtleCrypto interface encrypts data.\n

    It takes as its arguments a key to encrypt with, some algorithm-specific parameters, and the data to encrypt (also known as \"plaintext\").\nIt returns a Promise which will be fulfilled with the encrypted data (also known as \"ciphertext\").", "parameters": { "algorithm": "An object specifying the algorithm to be used and any extra parameters if required:\n

    ", "key": "A CryptoKey containing the key to be used for encryption.", @@ -17313,7 +17468,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The exportKey() method of the SubtleCrypto\ninterface exports a key: that is, it takes as input a CryptoKey object\nand gives you the key in an external, portable format.\n

    To export a key, the key must have CryptoKey.extractable set to\ntrue.\n

    Keys can be exported in several formats: see Supported formats in the\nSubtleCrypto.importKey()\npage for details.\n

    Keys are not exported in an encrypted format: to encrypt keys when exporting them use\nthe\nSubtleCrypto.wrapKey()\nAPI instead.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The exportKey() method of the SubtleCrypto\ninterface exports a key: that is, it takes as input a CryptoKey object\nand gives you the key in an external, portable format.\n

    To export a key, the key must have CryptoKey.extractable set to\ntrue.\n

    Keys can be exported in several formats: see Supported formats in the\nSubtleCrypto.importKey()\npage for details.\n

    Keys are not exported in an encrypted format: to encrypt keys when exporting them use\nthe\nSubtleCrypto.wrapKey()\nAPI instead.", "parameters": { "format": "A string value describing the data format in which the key should be exported. It can be one of the following:\n

    ", "key": "The CryptoKey to export." @@ -17347,7 +17502,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The exportKey() method of the SubtleCrypto\ninterface exports a key: that is, it takes as input a CryptoKey object\nand gives you the key in an external, portable format.\n

    To export a key, the key must have CryptoKey.extractable set to\ntrue.\n

    Keys can be exported in several formats: see Supported formats in the\nSubtleCrypto.importKey()\npage for details.\n

    Keys are not exported in an encrypted format: to encrypt keys when exporting them use\nthe\nSubtleCrypto.wrapKey()\nAPI instead.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The exportKey() method of the SubtleCrypto\ninterface exports a key: that is, it takes as input a CryptoKey object\nand gives you the key in an external, portable format.\n

    To export a key, the key must have CryptoKey.extractable set to\ntrue.\n

    Keys can be exported in several formats: see Supported formats in the\nSubtleCrypto.importKey()\npage for details.\n

    Keys are not exported in an encrypted format: to encrypt keys when exporting them use\nthe\nSubtleCrypto.wrapKey()\nAPI instead.", "parameters": { "format": "A string value describing the data format in which the key should be exported. It can be one of the following:\n

    ", "key": "The CryptoKey to export." @@ -17380,7 +17535,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The generateKey() method of the SubtleCrypto interface is used to generate a new key (for symmetric algorithms) or key pair (for public-key algorithms).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The generateKey() method of the SubtleCrypto interface is used to generate a new key (for symmetric algorithms) or key pair (for public-key algorithms).", "parameters": { "algorithm": "An object defining the type of key to generate and providing extra algorithm-specific parameters.\n

    ", "extractable": "A boolean value indicating whether it will be possible to export the key using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().", @@ -17412,7 +17567,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The generateKey() method of the SubtleCrypto interface is used to generate a new key (for symmetric algorithms) or key pair (for public-key algorithms).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The generateKey() method of the SubtleCrypto interface is used to generate a new key (for symmetric algorithms) or key pair (for public-key algorithms).", "parameters": { "algorithm": "An object defining the type of key to generate and providing extra algorithm-specific parameters.\n

    ", "extractable": "A boolean value indicating whether it will be possible to export the key using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().", @@ -17444,7 +17599,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importKey() method of the SubtleCrypto\ninterface imports a key: that is, it takes as input a key in an external, portable\nformat and gives you a CryptoKey object that you can use in the Web Crypto API.\n

    The function accepts several import formats: see Supported formats for details.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importKey() method of the SubtleCrypto interface imports a key: that is, it takes as input a key in an external, portable format and gives you a CryptoKey object that you can use in the Web Crypto API.\n

    The function accepts several import formats: see Supported formats for details.", "parameters": { "format": "A string describing the data format of the key to import. It can be one of the following:\n

    ", "keyData": "An ArrayBuffer, a TypedArray,\na DataView, or a JSONWebKey object containing the key in\nthe given format.", @@ -17452,10 +17607,10 @@ "extractable": "A boolean value indicating whether it will be possible to export the key using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().", "keyUsages": "An Array indicating what can be done with the key. Possible array values are:\n" }, - "returns": "A Promise\nthat fulfills with the imported key as a CryptoKey object.", + "returns": "A Promise that fulfills with the imported key as a CryptoKey object.", "throws": { - "SyntaxError DOMException": "Raised when keyUsages is empty but the unwrapped key is of\ntype secret or private.", - "TypeError": "Raised when trying to use an invalid format or if the keyData\nis not suited for that format." + "SyntaxError DOMException": "Raised when keyUsages is empty but the unwrapped key is of type secret or private.", + "TypeError": "Raised when trying to use an invalid format or if the keyData is not suited for that format." } }, "subtlecrypto.importkey.importkey": { @@ -17479,7 +17634,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importKey() method of the SubtleCrypto\ninterface imports a key: that is, it takes as input a key in an external, portable\nformat and gives you a CryptoKey object that you can use in the Web Crypto API.\n

    The function accepts several import formats: see Supported formats for details.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The importKey() method of the SubtleCrypto interface imports a key: that is, it takes as input a key in an external, portable format and gives you a CryptoKey object that you can use in the Web Crypto API.\n

    The function accepts several import formats: see Supported formats for details.", "parameters": { "format": "A string describing the data format of the key to import. It can be one of the following:\n

    ", "keyData": "An ArrayBuffer, a TypedArray,\na DataView, or a JSONWebKey object containing the key in\nthe given format.", @@ -17487,10 +17642,10 @@ "extractable": "A boolean value indicating whether it will be possible to export the key using SubtleCrypto.exportKey() or SubtleCrypto.wrapKey().", "keyUsages": "An Array indicating what can be done with the key. Possible array values are:\n" }, - "returns": "A Promise\nthat fulfills with the imported key as a CryptoKey object.", + "returns": "A Promise that fulfills with the imported key as a CryptoKey object.", "throws": { - "SyntaxError DOMException": "Raised when keyUsages is empty but the unwrapped key is of\ntype secret or private.", - "TypeError": "Raised when trying to use an invalid format or if the keyData\nis not suited for that format." + "SyntaxError DOMException": "Raised when keyUsages is empty but the unwrapped key is of type secret or private.", + "TypeError": "Raised when trying to use an invalid format or if the keyData is not suited for that format." } }, "subtlecrypto.sign": { @@ -17515,7 +17670,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sign() method of the SubtleCrypto interface generates a digital signature.\n

    It takes as its arguments a key to sign with, some algorithm-specific parameters, and the data to sign. It returns a Promise which will be fulfilled with the signature.\n

    You can use the corresponding SubtleCrypto.verify() method to verify the signature.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sign() method of the SubtleCrypto interface generates a digital signature.\n

    It takes as its arguments a key to sign with, some algorithm-specific parameters, and the data to sign. It returns a Promise which will be fulfilled with the signature.\n

    You can use the corresponding SubtleCrypto.verify() method to verify the signature.", "parameters": { "algorithm": "A string or object that specifies the signature algorithm to use and its parameters:\n

    ", "key": "A CryptoKey object containing the key to be used for signing.\nIf algorithm identifies a public-key cryptosystem, this is the private key.", @@ -17548,7 +17703,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sign() method of the SubtleCrypto interface generates a digital signature.\n

    It takes as its arguments a key to sign with, some algorithm-specific parameters, and the data to sign. It returns a Promise which will be fulfilled with the signature.\n

    You can use the corresponding SubtleCrypto.verify() method to verify the signature.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sign() method of the SubtleCrypto interface generates a digital signature.\n

    It takes as its arguments a key to sign with, some algorithm-specific parameters, and the data to sign. It returns a Promise which will be fulfilled with the signature.\n

    You can use the corresponding SubtleCrypto.verify() method to verify the signature.", "parameters": { "algorithm": "A string or object that specifies the signature algorithm to use and its parameters:\n

    ", "key": "A CryptoKey object containing the key to be used for signing.\nIf algorithm identifies a public-key cryptosystem, this is the private key.", @@ -17581,7 +17736,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unwrapKey() method of the SubtleCrypto interface \"unwraps\" a key.\nThis means that it takes as its input a key that has been exported and then encrypted (also called \"wrapped\").\nIt decrypts the key and then imports it, returning a CryptoKey object that can be used in the Web Crypto API.\n

    As with SubtleCrypto.importKey(), you specify the key's import format and other attributes of the key to import details such as whether it is extractable, and which operations it can be used for.\n

    But because unwrapKey() also decrypts the key to be imported, you also need to pass in the key that must be used to decrypt it.\nThis is sometimes called the \"unwrapping key\".\n

    The inverse of unwrapKey() is SubtleCrypto.wrapKey(): while unwrapKey is composed of decrypt + import, wrapKey is composed of encrypt + export.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The unwrapKey() method of the SubtleCrypto interface \"unwraps\" a key.\nThis means that it takes as its input a key that has been exported and then encrypted (also called \"wrapped\").\nIt decrypts the key and then imports it, returning a CryptoKey object that can be used in the Web Crypto API.\n

    As with SubtleCrypto.importKey(), you specify the key's import format and other attributes of the key to import details such as whether it is extractable, and which operations it can be used for.\n

    But because unwrapKey() also decrypts the key to be imported, you also need to pass in the key that must be used to decrypt it.\nThis is sometimes called the \"unwrapping key\".\n

    The inverse of unwrapKey() is SubtleCrypto.wrapKey(): while unwrapKey is composed of decrypt + import, wrapKey is composed of encrypt + export.", "parameters": { "format": "A string describing the data format of the key to unwrap. It can be one of the following:\n

    ", "wrappedKey": "An ArrayBuffer containing the wrapped key in the given format.", @@ -17621,12 +17776,12 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The verify() method of the SubtleCrypto\ninterface verifies a digital signature.\n

    It takes as its arguments a key to verify the signature with, some algorithm-specific parameters, the signature, and the original signed data.\nIt returns a Promise which will be fulfilled with a boolean value indicating whether the signature is valid.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The verify() method of the SubtleCrypto\ninterface verifies a digital signature.\n

    It takes as its arguments a key to verify the signature with, some algorithm-specific parameters, the signature, and the original signed data.\nIt returns a Promise which will be fulfilled with a boolean value indicating whether the signature is valid.", "parameters": { "algorithm": "A string or object defining the algorithm to use, and for some algorithm choices, some extra parameters.\nThe values given for the extra parameters must match those passed into the corresponding sign() call.\n

    ", "key": "A CryptoKey containing the key that will be used to verify the signature.\nIt is the secret key for a symmetric algorithm and the public key for a public-key system.", - "signature": "A ArrayBuffer containing the signature to verify.", - "data": "A ArrayBuffer containing the data whose signature is to be verified." + "signature": "An ArrayBuffer containing the signature to verify.", + "data": "An ArrayBuffer containing the data whose signature is to be verified." }, "returns": "A Promise that fulfills with a\nboolean value: true if the signature is valid, false\notherwise.", "throws": { @@ -17655,12 +17810,12 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The verify() method of the SubtleCrypto\ninterface verifies a digital signature.\n

    It takes as its arguments a key to verify the signature with, some algorithm-specific parameters, the signature, and the original signed data.\nIt returns a Promise which will be fulfilled with a boolean value indicating whether the signature is valid.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The verify() method of the SubtleCrypto\ninterface verifies a digital signature.\n

    It takes as its arguments a key to verify the signature with, some algorithm-specific parameters, the signature, and the original signed data.\nIt returns a Promise which will be fulfilled with a boolean value indicating whether the signature is valid.", "parameters": { "algorithm": "A string or object defining the algorithm to use, and for some algorithm choices, some extra parameters.\nThe values given for the extra parameters must match those passed into the corresponding sign() call.\n

    ", "key": "A CryptoKey containing the key that will be used to verify the signature.\nIt is the secret key for a symmetric algorithm and the public key for a public-key system.", - "signature": "A ArrayBuffer containing the signature to verify.", - "data": "A ArrayBuffer containing the data whose signature is to be verified." + "signature": "An ArrayBuffer containing the signature to verify.", + "data": "An ArrayBuffer containing the data whose signature is to be verified." }, "returns": "A Promise that fulfills with a\nboolean value: true if the signature is valid, false\notherwise.", "throws": { @@ -17689,7 +17844,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The wrapKey() method of the SubtleCrypto interface \"wraps\" a key.\nThis means that it exports the key in an external, portable format, then encrypts the exported key.\nWrapping a key helps protect it in untrusted environments, such as inside an otherwise unprotected data store or in transmission over an unprotected network.\n

    As with SubtleCrypto.exportKey(), you specify an export format for the key.\nTo export a key, it must have CryptoKey.extractable set to true.\n

    But because wrapKey() also encrypts the key to be exported, you also need to pass in the key that must be used to encrypt it.\nThis is sometimes called the \"wrapping key\".\n

    The inverse of wrapKey() is SubtleCrypto.unwrapKey(): while wrapKey is composed of export + encrypt, unwrapKey is composed of import + decrypt.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The wrapKey() method of the SubtleCrypto interface \"wraps\" a key.\nThis means that it exports the key in an external, portable format, then encrypts the exported key.\nWrapping a key helps protect it in untrusted environments, such as inside an otherwise unprotected data store or in transmission over an unprotected network.\n

    As with SubtleCrypto.exportKey(), you specify an export format for the key.\nTo export a key, it must have CryptoKey.extractable set to true.\n

    But because wrapKey() also encrypts the key to be exported, you also need to pass in the key that must be used to encrypt it.\nThis is sometimes called the \"wrapping key\".\n

    The inverse of wrapKey() is SubtleCrypto.unwrapKey(): while wrapKey is composed of export + encrypt, unwrapKey is composed of import + decrypt.", "parameters": { "format": "A string describing the data format in which the key will be exported before it is encrypted. It can be one of the following:\n

    \n
    raw
    \n
    \n

    Raw format.\n

    \n
    pkcs8
    \n
    \n

    PKCS #8 format.\n

    \n
    spki
    \n
    \n

    SubjectPublicKeyInfo format.\n

    \n
    jwk
    \n
    \n

    JSON Web Key format.\n

    \n
    ", "key": "The CryptoKey to wrap.", @@ -17716,7 +17871,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Summarizer interface of the Summarizer API contains all the functionality for this API, including checking AI model availability, creating a new Summarizer instance, using it to generate a new summary, and more." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Summarizer interface of the Summarizer API contains all the functionality for this API, including checking AI model availability, creating a new Summarizer instance, using it to generate a new summary, and more." }, "summarizer.availability": { "url": "$MDN_URL$/web/api/summarizer/availability_static", @@ -17731,7 +17886,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the Summarizer interface returns an enumerated value that indicates whether the browser AI model supports (or will support) a given Summarizer configuration.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the Summarizer interface returns an enumerated value that indicates whether the browser AI model supports (or will support) a given Summarizer configuration.", "parameters": { "options": "An options object specifying a possible configuration for a Summarizer. Possible values include:\n

    \n
    expectedInputLanguages
    \n
    \n

    An array of strings equal to BCP 47 language tags specifying the expected languages of the input text. Defaults to [\"en\"].\n

    \n
    expectedContextLanguages
    \n
    \n

    An array of strings equal to BCP 47 language tags specifying the expected languages of any provided context strings (either the sharedContext passed to the Summarizer, or a context specified during a summarize() or summarizeStreaming() call). Defaults to [\"en\"].\n

    \n
    format
    \n
    \n

    An enumerated value specifying the text format you want summaries returned in. Defaults to markdown.\n

    \n
    length
    \n
    \n

    An enumerated value specifying the relative length for the generated summaries. Defaults to short.\n

    \n
    outputLanguage
    \n
    \n

    A string equal to a BCP 47 language tag specifying the expected language of summaries generated by the Summarizer. Defaults to en.\n

    \n
    type
    \n
    \n

    An enumerated value specifying the type of summary you want this Summarizer to generate. Defaults to key-points.\n

    \n
    " }, @@ -17755,9 +17910,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the Summarizer interface creates a new Summarizer instance from which to generate summaries.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the Summarizer interface creates a new Summarizer instance from which to generate summaries.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", "parameters": { - "options": "An object specifying configuration options for the Summarizer. Possible values include:\n
    \n
    expectedInputLanguages
    \n
    \n

    An array of strings specifying the expected languages of the input text, which should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    expectedContextLanguages
    \n
    \n

    An array of strings specifying the expected languages of any provided context strings (either the sharedContext passed to the Summarizer, or a context specified during a summarize() or summarizeStreaming() call), which should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    format
    \n
    \n

    An enumerated value specifying the text format you want summaries returned in. Defaults to markdown.\n

    \n
    length
    \n
    \n

    An enumerated value specifying the relative length for the generated summaries. Defaults to short.\n

    \n
    monitor
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    outputLanguage
    \n
    \n

    A string specifying the expected language of summaries generated by the Summarizer, which should be a valid BCP 47 language tag. Defaults to en.\n

    \n
    sharedContext
    \n
    \n

    A sharedContext string describing the context the pieces of text to summarize are being used in, which helps the Summarizer generate more suitable summaries.\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the create() operation to be aborted via the associated AbortController.\n

    \n
    type
    \n
    \n

    An enumerated value specifying the type of summary you want this Summarizer to generate. Defaults to key-points.\n

    \n
    " + "options": "An object specifying configuration options for the Summarizer. Possible values include:\n
    \n
    expectedInputLanguages
    \n
    \n

    An array of strings specifying the expected languages of the input text, which should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    expectedContextLanguages
    \n
    \n

    An array of strings specifying the expected languages of any provided context strings (either the sharedContext passed to the Summarizer, or a context specified during a summarize() or summarizeStreaming() call), which should be valid BCP 47 language tags. Defaults to [\"en\"].\n

    \n
    format
    \n
    \n

    An enumerated value specifying the text format you want summaries returned in. Defaults to markdown.\n

    \n
    length
    \n
    \n

    An enumerated value specifying the relative length for the generated summaries. Defaults to short.\n

    \n
    monitor
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    outputLanguage
    \n
    \n

    A string specifying the expected language of summaries generated by the Summarizer, which should be a valid BCP 47 language tag. Defaults to en.\n

    \n
    sharedContext
    \n
    \n

    A sharedContext string describing the context the pieces of text to summarize are being used in, which helps the Summarizer generate more suitable summaries.\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows a create() operation to be aborted via the associated AbortController. The exact effect is dependant on when AbortController.abort() is called:\n

      \n
    • If abort() is called before the create() promise resolves, the create() operation is cancelled.
    • \n
    • If abort() is called after the create() promise fulfills, it has the same effect as calling Summarizer.destroy(): The resources assigned to the resulting Summarizer instance are released, and any ongoing and subsequent Summarizer method calls will reject with an AbortError.
    • \n
    \n
    \n
    type
    \n
    \n

    An enumerated value specifying the type of summary you want this Summarizer to generate. Defaults to key-points.\n

    \n
    " }, "returns": "A Promise that fulfills with a Summarizer object instance.", "throws": { @@ -17779,7 +17934,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the Summarizer interface destroys the Summarizer instance it is called on. It makes sense to destroy Summarizer objects if they are no longer going to be used, as they tie up significant resources in their handling.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the Summarizer interface releases the resources assigned to the Summarizer instance it is called on and stops any further activity on it. This means that any ongoing and subsequent method calls made on the Summarizer will reject with an AbortError.\n

    It makes sense to destroy Summarizer objects if they are no longer being used, as they tie up significant resources in their handling.", "returns": "None (undefined)." }, "summarizer.expectedcontextlanguages": { @@ -17795,7 +17950,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedContextLanguages read-only property of the Summarizer interface returns the languages the context strings should be written in." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedContextLanguages read-only property of the Summarizer interface returns the languages the context strings should be written in." }, "summarizer.expectedinputlanguages": { "url": "$MDN_URL$/web/api/summarizer/expectedinputlanguages", @@ -17810,7 +17965,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedInputLanguages read-only property of the Summarizer interface returns the languages the Summarizer should support." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The expectedInputLanguages read-only property of the Summarizer interface returns the languages the Summarizer should support." }, "summarizer.format": { "url": "$MDN_URL$/web/api/summarizer/format", @@ -17825,7 +17980,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The format read-only property of the Summarizer interface returns the text format summaries will be returned in." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The format read-only property of the Summarizer interface returns the text format summaries will be returned in." }, "summarizer.inputquota": { "url": "$MDN_URL$/web/api/summarizer/inputquota", @@ -17840,7 +17995,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the Summarizer interface returns the input quota available to the browser for generating summaries." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the Summarizer interface returns the input quota available to the browser for generating summaries." }, "summarizer.length": { "url": "$MDN_URL$/web/api/summarizer/length", @@ -17855,7 +18010,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The length read-only property of the Summarizer interface returns the relative length of the generated summaries." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The length read-only property of the Summarizer interface returns the relative length of the generated summaries." }, "summarizer.measureinputusage": { "url": "$MDN_URL$/web/api/summarizer/measureinputusage", @@ -17870,7 +18025,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the Summarizer interface reports how much inputQuota would be used by a summarize operation for a given text input.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the Summarizer interface reports how much inputQuota would be used by a summarize operation for a given text input.", "parameters": { "input": "A string representing the input text you want an input usage measurement for.", "options": "An object specifying configuration options for the measureInputUsage() operation. Possible values include:\n

    \n
    context
    \n
    \n

    A string describing the context the input text would be used in, to help generate a more suitable summary.\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the measureInputUsage() operation to be aborted via the associated AbortController.\n

    \n
    " @@ -17896,7 +18051,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The outputLanguage read-only property of the Summarizer interface returns the language the summary should be generated in." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The outputLanguage read-only property of the Summarizer interface returns the language the summary should be generated in." }, "summarizer.sharedcontext": { "url": "$MDN_URL$/web/api/summarizer/sharedcontext", @@ -17911,7 +18066,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sharedContext read-only property of the Summarizer interface returns a string describing the context the pieces of text to summarize are being used in. This helps the Summarizer to generate more suitable summaries." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sharedContext read-only property of the Summarizer interface returns a string describing the context the pieces of text to summarize are being used in. This helps the Summarizer to generate more suitable summaries." }, "summarizer.summarize": { "url": "$MDN_URL$/web/api/summarizer/summarize", @@ -17926,13 +18081,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The summarize() method of the Summarizer interface generates a new summary string.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The summarize() method of the Summarizer interface generates a new summary string.", "parameters": { "input": "A string representing the text to be summarized.", "options": "An object specifying configuration options for the summarize() operation. Possible values include:\n

    \n
    context
    \n
    \n

    A string describing the context the input text is being used in, which helps the Summarizer generate a more suitable summary.\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the summarize() operation to be aborted via the associated AbortController.\n

    \n
    " }, "returns": "A Promise that fulfills with a string containing the generated summary.", "throws": { + "AbortError DOMException": "Thrown if the Summarizer was previously destroyed (had Summarizer.destroy() called on it, or was aborted via its abort signal after creation).", "InvalidStateError DOMException": "Thrown if the current Document is not active.", "NotAllowedError DOMException": "Thrown if usage of the Summarizer API is blocked by a summarizer Permissions-Policy.", "NotReadableError DOMException": "Thrown if the output summary was filtered by the user agent, for example because it was detected to be harmful, inaccurate, or nonsensical.", @@ -17954,13 +18110,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The summarizeStreaming() method of the Summarizer interface generates a new summary as a ReadableStream.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The summarizeStreaming() method of the Summarizer interface generates a new summary as a ReadableStream.", "parameters": { "input": "A string representing the text to be summarized.", "options": "An object specifying configuration options for the summarizeStreaming() operation. Possible values include:\n

    \n
    context
    \n
    \n

    A string describing the context the input text is being used in, which helps the Summarizer generate a more suitable summary.\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the summarizeStreaming() operation to be aborted via the associated AbortController.\n

    \n
    " }, "returns": "A ReadableStream containing the generated summary.", "throws": { + "AbortError DOMException": "Thrown if the Summarizer was previously destroyed (had Summarizer.destroy() called on it, or was aborted via its abort signal after creation).", "InvalidStateError DOMException": "Thrown if the current Document is not active.", "NotAllowedError DOMException": "Thrown if usage of the Summarizer API is blocked by a summarizer Permissions-Policy.", "NotReadableError DOMException": "Thrown if the output summary was filtered by the user agent, for example because it was detected to be harmful, inaccurate, or nonsensical.", @@ -17982,7 +18139,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the Summarizer interface returns the type of summary that will generated by the Summarizer." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the Summarizer interface returns the type of summary that will generated by the Summarizer." }, "svgaelement": { "url": "$MDN_URL$/web/api/svgaelement", @@ -18063,14 +18220,34 @@ "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "61", - "FirefoxAndroid": "61" + "FirefoxAndroid": "61", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" }, "doc": "The hreflang property of the SVGAElement interface returns a string indicating the language of the linked resource.\n

    This property can be set, to change the URL's hreflang value. It reflects the value of the hreflang attribute." }, + "svgaelement.interestforelement": { + "url": "$MDN_URL$/web/api/svgaelement/interestforelement", + "status": [ + "Experimental" + ], + "compatibility": { + "Chrome": "142", + "ChromeAndroid": "142", + "Edge": "142" + }, + "baseline": { + "level": "NONE" + }, + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The interestForElement property of the SVGAElement interface gets or sets the target element of an interest invoker, in cases where the associated <a> element is specified as an interest invoker.\n

    See Creating an interest invoker for more details." + }, "svgaelement.origin": { "url": "$MDN_URL$/web/api/svgaelement/origin", "doc": "The origin readonly property of the SVGAElement interface returns a string containing the origin of the URL — that is, its scheme, its domain and its port." @@ -18088,7 +18265,11 @@ "status": [ "StandardTrack" ], - "compatibility": {}, + "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144" + }, "baseline": { "level": "NONE" }, @@ -18108,6 +18289,9 @@ "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "61", "FirefoxAndroid": "61" }, @@ -18153,7 +18337,7 @@ "level": "LOW", "lowDate": "2025-05-01" }, - "doc": "The relList read-only property of the SVGAElement returns a live DOMTokenList reflecting the space-separated string <list-of-Link-Types> values of the rel attribute of the SVG <a> element.\n

    The property itself is read-only, meaning you can't substitute the\nDOMTokenList by another one, but the content of the returned list can be\nchanged." + "doc": "The read-only relList property of the SVGAElement returns a live DOMTokenList reflecting the space-separated string <list-of-Link-Types> values of the rel attribute of the SVG <a> element." }, "svgaelement.search": { "url": "$MDN_URL$/web/api/svgaelement/search", @@ -18188,7 +18372,7 @@ "Deprecated" ], "compatibility": {}, - "doc": "The text property of the SVGAElement interface returns a string that is a synonym for the Node.textContent property." + "doc": "

    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.

    \n

    The text property of the SVGAElement interface returns a string that is a synonym for the Node.textContent property." }, "svgaelement.type": { "url": "$MDN_URL$/web/api/svgaelement/type", @@ -18196,8 +18380,13 @@ "StandardTrack" ], "compatibility": { + "Chrome": "144", + "ChromeAndroid": "144", + "Edge": "144", "Firefox": "61", - "FirefoxAndroid": "61" + "FirefoxAndroid": "61", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { "level": "NONE" @@ -18228,7 +18417,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The SVGAngle interface is used to represent a value that can be an <angle> or <number> value.\n

    The SVGAngle returned from SVGAnimatedAngle.animVal and SVGAnimatedAngle.baseVal is read only, but the SVGAngle returned from SVGSVGElement.createSVGAngle() is writable. When designated as read only, attempts to modify the object will result in an exception being thrown.\n

    An SVGAngle object can be associated with a particular element. The associated element is used to determine which element's content attribute to update if the object reflects an attribute. Unless otherwise described, an SVGAngle object is not associated with any element.\n

    Every SVGAngle object operates in one of two modes:\n

      \n
    1. Reflect the base value of a reflected animatable attribute (being exposed through the baseVal member of an SVGAnimatedAngle),
    2. \n
    3. Be detached, which is the case for SVGAngle objects created with SVGSVGElement.createSVGAngle().
    4. \n
    " + "doc": "The SVGAngle interface is used to represent a value that can be an <angle> or <number> value.\n

    The SVGAngle returned from SVGAnimatedAngle.animVal and SVGAnimatedAngle.baseVal is read only, but the SVGAngle returned from SVGSVGElement.createSVGAngle() is writable. When designated as read only, attempts to modify the object will result in an exception being thrown.\n

    An SVGAngle object can be associated with a particular element. The associated element is used to determine which element's content attribute to update if the object reflects an attribute. Unless otherwise described, an SVGAngle object is not associated with any element.\n

    Every SVGAngle object operates in one of two modes:\n

      \n
    1. Reflect the base value of a reflected animatable attribute (being exposed through the baseVal member of an SVGAnimatedAngle),
    2. \n
    3. Be detached, which is the case for SVGAngle objects created with SVGSVGElement.createSVGAngle().
    4. \n
    " }, "svgangle.converttospecifiedunits": { "url": "$MDN_URL$/web/api/svgangle/converttospecifiedunits", @@ -19088,7 +19277,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The animVal read-only property of the SVGAnimatedString interface contains the same value as the SVGAnimatedString.baseVal property. If the given attribute or property is being animated, it contains the current animated value of the attribute or property. If the given attribute or property is not currently being animated, then it contains the same value as baseVal." + "doc": "The animVal read-only property of the SVGAnimatedString interface is a string representing the animated value of the reflected attribute." }, "svganimatedstring.baseval": { "url": "$MDN_URL$/web/api/svganimatedstring/baseval", @@ -19110,7 +19299,10 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "BaseVal gets or sets the base value of the given attribute before any animations are applied. The base value of the given attribute before applying any animations. Setter throws DOMException." + "doc": "
    \n

    Warning:\nThe baseVal property can be used to set the non-animated value of a reflected attribute.\nIn the case of SVGScriptElement.href.baseVal this property represents the URL of an external script loaded into the SVG script element.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings, and enforcing trusted types.\nSee Security considerations in SVGScriptElement.href for more information.\n

    \n

    The baseVal property of the SVGAnimatedString interface gets or sets the base value of the given attribute.\n

    This is the value of the reflected attribute before any animations are applied.", + "throws": { + "TypeError": "Thrown if the reflected attribute's element is SVGScriptElement, and the property is set to a string when Trusted Types are enforced by a CSP, and no default policy is defined." + } }, "svganimatedtransformlist": { "url": "$MDN_URL$/web/api/svganimatedtransformlist", @@ -19926,7 +20118,7 @@ "baseline": { "level": "NONE" }, - "doc": "The attributeStyleMap read-only property of the SVGElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the SVGElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." + "doc": "The attributeStyleMap read-only property of the SVGElement interface returns a live StylePropertyMap object that contains a list of style properties of the element that are defined in the element's inline style attribute, or assigned using the style property of the SVGElement interface via script.\n

    Shorthand properties are expanded. If you set border-top: 1px solid black, the longhand properties (border-top-color, border-top-style, and border-top-width) are set instead.\n

    The main difference between style property and attributeStyleMap property is that, the style property will return a CSSStyleDeclaration object, while the attributeStyleMap property will return a StylePropertyMap object.\n

    Though the property itself is not writable, you could read and write inline styles through the StylePropertyMap object that it returns, just like through the CSSStyleDeclaration object that returns via the style property." }, "svgelement.autofocus": { "url": "$MDN_URL$/web/api/svgelement/autofocus", @@ -20041,7 +20233,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "The nonce property of the SVGElement interface returns the nonce that is used by Content Security Policy to determine whether a given fetch will be allowed to proceed." + "doc": "The nonce property of the SVGElement interface returns the nonce that is used by Content Security Policy to determine whether a given fetch will be allowed to proceed." }, "svgelement.ownersvgelement": { "url": "$MDN_URL$/web/api/svgelement/ownersvgelement", @@ -20085,7 +20277,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only style property of the SVGElement returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." + "doc": "The read-only style property of the SVGElement interface returns the inline style of an element in the form of a live CSSStyleProperties object.\nThis object can be used to get and set the inline styles of an element." }, "svgelement.tabindex": { "url": "$MDN_URL$/web/api/svgelement/tabindex", @@ -20283,7 +20475,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height read-only property of the SVGFEBlendElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's height filter primitive attribute. The attribute is a <length> or a <percentage> relative to the height of the filter region. The default value is 100%. The property value is a length in user coordinate system units.\n

    The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes." + "doc": "The height read-only property of the SVGFEBlendElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's height filter primitive attribute. The attribute is a <length> or a <percentage> relative to the height of the filter region. The default value is 100%. The property value is a length in user coordinate system units.\n

    The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes." }, "svgfeblendelement.in1": { "url": "$MDN_URL$/web/api/svgfeblendelement/in1", @@ -20371,7 +20563,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEBlendElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feBlend> element's result attribute.\nThe <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feBlend> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEBlendElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feBlend> element's result attribute.\nThe <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feBlend> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeblendelement.width": { "url": "$MDN_URL$/web/api/svgfeblendelement/width", @@ -20393,7 +20585,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width read-only property of the SVGFEBlendElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's width filter primitive attribute. The attribute is a <length> or a <percentage> relative to the width of the filter region. The default value is 100%. The property value is a length in user coordinate system units.\n

    The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes." + "doc": "The width read-only property of the SVGFEBlendElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's width filter primitive attribute. The attribute is a <length> or a <percentage> relative to the width of the filter region. The default value is 100%. The property value is a length in user coordinate system units.\n

    The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes." }, "svgfeblendelement.x": { "url": "$MDN_URL$/web/api/svgfeblendelement/x", @@ -20415,7 +20607,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The x read-only property of the SVGFEBlendElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's x filter primitive attribute value. The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute is a <length> or <percentage>. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. If the x attribute is a percent value, the property value is relative to the width of the filter region in user coordinate system units. The default value is 0." + "doc": "The x read-only property of the SVGFEBlendElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's x filter primitive attribute value. The <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute is a <length> or <percentage>. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. If the x attribute is a percent value, the property value is relative to the width of the filter region in user coordinate system units. The default value is 0." }, "svgfeblendelement.y": { "url": "$MDN_URL$/web/api/svgfeblendelement/y", @@ -20437,7 +20629,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The y read-only property of the SVGFEBlendElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's y filter primitive attribute value.\nThe <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute is a <length> or <percentage>. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. If the y attribute is a percent value, the property value is a relative to the height of the filter region in user coordinate system units. The default value is 0." + "doc": "The y read-only property of the SVGFEBlendElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.\n

    It reflects the <feBlend> element's y filter primitive attribute value.\nThe <feBlend> SVG filter blends two input images together using commonly used imaging software blending modes.\n

    The attribute is a <length> or <percentage>. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. If the y attribute is a percent value, the property value is a relative to the height of the filter region in user coordinate system units. The default value is 0." }, "svgfecolormatrixelement": { "url": "$MDN_URL$/web/api/svgfecolormatrixelement", @@ -20525,7 +20717,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEColorMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feColorMatrix> element's result attribute. The <feColorMatrix> filter applies a matrix transformation on the RGB color and alpha values. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feColorMatrix> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEColorMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feColorMatrix> element's result attribute. The <feColorMatrix> filter applies a matrix transformation on the RGB color and alpha values. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feColorMatrix> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfecolormatrixelement.type": { "url": "$MDN_URL$/web/api/svgfecolormatrixelement/type", @@ -20723,7 +20915,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEComponentTransferElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feComponentTransfer> element's result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feComponentTransfer> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEComponentTransferElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feComponentTransfer> element's result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feComponentTransfer> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfecomponenttransferelement.width": { "url": "$MDN_URL$/web/api/svgfecomponenttransferelement/width", @@ -21009,7 +21201,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFECompositeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feComposite> element's result attribute. The <feComposite> SVG filter primitive combines two input images using a Porter-Duff compositing operation. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feComposite> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFECompositeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feComposite> element's result attribute. The <feComposite> SVG filter primitive combines two input images using a Porter-Duff compositing operation. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feComposite> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfecompositeelement.width": { "url": "$MDN_URL$/web/api/svgfecompositeelement/width", @@ -21361,7 +21553,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEConvolveMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feConvolveMatrix> element's result attribute. The <feConvolveMatrix> filter applies a matrix convolution effect, combining pixels in the input image with neighboring pixels to produce a convolution effect such as blurring, edge detection, sharpening, embossing or beveling.\n

    The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feConvolveMatrix> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEConvolveMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feConvolveMatrix> element's result attribute. The <feConvolveMatrix> filter applies a matrix convolution effect, combining pixels in the input image with neighboring pixels to produce a convolution effect such as blurring, edge detection, sharpening, embossing or beveling.\n

    The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feConvolveMatrix> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeconvolvematrixelement.targetx": { "url": "$MDN_URL$/web/api/svgfeconvolvematrixelement/targetx", @@ -21625,7 +21817,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEDiffuseLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feDiffuseLighting> element's result attribute. The filter lights an image using the alpha channel as a bump map. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDiffuseLighting> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEDiffuseLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feDiffuseLighting> element's result attribute. The filter lights an image using the alpha channel as a bump map. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDiffuseLighting> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfediffuselightingelement.surfacescale": { "url": "$MDN_URL$/web/api/svgfediffuselightingelement/surfacescale", @@ -21823,7 +22015,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEDisplacementMapElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feDisplacementMap> element's result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDisplacementMap> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEDisplacementMapElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the <feDisplacementMap> element's result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDisplacementMap> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfedisplacementmapelement.scale": { "url": "$MDN_URL$/web/api/svgfedisplacementmapelement/scale", @@ -22153,7 +22345,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The result read-only property of the SVGFEDropShadowElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDropShadow> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEDropShadowElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feDropShadow> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfedropshadowelement.setstddeviation": { "url": "$MDN_URL$/web/api/svgfedropshadowelement/setstddeviation", @@ -22356,7 +22548,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEFloodElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feFlood> element, which fills an SVG filter subregion with the color and opacity defined by flood-color and flood-opacity. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feFlood> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEFloodElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feFlood> element, which fills an SVG filter subregion with the color and opacity defined by flood-color and flood-opacity. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feFlood> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfefloodelement.width": { "url": "$MDN_URL$/web/api/svgfefloodelement/width", @@ -22598,7 +22790,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEGaussianBlurElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feGaussianBlur> element, which blurs an input image. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feGaussianBlur> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEGaussianBlurElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feGaussianBlur> element, which blurs an input image. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feGaussianBlur> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfegaussianblurelement.setstddeviation": { "url": "$MDN_URL$/web/api/svgfegaussianblurelement/setstddeviation", @@ -22845,7 +23037,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEImageElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feImage> element, which fetches image data from an external source and provides the pixel data as output. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feImage> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEImageElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feImage> element, which fetches image data from an external source and provides the pixel data as output. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feImage> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeimageelement.svgfeimageelement": { "url": "$MDN_URL$/web/api/svgfeimageelement", @@ -22903,7 +23095,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEImageElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feImage> element, which fetches image data from an external source and provides the pixel data as output. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feImage> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEImageElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feImage> element, which fetches image data from an external source and provides the pixel data as output. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feImage> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeimageelement.svgfeimageelement.width": { "url": "$MDN_URL$/web/api/svgfeimageelement/width", @@ -23062,7 +23254,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEMergeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feMerge> element. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feMerge> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEMergeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feMerge> element. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feMerge> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfemergeelement.width": { "url": "$MDN_URL$/web/api/svgfemergeelement/width", @@ -23326,7 +23518,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEMorphologyElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feMorphology> element. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feMorphology> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEMorphologyElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feMorphology> element. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feMorphology> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfemorphologyelement.width": { "url": "$MDN_URL$/web/api/svgfemorphologyelement/width", @@ -23524,7 +23716,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFEOffsetElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.\n

    It reflects the result attribute of the <feOffset> element, which offsets the input image relative to its current position. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feOffset> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFEOffsetElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.\n

    It reflects the result attribute of the <feOffset> element, which offsets the input image relative to its current position. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feOffset> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeoffsetelement.width": { "url": "$MDN_URL$/web/api/svgfeoffsetelement/width", @@ -23808,7 +24000,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFESpecularLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feSpecularLighting> element, which lights a source graphic using the alpha channel as a bump map. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feSpecularLighting> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFESpecularLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feSpecularLighting> element, which lights a source graphic using the alpha channel as a bump map. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feSpecularLighting> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfespecularlightingelement.specularconstant": { "url": "$MDN_URL$/web/api/svgfespecularlightingelement/specularconstant", @@ -24226,7 +24418,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFETileElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.\n

    It reflects the result attribute of the <feTile> element, which fills a target rectangle with a repeated, tiled pattern of an input image. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feTile> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFETileElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.\n

    It reflects the result attribute of the <feTile> element, which fills a target rectangle with a repeated, tiled pattern of an input image. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feTile> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfetileelement.width": { "url": "$MDN_URL$/web/api/svgfetileelement/width", @@ -24424,7 +24616,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The result read-only property of the SVGFETurbulenceElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feTurbulence> element, which allows the synthesis of artificial textures. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feTurbulence> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." + "doc": "The result read-only property of the SVGFETurbulenceElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.\n

    It reflects the result attribute of the <feTurbulence> element, which allows the synthesis of artificial textures. The attribute value is a <custom-ident>. If supplied, then graphics that result from processing this filter primitive can be referenced by an in attribute on a subsequent filter primitive within the same <filter> element.\n

    If no result attribute is defined, the filter's result.baseVal and result.animVal are empty strings, and the output of the <feTurbulence> filter will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute." }, "svgfeturbulenceelement.seed": { "url": "$MDN_URL$/web/api/svgfeturbulenceelement/seed", @@ -26662,7 +26854,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The SVGNumber interface corresponds to the <number> basic data type.\n

    An SVGNumber object can be designated as read only, which means that attempts to modify the object will result in an exception being thrown." + "doc": "The SVGNumber interface corresponds to the <number> basic data type.\n

    An SVGNumber object can be designated as read only, which means that attempts to modify the object will result in an exception being thrown." }, "svgnumber.value": { "url": "$MDN_URL$/web/api/svgnumber/value", @@ -28006,7 +28198,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height property of the SVGRect interface is an alias for the DOMRect.height property. It describes the vertical size of the element. It reflects the SVG element's height attribute and the CSS height property.\n

    The height is a length; it is the distance from the top of element to the bottom of the element in the user coordinate system. Its syntax is the same as that for <length>." + "doc": "The height property of the SVGRect interface is an alias for the DOMRect.height property. It describes the vertical size of the element. It reflects the SVG element's height attribute and the CSS height property.\n

    The height is a length; it is the distance from the top of element to the bottom of the element in the user coordinate system. Its syntax is the same as that for <length>." }, "svgrect.width": { "url": "$MDN_URL$/web/api/svgrect/width", @@ -28028,7 +28220,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width property of the SVGRect interface is an alias for the DOMRect.width property. It describes the horizontal size of the element. It reflects the SVG element's width attribute and the CSS width property.\n

    The width is a length; it is the distance from the left of element to the right of the element in the user coordinate system. Its syntax is the same as that for <length>." + "doc": "The width property of the SVGRect interface is an alias for the DOMRect.width property. It describes the horizontal size of the element. It reflects the SVG element's width attribute and the CSS width property.\n

    The width is a length; it is the distance from the left of element to the right of the element in the user coordinate system. Its syntax is the same as that for <length>." }, "svgrect.x": { "url": "$MDN_URL$/web/api/svgrect/x", @@ -28072,7 +28264,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The y property of the SVGRect interface is an alias for the DOMRect.y property. It describes the vertical coordinate of the position of the element. It reflects the SVG element's y attribute and the CSS y property.\n

    A <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the relevant axis (the y-axis for Y coordinates, the x-axis for X coordinates). Its syntax is the same as that for <length>." + "doc": "The y property of the SVGRect interface is an alias for the DOMRect.y property. It describes the vertical coordinate of the position of the element. It reflects the SVG element's y attribute and the CSS y property.\n

    A <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the relevant axis (the y-axis for Y coordinates, the x-axis for X coordinates). Its syntax is the same as that for <length>." }, "svgrectelement": { "url": "$MDN_URL$/web/api/svgrectelement", @@ -28116,7 +28308,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height read-only property of the SVGRectElement interface describes the vertical size of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's height presentational attribute. The CSS height property takes precedence over the SVG height presentational attribute, so the value may not reflect the elements actual size. The default value is 0." + "doc": "The height read-only property of the SVGRectElement interface describes the vertical size of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's height presentational attribute. The CSS height property takes precedence over the SVG height presentational attribute, so the value may not reflect the elements actual size. The default value is 0." }, "svgrectelement.rx": { "url": "$MDN_URL$/web/api/svgrectelement/rx", @@ -28138,7 +28330,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The rx read-only property of the SVGRectElement interface describes the horizontal curve of the corners of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's rx presentational attribute. The CSS rx property takes precedence over the SVG rx presentational attribute, so the value may not reflect the actual size of the rounded corners. The default value is 0, which draws a rectangle with square corners." + "doc": "The rx read-only property of the SVGRectElement interface describes the horizontal curve of the corners of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's rx presentational attribute. The CSS rx property takes precedence over the SVG rx presentational attribute, so the value may not reflect the actual size of the rounded corners. The default value is 0, which draws a rectangle with square corners." }, "svgrectelement.ry": { "url": "$MDN_URL$/web/api/svgrectelement/ry", @@ -28160,7 +28352,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The ry read-only property of the SVGRectElement interface describes the vertical curve of the corners of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's ry presentational attribute. The CSS ry property takes precedence over the SVG ry presentational attribute, so the value may not reflect the actual size of the rounded corners. The default value is 0, which draws a rectangle with square corners." + "doc": "The ry read-only property of the SVGRectElement interface describes the vertical curve of the corners of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's ry presentational attribute. The CSS ry property takes precedence over the SVG ry presentational attribute, so the value may not reflect the actual size of the rounded corners. The default value is 0, which draws a rectangle with square corners." }, "svgrectelement.width": { "url": "$MDN_URL$/web/api/svgrectelement/width", @@ -28182,7 +28374,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width read-only property of the SVGRectElement interface describes the horizontal size of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's width presentational attribute. The CSS width property takes precedence over the SVG width presentational attribute, so the value may not reflect the elements actual size. The default value is 0." + "doc": "The width read-only property of the SVGRectElement interface describes the horizontal size of an SVG rectangle as a SVGAnimatedLength. The length is in user coordinate system units along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's width presentational attribute. The CSS width property takes precedence over the SVG width presentational attribute, so the value may not reflect the elements actual size. The default value is 0." }, "svgrectelement.x": { "url": "$MDN_URL$/web/api/svgrectelement/x", @@ -28204,7 +28396,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The x read-only property of the SVGRectElement interface describes the horizontal coordinate of the position of an SVG rectangle as a SVGAnimatedLength. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's x geometric attribute value. The CSS x property takes precedence over the SVG x geometric attribute, so the value may not reflect the element's appearance. The default value is 0." + "doc": "The x read-only property of the SVGRectElement interface describes the horizontal coordinate of the position of an SVG rectangle as a SVGAnimatedLength. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's x geometric attribute value. The CSS x property takes precedence over the SVG x geometric attribute, so the value may not reflect the element's appearance. The default value is 0." }, "svgrectelement.y": { "url": "$MDN_URL$/web/api/svgrectelement/y", @@ -28226,7 +28418,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The y read-only property of the SVGRectElement interface describes the vertical coordinate of the position of an SVG rectangle as a SVGAnimatedLength. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's y geometric attribute value. The CSS y property takes precedence over the SVG y attribute, so the value may not reflect the element's appearance. The default value is 0." + "doc": "The y read-only property of the SVGRectElement interface describes the vertical coordinate of the position of an SVG rectangle as a SVGAnimatedLength. The <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <rect> element's y geometric attribute value. The CSS y property takes precedence over the SVG y attribute, so the value may not reflect the element's appearance. The default value is 0." }, "svgrenderingintent": { "url": "$MDN_URL$/web/api/svgrenderingintent", @@ -28279,7 +28471,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The href read-only property of the SVGScriptElement interface reflects the href or xlink:href attribute of the given <script> element." + "doc": "

    \n

    Warning:\nThe href.baseVal property represents the URL of an external script loaded into the SVG script element.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings, and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The href read-only property of the SVGScriptElement interface reflects the href or xlink:href attribute of the given <script> element." }, "svgscriptelement.type": { "url": "$MDN_URL$/web/api/svgscriptelement/type", @@ -28971,7 +29163,7 @@ "highDate": "2018-01-29" }, "doc": "The createSVGPoint() method of the SVGSVGElement interface creates a DOMPoint object outside of any document trees.", - "returns": "An DOMPoint object, initialized to the point (0,0) in the user coordinate system." + "returns": "A DOMPoint object, initialized to the point (0,0) in the user coordinate system." }, "svgsvgelement.createsvgrect": { "url": "$MDN_URL$/web/api/svgsvgelement/createsvgrect", @@ -28993,7 +29185,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The createSVGRect() method of the SVGSVGElement interface creates an DOMRect object outside of any document trees.", + "doc": "The createSVGRect() method of the SVGSVGElement interface creates a DOMRect object outside of any document trees.", "returns": "A DOMRect object, initialized with x, y, width, and height all set to 0." }, "svgsvgelement.createsvgtransform": { @@ -29181,7 +29373,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The height read-only property of the SVGSVGElement interface describes the vertical size of element as an SVGAnimatedLength. It reflects the <svg> element's height attribute, which may not be the SVG's rendered height.\n

    The CSS height property takes precedence over the <svg> element's height attribute, so the value may not reflect the element's appearance. If both the viewBox and height attributes are omitted, the height property reflects that actual height." + "doc": "The height read-only property of the SVGSVGElement interface describes the vertical size of element as an SVGAnimatedLength. It reflects the <svg> element's height attribute, which may not be the SVG's rendered height.\n

    The CSS height property takes precedence over the <svg> element's height attribute, so the value may not reflect the element's appearance. If both the viewBox and height attributes are omitted, the height property reflects that actual height." }, "svgsvgelement.pauseanimations": { "url": "$MDN_URL$/web/api/svgsvgelement/pauseanimations", @@ -29297,7 +29489,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The viewBox read-only property of the SVGSVGElement interface reflects the <svg> element's viewBox attribute as an SVGAnimatedRect.\n

    The property describes the <svg> element's viewBox attribute, which is used to defined the x-coordinate, y-coordinate, width, and height of an <svg> element. The SVGAnimatedRect.baseVal and SVGAnimatedRect.animVal properties are both SVGRect objects, or null if the viewBox is not defined. These objects' components may differ from the SVGSVGElement.x, SVGSVGElement.y, SVGSVGElement.width and SVGSVGElement.height properties, as the x, y, width, and height attributes take precedence over the viewBox attribute.\n

    For non-nested SVG elements, the values of the CSS x, y, width, and height properties take precedence over any element attributes, so the values defined by the viewBox may not be reflected in the element's appearance." + "doc": "The viewBox read-only property of the SVGSVGElement interface reflects the <svg> element's viewBox attribute as an SVGAnimatedRect.\n

    The property describes the <svg> element's viewBox attribute, which is used to defined the x-coordinate, y-coordinate, width, and height of an <svg> element. The SVGAnimatedRect.baseVal and SVGAnimatedRect.animVal properties are both SVGRect objects, or null if the viewBox is not defined. These objects' components may differ from the SVGSVGElement.x, SVGSVGElement.y, SVGSVGElement.width and SVGSVGElement.height properties, as the x, y, width, and height attributes take precedence over the viewBox attribute.\n

    For non-nested SVG elements, the values of the CSS x, y, width, and height properties take precedence over any element attributes, so the values defined by the viewBox may not be reflected in the element's appearance." }, "svgsvgelement.width": { "url": "$MDN_URL$/web/api/svgsvgelement/width", @@ -29319,7 +29511,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The width read-only property of the SVGSVGElement interface describes the horizontal size of element as an SVGAnimatedLength. It reflects the <svg> element's width attribute, which may not be the SVG's rendered width.\n

    The CSS width property takes precedence over the <svg> element's width attribute, so the value may not reflect the element's appearance. If both the viewBox and width attributes are omitted, the width property reflects that actual width." + "doc": "The width read-only property of the SVGSVGElement interface describes the horizontal size of element as an SVGAnimatedLength. It reflects the <svg> element's width attribute, which may not be the SVG's rendered width.\n

    The CSS width property takes precedence over the <svg> element's width attribute, so the value may not reflect the element's appearance. If both the viewBox and width attributes are omitted, the width property reflects that actual width." }, "svgsvgelement.x": { "url": "$MDN_URL$/web/api/svgsvgelement/x", @@ -29341,7 +29533,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The x read-only property of the SVGSVGElement interface describes the horizontal coordinate of the position of that SVG as an SVGAnimatedLength. When an <svg> is nested within another <svg>, the horizontal coordinate is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <svg> element's x geometric attribute. The default value is 0. The x attribute has no effect on outermost <svg> elements; only one nested ones. The CSS x property takes precedence over the <svg> element's x attribute, so the value may not reflect the element's appearance." + "doc": "The x read-only property of the SVGSVGElement interface describes the horizontal coordinate of the position of that SVG as an SVGAnimatedLength. When an <svg> is nested within another <svg>, the horizontal coordinate is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. Its syntax is the same as that for <length>.\n

    It reflects the <svg> element's x geometric attribute. The default value is 0. The x attribute has no effect on outermost <svg> elements; only one nested ones. The CSS x property takes precedence over the <svg> element's x attribute, so the value may not reflect the element's appearance." }, "svgsvgelement.y": { "url": "$MDN_URL$/web/api/svgsvgelement/y", @@ -29363,7 +29555,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The y read-only property of the SVGSVGElement interface describes the vertical coordinate of the position of that SVG as an SVGAnimatedLength. When an <svg> is nested within another <svg>, the vertical coordinate is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <svg> element's y geometric attribute. The default value is 0. The y attribute has no effect on outermost <svg> elements; only on nested ones. The CSS y property takes precedence over the <svg> element's y attribute, so the value may not reflect the element's appearance." + "doc": "The y read-only property of the SVGSVGElement interface describes the vertical coordinate of the position of that SVG as an SVGAnimatedLength. When an <svg> is nested within another <svg>, the vertical coordinate is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the y-axis. Its syntax is the same as that for <length>.\n

    It reflects the <svg> element's y geometric attribute. The default value is 0. The y attribute has no effect on outermost <svg> elements; only on nested ones. The CSS y property takes precedence over the <svg> element's y attribute, so the value may not reflect the element's appearance." }, "svgswitchelement": { "url": "$MDN_URL$/web/api/svgswitchelement", @@ -29497,7 +29689,7 @@ }, "doc": "The getCharNumAtPosition() method of the SVGTextContentElement interface represents the character which caused a text glyph to be rendered at a given position in the coordinate system. Because the relationship between characters and glyphs is not one-to-one, only the first character of the relevant typographic character is returned.\n

    If no character is found at the specified position, -1 is returned.", "parameters": { - "point": "An DOMPoint object; the coordinates (x, y) where the position of the character is to be checked in the user coordinate space." + "point": "A DOMPoint object; the coordinates (x, y) where the position of the character is to be checked in the user coordinate space." }, "returns": "A long; the index of the character that corresponds to the position." }, @@ -29683,7 +29875,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The getSubStringLength() method of the SVGTextContentElement interface represents the computed length of the formatted text advance distance for a substring of text within the element.\n

    Note that this method only accounts for the widths of the glyphs in the substring and any extra spacing inserted by the CSS letter-spacing and word-spacing properties. Visual spacing adjustments made by the x attribute are ignored.", + "doc": "The getSubStringLength() method of the SVGTextContentElement interface represents the computed length of the formatted text advance distance for a substring of text within the element.\n

    Note that this method only accounts for the widths of the glyphs in the substring and any extra spacing inserted by the CSS letter-spacing and word-spacing properties. Visual spacing adjustments made by the x attribute are ignored.", "parameters": { "index": "An integer; the start index of the substring.", "length": "An integer; the number of characters to include in the substring." @@ -31566,7 +31758,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The TextDecoderStream interface of the Encoding API converts a stream of text in a binary encoding, such as UTF-8 etc., to a stream of strings.\nIt is the streaming equivalent of TextDecoder." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The TextDecoderStream interface of the Encoding API converts a stream of text in a binary encoding, such as UTF-8 etc., to a stream of strings.\nIt is the streaming equivalent of TextDecoder.\nIt implements the same shape as a TransformStream, allowing it to be used in ReadableStream.pipeThrough() and similar methods." }, "textdecoderstream.encoding": { "url": "$MDN_URL$/web/api/textdecoderstream/encoding", @@ -31662,7 +31854,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TextDecoderStream interface returns a ReadableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TextDecoderStream interface returns a ReadableStream that emits decoded strings." }, "textdecoderstream.textdecoderstream": { "url": "$MDN_URL$/web/api/textdecoderstream/textdecoderstream", @@ -31717,7 +31909,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TextDecoderStream interface returns a WritableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TextDecoderStream interface returns a WritableStream that accepts binary data, in the form of ArrayBuffer, TypedArray, or DataView chunks (SharedArrayBuffer and its views are also allowed), to be decoded into strings." }, "textencoder": { "url": "$MDN_URL$/web/api/textencoder", @@ -31870,7 +32062,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The TextEncoderStream interface of the Encoding API converts a stream of strings into bytes in the UTF-8 encoding. It is the streaming equivalent of TextEncoder." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The TextEncoderStream interface of the Encoding API converts a stream of strings into bytes in the UTF-8 encoding. It is the streaming equivalent of TextEncoder.\nIt implements the same shape as a TransformStream, allowing it to be used in ReadableStream.pipeThrough() and similar methods." }, "textencoderstream.encoding": { "url": "$MDN_URL$/web/api/textencoderstream/encoding", @@ -31918,7 +32110,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TextEncoderStream interface returns a ReadableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TextEncoderStream interface returns a ReadableStream that emits encoded binary data as Uint8Array chunks." }, "textencoderstream.textencoderstream": { "url": "$MDN_URL$/web/api/textencoderstream/textencoderstream", @@ -31966,7 +32158,7 @@ "lowDate": "2022-09-20", "highDate": "2025-03-20" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TextEncoderStream interface returns a WritableStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TextEncoderStream interface returns a WritableStream that accepts strings to be encoded into binary data." }, "textevent": { "url": "$MDN_URL$/web/api/textevent", @@ -33061,7 +33253,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The TextUpdateEvent.text read-only property contains the text that was inserted within the updated range of a EditContext's textupdate event." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The TextUpdateEvent.text read-only property contains the text that was inserted within the updated range of an EditContext's textupdate event." }, "textupdateevent.textupdateevent": { "url": "$MDN_URL$/web/api/textupdateevent/textupdateevent", @@ -33253,7 +33445,7 @@ "level": "LOW", "lowDate": "2023-11-21" }, - "doc": "The ToggleEvent interface represents an event notifying the user an Element's state has changed.\n

    This is the event object for the HTMLElement beforetoggle and toggle events, which fire on some elements just before and just after they transition between showing and hidden, respectively.\n

    " + "doc": "The ToggleEvent interface represents an event that fires when a popover element is toggled between being shown and hidden.\n

    This is the event object for the beforetoggle and toggle events, which fire on elements as follows:\n

    " }, "toggleevent.newstate": { "url": "$MDN_URL$/web/api/toggleevent/newstate", @@ -33310,6 +33502,9 @@ "FirefoxAndroid": "145", "Opera": "124" }, + "baseline": { + "level": "NONE" + }, "doc": "The source read-only property of the ToggleEvent interface is an Element object instance representing the HTML popover control element that initiated the toggle." }, "toggleevent.toggleevent": { @@ -33589,7 +33784,7 @@ }, "doc": "The Touch() constructor creates a new Touch object.", "parameters": { - "touchInit": "An object with the following fields:\n
    \n
    identifier
    \n
    \n

    A long value, that is the identification number for the touch point.\n

    \n
    target
    \n
    \n

    A EventTarget object, the item at which the touch point started when it was first placed on the surface.\n

    \n
    clientX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, excluding any scroll offset.\n

    \n
    clientY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, excluding any scroll offset.\n

    \n
    screenX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the user's screen.\n

    \n
    screenY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the user's screen.\n

    \n
    pageX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, including any scroll offset.\n

    \n
    pageY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, including any scroll offset.\n

    \n
    radiusX Optional
    \n
    \n

    Defaults to 0, of type float, that is the radius of the ellipse which most closely circumscribes the touching area (e.g., finger, stylus) along the axis indicated by rotationAngle, in CSS pixels of the same scale as screenX; 0 if no value is known. The value must not be negative.\n

    \n
    radiusY Optional
    \n
    \n

    Defaults to 0, of type float, that is the radius of the ellipse which most closely circumscribes the touching area (e.g., finger, stylus) along the axis perpendicular to that indicated by rotationAngle, in CSS pixels of the same scale as screenY; 0 if no value is known. The value must not be negative.\n

    \n
    rotationAngle Optional
    \n
    \n

    Defaults to 0, of type float, that is the angle (in degrees) that the ellipse described by radiusX and radiusY is rotated clockwise about its center; 0 if no value is known. The value must be greater than or equal to 0 and less than 90. If the ellipse described by radiusX and radiusY is circular, then rotationAngle has no effect. The user agent may use 0 as the value in this case, or it may use any other value in the allowed range. (For example, the user agent may use the rotationAngle value from the previous touch event, to avoid sudden changes.).\n

    \n
    force Optional
    \n
    \n

    Defaults to 0, of type float, that is the relative value of pressure applied, in the range 0 to 1, where 0 is no pressure, and 1 is the highest level of pressure the touch device is capable of sensing; 0 if no value is known. In environments where force is known, the absolute pressure represented by the force attribute, and the sensitivity in levels of pressure, may vary.\n

    \n
    " + "touchInit": "An object with the following fields:\n
    \n
    identifier
    \n
    \n

    A long value, that is the identification number for the touch point.\n

    \n
    target
    \n
    \n

    An EventTarget object, the item at which the touch point started when it was first placed on the surface.\n

    \n
    clientX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, excluding any scroll offset.\n

    \n
    clientY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, excluding any scroll offset.\n

    \n
    screenX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the user's screen.\n

    \n
    screenY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the user's screen.\n

    \n
    pageX Optional
    \n
    \n

    Defaults to 0, of type double, that is the horizontal position of the touch on the client window of user's screen, including any scroll offset.\n

    \n
    pageY Optional
    \n
    \n

    Defaults to 0, of type double, that is the vertical position of the touch on the client window of the user's screen, including any scroll offset.\n

    \n
    radiusX Optional
    \n
    \n

    Defaults to 0, of type float, that is the radius of the ellipse which most closely circumscribes the touching area (e.g., finger, stylus) along the axis indicated by rotationAngle, in CSS pixels of the same scale as screenX; 0 if no value is known. The value must not be negative.\n

    \n
    radiusY Optional
    \n
    \n

    Defaults to 0, of type float, that is the radius of the ellipse which most closely circumscribes the touching area (e.g., finger, stylus) along the axis perpendicular to that indicated by rotationAngle, in CSS pixels of the same scale as screenY; 0 if no value is known. The value must not be negative.\n

    \n
    rotationAngle Optional
    \n
    \n

    Defaults to 0, of type float, that is the angle (in degrees) that the ellipse described by radiusX and radiusY is rotated clockwise about its center; 0 if no value is known. The value must be greater than or equal to 0 and less than 90. If the ellipse described by radiusX and radiusY is circular, then rotationAngle has no effect. The user agent may use 0 as the value in this case, or it may use any other value in the allowed range. (For example, the user agent may use the rotationAngle value from the previous touch event, to avoid sudden changes.).\n

    \n
    force Optional
    \n
    \n

    Defaults to 0, of type float, that is the relative value of pressure applied, in the range 0 to 1, where 0 is no pressure, and 1 is the highest level of pressure the touch device is capable of sensing; 0 if no value is known. In environments where force is known, the absolute pressure represented by the force attribute, and the sensitivity in levels of pressure, may vary.\n

    \n
    " } }, "touchevent": { @@ -33805,7 +34000,7 @@ "parameters": { "index": "The index of the Touch object to retrieve. The index is a number in\nthe range of 0 to one less than the length of the TouchList." }, - "returns": "
    \n
    touchPoint
    \n
    \n

    The requested Touch object from the TouchList.\nReturns null if the index is not less than the length of the list.\n

    \n
    " + "returns": "The requested Touch object from the TouchList. Returns null if the index is not less than the length of the list." }, "touchlist.length": { "url": "$MDN_URL$/web/api/touchlist/length", @@ -33927,7 +34122,7 @@ "lowDate": "2022-06-28", "highDate": "2024-12-28" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TransformStream interface returns the ReadableStream instance controlled by this TransformStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the TransformStream interface returns the ReadableStream instance controlled by this TransformStream. This stream emits the transformed output data." }, "transformstream.transferable_objects": { "url": "$MDN_URL$/web/api/web_workers_api/transferable_objects", @@ -33996,7 +34191,7 @@ "lowDate": "2022-06-28", "highDate": "2024-12-28" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TransformStream interface returns the WritableStream instance controlled by this TransformStream." + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the TransformStream interface returns the WritableStream instance controlled by this TransformStream. This stream accepts input data that will be transformed and emitted to the readable stream." }, "transformstreamdefaultcontroller": { "url": "$MDN_URL$/web/api/transformstreamdefaultcontroller", @@ -34150,7 +34345,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The TransitionEvent interface represents events providing information related to transitions." + "doc": "The TransitionEvent interface represents events providing information related to transitions." }, "transitionevent.elapsedtime": { "url": "$MDN_URL$/web/api/transitionevent/elapsedtime", @@ -34172,7 +34367,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The TransitionEvent.elapsedTime read-only property is a\nfloat giving the amount of time the animation has been running, in seconds,\nwhen this event fired. This value is not affected by the transition-delay\nproperty." + "doc": "The TransitionEvent.elapsedTime read-only property is a\nfloat giving the amount of time the animation has been running, in seconds,\nwhen this event fired. This value is not affected by the transition-delay\nproperty." }, "transitionevent.propertyname": { "url": "$MDN_URL$/web/api/transitionevent/propertyname", @@ -34216,7 +34411,7 @@ "lowDate": "2020-01-15", "highDate": "2022-07-15" }, - "doc": "The TransitionEvent.pseudoElement read-only property is a\nstring, starting with '::', containing the name of the pseudo-element the animation runs on.\nIf the transition doesn't run on a pseudo-element but on the element, an empty string:\n\"\"." + "doc": "The TransitionEvent.pseudoElement read-only property is a\nstring, starting with '::', containing the name of the pseudo-element the animation runs on.\nIf the transition doesn't run on a pseudo-element but on the element, an empty string:\n\"\"." }, "transitionevent.transitionevent": { "url": "$MDN_URL$/web/api/transitionevent/transitionevent", @@ -34241,7 +34436,7 @@ "doc": "The TransitionEvent() constructor returns a new TransitionEvent object, representing an event in relation with a transition.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to transitionrun, transitionstart, transitionend, or transitioncancel.", - "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    propertyName Optional
    \n
    \n

    A string containing the name of the CSS property associated with the transition.\nIt defaults to \"\".\n

    \n
    elapsedTime Optional
    \n
    \n

    A number giving the amount of time the animation has been running,\nin seconds, when this event fired, excluding any time the animation was paused.\nFor an \"animationstart\" event, elapsedTime is 0.0 unless there was a negative value for animation-delay,\nin which case the event will be fired with elapsedTime containing (-1 * delay).\nIt defaults to 0.0.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string, defaulting with \"::\", containing the name of the pseudo-element the animation runs on.\nIf the animation doesn't run on a pseudo-element but on the element, an empty string: \"\".\nIt defaults to \"\".\n

    \n
    " + "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n
    \n
    propertyName Optional
    \n
    \n

    A string containing the name of the CSS property associated with the transition.\nIt defaults to \"\".\n

    \n
    elapsedTime Optional
    \n
    \n

    A number giving the amount of time the animation has been running,\nin seconds, when this event fired, excluding any time the animation was paused.\nFor an \"animationstart\" event, elapsedTime is 0.0 unless there was a negative value for animation-delay,\nin which case the event will be fired with elapsedTime containing (-1 * delay).\nIt defaults to 0.0.\n

    \n
    pseudoElement Optional
    \n
    \n

    A string, defaulting with \"::\", containing the name of the pseudo-element the animation runs on.\nIf the animation doesn't run on a pseudo-element but on the element, an empty string: \"\".\nIt defaults to \"\".\n

    \n
    " }, "returns": "A new TransitionEvent object." }, @@ -34255,7 +34450,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Translator interface of the Translator and Language Detector APIs contains all the associated translation functionality, including checking AI model availability, creating a new Translator instance, using it to create a translation, and more." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Translator interface of the Translator and Language Detector APIs contains all the associated translation functionality, including checking AI model availability, creating a new Translator instance, using it to create a translation, and more." }, "translator.availability": { "url": "$MDN_URL$/web/api/translator/availability_static", @@ -34267,7 +34462,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the Translator interface returns an enumerated value that indicates the availability of the AI model for the given Translator configuration.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The availability() static method of the Translator interface returns an enumerated value that indicates the availability of the AI model for the given Translator configuration.", "parameters": { "options": "An object specifying configuration options for the Translator. Possible values include:\n

    \n
    sourceLanguage
    \n
    \n

    A string specifying the language of the input text to be translated, which should be a valid BCP 47 language tag.\n

    \n
    targetLanguage
    \n
    \n

    A string specifying the language that the input text will be translated into, which should be valid BCP 47 language tag.\n

    \n
    " }, @@ -34288,9 +34483,9 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the Translator interface creates a new Translator instance that can be used to translate text.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The create() static method of the Translator interface creates a new Translator instance that can be used to translate text.\n

    \n

    Note:\nThe create() method requires transient activation, that is, it must be invoked in response to a user action such as a mouse click or button press.\n

    ", "parameters": { - "options": "An object specifying configuration options for the Translator. Possible values include:\n
    \n
    sourceLanguage
    \n
    \n

    A string specifying the expected language of the input text to be translated, which should be a valid BCP 47 language tag.\n

    \n
    targetLanguage
    \n
    \n

    A string specifying the language that the input text will be translated into, which should be valid BCP 47 language tag.\n

    \n
    monitor Optional
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance, which allows the create() operation to be aborted via the associated AbortController.\n

    \n
    " + "options": "An object specifying configuration options for the Translator. Possible values include:\n
    \n
    sourceLanguage
    \n
    \n

    A string specifying the expected language of the input text to be translated, which should be a valid BCP 47 language tag.\n

    \n
    targetLanguage
    \n
    \n

    A string specifying the language that the input text will be translated into, which should be valid BCP 47 language tag.\n

    \n
    monitor Optional
    \n
    \n

    A callback function with a CreateMonitor argument that enables monitoring download progress of the AI model.\n

    \n
    signal Optional
    \n
    \n

    An AbortSignal object instance, which allows a create() operation to be aborted via the associated AbortController. The exact effect is dependant on when AbortController.abort() is called:\n

      \n
    • If abort() is called before the create() promise resolves, the create() operation is cancelled.
    • \n
    • If abort() is called after the create() promise fulfills, it has the same effect as calling Translator.destroy(): The resources assigned to the resulting Translator instance are released, and any ongoing and subsequent Translator method calls will reject with an AbortError.
    • \n
    \n
    \n
    " }, "returns": "A Promise that fulfills with a Translator object instance.", "throws": { @@ -34311,7 +34506,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the Translator interface destroys the Translator instance it is called on. It makes sense to destroy these objects if they are no longer going to be used, as they tie up significant resources in their handling.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The destroy() method of the Translator interface releases the resources assigned to the Translator instance it is called on and stops any further activity on it. This means that any ongoing and subsequent method calls made on the Translator will reject with an AbortError.\n

    It makes sense to destroy Translator objects if they are no longer being used, as they tie up significant resources in their handling.", "returns": "None (undefined)." }, "translator.inputquota": { @@ -34324,7 +34519,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the Translator interface returns the input quota available to the browser for generating translations." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The inputQuota read-only property of the Translator interface returns the input quota available to the browser for generating translations." }, "translator.measureinputusage": { "url": "$MDN_URL$/web/api/translator/measureinputusage", @@ -34336,7 +34531,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the Translator interface reports how much input quota would be used by a translation operation for a given text input.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The measureInputUsage() method of the Translator interface reports how much input quota would be used by a translation operation for a given text input.", "parameters": { "input": "A string representing the input text you want an input usage measurement for.", "options": "An object specifying configuration options for the measureInputUsage() operation. Possible values include:\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the measureInputUsage() operation to be aborted via the associated AbortController.\n

    \n
    " @@ -34358,7 +34553,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sourceLanguage read-only property of the Translator interface returns the expected language of the input text to be translated.\n

    A Translator instance's sourceLanguage is set when creating it via a create() call." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The sourceLanguage read-only property of the Translator interface returns the expected language of the input text to be translated.\n

    A Translator instance's sourceLanguage is set when creating it via a create() call." }, "translator.targetlanguage": { "url": "$MDN_URL$/web/api/translator/targetlanguage", @@ -34370,7 +34565,7 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The targetLanguage read-only property of the Translator interface returns the language that the input text will be translated into.\n

    A Translator instance's targetLanguage is set when creating it via a create() call." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The targetLanguage read-only property of the Translator interface returns the language that the input text will be translated into.\n

    A Translator instance's targetLanguage is set when creating it via a create() call." }, "translator.translate": { "url": "$MDN_URL$/web/api/translator/translate", @@ -34382,13 +34577,14 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The translate() method of the Translator interface returns a translation of an input string.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The translate() method of the Translator interface returns a translation of an input string.", "parameters": { "input": "A string representing the text to be translated.", "options": "An object specifying configuration options for the translate() operation. Possible values include:\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the translate() operation to be aborted via the associated AbortController.\n

    \n
    " }, "returns": "A Promise that fulfills with a string containing the generated translation.", "throws": { + "AbortError DOMException": "Thrown if the Translator was previously destroyed (had Translator.destroy() called on it, or was aborted via its abort signal after creation).", "InvalidStateError DOMException": "Thrown if the current Document is not active.", "QuotaExceededError": "Thrown if the translation operation exceeds the available inputQuota." } @@ -34403,13 +34599,14 @@ "Chrome": "138", "Opera": "122" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The translateStreaming() method of the Translator interface generates a translation as a ReadableStream.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The translateStreaming() method of the Translator interface generates a translation as a ReadableStream.", "parameters": { "input": "A string representing the text to be translated.", "options": "An object specifying configuration options for the translateStreaming() operation. Possible values include:\n

    \n
    signal
    \n
    \n

    An AbortSignal object instance, which allows the translateStreaming() operation to be aborted via the associated AbortController.\n

    \n
    " }, "returns": "A ReadableStream containing the generated translation.", "throws": { + "AbortError DOMException": "Thrown if the Translator was previously destroyed (had Translator.destroy() called on it, or was aborted via its abort signal after creation).", "InvalidStateError DOMException": "Thrown if the current Document is not active.", "QuotaExceededError": "Thrown if the translation operation exceeds the available inputQuota." } @@ -34694,6 +34891,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34712,6 +34911,8 @@ "Chrome": "90", "ChromeAndroid": "90", "Edge": "90", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "76", "Safari": "26", "SafariIOS": "26" @@ -34731,6 +34932,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34750,6 +34953,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34768,6 +34973,8 @@ "Chrome": "90", "ChromeAndroid": "90", "Edge": "90", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "76", "Safari": "26", "SafariIOS": "26" @@ -34787,6 +34994,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34806,6 +35015,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34824,6 +35035,8 @@ "Chrome": "90", "ChromeAndroid": "90", "Edge": "90", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "76", "Safari": "26", "SafariIOS": "26" @@ -34843,6 +35056,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34862,6 +35077,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34880,6 +35097,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34906,6 +35125,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34932,6 +35153,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34958,6 +35181,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34976,6 +35201,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -34994,6 +35221,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35020,6 +35249,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35038,6 +35269,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35056,6 +35289,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35074,6 +35309,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35099,6 +35336,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35123,6 +35362,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35145,6 +35386,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35167,6 +35410,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" @@ -35189,6 +35434,8 @@ "Chrome": "83", "ChromeAndroid": "83", "Edge": "83", + "Firefox": "148", + "FirefoxAndroid": "148", "Opera": "69", "Safari": "26", "SafariIOS": "26" diff --git a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-u.json b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-u.json index 390979d84343..4e7271de9226 100644 --- a/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-u.json +++ b/xml/xml-psi-impl/resources-gen/com/intellij/documentation/mdn/WebApi-u.json @@ -928,7 +928,7 @@ "parameters": { "input": "An object that has separate properties for defining the patterns used to match each part of a URL.\n

    The object members can be any (or none) of:\n

    \n
    protocol Optional
    \n
    \n

    A pattern that matches a URL protocol, such as http, https, or \"http{s}?\" (to match both https and http).\n

    \n
    username Optional
    \n
    \n

    A pattern that matches a URL username.\n

    \n
    password Optional
    \n
    \n

    A pattern that matches a URL password.\n

    \n
    hostname Optional
    \n
    \n

    A pattern that matches a URL hostname.\n

    \n
    port Optional
    \n
    \n

    A pattern that matches a URL port.\n

    \n
    pathname Optional
    \n
    \n

    A pattern that matches a URL pathname.\n

    \n
    search Optional
    \n
    \n

    A pattern that matches a URL search.\n

    \n
    hash Optional
    \n
    \n

    A pattern that matches a URL hash.\n

    \n
    baseURL Optional
    \n
    \n

    A string that provides an absolute URL from which undefined less-specific object properties may be inherited.\n

    \n
    ", "url": "A string representing URL patterns to match.\n

    This is formatted as an absolute or relative URL but may contain markup to indicate matching patterns and escape sequences.\nIf formatted as a relative URL, then baseURL must also be provided.", - "baseURL": "A string that provides an absolute URL from which undefined less-specific URL-parts may be inherited\nThis must be set when url is a relative URL, and must not be set if input is used (input.baseURL may be used to provide inherited values for a input, but, unlike this property, is never required).", + "baseURL": "A string that provides an absolute URL from which undefined less-specific URL-parts may be inherited\nThis must be set when url is a relative URL, and must not be set if input is used (input.baseURL may be used to provide inherited values for an input, but, unlike this property, is never required).", "options": "An object providing options for matching the given pattern.\nThe allowed object members are:\n

    \n
    ignoreCase Optional
    \n
    \n

    Enables case-insensitive matching if set to true.\nIf omitted or set to false, matching will be case-sensitive.\n

    \n
    " }, "throws": { @@ -1373,7 +1373,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USB interface of the WebUSB API provides attributes and methods for finding and connecting USB devices from a web page.\n

    Use navigator.usb to get access to the USB object.\n

    The USB interface inherits from EventTarget." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USB interface of the WebUSB API provides attributes and methods for finding and connecting USB devices from a web page.\n

    Use navigator.usb to get access to the USB object.\n

    The USB interface inherits from EventTarget." }, "usb.getdevices": { "url": "$MDN_URL$/web/api/usb/getdevices", @@ -1390,7 +1390,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDevices method of the USB interface\nreturns a Promise that resolves with an array of USBDevice\nobjects for paired attached devices. For information on pairing devices, see\nUSB.requestDevice().", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getDevices method of the USB interface\nreturns a Promise that resolves with an array of USBDevice\nobjects for paired attached devices. For information on pairing devices, see\nUSB.requestDevice().", "returns": "A Promise that resolves with an array of USBDevice\nobjects." }, "usb.requestdevice": { @@ -1408,7 +1408,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestDevice() method of the USB\ninterface returns a Promise that resolves with an instance of\nUSBDevice if the specified device is found. Calling this function\ntriggers the user agent's pairing flow.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The requestDevice() method of the USB\ninterface returns a Promise that resolves with an instance of\nUSBDevice if the specified device is found. Calling this function\ntriggers the user agent's pairing flow.", "parameters": { "options": "An object that sets options for selecting an appropriate device.\nThe available options are:\n

    \n
    filters
    \n
    \n

    An array of filter objects for possible devices you would like to pair. Each filter\nobject can have the following properties:\n

      \n
    • vendorId
    • \n
    • productId
    • \n
    • classCode
    • \n
    • subclassCode
    • \n
    • protocolCode
    • \n
    • serialNumber
    • \n
    \n
    \n
    " }, @@ -1429,7 +1429,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBAlternateInterface interface of the WebUSB API provides information about a particular configuration of an interface provided by the USB device. An interface includes one or more alternate settings which can configure a set of endpoints based on the operating mode of the device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBAlternateInterface interface of the WebUSB API provides information about a particular configuration of an interface provided by the USB device. An interface includes one or more alternate settings which can configure a set of endpoints based on the operating mode of the device." }, "usbconfiguration": { "url": "$MDN_URL$/web/api/usbconfiguration", @@ -1446,7 +1446,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConfiguration interface of the WebUSB API provides information about a particular configuration of a USB device and the interfaces that it supports." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConfiguration interface of the WebUSB API provides information about a particular configuration of a USB device and the interfaces that it supports." }, "usbconfiguration.configurationname": { "url": "$MDN_URL$/web/api/usbconfiguration/configurationname", @@ -1463,7 +1463,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurationName read-only property\nof the USBConfiguration interface returns the name provided by the device\nto describe this configuration. This is equal to the value of the string descriptor with\nthe index provided in the iConfiguration\nfield of the configuration descriptor defining this configuration." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurationName read-only property\nof the USBConfiguration interface returns the name provided by the device\nto describe this configuration. This is equal to the value of the string descriptor with\nthe index provided in the iConfiguration\nfield of the configuration descriptor defining this configuration." }, "usbconfiguration.configurationvalue": { "url": "$MDN_URL$/web/api/usbconfiguration/configurationvalue", @@ -1480,7 +1480,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurationValue read-only property\nof the USBConfiguration interface returns the configuration value of this configuration. This is equal to the\nbConfigurationValue field of the configuration descriptor provided by the device defining this configuration." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurationValue read-only property\nof the USBConfiguration interface returns the configuration value of this configuration. This is equal to the\nbConfigurationValue field of the configuration descriptor provided by the device defining this configuration." }, "usbconfiguration.interfaces": { "url": "$MDN_URL$/web/api/usbconfiguration/interfaces", @@ -1497,7 +1497,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The interfaces read-only property of the\nUSBConfiguration interface returns an array containing instances of the\nUSBInterface describing each interface supported by this configuration." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The interfaces read-only property of the\nUSBConfiguration interface returns an array containing instances of the\nUSBInterface describing each interface supported by this configuration." }, "usbconfiguration.usbconfiguration": { "url": "$MDN_URL$/web/api/usbconfiguration/usbconfiguration", @@ -1514,7 +1514,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConfiguration() constructor\ncreates a new USBConfiguration object which contains information about\nthe configuration on the provided USBDevice with the given configuration value.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConfiguration() constructor\ncreates a new USBConfiguration object which contains information about\nthe configuration on the provided USBDevice with the given configuration value.", "parameters": { "device": "Specifies the USBDevice you want to configure.", "configurationValue": "Specifies the configuration descriptor you want to read. This is an unsigned integer in the range 0 to 255." @@ -1535,7 +1535,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConnectionEvent interface of the WebUSB API is the event type passed to USB connect and disconnect events when the user agent detects that a new USB device has been connected or disconnected." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConnectionEvent interface of the WebUSB API is the event type passed to USB connect and disconnect events when the user agent detects that a new USB device has been connected or disconnected." }, "usbconnectionevent.device": { "url": "$MDN_URL$/web/api/usbconnectionevent/device", @@ -1552,7 +1552,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The device read-only property of the USBConnectionEvent interface returns a USBDevice object representing the device being connected or disconnected." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The device read-only property of the USBConnectionEvent interface returns a USBDevice object representing the device being connected or disconnected." }, "usbconnectionevent.usbconnectionevent": { "url": "$MDN_URL$/web/api/usbconnectionevent/usbconnectionevent", @@ -1569,7 +1569,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConnectionEvent() constructor creates a new USBConnectionEvent object.\nThis constructor is not typically used,\nit is created by the browser in response to the connection and disconnection of a USB device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBConnectionEvent() constructor creates a new USBConnectionEvent object.\nThis constructor is not typically used,\nit is created by the browser in response to the connection and disconnection of a USB device.", "parameters": { "type": "A string with the name of the event.\nIt 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:\n

    \n
    device
    \n
    \n

    A USBDevice representing the USB device being connected or disconnected.\n

    \n
    " @@ -1591,7 +1591,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBDevice interface of the WebUSB API provides access to metadata about a paired USB device and methods for controlling it." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBDevice interface of the WebUSB API provides access to metadata about a paired USB device and methods for controlling it." }, "usbdevice.claiminterface": { "url": "$MDN_URL$/web/api/usbdevice/claiminterface", @@ -1608,7 +1608,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The claimInterface() method of the\nUSBDevice interface returns a promise that resolves when\nthe requested interface is claimed for exclusive access.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The claimInterface() method of the\nUSBDevice interface returns a promise that resolves when\nthe requested interface is claimed for exclusive access.", "parameters": { "interfaceNumber": "The index of one of the interfaces supported by the device. Interfaces are\ndevice specific." }, @@ -1629,7 +1629,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The clearHalt() method of the USBDevice\ninterface returns a promise that resolves when a halt condition is\ncleared. A halt condition is when a data transfer to or from the device has a status\nof 'stall', which requires the web page (the host system, in USB\nterminology) to clear that condition. See the for details.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The clearHalt() method of the USBDevice\ninterface returns a promise that resolves when a halt condition is\ncleared. A halt condition is when a data transfer to or from the device has a status\nof 'stall', which requires the web page (the host system, in USB\nterminology) to clear that condition. See the for details.", "parameters": { "direction": "Indicates whether the devices input or output should be cleared. Valid values\nare 'in' or 'out'.", "endpointNumber": "Indicates the number of the endpoint to clear. The promise will reject if an invalid\nendpoint is supplied." @@ -1651,7 +1651,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the USBDevice\ninterface returns a promise that resolves when all open interfaces are\nreleased and the device session has ended.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the USBDevice\ninterface returns a promise that resolves when all open interfaces are\nreleased and the device session has ended.", "returns": "A promise." }, "usbdevice.configuration": { @@ -1669,7 +1669,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configuration read only property of the\nUSBDevice interface returns a USBConfiguration object for\nthe currently selected interface for a paired USB device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configuration read only property of the\nUSBDevice interface returns a USBConfiguration object for\nthe currently selected interface for a paired USB device." }, "usbdevice.configurations": { "url": "$MDN_URL$/web/api/usbdevice/configurations", @@ -1686,7 +1686,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurations read only property of the\nUSBDevice interface an array of device-specific interfaces\nfor controlling a paired USB device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The configurations read only property of the\nUSBDevice interface an array of device-specific interfaces\nfor controlling a paired USB device." }, "usbdevice.controltransferin": { "url": "$MDN_URL$/web/api/usbdevice/controltransferin", @@ -1703,7 +1703,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controlTransferIn() method of the USBDevice interface returns a Promise that resolves with a USBInTransferResult when a command or status request has been transmitted to (received by) the USB device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controlTransferIn() method of the USBDevice interface returns a Promise that resolves with a USBInTransferResult when a command or status request has been transmitted to (received by) the USB device.", "parameters": { "setup": "An object that sets options for. The available options are:\n

    \n
    requestType
    \n
    \n

    Must be one of three values specifying whether the transfer is \"standard\" (common to all USB devices) \"class\" (common to an industry-standard class of devices) or \"vendor\".\n

    \n
    recipient
    \n
    \n

    Specifies the target of the transfer on the device, one of \"device\", \"interface\", \"endpoint\", or \"other\".\n

    \n
    request
    \n
    \n

    A vendor-specific command.\n

    \n
    value
    \n
    \n

    Vendor-specific request parameters.\n

    \n
    index
    \n
    \n

    The interface number of the recipient.\n

    \n
    ", "length": "The maximum number of bytes to read from the device. The actual data is in the USBInTransferResult in the resolved Promise." @@ -1725,7 +1725,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controlTransferOut() method of the USBDevice interface returns a Promise that resolves with a USBOutTransferResult when a command or status operation has been transmitted from the USB device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The controlTransferOut() method of the USBDevice interface returns a Promise that resolves with a USBOutTransferResult when a command or status operation has been transmitted from the USB device.", "parameters": { "setup": "An object that sets options for. The available options are:\n

    \n
    requestType
    \n
    \n

    Must be one of three values specifying whether the transfer is \"standard\" (common to all USB devices) \"class\" (common to an industry-standard class of devices) or \"vendor\".\n

    \n
    recipient
    \n
    \n

    Specifies the target of the transfer on the device, one of \"device\", \"interface\", \"endpoint\", or \"other\".\n

    \n
    request
    \n
    \n

    A vendor-specific command.\n

    \n
    value
    \n
    \n

    Vendor-specific request parameters.\n

    \n
    index
    \n
    \n

    The interface number of the recipient.\n

    \n
    ", "data": "A TypedArray containing the data that will be transferred to the device.\nNot all commands require data; some commands can send data just through the value parameter.\nCheck with your device to see what the specific request requires." @@ -1747,7 +1747,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceClass read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceSubclass and USBDevice.deviceProtocol." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceClass read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceSubclass and USBDevice.deviceProtocol." }, "usbdevice.deviceprotocol": { "url": "$MDN_URL$/web/api/usbdevice/deviceprotocol", @@ -1764,7 +1764,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceProtocol read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceClass\nand USBDevice.deviceSubclass." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceProtocol read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceClass\nand USBDevice.deviceSubclass." }, "usbdevice.devicesubclass": { "url": "$MDN_URL$/web/api/usbdevice/devicesubclass", @@ -1781,7 +1781,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceSubclass read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceClass and USBDevice.deviceProtocol." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceSubclass read only property of the\nUSBDevice interface one of three properties that identify USB devices for\nthe purpose of loading a USB driver that will work with that device. The other two\nproperties are USBDevice.deviceClass and USBDevice.deviceProtocol." }, "usbdevice.deviceversionmajor": { "url": "$MDN_URL$/web/api/usbdevice/deviceversionmajor", @@ -1798,7 +1798,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionMajor read only property of the\nUSBDevice interface he major version number of the device in a semantic\nversioning scheme." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionMajor read only property of the\nUSBDevice interface he major version number of the device in a semantic\nversioning scheme." }, "usbdevice.deviceversionminor": { "url": "$MDN_URL$/web/api/usbdevice/deviceversionminor", @@ -1815,7 +1815,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionMinor read only property of the\nUSBDevice interface the minor version number of the device in a semantic\nversioning scheme." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionMinor read only property of the\nUSBDevice interface the minor version number of the device in a semantic\nversioning scheme." }, "usbdevice.deviceversionsubminor": { "url": "$MDN_URL$/web/api/usbdevice/deviceversionsubminor", @@ -1832,7 +1832,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionSubminor read only property of the\nUSBDevice interface the patch version number of the device in a semantic\nversioning scheme." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The deviceVersionSubminor read only property of the\nUSBDevice interface the patch version number of the device in a semantic\nversioning scheme." }, "usbdevice.forget": { "url": "$MDN_URL$/web/api/usbdevice/forget", @@ -1849,7 +1849,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The forget() method of the USBDevice interface returns a Promise that resolves when all pending operations are aborted, all open interfaces are released, the device session has ended, and the permission is reset.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The forget() method of the USBDevice interface returns a Promise that resolves when all pending operations are aborted, all open interfaces are released, the device session has ended, and the permission is reset.", "returns": "A Promise which resolves with undefined once the device access permission is revoked." }, "usbdevice.isochronoustransferin": { @@ -1867,7 +1867,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isochronousTransferIn() method of the USBDevice interface returns a Promise that resolves with a USBIsochronousInTransferResult when time sensitive information has been transmitted to (received by) the USB device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isochronousTransferIn() method of the USBDevice interface returns a Promise that resolves with a USBIsochronousInTransferResult when time sensitive information has been transmitted to (received by) the USB device.", "parameters": { "endpointNumber": "The number of a device-specific endpoint (buffer).", "packetLengths": "An array of lengths for the packets being received." @@ -1889,7 +1889,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isochronousTransferOut() method of the\nUSBDevice interface returns a Promise that resolves with a USBIsochronousOutTransferResult when time sensitive information has been transmitted from the USB device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The isochronousTransferOut() method of the\nUSBDevice interface returns a Promise that resolves with a USBIsochronousOutTransferResult when time sensitive information has been transmitted from the USB device.", "parameters": { "endpointNumber": "The number of a device-specific endpoint (buffer).", "data": "A TypedArray containing the data to send to the device.", @@ -1912,7 +1912,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The manufacturerName read only property of the\nUSBDevice interface the of the organization that manufactured the USB\ndevice." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The manufacturerName read only property of the\nUSBDevice interface the of the organization that manufactured the USB\ndevice." }, "usbdevice.open": { "url": "$MDN_URL$/web/api/usbdevice/open", @@ -1929,7 +1929,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The open() method of the USBDevice\ninterface returns a promise that resolves when a device session has\nstarted.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The open() method of the USBDevice\ninterface returns a promise that resolves when a device session has\nstarted.", "returns": "A promise." }, "usbdevice.opened": { @@ -1947,7 +1947,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The opened read only property of the\nUSBDevice interface indicates whether a session has been started with a\npaired USB device. A device must be opened before it can be controlled by a web page." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The opened read only property of the\nUSBDevice interface indicates whether a session has been started with a\npaired USB device. A device must be opened before it can be controlled by a web page." }, "usbdevice.productid": { "url": "$MDN_URL$/web/api/usbdevice/productid", @@ -1964,7 +1964,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The productId read only property of the\nUSBDevice interface the manufacturer-defined code that identifies a USB\ndevice." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The productId read only property of the\nUSBDevice interface the manufacturer-defined code that identifies a USB\ndevice." }, "usbdevice.productname": { "url": "$MDN_URL$/web/api/usbdevice/productname", @@ -1981,7 +1981,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The productName read only property of the\nUSBDevice interface the manufacturer-defined name that identifies a USB\ndevice." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The productName read only property of the\nUSBDevice interface the manufacturer-defined name that identifies a USB\ndevice." }, "usbdevice.releaseinterface": { "url": "$MDN_URL$/web/api/usbdevice/releaseinterface", @@ -1998,7 +1998,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The releaseInterface() method of the\nUSBDevice interface returns a promise that resolves when a\nclaimed interface is released from exclusive access.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The releaseInterface() method of the\nUSBDevice interface returns a promise that resolves when a\nclaimed interface is released from exclusive access.", "parameters": { "interfaceNumber": "The device-specific index of the currently-claimed interface." }, @@ -2019,7 +2019,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reset() method of the USBDevice\ninterface returns a promise that resolves when the device is reset and all\napp operations canceled and their promises rejected.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reset() method of the USBDevice\ninterface returns a promise that resolves when the device is reset and all\napp operations canceled and their promises rejected.", "returns": "A promise." }, "usbdevice.selectalternateinterface": { @@ -2037,7 +2037,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The selectAlternateInterface() method of the\nUSBDevice interface returns a promise that resolves when\nthe specified alternative endpoint is selected.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The selectAlternateInterface() method of the\nUSBDevice interface returns a promise that resolves when\nthe specified alternative endpoint is selected.", "parameters": { "interfaceNumber": "The index of one of the interfaces supported by the device. Interfaces are\ndevice-specific.", "alternateSetting": "The configuration of the selected interface." @@ -2059,7 +2059,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The selectConfiguration() method of the\nUSBDevice interface returns a promise that resolves when\nthe specified configuration is selected.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The selectConfiguration() method of the\nUSBDevice interface returns a promise that resolves when\nthe specified configuration is selected.", "parameters": { "configurationValue": "The number of a device-specific configuration." }, @@ -2080,7 +2080,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The serialNumber read only property of the\nUSBDevice interface is the manufacturer-defined serial number for the\nspecific USB device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The serialNumber read only property of the\nUSBDevice interface is the manufacturer-defined serial number for the\nspecific USB device." }, "usbdevice.transferin": { "url": "$MDN_URL$/web/api/usbdevice/transferin", @@ -2097,7 +2097,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The transferIn() method of the USBDevice\ninterface returns a promise that resolves with a\nUSBInTransferResult when bulk or interrupt data is received from the USB\ndevice.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The transferIn() method of the USBDevice\ninterface returns a promise that resolves with a\nUSBInTransferResult when bulk or interrupt data is received from the USB\ndevice.", "parameters": { "endpointNumber": "The number of a device-specific endpoint (buffer).", "length": "The maximum number of bytes that will be read back from the device. The actual data\nis in the USBInTransferResult in the resolved Promise." @@ -2119,7 +2119,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The transferOut() method of the USBDevice\ninterface returns a promise that resolves with a\nUSBOutTransferResult when bulk or interrupt data is sent to the USB\ndevice.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The transferOut() method of the USBDevice\ninterface returns a promise that resolves with a\nUSBOutTransferResult when bulk or interrupt data is sent to the USB\ndevice.", "parameters": { "endpointNumber": "The number of a device-specific endpoint (buffer).", "data": "A TypedArray containing the data to send to the device." @@ -2141,7 +2141,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionMajor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMinor and USBDevice.usbVersionSubminor." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionMajor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMinor and USBDevice.usbVersionSubminor." }, "usbdevice.usbversionminor": { "url": "$MDN_URL$/web/api/usbdevice/usbversionminor", @@ -2158,7 +2158,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionMinor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMajor and USBDevice.usbVersionSubminor." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionMinor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMajor and USBDevice.usbVersionSubminor." }, "usbdevice.usbversionsubminor": { "url": "$MDN_URL$/web/api/usbdevice/usbversionsubminor", @@ -2175,7 +2175,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionSubminor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMajor and USBDevice.usbVersionMinor." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The usbVersionSubminor read only property of the\nUSBDevice interface is one of three properties that declare the USB\nprotocol version supported by the device. The other two properties\nare USBDevice.usbVersionMajor and USBDevice.usbVersionMinor." }, "usbdevice.vendorid": { "url": "$MDN_URL$/web/api/usbdevice/vendorid", @@ -2192,7 +2192,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vendorId read only property of the\nUSBDevice interface is the official usb.org-assigned vendor ID." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The vendorId read only property of the\nUSBDevice interface is the official usb.org-assigned vendor ID." }, "usbendpoint": { "url": "$MDN_URL$/web/api/usbendpoint", @@ -2209,7 +2209,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBEndpoint interface of the WebUSB API provides information about an endpoint provided by the USB device. An endpoint represents a unidirectional data stream into or out of a device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBEndpoint interface of the WebUSB API provides information about an endpoint provided by the USB device. An endpoint represents a unidirectional data stream into or out of a device." }, "usbinterface": { "url": "$MDN_URL$/web/api/usbinterface", @@ -2226,7 +2226,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBInterface interface of the WebUSB API provides information about an interface provided by the USB device. An interface represents a feature of the device which implements a particular protocol and may contain endpoints for bidirectional communication." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBInterface interface of the WebUSB API provides information about an interface provided by the USB device. An interface represents a feature of the device which implements a particular protocol and may contain endpoints for bidirectional communication." }, "usbintransferresult": { "url": "$MDN_URL$/web/api/usbintransferresult", @@ -2243,7 +2243,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBInTransferResult interface of the WebUSB API provides the result from a call to the transferIn() and controlTransferIn() methods of the USBDevice interface. It represents the result from requesting a transfer of data from the USB device to the USB host." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBInTransferResult interface of the WebUSB API provides the result from a call to the transferIn() and controlTransferIn() methods of the USBDevice interface. It represents the result from requesting a transfer of data from the USB device to the USB host." }, "usbisochronousintransferpacket": { "url": "$MDN_URL$/web/api/usbisochronousintransferpacket", @@ -2260,7 +2260,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousInTransferPacket interface of the WebUSB API is part of the response from a call to the isochronousTransferIn() method of the USBDevice interface. It represents the status of an individual packet from a request to transfer data from the USB device to the USB host over an isochronous endpoint." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousInTransferPacket interface of the WebUSB API is part of the response from a call to the isochronousTransferIn() method of the USBDevice interface. It represents the status of an individual packet from a request to transfer data from the USB device to the USB host over an isochronous endpoint." }, "usbisochronousintransferresult": { "url": "$MDN_URL$/web/api/usbisochronousintransferresult", @@ -2277,7 +2277,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousInTransferResult interface of the WebUSB API provides the result from a call to the isochronousTransferIn() method of the USBDevice interface. It represents the result from requesting a transfer of data from the USB device to the USB host." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousInTransferResult interface of the WebUSB API provides the result from a call to the isochronousTransferIn() method of the USBDevice interface. It represents the result from requesting a transfer of data from the USB device to the USB host." }, "usbisochronousouttransferpacket": { "url": "$MDN_URL$/web/api/usbisochronousouttransferpacket", @@ -2294,7 +2294,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousOutTransferPacket interface of the WebUSB API is part of the response from a call to the isochronousTransferOut() method of the USBDevice interface. It represents the status of an individual packet from a request to transfer data from the USB host to the USB device over an isochronous endpoint." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousOutTransferPacket interface of the WebUSB API is part of the response from a call to the isochronousTransferOut() method of the USBDevice interface. It represents the status of an individual packet from a request to transfer data from the USB host to the USB device over an isochronous endpoint." }, "usbisochronousouttransferresult": { "url": "$MDN_URL$/web/api/usbisochronousouttransferresult", @@ -2311,7 +2311,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousOutTransferResult interface of the WebUSB API provides the result from a call to the isochronousTransferOut() method of the USBDevice interface. It represents the result from requesting a transfer of data from the USB host to the USB device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBIsochronousOutTransferResult interface of the WebUSB API provides the result from a call to the isochronousTransferOut() method of the USBDevice interface. It represents the result from requesting a transfer of data from the USB host to the USB device." }, "usbouttransferresult": { "url": "$MDN_URL$/web/api/usbouttransferresult", @@ -2328,7 +2328,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBOutTransferResult interface of the WebUSB API provides the result from a call to the transferOut() and controlTransferOut() methods of the USBDevice interface. It represents the result from requesting a transfer of data from the USB host to the USB device." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The USBOutTransferResult interface of the WebUSB API provides the result from a call to the transferOut() and controlTransferOut() methods of the USBDevice interface. It represents the result from requesting a transfer of data from the USB host to the USB device." }, "useractivation": { "url": "$MDN_URL$/web/api/useractivation", @@ -2633,7 +2633,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only valid property of the ValidityState interface indicates if the value of an <input> element meets all its validation constraints, and is therefore considered to be valid.\n

    If true, the element matches the :valid CSS pseudo-class; otherwise the :invalid CSS pseudo-class applies." + "doc": "The read-only valid property of the ValidityState interface indicates if the value of an <input> element meets all its validation constraints, and is therefore considered to be valid.\n

    If true, the element matches the :valid CSS pseudo-class; otherwise the :invalid CSS pseudo-class applies." }, "validitystate.valuemissing": { "url": "$MDN_URL$/web/api/validitystate/valuemissing", @@ -2825,7 +2825,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoDecoder interface of the WebCodecs API decodes chunks of video." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoDecoder interface of the WebCodecs API decodes chunks of video." }, "videodecoder.close": { "url": "$MDN_URL$/web/api/videodecoder/close", @@ -2844,7 +2844,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the VideoDecoder interface ends all pending work and releases system resources.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the VideoDecoder interface ends all pending work and releases system resources.", "returns": "None (undefined)." }, "videodecoder.configure": { @@ -2864,7 +2864,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the VideoDecoder interface enqueues a control message to configure the video decoder for decoding chunks.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the VideoDecoder interface enqueues a control message to configure the video decoder for decoding chunks.", "parameters": { "config": "An object containing the following members:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string. See \"codecs\" parameter for details on codec string construction.\n

    \n
    description Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView containing a sequence of codec specific bytes, commonly known as extradata.\n

    \n
    codedWidth Optional
    \n
    \n

    An integer representing the width of the VideoFrame in pixels, including any non-visible padding, before any ratio adjustments.\n

    \n
    codedHeight Optional
    \n
    \n

    An integer representing the height of the VideoFrame in pixels, including any non-visible padding, before any ratio adjustments.\n

    \n
    displayAspectWidth Optional
    \n
    \n

    An integer representing the horizontal dimension of the VideoFrame in pixels when displayed.\n

    \n
    displayAspectHeight Optional
    \n
    \n

    An integer representing the vertical dimension of the VideoFrame in pixels when displayed.\n

    \n
    colorSpace Optional
    \n
    \n

    An object representing a VideoColorSpace, containing the following members:\n

    \n
    primaries
    \n
    \n

    A string representing the color gamut of the video sample. One of:\n

      \n
    • \"bt709\"
    • \n
    • \"bt470bg\"
    • \n
    • \"smpte170m\"
    • \n
    \n
    \n
    transfer
    \n
    \n

    A string representing transfer characteristics. One of:\n

      \n
    • \"bt709\"
    • \n
    • \"smpte170m\"
    • \n
    • \"iec61966-2-1\"
    • \n
    \n
    \n
    matrix
    \n
    \n

    A string representing a matrix coefficient. One of:\n

      \n
    • \"rgb\"
    • \n
    • \"bt709\"
    • \n
    • \"bt470bg\"
    • \n
    • \"smpte170m\"
    • \n
    \n
    \n
    \n
    \n
    hardwareAcceleration Optional
    \n
    \n

    A hint as to the hardware acceleration method to use. One of:\n

      \n
    • \"no-preference\"
    • \n
    • \"prefer-hardware\"
    • \n
    • \"prefer-software\"
    • \n
    \n
    \n
    optimizeForLatency Optional
    \n
    \n

    A boolean. If true this is a hint that the selected decoder should be optimized to minimize the number of EncodedVideoChunk objects that have to be decoded before a VideoFrame is output.\n

    \n
    flip Optional
    \n
    \n

    A boolean. If true, horizontal mirroring is applied. Defaults to false.\n

    \n
    rotation Optional
    \n
    \n

    An integer representing the rotation (0, 90, 180, or 270) in degrees clockwise. Defaults to 0. Arbitrary numbers (including negatives) are rounded to the next quarter turn.\n

    \n
    " }, @@ -2892,7 +2892,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the VideoDecoder interface enqueues a control message to decode a given chunk of video.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decode() method of the VideoDecoder interface enqueues a control message to decode a given chunk of video.", "parameters": { "chunk": "An EncodedVideoChunk object representing a chunk of encoded video." }, @@ -2919,7 +2919,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decodeQueueSize read-only property of the VideoDecoder interface returns the number of pending decode requests in the queue." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The decodeQueueSize read-only property of the VideoDecoder interface returns the number of pending decode requests in the queue." }, "videodecoder.flush": { "url": "$MDN_URL$/web/api/videodecoder/flush", @@ -2938,7 +2938,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the VideoDecoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the VideoDecoder interface returns a Promise that resolves once all pending messages in the queue have been completed.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Returned if the Promise is rejected because the state is not configured." @@ -2961,7 +2961,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the VideoDecoder interface checks if the given config is supported (that is, if VideoDecoder objects can be successfully configured with the given config).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the VideoDecoder interface checks if the given config is supported (that is, if VideoDecoder objects can be successfully configured with the given config).", "parameters": { "config": "The dictionary object accepted by VideoDecoder.configure" }, @@ -2987,7 +2987,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the VideoDecoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the VideoDecoder interface resets all states including configuration, control messages in the control message queue, and all pending callbacks.", "returns": "None (undefined)." }, "videodecoder.state": { @@ -3007,7 +3007,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state property of the VideoDecoder interface returns the current state of the underlying codec." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state property of the VideoDecoder interface returns the current state of the underlying codec." }, "videodecoder.videodecoder": { "url": "$MDN_URL$/web/api/videodecoder/videodecoder", @@ -3026,7 +3026,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoDecoder() constructor creates a new VideoDecoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the VideoDecoder.state set to \"unconfigured\".", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoDecoder() constructor creates a new VideoDecoder object with the provided init.output callback assigned as the output callback, the provided init.error callback as the error callback, and the VideoDecoder.state set to \"unconfigured\".", "parameters": { "options": "An object containing two callbacks.\n

    \n
    output
    \n
    \n

    A callback which takes a VideoFrame object as its only argument.\n

    \n
    error
    \n
    \n

    A callback which takes an Error object as its only argument.\n

    \n
    " } @@ -3048,7 +3048,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoEncoder interface of the WebCodecs API encodes VideoFrame objects into EncodedVideoChunks." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoEncoder interface of the WebCodecs API encodes VideoFrame objects into EncodedVideoChunks." }, "videoencoder.close": { "url": "$MDN_URL$/web/api/videoencoder/close", @@ -3067,7 +3067,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the VideoEncoder interface ends all pending work and releases system resources.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The close() method of the VideoEncoder interface ends all pending work and releases system resources.", "returns": "None (undefined)." }, "videoencoder.configure": { @@ -3087,7 +3087,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the VideoEncoder interface changes the state of the encoder to \"configured\" and asynchronously prepares the encoder to accept VideoEncoders for encoding with the specified parameters. If the encoder doesn't support the specified parameters or can't be initialized for other reasons an error will be reported via the error callback provided to the VideoEncoder constructor.\n

    If the VideoEncoder has been previously configured, the new configuration will not be applied until all previous tasks have completed.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The configure() method of the VideoEncoder interface changes the state of the encoder to \"configured\" and asynchronously prepares the encoder to accept VideoEncoders for encoding with the specified parameters. If the encoder doesn't support the specified parameters or can't be initialized for other reasons an error will be reported via the error callback provided to the VideoEncoder constructor.\n

    If the VideoEncoder has been previously configured, the new configuration will not be applied until all previous tasks have completed.", "parameters": { "config": "A dictionary object containing the following members:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string. See \"codecs\" parameter for details on codec string construction.\n

    \n
    width Optional
    \n
    \n

    An integer representing the width of each output EncodedVideoChunk in pixels, before any ratio adjustments.\n

    \n
    height Optional
    \n
    \n

    An integer representing the height of each output EncodedVideoChunk in pixels, before any ratio adjustments.\n

    \n
    displayWidth Optional
    \n
    \n

    An integer representing the intended display width of each output EncodedVideoChunk in pixels when displayed.\n

    \n
    displayHeight Optional
    \n
    \n

    An integer representing the vertical dimension of each output EncodedVideoChunk in pixels when displayed.\n

    \n
    hardwareAcceleration
    \n
    \n

    A hint that configures the hardware acceleration method of this codec. One of:\n

      \n
    • \"no-preference\"
    • \n
    • \"prefer-hardware\"
    • \n
    • \"prefer-software\"
    • \n
    \n
    \n
    bitrate
    \n
    \n

    An integer containing the average bitrate of the encoded video in units of bits per second.\n

    \n
    framerate
    \n
    \n

    An integer containing the expected frame rate in frames per second.\n

    \n
    alpha
    \n
    \n

    A string indicating whether the alpha component of the VideoFrame inputs should be kept or discarded prior to encoding. One of:\n

      \n
    • \"discard\" (default)
    • \n
    • \"keep\"
    • \n
    \n
    \n
    scalabilityMode
    \n
    \n

    A string containing an encoding scalability mode identifier as defined in WebRTC.\n

    \n
    bitrateMode Optional
    \n
    \n

    A string containing a bitrate mode. One of:\n

    \n
    \"constant\"
    \n
    \n

    The encoder will target constant bitrate.\n

    \n
    \"variable\" (default)
    \n
    \n

    The encoder will target a variable bitrate, allowing more space to be used for complex signals and less space for less complex signals.\n

    \n
    \"quantizer\"
    \n
    \n

    The encoder will disregard the bitrate option and instead it will use codec-specific quantizer values specified for each frame in the options parameter to VideoEncoder.encode().\n

    \n
    \n
    \n
    latencyMode Optional
    \n
    \n

    A string containing a value that configures the latency behavior of this codec. One of:\n

    \n
    \"quality\" (default)
    \n
    \n

    The encoder should optimize for encoding quality.\n

    \n
    \"realtime\"
    \n
    \n

    The encoder should optimize for low latency and may even drop frames to honor framerate.\n

    \n
    \n
    \n
    " }, @@ -3115,7 +3115,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encode() method of the VideoEncoder interface asynchronously encodes a VideoFrame.\nEncoded data (EncodedVideoChunk) or an error will eventually be returned via the callbacks provided to the VideoEncoder constructor.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encode() method of the VideoEncoder interface asynchronously encodes a VideoFrame.\nEncoded data (EncodedVideoChunk) or an error will eventually be returned via the callbacks provided to the VideoEncoder constructor.", "parameters": { "frame": "A VideoFrame object.", "options": "An object containing the following members:\n

    \n
    keyFrame Optional
    \n
    \n

    A boolean, defaulting to false giving the user agent flexibility to decide if this frame should be encoded as a key frame. If true this indicates that the given frame must be encoded as a key frame.\n

    \n
    vp9 Optional
    \n
    \n

    Encode options for the VP9 codec.\n

    \n
    quantizer
    \n
    \n

    Frame quantizer value 0 to 63. Only effective if VideoEncoder was configured with quantizer bitrate mode.\n

    \n
    \n
    \n
    av1 Optional
    \n
    \n

    Encode options for the AV1 codec.\n

    \n
    quantizer
    \n
    \n

    Frame quantizer value 0 to 63. Only effective if VideoEncoder was configured with quantizer bitrate mode.\n

    \n
    \n
    \n
    avc Optional
    \n
    \n

    Encode options for the AVC (H.264) codec.\n

    \n
    quantizer
    \n
    \n

    Frame quantizer value 0 to 51. Only effective if VideoEncoder was configured with quantizer bitrate mode.\n

    \n
    \n
    \n
    hevc Optional
    \n
    \n

    Encode options for the HEVC (H.265) codec.\n

    \n
    quantizer
    \n
    \n

    Frame quantizer value 0 to 51. Only effective if VideoEncoder was configured with quantizer bitrate mode.\n

    \n
    \n
    \n
    " @@ -3143,7 +3143,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encodeQueueSize read-only property of the VideoEncoder interface returns the number of pending encode requests in the queue." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The encodeQueueSize read-only property of the VideoEncoder interface returns the number of pending encode requests in the queue." }, "videoencoder.flush": { "url": "$MDN_URL$/web/api/videoencoder/flush", @@ -3162,7 +3162,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the VideoEncoder interface forces all pending encodes to complete.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The flush() method of the VideoEncoder interface forces all pending encodes to complete.", "returns": "A Promise that resolves once the encoder's initialization is completed and all pending EncodedVideoChunks are returned.", "throws": { "InvalidStateError DOMException": "Returned if the Promise is rejected because the state is not configured." @@ -3185,7 +3185,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the VideoEncoder interface checks if VideoEncoder can be successfully configured with the given config.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The isConfigSupported() static method of the VideoEncoder interface checks if VideoEncoder can be successfully configured with the given config.", "parameters": { "config": "The dictionary object accepted by VideoEncoder.configure" }, @@ -3211,7 +3211,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the VideoEncoder interface synchronously cancels all pending encodes and callbacks, frees all underlying resources and sets the state to \"unconfigured\".\nAfter calling reset(), configure() must be called before resuming encode() calls.\n

    \n

    Note:\nTo avoid discarding frames queued via encode(), flush() should be called and completed before calling reset().\n

    ", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The reset() method of the VideoEncoder interface synchronously cancels all pending encodes and callbacks, frees all underlying resources and sets the state to \"unconfigured\".\nAfter calling reset(), configure() must be called before resuming encode() calls.\n

    \n

    Note:\nTo avoid discarding frames queued via encode(), flush() should be called and completed before calling reset().\n

    ", "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the state is \"closed\"." @@ -3234,7 +3234,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the VideoEncoder interface returns the current state of the underlying codec." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The state read-only property of the VideoEncoder interface returns the current state of the underlying codec." }, "videoencoder.videoencoder": { "url": "$MDN_URL$/web/api/videoencoder/videoencoder", @@ -3253,7 +3253,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoEncoder() constructor creates a new VideoEncoder object with the provided options.output callback assigned as the output callback, the provided options.error callback as the error callback, and sets the VideoEncoder.state to \"unconfigured\".", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Dedicated Web Workers.

    \n

    The VideoEncoder() constructor creates a new VideoEncoder object with the provided options.output callback assigned as the output callback, the provided options.error callback as the error callback, and sets the VideoEncoder.state to \"unconfigured\".", "parameters": { "options": "An object containing two required callbacks.\n

    \n
    output
    \n
    \n

    A callback which takes an EncodedVideoChunk object as the first argument, and an optional metadata object as the second. The metadata object has three members:\n

    \n
    decoderConfig Optional
    \n
    \n

    An object containing:\n

    \n
    codec
    \n
    \n

    A string containing a valid codec string.\n

    \n
    description Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView containing a sequence of codec-specific bytes, commonly known as \"extradata\".\n

    \n
    codedWidth Optional
    \n
    \n

    An integer representing the width of the VideoFrame in pixels, potentially including non-visible padding, and prior to considering potential ratio adjustments.\n

    \n
    codedHeight Optional
    \n
    \n

    An integer representing the height of the VideoFrame in pixels, potentially including non-visible padding, and prior to considering potential ratio adjustments.\n

    \n
    displayAspectWidth Optional
    \n
    \n

    An integer representing the horizontal dimension of the VideoFrame's aspect ratio when displayed.\n

    \n
    displayAspectHeight Optional
    \n
    \n

    An integer representing the vertical dimension of the VideoFrame's aspect ratio when displayed.\n

    \n
    colorSpace Optional
    \n
    \n

    An object you pass to the VideoColorSpace constructor as the init argument, configuring the VideoFrame.colorSpace for VideoFrames associated with this decoderConfig object. If colorSpace exists, the provided values will override any in-band values from the bitstream.\n

    \n
    hardwareAcceleration Optional
    \n
    \n

    A string that configures hardware acceleration for this codec. Defaults to \"no-preference\". Options are:\n

      \n
    • \"no-preference\"
    • \n
    • \"prefer-hardware\"
    • \n
    • \"prefer-software\"
    • \n
    \n
    \n
    optimizeForLatency Optional
    \n
    \n

    A boolean representing whether the selected decoder should be configured to minimize the number of EncodedVideoChunks that have to be decoded before a VideoFrame is output.\n

    \n
    \n
    \n
    svc Optional
    \n
    \n

    An optional object with only one member: temporalLayerId, which is a number that identifies the temporal layer for the associated EncodedVideoChunk.\n

    \n
    alphaSideData Optional
    \n
    \n

    An ArrayBuffer, a TypedArray, or a DataView\nthat contains the EncodedVideoChunk's extra alpha channel data.\n

    \n
    \n
    \n
    error
    \n
    \n

    A callback which takes an Error object as its only argument.\n

    \n
    " } @@ -4044,7 +4044,7 @@ "baseline": { "level": "NONE" }, - "doc": "The ViewTimeline interface of the Web Animations API represents a view progress timeline (see CSS scroll-driven animations for more details).\n

    Pass a ViewTimeline instance to the Animation() constructor or the animate() method to specify it as the timeline that will control the progress of the animation." + "doc": "The ViewTimeline interface of the Web Animations API represents a view progress timeline (see CSS scroll-driven animations for more details).\n

    Pass a ViewTimeline instance to the Animation() constructor or the animate() method to specify it as the timeline that will control the progress of the animation." }, "viewtimeline.endoffset": { "url": "$MDN_URL$/web/api/viewtimeline/endoffset", @@ -4118,7 +4118,7 @@ }, "doc": "The ViewTimeline() constructor creates a new ViewTimeline object instance.", "parameters": { - "options": "An object that can contain the following properties:\n

    \n
    subject
    \n
    \n

    A reference to an Element representing the subject element whose visibility within its nearest ancestor scrollable element (scroller) will drive the progress of the timeline.\n

    \n
    axis Optional
    \n
    \n

    An enumerated value representing the scroll axis that will drive the progress of the timeline. Possible values are:\n

      \n
    • \"block\": The scrollbar on the block axis of the scroll container, which is the axis in the direction perpendicular to the flow of text within a line. For horizontal writing modes, such as standard English, this is the same as \"y\", while for vertical writing modes, it is the same as \"x\".
    • \n
    • \"inline\": The scrollbar on the inline axis of the scroll container, which is the axis in the direction parallel to the flow of text in a line. For horizontal writing modes, this is the same as \"x\", while for vertical writing modes, this is the same as \"y\".
    • \n
    • \"y\": The scrollbar on the vertical axis of the scroll container.
    • \n
    • \"x\": The scrollbar on the horizontal axis of the scroll container.
    • \n
    \n

    If omitted, axis defaults to \"block\".\n

    \n
    inset Optional
    \n
    \n

    A value or array of values representing an adjustment to the position of the scrollport (see Scroll container for more details) in which the subject is deemed to be visible. Possible values are:\n

      \n
    • \"auto\": The default box position is used.
    • \n
    • A string: If a string is specified, it can consist of one or two values equal to auto or a CSS <length-percentage> value. To put it another way, the string should be a valid view-timeline-inset value.
    • \n
    • An array of one or two values, which can be \"auto\" or a suitable CSSNumericValue to represent a length or percentage offset (for example CSS.px() or CSS.percent(). If an array is provided, the first value represents the start inset (which affects the ViewTimeline.endOffset value) and the second value represents the end inset (which affects the ViewTimeline.startOffset value).
    • \n
    \n

    If the array has only one value, it is duplicated.\n

    If omitted, inset defaults to auto.\n

    \n
    " + "options": "An object that can contain the following properties:\n
    \n
    subject
    \n
    \n

    A reference to an Element representing the subject element whose visibility within its nearest ancestor scrollable element (scroller) will drive the progress of the timeline.\n

    \n
    axis Optional
    \n
    \n

    An enumerated value representing the scroll axis that will drive the progress of the timeline. Possible values are:\n

      \n
    • \"block\": The scrollbar on the block axis of the scroll container, which is the axis in the direction perpendicular to the flow of text within a line. For horizontal writing modes, such as standard English, this is the same as \"y\", while for vertical writing modes, it is the same as \"x\".
    • \n
    • \"inline\": The scrollbar on the inline axis of the scroll container, which is the axis in the direction parallel to the flow of text in a line. For horizontal writing modes, this is the same as \"x\", while for vertical writing modes, this is the same as \"y\".
    • \n
    • \"y\": The scrollbar on the vertical axis of the scroll container.
    • \n
    • \"x\": The scrollbar on the horizontal axis of the scroll container.
    • \n
    \n

    If omitted, axis defaults to \"block\".\n

    \n
    inset Optional
    \n
    \n

    A value or array of values representing an adjustment to the position of the scrollport (see Scroll container for more details) in which the subject is deemed to be visible. Possible values are:\n

      \n
    • \"auto\": The default box position is used.
    • \n
    • A string: If a string is specified, it can consist of one or two values equal to auto or a CSS <length-percentage> value. To put it another way, the string should be a valid view-timeline-inset value.
    • \n
    • An array of one or two values, which can be \"auto\" or a suitable CSSNumericValue to represent a length or percentage offset (for example CSS.px() or CSS.percent(). If an array is provided, the first value represents the start inset (which affects the ViewTimeline.endOffset value) and the second value represents the end inset (which affects the ViewTimeline.startOffset value).
    • \n
    \n

    If the array has only one value, it is duplicated.\n

    If omitted, inset defaults to auto.\n

    \n
    " }, "returns": "A new ViewTimeline object instance." }, @@ -4141,7 +4141,7 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ViewTransition interface of the View Transition API represents an active view transition, and provides functionality to react to the transition reaching different states (e.g., ready to run the animation, or animation finished) or skip the transition altogether.\n

    This object type is made available in the following ways:\n

    \n

    When a view transition is triggered by a startViewTransition() call (or a page navigation in the case of MPA transitions), a sequence of steps is followed as explained in The view transition process. This also explains when the different promises fulfill." + "doc": "The ViewTransition interface of the View Transition API represents an active view transition, and provides functionality to react to the transition reaching different states (e.g., ready to run the animation, or animation finished) or skip the transition altogether.\n

    This object type is made available in the following ways:\n

    \n

    When a view transition is triggered by a startViewTransition() call (or a page navigation in the case of MPA transitions), a sequence of steps is followed as explained in The view transition process. This also explains when the different promises fulfill." }, "viewtransition.finished": { "url": "$MDN_URL$/web/api/viewtransition/finished", @@ -4183,7 +4183,7 @@ "level": "LOW", "lowDate": "2025-10-14" }, - "doc": "The ready read-only property of the\nViewTransition interface is a Promise that fulfills once the pseudo-element tree is created and the transition animation is about to start.\n

    ready will reject if the transition cannot begin. This can be due to misconfiguration, for example, duplicate view-transition-names, or if the callback passed to Document.startViewTransition() throws or returns a promise that rejects." + "doc": "The ready read-only property of the\nViewTransition interface is a Promise that fulfills once the pseudo-element tree is created and the transition animation is about to start.\n

    ready will reject if the transition cannot begin. This can be due to misconfiguration, for example, duplicate view-transition-names, or if the callback passed to Document.startViewTransition() throws or returns a promise that rejects." }, "viewtransition.skiptransition": { "url": "$MDN_URL$/web/api/viewtransition/skiptransition", @@ -4207,6 +4207,27 @@ "doc": "The skipTransition() method of the\nViewTransition interface skips the animation part of the view transition, but doesn't skip running the associated view update.", "returns": "undefined." }, + "viewtransition.types": { + "url": "$MDN_URL$/web/api/viewtransition/types", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "125", + "ChromeAndroid": "125", + "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "111", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "LOW", + "lowDate": "2026-01-13" + }, + "doc": "The types read-only property of the\nViewTransition interface is a ViewTransitionTypeSet that allows the types set on the view transition to be accessed and modified." + }, "viewtransition.updatecallbackdone": { "url": "$MDN_URL$/web/api/viewtransition/updatecallbackdone", "status": [ @@ -4228,6 +4249,27 @@ }, "doc": "The updateCallbackDone read-only property of the\nViewTransition interface is a Promise that fulfills when the promise returned by the document.startViewTransition() method's callback fulfills, or rejects when it rejects.\n

    updateCallbackDone is useful when you don't care about the success/failure of a same-document (SPA) view transition animation, and just want to know if and when the DOM is updated.\n

    \n

    Note:\nIn the case of a cross-document (MPA) view transition, the updateCallbackDone promise of the associated ViewTransition is automatically fulfilled.\n

    " }, + "viewtransitiontypeset": { + "url": "$MDN_URL$/web/api/viewtransitiontypeset", + "status": [ + "StandardTrack" + ], + "compatibility": { + "Chrome": "125", + "ChromeAndroid": "125", + "Edge": "125", + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "111", + "Safari": "18.2", + "SafariIOS": "18.2" + }, + "baseline": { + "level": "LOW", + "lowDate": "2026-01-13" + }, + "doc": "The ViewTransitionTypeSet interface of the View Transition API is a set-like object representing the types of an active view transition. This enables the types to be queried or modified on-the-fly during a transition.\n

    The ViewTransitionTypeSet object can be accessed via the ViewTransition.types property.\n

    The property and method links below link to the JavaScript Set object documentation." + }, "virtualkeyboard": { "url": "$MDN_URL$/web/api/virtualkeyboard", "status": [ @@ -4243,7 +4285,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The VirtualKeyboard interface of the VirtualKeyboard API is useful on devices that have on-screen virtual keyboards, such as tablets, mobile phones, or other devices where a hardware keyboard may not be available.\n

    The VirtualKeyboard interface makes it possible to opt out of the automatic way browsers handle on-screen virtual keyboards by reducing the height of the viewport to make room for the virtual keyboard. You can prevent the browser from changing the size of the viewport, detect the position and size of the virtual keyboard — adapting the layout of your web page as a follow-up — and programmatically show or hide the virtual keyboard.\n

    You access the VirtualKeyboard interface by using navigator.virtualKeyboard." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The VirtualKeyboard interface of the VirtualKeyboard API is useful on devices that have on-screen virtual keyboards, such as tablets, mobile phones, or other devices where a hardware keyboard may not be available.\n

    The VirtualKeyboard interface makes it possible to opt out of the automatic way browsers handle on-screen virtual keyboards by reducing the height of the viewport to make room for the virtual keyboard. You can prevent the browser from changing the size of the viewport, detect the position and size of the virtual keyboard — adapting the layout of your web page as a follow-up — and programmatically show or hide the virtual keyboard.\n

    You access the VirtualKeyboard interface by using navigator.virtualKeyboard." }, "virtualkeyboard.boundingrect": { "url": "$MDN_URL$/web/api/virtualkeyboard/boundingrect", @@ -4260,7 +4302,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The boundingRect property of the VirtualKeyboard interface contains a DOMRect indicating the position and size of the on-screen virtual keyboard that overlays the web page.\n

    The on-screen virtual keyboard will overlay the viewport when the Virtual Keyboard API is used to prevent the browser from resizing the viewport automatically. This is done by setting the overlaysContent property to true." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The boundingRect property of the VirtualKeyboard interface contains a DOMRect indicating the position and size of the on-screen virtual keyboard that overlays the web page.\n

    The on-screen virtual keyboard will overlay the viewport when the Virtual Keyboard API is used to prevent the browser from resizing the viewport automatically. This is done by setting the overlaysContent property to true." }, "virtualkeyboard.hide": { "url": "$MDN_URL$/web/api/virtualkeyboard/hide", @@ -4277,7 +4319,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hide() method of the VirtualKeyboard interface programmatically hides the on-screen virtual keyboard. This is useful when the page needs to implement its own virtual keyboard logic by using the VirtualKeyboard API.\n

    This method only works if the currently-focused element's virtualKeyboardPolicy attribute is set to manual and inputmode isn't set to none.\n

    The hide() method always returns undefined and triggers a geometrychange event.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The hide() method of the VirtualKeyboard interface programmatically hides the on-screen virtual keyboard. This is useful when the page needs to implement its own virtual keyboard logic by using the VirtualKeyboard API.\n

    This method only works if the currently-focused element's virtualKeyboardPolicy attribute is set to manual and inputmode isn't set to none.\n

    The hide() method always returns undefined and triggers a geometrychange event.", "returns": "Undefined." }, "virtualkeyboard.overlayscontent": { @@ -4295,7 +4337,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The overlaysContent property of the VirtualKeyboard interface can be used to opt out of the automatic way in which browsers handle on-screen virtual keyboards by reducing the size of the viewport to make space for them.\n

    If the overlaysContent property is set to true, the browser no longer resizes the viewport when the virtual keyboard appears. The virtual keyboard instead overlays the content of the web page, and you can adapt the page layout as appropriate using the Virtual Keyboard API and your own custom CSS and JavaScript." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The overlaysContent property of the VirtualKeyboard interface can be used to opt out of the automatic way in which browsers handle on-screen virtual keyboards by reducing the size of the viewport to make space for them.\n

    If the overlaysContent property is set to true, the browser no longer resizes the viewport when the virtual keyboard appears. The virtual keyboard instead overlays the content of the web page, and you can adapt the page layout as appropriate using the Virtual Keyboard API and your own custom CSS and JavaScript." }, "virtualkeyboard.show": { "url": "$MDN_URL$/web/api/virtualkeyboard/show", @@ -4312,7 +4354,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The show() method of the VirtualKeyboard interface programmatically shows the on-screen virtual keyboard. This is useful when the page needs to implement its own virtual keyboard logic, especially when using the virtualkeyboardpolicy attribute on contenteditable elements as explained in Control the virtual keyboard on contenteditable elements.\n

    This method only works if the currently-focused element is a form control — such as an <input> or <textarea> element — or if the focused element is contenteditable, and the currently-focused element's virtualKeyboardPolicy attribute is set to manual and inputmode isn't set to none.\n

    The show() method always returns undefined and triggers a geometrychange event.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The show() method of the VirtualKeyboard interface programmatically shows the on-screen virtual keyboard. This is useful when the page needs to implement its own virtual keyboard logic, especially when using the virtualkeyboardpolicy attribute on contenteditable elements as explained in Control the virtual keyboard on contenteditable elements.\n

    This method only works if the currently-focused element is a form control — such as an <input> or <textarea> element — or if the focused element is contenteditable, and the currently-focused element's virtualKeyboardPolicy attribute is set to manual and inputmode isn't set to none.\n

    The show() method always returns undefined and triggers a geometrychange event.", "returns": "Undefined." }, "visibilitystateentry": { @@ -4352,7 +4394,7 @@ "lowDate": "2021-08-10", "highDate": "2024-02-10" }, - "doc": "The VisualViewport interface of the Visual Viewport API represents the visual viewport for a given window. For a page containing iframes, each iframe, as well as the containing page, will have a unique window object. Each window on a page will have a unique VisualViewport representing the properties associated with that window.\n

    You can get a window's visual viewport using Window.visualViewport.\n

    \n

    Note:\nOnly the top-level window has a visual viewport that's distinct from the layout viewport. Therefore, it's generally only the VisualViewport object of the top-level window that's useful. For an <iframe>, visual viewport metrics like VisualViewport.width always correspond to layout viewport metrics like document.documentElement.clientWidth.\n

    " + "doc": "The VisualViewport interface of the CSSOM view API represents the visual viewport for a given window. For a page containing iframes, each iframe, as well as the containing page, will have a unique window object. Each window on a page will have a unique VisualViewport representing the properties associated with that window.\n

    The mobile web contains two viewports, the layout viewport and the visual viewport. The layout viewport covers all the elements on a page and the visual viewport is what is actually visible on the screen. When the user pinch-zooms into the page, the visual viewport shrinks but the layout viewport is unchanged. User-interface features like the on-screen keyboard (OSK) can shrink the visual viewport without affecting the layout viewport.\n

    What happens when a web page element needs to be visible on screen regardless of the visible portion of a web page? For example, what if you need a set of image controls to remain on screen regardless of the pinch-zoom level of the device? Current browsers vary in how they handle this. The visual viewport lets web developers solve this by positioning elements relative to what's shown on-screen.\n

    You can get a window's visual viewport using Window.visualViewport.\n

    \n

    Note:\nOnly the top-level window has a visual viewport that's distinct from the layout viewport. Therefore, it's generally only the VisualViewport object of the top-level window that's useful. For an <iframe>, visual viewport metrics like VisualViewport.width always correspond to layout viewport metrics like document.documentElement.clientWidth.\n

    " }, "visualviewport.height": { "url": "$MDN_URL$/web/api/visualviewport/height", @@ -5353,7 +5395,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WakeLock interface of the Screen Wake Lock API can be used to request a lock that prevents device screens from dimming or locking when an application needs to keep running.\n

    This interface, and hence the system wake lock, is exposed through the Navigator.wakeLock property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WakeLock interface of the Screen Wake Lock API can be used to request a lock that prevents device screens from dimming or locking when an application needs to keep running.\n

    This interface, and hence the system wake lock, is exposed through the Navigator.wakeLock property." }, "wakelock.request": { "url": "$MDN_URL$/web/api/wakelock/request", @@ -5374,7 +5416,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The request() method of the WakeLock interface returns a Promise that fulfills with a WakeLockSentinel object if the system screen wake lock is granted.\n

    The screen wake lock prevents device screens from dimming or locking when an application needs to keep running.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The request() method of the WakeLock interface returns a Promise that fulfills with a WakeLockSentinel object if the system screen wake lock is granted.\n

    The screen wake lock prevents device screens from dimming or locking when an application needs to keep running.", "parameters": { "type": "A string specifying the screen wake lock type, from among the following enumerated types:\n

    \n
    screen
    \n
    \n

    Prevents the screen from turning off.\nOnly visible documents can acquire the screen wake lock.\n

    \n
    " }, @@ -5402,7 +5444,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WakeLockSentinel interface of the Screen Wake Lock API can be used to monitor the status of the platform screen wake lock, and manually release the lock when needed.\n

    The screen wake lock prevents device screens from dimming or locking when an application needs to keep running.\n

    A screen wake lock is requested using the navigator.wakeLock.request() method, which returns a Promise that fulfills with a WakeLockSentinel object if the lock is granted.\n

    An acquired screen wake lock can be released manually via the release() method, or automatically via the platform screen wake lock. The latter may occur if the document becomes inactive or loses visibility, if the device is low on power, or if the user turns on a power save mode.\nA released WakeLockSentinel cannot be re-used: a new sentinel must be requested using navigator.wakeLock.request() if a new lock is needed.\nReleasing all WakeLockSentinel instances of a given wake lock type will cause the underlying platform wake lock to be released.\n

    An event is fired at the WakeLockSentinel if the platform lock is released, allowing applications to configure their UI, and re-request the lock if needed." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WakeLockSentinel interface of the Screen Wake Lock API can be used to monitor the status of the platform screen wake lock, and manually release the lock when needed.\n

    The screen wake lock prevents device screens from dimming or locking when an application needs to keep running.\n

    A screen wake lock is requested using the navigator.wakeLock.request() method, which returns a Promise that fulfills with a WakeLockSentinel object if the lock is granted.\n

    An acquired screen wake lock can be released manually via the release() method, or automatically via the platform screen wake lock. The latter may occur if the document becomes inactive or loses visibility, if the device is low on power, or if the user turns on a power save mode.\nA released WakeLockSentinel cannot be re-used: a new sentinel must be requested using navigator.wakeLock.request() if a new lock is needed.\nReleasing all WakeLockSentinel instances of a given wake lock type will cause the underlying platform wake lock to be released.\n

    An event is fired at the WakeLockSentinel if the platform lock is released, allowing applications to configure their UI, and re-request the lock if needed." }, "wakelocksentinel.release": { "url": "$MDN_URL$/web/api/wakelocksentinel/release", @@ -5423,7 +5465,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The release() method of the WakeLockSentinel interface releases the WakeLockSentinel, returning a Promise that is resolved once the sentinel has been successfully released.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The release() method of the WakeLockSentinel interface releases the WakeLockSentinel, returning a Promise that is resolved once the sentinel has been successfully released.", "returns": "Returns a Promise that resolves with undefined." }, "wakelocksentinel.released": { @@ -5445,7 +5487,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The released read-only property of the WakeLockSentinel interface returns a boolean that indicates whether a WakeLockSentinel has been released.\n

    The WakeLockSentinel is released when the associated platform screen wake lock is revoked; afterwards released will always return true.\nIf a subsequent screen wake lock is required, the application will need to request a new screen wake lock (the current WakeLockSentinel cannot be reused)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The released read-only property of the WakeLockSentinel interface returns a boolean that indicates whether a WakeLockSentinel has been released.\n

    The WakeLockSentinel is released when the associated platform screen wake lock is revoked; afterwards released will always return true.\nIf a subsequent screen wake lock is required, the application will need to request a new screen wake lock (the current WakeLockSentinel cannot be reused)." }, "wakelocksentinel.type": { "url": "$MDN_URL$/web/api/wakelocksentinel/type", @@ -5466,7 +5508,7 @@ "level": "LOW", "lowDate": "2025-03-31" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the WakeLockSentinel interface returns a string representation of the currently acquired WakeLockSentinel type." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The type read-only property of the WakeLockSentinel interface returns a string representation of the currently acquired WakeLockSentinel type." }, "waveshapernode": { "url": "$MDN_URL$/web/api/waveshapernode", @@ -6853,7 +6895,7 @@ "highDate": "2018-01-29" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The WebGLRenderingContext.createRenderbuffer() method of\nthe WebGL API creates and initializes a\nWebGLRenderbuffer object.", - "returns": "A WebGLRenderbuffer object that stores data such an image, or can be\nsource or target of an rendering operation." + "returns": "A WebGLRenderbuffer object that stores data such an image, or can be\nsource or target of a rendering operation." }, "webgl2renderingcontext.createsampler": { "url": "$MDN_URL$/web/api/webgl2renderingcontext/createsampler", @@ -8421,7 +8463,7 @@ "parameters": { "target": "A GLenum specifying the target renderbuffer object. Possible values:\n

    \n
    gl.RENDERBUFFER
    \n
    \n

    Buffer data storage for single images in a\nrenderable internal format.\n

    \n
    ", "internalformat": "A GLenum specifying the internal format about which to retrieve\ninformation (must be a color-renderable, depth-renderable or stencil-renderable\nformat).", - "pname": "A GLenum specifying the type of information to query. Possible\nvalues:\n
    \n
    gl.SAMPLES
    \n
    \n

    Returns a Int32Array containing sample\ncounts supported for internalformat in descending order.\n

    \n
    " + "pname": "A GLenum specifying the type of information to query. Possible\nvalues:\n
    \n
    gl.SAMPLES
    \n
    \n

    Returns an Int32Array containing sample\ncounts supported for internalformat in descending order.\n

    \n
    " }, "returns": "Depends on the requested information (as specified with pname). It is an\nInt32Array if pname is gl.SAMPLES." }, @@ -11271,13 +11313,11 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers.

    \n

    The WebGLRenderingContext.bufferSubData() method of the\nWebGL API updates a subset of a buffer\nobject's data store.", + "doc": "

    Note: This feature is available in Web Workers.

    \n

    The WebGLRenderingContext.bufferSubData() method of the WebGL API updates a subset of a buffer object's data store.", "parameters": { - "target": "A GLenum specifying the binding point (target). Possible values:\n

    \n
    gl.ARRAY_BUFFER
    \n
    \n

    Buffer containing vertex attributes, such as\nvertex coordinates, texture coordinate data, or vertex color data.\n

    \n
    gl.ELEMENT_ARRAY_BUFFER
    \n
    \n

    Buffer used for element indices.\n

    \n
    \n

    When using a WebGL 2 context,\nthe following values are available additionally:\n

    \n
    gl.COPY_READ_BUFFER
    \n
    \n

    Buffer for copying from one buffer object to another.\n

    \n
    gl.COPY_WRITE_BUFFER
    \n
    \n

    Buffer for copying from one buffer object to another.\n

    \n
    gl.TRANSFORM_FEEDBACK_BUFFER
    \n
    \n

    Buffer for transform feedback operations.\n

    \n
    gl.UNIFORM_BUFFER
    \n
    \n

    Buffer used for storing uniform blocks.\n

    \n
    gl.PIXEL_PACK_BUFFER
    \n
    \n

    Buffer used for pixel transfer operations.\n

    \n
    gl.PIXEL_UNPACK_BUFFER
    \n
    \n

    Buffer used for pixel transfer operations.\n

    \n
    ", - "dstByteOffset": "A GLintptr specifying an offset in bytes where the data replacement\nwill start.", - "srcData": "A TypedArray or a DataView that views an ArrayBuffer or SharedArrayBuffer\nthat will be copied into the data store.", - "srcOffset": "A GLuint specifying the element index offset where to start reading\nthe buffer.", - "length": "A GLuint defaulting to 0." + "target": "A GLenum specifying the binding point (target). Possible values:\n
    \n
    gl.ARRAY_BUFFER
    \n
    \n

    Buffer containing vertex attributes, such as vertex coordinates, texture coordinate data, or vertex color data.\n

    \n
    gl.ELEMENT_ARRAY_BUFFER
    \n
    \n

    Buffer used for element indices.\n

    \n
    ", + "offset": "A GLintptr specifying an offset in bytes where the data replacement will start.", + "srcData": "A TypedArray or a DataView that views an ArrayBuffer or SharedArrayBuffer that will be copied into the data store." }, "returns": "None (undefined)." }, @@ -11724,7 +11764,7 @@ "highDate": "2018-01-29" }, "doc": "

    Note: This feature is available in Web Workers.

    \n

    The WebGLRenderingContext.createRenderbuffer() method of\nthe WebGL API creates and initializes a\nWebGLRenderbuffer object.", - "returns": "A WebGLRenderbuffer object that stores data such an image, or can be\nsource or target of an rendering operation." + "returns": "A WebGLRenderbuffer object that stores data such an image, or can be\nsource or target of a rendering operation." }, "webglrenderingcontext.createshader": { "url": "$MDN_URL$/web/api/webglrenderingcontext/createshader", @@ -14658,7 +14698,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransport interface of the WebTransport API provides functionality to enable a user agent to connect to an HTTP/3 server, initiate reliable and unreliable transport in either or both directions, and close the connection once it is no longer needed." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransport interface of the WebTransport API provides functionality to enable a user agent to connect to an HTTP/3 server, initiate reliable and unreliable transport in either or both directions, and close the connection once it is no longer needed." }, "webtransport.close": { "url": "$MDN_URL$/web/api/webtransport/close", @@ -14676,7 +14716,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the WebTransport interface closes an ongoing WebTransport session.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The close() method of the WebTransport interface closes an ongoing WebTransport session.", "parameters": { "info": "An object containing the following properties:\n

    \n
    closeCode
    \n
    \n

    A number representing the error code for the error.\n

    \n
    reason
    \n
    \n

    A string representing the reason for closing the WebTransport.\n

    \n
    " }, @@ -14701,7 +14741,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The closed read-only property of the WebTransport interface returns a promise that resolves when the transport is closed.\n

    This promise is created when the WebTransport object is created and is resolved when the transport is closed in any way, such as by calling the close() method, when the connection failed, or when the connection is closed by the server. Accessing or awaiting this promise does not trigger any action; it only allows actions to be taken when the transport is closed, similar to listening to an event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The closed read-only property of the WebTransport interface returns a promise that resolves when the transport is closed.\n

    This promise is created when the WebTransport object is created and is resolved when the transport is closed in any way, such as by calling the close() method, when the connection failed, or when the connection is closed by the server. Accessing or awaiting this promise does not trigger any action; it only allows actions to be taken when the transport is closed, similar to listening to an event." }, "webtransport.congestioncontrol": { "url": "$MDN_URL$/web/api/webtransport/congestioncontrol", @@ -14716,7 +14756,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The congestionControl read-only property of the WebTransport interface indicates the application's preference for either high throughput or low-latency when sending data.\n

    The value is set in the WebTransport() constructor options." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The congestionControl read-only property of the WebTransport interface indicates the application's preference for either high throughput or low-latency when sending data.\n

    The value is set in the WebTransport() constructor options." }, "webtransport.createbidirectionalstream": { "url": "$MDN_URL$/web/api/webtransport/createbidirectionalstream", @@ -14734,9 +14774,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBidirectionalStream() method of the WebTransport interface asynchronously opens and returns a bidirectional stream.\n

    The method returns a Promise that resolves to a WebTransportBidirectionalStream object, which has readable and writable properties that can be used to reliably read from and write to the server.\n\"Reliable\" means that transmission and order of data are guaranteed.\nThis provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications.\n

    The relative order in which queued bytes are emptied from created streams can be specified using the sendOrder option.\nIf set, queued bytes in streams with a higher send order are guaranteed to be sent before queued bytes for streams with a lower send order.\nIf the order number is not set then the order in which bytes are sent is implementation dependent.\nNote however that even though bytes from higher send-order streams are sent first, they may not arrive first.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createBidirectionalStream() method of the WebTransport interface asynchronously opens and returns a bidirectional stream.\n

    The method returns a Promise that resolves to a WebTransportBidirectionalStream object, which has readable and writable properties that can be used to reliably read from and write to the server.\n\"Reliable\" means that transmission and order of data are guaranteed.\nThis provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications.\n

    The relative order in which queued bytes are emptied from created streams can be specified using the sendOrder option.\nIf set, queued bytes in streams with a higher send order are guaranteed to be sent before queued bytes for streams with a lower send order.\nIf the order number is not set then the order in which bytes are sent is implementation dependent.\nNote however that even though bytes from higher send-order streams are sent first, they may not arrive first.", "parameters": { - "options": "An object that may have the following properties:\n

    \n
    sendOrder Optional
    \n
    \n

    A integer value specifying the send priority of this stream relative to other streams for which the value has been set.\nQueued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation.\n

    \n
    " + "options": "An object that may have the following properties:\n
    \n
    sendOrder Optional
    \n
    \n

    An integer value specifying the send priority of this stream relative to other streams for which the value has been set.\nQueued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation.\n

    \n
    " }, "returns": "A Promise that resolves to a WebTransportBidirectionalStream object.", "throws": { @@ -14757,9 +14797,9 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createUnidirectionalStream() method of the WebTransport interface asynchronously opens a unidirectional stream.\n

    The method returns a Promise that resolves to a WritableStream object, which can be used to reliably write data to the server.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications.\n

    The relative order in which queued bytes are emptied from created streams can be specified using the sendOrder option.\nIf set, queued bytes in streams with a higher send order are guaranteed to be sent before queued bytes for streams with a lower send order.\nIf the order number is not set then the order in which bytes are sent is implementation dependent.\nNote however that even though bytes from higher send-order streams are sent first, they may not arrive first.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The createUnidirectionalStream() method of the WebTransport interface asynchronously opens a unidirectional stream.\n

    The method returns a Promise that resolves to a WritableStream object, which can be used to reliably write data to the server.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications.\n

    The relative order in which queued bytes are emptied from created streams can be specified using the sendOrder option.\nIf set, queued bytes in streams with a higher send order are guaranteed to be sent before queued bytes for streams with a lower send order.\nIf the order number is not set then the order in which bytes are sent is implementation dependent.\nNote however that even though bytes from higher send-order streams are sent first, they may not arrive first.", "parameters": { - "options": "An object that may have the following properties:\n

    \n
    sendOrder Optional
    \n
    \n

    A integer value specifying the send priority of this stream relative to other streams for which the value has been set.\nQueued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation.\n

    \n
    " + "options": "An object that may have the following properties:\n
    \n
    sendOrder Optional
    \n
    \n

    An integer value specifying the send priority of this stream relative to other streams for which the value has been set.\nQueued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation.\n

    \n
    " }, "returns": "A Promise that resolves to a WebTransportSendStream object (this is a WritableStream).", "throws": { @@ -14782,7 +14822,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The datagrams read-only property of the WebTransport interface returns a WebTransportDatagramDuplexStream instance that can be used to send and receive datagrams — unreliable data transmission.\n

    \"Unreliable\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The datagrams read-only property of the WebTransport interface returns a WebTransportDatagramDuplexStream instance that can be used to send and receive datagrams — unreliable data transmission.\n

    \"Unreliable\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." }, "webtransport.getstats": { "url": "$MDN_URL$/web/api/webtransport/getstats", @@ -14794,8 +14834,8 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransport interface asynchronously returns an object containing HTTP/3 connection statistics.", - "returns": "A Promise that resolves to a object containing HTTP/3 connection statistics.\nThe returned object may have the following properties/statistics:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    bytesSent
    \n
    \n

    A positive integer indicating the number of bytes sent on the QUIC connection, including retransmissions.\nNote that this count does not include additional data from protocols used by QUIC, such as UDP, or any other outer framing.\n

    \n
    packetsSent
    \n
    \n

    A positive integer indicating the number of packets sent on the QUIC connection, including those that are known to have been lost.\n

    \n
    packetsLost
    \n
    \n

    A positive integer indicating the number of packets lost on the QUIC connection.\nThis value will increase as packets are declared lost, and decrease if they are subsequently received.\n

    \n
    numOutgoingStreamsCreated
    \n
    \n

    A positive integer indicating the number of outgoing QUIC streams created on the QUIC connection.\n

    \n
    numIncomingStreamsCreated
    \n
    \n

    A positive integer indicating the number of incoming QUIC streams created on the QUIC connection.\n

    \n
    bytesReceived
    \n
    \n

    A positive integer indicating the total number of bytes received on the QUIC connection.\nThis count includes duplicate data from streams, but does not include additional data for protocols used by QUIC, such as UDP, or any other outer framing.\n

    \n
    packetsReceived
    \n
    \n

    A positive integer indicating the total number of packets received on the QUIC connection, including packets that were not processable.\n

    \n
    smoothedRtt
    \n
    \n

    A DOMHighResTimeStamp containing the smoothed round-trip time (RTT) currently observed on the connection, calculated as an exponentially weighted moving average of an endpoint's RTT samples after taking account of acknowledgement delays.\n

    \n
    rttVariation
    \n
    \n

    A DOMHighResTimeStamp containing the mean variation in round-trip time samples currently observed on the connection.\n

    \n
    minRtt
    \n
    \n

    A DOMHighResTimeStamp containing the minimum round-trip time observed on the entire connection.\n

    \n
    datagrams
    \n
    \n

    An object containing statistics for datagram transmission over the connection.\nThe object has the following properties:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    expiredOutgoing
    \n
    \n

    A positive integer indicating the number of datagrams that were dropped from the queue for sending because they expired.\nNote that the maximum age before a datagram in the send-queue expires can be found in outgoingMaxAge.\n

    \n
    droppedIncoming
    \n
    \n

    A positive integer indicating the number incoming datagrams that were dropped.\nIncoming datagrams are dropped if the application does not read them before new datagrams overflow the readable stream receive queue.\n

    \n
    lostOutgoing
    \n
    \n

    A positive integer indicating the number of sent datagrams that were declared lost.\nNote that a datagram may be declared lost if, for example, no acknowledgement arrived within a timeout, or an acknowledgement for a later datagram was received first.\n

    \n
    \n
    \n
    \n" + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransport interface asynchronously returns an object containing HTTP/3 connection statistics.", + "returns": "A Promise that resolves to an object containing HTTP/3 connection statistics.\nThe returned object may have the following properties/statistics:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    bytesSent
    \n
    \n

    A positive integer indicating the number of bytes sent on the QUIC connection, including retransmissions.\nNote that this count does not include additional data from protocols used by QUIC, such as UDP, or any other outer framing.\n

    \n
    packetsSent
    \n
    \n

    A positive integer indicating the number of packets sent on the QUIC connection, including those that are known to have been lost.\n

    \n
    packetsLost
    \n
    \n

    A positive integer indicating the number of packets lost on the QUIC connection.\nThis value will increase as packets are declared lost, and decrease if they are subsequently received.\n

    \n
    numOutgoingStreamsCreated
    \n
    \n

    A positive integer indicating the number of outgoing QUIC streams created on the QUIC connection.\n

    \n
    numIncomingStreamsCreated
    \n
    \n

    A positive integer indicating the number of incoming QUIC streams created on the QUIC connection.\n

    \n
    bytesReceived
    \n
    \n

    A positive integer indicating the total number of bytes received on the QUIC connection.\nThis count includes duplicate data from streams, but does not include additional data for protocols used by QUIC, such as UDP, or any other outer framing.\n

    \n
    packetsReceived
    \n
    \n

    A positive integer indicating the total number of packets received on the QUIC connection, including packets that were not processable.\n

    \n
    smoothedRtt
    \n
    \n

    A DOMHighResTimeStamp containing the smoothed round-trip time (RTT) currently observed on the connection, calculated as an exponentially weighted moving average of an endpoint's RTT samples after taking account of acknowledgement delays.\n

    \n
    rttVariation
    \n
    \n

    A DOMHighResTimeStamp containing the mean variation in round-trip time samples currently observed on the connection.\n

    \n
    minRtt
    \n
    \n

    A DOMHighResTimeStamp containing the minimum round-trip time observed on the entire connection.\n

    \n
    datagrams
    \n
    \n

    An object containing statistics for datagram transmission over the connection.\nThe object has the following properties:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    expiredOutgoing
    \n
    \n

    A positive integer indicating the number of datagrams that were dropped from the queue for sending because they expired.\nNote that the maximum age before a datagram in the send-queue expires can be found in outgoingMaxAge.\n

    \n
    droppedIncoming
    \n
    \n

    A positive integer indicating the number incoming datagrams that were dropped.\nIncoming datagrams are dropped if the application does not read them before new datagrams overflow the readable stream receive queue.\n

    \n
    lostOutgoing
    \n
    \n

    A positive integer indicating the number of sent datagrams that were declared lost.\nNote that a datagram may be declared lost if, for example, no acknowledgement arrived within a timeout, or an acknowledgement for a later datagram was received first.\n

    \n
    \n
    \n
    \n" }, "webtransport.incomingbidirectionalstreams": { "url": "$MDN_URL$/web/api/webtransport/incomingbidirectionalstreams", @@ -14813,7 +14853,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingBidirectionalStreams read-only property of the WebTransport interface represents one or more bidirectional streams opened by the server. Returns a ReadableStream of WebTransportBidirectionalStream objects. Each one can be used to reliably read data from the server and write data back to it.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingBidirectionalStreams read-only property of the WebTransport interface represents one or more bidirectional streams opened by the server. Returns a ReadableStream of WebTransportBidirectionalStream objects. Each one can be used to reliably read data from the server and write data back to it.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications." }, "webtransport.incomingunidirectionalstreams": { "url": "$MDN_URL$/web/api/webtransport/incomingunidirectionalstreams", @@ -14831,7 +14871,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingUnidirectionalStreams read-only property of the WebTransport interface represents one or more unidirectional streams opened by the server. Returns a ReadableStream of WebTransportReceiveStream objects. Each one can be used to reliably read data from the server.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingUnidirectionalStreams read-only property of the WebTransport interface represents one or more unidirectional streams opened by the server. Returns a ReadableStream of WebTransportReceiveStream objects. Each one can be used to reliably read data from the server.\n

    \"Reliable\" means that transmission and order of data are guaranteed. This provides slower delivery (albeit faster than with WebSockets) than datagrams, but is needed in situations where reliability and ordering are important, like chat applications." }, "webtransport.ready": { "url": "$MDN_URL$/web/api/webtransport/ready", @@ -14849,7 +14889,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ready read-only property of the WebTransport interface returns a promise that resolves when the transport is ready to use.\n

    This promise is created when the WebTransport object is created and is resolved when a connection is established. Accessing or awaiting this promise does not trigger any action; it only allows actions to be taken when the transport is ready, similar to listening to an event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The ready read-only property of the WebTransport interface returns a promise that resolves when the transport is ready to use.\n

    This promise is created when the WebTransport object is created and is resolved when a connection is established. Accessing or awaiting this promise does not trigger any action; it only allows actions to be taken when the transport is ready, similar to listening to an event." }, "webtransport.reliability": { "url": "$MDN_URL$/web/api/webtransport/reliability", @@ -14864,7 +14904,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reliability read-only property of the WebTransport interface indicates whether the connection supports reliable transports only, or whether it also supports unreliable transports (such as UDP)." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The reliability read-only property of the WebTransport interface indicates whether the connection supports reliable transports only, or whether it also supports unreliable transports (such as UDP)." }, "webtransport.webtransport": { "url": "$MDN_URL$/web/api/webtransport/webtransport", @@ -14882,7 +14922,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransport() constructor creates a new WebTransport object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransport() constructor creates a new WebTransport object instance.", "parameters": { "url": "A string representing the URL of the HTTP/3 server to connect to.\nThe scheme must be HTTPS, and the port number needs to be explicitly specified.", "options": "An object that may have the following properties:\n

    \n
    allowPooling Optional
    \n
    \n

    A boolean value.\nIf true, the network connection for this WebTransport can be shared with a pool of other HTTP/3 sessions.\nBy default the value is false, and the connection cannot be shared.\n

    \n
    congestionControl Optional
    \n
    \n

    A string indicating the application's preference that the congestion control algorithm used when sending data over this connection be tuned for either throughput or low-latency.\nThis is a hint to the user agent.\nThe allowed values are: default (default), throughput, and low-latency.\n

    \n
    requireUnreliable Optional
    \n
    \n

    A boolean value.\nIf true, the connection cannot be established over HTTP/2 if an HTTP/3 connection is not possible.\nBy default the value is false.\n

    \n
    serverCertificateHashes Optional
    \n
    \n

    An array of objects, each defining the hash value of a server certificate along with the name of the algorithm that was used to generate it.\nThis option is only supported for transports using dedicated connections (allowPooling is false).\n

    If specified, the browser will attempt to authenticate the certificate provided by the server against the provided certificate hash(es) in order to connect, instead of using the Web public key infrastructure (PKI).\nIf any hashes match, the browser knows that the server has possession of a trusted certificate and will connect as normal.\nIf empty the user agent uses the same PKI certificate verification procedures it would use for a normal fetch operation.\n

    This feature allows developers to connect to WebTransport servers that would normally find obtaining a publicly trusted certificate challenging, such as hosts that are not publicly routable, or ephemeral hosts like virtual machines.\n

    \n

    Note:\nThe web application might typically fetch the hashes from a trusted intermediary.\nFor example, you might use a cloud provider to provision VMs that run your WebTransport servers.\nThe provider has trusted access to the server and can request its certificate, generate hashes, and provide these to the application via an API (which is mediated via PKI), or a cloud console.\nThe web application can now connect directly to the VM-hosted server using the supplied hashes, even though the VM itself does not have a long-lived TLS certificate.\n

    \n

    The certificate must be an X.509v3 certificate that has a validity period of less that 2 weeks, and the current time must be within that validity period.\nThe format of the public key in the certificate depends on the implementation, but must minimally include ECDSA with the secp256r1 (NIST P-256) named group, and must not include RSA keys.\nAn ECSDA key is therefore an interoperable default public key format.\nA user agent may add further requirements; these will be listed in the browser compatibility section if known.\n

    Each object in the array has the following properties:\n

    \n
    algorithm
    \n
    \n

    A string with the value: sha-256 (case-insensitive).\nNote that this string represents the algorithm to use to verify the hash, and that any hash using an unknown algorithm will be ignored.\nAt time of writing, SHA-256 is the only hash algorithm listed in the specification.\n

    \n
    value
    \n
    \n

    An ArrayBuffer or TypedArray containing the hash value.\n

    \n
    \n
    \n
    " @@ -14909,7 +14949,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportBidirectionalStream interface of the WebTransport API represents a bidirectional stream created by a server or a client that can be used for reliable transport. Provides access to a WebTransportReceiveStream for reading incoming data, and a WebTransportSendStream for writing outgoing data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportBidirectionalStream interface of the WebTransport API represents a bidirectional stream created by a server or a client that can be used for reliable transport. Provides access to a WebTransportReceiveStream for reading incoming data, and a WebTransportSendStream for writing outgoing data." }, "webtransportbidirectionalstream.readable": { "url": "$MDN_URL$/web/api/webtransportbidirectionalstream/readable", @@ -14927,7 +14967,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the WebTransportBidirectionalStream interface returns a WebTransportReceiveStream instance that can be used to reliably read incoming data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the WebTransportBidirectionalStream interface returns a WebTransportReceiveStream instance that can be used to reliably read incoming data." }, "webtransportbidirectionalstream.writable": { "url": "$MDN_URL$/web/api/webtransportbidirectionalstream/writable", @@ -14945,7 +14985,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the WebTransportBidirectionalStream interface returns a WebTransportSendStream instance that can be used to write outgoing data." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The writable read-only property of the WebTransportBidirectionalStream interface returns a WebTransportSendStream instance that can be used to write outgoing data." }, "webtransportdatagramduplexstream": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream", @@ -14963,7 +15003,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportDatagramDuplexStream interface of the WebTransport API represents a duplex stream that can be used for unreliable transport of datagrams between client and server. Provides access to a ReadableStream for reading incoming datagrams, a WritableStream for writing outgoing datagrams, and various settings and statistics related to the stream.\n

    This is accessed via the WebTransport.datagrams property.\n

    \"Unreliable\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportDatagramDuplexStream interface of the WebTransport API represents a duplex stream that can be used for unreliable transport of datagrams between client and server. Provides access to a ReadableStream for reading incoming datagrams, a WritableStream for writing outgoing datagrams, and various settings and statistics related to the stream.\n

    This is accessed via the WebTransport.datagrams property.\n

    \"Unreliable\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." }, "webtransportdatagramduplexstream.incominghighwatermark": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/incominghighwatermark", @@ -14981,7 +15021,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingHighWaterMark property of the WebTransportDatagramDuplexStream interface gets or sets the high water mark for incoming chunks of data — this is the maximum size, in chunks, that the incoming ReadableStream's internal queue can reach before it is considered full. See Internal queues and queuing strategies for more information." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingHighWaterMark property of the WebTransportDatagramDuplexStream interface gets or sets the high water mark for incoming chunks of data — this is the maximum size, in chunks, that the incoming ReadableStream's internal queue can reach before it is considered full. See Internal queues and queuing strategies for more information." }, "webtransportdatagramduplexstream.incomingmaxage": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/incomingmaxage", @@ -14999,7 +15039,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingMaxAge property of the WebTransportDatagramDuplexStream interface gets or sets the maximum age for incoming datagrams, in milliseconds." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The incomingMaxAge property of the WebTransportDatagramDuplexStream interface gets or sets the maximum age for incoming datagrams, in milliseconds." }, "webtransportdatagramduplexstream.maxdatagramsize": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/maxdatagramsize", @@ -15017,7 +15057,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The maxDatagramSize read-only property of the WebTransportDatagramDuplexStream interface returns the maximum allowable size of outgoing datagrams, in bytes, that can be written to writable." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The maxDatagramSize read-only property of the WebTransportDatagramDuplexStream interface returns the maximum allowable size of outgoing datagrams, in bytes, that can be written to writable." }, "webtransportdatagramduplexstream.outgoinghighwatermark": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/outgoinghighwatermark", @@ -15035,7 +15075,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The outgoingHighWaterMark property of the WebTransportDatagramDuplexStream interface gets or sets the high water mark for outgoing chunks of data — this is the maximum size, in chunks, that the outgoing WritableStream's internal queue can reach before it is considered full. See Internal queues and queuing strategies for more information." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The outgoingHighWaterMark property of the WebTransportDatagramDuplexStream interface gets or sets the high water mark for outgoing chunks of data — this is the maximum size, in chunks, that the outgoing WritableStream's internal queue can reach before it is considered full. See Internal queues and queuing strategies for more information." }, "webtransportdatagramduplexstream.outgoingmaxage": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/outgoingmaxage", @@ -15053,7 +15093,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The outgoingMaxAge property of the WebTransportDatagramDuplexStream interface gets or sets the maximum age for outgoing datagrams, in milliseconds." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The outgoingMaxAge property of the WebTransportDatagramDuplexStream interface gets or sets the maximum age for outgoing datagrams, in milliseconds." }, "webtransportdatagramduplexstream.readable": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/readable", @@ -15071,7 +15111,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the WebTransportDatagramDuplexStream interface returns a ReadableStream instance that can be used to unreliably read incoming datagrams from the stream.\n

    \"Unreliably\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The readable read-only property of the WebTransportDatagramDuplexStream interface returns a ReadableStream instance that can be used to unreliably read incoming datagrams from the stream.\n

    \"Unreliably\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." }, "webtransportdatagramduplexstream.writable": { "url": "$MDN_URL$/web/api/webtransportdatagramduplexstream/writable", @@ -15087,7 +15127,7 @@ "FirefoxAndroid": "114", "Opera": "83" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.

    \n

    The writable read-only property of the WebTransportDatagramDuplexStream interface returns a WritableStream instance that can be used to unreliably write outgoing datagrams to the stream.\n

    \"Unreliably\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    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.

    \n

    The writable read-only property of the WebTransportDatagramDuplexStream interface returns a WritableStream instance that can be used to unreliably write outgoing datagrams to the stream.\n

    \"Unreliably\" means that transmission of data is not guaranteed, nor is arrival in a specific order. This is fine in some situations and provides very fast delivery. For example, you might want to transmit regular game state updates where each message supersedes the last one that arrives, and order is not important." }, "webtransporterror": { "url": "$MDN_URL$/web/api/webtransporterror", @@ -15105,7 +15145,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportError interface of the WebTransport API represents an error related to the API, which can arise from server errors, network connection problems, or client-initiated abort operations (for example, arising from a WritableStream.abort() call)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportError interface of the WebTransport API represents an error related to the API, which can arise from server errors, network connection problems, or client-initiated abort operations (for example, arising from a WritableStream.abort() call)." }, "webtransporterror.source": { "url": "$MDN_URL$/web/api/webtransporterror/source", @@ -15123,7 +15163,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The source read-only property of the WebTransportError interface returns an enumerated value indicating the source of the error." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The source read-only property of the WebTransportError interface returns an enumerated value indicating the source of the error." }, "webtransporterror.streamerrorcode": { "url": "$MDN_URL$/web/api/webtransporterror/streamerrorcode", @@ -15141,7 +15181,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The streamErrorCode read-only property of the WebTransportError interface returns a number in the range 0-255 indicating the application protocol error code for this error, or null if one is not available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The streamErrorCode read-only property of the WebTransportError interface returns a number in the range 0-255 indicating the application protocol error code for this error, or null if one is not available." }, "webtransporterror.webtransporterror": { "url": "$MDN_URL$/web/api/webtransporterror/webtransporterror", @@ -15159,7 +15199,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportError() constructor creates a new WebTransportError object instance.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportError() constructor creates a new WebTransportError object instance.", "parameters": { "init": "An object containing the following properties:\n

    \n
    message
    \n
    \n

    A string describing the error that has occurred.\n

    \n
    streamErrorCode
    \n
    \n

    A number in the range 0-255 indicating the application protocol error code for this error.\n

    \n
    " } @@ -15177,7 +15217,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportReceiveStream interface of the WebTransport API is a ReadableStream that can be used to read from an incoming unidirectional or bidirectional WebTransport stream.\n

    The stream is a readable byte stream of Uint8Array, and can be consumed using either a BYOB reader (ReadableStreamBYOBReader) or the default reader (ReadableStreamDefaultReader).\n

    Objects of this type are not constructed directly.\nInstead they are obtained using the WebTransport.incomingUnidirectionalStream property.\n

    WebTransportReceiveStream is a transferable object." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportReceiveStream interface of the WebTransport API is a ReadableStream that can be used to read from an incoming unidirectional or bidirectional WebTransport stream.\n

    The stream is a readable byte stream of Uint8Array, and can be consumed using either a BYOB reader (ReadableStreamBYOBReader) or the default reader (ReadableStreamDefaultReader).\n

    Objects of this type are not constructed directly.\nInstead they are obtained using the WebTransport.incomingUnidirectionalStream property.\n

    WebTransportReceiveStream is a transferable object." }, "webtransportreceivestream.getstats": { "url": "$MDN_URL$/web/api/webtransportreceivestream/getstats", @@ -15192,8 +15232,8 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransportReceiveStream interface asynchronously returns an object containing statistics for the current stream.\n

    The statistics include the total number of ordered bytes that have arrived on this stream (ignoring network overhead, up until the first missing byte) and the total number that have been read by the application.\nIt therefore provides a measure of how quickly the application is consuming bytes from the server on this particular stream.", - "returns": "A Promise that resolves to a object containing statistics about the current stream.\nThe returned object has the following properties:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    bytesReceived
    \n
    \n

    A positive integer indicating the number of bytes received by this stream, up to the first missing byte.\nThe number does not include any network overhead, and can only increase.\n

    \n
    bytesRead
    \n
    \n

    A positive integer indicating the number of bytes the application has read from this WebTransportReceiveStream stream.\nThis number can only increase, and is always less than or equal to bytesReceived.\n

    \n
    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransportReceiveStream interface asynchronously returns an object containing statistics for the current stream.\n

    The statistics include the total number of ordered bytes that have arrived on this stream (ignoring network overhead, up until the first missing byte) and the total number that have been read by the application.\nIt therefore provides a measure of how quickly the application is consuming bytes from the server on this particular stream.", + "returns": "A Promise that resolves to an object containing statistics about the current stream.\nThe returned object has the following properties:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the timestamp at which the statistics were gathered, relative to Jan 1, 1970, UTC.\n

    \n
    bytesReceived
    \n
    \n

    A positive integer indicating the number of bytes received by this stream, up to the first missing byte.\nThe number does not include any network overhead, and can only increase.\n

    \n
    bytesRead
    \n
    \n

    A positive integer indicating the number of bytes the application has read from this WebTransportReceiveStream stream.\nThis number can only increase, and is always less than or equal to bytesReceived.\n

    \n
    " }, "webtransportsendstream": { "url": "$MDN_URL$/web/api/webtransportsendstream", @@ -15208,7 +15248,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportSendStream interface of the WebTransport API is a specialized WritableStream that is used to send outbound data in both unidirectional or bidirectional WebTransport streams.\n

    The send stream is a writable stream of Uint8Array, that can be written to in order to send data to a server.\nIt additionally provides streaming features such as setting the send order, and getting stream statistics.\n

    Objects of this type are not constructed directly.\nWhen creating a unidirectional stream the WebTransport.createUnidirectionalStream() returns an object of this type for sending data.\nWhen creating a bidirectional stream using WebTransport.createBidirectionalStream(), the method returns a WebTransportBidirectionalStream, and the send stream object can be obtained from its writable property.\nWhen a bidirectional stream is initiated by the remote end, an object of this type can similarly be obtained using WebTransport.incomingBidirectionalStreams.\n

    WebTransportSendStream is a transferable object." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WebTransportSendStream interface of the WebTransport API is a specialized WritableStream that is used to send outbound data in both unidirectional or bidirectional WebTransport streams.\n

    The send stream is a writable stream of Uint8Array, that can be written to in order to send data to a server.\nIt additionally provides streaming features such as setting the send order, and getting stream statistics.\n

    Objects of this type are not constructed directly.\nWhen creating a unidirectional stream the WebTransport.createUnidirectionalStream() returns an object of this type for sending data.\nWhen creating a bidirectional stream using WebTransport.createBidirectionalStream(), the method returns a WebTransportBidirectionalStream, and the send stream object can be obtained from its writable property.\nWhen a bidirectional stream is initiated by the remote end, an object of this type can similarly be obtained using WebTransport.incomingBidirectionalStreams.\n

    WebTransportSendStream is a transferable object." }, "webtransportsendstream.getstats": { "url": "$MDN_URL$/web/api/webtransportsendstream/getstats", @@ -15223,8 +15263,8 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransportSendStream interface asynchronously returns an object containing statistics for the current stream.\n

    The statistics include the total number of bytes written to the stream, the number that have been sent (ignoring packet overhead), and the number of bytes that have been set at least once, and the number that have been acknowledged (up until the first sequentially-ordered non-acknowledged byte).\nIt therefore provides a measure of how quickly the application is sending bytes to the server on this particular stream.", - "returns": "A Promise that resolves to a object containing statistics about the current stream.\nThe returned object has the following properties:\n

    \n
    bytesAcknowledged
    \n
    \n

    A positive integer indicating the number of bytes written to this stream that have been sent and acknowledged as received by the server, using QUIC's ACK mechanism.\nOnly sequential bytes up to, but not including, the first non-acknowledged byte, are counted.\nThis number can only increase and is always less than or equal to bytesSent.\nWhen the connection is over HTTP/2, the value will match bytesSent.\n

    \n
    bytesSent
    \n
    \n

    A positive integer indicating the number of bytes written to this stream that have been sent at least once (but not necessarily acknowledged).\nThis number can only increase, and is always less than or equal to bytesWritten.\nNote that this count does not include bytes sent as network overhead (such as packet headers).\n

    \n
    bytesWritten
    \n
    \n

    A positive integer indicating the number of bytes successfully written to this stream.\nThis number can only increase.\n

    \n
    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The getStats() method of the WebTransportSendStream interface asynchronously returns an object containing statistics for the current stream.\n

    The statistics include the total number of bytes written to the stream, the number that have been sent (ignoring packet overhead), and the number of bytes that have been set at least once, and the number that have been acknowledged (up until the first sequentially-ordered non-acknowledged byte).\nIt therefore provides a measure of how quickly the application is sending bytes to the server on this particular stream.", + "returns": "A Promise that resolves to an object containing statistics about the current stream.\nThe returned object has the following properties:\n

    \n
    bytesAcknowledged
    \n
    \n

    A positive integer indicating the number of bytes written to this stream that have been sent and acknowledged as received by the server, using QUIC's ACK mechanism.\nOnly sequential bytes up to, but not including, the first non-acknowledged byte, are counted.\nThis number can only increase and is always less than or equal to bytesSent.\nWhen the connection is over HTTP/2, the value will match bytesSent.\n

    \n
    bytesSent
    \n
    \n

    A positive integer indicating the number of bytes written to this stream that have been sent at least once (but not necessarily acknowledged).\nThis number can only increase, and is always less than or equal to bytesWritten.\nNote that this count does not include bytes sent as network overhead (such as packet headers).\n

    \n
    bytesWritten
    \n
    \n

    A positive integer indicating the number of bytes successfully written to this stream.\nThis number can only increase.\n

    \n
    " }, "webtransportsendstream.sendorder": { "url": "$MDN_URL$/web/api/webtransportsendstream/sendorder", @@ -15239,7 +15279,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sendOrder property of the WebTransportSendStream interface indicates the send priority of this stream relative to other streams for which the value has been set.\n

    Queued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The sendOrder property of the WebTransportSendStream interface indicates the send priority of this stream relative to other streams for which the value has been set.\n

    Queued bytes are sent first for streams that have a higher value.\nIf not set, the send order depends on the implementation." }, "wgsllanguagefeatures": { "url": "$MDN_URL$/web/api/wgsllanguagefeatures", @@ -15254,7 +15294,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WGSLLanguageFeatures interface of the WebGPU API is a setlike object that reports the WGSL language extensions supported by the WebGPU implementation.\n

    The WGSLLanguageFeatures object is accessed via the GPU.wgslLanguageFeatures property.\n

    \n

    Note:\nNot 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.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is available in Web Workers.

    \n

    The WGSLLanguageFeatures interface of the WebGPU API is a setlike object that reports the WGSL language extensions supported by the WebGPU implementation.\n

    The WGSLLanguageFeatures object is accessed via the GPU.wgslLanguageFeatures property.\n

    \n

    Note:\nNot 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.\n

    " }, "wheelevent": { "url": "$MDN_URL$/web/api/wheelevent", @@ -15501,7 +15541,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The caches read-only property of the Window interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The caches read-only property of the Window interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." }, "window.cancelanimationframe": { "url": "$MDN_URL$/web/api/window/cancelanimationframe", @@ -15700,7 +15740,7 @@ "level": "LOW", "lowDate": "2025-06-24" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cookieStore read-only property of the Window interface returns a reference to the CookieStore object for the current document context. This is an entry point for the Cookie Store API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cookieStore read-only property of the Window interface returns a reference to the CookieStore object for the current document context. This is an entry point for the Cookie Store API." }, "window.createimagebitmap": { "url": "$MDN_URL$/web/api/window/createimagebitmap", @@ -15735,7 +15775,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The window.credentialless read-only property returns a boolean that indicates whether the current document was loaded inside a credentialless <iframe>, meaning that it is loaded in a new, ephemeral context.\n

    This context doesn't have access to the network, cookies, and storage data associated with its origin. It uses a new context local to the top-level document lifetime. In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not.\n

    See IFrame credentialless for a deeper explanation." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The window.credentialless read-only property returns a boolean that indicates whether the current document was loaded inside a credentialless <iframe>, meaning that it is loaded in a new, ephemeral context.\n

    This context doesn't have access to the network, cookies, and storage data associated with its origin. It uses a new context local to the top-level document lifetime. In return, the Cross-Origin-Embedder-Policy (COEP) embedding rules can be lifted, so documents with COEP set can embed third-party documents that do not.\n

    See IFrame credentialless for a deeper explanation." }, "window.crossoriginisolated": { "url": "$MDN_URL$/web/api/window/crossoriginisolated", @@ -15821,12 +15861,13 @@ "compatibility": { "Chrome": "116", "Edge": "116", + "Firefox": "preview", "Opera": "102" }, "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The documentPictureInPicture read-only property of the\nWindow interface returns a reference to the DocumentPictureInPicture object for the current document context." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The documentPictureInPicture read-only property of the\nWindow interface returns a reference to the DocumentPictureInPicture object for the current document context." }, "window.dump": { "url": "$MDN_URL$/web/api/window/dump", @@ -15903,8 +15944,8 @@ "returns": "A Promise that resolves to a Response object.", "throws": { "AbortError DOMException": "The request was aborted due to a call to the AbortController\nabort() method.", - "NotAllowedError DOMException": "Thrown if use of the Topics API is specifically disallowed by a browsing-topics Permissions Policy, and a fetch() request was made with browsingTopics: true.", - "TypeError": "Can occur for the following reasons:\n

    " + "NotAllowedError DOMException": "Thrown if:\n", + "TypeError": "Can occur for the following reasons:\n" } }, "window.fetchlater": { @@ -15929,7 +15970,7 @@ }, "returns": "A FetchLaterResult containing an activated boolean property indicating if the request has been sent yet.\n
    \n

    Note:\nOnce the fetch request is sent, its response — including the body and headers — is not made available and will be ignored.\n

    ", "throws": { - "QuotaExceededError": "Use of this feature was blocked due to exceeding the available quota. See fetchLater() quotas for more details. Callers of fetchLater() should be defensive and catch QuotaExceededError errors in almost all cases, especially if they are embedding third-party JavaScript.", + "QuotaExceededError": "Use of this feature was blocked due to exceeding the available quota. See fetchLater() quotas for more details. Callers of fetchLater() should be defensive and catch QuotaExceededError errors in almost all cases, especially if they are embedding third-party JavaScript.", "RangeError DOMException": "Thrown when a negative activateAfter value is specified.", "TypeError DOMException": "In addition to the reasons for fetch(), this exception will also be thrown for a ReadableStream request (which cannot be deferred) or for use of untrustworthy URLs (such as http://)." } @@ -16053,14 +16094,14 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Window.getComputedStyle() method returns a live read-only CSSStyleProperties object containing the resolved values of all CSS properties of an element, after applying active stylesheets and resolving any computation those values may contain.", + "doc": "The Window.getComputedStyle() method returns a live read-only CSSStyleProperties object containing the resolved values of all CSS properties of an element, after applying active stylesheets and resolving any computation those values may contain.", "parameters": { "element": "The Element for which to get the computed style.", "pseudoElt": "A string specifying the pseudo-element to match.\nOmitted (or null) for real elements." }, "returns": "A live CSSStyleProperties object, which updates automatically when the element's styles are changed.\n
    \n

    Note:\nEarlier versions of the specification returned a CSSStyleDeclaration (from which CSSStyleProperties is derived).\nSee the browser compatibility table for browser support information.\n

    \n
    \n

    Warning:\nReturned values are sometimes deliberately inaccurate.\nTo avoid the \"CSS History Leak\" security issue, browsers may lie about the computed styles for a visited link, returning values as if the user never visited the linked URL.\nSee Plugging the CSS history leak and Privacy-related changes coming to CSS :visited for examples of how this is implemented.\n

    ", "throws": { - "TypeError": "If the passed object is not an Element or the pseudoElt is not a valid pseudo-element selector or is ::part() or ::slotted().\n
    \n

    Note:\nValid pseudo-element selector refers to syntactic validity, e.g., ::unsupported is considered valid, even though the pseudo-element itself is not supported.\n

    " + "TypeError": "If the passed object is not an Element or the pseudoElt is not a valid pseudo-element selector or is ::part() or ::slotted().\n
    \n

    Note:\nValid pseudo-element selector refers to syntactic validity, e.g., ::unsupported is considered valid, even though the pseudo-element itself is not supported.\n

    " } }, "window.getdefaultcomputedstyle": { @@ -16069,7 +16110,7 @@ "Firefox": "19", "FirefoxAndroid": "19" }, - "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The getDefaultComputedStyle() method gives the default computed values of all the CSS\nproperties of an element, ignoring author styling. That is, only user-agent and user\nstyles are taken into account.", + "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The getDefaultComputedStyle() method gives the default computed values of all the CSS\nproperties of an element, ignoring author styling. That is, only user-agent and user\nstyles are taken into account.", "parameters": { "element": "The Element for which to get the computed style.", "pseudoElt": "A string specifying the pseudo-element to match. Must be null (or not\nspecified) for regular elements." @@ -16091,7 +16132,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getScreenDetails() method of the\nWindow interface returns a Promise that fulfills with a ScreenDetails object instance representing the details of all the screens available to the user's device.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getScreenDetails() method of the\nWindow interface returns a Promise that fulfills with a ScreenDetails object instance representing the details of all the screens available to the user's device.", "returns": "A Promise that fulfills with a ScreenDetails object instance.", "throws": { "NotAllowedError DOMException": "Thrown if a window-management Permissions-Policy is set that blocks use of the Window Management API, or if the user has explicitly denied the browser's permission request to use the API." @@ -16202,7 +16243,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "The isSecureContext read-only property of the Window interface returns a boolean indicating whether the current context is secure (true) or not (false)." + "doc": "The isSecureContext read-only property of the Window interface returns a boolean indicating whether the current context is secure (true) or not (false)." }, "window.launchqueue": { "url": "$MDN_URL$/web/api/window/launchqueue", @@ -16265,7 +16306,7 @@ }, "doc": "The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessions.\n

    localStorage is similar to sessionStorage, except that while localStorage data has no expiration time, sessionStorage data gets cleared when the page session ends — that is, when the page is closed. (localStorage data for a document loaded in a \"private browsing\" or \"incognito\" session is cleared when the last \"private\" tab is closed.)", "throws": { - "SecurityError": "Thrown in one of the following cases:\n

    \n

    Note that if the user blocks cookies, browsers will probably interpret this as an instruction to prevent the page from persisting data." + "SecurityError": "Thrown in one of the following cases:\n

    \n

    Note that if the user blocks cookies, browsers will probably interpret this as an instruction to prevent the page from persisting data." } }, "window.location": { @@ -16289,7 +16330,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Window.location read-only property returns a Location object with information about the current location of the document.\n

    Though Window.location is a read-only Location object, you can also assign a string to it.\nThis means that you can work with location as if it were a string in most cases:\nlocation = 'http://www.example.com' is a synonym of location.href = 'http://www.example.com'.\n

    See Location for all available properties." + "doc": "The read-only location property of the Window interface returns a Location object with information about the current location of the document.\n

    See Location for all available properties." }, "window.locationbar": { "url": "$MDN_URL$/web/api/window/locationbar", @@ -16333,9 +16374,9 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The Window interface's matchMedia() method\nreturns a new MediaQueryList object that can then be used to determine if\nthe document matches the media query string,\nas well as to monitor the document to detect when it matches (or stops matching) that\nmedia query.", + "doc": "The Window interface's matchMedia() method\nreturns a new MediaQueryList object that can then be used to determine if\nthe document matches the media query string,\nas well as to monitor the document to detect when it matches (or stops matching) that\nmedia query.", "parameters": { - "mediaQueryString": "A string specifying the media query to parse into a MediaQueryList.\n

    Just like in CSS, any media feature must be wrapped in parentheses inside the expression. For example: matchMedia(\"(width <= 600px)\") or matchMedia(\"(orientation: landscape)\") work, whereas matchMedia(\"width < 600px\") or matchMedia(\"orientation: landscape\") do not. Keywords for media types (all, print, screen) and logical operators (and, or, not, only) do not need to be wrapped in parentheses." + "mediaQueryString": "A string specifying the media query to parse into a MediaQueryList.\n

    Just like in CSS, any media feature must be wrapped in parentheses inside the expression. For example: matchMedia(\"(width <= 600px)\") or matchMedia(\"(orientation: landscape)\") work, whereas matchMedia(\"width < 600px\") or matchMedia(\"orientation: landscape\") do not. Keywords for media types (all, print, screen) and logical operators (and, or, not, only) do not need to be wrapped in parentheses." }, "returns": "A new MediaQueryList object for the media query. Use this object's\nproperties and events to detect matches and to monitor for changes to those matches over\ntime." }, @@ -16457,19 +16498,23 @@ "window.navigation": { "url": "$MDN_URL$/web/api/window/navigation", "status": [ - "Experimental", "StandardTrack" ], "compatibility": { "Chrome": "102", "ChromeAndroid": "102", "Edge": "102", - "Opera": "88" + "Firefox": "147", + "FirefoxAndroid": "147", + "Opera": "88", + "Safari": "26.2", + "SafariIOS": "26.2" }, "baseline": { - "level": "NONE" + "level": "LOW", + "lowDate": "2026-01-13" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The navigation read-only property of the Window interface returns the current window's associated Navigation object.\n

    This is the entry point for the Navigation API." + "doc": "The navigation read-only property of the Window interface returns the current window's associated Navigation object.\n

    This is the entry point for the Navigation API." }, "window.navigator": { "url": "$MDN_URL$/web/api/window/navigator", @@ -16517,7 +16562,7 @@ "target": "A string, without whitespace, specifying the name of the browsing context the resource is being loaded into. If the name doesn't identify an existing context, a new context is created and given the specified name. The special target keywords, _self, _blank (default), _parent, _top, and _unfencedTop can also be used. _unfencedTop is only relevant to fenced frames.\n

    This name can be used as the target attribute of <a> or <form> elements.", "windowFeatures": "A string containing a comma-separated list of window features in the form name=value. Boolean values can be set to true using one of: name, name=yes, name=true, or name=n where n is any non-zero integer. These features include options such as the window's default size and position, whether or not to open a minimal popup window, and so forth. The following options are supported:\n

    \n
    attributionsrc
    \n
    \n

    Indicates that you want the browser to send an Attribution-Reporting-Eligible header along with the open() call. This call must be made with transient activation (i.e., inside a user interaction event handle such as click), within five seconds of user interaction. On the server-side this is used to trigger sending an Attribution-Reporting-Register-Source header in the response to complete registration of an attribution source.\n

    In addition, the browser is also triggered to store the associated source data (as provided in the Attribution-Reporting-Register-Source response header) when the open() method completes.\n

    See the Attribution Reporting API for more details.\n

    \n

    Note:\nopen() calls cannot be used to register an attribution trigger.\n

    \n
    \n
    popup
    \n
    \n

    By default, window.open opens the page in a new tab. If popup is set to true, it requests that a minimal popup window be used. The UI features included in the popup window will be automatically decided by the browser, generally including an address bar only. If popup is present and set to false, a new tab is still opened.\n

    There are a few legacy features, which used to control UI features of the opened window. In modern browsers, they only have the effect of requesting a popup. If popup is unspecified, and windowFeatures contains any features (including unrecognized ones) other than noopener, noreferrer, or attributionsrc, the window is also opened as a popup if any of the following conditions apply:\n

      \n
    • location and toolbar are both false or absent
    • \n
    • menubar is false or absent
    • \n
    • resizable is false
    • \n
    • scrollbars is false or absent
    • \n
    • status is false or absent
    • \n
    \n

    Otherwise the window is opened as a tab.\n

    \n
    width or innerWidth
    \n
    \n

    Specifies the width of the content area, including scrollbars. The minimum required value is 100.\n

    \n
    height or innerHeight
    \n
    \n

    Specifies the height of the content area, including scrollbars. The minimum required value is 100.\n

    \n
    left or screenX
    \n
    \n

    Specifies the distance in pixels from the left side of the work area as defined by the user's operating system where the new window will be generated.\n

    \n
    top or screenY
    \n
    \n

    Specifies the distance in pixels from the top side of the work area as defined by the user's operating system where the new window will be generated.\n

    \n
    noopener
    \n
    \n

    If this feature is set, the new window will not have access to the originating window via Window.opener and returns null.\n

    When noopener is used, non-empty target names, other than _top, _self, and _parent, are treated like _blank in terms of deciding whether to open a new browsing context.\n

    \n
    noreferrer
    \n
    \n

    If this feature is set, the browser will omit the Referer header, as well as set noopener to true. See rel=\"noreferrer\" for more information.\n

    \n
    \n

    A null value is treated the same as the empty string (\"\")." }, - "returns": "If the browser successfully opens the new browsing context, a WindowProxy object is returned.\nThe returned reference can be used to access properties and methods of the new context as long as it complies with the same-origin policy security requirements.\n

    If the Cross-Origin-Opener-Policy HTTP header is being used, and the document policies are such that the document is opened in a new browsing context group, references to the opened window are severed and the returned object will indicate that the opened window is closed (closed is true).\n

    null is returned if the browser fails to open the new browsing context, for example because it was blocked by a browser popup blocker." + "returns": "If the browser successfully opens the new browsing context, a WindowProxy object is returned.\nThe returned reference can be used to access properties and methods of the new context as long as it complies with the same-origin policy security requirements.\n

    If the Cross-Origin-Opener-Policy HTTP header is being used, and the document policies are such that the document is opened in a new browsing context group, references to the opened window are severed and the returned object will indicate that the opened window is closed (closed is true).\n

    null is returned if the browser fails to open the new browsing context, for example because it was blocked by a browser popup blocker." }, "window.opener": { "url": "$MDN_URL$/web/api/window/opener", @@ -16690,7 +16735,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The window.postMessage() method safely enables cross-origin communication between Window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.\n

    Normally, scripts on different pages are allowed to access each other if and only if the pages they originate from share the same origin (also known as the \"same-origin policy\"). window.postMessage() provides a controlled mechanism to securely circumvent this restriction (if used properly).\n

    Furthermore, an accessing script must have obtained the window object of the accessed document beforehand. This can occur through methods such as window.open() for popups or iframe.contentWindow for iframes.\n

    Broadly, one window may obtain a reference to another (e.g., via targetWindow = window.opener), and then dispatch a MessageEvent on it with targetWindow.postMessage(). The receiving window is then free to handle this event as needed. The arguments passed to window.postMessage() (i.e., the \"message\") are exposed to the receiving window through the event object.", + "doc": "The window.postMessage() method safely enables cross-origin communication between Window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.\n

    Normally, scripts on different pages are allowed to access each other if and only if the pages they originate from share the same origin (also known as the \"same-origin policy\"). window.postMessage() provides a controlled mechanism to securely circumvent this restriction (if used properly).\n

    Furthermore, an accessing script must have obtained the window object of the accessed document beforehand. This can occur through methods such as window.open() for popups or iframe.contentWindow for iframes.\n

    Broadly, one window may obtain a reference to another (e.g., via targetWindow = window.opener), and then dispatch a MessageEvent on it with targetWindow.postMessage(). The receiving window is then free to handle this event as needed. The arguments passed to window.postMessage() (i.e., the \"message\") are exposed to the receiving window through the event object.", "parameters": { "message": "Data to be dispatched to the other window. The data is serialized using the structured clone algorithm. This means you can pass a broad variety of data objects safely to the destination window without having to serialize them yourself.", "targetOrigin": "Specifies the origin the recipient window must have in order to receive the event. In order for the event to be dispatched, the origin must match exactly (including scheme, hostname, and port). If omitted, it defaults to \"/\", which is the origin that is calling the method. This mechanism provides control over where messages are sent; for example, if postMessage() was used to transmit a password, it would be absolutely critical that this argument be a URI whose origin is the same as the intended receiver of the message containing the password, to prevent interception of the password by a malicious third party. * may also be provided, which means the message can be dispatched to a listener with any origin.\n

    \n

    Note:\nAlways provide a specific targetOrigin, not *, if you know where the other window's document should be located. Failing to provide a specific target could disclose data to a malicious site.\n

    Because data: URLs have opaque origins, in order to send messages to a context with a data: URL, you must specify \"*\".\n

    ", @@ -16715,8 +16760,9 @@ "SafariIOS": "1" }, "baseline": { - "level": "LOW", - "lowDate": "2023-06-06" + "level": "HIGH", + "lowDate": "2023-06-06", + "highDate": "2025-12-06" }, "doc": "Opens the print dialog to print the current document.\n

    If the document is still loading when this function is called, then the document will finish loading before opening the print dialog.\n

    This method will block while the print dialog is open.", "returns": "None (undefined)." @@ -16763,7 +16809,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window.queryLocalFonts() method returns a Promise that fulfills with an array of FontData objects representing the font faces available locally.\n

    To use this method, the user must grant permission to access local-fonts (permission status can be queried via the Permissions API). In addition, this feature may be blocked by a Permissions Policy set on your server.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The window.queryLocalFonts() method returns a Promise that fulfills with an array of FontData objects representing the font faces available locally.\n

    To use this method, the user must grant permission to access local-fonts (permission status can be queried via the Permissions API). In addition, this feature may be blocked by a Permissions Policy set on your server.", "parameters": { "options": "Contains optional configuration parameters. Currently only one property is defined:\n

    \n
    postscriptNames Optional
    \n
    \n

    An array of font PostScript names. If this is specified, only fonts with PostScript names matching those in the array will be included in the results; if not, all fonts will be included in the results.\n

    \n
    " }, @@ -16812,7 +16858,7 @@ "url": "$MDN_URL$/web/api/window/reporterror", "doc": "The reportError() method of the Window interface may be used to report errors to the console or event handlers of global scopes, emulating an uncaught JavaScript exception.\n

    This feature is primarily intended for custom event-dispatching or callback-manipulating libraries.\nLibraries can use this feature to catch errors in callback code and re-throw them to the top level handler.\nThis ensures that an exception in one callback will not prevent others from being handled, while at the same time ensuring that stack trace information is still readily available for debugging at the top level.", "parameters": { - "throwable": "An error object such as a TypeError." + "throwable": "Any JavaScript value, but preferably an error object such as a TypeError." }, "returns": "None (undefined).", "throws": { @@ -16843,7 +16889,7 @@ "parameters": { "callback": "The function to call when it's time to update your animation for the next repaint. This callback function is passed a single argument:\n

    \n
    timestamp
    \n
    \n

    A DOMHighResTimeStamp indicating the end time of the previous frame's rendering (based on the number of milliseconds since time origin). The timestamp is a decimal number, in milliseconds, but with a minimal precision of 1 millisecond. For Window objects (not Workers), it is equal to document.timeline.currentTime. This timestamp is shared between all windows that run on the same agent (all same-origin windows and, more importantly, same-origin iframes) — which allows synchronizing animations across multiple requestAnimationFrame callbacks. The timestamp value is also similar to calling performance.now() at the start of the callback function, but it is never the same value.\n

    When multiple callbacks queued by requestAnimationFrame() begin to fire in a single frame, each receives the same timestamp even though time has passed during the computation of every previous callback's workload.\n

    \n
    " }, - "returns": "An unsigned long integer value, the request ID, that uniquely identifies the entry\nin the callback list. You should not make any assumptions about its value. You can pass this value to\nwindow.cancelAnimationFrame() to cancel the refresh callback request.\n
    \n

    Warning:\nThe request ID is typically implemented as a per-window incrementing counter. Therefore, even when it starts counting at 1, it may overflow and end up reaching 0.\nWhile unlikely to cause issues for short-lived applications, you should avoid 0 as a sentinel value for invalid request identifier IDs and instead prefer unattainable values such as null.\nThe spec doesn't specify the overflowing behavior, so browsers have divergent behaviors. When overflowing, the value would either wrap around to 0, to a negative value, or fail with an error.\nUnless overflow throws, request IDs are also not truly unique because there are only finitely many 32-bit integers for possibly infinitely many callbacks.\nNote, however, that it would take ~500 days to reach the issue when rendering at 60Hz with 100 calls to requestAnimationFrame() per frame.\n

    " + "returns": "An unsigned long integer value, the request ID, that uniquely identifies the entry\nin the callback list. You should not make any assumptions about its value. You can pass this value to\nwindow.cancelAnimationFrame() to cancel the refresh callback request.\n
    \n

    Warning:\nThe request ID is typically implemented as a per-window incrementing counter. Therefore, even when it starts counting at 1, it may overflow and end up reaching 0.\nWhile unlikely to cause issues for short-lived applications, you should avoid 0 as a sentinel value for invalid request identifier IDs and instead prefer unattainable values such as null.\nThe spec doesn't specify the overflowing behavior, so browsers have divergent behaviors. When overflowing, the value would either wrap around to 0, to a negative value, or fail with an error.\nUnless overflow throws, request IDs are also not truly unique because there are only finitely many 32-bit integers for possibly infinitely many callbacks.\nNote, however, that it would take approximately 800 days to reach the issue when rendering at 60Hz with a single call to requestAnimationFrame() per frame.\n

    " }, "window.requestfilesystem": { "url": "$MDN_URL$/web/api/window/requestfilesystem", @@ -17078,7 +17124,7 @@ "parameters": { "xCoord": "The pixel along the horizontal axis of the document that you\nwant displayed in the upper left.", "yCoord": "The pixel along the vertical axis of the document that you\nwant displayed in the upper left.", - "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " + "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " }, "returns": "None (undefined)." }, @@ -17196,7 +17242,7 @@ "parameters": { "xCoord": "The pixel along the horizontal axis of the\ndocument that you want displayed in the upper left.", "yCoord": "The pixel along the vertical axis of the document\nthat you want displayed in the upper left.", - "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " + "options": "An object containing the following properties:\n
    \n
    top
    \n
    \n

    Specifies the number of pixels along the Y axis to scroll the window or element.\n

    \n
    left
    \n
    \n

    Specifies the number of pixels along the X axis to scroll the window or element.\n

    \n
    behavior
    \n
    \n

    Determines whether scrolling is instant or animates smoothly. This option is a string which must take one of the following values:\n

      \n
    • smooth: scrolling should animate smoothly
    • \n
    • instant: scrolling should happen instantly in a single jump
    • \n
    • auto: scroll behavior is determined by the computed value of scroll-behavior
    • \n
    \n
    \n
    " }, "returns": "None (undefined)." }, @@ -17288,9 +17334,9 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The read-only sessionStorage property accesses a session Storage object for the current origin. sessionStorage is similar to localStorage; the difference is that while localStorage is partitioned by origin only, sessionStorage is partitioned by both origin and browser tabs (top-level browsing contexts). The data in sessionStorage is only kept for the duration of the page session.\n", + "doc": "The read-only sessionStorage property accesses a session Storage object for the current origin. sessionStorage is similar to localStorage; the difference is that while localStorage is partitioned by origin only, sessionStorage is partitioned by both origin and browser tabs (top-level browsing contexts). The data in sessionStorage is only kept for the duration of the page session.\n", "throws": { - "SecurityError": "Thrown in one of the following cases:\n\n

    Note that if the user blocks cookies, browsers will probably interpret this as an instruction to prevent the page from persisting data." + "SecurityError": "Thrown in one of the following cases:\n

    \n

    Note that if the user blocks cookies, browsers will probably interpret this as an instruction to prevent the page from persisting data." } }, "window.setimmediate": { @@ -17313,14 +17359,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The setInterval() method of the Window interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.", + "doc": "

    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The setInterval() method of the Window interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.", "parameters": { - "func": "A function to be executed every delay milliseconds. The first execution happens after delay milliseconds.", - "code": "An optional syntax allows you to include a string instead of a function, which is compiled and executed every delay milliseconds.\nThis syntax is not recommended for the same reasons that make using eval() a security risk.", - "delay": "The time, in milliseconds (thousandths of a second), the timer should delay in between executions of the specified function or code. Defaults to 0 if not specified.\nSee Delay restrictions below for details on the permitted range of delay values.", - "arg1, …, argN": "Additional arguments which are passed through to the function specified by func once the timer expires." + "func": "A function to be executed every delay milliseconds.\nThe first execution happens after delay milliseconds.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The delay time between executions of the specified function or code, in milliseconds.\nDefaults to 0 if not specified.\nSee Delay restrictions below for details on the permitted range of delay values.", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func once the timer expires." }, - "returns": "The setInterval() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call. This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.\n

    Within the same global environment (e.g., a particular window or worker), the interval ID is ensured to remain unique and is not reused for any new interval timer as long as the original timer is still active. However, different global environments maintain their own independent pools of interval IDs.\n

    Be aware that setInterval() and setTimeout() share the same pool of IDs, and that clearInterval() and clearTimeout() can technically be used interchangeably.\nFor clarity, however, you should try to always match them to avoid confusion when maintaining your code.\n

    \n

    Note:\nThe delay argument is converted to a signed 32-bit integer.\nThis effectively limits delay to 2147483647 ms, roughly 24.8 days, since it's specified as a signed integer in the IDL.\n

    " + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call.\n

    This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "window.setresizable": { "url": "$MDN_URL$/web/api/window/setresizable", @@ -17341,20 +17391,24 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "The setTimeout() method of the Window interface sets a timer which executes a function or specified piece of code once the timer expires.", + "doc": "

    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The setTimeout() method of the Window interface sets a timer which executes a function or specified piece of code once the timer expires.", "parameters": { - "functionRef": "A function to be executed after the timer expires.", - "code": "An alternative syntax that allows you to include a string instead of a function,\nwhich is compiled and executed when the timer expires. This syntax is not\nrecommended for the same reasons that make using\neval() a security risk.", - "delay": "The time, in milliseconds that the timer should wait before\nthe specified function or code is executed. If this parameter is omitted, a value of 0\nis used, meaning execute \"immediately\", or more accurately, the next event cycle.\n

    Note that in either case, the actual delay may be longer than intended; see Reasons for delays longer than specified below.\n

    Also note that if the value isn't a number, implicit type coercion is silently done on the value to convert it to a number — which can lead to unexpected and surprising results; see Non-number delay values are silently coerced into numbers for an example.", - "param1, …, paramN": "Additional arguments which are passed through to the function specified by functionRef." + "func": "A function to be executed after the timer expires.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The time that the timer should wait before the specified function or code is executed, in milliseconds.\nDefaults to 0 if not specified.\n

    Note:\n

    ", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func." }, - "returns": "The setTimeout() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call. This identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active. However, separate global environments maintain their own independent pools of timer IDs." + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call.\nThis identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active.\nHowever, separate global environments maintain their own independent pools of timer IDs.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "window.sharedstorage": { "url": "$MDN_URL$/web/api/window/sharedstorage", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "126", @@ -17362,10 +17416,7 @@ "Edge": "126", "Opera": "112" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The global read-only sharedStorage property returns the WindowSharedStorage object for the current origin. This is the main entry point for writing data to shared storage using the Shared Storage API.\n

    \n

    Note:\nsharedStorage is not available inside workers. It is implemented by Window and is also available in shared storage worklets (see SharedStorageWorkletGlobalScope.sharedStorage, which returns WorkletSharedStorage).\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    The global read-only sharedStorage property returns the WindowSharedStorage object for the current origin. This is the main entry point for writing data to shared storage using the Shared Storage API.\n

    \n

    Note:\nsharedStorage is not available inside workers. It is implemented by Window and is also available in shared storage worklets (see SharedStorageWorkletGlobalScope.sharedStorage, which returns WorkletSharedStorage).\n

    " }, "window.showdirectorypicker": { "url": "$MDN_URL$/web/api/window/showdirectorypicker", @@ -17382,14 +17433,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showDirectoryPicker() method of the\nWindow interface displays a directory picker which allows the user to\nselect a directory.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showDirectoryPicker() method of the\nWindow interface displays a directory picker which allows the user to\nselect a directory.", "parameters": { "options": "An object containing options, which are as follows:\n

    \n
    id Optional
    \n
    \n

    By specifying an ID, the browser can remember different directories for different\nIDs. If the same ID is used for another picker, the picker opens in the same\ndirectory.\n

    \n
    mode Optional
    \n
    \n

    A string that defaults to \"read\" for read-only access or \"readwrite\" for read\nand write access to the directory.\n

    \n
    startIn Optional
    \n
    \n

    A FileSystemHandle or a well known directory (\"desktop\", \"documents\",\n\"downloads\", \"music\", \"pictures\", or \"videos\") to open the dialog in.\n

    \n
    " }, "returns": "A Promise whose fulfillment handler receives a FileSystemDirectoryHandle object.", "throws": { "AbortError DOMException": "Thrown if the user dismisses the prompt without making a selection,\nor if the user agent deems the selected directory to be too sensitive or dangerous,\nor if the PermissionStatus.state for the selected directory is not \"granted\" in the specified mode.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press." + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press." } }, "window.showopenfilepicker": { @@ -17407,14 +17458,14 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showOpenFilePicker() method of the\nWindow interface shows a file picker that allows a user to select a file\nor multiple files and returns a handle for the file(s).", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showOpenFilePicker() method of the\nWindow interface shows a file picker that allows a user to select a file\nor multiple files and returns a handle for the file(s).", "parameters": { "options": "An object containing options, which are as follows:\n

    \n
    excludeAcceptAllOption Optional
    \n
    \n

    A boolean value that defaults to\nfalse. By default the picker should include an option to not apply\nany file type filters (instigated with the type option below). Setting this option\nto true means that option is not available.\n

    \n
    id Optional
    \n
    \n

    By specifying an ID, the browser can remember different directories for different\nIDs. If the same ID is used for another picker, the picker opens in the same\ndirectory.\n

    \n
    multiple Optional
    \n
    \n

    A boolean value that defaults to false. When\nset to true multiple files may be selected.\n

    \n
    startIn Optional
    \n
    \n

    A FileSystemHandle or a well known directory (\"desktop\", \"documents\",\n\"downloads\", \"music\", \"pictures\", or \"videos\") to open the dialog in.\n

    \n
    types Optional
    \n
    \n

    An Array of allowed file types to pick. Each\nitem is an object with the following options:\n

    \n
    description Optional
    \n
    \n

    An optional description of the category of files types allowed. Defaults to an empty string.\n

    \n
    accept
    \n
    \n

    An Object with the keys set to the MIME type and the values an Array of file extensions (see below\nfor an example).\n

    \n
    \n
    \n
    " }, "returns": "A Promise whose fulfillment handler receives an Array of FileSystemFileHandle objects.", "throws": { "AbortError DOMException": "Thrown if the user dismisses the prompt without making a selection, or\nif the user agent deems any selected files too sensitive or dangerous.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press.", "TypeError": "Thrown if accept types can't be processed, which may happen if:\n" } }, @@ -17433,20 +17484,19 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showSaveFilePicker() method of the\nWindow interface shows a file picker that allows a user to save a file.\nEither by selecting an existing file, or entering a name for a new file.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The showSaveFilePicker() method of the\nWindow interface shows a file picker that allows a user to save a file.\nEither by selecting an existing file, or entering a name for a new file.", "parameters": { - "options": "An object containing options, which are as follows:\n

    \n
    excludeAcceptAllOption Optional
    \n
    \n

    A boolean value that defaults to\nfalse. By default, the picker should include an option to not apply\nany file type filters (instigated with the type option below). Setting this option\nto true means that option is not available.\n

    \n
    id Optional
    \n
    \n

    By specifying an ID, the browser can remember different directories for different\nIDs. If the same ID is used for another picker, the picker opens in the same\ndirectory.\n

    \n
    startIn Optional
    \n
    \n

    A FileSystemHandle or a well known directory (\"desktop\", \"documents\",\n\"downloads\", \"music\", \"pictures\", or \"videos\") to open the dialog in.\n

    \n
    suggestedName Optional
    \n
    \n

    A String. The suggested file name.\n

    \n
    types Optional
    \n
    \n

    An Array of allowed file types to save. Each\nitem is an object with the following options:\n

    \n
    description Optional
    \n
    \n

    An optional description of the category of files\ntypes allowed. Default to be an empty string.\n

    \n
    accept
    \n
    \n

    An Object with the keys set to the MIME type and the values an Array of file extensions (see below\nfor an example).\n

    \n
    \n
    \n
    " + "options": "An object containing options, which are as follows:\n
    \n
    excludeAcceptAllOption Optional
    \n
    \n

    A boolean value that defaults to\nfalse. By default, the picker should include an option to not apply\nany file type filters (instigated with the type option below). Setting this option\nto true means that option is not available.\n

    \n
    id Optional
    \n
    \n

    By specifying an ID, the browser can remember different directories for different\nIDs. If the same ID is used for another picker, the picker opens in the same\ndirectory.\n

    \n
    startIn Optional
    \n
    \n

    A FileSystemHandle or a well known directory (\"desktop\", \"documents\",\n\"downloads\", \"music\", \"pictures\", or \"videos\") to open the dialog in.\n

    \n
    suggestedName Optional
    \n
    \n

    A String. The suggested file name.\n

    \n
    types Optional
    \n
    \n

    An Array of allowed file types to save. Each\nitem is an object with the following options:\n

    \n
    description Optional
    \n
    \n

    An optional description of the category of files\ntypes allowed. Defaults to an empty string.\n

    \n
    accept
    \n
    \n

    An Object with the keys set to the MIME type and the values an Array of file extensions (see below\nfor an example).\n

    \n
    \n
    \n
    " }, "returns": "A Promise whose fulfillment handler receives a FileSystemFileHandle object.", "throws": { "AbortError DOMException": "Thrown if the user dismisses the file picker without selecting or inputting a file,\nor if the user agent deems any selected files too sensitive or dangerous.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy or it was not called via a user interaction such as a button press.", "TypeError": "Thrown if accept types can't be processed, which may happen if:\n" } }, "window.sizetocontent": { "url": "$MDN_URL$/web/api/window/sizetocontent", - "compatibility": {}, "doc": "

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The Window.sizeToContent() method sizes the window\naccording to its content. In order for it to work, the DOM content should be loaded when\nthis function is called—for example, once the DOMContentLoaded event has\nbeen thrown.\n

    Since Firefox 20, the minimal size of the window is clamped to prevent the window from\nbeing too small for the user to interact with.", "returns": "None (undefined)." }, @@ -17756,7 +17806,7 @@ "doc": "

    Note: This feature is only available in Service Workers.

    \n

    The focus() method of the WindowClient\ninterface gives user input focus to the current client and returns a\nPromise that resolves to the existing\nWindowClient.", "returns": "A Promise that resolves to the existing WindowClient.", "throws": { - "InvalidAccessError DOMException": "The promise is rejected with this exception if none of the windows in the app's origin have transient activation." + "InvalidAccessError DOMException": "The promise is rejected with this exception if none of the windows in the app's origin have transient activation." } }, "windowclient.focused": { @@ -17843,7 +17893,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WindowControlsOverlay interface of the Window Controls Overlay API exposes information about the geometry\nof the title bar area in desktop Progressive Web Apps, and an event to know whenever it changes. This interface is accessible from Navigator.windowControlsOverlay." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WindowControlsOverlay interface of the Window Controls Overlay API exposes information about the geometry\nof the title bar area in desktop Progressive Web Apps, and an event to know whenever it changes. This interface is accessible from Navigator.windowControlsOverlay." }, "windowcontrolsoverlay.gettitlebararearect": { "url": "$MDN_URL$/web/api/windowcontrolsoverlay/gettitlebararearect", @@ -17948,11 +17998,11 @@ }, "windowsharedstorage": { "url": "$MDN_URL$/web/api/windowsharedstorage", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WindowSharedStorage interface of the Shared Storage API represents the shared storage for a particular origin within a standard browsing context.\n

    WindowSharedStorage is accessed via Window.sharedStorage." + "doc": "

    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.

    \n

    The WindowSharedStorage interface of the Shared Storage API represents the shared storage for a particular origin within a standard browsing context.\n

    WindowSharedStorage is accessed via Window.sharedStorage." }, "windowsharedstorage.run": { "url": "$MDN_URL$/web/api/windowsharedstorage/run", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The run() method of the\nWindowSharedStorage interface executes a run operation that is registered in a module added to the current origin's SharedStorageWorklet.\n

    \n

    Note:\nThe Run output gate is intended as a generic way to process some shared storage data.\n

    ", + "doc": "

    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.

    \n

    The run() method of the\nWindowSharedStorage interface executes a run operation that is registered in a module added to the current origin's SharedStorageWorklet.\n

    \n

    Note:\nThe Run output gate is intended as a generic way to process some shared storage data.\n

    ", "parameters": { "name": "A string representing the registered operation's name within the shared storage worklet module. It must match the name given to the operation when it is registered with SharedStorageWorkletGlobalScope.register().", "options": "An options object that can contain the following properties:\n
    \n
    data Optional
    \n
    \n

    An object representing any data required for executing the operation.\n

    \n
    keepAlive Optional
    \n
    \n

    A boolean value. If set to true, the SharedStorageWorkletGlobalScope of the associated worklet is kept alive, and the operation can be run again. Therefore, you need to set keepAlive to true for each operation that is not intended to be the last one. The default value, false, means that the SharedStorageWorkletGlobalScope is terminated after the operation is run and cannot be run again.\n

    \n
    " @@ -17964,7 +18014,7 @@ }, "windowsharedstorage.selecturl": { "url": "$MDN_URL$/web/api/windowsharedstorage/selecturl", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The selectURL() method of the\nWindowSharedStorage interface executes a URL Selection operation that is registered in a module added to the current origin's SharedStorageWorklet.\n

    \n

    Note:\nThe URL Selection output gate is used to select a URL from a provided list to display to the user, based on shared storage data.\n

    ", + "doc": "

    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.

    \n

    The selectURL() method of the\nWindowSharedStorage interface executes a URL Selection operation that is registered in a module added to the current origin's SharedStorageWorklet.\n

    \n

    Note:\nThe URL Selection output gate is used to select a URL from a provided list to display to the user, based on shared storage data.\n

    ", "parameters": { "name": "A string representing the registered operation's name within the shared storage worklet module. It must match the name given to the operation when it is registered with SharedStorageWorkletGlobalScope.register().", "urls": "An array of objects representing the URLs to be chosen between by the URL Selection operation. Each object contains two properties:\n
    \n
    url
    \n
    \n

    A string representing the URL.\n

    \n
    reportingMetadata Optional
    \n
    \n

    An object containing properties where names are event types and values are URLs pointing to reporting destinations, for example \"click\" : \"my-reports/report1.html\". The URLs act as destinations for reports submitted with a destination of type \"shared-storage-select-url\", typically submitted via a Fence.reportEvent() or Fence.setReportEventDataForAutomaticBeacons() method call.\n

    \n
    ", @@ -17977,7 +18027,7 @@ }, "windowsharedstorage.worklet": { "url": "$MDN_URL$/web/api/windowsharedstorage/worklet", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The worklet read-only property of the\nWindowSharedStorage interface contains the SharedStorageWorklet instance representing the shared storage worklet for the current origin.\n

    SharedStorageWorklet contains the addModule() method, which is used to add a module to the shared storage worklet." + "doc": "

    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.

    \n

    The worklet read-only property of the\nWindowSharedStorage interface contains the SharedStorageWorklet instance representing the shared storage worklet for the current origin.\n

    SharedStorageWorklet contains the addModule() method, which is used to add a module to the shared storage worklet." }, "worker": { "url": "$MDN_URL$/web/api/worker", @@ -18000,7 +18050,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    The Worker interface of the Web Workers API represents a background task that can be created via script, which can send messages back to its creator.\n

    Creating a worker is done by calling the Worker(\"path/to/worker/script\") constructor.\n

    Workers may themselves spawn new workers, as long as those workers are hosted at the same origin as the parent page.\n

    Note that not all interfaces and functions are available to web workers. See Functions and classes available to Web Workers for details." + "doc": "

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    The Worker interface of the Web Workers API represents a background task that can be created via script, which can send messages back to its creator.\n

    Creating a worker is done by calling the Worker(\"path/to/worker/script\") constructor.\n

    Workers may themselves spawn new workers, as long as those workers are hosted at the same origin as the parent page.\n

    Note that not all interfaces and functions are available to web workers. See Functions and classes available to Web Workers for details." }, "worker.postmessage": { "url": "$MDN_URL$/web/api/worker/postmessage", @@ -18076,15 +18126,16 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    The Worker() constructor creates a Worker object that executes the script at the specified URL. This script must obey the same-origin policy.\n

    \n

    Note:\nThere is a disagreement among browser manufacturers about whether a data URL is of the same origin or not. Though Firefox 10 and later accept data URLs, that's not the case in all other browsers.\n

    ", + "doc": "

    Note: This feature is available in Web Workers, except for Service Workers.

    \n
    \n

    Warning:\nThis script passed to the url element is executed.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The Worker() constructor creates a Worker object that executes the classic script or module at the specified URL.", "parameters": { - "url": "A string representing the URL of the script the worker will execute. It must obey the same-origin policy. The URL is resolved relative to the current HTML page's location.\n

    \n

    Note:\nBundlers, including webpack, Vite, and Parcel, recommend passing URLs that are relative to import.meta.url to the Worker() constructor. For example:\n

    \n```js\nconst myWorker = new Worker(new URL(\"worker.js\", import.meta.url));\n```\n
    \n

    This way, the path is relative to the current script instead of the current HTML page, which allows the bundler to safely do optimizations like renaming (because otherwise the worker.js URL may point to a file not controlled by the bundler, so it cannot make any assumptions).\n

    ", - "options": "An object containing option properties that can be set when creating the object instance. Available properties are as follows:\n
    \n
    type
    \n
    \n

    A string specifying the type of worker to create. The value can be classic or module. If not specified, the default used is classic.\n

    \n
    credentials
    \n
    \n

    A string specifying the type of credentials to use for the worker. The value can be omit, same-origin, or include. If not specified, or if type is classic, the default used is same-origin (only include credentials for same-origin requests).\n

    \n
    name
    \n
    \n

    A string specifying an identifying name for the DedicatedWorkerGlobalScope representing the scope of the worker, which is mainly useful for debugging purposes.\n

    \n
    " + "url": "A TrustedScriptURL object or a string representing the URL of the script or module that the worker will execute.\n

    This must be same-origin with the caller's document, or a blob: or data: URL.\nThe URL is resolved relative to the current HTML page's location.", + "options": "An object containing option properties that can be set when creating the object instance.\nAvailable properties are as follows:\n

    \n
    credentials
    \n
    \n

    A string specifying whether the browser sends credentials when importing modules into a module worker.\nThe allowed values are the same as can be passed to the fetch() request: omit, same-origin, or include.\nThe default is same-origin (only include credentials for same-origin requests).\n

    This is ignored for classic workers.\n

    \n
    name
    \n
    \n

    A string specifying an identifying name for the DedicatedWorkerGlobalScope representing the scope of the worker, which is mainly useful for debugging purposes.\n

    \n
    type
    \n
    \n

    A string specifying the type of worker to create.\nThe value can be classic or module.\nThe default is classic.\n

    \n
    " }, "throws": { + "NetworkError DOMException": "Thrown if the MIME type of the worker script is incorrect.\nIt should always be text/javascript (for historical reasons other JavaScript MIME types may be accepted).", "SecurityError DOMException": "Thrown if the document is not allowed to start workers, e.g., if the URL has an invalid syntax or if the same-origin policy is violated.", - "NetworkError DOMException": "Thrown if the MIME type of the worker script is incorrect. It should always be text/javascript\n(for historical reasons other JavaScript MIME types may be accepted).", - "SyntaxError DOMException": "Thrown if aURL cannot be parsed." + "SyntaxError DOMException": "Thrown if url cannot be parsed.", + "TypeError": "Thrown if the url parameter is a string when Trusted Types are enforced by a CSP and no default policy is defined." } }, "workerglobalscope": { @@ -18149,7 +18200,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The caches read-only property of the WorkerGlobalScope interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The caches read-only property of the WorkerGlobalScope interface returns the CacheStorage object associated with the current context.\nThis object enables functionality such as storing assets for offline use, and generating custom responses to requests." }, "workerglobalscope.clearinterval": { "url": "$MDN_URL$/web/api/workerglobalscope/clearinterval", @@ -18281,14 +18332,15 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The importScripts() method of the WorkerGlobalScope interface synchronously imports one or more scripts into the worker's scope.", + "doc": "

    Note: This feature is only available in Web Workers.

    \n
    \n

    Warning:\nThe parameters passed to this method represent the URLs of classic scripts to be imported into a worker.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.\n

    You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.\nSee Security considerations for more information.\n

    \n

    The importScripts() method of the WorkerGlobalScope interface synchronously imports one or more scripts into the scope of a classic worker (a worker constructed from a classic script).\n

    Note that the method cannot be used in module workers, which instead load dependencies using import statements.", "parameters": { - "pathN": "A string value representing the URL of the script to be imported. The URL may be absolute or relative. If the URL is relative, it is relative to the worker entry script's URL." + "urlN": "A TrustedScriptURL instance or a string representing the URL of the script to be imported.\nThe URL may be absolute or relative.\nIf the URL is relative, it is relative to the worker entry script's URL." }, "returns": "None (undefined).", "throws": { - "NetworkError": "Imported scripts were served without a text/javascript MIME type or without one of the permitted legacy JavaScript MIME types.", - "TypeError": "Thrown if the current WorkerGlobalScope is a module. Use import instead." + "NetworkError": "Imported scripts were served without a text/javascript media (MIME) type or without one of the permitted legacy JavaScript MIME types.", + "SyntaxError": "Thrown if any URL cannot be resolved.", + "TypeError": "Thrown if the current WorkerGlobalScope is a module (use import instead).\nIt may also happen if any parameter is not a TrustedScriptURL and the site is enforcing trusted types." } }, "workerglobalscope.indexeddb": { @@ -18307,7 +18359,7 @@ "lowDate": "2018-04-12", "highDate": "2020-10-12" }, - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The isSecureContext read-only property of the WorkerGlobalScope interface returns a boolean indicating whether the current context is secure (true) or not (false)." + "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The isSecureContext read-only property of the WorkerGlobalScope interface returns a boolean indicating whether the current context is secure (true) or not (false)." }, "workerglobalscope.location": { "url": "$MDN_URL$/web/api/workerglobalscope/location", @@ -18330,7 +18382,7 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The location read-only property of the WorkerGlobalScope interface returns the WorkerLocation associated with the worker. It is a specific location object, mostly a subset of the Location for browsing scopes, but adapted to workers." + "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The read-only location property of the WorkerGlobalScope interface returns the WorkerLocation associated with the worker. It is a specific location object, mostly a subset of the Location for browsing scopes, but adapted to workers." }, "workerglobalscope.navigator": { "url": "$MDN_URL$/web/api/workerglobalscope/navigator", @@ -18383,9 +18435,9 @@ }, "workerglobalscope.reporterror": { "url": "$MDN_URL$/web/api/workerglobalscope/reporterror", - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The reportError() method of the WorkerGlobalScope interface may be used to report errors to the console or event handlers of global scopes, emulating an uncaught JavaScript exception.\n

    This feature is primarily intended for custom event-dispatching or callback-manipulating libraries.\nLibraries can use this feature to catch errors in callback code and re-throw them to the top level handler.\nThis ensures that an exception in one callback will not prevent others from being handled, while at the same time ensuring that stack trace information is still readily available for debugging at the top level.", + "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The reportError() method of the WorkerGlobalScope interface may be used to report errors to the console or event handlers of global scopes, emulating an uncaught JavaScript exception.\n

    This feature is primarily intended for custom event-dispatching or callback-manipulating libraries.\nLibraries can use this feature to catch errors in callback code and re-throw them to the top level handler.\nThis ensures that an exception in one callback will not prevent others from being handled, while at the same time ensuring that stack trace information is still readily available for debugging at the top level.\n

    See window.reportError() for more information.", "parameters": { - "throwable": "An error object such as a TypeError." + "throwable": "Any JavaScript value, but preferably an error object such as a TypeError." }, "returns": "None (undefined).", "throws": { @@ -18429,14 +18481,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The setInterval() method of the WorkerGlobalScope interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.\n

    This method is also available in window contexts: for a detailed description of setInterval(), see the Window.setInterval() page.", + "doc": "

    Note: This feature is available in Web Workers.

    \n
    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations in Window.setInterval() for more information.\n

    \n

    The setInterval() method of the WorkerGlobalScope interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.\n

    It is commonly used to set a delay for functions that are executed again and again, such as animations.\nYou can cancel the interval using clearInterval().\nSee Window.setInterval() for more information.\n

    Note that if you wish to have your function called once after the specified delay, use setTimeout().", "parameters": { - "func": "A function to be executed every delay milliseconds. The first execution happens after delay milliseconds.", - "code": "An optional syntax allows you to include a string instead of a function, which is compiled and executed every delay milliseconds.\nThis syntax is not recommended for the same reasons that make using eval() a security risk.", - "delay": "The time, in milliseconds (thousandths of a second), the timer should delay in between executions of the specified function or code. Defaults to 0 if not specified.\nSee Delay restrictions for details on the permitted range of delay values.", - "arg1, …, argN": "Additional arguments which are passed through to the function specified by func once the timer expires." + "func": "A function to be executed every delay milliseconds.\nThe first execution happens after delay milliseconds.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The delay time between executions of the specified function or code, in milliseconds.\nDefaults to 0 if not specified.\nSee Delay restrictions in Window.setInterval for details on the permitted range of delay values.", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func once the timer expires." }, - "returns": "The setInterval() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call. This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.\n

    Within the same global environment (e.g., a particular window or worker), the interval ID is ensured to remain unique and is not reused for any new interval timer as long as the original timer is still active. However, different global environments maintain their own independent pools of interval IDs.\n

    Be aware that setInterval() and setTimeout() share the same pool of IDs, and that clearInterval() and clearTimeout() can technically be used interchangeably.\nFor clarity, however, you should try to always match them to avoid confusion when maintaining your code.\n

    \n

    Note:\nThe delay argument is converted to a signed 32-bit integer.\nThis effectively limits delay to 2147483647 ms, roughly 24.8 days, since it's specified as a signed integer in the IDL.\n

    " + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the interval timer created by the call.\n

    This identifier, often referred to as an \"interval ID\", can be passed to clearInterval() to stop the repeated execution of the specified function.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "workerglobalscope.settimeout": { "url": "$MDN_URL$/web/api/workerglobalscope/settimeout", @@ -18445,14 +18501,18 @@ "lowDate": "2015-07-29", "highDate": "2018-01-29" }, - "doc": "

    Note: This feature is only available in Web Workers.

    \n

    The setTimeout() method of the WorkerGlobalScope interface sets a timer which executes a function or specified piece of code once the timer expires.", + "doc": "

    Note: This feature is only available in Web Workers.

    \n
    \n

    Warning:\nWhen the code parameter is used, this method dynamically executes its value as JavaScript.\nAPIs like this are known as injection sinks, and are potentially a vector for cross-site-scripting (XSS) attacks.\n

    You can mitigate this risk by always assigning TrustedScript objects instead of strings and enforcing trusted types.\nSee Security considerations in Window.setTimeout() for more information.\n

    \n

    The setTimeout() method of the WorkerGlobalScope interface sets a timer which executes a function or specified piece of code once the timer expires.", "parameters": { - "functionRef": "A function to be executed after the timer expires.", - "code": "An alternative syntax that allows you to include a string instead of a function,\nwhich is compiled and executed when the timer expires. This syntax is not\nrecommended for the same reasons that make using\neval() a security risk.", - "delay": "The time, in milliseconds that the timer should wait before\nthe specified function or code is executed. If this parameter is omitted, a value of 0\nis used, meaning execute \"immediately\", or more accurately, the next event cycle.\n

    Note that in either case, the actual delay may be longer than intended; see Reasons for delays longer than specified.\n

    Also note that if the value isn't a number, implicit type coercion is silently done on the value to convert it to a number — which can lead to unexpected and surprising results; see Non-number delay values are silently coerced into numbers for an example.", - "param1, …, paramN": "Additional arguments which are passed through to the function specified by functionRef." + "func": "A function to be executed after the timer expires.", + "code": "A TrustedScript or a string of arbitrary code that is compiled and executed every delay milliseconds.\nThis can be used instead of passing a function, but is strongly discouraged for the same reasons that make using eval() a security risk.", + "delay": "The time that the timer should wait before the specified function or code is executed, in milliseconds.\nDefaults to 0 if not specified.\n

    Note:\n

    ", + "param1, …, paramN": "Additional arguments which are passed through to the function specified by func." }, - "returns": "The setTimeout() method returns a positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call. This identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active. However, separate global environments maintain their own independent pools of timer IDs." + "returns": "A positive integer (typically within the range of 1 to 2,147,483,647) that uniquely identifies the timer created by the call.\nThis identifier, often referred to as a \"timeout ID\", can be passed to clearTimeout() to cancel the timer.\n

    Within the same global environment (e.g., a specific window or worker) the timeout ID is guaranteed not to be reused for any new timer as long as the original timer remains active.\nHowever, separate global environments maintain their own independent pools of timer IDs.", + "throws": { + "SyntaxError": "The code can't be parsed as a script.", + "TypeError": "Thrown if the code parameter is set to a string when Trusted Types are enforced by a CSP and no default policy is defined.\nIt is also thrown if the first parameter is not one of the supported types: a function, string or TrustedScript." + } }, "workerglobalscope.structuredclone": { "url": "$MDN_URL$/web/api/workerglobalscope/structuredclone", @@ -18811,11 +18871,11 @@ }, "workernavigator.clearappbadge": { "url": "$MDN_URL$/web/api/workernavigator/clearappbadge", - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearAppBadge() method of the WorkerNavigator interface clears a badge on the current app's icon by setting it to nothing. The value nothing indicates that no badge is currently set, and the status of the badge is cleared.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The clearAppBadge() method of the WorkerNavigator interface clears a badge on the current app's icon by setting it to nothing. The value nothing indicates that no badge is currently set, and the status of the badge is cleared.", "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if the document is not fully active.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", "NotAllowedError DOMException": "Thrown if PermissionStatus.state is not granted." } }, @@ -18849,7 +18909,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The deviceMemory read-only\nproperty of the WorkerNavigator interface returns the approximate amount of\ndevice memory in gigabytes.\n

    The reported value is imprecise to curtail fingerprinting. It's approximated by\nrounding down to the nearest power of 2, then dividing that number by 1024. It is then\nclamped within lower and upper bounds to protect the privacy of owners of very low-memory or\nhigh-memory devices." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The deviceMemory read-only property of the WorkerNavigator interface returns the approximate amount of device memory in gigabytes.\n

    The reported value is imprecise to curtail fingerprinting.\nIt's approximated by rounding the actual value to the nearest power of 2, then dividing that number by 1024.\nIt is then clamped within lower and upper bounds to protect the privacy of owners of very low-memory or high-memory devices.\nThese bounds may change over time (see browser compatibility table)." }, "workernavigator.globalprivacycontrol": { "url": "$MDN_URL$/web/api/workernavigator/globalprivacycontrol", @@ -18879,7 +18939,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The gpu read-only property of the WorkerNavigator interface returns the GPU object for the current worker context, which is the entry point for the WebGPU API." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The gpu read-only property of the WorkerNavigator interface returns the GPU object for the current worker context, which is the entry point for the WebGPU API." }, "workernavigator.hardwareconcurrency": { "url": "$MDN_URL$/web/api/workernavigator/hardwareconcurrency", @@ -18918,7 +18978,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WorkerNavigator.hid\nread-only property returns an HID object providing methods for accessing HID device connections and events that fire when the user agent connects to or disconnects from a device.\n

    Where a defined Permissions Policy blocks WebHID usage, the WorkerNavigator.hid property will not be available." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WorkerNavigator.hid\nread-only property returns an HID object providing methods for accessing HID device connections and events that fire when the user agent connects to or disconnects from a device.\n

    Where a defined Permissions Policy blocks WebHID usage, the WorkerNavigator.hid property will not be available." }, "workernavigator.language": { "url": "$MDN_URL$/web/api/workernavigator/language", @@ -18984,7 +19044,7 @@ "lowDate": "2022-03-14", "highDate": "2024-09-14" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The locks read-only property of\nthe WorkerNavigator interface returns a LockManager\nobject which provides methods for requesting a new Lock object and\nquerying for an existing Lock object." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The locks read-only property of\nthe WorkerNavigator interface returns a LockManager\nobject which provides methods for requesting a new Lock object and\nquerying for an existing Lock object." }, "workernavigator.mediacapabilities": { "url": "$MDN_URL$/web/api/workernavigator/mediacapabilities", @@ -19101,7 +19161,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The serial read-only property of the WorkerNavigator interface returns a Serial object which represents the entry point into the Web Serial API.\n

    When getting, the same instance of the Serial object will always be returned." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Dedicated Web Workers.

    \n

    The serial read-only property of the WorkerNavigator interface returns a Serial object which represents the entry point into the Web Serial API.\n

    When getting, the same instance of the Serial object will always be returned." }, "workernavigator.serviceworker": { "url": "$MDN_URL$/web/api/workernavigator/serviceworker", @@ -19117,18 +19177,18 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The serviceWorker read-only property of the WorkerNavigator interface returns the ServiceWorkerContainer object for the associated document, which provides access to registration, removal, upgrade, and communication with the ServiceWorker.\n

    The feature may not be available in private mode." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The serviceWorker read-only property of the WorkerNavigator interface returns the ServiceWorkerContainer object for the associated document, which provides access to registration, removal, upgrade, and communication with the ServiceWorker.\n

    The feature may not be available in private mode." }, "workernavigator.setappbadge": { "url": "$MDN_URL$/web/api/workernavigator/setappbadge", - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setAppBadge() method of the WorkerNavigator interface sets a badge on the icon associated with this app. If a value is passed to the method, this will be set as the value of the badge. Otherwise the badge will display as a dot, or other indicator as defined by the platform.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The setAppBadge() method of the WorkerNavigator interface sets a badge on the icon associated with this app. If a value is passed to the method, this will be set as the value of the badge. Otherwise the badge will display as a dot, or other indicator as defined by the platform.", "parameters": { "contents": "A number which will be used as the value of the badge. If contents is 0 then the badge will be set to nothing, indicating a cleared badge." }, "returns": "A Promise that resolves with undefined.", "throws": { "InvalidStateError DOMException": "Thrown if the document is not fully active.", - "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", + "SecurityError DOMException": "Thrown if the call was blocked by the same-origin policy.", "NotAllowedError DOMException": "Thrown if PermissionStatus.state is not granted." } }, @@ -19152,7 +19212,7 @@ "lowDate": "2021-12-13", "highDate": "2024-06-13" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The storage read-only property of the WorkerNavigator interface\nreturns the singleton StorageManager object used to\naccess the overall storage capabilities of the browser for the current site or app.\nThe returned object lets you examine and configure persistence of data stores and\nlearn approximately how much more space your browser has available for local storage\nuse." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The storage read-only property of the WorkerNavigator interface\nreturns the singleton StorageManager object used to\naccess the overall storage capabilities of the browser for the current site or app.\nThe returned object lets you examine and configure persistence of data stores and\nlearn approximately how much more space your browser has available for local storage\nuse." }, "workernavigator.usb": { "url": "$MDN_URL$/web/api/workernavigator/usb", @@ -19163,7 +19223,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The usb read-only property of the WorkerNavigator interface returns a USB object for the current document, providing access to WebUSB API functionality." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The usb read-only property of the WorkerNavigator interface returns a USB object for the current document, providing access to WebUSB API functionality." }, "workernavigator.useragent": { "url": "$MDN_URL$/web/api/workernavigator/useragent", @@ -19202,7 +19262,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The userAgentData read-only property of the WorkerNavigator interface returns an NavigatorUAData object which can be used to access the User-Agent Client Hints API." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Note: This feature is only available in Web Workers.

    \n

    The userAgentData read-only property of the WorkerNavigator interface returns a NavigatorUAData object which can be used to access the User-Agent Client Hints API." }, "worklet": { "url": "$MDN_URL$/web/api/worklet", @@ -19224,7 +19284,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Worklet interface is a lightweight version of Web Workers and gives developers access to low-level parts of the rendering pipeline.\n

    With Worklets, you can run JavaScript and WebAssembly code to do graphics rendering or audio processing where high performance is required.\n

    Worklets allow static import of ECMAScript modules, if supported, using import.\nDynamic import is disallowed by the specification — calling import() will throw." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The Worklet interface is a lightweight version of Web Workers and gives developers access to low-level parts of the rendering pipeline.\n

    With Worklets, you can run JavaScript and WebAssembly code to do graphics rendering or audio processing where high performance is required.\n

    Worklets allow static import of ECMAScript modules, if supported, using import.\nDynamic import is disallowed by the specification — calling import() will throw." }, "worklet.addmodule": { "url": "$MDN_URL$/web/api/worklet/addmodule", @@ -19246,7 +19306,7 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The addModule() method of the\nWorklet interface loads the module in the given JavaScript file and\nadds it to the current Worklet.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The addModule() method of the\nWorklet interface loads the module in the given JavaScript file and\nadds it to the current Worklet.", "parameters": { "moduleURL": "A String containing the URL of a JavaScript file with the module to\nadd.", "options": "An object with any of the following options:\n

    \n
    credentials
    \n
    \n

    A Request.credentials value that\nindicates whether to send credentials (e.g., cookies and HTTP authentication)\nwhen loading the module. Can be one of \"omit\",\n\"same-origin\", or \"include\". Defaults to\n\"same-origin\". See also Request.credentials.\n

    \n
    " @@ -19277,19 +19337,19 @@ "lowDate": "2021-04-26", "highDate": "2023-10-26" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WorkletGlobalScope interface is an abstract class that specific worklet scope classes inherit from. Each WorkletGlobalScope defines a new global environment.\n

    \n

    Note:\nYou don't normally need to interact with this interface. It is a base interface intended to be subclassed. You will encounter the subclasses AudioWorkletGlobalScope inside AudioWorklet objects, or PaintWorkletGlobalScope inside CSS paint Worklet objects.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WorkletGlobalScope interface is an abstract class that specific worklet scope classes inherit from. Each WorkletGlobalScope defines a new global environment.\n

    \n

    Note:\nYou don't normally need to interact with this interface. It is a base interface intended to be subclassed. You will encounter the subclasses AudioWorkletGlobalScope inside AudioWorklet objects, or PaintWorkletGlobalScope inside CSS paint Worklet objects.\n

    " }, "workletsharedstorage": { "url": "$MDN_URL$/web/api/workletsharedstorage", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WorkletSharedStorage interface of the Shared Storage API represents the shared storage for a particular origin within a worklet context.\n

    WorkletSharedStorage is accessed via SharedStorageWorkletGlobalScope.sharedStorage." + "doc": "

    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.

    \n

    The WorkletSharedStorage interface of the Shared Storage API represents the shared storage for a particular origin within a worklet context.\n

    WorkletSharedStorage is accessed via SharedStorageWorkletGlobalScope.sharedStorage." }, "workletsharedstorage.context": { "url": "$MDN_URL$/web/api/workletsharedstorage/context", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The context read-only property of the WorkletSharedStorage interface contains contextual data passed into the shared storage worklet from the associated browsing context via the FencedFrameConfig.setSharedStorageContext() method." + "doc": "

    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.

    \n

    Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

    \n

    The context read-only property of the WorkletSharedStorage interface contains contextual data passed into the shared storage worklet from the associated browsing context via the FencedFrameConfig.setSharedStorageContext() method." }, "workletsharedstorage.entries": { "url": "$MDN_URL$/web/api/workletsharedstorage/entries", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The entries() method of the\nWorkletSharedStorage interface returns an async iterator. The iterator provides an array of [key, value] pairs corresponding to the enumerable properties of a WorkletSharedStorage instance. The order of these pairs is similar to that in a for...in loop, though a for...in loop also enumerates properties from the prototype chain.", + "doc": "

    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.

    \n

    The entries() method of the\nWorkletSharedStorage interface returns an async iterator. The iterator provides an array of [key, value] pairs corresponding to the enumerable properties of a WorkletSharedStorage instance. The order of these pairs is similar to that in a for...in loop, though a for...in loop also enumerates properties from the prototype chain.", "returns": "An array of the WorkletSharedStorage's enumerable property key-value pairs.", "throws": { "TypeError": "Thrown if the calling site does not have the Shared Storage API included in a successful privacy sandbox enrollment process." @@ -19297,7 +19357,7 @@ }, "workletsharedstorage.get": { "url": "$MDN_URL$/web/api/workletsharedstorage/get", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The get() method of the\nWorkletSharedStorage interface retrieves a value from shared storage.", + "doc": "

    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.

    \n

    The get() method of the\nWorkletSharedStorage interface retrieves a value from shared storage.", "parameters": { "key": "A string representing the key of the key-value pair you want to retrieve." }, @@ -19308,7 +19368,7 @@ }, "workletsharedstorage.keys": { "url": "$MDN_URL$/web/api/workletsharedstorage/keys", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The keys() method of the\nWorkletSharedStorage interface returns an async iterator, which contains the keys for each item in a WorkletSharedStorage instance.", + "doc": "

    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.

    \n

    The keys() method of the\nWorkletSharedStorage interface returns an async iterator, which contains the keys for each item in a WorkletSharedStorage instance.", "returns": "An array of the WorkletSharedStorage's enumerable property keys.", "throws": { "TypeError": "Thrown if the calling site does not have the Shared Storage API included in a successful privacy sandbox enrollment process." @@ -19316,7 +19376,7 @@ }, "workletsharedstorage.length": { "url": "$MDN_URL$/web/api/workletsharedstorage/length", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The length() method of the\nWorkletSharedStorage interface returns the number of entries currently stored in shared storage for the current origin.", + "doc": "

    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.

    \n

    The length() method of the\nWorkletSharedStorage interface returns the number of entries currently stored in shared storage for the current origin.", "returns": "A Promise that fulfills with a number, which represents the total count of key-value pairs currently in the shared storage.", "throws": { "TypeError": "Thrown if:\n

    " @@ -19324,7 +19384,7 @@ }, "workletsharedstorage.remainingbudget": { "url": "$MDN_URL$/web/api/workletsharedstorage/remainingbudget", - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The remainingBudget() method of the\nWorkletSharedStorage interface returns the remaining navigation budget for the current origin.\n

    The navigation budget is the number of entropy bits permitted inside a <fencedframe> due to the WindowSharedStorage.selectURL() calls per origin every 24 hours. This is not the same as the number of navigations; rather, it is based on the number of potential navigations in each call. Each time a selectURL() navigation occurs, the corresponding origin's budget decreases by the logarithm (base 2) of the number of URL choices.\n

    Navigation budget is a mechanism designed to limit the rate of leakage of cross-site data to the destination pages navigated to in fenced frames.", + "doc": "

    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.

    \n

    The remainingBudget() method of the\nWorkletSharedStorage interface returns the remaining navigation budget for the current origin.\n

    The navigation budget is the number of entropy bits permitted inside a <fencedframe> due to the WindowSharedStorage.selectURL() calls per origin every 24 hours. This is not the same as the number of navigations; rather, it is based on the number of potential navigations in each call. Each time a selectURL() navigation occurs, the corresponding origin's budget decreases by the logarithm (base 2) of the number of URL choices.\n

    Navigation budget is a mechanism designed to limit the rate of leakage of cross-site data to the destination pages navigated to in fenced frames.", "returns": "A Promise that fulfills with a number representing the remaining navigation budget.", "throws": { "TypeError": "Thrown if the worklet module has not yet been added with addModule() or if the calling site does not have the Shared Storage API included in a successful privacy sandbox enrollment process." @@ -19380,7 +19440,7 @@ "parameters": { "reason": "A string providing a human-readable reason for the abort." }, - "returns": "A Promise, which fulfills with the value given in the reason parameter.", + "returns": "A Promise, which fulfills with undefined.", "throws": { "TypeError": "The stream you are trying to abort is not a WritableStream, or it is locked." } @@ -20180,8 +20240,8 @@ "xmlhttprequest.setattributionreporting": { "url": "$MDN_URL$/web/api/xmlhttprequest/setattributionreporting", "status": [ - "Experimental", - "StandardTrack" + "StandardTrack", + "Deprecated" ], "compatibility": { "Chrome": "125", @@ -20189,17 +20249,37 @@ "Edge": "125", "Opera": "111" }, - "baseline": { - "level": "NONE" - }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The setAttributionReporting() method of the\nXMLHttpRequest interface indicates that you want the request's response to be able to register a JavaScript-based attribution source or attribution trigger.\n

    See the Attribution Reporting API for more details.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.

    \n

    The setAttributionReporting() method of the\nXMLHttpRequest interface indicates that you want the request's response to be able to register a JavaScript-based attribution source or attribution trigger.\n

    See the Attribution Reporting API for more details.", "parameters": { "options": "An object providing attribution reporting options, which includes the following properties:\n

    \n
    eventSourceEligible
    \n
    \n

    A boolean. If set to true, the request's response is eligible to register an attribution source. If set to false, it isn't.\n

    \n
    triggerEligible
    \n
    \n

    A boolean. If set to true, the request's response is eligible to register an attribution trigger. If set to false, it isn't.\n

    \n
    " }, "returns": "None (undefined).", "throws": { "InvalidStateError DOMException": "Thrown if the associated XMLHttpRequest has not yet been opened, or has already been sent.", - "TypeError DOMException": "Thrown if use of the Attribution Reporting API is blocked by a attribution-reporting Permissions-Policy." + "TypeError DOMException": "Thrown if use of the Attribution Reporting API is blocked by an attribution-reporting Permissions-Policy." + } + }, + "xmlhttprequest.setprivatetoken": { + "url": "$MDN_URL$/web/api/xmlhttprequest/setprivatetoken", + "status": [ + "Experimental", + "StandardTrack" + ], + "compatibility": { + "Chrome": "117", + "ChromeAndroid": "117", + "Edge": "117", + "Opera": "103" + }, + "doc": "

    Note: This feature is available in Web Workers, except for Service Workers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XMLHttpRequest method setPrivateToken() adds private state token information to an XMLHttpRequest call, to initiate private state token operations.", + "parameters": { + "privateToken": "An object containing options for initiating a private state token operation. Possible properties include:\n

    \n
    issuers Optional
    \n
    \n

    An array of strings containing the URLs of issuers that you want to forward redemption records for. This setting is ignored unless operation is set to send-redemption-record, in which case the issuers array must be included.\n

    \n
    operation
    \n
    \n

    A string representing the type of token operation you want to initiate. Possible values are:\n

    \n
    token-request
    \n
    \n

    Initiates a token request operation.\n

    \n
    token-redemption
    \n
    \n

    Initiates a token redemption operation.\n

    \n
    send-redemption-record
    \n
    \n

    Initiates a send redemption record operation.\n

    \n
    \n
    \n
    refreshPolicy Optional
    \n
    \n

    An enumerated value that specifies the expected behavior when a non-expired redemption record for the current user and site has previously been set. This setting is ignored unless operation is set to token-redemption. Possible values are:\n

    \n
    none
    \n
    \n

    The previously-set redemption record should be used, and a new one should not be issued. This is the default value.\n

    \n
    refresh
    \n
    \n

    A new redemption record is always issued.\n

    \n
    \n
    \n
    version
    \n
    \n

    A number indicating the version of the cryptographic protocol you wish to use when generating a token. Currently this is always set to 1, which is the only version that the specification supports. When specifying the privateToken option, this property is mandatory.\n

    \n
    " + }, + "returns": "None (undefined).", + "throws": { + "InvalidStateError DOMException": "Thrown if the associated XMLHttpRequest is not in an opened state, or send() has already been called on it.", + "NotAllowedError DOMException": "Thrown if use of Private State Token API operations is specifically disallowed by a private-state-token-issuance or private-state-token-redemption Permissions Policy.", + "TypeError": "Thrown if the operation is set to send-redemption-record, and the issues array was empty or not set, or one or more of the specified issuers are not trustworthy, HTTPS URLs." } }, "xmlhttprequest.setrequestheader": { @@ -20899,7 +20979,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    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." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    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." }, "xranchor.anchorspace": { "url": "$MDN_URL$/web/api/xranchor/anchorspace", @@ -20916,7 +20996,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only anchorSpace property of the XRAnchor interface returns an XRSpace object to locate the anchor relative to other XRSpace objects. It can be passed to XRFrame.getPose() subsequently." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only anchorSpace property of the XRAnchor interface returns an XRSpace object to locate the anchor relative to other XRSpace objects. It can be passed to XRFrame.getPose() subsequently." }, "xranchor.delete": { "url": "$MDN_URL$/web/api/xranchor/delete", @@ -20933,7 +21013,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The delete() method of the XRAnchor interface removes an anchor. This can be useful when an application is no longer interested in receiving updates to an anchor.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The delete() method of the XRAnchor interface removes an anchor. This can be useful when an application is no longer interested in receiving updates to an anchor.", "returns": "None (undefined)." }, "xranchorset": { @@ -20968,7 +21048,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API's XRBoundedReferenceSpace interface describes a virtual world reference space which has preset boundaries. This extends XRReferenceSpace, which describes an essentially unrestricted space around the viewer's position. These bounds are defined using an array of points, each of which defines a vertex in a polygon inside which the user is allowed to move.\n

    This is typically used when the XR system is capable of tracking the user's physical movement within a limited distance of their starting position. The specified bounds may, in fact, describe the shape and size of the room the user is located in, in order to let the WebXR site or application prevent the user from colliding with the walls or other obstacles in the real world. At a minimum, the boundaries indicate the area in which the XR device is capable of tracking the user's movement. See the article Using bounded reference spaces for details on how bounded spaces work and why they're useful." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API's XRBoundedReferenceSpace interface describes a virtual world reference space which has preset boundaries. This extends XRReferenceSpace, which describes an essentially unrestricted space around the viewer's position. These bounds are defined using an array of points, each of which defines a vertex in a polygon inside which the user is allowed to move.\n

    This is typically used when the XR system is capable of tracking the user's physical movement within a limited distance of their starting position. The specified bounds may, in fact, describe the shape and size of the room the user is located in, in order to let the WebXR site or application prevent the user from colliding with the walls or other obstacles in the real world. At a minimum, the boundaries indicate the area in which the XR device is capable of tracking the user's movement. See the article Using bounded reference spaces for details on how bounded spaces work and why they're useful." }, "xrboundedreferencespace.boundsgeometry": { "url": "$MDN_URL$/web/api/xrboundedreferencespace/boundsgeometry", @@ -20985,7 +21065,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRBoundedReferenceSpace\nproperty boundsGeometry is an array of\nDOMPointReadOnly objects which specifies the points making up a polygon\ninside which the viewer is allowed to move. Each point is treated as a\ntwo-dimensional point, and must be located at ground level (that is,\nits y coordinate must be 0).\n

    This boundary is typically configured by the user, using the software that controls\ntheir XR hardware. This may be done by walking the border of the space they wish to use,\nor by drawing the shape of their room using their XR input device. Theoretically, a more\nadvanced system might use sensors or other detection methods to determine the bounds of\na dedicated XR room (notice how we carefully don't call it a holodeck?)." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRBoundedReferenceSpace\nproperty boundsGeometry is an array of\nDOMPointReadOnly objects which specifies the points making up a polygon\ninside which the viewer is allowed to move. Each point is treated as a\ntwo-dimensional point, and must be located at ground level (that is,\nits y coordinate must be 0).\n

    This boundary is typically configured by the user, using the software that controls\ntheir XR hardware. This may be done by walking the border of the space they wish to use,\nor by drawing the shape of their room using their XR input device. Theoretically, a more\nadvanced system might use sensors or other detection methods to determine the bounds of\na dedicated XR room (notice how we carefully don't call it a holodeck?)." }, "xrcompositionlayer": { "url": "$MDN_URL$/web/api/xrcompositionlayer", @@ -20997,7 +21077,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCompositionLayer interface of the WebXR Device API is a base class that defines a set of common properties and behaviors for WebXR layer types. It is not constructable on its own.\n

    Several layer types inherit from XRCompositionLayer:\n

    \n

    XRCompositionLayer itself inherits from the general XRLayer class (which inherits from EventTarget)." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCompositionLayer interface of the WebXR Device API is a base class that defines a set of common properties and behaviors for WebXR layer types. It is not constructable on its own.\n

    Several layer types inherit from XRCompositionLayer:\n

    \n

    XRCompositionLayer itself inherits from the general XRLayer class (which inherits from EventTarget)." }, "xrcompositionlayer.blendtexturesourcealpha": { "url": "$MDN_URL$/web/api/xrcompositionlayer/blendtexturesourcealpha", @@ -21075,7 +21155,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCPUDepthInformation interface contains depth information from the CPU (returned by XRFrame.getDepthInformation()).\n

    This interface inherits properties from its parent, XRDepthInformation." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCPUDepthInformation interface contains depth information from the CPU (returned by XRFrame.getDepthInformation()).\n

    This interface inherits properties from its parent, XRDepthInformation." }, "xrcpudepthinformation.data": { "url": "$MDN_URL$/web/api/xrcpudepthinformation/data", @@ -21126,7 +21206,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCubeLayer interface of the WebXR Device API is a layer that renders directly from a cubemap and projects it onto the inside faces of a cube.\n

    XRCubeLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRCubeLayer, call XRWebGLBinding.createCubeLayer().\n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCubeLayer interface of the WebXR Device API is a layer that renders directly from a cubemap and projects it onto the inside faces of a cube.\n

    XRCubeLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRCubeLayer, call XRWebGLBinding.createCubeLayer().\n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." }, "xrcubelayer.orientation": { "url": "$MDN_URL$/web/api/xrcubelayer/orientation", @@ -21162,7 +21242,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCylinderLayer interface of the WebXR Device API is a layer that takes up a curved rectangular space in the virtual environment. Only the front of the layer is visible.\n

    XRCylinderLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRCylinderLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRCylinderLayer interface of the WebXR Device API is a layer that takes up a curved rectangular space in the virtual environment. Only the front of the layer is visible.\n

    XRCylinderLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRCylinderLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." }, "xrcylinderlayer.aspectratio": { "url": "$MDN_URL$/web/api/xrcylinderlayer/aspectratio", @@ -21239,7 +21319,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRDepthInformation interface contains information about the distance from the user's device to the real-world geometry in the user's environment.\n

    This interface is the parent of:\n

    \n
    XRCPUDepthInformation
    \n
    \n

    Depth information from the CPU (returned by XRFrame.getDepthInformation()).\n

    \n
    XRWebGLDepthInformation
    \n
    \n

    Depth information from WebGL (returned by XRWebGLBinding.getDepthInformation()).\n

    \n
    \n

    You will usually interact with these child interfaces. However, XRDepthInformation provides some useful properties that are inherited:" + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRDepthInformation interface contains information about the distance from the user's device to the real-world geometry in the user's environment.\n

    This interface is the parent of:\n

    \n
    XRCPUDepthInformation
    \n
    \n

    Depth information from the CPU (returned by XRFrame.getDepthInformation()).\n

    \n
    XRWebGLDepthInformation
    \n
    \n

    Depth information from WebGL (returned by XRWebGLBinding.getDepthInformation()).\n

    \n
    \n

    You will usually interact with these child interfaces. However, XRDepthInformation provides some useful properties that are inherited:" }, "xrdepthinformation.height": { "url": "$MDN_URL$/web/api/xrdepthinformation/height", @@ -21256,7 +21336,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only height property of the XRDepthInformation interface contains the height of the depth buffer (number of rows)." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only height property of the XRDepthInformation interface contains the height of the depth buffer (number of rows)." }, "xrdepthinformation.normdepthbufferfromnormview": { "url": "$MDN_URL$/web/api/xrdepthinformation/normdepthbufferfromnormview", @@ -21273,7 +21353,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only normDepthBufferFromNormView property of the XRDepthInformation interface contains the 3D geometric transform that needs to be applied when indexing into the depth buffer." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only normDepthBufferFromNormView property of the XRDepthInformation interface contains the 3D geometric transform that needs to be applied when indexing into the depth buffer." }, "xrdepthinformation.rawvaluetometers": { "url": "$MDN_URL$/web/api/xrdepthinformation/rawvaluetometers", @@ -21290,7 +21370,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only rawValueToMeters property of the XRDepthInformation interface contains the scale factor by which the raw depth values must be multiplied in order to get the depths in meters.\n

    For CPU depth information, see also the XRCPUDepthInformation.getDepthInMeters() method." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only rawValueToMeters property of the XRDepthInformation interface contains the scale factor by which the raw depth values must be multiplied in order to get the depths in meters.\n

    For CPU depth information, see also the XRCPUDepthInformation.getDepthInMeters() method." }, "xrdepthinformation.width": { "url": "$MDN_URL$/web/api/xrdepthinformation/width", @@ -21307,7 +21387,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only width property of the XRDepthInformation interface contains the width of the depth buffer (number of columns)." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only width property of the XRDepthInformation interface contains the width of the depth buffer (number of columns)." }, "xrequirectlayer": { "url": "$MDN_URL$/web/api/xrequirectlayer", @@ -21319,7 +21399,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XREquirectLayer interface of the WebXR Device API is a layer that maps equirectangular coded data onto the inside of a sphere.\n

    XREquirectLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XREquirectLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XREquirectLayer interface of the WebXR Device API is a layer that maps equirectangular coded data onto the inside of a sphere.\n

    XREquirectLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XREquirectLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." }, "xrequirectlayer.centralhorizontalangle": { "url": "$MDN_URL$/web/api/xrequirectlayer/centralhorizontalangle", @@ -21408,7 +21488,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    A WebXR Device API XRFrame object is passed into the requestAnimationFrame() callback function and provides access to the information needed in order to render a single frame of animation for an XRSession describing a VR or AR scene. Events which communicate the tracking state of objects also provide an XRFrame reference as part of their structure.\n

    In addition to providing a reference to the XRSession for which this frame is to be rendered, the getViewerPose() method is provided to obtain the XRViewerPose describing the viewer's position and orientation in space, and getPose() can be used to create an XRPose describing the relative position of one XRSpace relative to another." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    A WebXR Device API XRFrame object is passed into the requestAnimationFrame() callback function and provides access to the information needed in order to render a single frame of animation for an XRSession describing a VR or AR scene. Events which communicate the tracking state of objects also provide an XRFrame reference as part of their structure.\n

    In addition to providing a reference to the XRSession for which this frame is to be rendered, the getViewerPose() method is provided to obtain the XRViewerPose describing the viewer's position and orientation in space, and getPose() can be used to create an XRPose describing the relative position of one XRSpace relative to another." }, "xrframe.createanchor": { "url": "$MDN_URL$/web/api/xrframe/createanchor", @@ -21425,7 +21505,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createAnchor() method of the XRFrame interface creates a free-floating XRAnchor which will be fixed relative to the real world.\n

    See XRHitTestResult.createAnchor() for creating an anchor from a hit test result that is attached to a real-world object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createAnchor() method of the XRFrame interface creates a free-floating XRAnchor which will be fixed relative to the real world.\n

    See XRHitTestResult.createAnchor() for creating an anchor from a hit test result that is attached to a real-world object.", "parameters": { "pose": "An XRRigidTransform object with the initial pose where the anchor should be created. The system will make sure that the relationship with the physical world made at this moment in time is maintained as the tracking system's understanding of the world evolves.", "space": "An XRSpace object the pose is relative to." @@ -21446,7 +21526,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fillJointRadii() method of the XRFrame interface populates a Float32Array with radii for a list of hand joint spaces and returns true if successful for all spaces.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fillJointRadii() method of the XRFrame interface populates a Float32Array with radii for a list of hand joint spaces and returns true if successful for all spaces.", "parameters": { "jointSpaces": "An array of XRJointSpace objects for which to obtain the radii.", "radii": "A Float32Array that is populated with the radii of the jointSpaces." @@ -21470,7 +21550,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fillPoses() method of the XRFrame interface populates a Float32Array with the matrices of the poses relative to a given base space and returns true if successful for all spaces.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fillPoses() method of the XRFrame interface populates a Float32Array with the matrices of the poses relative to a given base space and returns true if successful for all spaces.", "parameters": { "spaces": "An array of XRSpace objects for which to get the poses.", "baseSpace": "An XRSpace object to use as the base or origin for the relative position and orientation.", @@ -21496,7 +21576,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getDepthInformation() method of the XRFrame interface returns an XRCPUDepthInformation object containing CPU depth information for the active and animated frame.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getDepthInformation() method of the XRFrame interface returns an XRCPUDepthInformation object containing CPU depth information for the active and animated frame.", "parameters": { "view": "An XRView object obtained from a viewer pose." }, @@ -21521,7 +21601,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getHitTestResults() method of the XRFrame interface returns an array of XRHitTestResult objects containing hit test results for a given XRHitTestSource.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getHitTestResults() method of the XRFrame interface returns an array of XRHitTestResult objects containing hit test results for a given XRHitTestSource.", "parameters": { "hitTestSource": "An XRHitTestSource object that contains hit test subscriptions." }, @@ -21542,7 +21622,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getHitTestResultsForTransientInput() method of the XRFrame interface returns an array of XRTransientInputHitTestResult objects containing transient input hit test results for a given XRTransientInputHitTestSource.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getHitTestResultsForTransientInput() method of the XRFrame interface returns an array of XRTransientInputHitTestResult objects containing transient input hit test results for a given XRTransientInputHitTestSource.", "parameters": { "hitTestSource": "An XRTransientInputHitTestSource object that contains transient input hit test subscriptions." }, @@ -21562,7 +21642,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getJointPose() method of the XRFrame interface returns an XRJointPose object providing the pose of a hand joint (see XRHand) relative to a given base space.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getJointPose() method of the XRFrame interface returns an XRJointPose object providing the pose of a hand joint (see XRHand) relative to a given base space.", "parameters": { "joint": "An XRJointSpace specifying the hand joint space for which to obtain an XRJointPose describing the item's position and orientation.", "baseSpace": "An XRSpace to use as the base or origin for the relative position and orientation." @@ -21584,7 +21664,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getLightEstimate() method of the XRFrame interface returns an XRLightEstimate object containing estimated lighting values for a given XRLightProbe.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getLightEstimate() method of the XRFrame interface returns an XRLightEstimate object containing estimated lighting values for a given XRLightProbe.", "parameters": { "lightProbe": "An XRLightProbe object containing the current lighting state for the frame." }, @@ -21605,7 +21685,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRFrame method getPose() returns the relative position and\norientation—the pose—of one XRSpace to that of another space. With this, you can observe the motion of objects relative to each other and to fixed locations throughout the scene.\n

    For example, to get the position of a controller relative to the viewer's head, you would compare the controller's gripSpace to the XRReferenceSpace of type viewer.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRFrame method getPose() returns the relative position and\norientation—the pose—of one XRSpace to that of another space. With this, you can observe the motion of objects relative to each other and to fixed locations throughout the scene.\n

    For example, to get the position of a controller relative to the viewer's head, you would compare the controller's gripSpace to the XRReferenceSpace of type viewer.", "parameters": { "space": "An XRSpace specifying the space for which to obtain an\nXRPose describing the item's position and orientation.", "baseSpace": "An XRSpace to use as the base or origin for the purposes of computing\nthe relative position and orientation." @@ -21627,7 +21707,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getViewerPose() method, a member of the XRFrame interface, returns a XRViewerPose object which describes the viewer's pose (position and orientation) relative to the specified reference space.\n

    See the getPose() method for a way to calculate a pose that represents the difference between two spaces.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getViewerPose() method, a member of the XRFrame interface, returns a XRViewerPose object which describes the viewer's pose (position and orientation) relative to the specified reference space.\n

    See the getPose() method for a way to calculate a pose that represents the difference between two spaces.", "parameters": { "referenceSpace": "An XRReferenceSpace object specifying the space to use as the\nreference point or base for the computation of the viewer's current pose." }, @@ -21651,7 +21731,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    An XRFrame object's read-only session property returns the XRSession object that generated the frame." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    An XRFrame object's read-only session property returns the XRSession object that generated the frame." }, "xrframe.trackedanchors": { "url": "$MDN_URL$/web/api/xrframe/trackedanchors", @@ -21668,7 +21748,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only trackedAnchor property of the XRFrame interface returns an XRAnchorSet object containing all anchors still tracked in the frame." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only trackedAnchor property of the XRFrame interface returns an XRAnchorSet object containing all anchors still tracked in the frame." }, "xrhand": { "url": "$MDN_URL$/web/api/xrhand", @@ -21700,7 +21780,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRHitTestResult interface of the WebXR Device API contains a single result of a hit test. You can get an array of XRHitTestResult objects for a frame by calling XRFrame.getHitTestResults()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRHitTestResult interface of the WebXR Device API contains a single result of a hit test. You can get an array of XRHitTestResult objects for a frame by calling XRFrame.getHitTestResults()." }, "xrhittestresult.createanchor": { "url": "$MDN_URL$/web/api/xrhittestresult/createanchor", @@ -21717,7 +21797,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createAnchor() method of the XRHitTestResult interface creates an XRAnchor from a hit test result that is attached to a real-world object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The createAnchor() method of the XRHitTestResult interface creates an XRAnchor from a hit test result that is attached to a real-world object.", "returns": "A Promise resolving with an XRAnchor object." }, "xrhittestresult.getpose": { @@ -21735,7 +21815,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getPose() method of the XRHitTestResult interface returns the XRPose of the hit test result relative to the given base space.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The getPose() method of the XRHitTestResult interface returns the XRPose of the hit test result relative to the given base space.", "parameters": { "baseSpace": "An XRSpace to use as the base or origin for computing the relative position and orientation of hit test results." }, @@ -21756,7 +21836,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRHitTestSource interface of the WebXR Device API handles hit test subscriptions. You can get an XRHitTestSource object by using the XRSession.requestHitTestSource() method.\n

    This object doesn't itself contain hit test results, but it is used to compute hit tests for each XRFrame by calling XRFrame.getHitTestResults(), which returns XRHitTestResult objects." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRHitTestSource interface of the WebXR Device API handles hit test subscriptions. You can get an XRHitTestSource object by using the XRSession.requestHitTestSource() method.\n

    This object doesn't itself contain hit test results, but it is used to compute hit tests for each XRFrame by calling XRFrame.getHitTestResults(), which returns XRHitTestResult objects." }, "xrhittestsource.cancel": { "url": "$MDN_URL$/web/api/xrhittestsource/cancel", @@ -21773,7 +21853,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancel() method of the XRHitTestSource interface unsubscribes a hit test.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancel() method of the XRHitTestSource interface unsubscribes a hit test.", "returns": "None (undefined)." }, "xrinputsource": { @@ -21790,7 +21870,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRInputSource interface describes a single source of control input which is part of the user's WebXR-compatible virtual or augmented reality system. The device is specific to the platform being used, but provides the direction in which it is being aimed and optionally may generate events if the user triggers performs actions using the device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRInputSource interface describes a single source of control input which is part of the user's WebXR-compatible virtual or augmented reality system. The device is specific to the platform being used, but provides the direction in which it is being aimed and optionally may generate events if the user triggers performs actions using the device." }, "xrinputsource.gamepad": { "url": "$MDN_URL$/web/api/xrinputsource/gamepad", @@ -21806,7 +21886,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property gamepad returns a Gamepad object describing the state of the buttons and axes on the XR input source, if it is a gamepad or comparable device. If the device isn't a gamepad-like device, this property's value is null.\n

    The Gamepad instance returned behaves as described by the Gamepad API. However, there are a few things to note:\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property gamepad returns a Gamepad object describing the state of the buttons and axes on the XR input source, if it is a gamepad or comparable device. If the device isn't a gamepad-like device, this property's value is null.\n

    The Gamepad instance returned behaves as described by the Gamepad API. However, there are a few things to note:\n

    " }, "xrinputsource.gripspace": { "url": "$MDN_URL$/web/api/xrinputsource/gripspace", @@ -21822,7 +21902,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property gripSpace returns an XRSpace whose native origin tracks the pose used to render virtual objects so they appear to be held in (or part of) the user's hand. For example, if a user were holding a virtual straight rod, the native origin of this XRSpace would be located at the approximate center of mass of the user's fist." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property gripSpace returns an XRSpace whose native origin tracks the pose used to render virtual objects so they appear to be held in (or part of) the user's hand. For example, if a user were holding a virtual straight rod, the native origin of this XRSpace would be located at the approximate center of mass of the user's fist." }, "xrinputsource.hand": { "url": "$MDN_URL$/web/api/xrinputsource/hand", @@ -21837,7 +21917,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only hand property of the XRInputSource interface is a XRHand object providing access to a hand-tracking device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only hand property of the XRInputSource interface is a XRHand object providing access to a hand-tracking device." }, "xrinputsource.handedness": { "url": "$MDN_URL$/web/api/xrinputsource/handedness", @@ -21853,7 +21933,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property\nhandedness indicates which of the user's hands the WebXR\ninput source is associated with, or if it's not associated with a hand at all." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property\nhandedness indicates which of the user's hands the WebXR\ninput source is associated with, or if it's not associated with a hand at all." }, "xrinputsource.profiles": { "url": "$MDN_URL$/web/api/xrinputsource/profiles", @@ -21869,7 +21949,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property profiles returns an array of strings, each describing a configuration profile for the input source. The profile strings are listed in order of specificity, with the most specific profile listed first.\n

    \n

    Note:\nThe profiles list is always empty when the WebXR\nsession is in inline mode.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property profiles returns an array of strings, each describing a configuration profile for the input source. The profile strings are listed in order of specificity, with the most specific profile listed first.\n

    \n

    Note:\nThe profiles list is always empty when the WebXR\nsession is in inline mode.\n

    " }, "xrinputsource.targetraymode": { "url": "$MDN_URL$/web/api/xrinputsource/targetraymode", @@ -21885,7 +21965,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource\nproperty targetRayMode indicates the method by which the\ntarget ray for the input source should be generated and how it should be presented to\nthe user.\n

    Typically a target ray is drawn from the source of the targeting system along the target ray in the direction in which the user is looking or pointing. The style of the ray is generally up to you, as is the method for indicating the endpoint of the ray. The targeted point or object might be indicated by drawing a shape or highlighting the targeted surface or object.\n

    A target ray emitted by a hand controller:\n

    The target ray can be anything from a simple line (ideally fading over distance) to an animated effect, such as the science-fiction \"phaser\" style shown in the screenshot above." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource\nproperty targetRayMode indicates the method by which the\ntarget ray for the input source should be generated and how it should be presented to\nthe user.\n

    Typically a target ray is drawn from the source of the targeting system along the target ray in the direction in which the user is looking or pointing. The style of the ray is generally up to you, as is the method for indicating the endpoint of the ray. The targeted point or object might be indicated by drawing a shape or highlighting the targeted surface or object.\n

    A target ray emitted by a hand controller:\n

    The target ray can be anything from a simple line (ideally fading over distance) to an animated effect, such as the science-fiction \"phaser\" style shown in the screenshot above." }, "xrinputsource.targetrayspace": { "url": "$MDN_URL$/web/api/xrinputsource/targetrayspace", @@ -21901,7 +21981,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property\ntargetRaySpace returns an XRSpace\n(typically an XRReferenceSpace) representing the position and\norientation of the target ray in the virtual space. Its native origin tracks\nthe position of the origin point of the target ray, and its orientation indicates the\norientation of the controller device itself. These values, interpreted in the context of\nthe input source's targetRayMode, can be\nused both to fully interpret the device as an input source.\n

    To obtain an XRSpace representing the input controller's position and\norientation in virtual space, use the gripSpace property." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSource property\ntargetRaySpace returns an XRSpace\n(typically an XRReferenceSpace) representing the position and\norientation of the target ray in the virtual space. Its native origin tracks\nthe position of the origin point of the target ray, and its orientation indicates the\norientation of the controller device itself. These values, interpreted in the context of\nthe input source's targetRayMode, can be\nused both to fully interpret the device as an input source.\n

    To obtain an XRSpace representing the input controller's position and\norientation in virtual space, use the gripSpace property." }, "xrinputsourcearray": { "url": "$MDN_URL$/web/api/xrinputsourcearray", @@ -21918,7 +21998,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The interface XRInputSourceArray represents a live list of WebXR input sources, and is used as the return value of the XRSession property inputSources. Each entry is an XRInputSource representing one input device connected to the WebXR system.\n

    In addition to being able to access the input sources in the list using standard array notation (that is, with index numbers inside square brackets), methods are available to allow the use of iterators and the forEach() method is also available." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The interface XRInputSourceArray represents a live list of WebXR input sources, and is used as the return value of the XRSession property inputSources. Each entry is an XRInputSource representing one input device connected to the WebXR system.\n

    In addition to being able to access the input sources in the list using standard array notation (that is, with index numbers inside square brackets), methods are available to allow the use of iterators and the forEach() method is also available." }, "xrinputsourcearray.entries": { "url": "$MDN_URL$/web/api/xrinputsourcearray/entries", @@ -21993,7 +22073,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only length property returns an integer value\nindicating the number of items in the input source list represented by\nthe XRInputSourceArray object." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only length property returns an integer value\nindicating the number of items in the input source list represented by\nthe XRInputSourceArray object." }, "xrinputsourcearray.values": { "url": "$MDN_URL$/web/api/xrinputsourcearray/values", @@ -22027,7 +22107,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRInputSourceEvent interface describes an event which has occurred on a WebXR user input device such as a hand controller, gaze tracking system, or motion tracking system. More specifically, they represent a change in the state of an XRInputSource.\n

    To learn more about handling inputs in a WebXR project, see the article Inputs and input sources." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRInputSourceEvent interface describes an event which has occurred on a WebXR user input device such as a hand controller, gaze tracking system, or motion tracking system. More specifically, they represent a change in the state of an XRInputSource.\n

    To learn more about handling inputs in a WebXR project, see the article Inputs and input sources." }, "xrinputsourceevent.frame": { "url": "$MDN_URL$/web/api/xrinputsourceevent/frame", @@ -22043,7 +22123,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourceEvent property\nframe specifies an XRFrame object\nrepresenting the event frame during which a WebXR user input occurred.\nThis may thus be an event which occurred in the past rather than a current or impending\nevent." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourceEvent property\nframe specifies an XRFrame object\nrepresenting the event frame during which a WebXR user input occurred.\nThis may thus be an event which occurred in the past rather than a current or impending\nevent." }, "xrinputsourceevent.inputsource": { "url": "$MDN_URL$/web/api/xrinputsourceevent/inputsource", @@ -22059,7 +22139,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourceEvent interface's read-only\ninputSource property specifies the\nXRInputSource which generated the input event. This information\nlets you handle the event appropriately given the particulars of the user input device\nbeing manipulated." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourceEvent interface's read-only\ninputSource property specifies the\nXRInputSource which generated the input event. This information\nlets you handle the event appropriately given the particulars of the user input device\nbeing manipulated." }, "xrinputsourceevent.xrinputsourceevent": { "url": "$MDN_URL$/web/api/xrinputsourceevent/xrinputsourceevent", @@ -22075,7 +22155,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourceEvent()\nconstructor creates and returns a new XRInputSourceEvent object\ndescribing an event (state change) which has occurred on a WebXR user input device\nrepresented by an XRInputSource.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourceEvent()\nconstructor creates and returns a new XRInputSourceEvent object\ndescribing an event (state change) which has occurred on a WebXR user input device\nrepresented by an XRInputSource.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to select, selectend, selectstart, squeeze, squeezeend, squeezestart.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    frame
    \n
    \n

    An XRFrame object representing the event frame during which the event took place.\nThis event is not associated with the animation process, and has no viewer information contained within it.\n

    \n
    inputSource
    \n
    \n

    An XRInputSource object representing the input device from which the event is being sent.\n

    \n
    " @@ -22096,7 +22176,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRInputSourcesChangeEvent is used to represent the inputsourceschange event sent to an XRSession when the set of available WebXR input controllers changes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRInputSourcesChangeEvent is used to represent the inputsourceschange event sent to an XRSession when the set of available WebXR input controllers changes." }, "xrinputsourceschangeevent.added": { "url": "$MDN_URL$/web/api/xrinputsourceschangeevent/added", @@ -22112,7 +22192,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourcesChangeEvent\nproperty added is a list of zero or\nmore input sources, each identified using an XRInputSource object,\nwhich have been newly made available for use." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourcesChangeEvent\nproperty added is a list of zero or\nmore input sources, each identified using an XRInputSource object,\nwhich have been newly made available for use." }, "xrinputsourceschangeevent.removed": { "url": "$MDN_URL$/web/api/xrinputsourceschangeevent/removed", @@ -22128,7 +22208,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourcesChangeEvent property removed is an array of\nzero or more XRInputSource objects representing the input sources that have been removed from the XRSession." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRInputSourcesChangeEvent property removed is an array of\nzero or more XRInputSource objects representing the input sources that have been removed from the XRSession." }, "xrinputsourceschangeevent.session": { "url": "$MDN_URL$/web/api/xrinputsourceschangeevent/session", @@ -22144,7 +22224,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourcesChangeEvent property\nsession specifies the\nXRSession to which the input source list change event applies." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourcesChangeEvent property\nsession specifies the\nXRSession to which the input source list change event applies." }, "xrinputsourceschangeevent.xrinputsourceschangeevent": { "url": "$MDN_URL$/web/api/xrinputsourceschangeevent/xrinputsourceschangeevent", @@ -22160,7 +22240,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourcesChangeEvent()\nconstructor creates and returns a new XRInputSourcesChangeEvent object,\nrepresenting an update to the list of available WebXR input devices. You\nwon't typically call this constructor yourself, as these events are created and sent to\nyou by the WebXR system.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRInputSourcesChangeEvent()\nconstructor creates and returns a new XRInputSourcesChangeEvent object,\nrepresenting an update to the list of available WebXR input devices. You\nwon't typically call this constructor yourself, as these events are created and sent to\nyou by the WebXR system.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to inputsourceschange.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    added
    \n
    \n

    An array of zero or more XRInputSource objects, each representing one input device which is newly available to use.\n

    \n
    removed
    \n
    \n

    An array of zero or more XRInputSource objects representing the input devices which are no longer available.\n

    \n
    session
    \n
    \n

    The XRSession to which the event applies.\n

    \n
    " @@ -22242,7 +22322,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLayer interface of the WebXR Device API is the base class for WebXR layer types. It inherits methods from EventTarget." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLayer interface of the WebXR Device API is the base class for WebXR layer types. It inherits methods from EventTarget." }, "xrlayerevent": { "url": "$MDN_URL$/web/api/xrlayerevent", @@ -22254,7 +22334,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLayerEvent interface of the WebXR Device API is the event type for events related to a change of state of an XRLayer object. These events occur, for example, when the layer needs to be redrawn." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLayerEvent interface of the WebXR Device API is the event type for events related to a change of state of an XRLayer object. These events occur, for example, when the layer needs to be redrawn." }, "xrlayerevent.layer": { "url": "$MDN_URL$/web/api/xrlayerevent/layer", @@ -22266,7 +22346,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The layer property of the XRLayerEvent interface is a reference to the XRLayer which generated the event." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The layer property of the XRLayerEvent interface is a reference to the XRLayer which generated the event." }, "xrlayerevent.xrlayerevent": { "url": "$MDN_URL$/web/api/xrlayerevent/xrlayerevent", @@ -22278,7 +22358,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRLayerEvent constructor creates and returns a new XRLayerEvent object. These events relate to a change of state of an XRLayer object.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRLayerEvent constructor creates and returns a new XRLayerEvent object. These events relate to a change of state of an XRLayer object.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to redraw.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    layer
    \n
    \n

    The XRLayer to which the event is to be delivered.\n

    \n
    " @@ -22300,7 +22380,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLightEstimate interface of the WebXR Device API provides the estimated lighting values for an XRLightProbe at the time represented by an XRFrame.\n

    To get an XRLightEstimate object, call the XRFrame.getLightEstimate() method." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLightEstimate interface of the WebXR Device API provides the estimated lighting values for an XRLightProbe at the time represented by an XRFrame.\n

    To get an XRLightEstimate object, call the XRFrame.getLightEstimate() method." }, "xrlightestimate.primarylightdirection": { "url": "$MDN_URL$/web/api/xrlightestimate/primarylightdirection", @@ -22317,7 +22397,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only primaryLightDirection property of the XRLightEstimate interface returns a DOMPointReadOnly representing the direction to the primary light source from the probeSpace of an XRLightProbe." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only primaryLightDirection property of the XRLightEstimate interface returns a DOMPointReadOnly representing the direction to the primary light source from the probeSpace of an XRLightProbe." }, "xrlightestimate.primarylightintensity": { "url": "$MDN_URL$/web/api/xrlightestimate/primarylightintensity", @@ -22334,7 +22414,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only primaryLightIntensity property of the XRLightEstimate interface returns a DOMPointReadOnly representing the intensity of the primary light source from the probeSpace of an XRLightProbe." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only primaryLightIntensity property of the XRLightEstimate interface returns a DOMPointReadOnly representing the intensity of the primary light source from the probeSpace of an XRLightProbe." }, "xrlightestimate.sphericalharmonicscoefficients": { "url": "$MDN_URL$/web/api/xrlightestimate/sphericalharmonicscoefficients", @@ -22351,7 +22431,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only sphericalHarmonicsCoefficients property of the XRLightEstimate interface returns a Float32Array containing 9 spherical harmonics coefficients.\n

    Spherical harmonic lighting is a technique that uses spherical functions instead of standard lighting equations. See Wikipedia for more information." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only sphericalHarmonicsCoefficients property of the XRLightEstimate interface returns a Float32Array containing 9 spherical harmonics coefficients.\n

    Spherical harmonic lighting is a technique that uses spherical functions instead of standard lighting equations. See Wikipedia for more information." }, "xrlightprobe": { "url": "$MDN_URL$/web/api/xrlightprobe", @@ -22368,7 +22448,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLightProbe interface of the WebXR Device API contains lighting information at a given point in the user's environment. You can get an XRLighting object using the XRSession.requestLightProbe() method.\n

    This object doesn't itself contain lighting values, but it is used to collect lighting states for each XRFrame. See XRLightEstimate for the estimated lighting values for an XRLightProbe." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRLightProbe interface of the WebXR Device API contains lighting information at a given point in the user's environment. You can get an XRLighting object using the XRSession.requestLightProbe() method.\n

    This object doesn't itself contain lighting values, but it is used to collect lighting states for each XRFrame. See XRLightEstimate for the estimated lighting values for an XRLightProbe." }, "xrlightprobe.probespace": { "url": "$MDN_URL$/web/api/xrlightprobe/probespace", @@ -22385,7 +22465,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only probeSpace property of the XRLightProbe interface returns an XRSpace tracking the position and orientation that the lighting estimations are relative to." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only probeSpace property of the XRLightProbe interface returns an XRSpace tracking the position and orientation that the lighting estimations are relative to." }, "xrmediabinding": { "url": "$MDN_URL$/web/api/xrmediabinding", @@ -22397,7 +22477,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRMediaBinding interface is used to create layers that display the content of an HTMLVideoElement.\n

    \n

    Note:\nOnly the video frames will be displayed in the layer. Video controls need to be implemented separately and must be drawn in another layer.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRMediaBinding interface is used to create layers that display the content of an HTMLVideoElement.\n

    \n

    Note:\nOnly the video frames will be displayed in the layer. Video controls need to be implemented separately and must be drawn in another layer.\n

    " }, "xrmediabinding.createcylinderlayer": { "url": "$MDN_URL$/web/api/xrmediabinding/createcylinderlayer", @@ -22483,7 +22563,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    XRPose is a WebXR API interface representing a position and orientation in the 3D space, relative to the XRSpace within which it resides. The XRSpace—which is either an XRReferenceSpace or an XRBoundedReferenceSpace—defines the coordinate system used for the pose and, in the case of an XRViewerPose, its underlying views.\n

    To obtain the XRPose for the XRSpace used as the local coordinate system of an object, call XRFrame.getPose(), specifying that local XRSpace and the space to which you wish to convert:\n

    \n```js\nthePose = xrFrame.getPose(localSpace, baseSpace);\n```\n
    \n

    The pose for a viewer (or camera) is represented by the XRViewerPose subclass of XRPose. This is obtained using XRFrame.getViewerPose() instead of getPose(), specifying a reference space which has been adjusted to position and orient the node to provide the desired viewing position and angle:\n

    \n```js\nviewerPose = xrFrame.getViewerPose(adjReferenceSpace);\n```\n
    \n

    Here, adjReferenceSpace is a reference space which has been updated using the base frame of reference for the frame and any adjustments needed to position the viewer based on movement or rotation which is being supplied from a source other than the XR device, such as keyboard or mouse inputs.\n

    See the article Movement, orientation, and motion for further details and an example with thorough explanations of what's going on." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    XRPose is a WebXR API interface representing a position and orientation in the 3D space, relative to the XRSpace within which it resides. The XRSpace—which is either an XRReferenceSpace or an XRBoundedReferenceSpace—defines the coordinate system used for the pose and, in the case of an XRViewerPose, its underlying views.\n

    To obtain the XRPose for the XRSpace used as the local coordinate system of an object, call XRFrame.getPose(), specifying that local XRSpace and the space to which you wish to convert:\n

    \n```js\nthePose = xrFrame.getPose(localSpace, baseSpace);\n```\n
    \n

    The pose for a viewer (or camera) is represented by the XRViewerPose subclass of XRPose. This is obtained using XRFrame.getViewerPose() instead of getPose(), specifying a reference space which has been adjusted to position and orient the node to provide the desired viewing position and angle:\n

    \n```js\nviewerPose = xrFrame.getViewerPose(adjReferenceSpace);\n```\n
    \n

    Here, adjReferenceSpace is a reference space which has been updated using the base frame of reference for the frame and any adjustments needed to position the viewer based on movement or rotation which is being supplied from a source other than the XR device, such as keyboard or mouse inputs.\n

    See the article Movement, orientation, and motion for further details and an example with thorough explanations of what's going on." }, "xrpose.angularvelocity": { "url": "$MDN_URL$/web/api/xrpose/angularvelocity", @@ -22494,7 +22574,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The angularVelocity read-only property of the\nXRPose interface is a DOMPointReadOnly describing\nthe angular velocity in radians per second relative to the base\nXRSpace." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The angularVelocity read-only property of the\nXRPose interface is a DOMPointReadOnly describing\nthe angular velocity in radians per second relative to the base\nXRSpace." }, "xrpose.emulatedposition": { "url": "$MDN_URL$/web/api/xrpose/emulatedposition", @@ -22510,7 +22590,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The emulatedPosition read-only attribute of the\nXRPose interface is a Boolean value indicating whether or not both the\nposition component of the pose's\ntransform is directly taken from the XR device, or\nit's simulated or computed based on other sources." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The emulatedPosition read-only attribute of the\nXRPose interface is a Boolean value indicating whether or not both the\nposition component of the pose's\ntransform is directly taken from the XR device, or\nit's simulated or computed based on other sources." }, "xrpose.linearvelocity": { "url": "$MDN_URL$/web/api/xrpose/linearvelocity", @@ -22521,7 +22601,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The linearVelocity read-only property of the\nXRPose interface is a DOMPointReadOnly describing\nthe linear velocity in meters per second relative to the base\nXRSpace." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The linearVelocity read-only property of the\nXRPose interface is a DOMPointReadOnly describing\nthe linear velocity in meters per second relative to the base\nXRSpace." }, "xrpose.transform": { "url": "$MDN_URL$/web/api/xrpose/transform", @@ -22537,7 +22617,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The transform read-only attribute of the\nXRPose interface is a XRRigidTransform object providing\nthe position and orientation of the pose relative to the base XRSpace\nas specified when the pose was obtained by calling\nXRFrame.getPose()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The transform read-only attribute of the\nXRPose interface is a XRRigidTransform object providing\nthe position and orientation of the pose relative to the base XRSpace\nas specified when the pose was obtained by calling\nXRFrame.getPose()." }, "xrprojectionlayer": { "url": "$MDN_URL$/web/api/xrprojectionlayer", @@ -22549,7 +22629,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRProjectionLayer interface of the WebXR Device API is a layer that fills the entire view of the observer and is refreshed close to the device's native frame rate.\n

    XRProjectionLayer is supported by all XRSession objects (no layers feature descriptor is needed).\n

    To create a new XRProjectionLayer, call XRWebGLBinding.createProjectionLayer().\nTo present layers to the XR device, add them to the layers render state using XRSession.updateRenderState().\n

    XRProjectionLayer objects don't have an associated XRSpace, because they render to the full frame." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRProjectionLayer interface of the WebXR Device API is a layer that fills the entire view of the observer and is refreshed close to the device's native frame rate.\n

    XRProjectionLayer is supported by all XRSession objects (no layers feature descriptor is needed).\n

    To create a new XRProjectionLayer, call XRWebGLBinding.createProjectionLayer().\nTo present layers to the XR device, add them to the layers render state using XRSession.updateRenderState().\n

    XRProjectionLayer objects don't have an associated XRSpace, because they render to the full frame." }, "xrprojectionlayer.fixedfoveation": { "url": "$MDN_URL$/web/api/xrprojectionlayer/fixedfoveation", @@ -22621,7 +22701,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRQuadLayer interface of the WebXR Device API is a layer that takes up a flat rectangular space in the virtual environment. An XRQuadLayer has no thickness. It is a two-dimensional object positioned and oriented in 3D space. The position of a quad refers to the center of the quad. Only the front of the layer is visible.\n

    XRQuadLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRQuadLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRQuadLayer interface of the WebXR Device API is a layer that takes up a flat rectangular space in the virtual environment. An XRQuadLayer has no thickness. It is a two-dimensional object positioned and oriented in 3D space. The position of a quad refers to the center of the quad. Only the front of the layer is visible.\n

    XRQuadLayer requires the layers feature to be enabled for the XRSession. You can request it in XRSystem.requestSession().\n

    To create a new XRQuadLayer, call either:\n

    \n

    To present layers to the XR device, add them to the layers render state using XRSession.updateRenderState()." }, "xrquadlayer.height": { "url": "$MDN_URL$/web/api/xrquadlayer/height", @@ -22686,7 +22766,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRRay interface of the WebXR Device API is a geometric ray described by an origin point and a direction vector.\n

    XRRay objects can be passed to XRSession.requestHitTestSource() or XRSession.requestHitTestSourceForTransientInput() to perform hit testing." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRRay interface of the WebXR Device API is a geometric ray described by an origin point and a direction vector.\n

    XRRay objects can be passed to XRSession.requestHitTestSource() or XRSession.requestHitTestSourceForTransientInput() to perform hit testing." }, "xrray.direction": { "url": "$MDN_URL$/web/api/xrray/direction", @@ -22703,7 +22783,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only direction property of the XRRay interface is a DOMPointReadOnly representing the ray's 3-dimensional directional vector, normalized to a unit vector with a length of 1.0." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only direction property of the XRRay interface is a DOMPointReadOnly representing the ray's 3-dimensional directional vector, normalized to a unit vector with a length of 1.0." }, "xrray.matrix": { "url": "$MDN_URL$/web/api/xrray/matrix", @@ -22720,7 +22800,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only matrix property of the XRRay interface is a transform that can be used to position objects along the XRRay. This is a 4 by 4 matrix given as a 16 element Float32Array in column major order.\n

    The transform from a ray originates at [0, 0, 0] and extends down the negative z-axis to the ray described by the XRRay's origin and direction." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only matrix property of the XRRay interface is a transform that can be used to position objects along the XRRay. This is a 4 by 4 matrix given as a 16 element Float32Array in column major order.\n

    The transform from a ray originates at [0, 0, 0] and extends down the negative z-axis to the ray described by the XRRay's origin and direction." }, "xrray.origin": { "url": "$MDN_URL$/web/api/xrray/origin", @@ -22737,7 +22817,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only origin property of the XRRay interface is a DOMPointReadOnly representing the 3-dimensional point in space that the ray originates from, in meters." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only origin property of the XRRay interface is a DOMPointReadOnly representing the 3-dimensional point in space that the ray originates from, in meters." }, "xrray.xrray": { "url": "$MDN_URL$/web/api/xrray/xrray", @@ -22754,7 +22834,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRRay() constructor creates a new XRRay object which is a geometric ray described by an origin point and a direction vector.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRRay() constructor creates a new XRRay object which is a geometric ray described by an origin point and a direction vector.", "parameters": { "origin": "A point object defining the 3-dimensional point in space that the ray originates from, in meters. All dimensions are optional, however, if provided, the origin's w property must be 1.0. The object is initialized to { x: 0.0, y: 0.0, z: 0.0, w: 1.0 } by default.", "direction": "A vector object defining the ray's 3-dimensional directional vector. All dimensions are optional, however, if provided, the direction's w property must be 0.0. The object is initialized to: { x: 0.0, y: 0.0, z: -1.0, w: 0.0 } by default.", @@ -22779,7 +22859,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRReferenceSpace interface describes the coordinate system for a specific tracked entity or object within the virtual world using a specified tracking behavior. The tracking behavior is defined by the selected reference space type. It expands upon the base class, XRSpace, by adding support for several different tracking behaviors as well as to request a new reference space which describes the offset transform between the tracked object and another location in the world.\n

    All reference spaces—with the sole exception being bounded reference spaces—are described using the XRReferenceSpace type. Bounded spaces are implemented as XRBoundedReferenceSpace objects. These are special spaces which let you establish a perimeter within which it's \"safe\" for the viewer to move. For XR systems that allow the user to physically move around, such as those that track movement with a real-world camera, this boundary establishes the edges of the area the user is able to move around in, whether due to physical obstacles or due to limitations of the XR hardware. See the article Using bounded reference spaces to protect the viewer for more on using boundaries to keep the user from colliding with obstacles both physical and virtual." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRReferenceSpace interface describes the coordinate system for a specific tracked entity or object within the virtual world using a specified tracking behavior. The tracking behavior is defined by the selected reference space type. It expands upon the base class, XRSpace, by adding support for several different tracking behaviors as well as to request a new reference space which describes the offset transform between the tracked object and another location in the world.\n

    All reference spaces—with the sole exception being bounded reference spaces—are described using the XRReferenceSpace type. Bounded spaces are implemented as XRBoundedReferenceSpace objects. These are special spaces which let you establish a perimeter within which it's \"safe\" for the viewer to move. For XR systems that allow the user to physically move around, such as those that track movement with a real-world camera, this boundary establishes the edges of the area the user is able to move around in, whether due to physical obstacles or due to limitations of the XR hardware. See the article Using bounded reference spaces to protect the viewer for more on using boundaries to keep the user from colliding with obstacles both physical and virtual." }, "xrreferencespace.getoffsetreferencespace": { "url": "$MDN_URL$/web/api/xrreferencespace/getoffsetreferencespace", @@ -22795,7 +22875,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRReferenceSpace\ninterface's getOffsetReferenceSpace() method returns a\nnew reference space object which describes the relative difference in position between\nthe object on which the method is called and a given point in 3D space. The\nobject returned by getOffsetReferenceSpace() is an\nXRReferenceSpace if called on an XRReferenceSpace, or an\nXRBoundedReferenceSpace if called on an object of that type.\n

    In other words, when you have an object in 3D space and need to position another object\nrelative to that one, you can call getOffsetReferenceSpace(), passing into\nit the position and orientation you want the second object to have\nrelative to the position and orientation of the object on which you call getOffsetReferenceSpace().\n

    Then, when drawing the scene, you can use the offset reference space to not only\nposition objects relative to one another, but to apply the needed transforms to render\nobjects properly based upon the viewer's position. This is demonstrated in the example\nImplementing rotation based on non-XR inputs, which demonstrates a way to\nuse this method to let the user use their mouse to pitch and yaw their viewing angle.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRReferenceSpace\ninterface's getOffsetReferenceSpace() method returns a\nnew reference space object which describes the relative difference in position between\nthe object on which the method is called and a given point in 3D space. The\nobject returned by getOffsetReferenceSpace() is an\nXRReferenceSpace if called on an XRReferenceSpace, or an\nXRBoundedReferenceSpace if called on an object of that type.\n

    In other words, when you have an object in 3D space and need to position another object\nrelative to that one, you can call getOffsetReferenceSpace(), passing into\nit the position and orientation you want the second object to have\nrelative to the position and orientation of the object on which you call getOffsetReferenceSpace().\n

    Then, when drawing the scene, you can use the offset reference space to not only\nposition objects relative to one another, but to apply the needed transforms to render\nobjects properly based upon the viewer's position. This is demonstrated in the example\nImplementing rotation based on non-XR inputs, which demonstrates a way to\nuse this method to let the user use their mouse to pitch and yaw their viewing angle.", "parameters": { "originOffset": "An XRRigidTransform specifying the offset to the origin of the new\nreference space. These values are added to the position and orientation of the current\nreference space and then the result is used as the position and orientation of the\nnewly created XRReferenceSpace." }, @@ -22815,7 +22895,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRReferenceSpaceEvent represents an event sent to an XRReferenceSpace. Currently, the only event that uses this type is the reset event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRReferenceSpaceEvent represents an event sent to an XRReferenceSpace. Currently, the only event that uses this type is the reset event." }, "xrreferencespaceevent.referencespace": { "url": "$MDN_URL$/web/api/xrreferencespaceevent/referencespace", @@ -22831,7 +22911,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRReferenceSpaceEvent property\nreferenceSpace specifies the reference space which is the\noriginator of the event." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRReferenceSpaceEvent property\nreferenceSpace specifies the reference space which is the\noriginator of the event." }, "xrreferencespaceevent.transform": { "url": "$MDN_URL$/web/api/xrreferencespaceevent/transform", @@ -22847,7 +22927,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRReferenceSpaceEvent property\ntransform indicates the position and orientation of the\naffected referenceSpace's\nnative origin after the changes the event represents are applied. The\ntransform is defined using the old coordinate system, which allows it to be\nused to convert coordinates from the pre-event coordinate system to the post-event\ncoordinate system." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRReferenceSpaceEvent property\ntransform indicates the position and orientation of the\naffected referenceSpace's\nnative origin after the changes the event represents are applied. The\ntransform is defined using the old coordinate system, which allows it to be\nused to convert coordinates from the pre-event coordinate system to the post-event\ncoordinate system." }, "xrreferencespaceevent.xrreferencespaceevent": { "url": "$MDN_URL$/web/api/xrreferencespaceevent/xrreferencespaceevent", @@ -22863,7 +22943,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRReferenceSpaceEvent()\nconstructor is used to create a new XRReferenceSpaceEvent object, which\nrepresents an event regarding the state of a WebXR reference space object,\nXRReferenceSpace.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRReferenceSpaceEvent()\nconstructor is used to create a new XRReferenceSpaceEvent object, which\nrepresents an event regarding the state of a WebXR reference space object,\nXRReferenceSpace.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers always set it to reset.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    referenceSpace
    \n
    \n

    The XRReferenceSpace from which the event originates.\n

    \n
    transform
    \n
    \n

    An XRRigidTransform which maps the old coordinate system (from before the changes indicated by this event) to the new coordinate system.\n

    \n
    " @@ -22885,7 +22965,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRRenderState interface of the WebXR Device API contains configurable values which affect how the imagery generated by an XRSession gets composited. These properties include the range of distances from the viewer within which content should be rendered, the vertical field of view (for inline presentations), and a reference to the XRWebGLLayer being used as the target for rendering the scene prior to it being presented on the XR device's display or displays.\n

    When you apply changes using the XRSession method updateRenderState(), the specified changes take effect after the current animation frame has completed, but before the next one begins." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRRenderState interface of the WebXR Device API contains configurable values which affect how the imagery generated by an XRSession gets composited. These properties include the range of distances from the viewer within which content should be rendered, the vertical field of view (for inline presentations), and a reference to the XRWebGLLayer being used as the target for rendering the scene prior to it being presented on the XR device's display or displays.\n

    When you apply changes using the XRSession method updateRenderState(), the specified changes take effect after the current animation frame has completed, but before the next one begins." }, "xrrenderstate.baselayer": { "url": "$MDN_URL$/web/api/xrrenderstate/baselayer", @@ -22902,7 +22982,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only baseLayer property of the\nXRRenderState interface returns the XRWebGLLayer instance\nthat is the source of bitmap images and a description of how the image is to be rendered\nin the device.\n

    This property is read-only; however, you can indirectly change its\nvalue using XRSession.updateRenderState." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only baseLayer property of the\nXRRenderState interface returns the XRWebGLLayer instance\nthat is the source of bitmap images and a description of how the image is to be rendered\nin the device.\n

    This property is read-only; however, you can indirectly change its\nvalue using XRSession.updateRenderState." }, "xrrenderstate.depthfar": { "url": "$MDN_URL$/web/api/xrrenderstate/depthfar", @@ -22919,7 +22999,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The depthFar read-only property of the\nXRRenderState interface returns the distance in meters of the far clip\nplane from the viewer." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The depthFar read-only property of the\nXRRenderState interface returns the distance in meters of the far clip\nplane from the viewer." }, "xrrenderstate.depthnear": { "url": "$MDN_URL$/web/api/xrrenderstate/depthnear", @@ -22936,7 +23016,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The depthNear read-only property of the\nXRRenderState interface returns the distance in meters of the near clip\nplane from the viewer." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The depthNear read-only property of the\nXRRenderState interface returns the distance in meters of the near clip\nplane from the viewer." }, "xrrenderstate.inlineverticalfieldofview": { "url": "$MDN_URL$/web/api/xrrenderstate/inlineverticalfieldofview", @@ -22953,7 +23033,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inlineVerticalFieldOfView\nproperty of the XRRenderState interface returns the default vertical\nfield of view for \"inline\" sessions and null for all immersive\nsessions." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inlineVerticalFieldOfView\nproperty of the XRRenderState interface returns the default vertical\nfield of view for \"inline\" sessions and null for all immersive\nsessions." }, "xrrenderstate.layers": { "url": "$MDN_URL$/web/api/xrrenderstate/layers", @@ -22965,7 +23045,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only layers property of the XRRenderState interface is an ordered array containing XRLayer objects that are displayed by the XR compositor." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only layers property of the XRRenderState interface is an ordered array containing XRLayer objects that are displayed by the XR compositor." }, "xrrigidtransform": { "url": "$MDN_URL$/web/api/xrrigidtransform", @@ -22981,7 +23061,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRRigidTransform is a WebXR API interface that represents the 3D geometric transform described by a position and orientation.\n

    XRRigidTransform is used to specify transforms throughout the WebXR APIs, including:\n

    \n

    Using XRRigidTransform in these places rather than bare arrays that provide the matrix data has an advantage. It automatically computes the inverse of the transform and even caches it making subsequent requests significantly faster." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRRigidTransform is a WebXR API interface that represents the 3D geometric transform described by a position and orientation.\n

    XRRigidTransform is used to specify transforms throughout the WebXR APIs, including:\n

    \n

    Using XRRigidTransform in these places rather than bare arrays that provide the matrix data has an advantage. It automatically computes the inverse of the transform and even caches it making subsequent requests significantly faster." }, "xrrigidtransform.inverse": { "url": "$MDN_URL$/web/api/xrrigidtransform/inverse", @@ -22997,7 +23077,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inverse property\nof the XRRigidTransform interface returns another\nXRRigidTransform object which is the inverse of its owning\ntransform. That is, you can always get the inverse of any\nXRRigidTransform using its inverse property, instead of having\nto explicitly generate it." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inverse property\nof the XRRigidTransform interface returns another\nXRRigidTransform object which is the inverse of its owning\ntransform. That is, you can always get the inverse of any\nXRRigidTransform using its inverse property, instead of having\nto explicitly generate it." }, "xrrigidtransform.matrix": { "url": "$MDN_URL$/web/api/xrrigidtransform/matrix", @@ -23013,7 +23093,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property matrix returns the transform matrix represented by the object. The returned matrix can then be premultiplied with a column vector to rotate the vector by the 3D rotation specified by the orientation, then translate it by the position." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property matrix returns the transform matrix represented by the object. The returned matrix can then be premultiplied with a column vector to rotate the vector by the 3D rotation specified by the orientation, then translate it by the position." }, "xrrigidtransform.orientation": { "url": "$MDN_URL$/web/api/xrrigidtransform/orientation", @@ -23029,7 +23109,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property\norientation is a DOMPointReadOnly\ncontaining a normalized quaternion (also called a unit\nquaternion or versor)\nspecifying the rotational component of the transform represented by the object.\nIf you specify a quaternion whose length is not exactly 1.0 meters, it will be\nnormalized for you." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property\norientation is a DOMPointReadOnly\ncontaining a normalized quaternion (also called a unit\nquaternion or versor)\nspecifying the rotational component of the transform represented by the object.\nIf you specify a quaternion whose length is not exactly 1.0 meters, it will be\nnormalized for you." }, "xrrigidtransform.position": { "url": "$MDN_URL$/web/api/xrrigidtransform/position", @@ -23045,7 +23125,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property\nposition is a DOMPointReadOnly object which\nprovides the 3D point, specified in meters, describing the translation component of the\ntransform." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRRigidTransform property\nposition is a DOMPointReadOnly object which\nprovides the 3D point, specified in meters, describing the translation component of the\ntransform." }, "xrrigidtransform.xrrigidtransform": { "url": "$MDN_URL$/web/api/xrrigidtransform/xrrigidtransform", @@ -23061,7 +23141,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The\nXRRigidTransform() constructor creates\na new XRRigidTransform object, representing the position and\norientation of a point or object. Among other things,\nXRRigidTransform is used when providing a transform to translate between\ncoordinate systems across spaces.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The\nXRRigidTransform() constructor creates\na new XRRigidTransform object, representing the position and\norientation of a point or object. Among other things,\nXRRigidTransform is used when providing a transform to translate between\ncoordinate systems across spaces.", "parameters": { "position": "An object which specifies the coordinates\nat which the point or object is located. These dimensions are specified in meters. If\nthis parameter is left out or is invalid, the\nposition used is assumed to be {x: 0, y: 0, z: 0, w: 1}. w\nmust always be 1.", "orientation": "An object which specifies the direction in\nwhich the object is facing. The default value for orientation is\n{x: 0, y: 0, z: 0, w: 1}. The specified orientation gets normalized if\nit's not already." @@ -23086,7 +23166,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRSession interface of the WebXR Device API represents an ongoing XR session, providing methods and properties used to interact with and control the session. To open a WebXR session, use the XRSystem interface's requestSession() method.\n

    With XRSession methods, you can poll the viewer's position and orientation (the XRViewerPose), gather information about the user's environment, and present imagery to the user. XRSession supports both inline and immersive virtual and augmented reality modes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRSession interface of the WebXR Device API represents an ongoing XR session, providing methods and properties used to interact with and control the session. To open a WebXR session, use the XRSystem interface's requestSession() method.\n

    With XRSession methods, you can poll the viewer's position and orientation (the XRViewerPose), gather information about the user's environment, and present imagery to the user. XRSession supports both inline and immersive virtual and augmented reality modes." }, "xrsession.cancelanimationframe": { "url": "$MDN_URL$/web/api/xrsession/cancelanimationframe", @@ -23103,7 +23183,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancelAnimationFrame() method of\nthe XRSession interface cancels an animation frame which was previously\nrequested by calling requestAnimationFrame.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancelAnimationFrame() method of\nthe XRSession interface cancels an animation frame which was previously\nrequested by calling requestAnimationFrame.", "parameters": { "handle": "The unique value returned by the call\nto requestAnimationFrame() that\npreviously scheduled the animation callback." }, @@ -23124,7 +23204,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only depthDataFormat property of an immersive-ar\nXRSession describes which depth sensing data format is used." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only depthDataFormat property of an immersive-ar\nXRSession describes which depth sensing data format is used." }, "xrsession.depthusage": { "url": "$MDN_URL$/web/api/xrsession/depthusage", @@ -23141,7 +23221,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only depthUsage property of an immersive-ar\nXRSession describes which depth-sensing usage is used." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only depthUsage property of an immersive-ar\nXRSession describes which depth-sensing usage is used." }, "xrsession.domoverlaystate": { "url": "$MDN_URL$/web/api/xrsession/domoverlaystate", @@ -23158,7 +23238,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only domOverlayState property of an immersive-ar\nXRSession provides information about the DOM overlay, if the feature is enabled." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only domOverlayState property of an immersive-ar\nXRSession provides information about the DOM overlay, if the feature is enabled." }, "xrsession.enabledfeatures": { "url": "$MDN_URL$/web/api/xrsession/enabledfeatures", @@ -23175,7 +23255,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only enabledFeatures property returns an array of features enabled (granted) for an XRSession. This contains all requiredFeatures and a subset of optionalFeatures that have been requested with XRSystem.requestSession()." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only enabledFeatures property returns an array of features enabled (granted) for an XRSession. This contains all requiredFeatures and a subset of optionalFeatures that have been requested with XRSystem.requestSession()." }, "xrsession.end": { "url": "$MDN_URL$/web/api/xrsession/end", @@ -23192,7 +23272,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The end() method shuts down the\nXRSession on which it's called, returning a promise which resolves once\nthe session has fully shut down.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The end() method shuts down the\nXRSession on which it's called, returning a promise which resolves once\nthe session has fully shut down.", "returns": "A promise that resolves without a value after any platform-specific steps\nrelated to shutting down the session have completed. You can use the promise to do\nthings like update UI elements to reflect the shut down connection, trigger application\nshut down, or whatever else you might need to do." }, "xrsession.environmentblendmode": { @@ -23210,7 +23290,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only environmentBlendMode\nproperty identifies if, and to what degree, the computer-generated imagery is overlaid atop the real world.\n

    This is used to differentiate between fully-immersive VR sessions and AR sessions which render\nover a pass-through image of the real world, possibly partially transparently." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only environmentBlendMode\nproperty identifies if, and to what degree, the computer-generated imagery is overlaid atop the real world.\n

    This is used to differentiate between fully-immersive VR sessions and AR sessions which render\nover a pass-through image of the real world, possibly partially transparently." }, "xrsession.inputsources": { "url": "$MDN_URL$/web/api/xrsession/inputsources", @@ -23227,7 +23307,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inputSources property of the\nXRSession interface returns an XRInputSourceArray object\nwhich lists all controllers and input devices which are expressly associated with the\nXR device and are currently available. These controllers may include handheld\ncontrollers, XR-equipped gloves, optically tracked hands, and gaze-based input methods.\nKeyboards, gamepads, and mice are not considered WebXR input sources.\n

    \n

    Note:\nTraditional gamepad controllers are supported using the Gamepad API.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inputSources property of the\nXRSession interface returns an XRInputSourceArray object\nwhich lists all controllers and input devices which are expressly associated with the\nXR device and are currently available. These controllers may include handheld\ncontrollers, XR-equipped gloves, optically tracked hands, and gaze-based input methods.\nKeyboards, gamepads, and mice are not considered WebXR input sources.\n

    \n

    Note:\nTraditional gamepad controllers are supported using the Gamepad API.\n

    " }, "xrsession.interactionmode": { "url": "$MDN_URL$/web/api/xrsession/interactionmode", @@ -23244,7 +23324,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only interactionMode property\ndescribes the best space (according to the user agent) for the application to draw an interactive UI for the current session." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession interface's read-only interactionMode property\ndescribes the best space (according to the user agent) for the application to draw an interactive UI for the current session." }, "xrsession.preferredreflectionformat": { "url": "$MDN_URL$/web/api/xrsession/preferredreflectionformat", @@ -23261,7 +23341,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only preferredReflectionFormat property of the XRSession interface returns this session's preferred reflection format used for lighting estimation texture data." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only preferredReflectionFormat property of the XRSession interface returns this session's preferred reflection format used for lighting estimation texture data." }, "xrsession.renderstate": { "url": "$MDN_URL$/web/api/xrsession/renderstate", @@ -23278,7 +23358,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The\nread-only renderState property of an\nXRSession object indicates the returns a XRRenderState\nobject describing how the user's environment which should be rendered. The\ninformation provided covers the minimum and maximum distance at which to render objects,\nthe vertical field of view to use when rendering the in the inline session\nmode, and the XRWebGLLayer to render into for inline composition.\n

    While this property is read only, you can call the XRSession method\nupdateRenderState() to make changes." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The\nread-only renderState property of an\nXRSession object indicates the returns a XRRenderState\nobject describing how the user's environment which should be rendered. The\ninformation provided covers the minimum and maximum distance at which to render objects,\nthe vertical field of view to use when rendering the in the inline session\nmode, and the XRWebGLLayer to render into for inline composition.\n

    While this property is read only, you can call the XRSession method\nupdateRenderState() to make changes." }, "xrsession.requestanimationframe": { "url": "$MDN_URL$/web/api/xrsession/requestanimationframe", @@ -23295,7 +23375,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession\nmethod requestAnimationFrame(), much like the\nWindow method of the same name, schedules a callback to be executed the\nnext time the browser is ready to paint the session's virtual environment to the XR\ndisplay. The specified callback is executed once before the next repaint; if\nyou wish for it to be executed for the following repaint, you must\ncall requestAnimationFrame() again. This can be done from within the\ncallback itself.\n

    The callback takes two parameters as inputs: an XRFrame describing the\nstate of all tracked objects for the session, and a timestamp you can use to compute\nany animation updates needed.\n

    You can cancel a previously scheduled animation by calling\ncancelAnimationFrame().\n

    \n

    Note:\nDespite the obvious similarities between these methods and the\nglobal requestAnimationFrame() function\nprovided by the Window interface, you must not treat these as\ninterchangeable. There is no guarantee that the latter will work at all while\nan immersive XR session is underway.\n

    ", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSession\nmethod requestAnimationFrame(), much like the\nWindow method of the same name, schedules a callback to be executed the\nnext time the browser is ready to paint the session's virtual environment to the XR\ndisplay. The specified callback is executed once before the next repaint; if\nyou wish for it to be executed for the following repaint, you must\ncall requestAnimationFrame() again. This can be done from within the\ncallback itself.\n

    The callback takes two parameters as inputs: an XRFrame describing the\nstate of all tracked objects for the session, and a timestamp you can use to compute\nany animation updates needed.\n

    You can cancel a previously scheduled animation by calling\ncancelAnimationFrame().\n

    \n

    Note:\nDespite the obvious similarities between these methods and the\nglobal requestAnimationFrame() function\nprovided by the Window interface, you must not treat these as\ninterchangeable. There is no guarantee that the latter will work at all while\nan immersive XR session is underway.\n

    ", "parameters": { "animationFrameCallback": "A function which is called before the next repaint in order to allow you to update\nand render the XR scene based on elapsed time, animation, user input changes, and so\nforth. The callback receives as input two parameters:\n
    \n
    time
    \n
    \n

    A DOMHighResTimeStamp indicating the time offset at which the\nupdated viewer state was received from the WebXR device.\n

    \n
    xrFrame
    \n
    \n

    An XRFrame object describing the state of the objects being\ntracked by the session. This can be used to obtain the poses of the viewer and the\nscene itself, as well as other information needed to render a frame of an AR or VR\nscene.\n

    \n
    " }, @@ -23316,7 +23396,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestHitTestSource() method of the\nXRSession interface returns a Promise that resolves with an XRHitTestSource object that can be passed to XRFrame.getHitTestResults().", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestHitTestSource() method of the\nXRSession interface returns a Promise that resolves with an XRHitTestSource object that can be passed to XRFrame.getHitTestResults().", "parameters": { "options": "An object containing configuration options, specifically:\n

    \n
    space
    \n
    \n

    The XRSpace that will be tracked by the hit test source.\n

    \n
    entityTypes Optional
    \n
    \n

    An Array specifying the types of entities to be used for hit test source creation. If no entity type is specified, the array defaults to a single element with the plane type. Possible types:\n

      \n
    • point: Compute hit test results based on characteristic points detected.
    • \n
    • plane: Compute hit test results based on real-world planes detected.
    • \n
    • mesh: Compute hit test results based on meshes detected.
    • \n
    \n
    \n
    offsetRay Optional
    \n
    \n

    The XRRay object that will be used to perform hit test. If no XRRay object has been provided, a new XRRay object is constructed without any parameters.\n

    \n
    " }, @@ -23342,7 +23422,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestHitTestSourceForTransientInput() method of the\nXRSession interface returns a Promise that resolves with an XRTransientInputHitTestSource object that can be passed to XRFrame.getHitTestResultsForTransientInput().", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestHitTestSourceForTransientInput() method of the\nXRSession interface returns a Promise that resolves with an XRTransientInputHitTestSource object that can be passed to XRFrame.getHitTestResultsForTransientInput().", "parameters": { "options": "An object containing configuration options, specifically:\n

    \n
    profile
    \n
    \n

    A string specifying the input profile name of the transient input source that will be used to compute hit test results.\n

    \n
    entityTypes Optional
    \n
    \n

    An Array specifying the types of entities to be used for hit test source creation. If no entity type is specified, the array defaults to a single element with the plane type. Possible types:\n

      \n
    • point: Compute hit test results based on characteristic points detected.
    • \n
    • plane: Compute hit test results based on real-world planes detected.
    • \n
    • mesh: Compute hit test results based on meshes detected.
    • \n
    \n
    \n
    offsetRay Optional
    \n
    \n

    The XRRay object that will be used to perform hit test. If no XRRay object has been provided, a new XRRay object is constructed without any parameters.\n

    \n
    " }, @@ -23368,7 +23448,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestLightProbe() method of the\nXRSession interface returns a Promise that resolves with an XRLightProbe object that estimates lighting information at a given point in the user's environment.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestLightProbe() method of the\nXRSession interface returns a Promise that resolves with an XRLightProbe object that estimates lighting information at a given point in the user's environment.", "parameters": { "options": "An object containing configuration options, specifically:\n

    \n
    reflectionFormat
    \n
    \n

    The internal reflection format indicating how the texture data is represented, either srgba8 (default value) or rgba16f. See also XRSession.preferredReflectionFormat.\n

    \n
    " }, @@ -23393,7 +23473,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestReferenceSpace() method of the\nXRSession interface returns a promise that resolves with\nan instance of either XRReferenceSpace\nor XRBoundedReferenceSpace as appropriate given the type of reference\nspace requested.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestReferenceSpace() method of the\nXRSession interface returns a promise that resolves with\nan instance of either XRReferenceSpace\nor XRBoundedReferenceSpace as appropriate given the type of reference\nspace requested.", "parameters": { "type": "A string specifying the type of reference space for which an instance is to be returned.\nThe string must be one of the values below." }, @@ -23417,7 +23497,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The updateRenderState() method of the XRSession interface of the WebXR API schedules changes to be applied to the active render state (XRRenderState) prior to rendering of the next frame.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The updateRenderState() method of the XRSession interface of the WebXR API schedules changes to be applied to the active render state (XRRenderState) prior to rendering of the next frame.", "parameters": { "state": "An optional object to configure the XRRenderState. If none is provided, a default configuration will be used.\n

    " }, @@ -23443,7 +23523,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only visibilityState property of the\nXRSession interface is a string indicating whether the WebXR content is\ncurrently visible to the user, and if it is, whether it's the primary focus.\n

    Every time the visibility state changes, a\nvisibilitychange event is fired on the\nXRSession object." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only visibilityState property of the\nXRSession interface is a string indicating whether the WebXR content is\ncurrently visible to the user, and if it is, whether it's the primary focus.\n

    Every time the visibility state changes, a\nvisibilitychange event is fired on the\nXRSession object." }, "xrsessionevent": { "url": "$MDN_URL$/web/api/xrsessionevent", @@ -23459,7 +23539,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRSessionEvent interface describes an event which indicates the change of the state of an XRSession. These events occur, for example, when the session ends or the visibility of its context changes." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRSessionEvent interface describes an event which indicates the change of the state of an XRSession. These events occur, for example, when the session ends or the visibility of its context changes." }, "xrsessionevent.session": { "url": "$MDN_URL$/web/api/xrsessionevent/session", @@ -23475,7 +23555,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRSessionEvent interface's\nsession property indicates which\nXRSession the event is about." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRSessionEvent interface's\nsession property indicates which\nXRSession the event is about." }, "xrsessionevent.xrsessionevent": { "url": "$MDN_URL$/web/api/xrsessionevent/xrsessionevent", @@ -23491,7 +23571,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's\nXRSessionEvent() constructor creates and returns a new\nXRSessionEvent object. These objects represent events announcing\nstate changes in an XRSession representing an augmented or virtual\nreality session.", + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's\nXRSessionEvent() constructor creates and returns a new\nXRSessionEvent object. These objects represent events announcing\nstate changes in an XRSession representing an augmented or virtual\nreality session.", "parameters": { "type": "A string with the name of the event.\nIt is case-sensitive and browsers set it to end or visibilitychange.", "options": "An object that, in addition of the properties defined in Event(), can have the following properties:\n

    \n
    session
    \n
    \n

    The XRSession to which the event is to be delivered.\n

    \n
    " @@ -23512,7 +23592,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    Numeric values such as pose positions are thus coordinates in the corresponding XRSpace, relative to that space's origin.\n

    \n

    Note:\nThe 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.\n

    " + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    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.\n

    Numeric values such as pose positions are thus coordinates in the corresponding XRSpace, relative to that space's origin.\n

    \n

    Note:\nThe 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.\n

    " }, "xrsubimage": { "url": "$MDN_URL$/web/api/xrsubimage", @@ -23524,7 +23604,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRSubImage interface of the WebXR Device API represents what viewport of the GPU texture to use for rendering." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRSubImage interface of the WebXR Device API represents what viewport of the GPU texture to use for rendering." }, "xrsubimage.viewport": { "url": "$MDN_URL$/web/api/xrsubimage/viewport", @@ -23553,7 +23633,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API interface XRSystem provides methods which let you get access to an XRSession object representing a WebXR session. With that XRSession in hand, you can use it to interact with the Augmented Reality (AR) or Virtual Reality (VR) device." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API interface XRSystem provides methods which let you get access to an XRSession object representing a WebXR session. With that XRSession in hand, you can use it to interact with the Augmented Reality (AR) or Virtual Reality (VR) device." }, "xrsystem.issessionsupported": { "url": "$MDN_URL$/web/api/xrsystem/issessionsupported", @@ -23570,7 +23650,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSystem method\nisSessionSupported() returns a promise which resolves to\ntrue if the specified WebXR session mode is supported by the user's WebXR\ndevice. Otherwise, the promise resolves with false.\n

    If no devices are available or the browser doesn't have permission\nto use the XR device, the promise is rejected with an appropriate\nDOMException.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSystem method\nisSessionSupported() returns a promise which resolves to\ntrue if the specified WebXR session mode is supported by the user's WebXR\ndevice. Otherwise, the promise resolves with false.\n

    If no devices are available or the browser doesn't have permission\nto use the XR device, the promise is rejected with an appropriate\nDOMException.", "parameters": { "mode": "A String specifying the WebXR session mode for which support is to\nbe checked. Possible modes to check for:\n

    " }, @@ -23594,7 +23674,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSystem interface's\nrequestSession() method returns a promise\nwhich resolves to an XRSession object through which you can manage the\nrequested type of WebXR session.\n

    While only one immersive VR session can be active at a time, multiple\ninline sessions can be in progress at once.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRSystem interface's\nrequestSession() method returns a promise\nwhich resolves to an XRSession object through which you can manage the\nrequested type of WebXR session.\n

    While only one immersive VR session can be active at a time, multiple\ninline sessions can be in progress at once.", "parameters": { "mode": "A String defining the XR session mode. The supported modes are:\n

    ", "options": "An object to configure the XRSession. If none are included, the device will use a default feature configuration for all options.\n" @@ -23621,7 +23701,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRTransientInputHitTestResult interface of the WebXR Device API contains an array of results of a hit test for transient input, grouped by input source.\n

    You can get an array of XRHitTestResult objects for a frame by calling XRFrame.getHitTestResultsForTransientInput()." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRTransientInputHitTestResult interface of the WebXR Device API contains an array of results of a hit test for transient input, grouped by input source.\n

    You can get an array of XRHitTestResult objects for a frame by calling XRFrame.getHitTestResultsForTransientInput()." }, "xrtransientinputhittestresult.inputsource": { "url": "$MDN_URL$/web/api/xrtransientinputhittestresult/inputsource", @@ -23638,7 +23718,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inputSource property of the XRTransientInputHitTestResult interface represents an XRInputSource object that was used to compute the results array." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only inputSource property of the XRTransientInputHitTestResult interface represents an XRInputSource object that was used to compute the results array." }, "xrtransientinputhittestresult.results": { "url": "$MDN_URL$/web/api/xrtransientinputhittestresult/results", @@ -23655,7 +23735,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only results property of the XRTransientInputHitTestResult interface represents an array of XRHitTestResult objects containing the hit test results for the input source, ordered by the distance along the ray used to perform the hit test, with the closest result at position 0." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only results property of the XRTransientInputHitTestResult interface represents an array of XRHitTestResult objects containing the hit test results for the input source, ordered by the distance along the ray used to perform the hit test, with the closest result at position 0." }, "xrtransientinputhittestsource": { "url": "$MDN_URL$/web/api/xrtransientinputhittestsource", @@ -23672,7 +23752,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRTransientInputHitTestSource interface of the WebXR Device API handles transient input hit test subscriptions. You can get an XRTransientInputHitTestSource object by calling the XRSession.requestHitTestSourceForTransientInput().\n

    This object doesn't itself contain transient input hit test results, but it is used to compute hit tests for each XRFrame by calling XRFrame.getHitTestResultsForTransientInput(), which returns XRTransientInputHitTestResult objects." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRTransientInputHitTestSource interface of the WebXR Device API handles transient input hit test subscriptions. You can get an XRTransientInputHitTestSource object by calling the XRSession.requestHitTestSourceForTransientInput().\n

    This object doesn't itself contain transient input hit test results, but it is used to compute hit tests for each XRFrame by calling XRFrame.getHitTestResultsForTransientInput(), which returns XRTransientInputHitTestResult objects." }, "xrtransientinputhittestsource.cancel": { "url": "$MDN_URL$/web/api/xrtransientinputhittestsource/cancel", @@ -23689,7 +23769,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancel() method of the XRTransientInputHitTestSource interface unsubscribes a transient input hit test.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The cancel() method of the XRTransientInputHitTestSource interface unsubscribes a transient input hit test.", "returns": "None (undefined)." }, "xrview": { @@ -23707,7 +23787,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API's XRView interface describes a single view into the XR scene for a specific frame, providing orientation and position information for the viewpoint. You can think of it as a description of a specific eye or camera and how it views the world. A 3D frame will involve two views, one for each eye, separated by an appropriate distance which approximates the distance between the viewer's eyes. This allows the two views, when projected in isolation into the appropriate eyes, to simulate a 3D world." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The WebXR Device API's XRView interface describes a single view into the XR scene for a specific frame, providing orientation and position information for the viewpoint. You can think of it as a description of a specific eye or camera and how it views the world. A 3D frame will involve two views, one for each eye, separated by an appropriate distance which approximates the distance between the viewer's eyes. This allows the two views, when projected in isolation into the appropriate eyes, to simulate a 3D world." }, "xrview.eye": { "url": "$MDN_URL$/web/api/xrview/eye", @@ -23724,7 +23804,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only eye\nproperty is a string indicating which eye's viewpoint the XRView represents: left or\nright. For views which represent neither eye, such as monoscopic views,\nthis property's value is none." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only eye\nproperty is a string indicating which eye's viewpoint the XRView represents: left or\nright. For views which represent neither eye, such as monoscopic views,\nthis property's value is none." }, "xrview.isfirstpersonobserver": { "url": "$MDN_URL$/web/api/xrview/isfirstpersonobserver", @@ -23741,7 +23821,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only isFirstPersonObserver property is a boolean indicating if the XRView is a first-person observer view.\n

    To create video recordings of AR device cameras, you can't simply use one of the rendered eyes, as there often will be a physical offset. Some devices expose a secondary view, the first-person observer view, which has an eye of none.\n

    To receive a first-person observer view, you need to enable the \"secondary-views\" feature descriptor explicitly (typically as an optional feature). See XRSystem.requestSession() for details.\n

    The isFirstPersonObserver property then allows you to check which secondary view is a first-person observer view." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only isFirstPersonObserver property is a boolean indicating if the XRView is a first-person observer view.\n

    To create video recordings of AR device cameras, you can't simply use one of the rendered eyes, as there often will be a physical offset. Some devices expose a secondary view, the first-person observer view, which has an eye of none.\n

    To receive a first-person observer view, you need to enable the \"secondary-views\" feature descriptor explicitly (typically as an optional feature). See XRSystem.requestSession() for details.\n

    The isFirstPersonObserver property then allows you to check which secondary view is a first-person observer view." }, "xrview.projectionmatrix": { "url": "$MDN_URL$/web/api/xrview/projectionmatrix", @@ -23758,7 +23838,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only\nprojectionMatrix property specifies the projection matrix\nto apply to the underlying view. This should be used to integrate perspective to\neverything in the scene, in order to ensure the result is consistent with what the eye\nexpects to see.\n

    \n

    Note:\nFailure to apply proper perspective, or inconsistencies\nin perspective, may result in possibly serious user discomfort or distress.\n

    " + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRView interface's read-only\nprojectionMatrix property specifies the projection matrix\nto apply to the underlying view. This should be used to integrate perspective to\neverything in the scene, in order to ensure the result is consistent with what the eye\nexpects to see.\n

    \n

    Note:\nFailure to apply proper perspective, or inconsistencies\nin perspective, may result in possibly serious user discomfort or distress.\n

    " }, "xrview.recommendedviewportscale": { "url": "$MDN_URL$/web/api/xrview/recommendedviewportscale", @@ -23775,7 +23855,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only recommendedViewportScale property of the XRView interface is the recommended viewport scale value that you can use for XRView.requestViewportScale() if the user agent has such a recommendation; null otherwise." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only recommendedViewportScale property of the XRView interface is the recommended viewport scale value that you can use for XRView.requestViewportScale() if the user agent has such a recommendation; null otherwise." }, "xrview.requestviewportscale": { "url": "$MDN_URL$/web/api/xrview/requestviewportscale", @@ -23792,7 +23872,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestViewportScale() method of the XRView interface requests that the user agent sets the requested viewport scale for this viewport to the given value. This is used for dynamic viewport scaling which allows rendering to a subset of the WebXR viewport using a scale factor that can be changed every animation frame.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The requestViewportScale() method of the XRView interface requests that the user agent sets the requested viewport scale for this viewport to the given value. This is used for dynamic viewport scaling which allows rendering to a subset of the WebXR viewport using a scale factor that can be changed every animation frame.", "parameters": { "scale": "A number greater than 0.0 and less than or equal to 1.0 representing the scale factor." }, @@ -23813,7 +23893,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only transform property of the\nXRView interface is an XRRigidTransform object which\nprovides the position and orientation of the viewpoint relative to the\nXRReferenceSpace specified when the\nXRFrame.getViewerPose() method was called to obtain the view object.\n

    With the transform, you can then position the view as a camera within the\n3D scene. If you instead need the more traditional view matrix, you can get using\nview.transform.inverse.matrix; this gets the underlying\nmatrix of the transform's\ninverse." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only transform property of the\nXRView interface is an XRRigidTransform object which\nprovides the position and orientation of the viewpoint relative to the\nXRReferenceSpace specified when the\nXRFrame.getViewerPose() method was called to obtain the view object.\n

    With the transform, you can then position the view as a camera within the\n3D scene. If you instead need the more traditional view matrix, you can get using\nview.transform.inverse.matrix; this gets the underlying\nmatrix of the transform's\ninverse." }, "xrviewerpose": { "url": "$MDN_URL$/web/api/xrviewerpose", @@ -23829,7 +23909,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRViewerPose represents the pose (the position and orientation) of a viewer's point of view on the scene. Each XRViewerPose can have multiple views to represent, for example, the slight separation between the left and right eye.\n

    This view can represent anything from the point-of-view of a user's XR headset to the viewpoint represented by a player's movement of an avatar using mouse and keyboard, presented on the screen, to a virtual camera capturing the scene for a spectator." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API interface XRViewerPose represents the pose (the position and orientation) of a viewer's point of view on the scene. Each XRViewerPose can have multiple views to represent, for example, the slight separation between the left and right eye.\n

    This view can represent anything from the point-of-view of a user's XR headset to the viewpoint represented by a player's movement of an avatar using mouse and keyboard, presented on the screen, to a virtual camera capturing the scene for a spectator." }, "xrviewerpose.views": { "url": "$MDN_URL$/web/api/xrviewerpose/views", @@ -23845,7 +23925,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewerPose property views\nreturns an array which contains every XRView which must be rendered in\norder to fully represent the scene from the viewpoint defined by the viewer pose. For\nmonoscopic devices, this array contains a single view.\n

    \n

    Warning:\nThere is no guarantee that the number of views will\nremain constant over the lifetime of an XRSession. For each frame, you\nshould always use the current length of this array rather than caching the value.\n

    \n

    Stereo views require two views to render properly, with the left eye's view having its\neye set to the string left and the right eye's\nview a value of right." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewerPose property views\nreturns an array which contains every XRView which must be rendered in\norder to fully represent the scene from the viewpoint defined by the viewer pose. For\nmonoscopic devices, this array contains a single view.\n

    \n

    Warning:\nThere is no guarantee that the number of views will\nremain constant over the lifetime of an XRSession. For each frame, you\nshould always use the current length of this array rather than caching the value.\n

    \n

    Stereo views require two views to render properly, with the left eye's view having its\neye set to the string left and the right eye's\nview a value of right." }, "xrviewport": { "url": "$MDN_URL$/web/api/xrviewport", @@ -23861,7 +23941,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRViewport interface provides properties used to describe the size and position of the current viewport within the XRWebGLLayer being used to render the 3D scene." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API's XRViewport interface provides properties used to describe the size and position of the current viewport within the XRWebGLLayer being used to render the 3D scene." }, "xrviewport.height": { "url": "$MDN_URL$/web/api/xrviewport/height", @@ -23877,7 +23957,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport property\nheight specifies the height, in pixels, of the viewport\nonto the drawing surface within which the WebXR view is to be rendered. Along\nwith width and the origin point given by\nx and y, this defines the\narea within which rendered content will be drawn." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport property\nheight specifies the height, in pixels, of the viewport\nonto the drawing surface within which the WebXR view is to be rendered. Along\nwith width and the origin point given by\nx and y, this defines the\narea within which rendered content will be drawn." }, "xrviewport.width": { "url": "$MDN_URL$/web/api/xrviewport/width", @@ -23893,7 +23973,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport property\nwidth specifies the width of the viewport, in pixels,\nonto the drawing surface the 3D scene is to be rendered into. This is defined\nusing this property along with the viewport's height\nand its origin given by its properties x and\ny." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport property\nwidth specifies the width of the viewport, in pixels,\nonto the drawing surface the 3D scene is to be rendered into. This is defined\nusing this property along with the viewport's height\nand its origin given by its properties x and\ny." }, "xrviewport.x": { "url": "$MDN_URL$/web/api/xrviewport/x", @@ -23909,7 +23989,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport interface's\nx property indicates the offset from the left edge of\nthe destination surface (typically a XRWebGLLayer) to the left edge of\nthe viewport within the surface into which WebXR content is to be rendered. The\nviewport's y property identifies the y\ncomponent of the origin, and its is given by the width\nand height properties." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport interface's\nx property indicates the offset from the left edge of\nthe destination surface (typically a XRWebGLLayer) to the left edge of\nthe viewport within the surface into which WebXR content is to be rendered. The\nviewport's y property identifies the y\ncomponent of the origin, and its is given by the width\nand height properties." }, "xrviewport.y": { "url": "$MDN_URL$/web/api/xrviewport/y", @@ -23925,7 +24005,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport interface's\ny property indicates the offset from the bottom edge of\nthe destination surface (typically a XRWebGLLayer) to the bottom edge of\nthe viewport within the surface into which WebXR content is to be rendered. The\nviewport's x property identifies the x\ncomponent of the origin, and its is given by the width\nand height properties." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRViewport interface's\ny property indicates the offset from the bottom edge of\nthe destination surface (typically a XRWebGLLayer) to the bottom edge of\nthe viewport within the surface into which WebXR content is to be rendered. The\nviewport's x property identifies the x\ncomponent of the origin, and its is given by the width\nand height properties." }, "xrwebglbinding": { "url": "$MDN_URL$/web/api/xrwebglbinding", @@ -23942,7 +24022,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLBinding interface is used to create layers that have a GPU backend." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLBinding interface is used to create layers that have a GPU backend." }, "xrwebglbinding.createcubelayer": { "url": "$MDN_URL$/web/api/xrwebglbinding/createcubelayer", @@ -24004,7 +24084,7 @@ }, "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The createProjectionLayer() method of the XRWebGLBinding interface returns an XRProjectionLayer object which is a layer that fills the entire view of the observer and is refreshed close to the device's native frame rate.", "parameters": { - "options": "An object to configure the XRProjectionLayer.\n

    \n
    textureType Optional
    \n
    \n

    An string defining the type of texture the layer will have. Possible values:\n

    \n
    texture
    \n
    \n

    The textures of XRWebGLSubImage will be of type gl.TEXTURE_2D.\n

    \n
    texture-array
    \n
    \n

    The textures of XRWebGLSubImage will be of type gl.TEXTURE_2D_ARRAY (WebGL 2 contexts only).\nThe default value is texture.\n

    \n
    \n
    \n
    colorFormat Optional
    \n
    \n

    A GLenum defining the data type of the color texture data. Possible values:\n

      \n
    • gl.RGB
    • \n
    • gl.RGBA\nAdditionally, for contexts with the EXT_sRGB extension enabled:
    • \n
    • ext.SRGB_EXT
    • \n
    • ext.SRGB_ALPHA_EXT\nAdditionally, for WebGL2RenderingContext contexts:
    • \n
    • gl.RGBA8
    • \n
    • gl.RGB8
    • \n
    • gl.SRGB8
    • \n
    • gl.RGB8_ALPHA8\nThe default value is gl.RGBA.
    • \n
    \n
    \n
    depthFormat Optional
    \n
    \n

    A GLenum defining the data type of the depth texture data or 0 indicating that the layer should not provide a depth texture. (In that case XRProjectionLayer.ignoreDepthValues will be true.)\nPossible values within WebGLRenderingContext contexts with the WEBGL_depth_texture extension enabled, or within WebGL2RenderingContext contexts (no extension required):\n

      \n
    • gl.DEPTH_COMPONENT
    • \n
    • gl.DEPTH_STENCIL\nAdditionally, for WebGL2RenderingContext contexts:
    • \n
    • gl.DEPTH_COMPONENT24
    • \n
    • gl.DEPTH24_STENCIL24\nThe default value is gl.DEPTH_COMPONENT.
    • \n
    \n
    \n
    scaleFactor Optional
    \n
    \n

    A floating-point value which is used to scale the layer during compositing. A value of 1.0 represents the default pixel size for the frame buffer. (See also XRWebGLLayer.getNativeFramebufferScaleFactor().) Unlike other layers, the XRProjectionLayer can't be created with an explicit pixel width and height, because the size is inferred by the hardware. (Projection layers fill the observer's entire view.)\n

    \n
    " + "options": "An object to configure the XRProjectionLayer.\n
    \n
    textureType Optional
    \n
    \n

    A string defining the type of texture the layer will have. Possible values:\n

    \n
    texture
    \n
    \n

    The textures of XRWebGLSubImage will be of type gl.TEXTURE_2D.\n

    \n
    texture-array
    \n
    \n

    The textures of XRWebGLSubImage will be of type gl.TEXTURE_2D_ARRAY (WebGL 2 contexts only).\nThe default value is texture.\n

    \n
    \n
    \n
    colorFormat Optional
    \n
    \n

    A GLenum defining the data type of the color texture data. Possible values:\n

      \n
    • gl.RGB
    • \n
    • gl.RGBA\nAdditionally, for contexts with the EXT_sRGB extension enabled:
    • \n
    • ext.SRGB_EXT
    • \n
    • ext.SRGB_ALPHA_EXT\nAdditionally, for WebGL2RenderingContext contexts:
    • \n
    • gl.RGBA8
    • \n
    • gl.RGB8
    • \n
    • gl.SRGB8
    • \n
    • gl.RGB8_ALPHA8\nThe default value is gl.RGBA.
    • \n
    \n
    \n
    depthFormat Optional
    \n
    \n

    A GLenum defining the data type of the depth texture data or 0 indicating that the layer should not provide a depth texture. (In that case XRProjectionLayer.ignoreDepthValues will be true.)\nPossible values within WebGLRenderingContext contexts with the WEBGL_depth_texture extension enabled, or within WebGL2RenderingContext contexts (no extension required):\n

      \n
    • gl.DEPTH_COMPONENT
    • \n
    • gl.DEPTH_STENCIL\nAdditionally, for WebGL2RenderingContext contexts:
    • \n
    • gl.DEPTH_COMPONENT24
    • \n
    • gl.DEPTH24_STENCIL24\nThe default value is gl.DEPTH_COMPONENT.
    • \n
    \n
    \n
    scaleFactor Optional
    \n
    \n

    A floating-point value which is used to scale the layer during compositing. A value of 1.0 represents the default pixel size for the frame buffer. (See also XRWebGLLayer.getNativeFramebufferScaleFactor().) Unlike other layers, the XRProjectionLayer can't be created with an explicit pixel width and height, because the size is inferred by the hardware. (Projection layers fill the observer's entire view.)\n

    \n
    " }, "returns": "An XRProjectionLayer object." }, @@ -24157,7 +24237,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLDepthInformation interface contains depth information from the GPU/WebGL (returned by XRWebGLBinding.getDepthInformation()).\n

    This interface inherits properties from its parent, XRDepthInformation." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLDepthInformation interface contains depth information from the GPU/WebGL (returned by XRWebGLBinding.getDepthInformation()).\n

    This interface inherits properties from its parent, XRDepthInformation." }, "xrwebgldepthinformation.texture": { "url": "$MDN_URL$/web/api/xrwebgldepthinformation/texture", @@ -24191,7 +24271,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLLayer interface of the WebXR Device API provides a linkage between the WebXR device (or simulated XR device, in the case of an inline session) and a WebGL context used to render the scene for display on the device. In particular, it provides access to the WebGL framebuffer and viewport to ease access to the context.\n

    Although XRWebGLLayer is currently the only type of framebuffer layer supported by WebGL, it's entirely possible that future updates to the WebXR specification may allow for other layer types and corresponding image sources." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLLayer interface of the WebXR Device API provides a linkage between the WebXR device (or simulated XR device, in the case of an inline session) and a WebGL context used to render the scene for display on the device. In particular, it provides access to the WebGL framebuffer and viewport to ease access to the context.\n

    Although XRWebGLLayer is currently the only type of framebuffer layer supported by WebGL, it's entirely possible that future updates to the WebXR specification may allow for other layer types and corresponding image sources." }, "xrwebgllayer.antialias": { "url": "$MDN_URL$/web/api/xrwebgllayer/antialias", @@ -24208,7 +24288,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nantialias is a Boolean value which is true\nif the rendering layer's frame buffer supports anti-aliasing. Otherwise, this\nproperty's value is false. The specific anti-aliasing technique used is left\nto the user agent's discretion and cannot be specified by\nthe website or web app." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nantialias is a Boolean value which is true\nif the rendering layer's frame buffer supports anti-aliasing. Otherwise, this\nproperty's value is false. The specific anti-aliasing technique used is left\nto the user agent's discretion and cannot be specified by\nthe website or web app." }, "xrwebgllayer.fixedfoveation": { "url": "$MDN_URL$/web/api/xrwebgllayer/fixedfoveation", @@ -24220,7 +24300,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fixedFoveation property of the XRWebGLLayer interface is a number indicating the amount of foveation used by the XR compositor. Fixed Foveated Rendering (FFR) renders the edges of the eye textures at a lower resolution than the center and reduces the GPU load.\n

    It is most useful for low contrast textures, such as background images but less for high contrast ones such as text or detailed images. Authors can adjust the level on a per frame basis to achieve the best tradeoff between performance and visual quality." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The fixedFoveation property of the XRWebGLLayer interface is a number indicating the amount of foveation used by the XR compositor. Fixed Foveated Rendering (FFR) renders the edges of the eye textures at a lower resolution than the center and reduces the GPU load.\n

    It is most useful for low contrast textures, such as background images but less for high contrast ones such as text or detailed images. Authors can adjust the level on a per frame basis to achieve the best tradeoff between performance and visual quality." }, "xrwebgllayer.framebuffer": { "url": "$MDN_URL$/web/api/xrwebgllayer/framebuffer", @@ -24237,7 +24317,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebuffer is an opaque WebGLFramebuffer\nwhich is used to buffer the rendered image if the XR compositor is being used. Otherwise, this property's value is\nnull. The opaque framebuffer is functionally nearly the same as a\nstandard WebGL framebuffer, except for the differences covered in the section\nHow opaque framebuffers are special below." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebuffer is an opaque WebGLFramebuffer\nwhich is used to buffer the rendered image if the XR compositor is being used. Otherwise, this property's value is\nnull. The opaque framebuffer is functionally nearly the same as a\nstandard WebGL framebuffer, except for the differences covered in the section\nHow opaque framebuffers are special below." }, "xrwebgllayer.framebufferheight": { "url": "$MDN_URL$/web/api/xrwebgllayer/framebufferheight", @@ -24254,7 +24334,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebufferHeight indicates the height of the\nframebuffer, in pixels.\n

    You can get the width of the framebuffer using the\nframebufferWidth property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebufferHeight indicates the height of the\nframebuffer, in pixels.\n

    You can get the width of the framebuffer using the\nframebufferWidth property." }, "xrwebgllayer.framebufferwidth": { "url": "$MDN_URL$/web/api/xrwebgllayer/framebufferwidth", @@ -24271,7 +24351,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebufferWidth specifies the width of the framebuffer,\nin pixels.\n

    You can get the height of the framebuffer using the\nframebufferHeight property." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nframebufferWidth specifies the width of the framebuffer,\nin pixels.\n

    You can get the height of the framebuffer using the\nframebufferHeight property." }, "xrwebgllayer.getnativeframebufferscalefactor": { "url": "$MDN_URL$/web/api/xrwebgllayer/getnativeframebufferscalefactor_static", @@ -24288,7 +24368,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static method\nXRWebGLLayer.getNativeFramebufferScaleFactor() returns a\nfloating-point scaling factor by which one can multiply the specified\nXRSession's resolution to get the native resolution of the WebXR\ndevice's frame buffer.\n

    This information can be used when creating a new XRWebGLLayer to configure\nthe framebufferScaleFactor in the layerInit configuration object\nspecified when calling the XRWebGLLayer() constructor. See the\nUsage notes and Examples for details.\n

    If the scaling factor is 1.0, then the frame buffer pixels and the native display\npixels are the same size. If the scaling factor is greater than zero, then the frame\nbuffer is smaller than the display's native dimensions, resulting in the output being\nup-scaled for display to the screen after rendering into the frame buffer. If the\nscaling factor is less than zero, the frame buffer is larger than the native\nresolution of the display, resulting in the frame buffer's contents being scaled down\nfor display to the XR device. This can happen for display environments which use\nsuperscaling or anti-aliasing techniques to improve perceived image quality.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The static method\nXRWebGLLayer.getNativeFramebufferScaleFactor() returns a\nfloating-point scaling factor by which one can multiply the specified\nXRSession's resolution to get the native resolution of the WebXR\ndevice's frame buffer.\n

    This information can be used when creating a new XRWebGLLayer to configure\nthe framebufferScaleFactor in the layerInit configuration object\nspecified when calling the XRWebGLLayer() constructor. See the\nUsage notes and Examples for details.\n

    If the scaling factor is 1.0, then the frame buffer pixels and the native display\npixels are the same size. If the scaling factor is greater than zero, then the frame\nbuffer is smaller than the display's native dimensions, resulting in the output being\nup-scaled for display to the screen after rendering into the frame buffer. If the\nscaling factor is less than zero, the frame buffer is larger than the native\nresolution of the display, resulting in the frame buffer's contents being scaled down\nfor display to the XR device. This can happen for display environments which use\nsuperscaling or anti-aliasing techniques to improve perceived image quality.", "parameters": { "session": "The XRSession for which to return the native framebuffer scaling\nfactor." }, @@ -24309,7 +24389,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRWebGLLayer interface's\ngetViewport() method returns the\nXRViewport that should be used to render the specified\nXRView into the WebGL layer. For WebXR devices which use a\nsingle framebuffer for both the left and right eyes, the returned viewport represents\nthe region of the framebuffer into which the scene should be rendered for the eye\nrepresented by the view.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The XRWebGLLayer interface's\ngetViewport() method returns the\nXRViewport that should be used to render the specified\nXRView into the WebGL layer. For WebXR devices which use a\nsingle framebuffer for both the left and right eyes, the returned viewport represents\nthe region of the framebuffer into which the scene should be rendered for the eye\nrepresented by the view.", "parameters": { "view": "An XRView object indicating the view for which the viewport is to be\nreturned." }, @@ -24333,7 +24413,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nignoreDepthValues is a Boolean value which is\ntrue if the session has been configured to ignore the values in the depth\nbuffer while rendering the scene. If the depth buffer is being used to determine the\nposition of vertices, this property is false.\n

    The value of ignoreDepthValues can only be set when the\nXRWebGLLayer is instantiated, by setting the corresponding value in the constructor's options parameter." + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The read-only XRWebGLLayer property\nignoreDepthValues is a Boolean value which is\ntrue if the session has been configured to ignore the values in the depth\nbuffer while rendering the scene. If the depth buffer is being used to determine the\nposition of vertices, this property is false.\n

    The value of ignoreDepthValues can only be set when the\nXRWebGLLayer is instantiated, by setting the corresponding value in the constructor's options parameter." }, "xrwebgllayer.xrwebgllayer": { "url": "$MDN_URL$/web/api/xrwebgllayer/xrwebgllayer", @@ -24350,7 +24430,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API XRWebGLLayer() constructor creates and\nreturns a new XRWebGLLayer object, providing the linkage between the\nWebXR device and the WebGL graphics layer used to render the 3D scene.", + "doc": "

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    The WebXR Device API XRWebGLLayer() constructor creates and\nreturns a new XRWebGLLayer object, providing the linkage between the\nWebXR device and the WebGL graphics layer used to render the 3D scene.", "parameters": { "session": "An XRSession object specifying the WebXR session which will be\nrendered using the WebGL context.", "context": "A WebGLRenderingContext or WebGL2RenderingContext\nidentifying the WebGL drawing context to use for rendering the scene for the specified\nWebXR session.", @@ -24372,7 +24452,7 @@ "baseline": { "level": "NONE" }, - "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLSubImage interface is used during rendering of WebGL layers." + "doc": "

    Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

    \n

    Experimental: This is an experimental technology
    Check the Browser compatibility table carefully before using this in production.

    \n

    The XRWebGLSubImage interface is used during rendering of WebGL layers." }, "xrwebglsubimage.colortexture": { "url": "$MDN_URL$/web/api/xrwebglsubimage/colortexture",