Clicking any link in django admin will result in first showing the dark
theme for a short moment and then switching to the light theme.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
* Attachment "Django Flickering.mp4" added.
A video of the problem
* status: new => closed
* resolution: => needsinfo
Comment:
This is probably related with Django Debug Toolbar. It slows everything
down and makes the switch visible. I don't think there is anything that
Django could do better here. Please reopen the ticket if you can provide
details about why and where Django is at fault.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:1>
* Attachment "django-flash(2).mp4" added.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670>
* status: closed => new
* resolution: needsinfo =>
Comment:
I have been able to replicate this on a fresh install (see latest video)
How to replicate:
1. Set OS to dark mode or emulate it via chrome tools -
https://dev.to/codepo8/quick-developer-tools-tip-simulating-dark-light-
colour-mode-1cpg
2. Force Django Admin to light mode
3. Click around and see
Why is this happening you may ask. The JS code that forces the theme to
dark/light is set to run on page load.
https://github.com/django/django/blob/main/django/contrib/admin/static/admin/js/theme.js#L3
Because of this the full page loads for a moment with the dark theme, then
the page load event happens and then the js code changes the theme to
light.
The initTheme() and setTheme() functions don't really need to be inside
the event page load. Nothing in those 2 functions are doing anything that
require the entire page to be loaded. It is just using local storage and
modify the dataset on the html div. So those functions could be moved
outside of the on load event. I don't mind making the merge request for it
just wanted to get opinions on it.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:2>
* cc: Sarah Abderemane (added)
* type: Bug => Cleanup/optimization
* stage: Unreviewed => Accepted
Comment:
Thanks for details, tentatively accepted.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:3>
* owner: nobody => Spencer Lowe
* status: new => assigned
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:4>
Comment (by Sarah Abderemane):
Yes, I changed the code to avoid that on djangoproject.com but I forgot to
make the change also on Django for the admin.
Feel free to make the changes, I'm happy to review it :)
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:5>
Comment (by thebugcollector):
Since it's been 3 months, I'm happy submit the initial PR.
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:6>
Comment (by Nicolas Lupien):
I had this problem too, I fixed it this way
[https://github.com/django/django/pull/17625 PR ]
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:7>
* has_patch: 0 => 1
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:8>
* owner: Spencer Lowe => Nicolas Lupien
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:9>
* stage: Accepted => Ready for checkin
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:10>
* needs_better_patch: 0 => 1
* stage: Ready for checkin => Accepted
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:11>
* needs_better_patch: 1 => 0
* stage: Accepted => Ready for checkin
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:12>
* status: assigned => closed
* resolution: => fixed
Comment:
In [changeset:"561e16d6a7f07d8cadbdb6c72c68934dcd087d18" 561e16d]:
{{{
#!CommitTicketReference repository=""
revision="561e16d6a7f07d8cadbdb6c72c68934dcd087d18"
Fixed #34670 -- Improved loading of theme in admin.
Thanks Sarah Abderemane for the review.
}}}
--
Ticket URL: <https://code.djangoproject.com/ticket/34670#comment:13>