Google Git
Sign in
webkit / WebKit / e5ac428f86b502d0a55e1057ddc3502d378c384d
commite5ac428f86b502d0a55e1057ddc3502d378c384d[log] [tgz]
authorweinig@apple.com <weinig@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>Sat Nov 27 20:54:28 2021 +0000
committerweinig@apple.com <weinig@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>Sat Nov 27 20:54:28 2021 +0000
tree72448e8910b4d62a13d12f2066b1c9fff4de5269
parentb29b47bf2a382e61df15b6f25be342da393f3a19 [diff]
[CSS Color 4] Add support for oklab() and oklch() colors
https://bugs.webkit.org/show_bug.cgi?id=233507

Reviewed by Cameron McCormack.

LayoutTests/imported/w3c:

Add new tests for oklab() and oklch() based on the existing lab()
and lch() tests.

* web-platform-tests/css/css-color/oklab-001-expected.html: Added.
* web-platform-tests/css/css-color/oklab-001.html: Added.
* web-platform-tests/css/css-color/oklab-002-expected.html: Added.
* web-platform-tests/css/css-color/oklab-002.html: Added.
* web-platform-tests/css/css-color/oklab-003-expected.html: Added.
* web-platform-tests/css/css-color/oklab-003.html: Added.
* web-platform-tests/css/css-color/oklab-004-expected.html: Added.
* web-platform-tests/css/css-color/oklab-004.html: Added.
* web-platform-tests/css/css-color/oklab-005-expected.html: Added.
* web-platform-tests/css/css-color/oklab-005.html: Added.
* web-platform-tests/css/css-color/oklab-006-expected.html: Added.
* web-platform-tests/css/css-color/oklab-006.html: Added.
* web-platform-tests/css/css-color/oklab-007-expected.html: Added.
* web-platform-tests/css/css-color/oklab-007.html: Added.
* web-platform-tests/css/css-color/oklab-008-expected.html: Added.
* web-platform-tests/css/css-color/oklab-008.html: Added.
* web-platform-tests/css/css-color/oklch-001-expected.html: Added.
* web-platform-tests/css/css-color/oklch-001.html: Added.
* web-platform-tests/css/css-color/oklch-002-expected.html: Added.
* web-platform-tests/css/css-color/oklch-002.html: Added.
* web-platform-tests/css/css-color/oklch-003-expected.html: Added.
* web-platform-tests/css/css-color/oklch-003.html: Added.
* web-platform-tests/css/css-color/oklch-004-expected.html: Added.
* web-platform-tests/css/css-color/oklch-004.html: Added.
* web-platform-tests/css/css-color/oklch-005-expected.html: Added.
* web-platform-tests/css/css-color/oklch-005.html: Added.
* web-platform-tests/css/css-color/oklch-006-expected.html: Added.
* web-platform-tests/css/css-color/oklch-006.html: Added.
* web-platform-tests/css/css-color/oklch-007-expected.html: Added.
* web-platform-tests/css/css-color/oklch-007.html: Added.
* web-platform-tests/css/css-color/oklch-008-expected.html: Added.
* web-platform-tests/css/css-color/oklch-008.html: Added.

Source/WebCore:

Tests: imported/w3c/web-platform-tests/css/css-color/oklab-001.html
       imported/w3c/web-platform-tests/css/css-color/oklab-002.html
       imported/w3c/web-platform-tests/css/css-color/oklab-003.html
       imported/w3c/web-platform-tests/css/css-color/oklab-004.html
       imported/w3c/web-platform-tests/css/css-color/oklab-005.html
       imported/w3c/web-platform-tests/css/css-color/oklab-006.html
       imported/w3c/web-platform-tests/css/css-color/oklab-007.html
       imported/w3c/web-platform-tests/css/css-color/oklab-008.html
       imported/w3c/web-platform-tests/css/css-color/oklch-001.html
       imported/w3c/web-platform-tests/css/css-color/oklch-002.html
       imported/w3c/web-platform-tests/css/css-color/oklch-003.html
       imported/w3c/web-platform-tests/css/css-color/oklch-004.html
       imported/w3c/web-platform-tests/css/css-color/oklch-005.html
       imported/w3c/web-platform-tests/css/css-color/oklch-006.html
       imported/w3c/web-platform-tests/css/css-color/oklch-007.html
       imported/w3c/web-platform-tests/css/css-color/oklch-008.html

Adds support for oklab() and oklch() CSS colors and as interpolation
parameters for color-mix().

OKLab (and its polar form OKLCH) is a relatively new Lab-like colorspace that aims
to be an improved (improved hue linearity, hue uniformity, and chroma uniformity)
Lab. It was create by Björn Ottosson and is documented at https://bottosson.github.io/posts/oklab/.

* css/CSSValueKeywords.in:
Add 'oklab' and 'oklch' to the keyword list so they can be used as function
identifiers. Remove old mention of 'lab' in the color() function section,
since 'lab' is no longer a valid colorspace to use in the color() function
(rather, only lab() is supported).

