Intent to Implement: CSS text-decoration-width

[Charlie Marlow]

Intent to Implement: CSS text-decoration-width

Summary: text-decoration-width allows web developers to specify a specific thickness of an underline, overline, or line-through text-decoration. This allows web developers to have greater control over the look and style of their web pages.

Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1440014 <https://bugzilla.mozilla.org/show_bug.cgi?id=1552062>

Spec: https://drafts.csswg.org/css-text-decor-4/#text-decoration-width-property <https://drafts.csswg.org/css-text-decor-4/#underline-offset>

Platform coverage: All platforms using gecko rendering engine

Estimated release to mozilla-central: next 1-2 weeks

Preference behind which this will be implemented:
layout.css.text-decoration-width.enabled

Is this feature enabled by default in sandboxed frames? Yes

DevTools bug: None needed

Support in other browsers: Safari Technology Preview is the only other browser supporting this feature

Web-platform-tests:
- parsing tests: https://searchfox.org/mozilla-central/source/testing/web-platform/tests/css/css-text-decor <https://searchfox.org/mozilla-central/source/testing/web-platform/tests/css/css-text-decor>
- text-decoration-width-* tests
- Ref tests: https://bugzilla.mozilla.org/show_bug.cgi?id=1558899

- Charlie Marlow

[cma...@mozilla.com]

This property has been renamed text-decoration-thickness by the CSSWG. We will be updating the property name per the spec change here: https://github.com/w3c/csswg-drafts/commit/ffbfa0685c9a1714411b19c0b4abab6a01d5bd48

- Charlie Marlow

[fri...@jeka.info]

> Support in other browsers: Safari Technology Preview is the only other browser supporting this feature

Chrome support:
https://wpt.fyi/results/css/css-text-decor/text-decoration-width-001.html?label=master&label=experimental

Seems other browsers made the same error (implementing text-decoration-width instead of text-decoration-thickness)

Any change to stop them? Filing bugs?

There are WPT for text-decoration-width.
Shouldn't those be removed?
Should there be a negative test?

[cma...@mozilla.com]

We’ve changed the name of those tests and swapped out text-decoration-width with text-decoration-thickness. Those changes will be pushed tonight.

It doesn’t look like Chrome has actually implemented this feature yet. The test passes because of a bug in the test (text-decoration-skip-ink: none needs to be added to the test and non-reference case). The reason why Nightly has it showing as fail is most likely an issue with wpt.fyi (likely because it doesn’t flip the pref in our .ini file).

There is currently an open Chrome bug for this feature, using the correct name of text-decoration-thickness https://bugs.chromium.org/p/chromium/issues/detail?id=785230