NEW 281625
On DOM ready automatic CSS explode from user-agent defaults to applied styles
https://bugs.webkit.org/show_bug.cgi?id=281625
Summary On DOM ready automatic CSS explode from user-agent defaults to applied styles
Ebrahim Byagowi
Reported 2024-10-16 14:36:12 PDT
1. Disable browser cache from the Network tab of web inspector, 2. Open https://lab.laukstein.com/bug/input What happens: The box there expands to its final size What should happen: Like Chrome when cache is disabled to not have any initial animation which apparently is fixed in https://crbug.com/332189 This isn't the case only when cache is disabled, it happens when the page is new for me, there can be workaround for like what is described at https://phabricator.wikimedia.org/T376559 but since Chrome has fixed it it would be it would be fixed here also.
Attachments
screen recording (1.89 MB, video/quicktime)
2024-10-25 06:20 PDT, zalan
no flags
Ebrahim Byagowi
Comment 1 2024-10-17 21:18:11 PDT
More practical reproduction of this issue without need of dev console configuration, 1. First open Wikipedia, https://en.wikipedia.org/wiki/ and enable it's dark mode right side pane, (find 'Color (beta)' and click on Dark) 2. Copy this link into your clipboard https://en.wikipedia.org/wiki/Special:Random and paste it to see a random page each Note how the search box goes from light to dark each time like this https://phabricator.wikimedia.org/F57591888
Radar WebKit Bug Importer
Comment 2 2024-10-23 14:37:15 PDT
Ebrahim Byagowi
Comment 3 2024-10-25 01:52:48 PDT
This is one annoying Wikipedia's UI polishing issue and now only Safari has it as I filed a bug against Mozilla but turned they only had the issue when inspector is open but they even fixed that https://bugzilla.mozilla.org/show_bug.cgi?id=1925126 but Safari issue isn't dev console exclusive, it just always happen on Wikipedia when a random new page is opened in dark mode. I wish I somehow could help WebKit developers to understand what the issue is.
zalan
Comment 4 2024-10-25 06:20:43 PDT
Created attachment 473039 [details] screen recording I don't seem to be able to reproduce this :(
zalan
Comment 5 2024-10-25 06:24:20 PDT
I can repro the https://lab.laukstein.com/bug/input bug though (on new loads and/or private tabs).
zalan
Comment 6 2024-10-25 06:29:45 PDT
Ebrahim Byagowi
Comment 7 2024-10-25 12:11:42 PDT
> I don't seem to be able to reproduce this :( Understandable, it happens for me most of the times and there might be some internet bandwidth difference factor also playing rule here maybe, it looks like this for me, https://phabricator.wikimedia.org/F57643333 But the good part is disabling cache from the inspector can make this to just always happen even in local instance of MediaWiki only by a simple refresh but this is from Wikipedia, https://phabricator.wikimedia.org/F57643344 This problem has become an issue in Wikimedia https://phabricator.wikimedia.org/T376559 as I was first asked about an animation I added to not get started before any user interaction with the page and I have a solution but making it to happen cross libraries became a trouble where turned out this is a Safari only issue. > I can repro the https://lab.laukstein.com/bug/input bug though (on new loads and/or private tabs). Fixing that alone would be a great start I believe.
Note You need to log in before you can comment on or make changes to this bug.