Changeset 271712 in webkit


Ignore:
Timestamp:
Jan 21, 2021 1:45:55 PM (18 months ago)
Author:
weinig@apple.com
Message:

Remove explicit clamp to SRGB for Lab colors on CG platforms that support wide color
​https://bugs.webkit.org/show_bug.cgi?id=220684

Reviewed by Simon Fraser.

LayoutTests/imported/w3c:

Update existing lab/lch tests to match new more precise values from ​https://github.com/web-platform-tests/wpt/pull/27202
and add two new tests for colors outside the sRGB gamut that will be upstreamed to WPT after landing.

  • web-platform-tests/css/css-color/lab-001.html:
  • web-platform-tests/css/css-color/lab-002.html:
  • web-platform-tests/css/css-color/lab-003.html:
  • web-platform-tests/css/css-color/lab-004-expected.html:
  • web-platform-tests/css/css-color/lab-004.html:
  • web-platform-tests/css/css-color/lab-005-expected.html:
  • web-platform-tests/css/css-color/lab-005.html:
  • web-platform-tests/css/css-color/lab-006-expected.html:
  • web-platform-tests/css/css-color/lab-006.html:
  • web-platform-tests/css/css-color/lab-007-expected.html:
  • web-platform-tests/css/css-color/lab-007.html:
  • web-platform-tests/css/css-color/lab-008-expected.html: Added.
  • web-platform-tests/css/css-color/lab-008.html: Added.
  • web-platform-tests/css/css-color/lch-001.html:
  • web-platform-tests/css/css-color/lch-002.html:
  • web-platform-tests/css/css-color/lch-003.html:
  • web-platform-tests/css/css-color/lch-004-expected.html:
  • web-platform-tests/css/css-color/lch-004.html:
  • web-platform-tests/css/css-color/lch-005-expected.html:
  • web-platform-tests/css/css-color/lch-005.html:
  • web-platform-tests/css/css-color/lch-006-expected.html:
  • web-platform-tests/css/css-color/lch-006.html:
  • web-platform-tests/css/css-color/lch-007-expected.html:
  • web-platform-tests/css/css-color/lch-007.html:
  • web-platform-tests/css/css-color/lch-008-expected.html: Added.
  • web-platform-tests/css/css-color/lch-008.html: Added.

Source/WebCore:

To avoid clamping device independent colors to sRGB we convert colors without a direct
CoreGraphics representation to ExtendedSRGB to ensure the full gamut is preserved.

While CoreGraphics does support the Lab colorspace on some systems (Big Sur and later),
to ensure all versions of WebKit can support wide color Lab this approach provides the
most coverage.

  • platform/graphics/ColorConversion.cpp:
  • platform/graphics/ColorConversion.h:
  • platform/graphics/ColorTypes.h:

Add support for ExtendedSRGBA and LinearExtendedSRGBA color types.

  • platform/graphics/cg/ColorCG.cpp:

(WebCore::leakCGColor):
Update fallback conversion to convert to an extended color space to avoid premature
clamping.

