diff --git a/source b/source index 7934d736e89..db5b4d1ff0a 100644 --- a/source +++ b/source @@ -6964,93 +6964,26 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute -

Colors

- -

A simple color consists of three 8-bit numbers in the - range 0 to 255, inclusive, representing the red, green, and blue components of the color - respectively, in the 'srgb' color space.

- -

A string is a valid simple color if it is - exactly seven characters long, and the first character is a U+0023 NUMBER SIGN character (#), and - the remaining six characters are all ASCII hex digits, with the first two digits - representing the red component, the middle two digits representing the green component, and the - last two digits representing the blue component, in hexadecimal.

- -

A string is a valid lowercase simple - color if it is a valid simple color and doesn't use any characters in the range - U+0041 LATIN CAPITAL LETTER A to U+0046 LATIN CAPITAL LETTER F.

-
-

The rules for parsing simple color - values are as given in the following algorithm. When invoked, the steps must be followed in - the order given, aborting at the first step that returns a value. This algorithm will return - either a simple color or an error.

- -
    -
  1. Let input be the string being parsed.

  2. - -
  3. If input is not exactly seven characters long, then return an - error.

  4. - -
  5. If the first character in input is not a U+0023 NUMBER SIGN character - (#), then return an error.

  6. - -
  7. If the last six characters of input are not all ASCII hex - digits, then return an error.

  8. - -
  9. Let result be a simple color.

    - -
  10. Interpret the second and third characters as a hexadecimal number and let the result be - the red component of result.

    - -
  11. Interpret the fourth and fifth characters as a hexadecimal number and let the result be - the green component of result.

    - -
  12. Interpret the sixth and seventh characters as a hexadecimal number and let the result be - the blue component of result.

    - -
  13. Return result.

    -
+

Legacy colors

-

The rules for serializing - simple color values given a simple color are as given in the following - algorithm:

- -
    -
  1. Let result be a string consisting of a single U+0023 NUMBER SIGN - character (#).

  2. - -
  3. Convert the red, green, and blue components in turn to two-digit hexadecimal numbers using - ASCII lower hex digits, zero-padding if necessary, - and append these numbers to result, in the order red, green, blue.

    - -
  4. Return result, which will be a valid lowercase simple - color.

  5. -
- -
- -

Some obsolete legacy attributes parse colors in a more complicated manner, using the +

Some obsolete legacy attributes parse colors using the rules for parsing a legacy color - value, which are given in the following algorithm. When invoked, the steps must be followed - in the order given, aborting at the first step that returns a value. This algorithm will return - either a simple color or an error.

+ value, given a string input. They will return either a CSS color or failure.

    -
  1. Let input be the string being parsed.

  2. - -
  3. If input is the empty string, then return an error.

  4. +
  5. If input is the empty string, then return failure.

  6. Strip leading and trailing ASCII whitespace from input.

  7. -
  8. If input is an ASCII case-insensitive match for the - string "transparent", then return an error.

  9. +
  10. If input is an ASCII case-insensitive match for "transparent", then return failure.

  11. -

    If input is an ASCII case-insensitive match for one of the - named colors, then return the simple color - corresponding to that keyword. CSSCOLOR

    +

    If input is an ASCII case-insensitive match for one of the named colors, then return the CSS color corresponding to that + keyword. CSSCOLOR

    CSS2 System @@ -7063,7 +6996,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute ASCII hex digits, then:

      -
    1. Let result be a simple color.

      +
    2. Let result be a CSS color.

    3. Interpret the second character of input as a hexadecimal digit; let the red component of result be the resulting number multiplied by 17.

      @@ -7079,20 +7012,19 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
    4. Replace any code points greater than U+FFFF in - input (i.e., any characters that are not in the basic multilingual plane) with the - two-character string "00".

    5. + input (i.e., any characters that are not in the basic multilingual plane) with "00".

    6. If input's code point length is greater than 128, truncate input, leaving only the first 128 characters.

    7. -
    8. If the first character in input is a U+0023 NUMBER SIGN character (#), - remove it.

    9. +
    10. If the first character in input is U+0023 (#), then remove it.

    11. Replace any character in input that is not an ASCII hex digit with the character U+0030 DIGIT ZERO (0).

    12. + digits">ASCII hex digit with U+0030 (0).

    13. While input's code point length is zero or not a multiple of - three, append a U+0030 DIGIT ZERO (0) character to input.

    14. + three, append U+0030 (0) to input.

    15. Split input into three strings of equal code point length, to obtain three components. Let length be the code point length that all of @@ -7102,12 +7034,12 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute data-x="">length-8 characters in each component, and let length be 8.

    16. While length is greater than two and the first character in each - component is a U+0030 DIGIT ZERO (0) character, remove that character and reduce length by one.

    17. + component is U+0030 (0), remove that character and reduce length by one.

    18. If length is still greater than two, truncate each component, leaving only the first two characters in each.

    19. -
    20. Let result be a simple color.

      +
    21. Let result be a CSS color.

    22. Interpret the first component as a hexadecimal number; let the red component of result be the resulting number.

    23. @@ -7120,11 +7052,6 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
-
- -

The 2D graphics context has a separate - color syntax that also handles opacity.

-

Space-separated tokens

@@ -46623,9 +46550,11 @@ interface HTMLLabelElement : HTMLElement {
Content attributes:
Global attributes
accept
+
alpha
alt
autocomplete
checked
+
colorspace
dirname
disabled
form
@@ -46752,10 +46681,12 @@ interface HTMLInputElement : HTMLElement { [HTMLConstructor] constructor(); [CEReactions] attribute DOMString accept; + [CEReactions] attribute boolean alpha; [CEReactions] attribute DOMString alt; [CEReactions] attribute DOMString autocomplete; [CEReactions] attribute boolean defaultChecked; attribute boolean checked; + [CEReactions] attribute DOMString colorSpace; [CEReactions] attribute DOMString dirName; [CEReactions] attribute boolean disabled; readonly attribute HTMLFormElement? form; @@ -46951,9 +46882,11 @@ interface HTMLInputElement : HTMLElement {

Which of the accept, + alpha, alt, autocomplete, checked, + colorspace, dirname, formaction, formenctype, @@ -47058,6 +46991,30 @@ interface HTMLInputElement : HTMLElement { · + + alpha + · + · + + · + · + · + · + + + + · + · + · + Yes + · + + · + · + · + · + + alt · @@ -47130,6 +47087,30 @@ interface HTMLInputElement : HTMLElement { · + + colorspace + · + · + + · + · + · + · + + + + · + · + · + Yes + · + + · + · + · + · + + dirname Yes @@ -48338,8 +48319,9 @@ interface HTMLInputElement : HTMLElement { data-x="attr-input-type-checkbox">checkbox controls.

The accept, - alt, max, alpha, alt, max, min, multiple, pattern, HTMLInputElement : HTMLElement { data-x="dom-input-defaultValue">defaultValue IDL attribute must reflect the value content attribute.

-

The type IDL - attribute must reflect the respective content attribute of the same name, - limited to only known values. The maxLength IDL attribute must reflect the - maxlength content attribute, limited to only - non-negative numbers. The minLength IDL attribute must reflect the - minlength content attribute, limited to only - non-negative numbers.

+

The colorSpace IDL attribute must reflect the + colorspace content attribute, limited to only + known values. The type IDL attribute must reflect the respective + content attribute of the same name, limited to only known values. The maxLength IDL attribute + must reflect the maxlength content + attribute, limited to only non-negative numbers. The minLength IDL + attribute must reflect the minlength + content attribute, limited to only non-negative numbers.

The IDL attributes width and HTMLInputElement : HTMLElement {

The following content attributes must not be specified and do not apply to the element: accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -48593,8 +48580,10 @@ interface HTMLInputElement : HTMLElement {

The following content attributes must not be specified and do not apply to the element: accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -48696,8 +48685,10 @@ interface HTMLInputElement : HTMLElement {

The following content attributes must not be specified and do not apply to the element: accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -48801,8 +48792,10 @@ interface HTMLInputElement : HTMLElement {

The following content attributes must not be specified and do not apply to the element: accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -49072,8 +49065,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -49168,8 +49163,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, formaction, formenctype, formmethod, @@ -49341,8 +49338,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -49494,8 +49493,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -49651,8 +49652,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -49804,8 +49807,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -49950,8 +49955,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -50115,8 +50122,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -50386,8 +50395,10 @@ ldh-str = < as defined in accept, + alpha, alt, checked, + colorspace, dirname, formaction, formenctype, @@ -50433,42 +50444,155 @@ ldh-str = < as defined in value to a string representing a simple - color.

+ element's value to a string representing the serialization + of a CSS color.

+ +

In this state, there is always a CSS color picked, and there is no way for the end + user to set the value to the empty string.

+ +

The alpha attribute + is a boolean attribute. If present, it indicates the CSS color's alpha component can + be manipulated by the end user and does not have to be fully opaque.

+ +

The colorspace + attribute indicates the color space of the serialized CSS color. It also hints at the desired user + interface for selecting a CSS color. It is an enumerated attribute with the following + keywords and states:

+ + + + + + + +
Keyword + State + Brief description +
limited-srgb + Limited sRGB + The CSS color is converted to the 'srgb' color space and limited to 8-bits per + component, e.g., "#123456" or "color(srgb 0 1 0 / 0.5)". +
display-p3 + Display P3 + The CSS color is converted to the 'display-p3' color space, e.g., "color(display-p3 1.84 -0.19 0.72 / 0.6)". +
+ +

The attribute's missing value default and invalid value default are both the Limited sRGB state.

-

In this state, there is always a color picked, and there is no way to set the - value to the empty string.

+

Whenever the element's alpha or colorspace attributes are changed, the user agent must run + update a color well control color given the element.

+

If the element is mutable, the user agent should allow the user to change the color represented by its value, as - obtained from applying the rules for parsing simple color values to it. User agents - must not allow the user to set the value to a string that is - not a valid lowercase simple color. If the user agent provides a user interface for - selecting a color, then the value must be set to the result - of using the rules for serializing simple color values to the user's selection. User - agents must not allow the user to set the value to the empty - string.

+ obtained from parsing it. User agents must not + allow the user to set the value to a string that running + update a color well control color for the element would not set it to. If the user + agent provides a user interface for selecting a CSS color, then the value must be set to the result of serializing a color well control color given the element and the + end user's selection.

The input activation behavior for such an element element is to show the picker, if applicable, for element.

-

Constraint validation: While the user interface describes input that the user - agent cannot convert to a valid lowercase simple color, the control is - suffering from bad input.

+

Constraint validation: While the element's value is not the empty string and parsing it returns failure, the control is suffering from bad + input.

-

The value attribute, if specified and not empty, must - have a value that is a valid simple color.

+

The value attribute, if specified and not the empty + string, must have a value that is a CSS color.

-

The value sanitization algorithm is as follows: If the value of the element is a valid simple color, then - set it to the value of the element converted to ASCII - lowercase; otherwise, set it to the string "#000000".

+

The value sanitization algorithm is as follows: Run update + a color well control color for the element.

+ +

To update a color well control color, given an element element:

+ +
    +
  1. Assert: element is an input element whose type attribute is in the Color state.

  2. + +
  3. Let color be the result of parsing element's value.

  4. + +
  5. If color is failure, then set color to opaque + black.

  6. + +
  7. Set element's value to the result of serializing a color well control color given + element and color.

  8. +
+ +

To serialize a color well control color, given an element element and a + CSS color color:

+ +
    +
  1. Assert: element is an input element whose type attribute is in the Color state.

  2. + +
  3. Let htmlCompatible be false.

  4. + +
  5. If element's alpha attribute is not + specified, then set color's alpha component to be fully opaque.

  6. + +
  7. +

    If element's colorspace attribute is + in the Limited sRGB state:

    + +
      +
    1. +

      If element's alpha attribute is not + specified, then set htmlCompatible to true.

      + +

      This intentionally uses a different serialization path for compatibility with + an earlier version of the color well control.

      +
    2. + +
    3. Set color to color converted to the 'srgb' color space.

    4. + +
    5. Round each of color's components so they are in the range 0 to 255, + inclusive. Components are to be rounded towards +∞.

    6. + +
    +
  8. + +
  9. +

    Otherwise:

    + +
      +
    1. Assert: element's colorspace attribute is in the Display P3 state.

    2. + +
    3. Set color to color converted to the 'display-p3' color space.

    4. +
    +
  10. + +
  11. Return the result of serializing + color. If htmlCompatible is true, then do so with HTML-compatible serialization + requested.

  12. +
@@ -50476,7 +50600,9 @@ ldh-str = < as defined in apply to the element: - autocomplete and + alpha, + autocomplete, + colorspace, and list content attributes; list and value IDL attributes; @@ -50607,8 +50733,10 @@ ldh-str = < as defined in accept, + alpha, alt, autocomplete, + colorspace, dirname, formaction, formenctype, @@ -50780,8 +50908,10 @@ ldh-str = < as defined in accept, + alpha, alt, autocomplete, + colorspace, dirname, formaction, formenctype, @@ -51033,9 +51163,11 @@ ldh-str = < as defined in alpha, alt, autocomplete, checked, + colorspace, dirname, formaction, formenctype, @@ -51148,9 +51280,11 @@ ldh-str = < as defined in accept, + alpha, alt, autocomplete, checked, + colorspace, height, list, max, @@ -51417,8 +51551,10 @@ ldh-str = < as defined in accept, + alpha, autocomplete, checked, + colorspace, dirname, list, max, @@ -51534,9 +51670,11 @@ ldh-str = < as defined in accept, + alpha, alt, autocomplete, checked, + colorspace, dirname, formaction, formenctype, @@ -51619,9 +51757,11 @@ ldh-str = < as defined in accept, + alpha, alt, autocomplete, checked, + colorspace, dirname, formaction, formenctype, @@ -134078,33 +134218,33 @@ html, body { display: block; }

When a body element has a bgcolor attribute set, the new value is expected to be parsed using the rules for parsing a legacy - color value, and if that does not return an error, the user agent is expected to treat the + color value, and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's 'background-color' property to the resulting color.

When a body element has a text attribute, its value is expected to be parsed using the rules for parsing a legacy color value, and - if that does not return an error, the user agent is expected to treat the attribute as a presentational hint setting the element's 'color' property to the resulting color.

When a body element has a link attribute, its value is expected to be parsed using the rules for parsing a legacy color value, and - if that does not return an error, the user agent is expected to treat the attribute as a presentational hint setting the 'color' property of any element in the Document matching the :link pseudo-class to the resulting color.

When a body element has a vlink attribute, its value is expected to be parsed using the rules for parsing a legacy color value, - and if that does not return an error, the user agent is expected to treat the attribute as a presentational hint setting the 'color' property of any element in the Document matching the :visited pseudo-class to the resulting color.

When a body element has an alink attribute, its value is expected to be parsed using the rules for parsing a legacy color value, - and if that does not return an error, the user agent is expected to treat the attribute as a presentational hint setting the 'color' property of any element in the Document matching the :active pseudo-class and either the

When a font element has a color attribute, its value is expected to be parsed using the rules for parsing a legacy color - value, and if that does not return an error, the user agent is expected to treat the + value, and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's 'color' property to the resulting color.

@@ -134917,13 +135057,13 @@ table {

When a table, thead, tbody, tfoot, tr, td, or th element has a bgcolor attribute set, the new value is expected to be parsed using the rules for parsing a legacy - color value, and if that does not return an error, the user agent is expected to treat the + color value, and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's 'background-color' property to the resulting color.

When a table element has a bordercolor attribute, its value is expected to be parsed using the rules for parsing a legacy color - value, and if that does not return an error, the user agent is expected to treat the + value, and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's 'border-top-color', 'border-right-color', 'border-bottom-color', and 'border-left-color' properties to the @@ -135111,7 +135251,7 @@ hr[color], hr[noshade] { border-style: solid; }

When an hr element has a color attribute, its value is expected to be parsed using the rules for parsing a legacy color value, and - if that does not return an error, the user agent is expected to treat the attribute as a presentational hint setting the element's 'color' property to the resulting color.

@@ -136303,7 +136443,7 @@ marquee {

When a marquee element has a bgcolor attribute set, the value is expected to be parsed using the rules for parsing a legacy color - value, and if that does not return an error, the user agent is expected to treat the + value, and if that does not return failure, the user agent is expected to treat the attribute as a presentational hint setting the element's 'background-color' property to the resulting color.

@@ -136686,8 +136826,8 @@ progress { appearance: auto; }
  1. If the element has a bordercolor attribute, and applying the - rules for parsing a legacy color value to that attribute's value does not result - in an error, then return the color so obtained.

  2. + rules for parsing a legacy color value to that attribute's value does not return + failure, then return the color so obtained.

  3. Otherwise, if the element has a parent element that is a frameset element, then return the frame border color of that element.

    @@ -139948,9 +140088,11 @@ interface External { empty globals; accept; + alpha; alt; autocomplete; checked; + colorspace; dirname; disabled; form; @@ -141356,6 +141498,11 @@ interface External { iframe Whether to allow the iframe's contents to use requestFullscreen() Boolean attribute + + alpha + input + Allow the color's alpha component to be set + Boolean attribute alt area; @@ -141447,6 +141594,12 @@ interface External { link Color to use when customizing a site's icon (for rel="mask-icon") CSS <color> + + colorspace + input + The color space of the serialized color + "limited-srgb"; + "display-p3" cols textarea