RESOLVED DUPLICATE of bug 235106237077
mix-blend-mode renders incorrect color after the underlying layer's layout changed
https://bugs.webkit.org/show_bug.cgi?id=237077
Summary mix-blend-mode renders incorrect color after the underlying layer's layout ch...
chu-vevo
Reported 2022-02-23 03:09:06 PST
I was building a website for a company and I use a layer with full-height linear-gradient plus mix blend mode to apply some change when scrolling. And I have this JS resize observer to change the CSS of the underlying layer once the window width-height ratio crossed 1:1. In Safari, this leads to muddy color rendering once the CSS changed, and it will stay that way until a page refresh. Please see the attachments for the description. And this is the website preview link, I'm authorized to file this bug using the link: https://62160a3454422e00075c955c--connect3-web.netlify.app
Attachments
Correct render before the CSS change (1.09 MB, image/png)
2022-02-23 03:09 PST, chu-vevo
no flags
Render broke after the CSS change (403.71 KB, image/png)
2022-02-23 03:10 PST, chu-vevo
no flags
This persist after resize to a wider window (2.39 MB, image/png)
2022-02-23 03:10 PST, chu-vevo
no flags
Correct color of the wider window version (1.29 MB, image/png)
2022-02-23 03:11 PST, chu-vevo
no flags
chu-vevo
Comment 1 2022-02-23 03:09:40 PST
Created attachment 452956 [details] Correct render before the CSS change
chu-vevo
Comment 2 2022-02-23 03:10:02 PST
Created attachment 452957 [details] Render broke after the CSS change
chu-vevo
Comment 3 2022-02-23 03:10:38 PST
Created attachment 452958 [details] This persist after resize to a wider window
chu-vevo
Comment 4 2022-02-23 03:11:03 PST
Created attachment 452959 [details] Correct color of the wider window version
chu-vevo
Comment 5 2022-02-23 03:14:25 PST
The mix-blend-mode behaves correctly on Chrome and Firefox.
Radar WebKit Bug Importer
Comment 6 2022-02-23 15:37:11 PST
Simon Fraser (smfr)
Comment 7 2022-02-23 19:09:01 PST
*** This bug has been marked as a duplicate of bug 235106 ***
Note You need to log in before you can comment on or make changes to this bug.