Bug 169125

Summary: background-clip:text doesn't work with display:flex
Product: WebKit Reporter: Marke <marke>
Component: CSSAssignee: Antti Koivisto <koivisto>
Status: RESOLVED FIXED    
Severity: Normal CC: bfulgham, changseok, clopez, esprehn+autocc, ews-watchlist, ghommey, glenn, info, koivisto, kondapallykalyan, mmaxfield, mnichu, pdr, simon.fraser, webkit-bug-importer, youennf
Priority: P2 Keywords: InRadar
Version: Safari 10   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Video of the Bug
none
Patch
none
Patch none

Marke
Reported 2017-03-03 02:32:05 PST
When display:flex is enabled, text image mask stops working. <!DOCTYPE html> <html> <head> <style> div { /* display: flex; */ font-size: 80px; color: transparent; background: url(mask.jpg); -webkit-background-clip: text; } </style> </head> <body> <div>Masked</div> </body> </html>
Attachments
Video of the Bug (473.46 KB, video/mp4)
2019-09-05 07:13 PDT, Jan Nicklas 		no flags
Details
Patch (1.89 KB, patch)
2022-03-15 07:43 PDT, Antti Koivisto 		no flags
DetailsFormatted DiffDiff
Patch (5.43 KB, patch)
2022-03-15 08:49 PDT, Antti Koivisto 		no flags
DetailsFormatted DiffDiff
Show Obsolete (1) View All Add attachment proposed patch, testcase, etc.
Jan Nicklas
Comment 1 2019-09-05 07:13:04 PDT
Created attachment 378080 [details] Video of the Bug The described behaviour is still happening for Safari 12. Text with display:flex and background-clip is not visible. Firefox and Chrome work as expected
Mike
Comment 2 2020-12-17 00:42:26 PST
Safari 14 has the same problem too. And I think it will stay that way 🤔
Radar WebKit Bug Importer
Comment 3 2020-12-17 10:54:37 PST
<rdar://problem/72432683>
Frank Topel
Comment 4 2021-12-02 08:34:00 PST
What's the progress on this?
Antti Koivisto
Comment 5 2022-03-15 07:43:32 PDT
Created attachment 454706 [details] Patch
Antti Koivisto
Comment 6 2022-03-15 08:49:56 PDT
Created attachment 454711 [details] Patch
EWS Watchlist
Comment 7 2022-03-15 08:51:33 PDT
This patch modifies the imported WPT tests. Please ensure that any changes on the tests (not coming from a WPT import) are exported to WPT. Please see https://trac.webkit.org/wiki/WPTExportProcess
EWS
Comment 8 2022-03-15 10:37:28 PDT
Committed r291303 (248442@main): <https://commits.webkit.org/248442@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 454711 [details].
Brent Fulgham
Comment 9 2022-05-26 14:51:13 PDT
This fix shipped with Safari 15.5 (all platforms).
Note You need to log in before you can comment on or make changes to this bug.