Intent to Prototype: CSS Masking

[Philip Rogers]

Contact emails

p...@chromium.org, tca...@chromium.org, yo...@chromium.org

Specification

https://www.w3.org/TR/css-masking-1

Design docs

https://developer.mozilla.org/en-US/docs/Web/CSS/mask

Summary

CSS mask, and related properties such as mask-image, mask-mode, etc, are used to hide an element (partially or fully) by masking or clipping the image at specific points. This feature unprefixes the "mask" properties (mask, mask-clip, mask-composite, mask-image, mask-mode, mask-origin, mask-position, mask-repeat, and mask-size) and brings the implementation up to spec.

Blink component

Blink>CSS

TAG review

None

TAG review status

Not applicable

Risks

Interoperability and Compatibility

At this stage we have two areas of risk: 1. It is not yet known which implementation changes will be included, and the prototype will help us understand this. 2. There is web compat risk in shipping changes to this existing feature.

Gecko: Shipped/Shipping Firefox has nearly 100% pass rate on css-masking WPT tests.

WebKit: Shipped/Shipping Safari has shipped much of the unprefixing of these properties (https://bugs.webkit.org/show_bug.cgi?id=229082), as well as many implementation improvements, but some interop fixes are still in development.

Web developers: Positive (https://github.com/web-platform-tests/interop/issues/148) This is part of interop-2023.

Other signals:

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

None

Goals for experimentation

Ongoing technical constraints

None

Debuggability

Basic debugging support with existing CSS support in devtools.

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?

Yes

Is this feature fully tested by web-platform-tests?

Yes

Flag name on chrome://flags

None

Finch feature name

CSSMaskingInterop

Requires code in //chrome?

False

Tracking bug

https://crbug.com/1418401

Estimated milestones

Shipping on desktop	120
DevTrial on desktop	120

Shipping on Android	120
DevTrial on Android	120

Shipping on WebView

120

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5177265994596352

This intent message was generated by Chrome Platform Status.