Uploaded image for project: 'Sakai'
  1. Sakai
  2. SAK-44447

Increase performance of applying dark theme on new page loads

    XMLWordPrintable

    Details

    • 21 Status:
      Resolved
    • Test Plan:
      Hide

      Basic test:

      1. login as any user
      2. select dark theme
      3. navigate around sakai
      4. notice if dark theme is applied instantly or whether there is a slight delay before it is applied.

      Test of OS dark mode detection:

      1. set your local operating system to use dark mode
      2. go to Sakai
      3. ensure the Gateway appears dark before you log in
      4. log into a new account that you've never logged into Sakai before (the Tutorial should appear automatically)
      5. ensure Sakai appears in dark theme automatically
      6. ensure the Dark Theme toggle (in the account menu) has "On" selected
      7. log out
      8. set your local operating system off of dark mode
      9. go to Sakai in a new browser (or in Private Mode, or clear your browser's cache and history)
      10. log into Sakai with the same user as a few steps ago
      11. ensure Sakai appears in dark theme automatically still

      Test of various combinations of dark and light modes:

      1. ensure logging into the same Sakai account on various browsers keeps the last setting of the Dark Theme setting for that user (test with both Dark Theme toggled on and off)
      2. ensure logging into various Sakai accounts on various browsers keeps the last setting of the Dark Theme setting for each user separate of the other users (test with both Dark Theme toggled on and off) (e.g. if you enable Dark Theme on your first user account and disable it on your second user account, ensure the first user still has Dark Theme enabled when you go back to that account after the second account)
      3. ensure logging into various Sakai accounts keeps the expected settings for Dark Theme based on the various states of your OS's dark mode (enabled and disabled)
      Show
      Basic test: login as any user select dark theme navigate around sakai notice if dark theme is applied instantly or whether there is a slight delay before it is applied. Test of OS dark mode detection: set your local operating system to use dark mode go to Sakai ensure the Gateway appears dark before you log in log into a new account that you've never logged into Sakai before (the Tutorial should appear automatically) ensure Sakai appears in dark theme automatically ensure the Dark Theme toggle (in the account menu) has "On" selected log out set your local operating system off of dark mode go to Sakai in a new browser (or in Private Mode, or clear your browser's cache and history) log into Sakai with the same user as a few steps ago ensure Sakai appears in dark theme automatically still Test of various combinations of dark and light modes: ensure logging into the same Sakai account on various browsers keeps the last setting of the Dark Theme setting for that user (test with both Dark Theme toggled on and off) ensure logging into various Sakai accounts on various browsers keeps the last setting of the Dark Theme setting for each user separate of the other users (test with both Dark Theme toggled on and off) (e.g. if you enable Dark Theme on your first user account and disable it on your second user account, ensure the first user still has Dark Theme enabled when you go back to that account after the second account) ensure logging into various Sakai accounts keeps the expected settings for Dark Theme based on the various states of your OS's dark mode (enabled and disabled)

      Description

      Dark theme is not currently sent to the server and applied to any server-side markup after being set. Therefore, it's only in the local storage and results in a flash of white before being applied.

      Store the user's theme preference server-side and apply the appropriate body class on all subsequent page loads, only rely on themeswitcher.js for active switching from the user.

        Gliffy Diagrams

          Zeplin

            Attachments

              Issue Links

                Activity

                  People

                  Assignee:
                  sfoster9 Shawn Foster
                  Reporter:
                  profmikegreene Michael Greene
                  Votes:
                  0 Vote for this issue
                  Watchers:
                  2 Start watching this issue

                    Dates

                    Created:
                    Updated:
                    Resolved:

                      Git Integration