Created attachment 461974 [details] Bug example When "color-scheme" change from "light" to "dark" and vice versa colors of scrollbar aren't updated. It seems like element reflow/repaint is missing. I created jsfiddle which displays this issue. Colors are updated only after hover over scrollbar or in case scrollbar is rendered due "overflow:auto" force-reflow hack fix it too but it didn't work if scrollbar came from "overflow:scroll". Steps to reproduce in example 1. Open in Safari 2. Click "Toggle theme - dark" button - page should change background color to blue but scrollbars should stay same as on yellow (white bg with grey slider) 3. Click "Force reflow" - top block with Lorem ipsum should change scrollbar colour to be semi-transparent (low opacity dark bg and grey slider), but lower block with horizontal & vertical scrollbar should stay same 4. Hover over scrollbars of bottom Lorem ipsum - scrollbars should turn to semi-transparend but bottom right edge should stay white Example in attachement & in JSFiddle https://jsfiddle.net/marospistej/vj9tf2on/41/ Issue is only present on Safari, all Chrome, FF change scrollbar color as expected even without reflow Expected behaviour: When "color-scheme" change scrollbars should update
It's also necessary to set "Show scroll bars" to "Always" in Settings > General
Happens on macOS Ventura as well.
<rdar://problem/99567600>
Pull request: https://github.com/WebKit/WebKit/pull/15264
See also URL: https://github.com/web-platform-tests/wpt/pull/40737 (I don't have permission to edit the bug)
Committed 266176@main (044d44c8940b): <https://commits.webkit.org/266176@main> Reviewed commits have been landed. Closing PR #15264 and removing active labels.