Closed Bug 1411922 Opened 2 years ago Closed 2 months ago

[css-text-decor-4] Implement text-decoration-skip-ink

Categories

(Core :: Layout: Block and Inline, enhancement, P3)

enhancement

Tracking

()

VERIFIED FIXED
mozilla70
Tracking Status
firefox58 --- wontfix
firefox70 --- fixed

People

(Reporter: sebo, Assigned: cmarlow)

References

(Blocks 3 open bugs, )

Details

(5 keywords, Whiteboard: [DevRel:P1][layout:backlog:2019q3][wptsync upstream])

Attachments

(2 files)

This bug is meant for the implementation of the text-decoration-skip-ink property defined in the CSS Text Decoration Module Level 4:

https://drafts.csswg.org/css-text-decor-4/#text-decoration-skip-ink-property
[EDIT by dholbert: updating link to point to "*-skip-ink" rather than more-general hypothetical "*-skip" property]

Google intends to ship support for it in Chrome:
https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/47BHtmz0jVY

Sebastian
Summary: Implement CSS3 text decoration text-decoration-skip → Implement CSS4 text decoration text-decoration-skip-ink
Status: NEW → RESOLVED
Closed: 2 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 812990
Status: RESOLVED → REOPENED
Resolution: DUPLICATE → ---
Summary: Implement CSS4 text decoration text-decoration-skip-ink → [css-text-decor-4] Implement text-decoration-skip-ink
Blocks: 1415712
Chrome beta has implemented this and skips ink for underlined text automatically.
Paul Irish created an interactive example for text-decoration-skip-ink on MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration-skip-ink
Duplicate of this bug: 1019448
Duplicate of this bug: 1474577
Priority: -- → P3
Blocks: 812990
No longer blocks: 812990

As https://bugs.chromium.org/p/chromium/issues/detail?id=581456 it is implemented and made default later so now Chrome (Opera/Edge) and Safari supports it but Firefox don't.

Whiteboard: [DevRel:P1] → [DevRel:P1][layout:backlog:2019q3]

A couple notes that may be helpful as a starting point:

See https://bugs.chromium.org/p/chromium/issues/detail?id=581456#c24 for
the heart of Blink's implementation. In brief, if skip-ink is in effect,
the InlineTextBoxPainter::paintDecorations method calls
TextPainter::clipDecorationsStripe each time it's going to paint a
decoration line. This is responsible for getting the "intercepts"
(coordinates where the glyph outlines in the text run intersect with the
intended decoration line) and clipping out those areas.

For where the ability to get intercepts (based on Skia APIs) was added
to Chromium's Font, see
https://bugs.chromium.org/p/chromium/issues/detail?id=655166.

See also https://bugs.chromium.org/p/chromium/issues/detail?id=581456#c8
for a link back to the underlying Skia facilities they're using.

Assignee: nobody → charles.w.marlow
Depends on: 1561131

I'll also note that the spec is not entirely up-to-date or worked out on this feature. :( Don't expect it to be a reliable reference.

Attachment #9080670 - Attachment description: Bug 1411922: Add rendering support for text-decoration-skip-ink → Bug 1411922: Add rendering support for text-decoration-skip-ink r?jfkthame
Attachment #9080670 - Attachment description: Bug 1411922: Add rendering support for text-decoration-skip-ink r?jfkthame → Bug 1411922: Part 1: Add rendering support for text-decoration-skip-ink r?jfkthame
Pushed by dholbert@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/61f08c7faaca
Part 1: Add rendering support for text-decoration-skip-ink r=jfkthame
https://hg.mozilla.org/integration/autoland/rev/5a8a2d0bc859
Part 2: Added reftests for text-decoration-skip-ink r=jfkthame
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/18318 for changes under testing/web-platform/tests
Whiteboard: [DevRel:P1][layout:backlog:2019q3] → [DevRel:P1][layout:backlog:2019q3][wptsync upstream]
Upstream web-platform-tests status checks passed, PR will merge once commit reaches central.
Status: REOPENED → RESOLVED
Closed: 2 years ago2 months ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla70
Upstream PR merged

I've tested the feature right now in the latest Nightly and at first sight it looks great! Thank you for implementing it!

I've also already created a PR for updating the browser compatibility info on MDN:
https://github.com/mdn/browser-compat-data/pull/4587

And I have updated https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Experimental_features#text-decoration-skip-ink accordingly.

Charlie, do you plan to ship this in 70 or are there any things this should wait for?

Sebastian

Status: RESOLVED → VERIFIED
Flags: needinfo?(charles.w.marlow)

We are planning to wait to ship it in Firefox 71. Because it's on by default, we want to have a full cycle to monitor potential performance issues. Thanks for updating the MDN pages!

Flags: needinfo?(charles.w.marlow)

Maybe better enable that in Nightly since now, so that you have an even longer time to monitor issues.

Regressions: 1572709

(In reply to Xidorn Quan [:xidorn] UTC+10 from comment #21)

Maybe better enable that in Nightly since now, so that you have an even longer time to monitor issues.

Good idea. I filed bug 1572800 on doing this.

(In reply to Daniel Holbert [:dholbert] (mostly AFK Aug 8th-12th) from comment #22)

(In reply to Xidorn Quan [:xidorn] UTC+10 from comment #21)

Maybe better enable that in Nightly since now, so that you have an even longer time to monitor issues.

Good idea. I filed bug 1572800 on doing this.

Yes, let's please do this. We won't have much time in the Nightly cycle at this point since soft freeze is only a few weeks away, but better than nothing.

Depends on: 1574811
Regressions: 1575908
You need to log in before you can comment on or make changes to this bug.