* css/parser/CSSPropertyParserHelpers.cpp:
(WebCore::CSSPropertyParserHelpers::parseLabParameters):
(WebCore::CSSPropertyParserHelpers::parseRelativeLabParameters):
(WebCore::CSSPropertyParserHelpers::parseNonRelativeLabParameters):
(WebCore::CSSPropertyParserHelpers::parseLCHParameters):
(WebCore::CSSPropertyParserHelpers::parseRelativeLCHParameters):
(WebCore::CSSPropertyParserHelpers::parseNonRelativeLCHParameters):
(WebCore::CSSPropertyParserHelpers::parseColorFunction):
Generalize lab and lch function parsing to also support the oklab and
oklch variants (they have the same parsing rules).

(WebCore::CSSPropertyParserHelpers::consumeColorMixColorSpaceAndComma):
(WebCore::CSSPropertyParserHelpers::mixColorComponents):
Add support for using oklab and oklch as the interpolation space of a color-mix().
This was already generalized so all it meant doing was adding mappings of the
new identifiers to enums and mixColorComponentsInColorSpace calls.

* platform/graphics/ColorComponents.h:
(WebCore::ColorComponents::subset const):
Fix compile error (no one had used subset yet it seems). 'std::remove_const_t<decltype(T::Size)>'
was likely copied from mapColorComponents() where it is templatized and needs to deduce the loop
variable, but that is not needed here.

* platform/graphics/ColorConversion.cpp:
(WebCore::convertToPolarForm):
(WebCore::convertToRectangularForm):
Move conversion to/from polar/rectangular forms from the LCHA conversion
code here, so that it can be reused for OKLCHA.

(WebCore::OKLab<float>>::convert):
Add support for converting OKLab to/from XYZ D65. Matrix values come from https://bottosson.github.io/posts/oklab/
with updates from https://github.com/w3c/csswg-drafts/issues/6642#issuecomment-943521484

(WebCore::OKLCHA<float>>::convert):
Add support for converting OKLCHA. This is identical to the LCHA code above.

(WebCore::converColorComponents):
Add cases for new colorspaces.

* platform/graphics/ColorConversion.h:
Add converters for new colorspaces. Update diagram with them as well.

* platform/graphics/ColorMatrix.h:
(WebCore::ColorMatrix::transformedColorComponents const):
Generalize transformedColorComponents to work with any size ColorComponents object. This allows
the OKLab conversion code to be a bit simpler as it can operate on just the non-alpha components
in a more systematic way.

* platform/graphics/ColorModels.h:
Add new predicate template variables to help when needing to check what model a particular
color type uses.

* platform/graphics/ColorSerialization.cpp:
(WebCore::serialization):
(WebCore::serializationForCSS):
(WebCore::serializationForHTML):
(WebCore::serializationForRenderTreeAsText):
Add serialization support for new colorspaces. Also removes unused support for serializing lab
colors using the color(lab ...) syntax which has not been supported for some time.

* platform/graphics/ColorSpace.cpp:
* platform/graphics/ColorSpace.h:
* platform/graphics/cg/ColorSpaceCG.h:
Add OKLab and OKLCH to the list of enumerated colorspaces and add mappings to their
newly defined types OKLab<T> and OKLCHA<T>.

* platform/graphics/ColorTypes.h:
(WebCore::OKLab::OKLab):
(WebCore::OKLCHA::OKLCHA):
Add new types OKLab<T> and OKLCHA<T> (it looks like at some point an earlier version of this
must have partially landed as there were existing forward declarations). Like Lab<T> and LCHA<T>,
these new types use the LabModel<T> and LCHModel<T> models, but unlike them they use a whitepoint
of D65.

* platform/graphics/ColorUtilities.h:
Generalize isBlack and isWhite to have a variant that works with Lab, LCH, OKLab and OKLCH (as they
all are identical) using SFINAE, use the new model predicates to make this more clear.

LayoutTests:

Update existing tests for lab() and lch() to also test oklab() and oklch().
As they have the same parsing rules, this is mostly done by templatizing
the tests and running them in a loop.

* fast/css/parsing-color-mix-expected.txt:
* fast/css/parsing-color-mix.html:
* fast/css/parsing-lab-colors-expected.txt:
* fast/css/parsing-lab-colors.html:
* fast/css/parsing-relative-color-syntax-expected.txt:
* fast/css/parsing-relative-color-syntax.html:


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@286191 268f45cc-cd09-0410-ab3c-d52691b4dbfc
54 files changed
tree: 72448e8910b4d62a13d12f2066b1c9fff4de5269
  1. JSTests/
  2. LayoutTests/
  3. ManualTests/
  4. metadata/
  5. PerformanceTests/
  6. resources/
  7. Source/
  8. Tools/
  9. WebDriverTests/
  10. WebKit.xcworkspace/
  11. WebKitLibraries/
  12. Websites/
  13. .ccls
  14. .clang-format
  15. .dir-locals.el
  16. .editorconfig
  17. .gitattributes
  18. .gitignore
  19. ChangeLog
  20. ChangeLog-2012-05-22
  21. ChangeLog-2018-01-01
  22. CMakeLists.txt
  23. Introduction.md
  24. Makefile
  25. Makefile.shared
  26. ReadMe.md
