From 68a353c50e92fee4c489b2f2edb6cafc9ed2c505 Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Thu, 22 Apr 2021 13:35:13 -0400 Subject: [PATCH 1/9] Add CSSColorValue as input for BaseRenderingContext2D fill and stroke styles --- source | 33 ++++++++++++++++++--------------- 1 file changed, 18 insertions(+), 15 deletions(-) diff --git a/source b/source index f04d536fe5d..91f8eb87ccf 100644 --- a/source +++ b/source @@ -62810,8 +62810,8 @@ try {

Can be set, to change the fill style.

-

The style can be either a string containing a CSS color, or a CanvasGradient or - CanvasPattern object. Invalid values are ignored.

+

The style can be either a string containing a CSS color, a CanvasGradient, + CanvasPattern or CSSColorValue object. Invalid values are ignored.

context . strokeStyle [ = value ]
@@ -62821,8 +62821,8 @@ try {

Can be set, to change the stroke style.

-

The style can be either a string containing a CSS color, or a CanvasGradient or - CanvasPattern object. Invalid values are ignored.

+

The style can be either a string containing a CSS color, a CanvasGradient, + CanvasPattern or CSSColorValue object. Invalid values are ignored.

@@ -62853,26 +62853,29 @@ try {

Objects that implement the CanvasFillStrokeStyles interface have attributes and methods (defined in this section) that control how shapes are treated by the object.

-

The fillStyle attribute represents the color or style - to use inside shapes, and the strokeStyle attribute represents the color or - style to use for the lines around the shapes.

+

The fillStyle attribute represents the + color or style to use inside shapes, and the strokeStyle attribute represents the color + or style to use for the lines around the shapes.

-

Both attributes can be either strings, CanvasGradients, or - CanvasPatterns. On setting, strings must be CSSColorValues. On setting, strings must be parsed with this canvas element and the color assigned, and - CanvasGradient and CanvasPattern objects must be assigned themselves. If - parsing the value results in failure, then it must be ignored, and the attribute must retain its - previous value. If the new value is a CanvasPattern object that is marked as not origin-clean, then the + CanvasGradient, CanvasPattern and CSSColorValue + objects must be assigned themselves. If parsing the value results in failure, + then it must be ignored, and the attribute must retain its previous value. If + the new value is a CanvasPattern object that is marked as + not origin-clean, then the CanvasRenderingContext2D's origin-clean flag must be set to false.

+

When set to a CanvasPattern or CanvasGradient object, the assignment is live, meaning that changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

+

When set to a CSSColorValue object, the assignment is not live and instead + the object is converted to a color up assignment.

+

On getting, if the value is a color, then the serialization of the color must be returned. Otherwise, if it is not a color but a CanvasGradient or CanvasPattern, then the respective object must be From 8a61c7a797cc08b8e27b3c9640b9c8a1ff7cbf87 Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Fri, 23 Apr 2021 15:29:31 -0400 Subject: [PATCH 2/9] Use dfn and change idl too --- source | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/source b/source index 91f8eb87ccf..91a40394141 100644 --- a/source +++ b/source @@ -60297,8 +60297,8 @@ interface mixin CanvasImageSmoothing { interface mixin CanvasFillStrokeStyles { // colors and styles (see also the CanvasPathDrawingStyles and CanvasTextDrawingStyles interfaces) - attribute (DOMString or CanvasGradient or CanvasPattern) strokeStyle; // (default black) - attribute (DOMString or CanvasGradient or CanvasPattern) fillStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) strokeStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) fillStyle; // (default black) CanvasGradient createLinearGradient(double x0, double y0, double x1, double y1); CanvasGradient createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1); CanvasPattern? createPattern(CanvasImageSource image, [LegacyNullToEmptyString] DOMString repetition); @@ -62811,7 +62811,7 @@ try {

Can be set, to change the fill style.

The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or CSSColorValue object. Invalid values are ignored.

+ CanvasPattern or CSSColorValue object. Invalid values are ignored.

context . strokeStyle [ = value ]
@@ -62822,7 +62822,7 @@ try {

Can be set, to change the stroke style.

The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or CSSColorValue object. Invalid values are ignored.

+ CanvasPattern or CSSColorValue object. Invalid values are ignored.

@@ -62858,10 +62858,9 @@ try { or style to use for the lines around the shapes.

Both attributes can be either strings, CanvasGradients, - CanvasPatterns, or CSSColorValues. On setting, strings must be CSSColorValues. On setting, strings must be parsed with this canvas element and the color assigned, and - CanvasGradient, CanvasPattern and CSSColorValue - objects must be assigned themselves. If parsing the value results in failure, + CanvasGradient, CanvasPattern. If parsing the value results in failure, then it must be ignored, and the attribute must retain its previous value. If the new value is a CanvasPattern object that is marked as not origin-clean, then the @@ -62873,8 +62872,8 @@ try { is live, meaning that changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

-

When set to a CSSColorValue object, the assignment is not live and instead - the object is converted to a color up assignment.

+

When set to a CSSColorValue object, a color is derived from + that object and the style is set to that color.

On getting, if the value is a color, then the serialization of the color must be returned. Otherwise, if it is not a color but a From 250f21e1ed4c157728aca9b4620236b1da48a53d Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Fri, 23 Apr 2021 15:35:26 -0400 Subject: [PATCH 3/9] x --- source | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/source b/source index 91a40394141..0575b10c0e0 100644 --- a/source +++ b/source @@ -62872,8 +62872,7 @@ try { is live, meaning that changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

-

When set to a CSSColorValue object, a color is derived from - that object and the style is set to that color.

+

When set to a CSSColorValue object, the color is converted to RGB and a string is parsed from that value, the style is set to that string.

On getting, if the value is a color, then the serialization of the color must be returned. Otherwise, if it is not a color but a From cc5f61ac003c0622d95d6487f96c5ca78493663d Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Tue, 27 Apr 2021 08:46:57 -0400 Subject: [PATCH 4/9] Put span around interface classes --- source | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/source b/source index 0575b10c0e0..a57d79387d9 100644 --- a/source +++ b/source @@ -60297,8 +60297,8 @@ interface mixin CanvasImageSmoothing { interface mixin CanvasFillStrokeStyles { // colors and styles (see also the CanvasPathDrawingStyles and CanvasTextDrawingStyles interfaces) - attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) strokeStyle; // (default black) - attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) fillStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) strokeStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) fillStyle; // (default black) CanvasGradient createLinearGradient(double x0, double y0, double x1, double y1); CanvasGradient createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1); CanvasPattern? createPattern(CanvasImageSource image, [LegacyNullToEmptyString] DOMString repetition); From 02d3953f1f0ad770d7a82340641e61b1461059b4 Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Tue, 27 Apr 2021 08:53:04 -0400 Subject: [PATCH 5/9] Link to srgb conversion --- source | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source b/source index a57d79387d9..d92fd3e9668 100644 --- a/source +++ b/source @@ -62872,7 +62872,7 @@ try { is live, meaning that changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

-

When set to a CSSColorValue object, the color is converted to RGB and a string is parsed from that value, the style is set to that string.

+

When set to a CSSColorValue object, the color is converted to sRGB and a string is parsed from that value, the style is set to that string.

On getting, if the value is a color, then the serialization of the color must be returned. Otherwise, if it is not a color but a From ca0618763cb57c3015a63c29c1c0f886eb8375e3 Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Mon, 10 May 2021 19:06:27 -0400 Subject: [PATCH 6/9] Add setter step for CSSColorValues --- source | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/source b/source index 5523e57d403..b5739ab87fe 100644 --- a/source +++ b/source @@ -63253,15 +63253,17 @@ try {

Such objects have associated fill style and stroke style - values, which are either CSS colors, CanvasPatterns, or CanvasGradients. + values, which are either CSS colors, CanvasPatterns, CanvasGradients, + or CSSColorValues. Initially, both must be the result of parsing the string "#000000".

When the value is a CSS color, it must not be affected by the transformation matrix when used to draw on bitmaps.

-

When set to a CanvasPattern or CanvasGradient object, - changes made to the object after the assignment do affect subsequent stroking or filling of +

When set to a CanvasPattern, a CanvasGradient, or + a CSSColorValue object, changes made to + the object after the assignment do affect subsequent stroking or filling of shapes.

The this's origin-clean flag to false.

+

  • If the given value is a CSSColorValue, then:

      +

    1. If the given value has a custom colorspace, throw a TypeError

      2. +

    2. Set this's fill + style to the result of converting the given value into an sRGB CSS color using its + toRGB + function.

      3. +

    3. Return.

      4. +
    • +

  • Set this's fill style to the given value.

    • @@ -63338,6 +63349,14 @@ try { +

  • If the given value is a CSSColorValue, then:

      +

    1. If the given value has a custom colorspace, throw a TypeError

      2. +

    2. Set this's stroke + style to the result of converting the given value into an sRGB CSS color using its + toRGB() function.

      3. +

    3. Return.

      4. +
    • +

  • If the given value is a CanvasPattern object that is marked as not origin-clean, then set this's origin-clean flag to From 49257317ef9c59a43404e53d42e7f2517aab196d Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Tue, 11 May 2021 06:55:01 -0400 Subject: [PATCH 7/9] Formatting --- source | 43 +++++++++++++++++++++---------------------- 1 file changed, 21 insertions(+), 22 deletions(-) diff --git a/source b/source index b5739ab87fe..dee2d8fbeea 100644 --- a/source +++ b/source @@ -63254,17 +63254,12 @@ try {

    Such objects have associated fill style and stroke style values, which are either CSS colors, CanvasPatterns, CanvasGradients, - or CSSColorValues. - Initially, both must be the result of parsing - the string "#000000".

    + or CSSColorValues. Initially, both must be the result of parsing the string "#000000".

    When the value is a CSS color, it must not be affected by the transformation matrix when used to draw on bitmaps.

    -

    When set to a CanvasPattern, a CanvasGradient, or - a CSSColorValue object, changes made to - the object after the assignment do affect subsequent stroking or filling of - shapes.

    +

    When set to a CanvasPattern, a CanvasGradient, or a CSSColorValue object, changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

    The fillStyle getter steps are:

    @@ -63303,14 +63298,16 @@ try { this's origin-clean flag to false.

    • -

  • If the given value is a CSSColorValue, then:

      -

    1. If the given value has a custom colorspace, throw a TypeError

      2. -

    2. Set this's fill - style to the result of converting the given value into an sRGB CSS color using its - toRGB - function.

      3. -

    3. Return.

      4. -
    • +

  • If the given value is a CSSColorValue, then:

    +
      +

    1. If the given value has a custom color space, throw a TypeError.

      2. + +

    2. Set this's fill + style to the result of converting the given value into an sRGB CSS color using itstoRGB function.

      3. + +

    3. Return.

      4. +
    +

  • Set this's fill style to the given value.

    • @@ -63349,13 +63346,15 @@ try { -

  • If the given value is a CSSColorValue, then:

      -

    1. If the given value has a custom colorspace, throw a TypeError

      2. -

    2. Set this's stroke - style to the result of converting the given value into an sRGB CSS color using its - toRGB() function.

      3. -

    3. Return.

      4. -
    • +

  • If the given value is a CSSColorValue, then:

    +
      +

    1. If the given value has a custom color space, throw a TypeError.

      2. + +

    2. Set this's stroke style to the result of converting the given value into an sRGB CSS color using itstoRGB function.

      3. + +

    3. Return.

      4. +
    +

  • If the given value is a CanvasPattern object that is marked as not origin-clean, then set From 768954af5345a9e2652eb9af7d75fde1b9d8cc6e Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Tue, 11 May 2021 07:12:03 -0400 Subject: [PATCH 8/9] Maybe I finally got the wrapping right --- source | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/source b/source index dee2d8fbeea..ac2cdad2e23 100644 --- a/source +++ b/source @@ -63209,7 +63209,9 @@ try {

    Can be set, to change the fill style.

    The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or CSSColorValue object. Invalid values are ignored.

    + CanvasPattern or + CSSColorValue + object. Invalid values are ignored.

    context . strokeStyle [ = value ]
    @@ -63220,7 +63222,8 @@ try {

    Can be set, to change the stroke style.

    The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or CSSColorValue object. Invalid values are ignored.

    + CanvasPattern or CSSColorValue object. Invalid + values are ignored.

    @@ -63254,12 +63257,16 @@ try {

    Such objects have associated fill style and stroke style values, which are either CSS colors, CanvasPatterns, CanvasGradients, - or CSSColorValues. Initially, both must be the result of parsing the string "#000000".

    + or CSSColorValues. Initially, both must be the result of + parsing the string + "#000000".

    When the value is a CSS color, it must not be affected by the transformation matrix when used to draw on bitmaps.

    -

    When set to a CanvasPattern, a CanvasGradient, or a CSSColorValue object, changes made to the object after the assignment do affect subsequent stroking or filling of shapes.

    +

    When set to a CanvasPattern, a CanvasGradient, or a + CSSColorValue object, changes made to the object after the + assignment do affect subsequent stroking or filling of shapes.

    The fillStyle getter steps are:

    @@ -63303,7 +63310,9 @@ try {

  • If the given value has a custom color space, throw a TypeError.

  • Set this's fill - style to the result of converting the given value into an sRGB CSS color using itstoRGB function.

    • + style to the result of converting the given value into an sRGB CSS color using its + toRGB + function.

  • Return.

    • @@ -63350,7 +63359,10 @@ try {

    1. If the given value has a custom color space, throw a TypeError.

      2. -

    2. Set this's stroke style to the result of converting the given value into an sRGB CSS color using itstoRGB function.

      3. +

    3. Set this's + stroke style to the result + of converting the given value into an sRGB CSS color using its + toRGB function.

    4. Return.

    From 1089e5461c584731fab261dedf8c99154611f7ab Mon Sep 17 00:00:00 2001 From: Aaron Krajeski Date: Tue, 11 May 2021 10:43:38 -0400 Subject: [PATCH 9/9] proper citation --- source | 34 ++++++++++++++++++++-------------- 1 file changed, 20 insertions(+), 14 deletions(-) diff --git a/source b/source index ac2cdad2e23..37ded9174f1 100644 --- a/source +++ b/source @@ -3384,6 +3384,13 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
  • 'relative-colorimetric' rendering intent
    • +

    The following terms are defined in CSSColorValue objects:

    + +
      +
    • CSSColorValue
      • +
    • toRGB
      • +
    +

    The following terms are defined in CSS Images:

      @@ -60410,8 +60417,8 @@ interface mixin CanvasImageSmoothing { interface mixin CanvasFillStrokeStyles { // colors and styles (see also the CanvasPathDrawingStyles and CanvasTextDrawingStyles interfaces) - attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) strokeStyle; // (default black) - attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) fillStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) strokeStyle; // (default black) + attribute (DOMString or CanvasGradient or CanvasPattern or CSSColorValue) fillStyle; // (default black) CanvasGradient createLinearGradient(double x0, double y0, double x1, double y1); CanvasGradient createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1); CanvasPattern? createPattern(CanvasImageSource image, [LegacyNullToEmptyString] DOMString repetition); @@ -63209,9 +63216,7 @@ try {

      Can be set, to change the fill style.

      The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or - CSSColorValue - object. Invalid values are ignored.

      + CanvasPattern or CSSColorValue object. Invalid values are ignored.

      context . strokeStyle [ = value ]
      @@ -63222,8 +63227,7 @@ try {

      Can be set, to change the stroke style.

      The style can be either a string containing a CSS color, a CanvasGradient, - CanvasPattern or CSSColorValue object. Invalid - values are ignored.

      + CanvasPattern or CSSColorValue object. Invalid values are ignored.

      @@ -63257,7 +63261,7 @@ try {

      Such objects have associated fill style and stroke style values, which are either CSS colors, CanvasPatterns, CanvasGradients, - or CSSColorValues. Initially, both must be the result of + or CSSColorValues. Initially, both must be the result of parsing the string "#000000".

      @@ -63265,8 +63269,8 @@ try { to draw on bitmaps.

      When set to a CanvasPattern, a CanvasGradient, or a - CSSColorValue object, changes made to the object after the - assignment do affect subsequent stroking or filling of shapes.

      + CSSColorValue object, changes made to the object after the assignment do affect + subsequent stroking or filling of shapes.

      The fillStyle getter steps are:

      @@ -63305,14 +63309,13 @@ try { this's origin-clean flag to false.

      -

    • If the given value is a CSSColorValue, then:

      +

    • If the given value is a CSSColorValue, then:

      1. If the given value has a custom color space, throw a TypeError.

      2. Set this's fill style to the result of converting the given value into an sRGB CSS color using its - toRGB - function.

        3. + toRGB function.

      3. Return.

      @@ -63355,7 +63358,7 @@ try {
      • -

    • If the given value is a CSSColorValue, then:

      +

    • If the given value is a CSSColorValue, then:

      1. If the given value has a custom color space, throw a TypeError.

        2. @@ -123958,6 +123961,9 @@ INSERT INTERFACES HERE
        [CSSCOLORADJUST]
        CSS Color Adjustment Module, E. Etemad, R. Atanassov, R. Lillesveen, T. Atkins. W3C.
        +
        [CSSCOLORVALUE]
        +
        CSSColorValue objects, , T. Atkins, F. Remy, S. Stephens, N. Raisinghani.
        +
        [CSSDISPLAY]
        CSS Display, T. Atkins, E. Etemad. W3C.