Location:
trunk
Files:
28 edited
4 copied

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/imported/w3c/ChangeLog

    r271706 r271712  
     12021-01-21  Sam Weinig  <weinig@apple.com>
     2
     3        Remove explicit clamp to SRGB for Lab colors on CG platforms that support wide color
     4        https://bugs.webkit.org/show_bug.cgi?id=220684
     5
     6        Reviewed by Simon Fraser.
     7
     8        Update existing lab/lch tests to match new more precise values from https://github.com/web-platform-tests/wpt/pull/27202
     9        and add two new tests for colors outside the sRGB gamut that will be upstreamed to WPT after landing.
     10
     11        * web-platform-tests/css/css-color/lab-001.html:
     12        * web-platform-tests/css/css-color/lab-002.html:
     13        * web-platform-tests/css/css-color/lab-003.html:
     14        * web-platform-tests/css/css-color/lab-004-expected.html:
     15        * web-platform-tests/css/css-color/lab-004.html:
     16        * web-platform-tests/css/css-color/lab-005-expected.html:
     17        * web-platform-tests/css/css-color/lab-005.html:
     18        * web-platform-tests/css/css-color/lab-006-expected.html:
     19        * web-platform-tests/css/css-color/lab-006.html:
     20        * web-platform-tests/css/css-color/lab-007-expected.html:
     21        * web-platform-tests/css/css-color/lab-007.html:
     22        * web-platform-tests/css/css-color/lab-008-expected.html: Added.
     23        * web-platform-tests/css/css-color/lab-008.html: Added.
     24        * web-platform-tests/css/css-color/lch-001.html:
     25        * web-platform-tests/css/css-color/lch-002.html:
     26        * web-platform-tests/css/css-color/lch-003.html:
     27        * web-platform-tests/css/css-color/lch-004-expected.html:
     28        * web-platform-tests/css/css-color/lch-004.html:
     29        * web-platform-tests/css/css-color/lch-005-expected.html:
     30        * web-platform-tests/css/css-color/lch-005.html:
     31        * web-platform-tests/css/css-color/lch-006-expected.html:
     32        * web-platform-tests/css/css-color/lch-006.html:
     33        * web-platform-tests/css/css-color/lch-007-expected.html:
     34        * web-platform-tests/css/css-color/lch-007.html:
     35        * web-platform-tests/css/css-color/lch-008-expected.html: Added.
     36        * web-platform-tests/css/css-color/lch-008.html: Added.
     37
    1382021-01-21  Tyler Wilcock  <twilco.o@protonmail.com>
    239

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-001.html

    r271362 r271712  
    77<meta name="assert" content="lab() with no alpha">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: #008000; width: 12em; height: 6em; margin-bottom: 0}
    11     .test { background-color: lab(46.277% -47.562 48.583)} /* green (sRGB #008000) converted to Lab */
     9    .test { background-color: red; width: 12em; height: 12em; }
     10    .test { background-color: lab(46.2775% -47.5621 48.5837); } /* green (sRGB #008000) converted to Lab */
    1211</style>
    1312<body>
    1413    <p>Test passes if you see a green square, and no red.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     14    <div class="test"></div>
    1715</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-002.html

    r271362 r271712  
    44<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="blackblock-ref.html">
     6<link rel="match" href="blacksquare-ref.html">
    77<meta name="assert" content="lab() with no alpha">
    88<style>
    99    .test { background-color: red; width: 12em; height: 12em; }
    10     .test { background-color: lab(0% 0 0) } /* black (sRGB #000000) converted to Lab */
     10    .test { background-color: lab(0% 0 0); } /* black (sRGB #000000) converted to Lab */
    1111</style>
    1212<body>
    1313    <p>Test passes if you see a black square, and no red.</p>
    14     <p class="test"> </p>
     14    <div class="test"></div>
    1515</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-003.html

    r271362 r271712  
    44<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="whiteblock-ref.html">
     6<link rel="match" href="whitesquare-ref.html">
    77<meta name="assert" content="lab() with no alpha">
    88<style>
    99    body { background-color: grey; }
    1010    .test { background-color: red; width: 12em; height: 12em; }
    11     .test { background-color: lab(100% 0 0);} /* white (sRGB #FFFFFF) converted to Lab */
     11    .test { background-color: lab(100% 0 0); } /* white (sRGB #FFFFFF) converted to Lab */
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a white square, and no red.</p>
    15     <p class="test"> </p>
     15    <div class="test"></div>
    1616</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color:rgb(75.62% 30.45% 47.56%); width: 12em; height: 12em;} /* lab(50 50 0) converted to sRGB */
     5    .test { background-color: rgb(75.6208% 30.4487% 47.5634%); width: 12em; height: 12em; } /* lab(50% 50 0) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-004.html

    r271362 r271712  
    77<meta name="assert" content="lab() with no alpha, positive a axis">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(75.62%, 30.45%, 47.56%); width: 12em; height: 6em; margin-bottom: 0}/* lab(50 50 0) converted to sRGB */
    11     .test { background-color: lab(50% 50 0)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(75.6208% 30.4487% 47.5634%); width: 12em; height: 6em; margin-bottom: 0; }/* lab(50% 50 0) converted to sRGB */
     11    .test { background-color: lab(50% 50 0); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(10.79%, 75.55%, 66.40%); width: 12em; height: 12em;} /* lab(70 -45 0) converted to sRGB */
     5    .test { background-color: rgb(10.7906% 75.5567% 66.3982%); width: 12em; height: 12em; } /* lab(70% -45 0) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-005.html

    r271362 r271712  
    77<meta name="assert" content="lab() with no alpha, negative a axis">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(10.79%, 75.55%, 66.40%); width: 12em; height: 6em; margin-bottom: 0} /* lab(70 -45 0) converted to sRGB */
    11     .test { background-color: lab(70% -45 0)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(10.7906% 75.5567% 66.3982%); width: 12em; height: 6em; margin-bottom: 0; } /* lab(70% -45 0) converted to sRGB */
     11    .test { background-color: lab(70% -45 0); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(76.62%, 66.36%, 5.58%); width: 12em; height: 12em;} /* lab(70 0 70) converted to sRGB */
     5    .test { background-color: rgb(76.6254% 66.3607% 5.5775%); width: 12em; height: 12em; } /* lab(70% 0 70) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-006.html

    r271362 r271712  
    77<meta name="assert" content="lab() with no alpha, positive b axis">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(76.62%, 66.36%, 5.58%); width: 12em; height: 6em; margin-bottom: 0} /* lab(70 0 70) converted to sRGB */
    11     .test { background-color: lab(70% 0 70)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(76.6254% 66.3607% 5.5775%); width: 12em; height: 6em; margin-bottom: 0; } /* lab(70% 0 70) converted to sRGB */
     11    .test { background-color: lab(70% 0 70); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(12.81%, 53.10%, 92.76%); width: 12em; height: 12em;} /* lab(55 0 -60) converted to sRGB */
     5    .test { background-color: rgb(12.8128% 53.105% 92.7645%); width: 12em; height: 12em; } /* lab(55% 0 -60) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-007.html

    r271362 r271712  
    77<meta name="assert" content="lab() with no alpha, negative b axis">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(12.81%, 53.10%, 92.76%); width: 12em; height: 6em; margin-bottom: 0} /* lab(55 0 -60) converted to sRGB */
    11     .test { background-color: lab(55% 0 -60)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(12.8128% 53.105% 92.7645%); width: 12em; height: 6em; margin-bottom: 0; } /* lab(55% 0 -60) converted to sRGB */
     11    .test { background-color: lab(55% 0 -60); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-008-expected.html

    r271711 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color:rgb(75.62% 30.45% 47.56%); width: 12em; height: 12em;} /* lab(50 50 0) converted to sRGB */
     5    .test { background-color: color(display-p3 0 1 0); width: 12em; height: 12em; }
    66</style>
    77<body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lab-008.html

    r271711 r271712  
    22<meta charset="utf-8">
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    4 <link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    54<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="lab-006-ref.html">
    7 <meta name="assert" content="lab() with no alpha, positive b axis">
     5<link rel="match" href="lab-008-ref.html">
     6<meta name="assert" content="lab() outside the sRGB gamut">
    87<style>
    98    .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(76.62%, 66.36%, 5.58%); width: 12em; height: 6em; margin-bottom: 0} /* lab(70 0 70) converted to sRGB */
    11     .test { background-color: lab(70% 0 70)}
     9    .ref { background-color: color(display-p3 0 1 0); width: 12em; height: 6em; margin-bottom: 0; }
     10    .test { background-color: lab(86.6146% -106.5599 102.8717); }
    1211</style>
    1312<body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-001.html

    r271362 r271712  
    44<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="greenblock-ref.html">
     6<link rel="match" href="greensquare-ref.html">
    77<meta name="assert" content="lch() with no alpha">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: #008000; width: 12em; height: 6em; margin-bottom: 0}
    11     .test { background-color: lch(46.277% 67.945 134.427)} /* green (sRGB #008000) converted to LCH */
     9    .test { background-color: red; width: 12em; height: 12em; }
     10    .test { background-color: lch(46.2775% 67.9892 134.3912); } /* green (sRGB #008000) converted to LCH */
    1211</style>
    1312<body>
    1413    <p>Test passes if you see a green square, and no red.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     14    <div class="test"></div>
    1715</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-002.html

    r271362 r271712  
    44<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="blackblock-ref.html">
     6<link rel="match" href="blacksquare-ref.html">
    77<meta name="assert" content="lch() with no alpha">
    88<style>
    99    .test { background-color: red; width: 12em; height: 12em; }
    10     .test { background-color: lch(0% 0 0) } /* black (sRGB #000000) converted to Lab */
     10    .test { background-color: lch(0% 0 0); } /* black (sRGB #000000) converted to LCH */
    1111</style>
    1212<body>
    1313    <p>Test passes if you see a black square, and no red.</p>
    14     <p class="test"> </p>
     14    <div class="test"></div>
    1515</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-003.html

    r271362 r271712  
    44<link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="whitetext-ref.html">
     6<link rel="match" href="whitesquare-ref.html">
    77<meta name="assert" content="lch() with no alpha">
    88<style>
    99    body { background-color: grey; }
    1010    .test { background-color: red; width: 12em; height: 12em; }
    11     .test { background-color: lch(100% 0 0);} /* white (sRGB #FFFFFF) converted to Lab */
     11    .test { background-color: lch(100% 0 0); } /* white (sRGB #FFFFFF) converted to LCH */
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a white square, and no red.</p>
    15     <p class="test"> </p>
     15    <div class="test"></div>
    1616</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color:rgb(75.62% 30.45% 47.56%); width: 12em; height: 12em;} /* lch(50 50 0) converted to sRGB (happens to be the same as lab(50 50 0)*/
     5    .test { background-color: rgb(75.6208% 30.4487% 47.5634%); width: 12em; height: 12em; } /* lch(50% 50 0) converted to sRGB (happens to be the same as lab(50% 50 0)) */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-004.html

    r271362 r271712  
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    66<link rel="match" href="lch-004-ref.html">
    7 <meta name="assert" content="lch() with no alpha, positive a axis">
     7<meta name="assert" content="lch() with no alpha, positive a axis (when converted to Lab)">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(75.62%, 30.45%, 47.56%); width: 12em; height: 6em; margin-bottom: 0} /* lch(50 50 0) converted to sRGB (happens to be the same as lab(50 50 0)*/
    11     .test { background-color: lch(50% 50 0)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(75.6208% 30.4487% 47.5634%); width: 12em; height: 6em; margin-bottom: 0; } /* lch(50% 50 0) converted to sRGB (happens to be the same as lab(50% 50 0)) */
     11    .test { background-color: lch(50% 50 0); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(10.79%, 75.55%, 66.40%); width: 12em; height: 12em;} /* lch(70 45 180) converted to sRGB */
     5    .test { background-color: rgb(10.7906% 75.5567% 66.3982%); width: 12em; height: 12em; } /* lch(70% 45 180) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-005.html

    r271362 r271712  
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    66<link rel="match" href="lch-005-ref.html">
    7 <meta name="assert" content="lch() with no alpha, negative a axis">
     7<meta name="assert" content="lch() with no alpha, negative a axis (when converted to Lab)">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(10.79%, 75.55%, 66.40%); width: 12em; height: 6em; margin-bottom: 0} /* lch(70 45 180) converted to sRGB */
    11     .test { background-color: lch(70% 45 -180)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(10.7906% 75.5567% 66.3982%); width: 12em; height: 6em; margin-bottom: 0; } /* lch(70% 45 180) converted to sRGB */
     11    .test { background-color: lch(70% 45 -180); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(76.62%, 66.36%, 5.58%); width: 12em; height: 12em;} /* lch(70 70 90) converted to sRGB */
     5    .test { background-color: rgb(76.6254% 66.3607% 5.5775%); width: 12em; height: 12em; } /* lch(70% 70 90) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-006.html

    r271362 r271712  
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    66<link rel="match" href="lch-006-ref.html">
    7 <meta name="assert" content="lch() with no alpha, positive b axis">
     7<meta name="assert" content="lch() with no alpha, positive b axis (when converted to Lab)">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(76.62%, 66.36%, 5.58%); width: 12em; height: 6em; margin-bottom: 0} /* lch(70 70 90) converted to sRGB */
    11     .test { background-color: lch(70% 70 90)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(76.6254% 66.3607% 5.5775%); width: 12em; height: 6em; margin-bottom: 0; } /* lch(70% 70 90) converted to sRGB */
     11    .test { background-color: lch(70% 70 90); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007-expected.html

    r271362 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color: rgb(27.38% 51.92% 91.25%); width: 12em; height: 12em;} /* lch(55% 58 275) converted to sRGB */
     5    .test { background-color: rgb(12.8128% 53.105% 92.7645%); width: 12em; height: 12em; } /* lch(55% 60 270) converted to sRGB */
    66</style>
    77<body>
    88    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    9     <p class="test"> </p>
     9    <div class="test"></div>
    1010</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-007.html

    r271362 r271712  
    55<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    66<link rel="match" href="lch-007-ref.html">
    7 <meta name="assert" content="lab() with no alpha, negative b axis">
     7<meta name="assert" content="lch() with no alpha, negative b axis (when converted to Lab)">
    88<style>
    9     .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(27.38% 51.92% 91.25%); width: 12em; height: 6em; margin-bottom: 0} /* lch(55% 58 275) converted to sRGB */
    11     .test { background-color: lch(55% 58 275)}
     9    .test { background-color: red; width: 12em; height: 6em; margin-top: 0; }
     10    .ref { background-color: rgb(12.8128% 53.105% 92.7645%); width: 12em; height: 6em; margin-bottom: 0; } /* lch(55% 60 270) converted to sRGB */
     11    .test { background-color: lch(55% 60 270); }
    1212</style>
    1313<body>
    1414    <p>Test passes if you see a single square, and not two rectangles of different colors.</p>
    15     <p class="ref"> </p>
    16     <p class="test"> </p>
     15    <div class="ref"></div>
     16    <div class="test"></div>
    1717</body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-008-expected.html

    r271711 r271712  
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    44<style>
    5     .test { background-color:rgb(75.62% 30.45% 47.56%); width: 12em; height: 12em;} /* lab(50 50 0) converted to sRGB */
     5    .test { background-color: color(display-p3 0 1 0); width: 12em; height: 12em; }
    66</style>
    77<body>

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-color/lch-008.html

    r271711 r271712  
    22<meta charset="utf-8">
    33<title>CSS Color 4: Specifying Lab and LCH</title>
    4 <link rel="author" title="Chris Lilley" href="mailto:chris@w3.org">
    54<link rel="help" href="https://drafts.csswg.org/css-color-4/#specifying-lab-lch">
    6 <link rel="match" href="lab-004-ref.html">
    7 <meta name="assert" content="lab() with no alpha, positive a axis">
     5<link rel="match" href="lch-008-ref.html">
     6<meta name="assert" content="lch() outside the sRGB gamut">
    87<style>
    98    .test { background-color: red; width: 12em; height: 6em; margin-top:0}
    10     .ref { background-color: rgb(75.62%, 30.45%, 47.56%); width: 12em; height: 6em; margin-bottom: 0}/* lab(50 50 0) converted to sRGB */
    11     .test { background-color: lab(50% 50 0)}
     9    .ref { background-color: color(display-p3 0 1 0); width: 12em; height: 6em; margin-bottom: 0; }
     10    .test { background-color: lch(86.6146% 148.1135 136.0089); }
    1211</style>
    1312<body>

  • trunk/Source/WebCore/ChangeLog

    r271709 r271712  
     12021-01-21  Sam Weinig  <weinig@apple.com>
     2
     3        Remove explicit clamp to SRGB for Lab colors on CG platforms that support wide color
     4        https://bugs.webkit.org/show_bug.cgi?id=220684
     5
     6        Reviewed by Simon Fraser.
     7
     8        To avoid clamping device independent colors to sRGB we convert colors without a direct
     9        CoreGraphics representation to ExtendedSRGB to ensure the full gamut is preserved.
     10
     11        While CoreGraphics does support the Lab colorspace on some systems (Big Sur and later),
     12        to ensure all versions of WebKit can support wide color Lab this approach provides the
     13        most coverage.
     14
     15        * platform/graphics/ColorConversion.cpp:
     16        * platform/graphics/ColorConversion.h:
     17        * platform/graphics/ColorTypes.h:
     18        Add support for ExtendedSRGBA and LinearExtendedSRGBA color types.
     19
     20        * platform/graphics/cg/ColorCG.cpp:
     21        (WebCore::leakCGColor):
     22        Update fallback conversion to convert to an extended color space to avoid premature
     23        clamping.
     24
    1252021-01-21  Youenn Fablet  <youenn@apple.com>
    226

  • trunk/Source/WebCore/platform/graphics/ColorConversion.cpp

    r271695 r271712  
    7777};
    7878
     79// Gamma conversions.
     80
    7981float linearToRGBColorComponentClamping(float c)
    8082{
    … …  
    9395}
    9496
    95 // Gamma conversions.
     97float linearToRGBColorComponentNonClamping(float c)
     98{
     99    float sign = c > 0 ? 1.0f : -1.0f;
     100    c = std::abs(c);
     101
     102    if (c < 0.0031308f)
     103        return 12.92f * c * sign;
     104
     105    return (1.055f * std::pow(c, 1.0f / 2.4f) - 0.055f) * sign;
     106}
     107
     108float rgbToLinearColorComponentNonClamping(float c)
     109{
     110    float sign = c > 0 ? 1.0f : -1.0f;
     111    c = std::abs(c);
     112
     113    if (c <= 0.04045f)
     114        return c / 12.92f * sign;
     115
     116    return std::pow((c + 0.055f) / 1.055f, 2.4f) * sign;
     117}
    96118
    97119LinearSRGBA<float> toLinearSRGBA(const SRGBA<float>& color)
    … …  
    105127}
    106128
     129LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const ExtendedSRGBA<float>& color)
     130{
     131    return {
     132        rgbToLinearColorComponentNonClamping(color.red),
     133        rgbToLinearColorComponentNonClamping(color.green),
     134        rgbToLinearColorComponentNonClamping(color.blue),
     135        color.alpha
     136    };
     137}
     138
    107139SRGBA<float> toSRGBA(const LinearSRGBA<float>& color)
    108140{
    … …  
    115147}
    116148
     149ExtendedSRGBA<float> toExtendedSRGBA(const LinearExtendedSRGBA<float>& color)
     150{
     151    return {
     152        linearToRGBColorComponentNonClamping(color.red),
     153        linearToRGBColorComponentNonClamping(color.green),
     154        linearToRGBColorComponentNonClamping(color.blue),
     155        color.alpha
     156    };
     157}
     158
    117159LinearDisplayP3<float> toLinearDisplayP3(const DisplayP3<float>& color)
    118160{
    … …  
    143185
    144186XYZA<float> toXYZA(const LinearSRGBA<float>& color)
     187{
     188    return makeFromComponentsClampingExceptAlpha<XYZA<float>>(linearSRGBToXYZMatrix.transformedColorComponents(asColorComponents(color)));
     189}
     190
     191LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const XYZA<float>& color)
     192{
     193    return makeFromComponentsClampingExceptAlpha<LinearExtendedSRGBA<float>>(xyzToLinearSRGBMatrix.transformedColorComponents(asColorComponents(color)));
     194}
     195
     196XYZA<float> toXYZA(const LinearExtendedSRGBA<float>& color)
    145197{
    146198    return makeFromComponentsClampingExceptAlpha<XYZA<float>>(linearSRGBToXYZMatrix.transformedColorComponents(asColorComponents(color)));
    … …  
    391443}
    392444
     445XYZA<float> toXYZA(const ExtendedSRGBA<float>& color)
     446{
     447    return toXYZA(toLinearExtendedSRGBA(color));
     448}
     449
     450ExtendedSRGBA<float> toExtendedSRGBA(const XYZA<float>& color)
     451{
     452    return toExtendedSRGBA(toLinearExtendedSRGBA(color));
     453}
     454
    393455XYZA<float> toXYZA(const DisplayP3<float>& color)
    394456{

  • trunk/Source/WebCore/platform/graphics/ColorConversion.h

    r271695 r271712  
    3333float linearToRGBColorComponentClamping(float);
    3434float rgbToLinearColorComponentClamping(float);
     35float linearToRGBColorComponentNonClamping(float);
     36float rgbToLinearColorComponentNonClamping(float);
    3537
    3638// All color types must at least implement the following conversions to and from the XYZA color space:
    … …  
    5052WEBCORE_EXPORT CMYKA<float> toCMYKA(const SRGBA<float>&);
    5153
     54// ExtendedSRGBA
     55WEBCORE_EXPORT XYZA<float> toXYZA(const ExtendedSRGBA<float>&);
     56WEBCORE_EXPORT ExtendedSRGBA<float> toExtendedSRGBA(const XYZA<float>&);
     57// Additions
     58WEBCORE_EXPORT LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const ExtendedSRGBA<float>&);
     59
    5260// LinearSRGBA
    5361WEBCORE_EXPORT XYZA<float> toXYZA(const LinearSRGBA<float>&);
    … …  
    5563// Additions
    5664WEBCORE_EXPORT SRGBA<float> toSRGBA(const LinearSRGBA<float>&);
     65
     66// LinearExtendedSRGBA
     67WEBCORE_EXPORT XYZA<float> toXYZA(const LinearExtendedSRGBA<float>&);
     68WEBCORE_EXPORT LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const XYZA<float>&);
     69// Additions
     70WEBCORE_EXPORT ExtendedSRGBA<float> toExtendedSRGBA(const LinearExtendedSRGBA<float>&);
    5771
    5872// DisplayP3
    … …  
    96110
    97111constexpr SRGBA<float> toSRGBA(const SRGBA<float>& color) { return color; }
     112constexpr ExtendedSRGBA<float> toExtendedSRGBA(const ExtendedSRGBA<float>& color) { return color; }
    98113constexpr LinearSRGBA<float> toLinearSRGBA(const LinearSRGBA<float>& color) { return color; }
     114constexpr LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const LinearExtendedSRGBA<float>& color) { return color; }
    99115constexpr DisplayP3<float> toDisplayP3(const DisplayP3<float>& color) { return color; }
    100116constexpr LinearDisplayP3<float> toLinearDisplayP3(const LinearDisplayP3<float>& color) { return color; }
    … …  
    116132}
    117133
     134template<typename T> ExtendedSRGBA<float> toExtendedSRGBA(const T& color)
     135{
     136    return toExtendedSRGBA(toXYZA(color));
     137}
     138
    118139template<typename T> LinearSRGBA<float> toLinearSRGBA(const T& color)
    119140{
    120141    return toLinearSRGBA(toXYZA(color));
     142}
     143
     144template<typename T> LinearExtendedSRGBA<float> toLinearExtendedSRGBA(const T& color)
     145{
     146    return toLinearExtendedSRGBA(toXYZA(color));
    121147}
    122148

  • trunk/Source/WebCore/platform/graphics/ColorTypes.h

    r271695 r271712  
    5050
    5151template<typename> struct RGBModel;
     52template<typename> struct ExtendedRGBModel;
    5253template<typename> struct LabModel;
    5354template<typename> struct LCHModel;
    … …  
    7273    } };
    7374    static constexpr bool isInvertible = true;
     75};
     76
     77template<> struct ExtendedRGBModel<float> {
     78    static constexpr std::array<ColorComponentRange<float>, 3> ranges { {
     79        { -std::numeric_limits<float>::infinity(), std::numeric_limits<float>::infinity() },
     80        { -std::numeric_limits<float>::infinity(), std::numeric_limits<float>::infinity() },
     81        { -std::numeric_limits<float>::infinity(), std::numeric_limits<float>::infinity() }
     82    } };
     83    static constexpr bool isInvertible = false;
    7484};
    7585
    … …  
    312322
    313323
     324template<typename T> struct ExtendedSRGBA : ColorWithAlphaHelper<ExtendedSRGBA<T>> {
     325    using ComponentType = T;
     326    using Model = ExtendedRGBModel<T>;
     327
     328    constexpr ExtendedSRGBA(T red, T green, T blue, T alpha = AlphaTraits<T>::opaque)
     329        : red { red }
     330        , green { green }
     331        , blue { blue }
     332        , alpha { alpha }
     333    {
     334    }
     335
     336    constexpr ExtendedSRGBA()
     337        : ExtendedSRGBA { 0, 0, 0, 0 }
     338    {
     339    }
     340
     341    T red;
     342    T green;
     343    T blue;
     344    T alpha;
     345};
     346
     347template<typename T> constexpr ColorComponents<T> asColorComponents(const ExtendedSRGBA<T>& c)
     348{
     349    return { c.red, c.green, c.blue, c.alpha };
     350}
     351
     352template<typename T> constexpr bool operator==(const ExtendedSRGBA<T>& a, const ExtendedSRGBA<T>& b)
     353{
     354    return asColorComponents(a) == asColorComponents(b);
     355}
     356
     357template<typename T> constexpr bool operator!=(const ExtendedSRGBA<T>& a, const ExtendedSRGBA<T>& b)
     358{
     359    return !(a == b);
     360}
     361
     362
    314363template<typename T> struct LinearSRGBA : ColorWithAlphaHelper<LinearSRGBA<T>> {
    315364    using ComponentType = T;
    … …  
    348397
    349398template<typename T> constexpr bool operator!=(const LinearSRGBA<T>& a, const LinearSRGBA<T>& b)
     399{
     400    return !(a == b);
     401}
     402
     403
     404template<typename T> struct LinearExtendedSRGBA : ColorWithAlphaHelper<LinearExtendedSRGBA<T>> {
     405    using ComponentType = T;
     406    using Model = ExtendedRGBModel<T>;
     407
     408    constexpr LinearExtendedSRGBA(T red, T green, T blue, T alpha = AlphaTraits<T>::opaque)
     409        : red { red }
     410        , green { green }
     411        , blue { blue }
     412        , alpha { alpha }
     413    {
     414    }
     415
     416    constexpr LinearExtendedSRGBA()
     417        : LinearExtendedSRGBA { 0, 0, 0, 0 }
     418    {
     419    }
     420
     421    T red;
     422    T green;
     423    T blue;
     424    T alpha;
     425};
     426
     427template<typename T> constexpr ColorComponents<T> asColorComponents(const LinearExtendedSRGBA<T>& c)
     428{
     429    return { c.red, c.green, c.blue, c.alpha };
     430}
     431
     432template<typename T> constexpr bool operator==(const LinearExtendedSRGBA<T>& a, const LinearExtendedSRGBA<T>& b)
     433{
     434    return asColorComponents(a) == asColorComponents(b);
     435}
     436
     437template<typename T> constexpr bool operator!=(const LinearExtendedSRGBA<T>& a, const LinearExtendedSRGBA<T>& b)
    350438{
    351439    return !(a == b);

  • trunk/Source/WebCore/platform/graphics/cg/ColorCG.cpp

    r271695 r271712  
    103103    // Some CG ports don't support all the color spaces required and return
    104104    // sRGBColorSpaceRef() for unsupported color spaces. In those cases, we
    105     // need to eagerly and potentially lossily convert the color into sRGB
    106     // ourselves before creating the CGColorRef.
     105    // need to eagerly convert the color into extended sRGB ourselves before
     106    // creating the CGColorRef.
     107    // FIXME: This is not a good way to indicate lack of support. Make this
     108    // more explicit.
    107109    if (colorSpace != ColorSpace::SRGB && cgColorSpace == sRGBColorSpaceRef()) {
    108         auto colorConvertedToSRGBA = callWithColorType(components, colorSpace, [] (const auto& color) {
    109             return toSRGBA(color);
     110        auto colorConvertedToExtendedSRGBA = callWithColorType(components, colorSpace, [] (const auto& color) {
     111            return toExtendedSRGBA(color);
    110112        });
    111         components = asColorComponents(colorConvertedToSRGBA);
     113        components = asColorComponents(colorConvertedToExtendedSRGBA);
     114        cgColorSpace = extendedSRGBColorSpaceRef();
    112115    }
    113116
Note: See TracChangeset for help on using the changeset viewer.