ReadMe.md

WebKit

WebKit is a cross-platform web browser engine. On iOS and macOS, it powers Safari, Mail, iBooks, and many other applications.

Feature Status

Visit WebKit Feature Status page to see which Web API has been implemented, in development, or under consideration.

Trying the Latest

On macOS, download Safari Technology Preview to test the latest version of WebKit. On Linux, download Epiphany Technology Preview. On Windows, you'll have to build it yourself.

Reporting Bugs

  1. Search WebKit Bugzilla to see if there is an existing report for the bug you've encountered.
  2. Create a Bugzilla account to to report bugs (and to comment on them) if you haven't done so already.
  3. File a bug in accordance with our guidelines.

Once your bug is filed, you will receive email when it is updated at each stage in the bug life cycle. After the bug is considered fixed, you may be asked to download the latest nightly and confirm that the fix works for you.

Getting the Code

On Windows, follow the instructions on our website.

Cloning the Git SVN Repository

Run the following command to clone WebKit's Git SVN repository:

git clone git@github.com:WebKit/WebKit.git WebKit

or

git clone https://github.com/WebKit/WebKit.git WebKit

If you want to be able to track Subversion revision from your git checkout, you can run the following command to do so:

Tools/Scripts/git-webkit setup-git-svn

For information about this, and other aspects of using Git with WebKit, read the wiki page.

Checking out the Subversion Repository

If you don‘t want to use Git, run the following command to check out WebKit’s Subversion repository:

svn checkout https://svn.webkit.org/repository/webkit/trunk WebKit

Building WebKit

Building macOS Port

Install Xcode and its command line tools if you haven't done so already:

  1. Install Xcode Get Xcode from https://developer.apple.com/downloads. To build WebKit for OS X, Xcode 5.1.1 or later is required. To build WebKit for iOS Simulator, Xcode 7 or later is required.
  2. Install the Xcode Command Line Tools In Terminal, run the command: xcode-select --install

Run the following command to build a debug build with debugging symbols and assertions:

Tools/Scripts/build-webkit --debug

For performance testing, and other purposes, use --release instead.

Using Xcode

You can open WebKit.xcworkspace to build and debug WebKit within Xcode.

If you don't use a custom build location in Xcode preferences, you have to update the workspace settings to use WebKitBuild directory. In menu bar, choose File > Workspace Settings, then click the Advanced button, select “Custom”, “Relative to Workspace”, and enter WebKitBuild for both Products and Intermediates.

Embedded Builds

iOS, tvOS and watchOS are all considered embedded builds. The first time after you install a new Xcode, you will need to run:

sudo Tools/Scripts/configure-xcode-for-embedded-development

Without this step, you will see the error message: “target specifies product type ‘com.apple.product-type.tool’, but there’s no such product type for the ‘iphonesimulator’ platform.” when building target JSCLLIntOffsetsExtractor of project JavaScriptCore.

Run the following command to build a debug build with debugging symbols and assertions for embededded simulators:

Tools/Scripts/build-webkit --debug --<platform>-simulator

or embedded devices:

Tools/Scripts/build-webkit --debug --<platform>-device

where platform is ios, tvos or watchos.

Building the GTK+ Port

For production builds:

cmake -DPORT=GTK -DCMAKE_BUILD_TYPE=RelWithDebInfo -GNinja
ninja
sudo ninja install

For development builds:

Tools/gtk/install-dependencies
Tools/Scripts/update-webkitgtk-libs
Tools/Scripts/build-webkit --gtk --debug

For more information on building WebKitGTK+, see the wiki page.

Building the WPE Port

For production builds:

cmake -DPORT=WPE -DCMAKE_BUILD_TYPE=RelWithDebInfo -GNinja
ninja
sudo ninja install

For development builds:

Tools/wpe/install-dependencies
Tools/Scripts/update-webkitwpe-libs
Tools/Scripts/build-webkit --wpe --debug

Building Windows Port

For building WebKit on Windows, see the wiki page.

Running WebKit

With Safari and Other macOS Applications

Run the following command to launch Safari with your local build of WebKit:

Tools/Scripts/run-safari --debug

The run-safari script sets the DYLD_FRAMEWORK_PATH environment variable to point to your build products, and then launches /Applications/Safari.app. DYLD_FRAMEWORK_PATH tells the system loader to prefer your build products over the frameworks installed in /System/Library/Frameworks.

To run other applications with your local build of WebKit, run the following command:

Tools/Scripts/run-webkit-app <application-path>

iOS Simulator

Run the following command to launch iOS simulator with your local build of WebKit:

run-safari --debug --ios-simulator

In both cases, if you have built release builds instead, use --release instead of --debug.

Linux Ports

If you have a development build, you can use the run-minibrowser script, e.g.:

run-minibrowser --debug --wpe

Pass one of --gtk, --jsc-only, or --wpe to indicate the port to use.

Contribute

Congratulations! You’re up and running. Now you can begin coding in WebKit and contribute your fixes and new features to the project. For details on submitting your code to the project, read Contributing Code.