Bug 255159

Summary: text-decoration-skip-ink behaves inconsistently even when specifying "all"
Product: WebKit Reporter: Nick Heer <nick>
Component: TextAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: mmaxfield, mustafa.0x, nick, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 16   
Hardware: All   
OS: Unspecified   
Attachments:
Description Flags
Screenshot showing expected behaviour (in green) and incorrect behaviour (in red) on same page none

Description Nick Heer 2023-04-07 10:25:14 PDT
Created attachment 465811 [details]
Screenshot showing expected behaviour (in green) and incorrect behaviour (in red) on same page

When using text-decoration-skip-ink:auto or :all, the text-decoration sometimes still clashes with descenders. 

It is an inconsistent bug. Sometimes, I see both the correct and incorrect behaviours within the same page, as in the attached screenshot (website is my own, https://pxlnv.com). In this case, bold text appears to be composited correctly but normal weight text is not.

I assumed this was due to the font-weight or size, but it does not appear to be the case. Playing with this CodePen (https://codepen.io/andyadams/pen/YMKqrN) indicates text-decoration-skip-ink will behave as expected in Safari even down to very small font sizes of about 9px.

Furthermore, upon refresh, even the bold text shown in the attached screenshot will sometimes composite unexpectedly.

I have tried text-decoration-skip-ink:auto and text-decoration-skip-ink:all. Both are inconsistent. I have been able to reproduce this in Safari Version 16.4 (18615.1.26.11.22) and Safari Technology Preview Release 167 (Safari 16.4, WebKit 18616.1.8.2) on MacOS 13.3 (22E252), and in Safari up to iOS 16.5 (20F5028e).

For comparison, text-decoration-skip-link behaves expectedly in Chrome running on the same MacOS system.
Comment 1 Radar WebKit Bug Importer 2023-04-14 10:26:22 PDT
<rdar://problem/108055472>
Comment 2 mustafa.0x 2023-10-05 11:28:48 PDT
Reproduced when using custom font. With some fiddling in dev tools it rerenders correctly. Not that that is helpful.
Comment 3 mustafa.0x 2023-10-05 11:39:49 PDT
Removing `unicode-range` from the custom font seems to improve chances of it rendering correctly.