Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
<!DOCTYPE html><!-- webkit-test-runner [ CSSColorMixEnabled=true ] -->
|
|
|
|
|
<html>
|
|
|
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<script>
|
|
|
|
|
description("Test the parsing of CSS Color 5 color-mix().");
|
|
|
|
|
|
|
|
|
|
function computedStyle(property, value)
|
|
|
|
|
{
|
|
|
|
|
var div = document.createElement("div");
|
|
|
|
|
document.body.appendChild(div);
|
|
|
|
|
div.style.setProperty(property, value);
|
|
|
|
|
var computedValue = getComputedStyle(div).getPropertyValue(property);
|
|
|
|
|
document.body.removeChild(div);
|
|
|
|
|
return computedValue;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function testComputedProperty(property, value, expected)
|
|
|
|
|
{
|
|
|
|
|
shouldBeEqualToString('computedStyle("' + property + '", "' + value + '")', expected);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function testComputed(value, expected)
|
|
|
|
|
{
|
|
|
|
|
testComputedProperty("background-color", value, expected);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
debug('color-mix(hsl, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%), hsl(30deg 30% 40%))`, `rgb(84, 92, 61)`); // hsl(75deg 20% 30%)
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) 25%, hsl(30deg 30% 40%))`, `rgb(112, 106, 67)`);
|
|
|
|
|
testComputed(`color-mix(in hsl, 25% hsl(120deg 10% 20%), hsl(30deg 30% 40%))`, `rgb(112, 106, 67)`);
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%), 25% hsl(30deg 30% 40%))`, `rgb(61, 73, 54)`);
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%), hsl(30deg 30% 40%) 25%)`, `rgb(61, 73, 54)`);
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) 25%, hsl(30deg 30% 40%) 75%)`, `rgb(112, 106, 67)`);
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) 50%, hsl(30deg 30% 40%) 150%)`, `rgb(112, 106, 67)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) 12.5%, hsl(30deg 30% 40%) 37.5%)`, `rgb(112, 106, 67)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) 0%, hsl(30deg 30% 40%))`, `rgb(133, 102, 71)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in hsl, hsl(120deg 10% 20%) -10%, hsl(30deg 30% 40%))`, `rgb(142, 97, 72)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
debug('');
|
|
|
|
|
debug('color-mix(hwb, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%), hwb(30deg 30% 40%))`, `rgb(147, 179, 52)`); // hwb(75deg 20% 30%)
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) 25%, hwb(30deg 30% 40%))`, `rgb(166, 153, 64)`);
|
|
|
|
|
testComputed(`color-mix(in hwb, 25% hwb(120deg 10% 20%), hwb(30deg 30% 40%))`, `rgb(166, 153, 64)`);
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%), 25% hwb(30deg 30% 40%))`, `rgb(96, 191, 39)`);
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%), hwb(30deg 30% 40%) 25%)`, `rgb(96, 191, 39)`);
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) 25%, hwb(30deg 30% 40%) 75%)`, `rgb(166, 153, 64)`);
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) 50%, hwb(30deg 30% 40%) 150%)`, `rgb(166, 153, 64)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) 12.5%, hwb(30deg 30% 40%) 37.5%)`, `rgb(166, 153, 64)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) 0%, hwb(30deg 30% 40%))`, `rgb(153, 115, 77)`);
|
|
|
|
|
|
|
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in hwb, hwb(120deg 10% 20%) -10%, hwb(30deg 30% 40%))`, `rgb(148, 105, 82)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
debug('');
|
|
|
|
|
debug('color-mix(lch, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4), lch(50% 60 70deg / .8))`, `lch(30% 40 50 / 0.6)`);
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) 25%, lch(50% 60 70deg / .8))`, `lch(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lch, 25% lch(10% 20 30deg / .4), lch(50% 60 70deg / .8))`, `lch(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4), 25% lch(50% 60 70deg / .8))`, `lch(20% 30 40 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4), lch(50% 60 70deg / .8) 25%)`, `lch(20% 30 40 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) 25%, lch(50% 60 70deg / .8) 75%)`, `lch(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) 50%, lch(50% 60 70deg / .8) 150%)`, `lch(40% 50 60 / 0.7)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) 12.5%, lch(50% 60 70deg / .8) 37.5%)`, `lch(40% 50 60 / 0.7)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) 0%, lch(50% 60 70deg / .8))`, `lch(50% 60 70 / 0.8)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in lch, lch(10% 20 30deg / .4) -10%, lch(50% 60 70deg / .8))`, `lch(54% 64 74 / 0.84000003)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
debug('');
|
|
|
|
|
debug('color-mix(lab, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4), lab(50% 60 70 / .8))`, `lab(30% 40 50 / 0.6)`);
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) 25%, lab(50% 60 70 / .8))`, `lab(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lab, 25% lab(10% 20 30 / .4), lab(50% 60 70 / .8))`, `lab(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4), 25% lab(50% 60 70 / .8))`, `lab(20% 30 40 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4), lab(50% 60 70 / .8) 25%)`, `lab(20% 30 40 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) 25%, lab(50% 60 70 / .8) 75%)`, `lab(40% 50 60 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) 50%, lab(50% 60 70 / .8) 150%)`, `lab(40% 50 60 / 0.7)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) 12.5%, lab(50% 60 70 / .8) 37.5%)`, `lab(40% 50 60 / 0.7)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) 0%, lab(50% 60 70 / .8))`, `lab(50% 60 70 / 0.8)`);
|
|
|
|
|
|
|
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in lab, lab(10% 20 30 / .4) -10%, lab(50% 60 70 / .8))`, `lab(54% 64 74 / 0.84000003)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
|
|
|
|
debug('');
|
|
|
|
|
debug('color-mix(srgb, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4), color(srgb .5 .6 .7 / .8))`, `color(srgb 0.3 0.4 0.5 / 0.6)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) 25%, color(srgb .5 .6 .7 / .8))`, `color(srgb 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, 25% color(srgb .1 .2 .3 / .4), color(srgb .5 .6 .7 / .8))`, `color(srgb 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4), 25% color(srgb .5 .6 .7 / .8))`, `color(srgb 0.2 0.3 0.4 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4), color(srgb .5 .6 .7 / .8) 25%)`, `color(srgb 0.2 0.3 0.4 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) 25%, color(srgb .5 .6 .7 / .8) 75%)`, `color(srgb 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) 50%, color(srgb .5 .6 .7 / .8) 150%)`, `color(srgb 0.4 0.5 0.6 / 0.7)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) 12.5%, color(srgb .5 .6 .7 / .8) 37.5%)`, `color(srgb 0.4 0.5 0.6 / 0.7)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) 0%, color(srgb .5 .6 .7 / .8))`, `color(srgb 0.5 0.6 0.7 / 0.8)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in srgb, color(srgb .1 .2 .3 / .4) -10%, color(srgb .5 .6 .7 / .8))`, `color(srgb 0.54 0.64000005 0.74 / 0.84000003)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
debug('');
|
|
|
|
|
debug('color-mix(xyz, ...)');
|
|
|
|
|
|
2021-03-24 17:34:50 +00:00
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4), color(xyz .5 .6 .7 / .8))`, `color(xyz 0.3 0.4 0.5 / 0.6)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) 25%, color(xyz .5 .6 .7 / .8))`, `color(xyz 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, 25% color(xyz .1 .2 .3 / .4), color(xyz .5 .6 .7 / .8))`, `color(xyz 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4), color(xyz .5 .6 .7 / .8) 25%)`, `color(xyz 0.2 0.3 0.4 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4), 25% color(xyz .5 .6 .7 / .8))`, `color(xyz 0.2 0.3 0.4 / 0.5)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) 25%, color(xyz .5 .6 .7 / .8) 75%)`, `color(xyz 0.4 0.5 0.6 / 0.7)`);
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) 50%, color(xyz .5 .6 .7 / .8) 150%)`, `color(xyz 0.4 0.5 0.6 / 0.7)`); // Scale down > 100% sum.
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) 12.5%, color(xyz .5 .6 .7 / .8) 37.5%)`, `color(xyz 0.4 0.5 0.6 / 0.7)`); // Scale up < 100% sum.
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) 0%, color(xyz .5 .6 .7 / .8))`, `color(xyz 0.5 0.6 0.7 / 0.8)`);
|
|
|
|
|
|
|
|
|
|
// What should happen if you provide a negative percent? https://github.com/w3c/csswg-drafts/issues/6047
|
|
|
|
|
testComputed(`color-mix(in xyz, color(xyz .1 .2 .3 / .4) -10%, color(xyz .5 .6 .7 / .8))`, `color(xyz 0.54 0.64000005 0.74 / 0.84000003)`);
|
Add experimental support for CSS Color 5 color-mix()
https://bugs.webkit.org/show_bug.cgi?id=222258
Reviewed by Antti Koivisto.
Source/WebCore:
Adds initial support for CSS Color 5 color-mix() - https://drafts.csswg.org/css-color-5/#color-mix
This feature is off by default and can be enabled via the CSSColorMixEnabled
experimental preference flag.
This implementation has the same restriction on it that the recently landed
Relative Color Syntax does in that it does support system colors or currentColor
as input, since those can't be resolved at parse time. Ultimately, we will need
to add a late binding version of this for those cases.
Test: fast/css/parsing-color-mix.html
* css/CSSValueKeywords.in:
Add new keywords needed for color-mix().
* css/parser/CSSParserContext.cpp:
(WebCore::operator==):
* css/parser/CSSParserContext.h:
(WebCore::CSSParserContextHash::hash):
Add new setting for color-mix().
* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::fixupAnglesForInterpolation):
(WebCore::CSSPropertyParserHelpers::HueColorAdjuster::HueColorAdjuster):
(WebCore::CSSPropertyParserHelpers::ColorAdjuster::ColorAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjusterAtIndex):
(WebCore::CSSPropertyParserHelpers::consumeAndUpdateAdjuster):
(WebCore::CSSPropertyParserHelpers::consumeAdjusters):
(WebCore::CSSPropertyParserHelpers::consumeMixComponents):
(WebCore::CSSPropertyParserHelpers::normalizeAdjusterValues):
(WebCore::CSSPropertyParserHelpers::remainingAdjustment):
(WebCore::CSSPropertyParserHelpers::mixComponent):
(WebCore::CSSPropertyParserHelpers::mixComponentAtIndex):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix):
(WebCore::CSSPropertyParserHelpers::makeColorTypeByNormalizingComponentsAfterMix<HWBA<float>>):
(WebCore::CSSPropertyParserHelpers::mix):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParametersUsingAdjusters):
(WebCore::CSSPropertyParserHelpers::parseColorMixFunctionParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
The implementation uses a templatized ColorAdjuster struct to declartively map the
various mixing color spaces to their allowed adjusters and what type those adjusters
operate on (either double or the hue specific HueColorAdjuster). For example, for
LCHA we have:
using LCHColorAdjuster = ColorAdjuster<LCHA<float>, CSSValueLightness, double, CSSValueChroma, HueColorAdjuster, CSSValueHue, double, CSSValueAlpha, double>;
which indicates:
- it creates a LCHA<float> and will operate on LCHA<float> values
- its first channel is called "lightness" and is a double
- its second channel is called "chroma" and is a double
- its third channel is called "hue" and is a HueColorAdjuster
- its fourth channel is called "alpha" and is a double
This data is then used by the parsing and mixing functions to implement mixing without
having to write specific implementations for each mixing color space and can be expanded
to more spaces if needed.
* platform/graphics/Color.h:
(WebCore::Color::Color):
Add new overloaded constructor for a generic Optional<ColorType<float>> which parallels the existing
Optional<SRGBA<uint8_t>> allowing callers to convert WTF::nullopt to an invalid Color without checking
for nullopt themselves.
Source/WTF:
* Scripts/Preferences/WebPreferencesExperimental.yaml:
Add new experimental preference for CSS Color 5 color-mix()
which is off by default.
LayoutTests:
* fast/css/parsing-color-mix-expected.txt: Added.
* fast/css/parsing-color-mix.html: Added.
Add parsing and computed style computation tests for color-mix().
Canonical link: https://commits.webkit.org/234430@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@273244 268f45cc-cd09-0410-ab3c-d52691b4dbfc
2021-02-22 17:52:13 +00:00
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|