Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-59261

Add a shipped version of core themes as a final fallback for CSS

XMLWordPrintable

    • MOODLE_34_STABLE, MOODLE_35_STABLE
    • MOODLE_35_STABLE
    • MDL-59261-master
    • Hide

      How to clear Boost theme caches

      • Remove the tmp file on disk
        • It’s normally in the your moodledata directory/temp/theme/boost
      • Purge the Moodle caches
      • Reload the page (unless you purged using the Moodle site)

      Test normal compile (theme designer mode off)

      1. Log in as admin
      2. Turn off theme designer mode
        1. Site administration > appearance > themes > Theme settings
      3. Set the theme preset to default
        1. Go to site administration > appearance > themes > Boost
        2. Set “Theme preset” to default.scss
        3. Save changes
      4. Rename the shipped CSS file to something else confirm it isn’t being used
        1. Rename theme/boost/style/moodle.css to something else
      5. Purge the Boost theme caches (as per above)
      6. CONFIRM that the Boost theme renders correctly

      Test broken compile (theme designer mode off)

      1. Log in as admin
      2. Turn off theme designer mode
        1. Site administration > appearance > themes > Theme settings
      3. Rename the shipped CSS file back to the correct name to confirm it gets used (if you renamed it in the previous test)
        1. Make sure the shipped CSS file is called theme/boost/style/moodle.css
      4. Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue)
        1. Go to site administration > appearance > themes > Boost
        2. Upload the AOF_nettopp.scss file to the “Additional theme preset files” area
        3. Save changes
        4. Set “Theme preset” to AOF_nettopp.scss
        5. Save changes
      5. Purge the Boost theme caches (as per above)
      6. CONFIRM that the Boost theme renders correctly
        • It should look like it did in the “Test normal compile” test which is the default Boost styling because the preset didn’t compile correctly
        • The styling from the preset won’t have applied

      Test normal compile (theme designer mode on)

      1. Log in as admin
      2. Turn on theme designer mode
        1. Site administration > appearance > themes > Theme settings
      3. Set the theme preset to default
        1. Go to site administration > appearance > themes > Boost
        2. Set “Theme preset” to default.scss
        3. Save changes
      4. CONFIRM that the Boost theme renders correctly

      Test broken compile (theme designer mode on)

      1. Log in as admin
      2. Turn on theme designer mode
        1. Site administration > appearance > themes > Theme settings
      3. Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue)
        1. Go to site administration > appearance > themes > Boost
        2. Upload the AOF_nettopp.scss file to the “Additional theme preset files” area
        3. Save changes
        4. Set “Theme preset” to AOF_nettopp.scss
        5. Save changes
      4. Reload the page
      5. CONFIRM that the page loads without any styling because it couldn’t compile with the incorrect preset
        • The shipped CSS isn’t used as a fallback in theme designer mode

      Test upgrade from 3.4 to 3.5 with incompatible preset

      1. Install a Moodle 3.4 site
      2. Log in as admin
      3. Turn off theme designer mode (it should be off by default)
        1. Site administration > appearance > themes > Theme settings
      4. Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue)
        1. Go to site administration > appearance > themes > Boost
        2. Upload the AOF_nettopp.scss file to the “Additional theme preset files” area
        3. Save changes
        4. Set “Theme preset” to AOF_nettopp.scss
        5. Save changes
      5. Purge the caches
      6. Reload the page and you should see the theme styling change because the preset is applied
      7. Upgrade the site to Moodle 3.5 (latest integration is fine, as long as it includes the patch from this issue)
      8. After the upgrade completes CONFIRM that the styling reverts back to the Boost default styling (it’s using the precompiled one on disk) because the preset is not compatible with 3.5

      Test grunt

      1. Run npm install in the moodle directory
      2. Make some changes to one of the SCSS files in theme/boost/scss
      3. Run grunt sass
      4. CONFIRM that the changes appear in theme/boost/style/moodle.css
      5. Repeat the above test but run grunt css instead and confirm that you get the CSS linting and LESS compiling as well. Note: You're just checking that you see these tasks, run, which requires the linting task to pass, so please make sure any css you add is indented/spaced properly.
      Show
      How to clear Boost theme caches Remove the tmp file on disk It’s normally in the your moodledata directory/temp/theme/boost Purge the Moodle caches Reload the page (unless you purged using the Moodle site) Test normal compile (theme designer mode off) Log in as admin Turn off theme designer mode Site administration > appearance > themes > Theme settings Set the theme preset to default Go to site administration > appearance > themes > Boost Set “Theme preset” to default.scss Save changes Rename the shipped CSS file to something else confirm it isn’t being used Rename theme/boost/style/moodle.css to something else Purge the Boost theme caches (as per above) CONFIRM that the Boost theme renders correctly Test broken compile (theme designer mode off) Log in as admin Turn off theme designer mode Site administration > appearance > themes > Theme settings Rename the shipped CSS file back to the correct name to confirm it gets used (if you renamed it in the previous test) Make sure the shipped CSS file is called theme/boost/style/moodle.css Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue) Go to site administration > appearance > themes > Boost Upload the AOF_nettopp.scss file to the “Additional theme preset files” area Save changes Set “Theme preset” to AOF_nettopp.scss Save changes Purge the Boost theme caches (as per above) CONFIRM that the Boost theme renders correctly It should look like it did in the “Test normal compile” test which is the default Boost styling because the preset didn’t compile correctly The styling from the preset won’t have applied Test normal compile (theme designer mode on) Log in as admin Turn on theme designer mode Site administration > appearance > themes > Theme settings Set the theme preset to default Go to site administration > appearance > themes > Boost Set “Theme preset” to default.scss Save changes CONFIRM that the Boost theme renders correctly Test broken compile (theme designer mode on) Log in as admin Turn on theme designer mode Site administration > appearance > themes > Theme settings Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue) Go to site administration > appearance > themes > Boost Upload the AOF_nettopp.scss file to the “Additional theme preset files” area Save changes Set “Theme preset” to AOF_nettopp.scss Save changes Reload the page CONFIRM that the page loads without any styling because it couldn’t compile with the incorrect preset The shipped CSS isn’t used as a fallback in theme designer mode Test upgrade from 3.4 to 3.5 with incompatible preset Install a Moodle 3.4 site Log in as admin Turn off theme designer mode (it should be off by default) Site administration > appearance > themes > Theme settings Set the theme preset to the an incompatible preset (AOF_nettopp.scss - attached to this issue) Go to site administration > appearance > themes > Boost Upload the AOF_nettopp.scss file to the “Additional theme preset files” area Save changes Set “Theme preset” to AOF_nettopp.scss Save changes Purge the caches Reload the page and you should see the theme styling change because the preset is applied Upgrade the site to Moodle 3.5 (latest integration is fine, as long as it includes the patch from this issue) After the upgrade completes CONFIRM that the styling reverts back to the Boost default styling (it’s using the precompiled one on disk) because the preset is not compatible with 3.5 Test grunt Run npm install in the moodle directory Make some changes to one of the SCSS files in theme/boost/scss Run grunt sass CONFIRM that the changes appear in theme/boost/style/moodle.css Repeat the above test but run grunt css instead and confirm that you get the CSS linting and LESS compiling as well. Note: You're just checking that you see these tasks, run, which requires the linting task to pass, so please make sure any css you add is indented/spaced properly.

      Add a way to build and ship the core theme's CSS with Moodle to be used as a final fallback for the page loading when no newer version of the CSS has been built.

            ryanwyllie Ryan Wyllie
            ryanwyllie Ryan Wyllie
            Mihail Geshoski Mihail Geshoski
            Jake Dallimore Jake Dallimore
            cameron1729 cameron1729
            Votes:
            1 Vote for this issue
            Watchers:
            10 Start watching this issue

              Created:
              Updated:
              Resolved:

                Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.