Dark theme: Inconsistencies after changing vs after reload

[JulienPalard]

See screenshots: https://mamot.fr/@[email protected]/110045308238629406

One is "right after changing to dark", the other is "after reloading the page on dark".

[hugovk]

Copying the details over:

Firefox on iPhone

1. Go to https://docs.python.org/dev/
2. Switch from light to dark

Actual result: some of the input fields remain in light mode

Expected result: all input fields switch to dark mode

light at step 1	dark after clicking selector	dark after reload

[hugovk]

I can't reproduce on Chrome/Android, Chrome/macOS or Firefox/macOS (desktop and mobile mode), but can reproduce with Safari/macOS (desktop and mobile mode).

It would be good to fix this, but I don't think it's a showstopper: the colours load as expected on the next link click or reload.

cc @septatrix

[septatrix]

I only have Chrome/Android, Chrome/Linux and Firefox/Linux and cannot reproduce it there. My initial guess is that Safari might not properly respond to a changing color-scheme: dark; as that is mostly responsible to style the so called "replaced elements" (selects, inputs, etc) which seem to be affected here. Maybe explicitly setting color-scheme: light in the light theme would help such that Safari notices that the value changes though someone else would have to try that.

[ishan-sharma-3004]

I can't reproduce this on (Chrome, Safari, and Brave)/MacOS. This issue is resolved.

[pradyunsg]

I can reproduce this on Safari 15.6 (Monterey) but not on Safari 16.5 (Ventura).

15.6:

https://github.com/python/python-docs-theme/assets/3275593/a29d519c-8e04-422b-aed7-b67e4b91560a

16.5:

https://github.com/python/python-docs-theme/assets/3275593/4f97be0b-1fbd-4bcc-b01c-4e5cb9682255

I'm gonna say this was a Safari bug that has been fixed in Safari 16.