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

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

    XMLWordPrintable

    Details

    • Testing Instructions:
      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.
    • Affected Branches:
      MOODLE_34_STABLE, MOODLE_35_STABLE
    • Fixed Branches:
      MOODLE_35_STABLE
    • Pull 3.5 Branch:
    • Pull Master Branch:
      MDL-59261-master

      Description

      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.

        Attachments

          Issue Links

            Activity

              People

              • Votes:
                1 Vote for this issue
                Watchers:
                10 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:
                  Fix Release Date:
                  9/Jul/18