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

Pre SCSS callback makes it hard to extend Boost

    XMLWordPrintable

    Details

    • Type: Bug
    • Status: Closed
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 3.2
    • Fix Version/s: 3.2
    • Component/s: Themes
    • Labels:
    • Testing Instructions:
      Hide

      Test 1

      1. Use Boost
      2. Chang the accent colour and confirm that it took effect
      3. Look at the generated CSS and confirm that...
        • ... the box-sizing properties are also prefixed webkit
        • ... RTL styles are automatically flipped
      4. Confirm that uploading a custom preset works as well

        Sample SCSS file:
         
        // Body
        $body-bg:    #ff9900 !default;
        $body-color: #fff !default;
         
        // Import everything.
        @import "moodle";
        

      Test 2

      1. Install the attached theme (extendsboost)
      2. Make sure that the theme's config.php comments out scss and csstreepostprocessor.
      3. Confirm that the theme looks like Boost only the accent colour and preset settings from Boost do not have any effect
      4. Look at the generated CSS and confirm that...
        • ... the box-sizing properties are also prefixed 'webkit'
        • ... RTL styles are automatically flipped
      5. Enable the csstreepostprocessor property in the theme's config.php
      6. Confirm that ...
        • the a CSS rule setting the body background color to red was appended to the CSS
        • box-sizing is no longer prefixed
        • styles are flipped in RTL
      7. Now enable the theme's scss property
      8. Confirm that the only CSS defined is setting the body background to green.
      Show
      Test 1 Use Boost Chang the accent colour and confirm that it took effect Look at the generated CSS and confirm that... ... the box-sizing properties are also prefixed webkit ... RTL styles are automatically flipped Confirm that uploading a custom preset works as well Sample SCSS file:   // Body $body-bg: #ff9900 !default; $body-color: #fff !default;   // Import everything. @import "moodle"; Test 2 Install the attached theme (extendsboost) Make sure that the theme's config.php comments out scss and csstreepostprocessor . Confirm that the theme looks like Boost only the accent colour and preset settings from Boost do not have any effect Look at the generated CSS and confirm that... ... the box-sizing properties are also prefixed ' webkit ' ... RTL styles are automatically flipped Enable the csstreepostprocessor property in the theme's config.php Confirm that ... the a CSS rule setting the body background color to red was appended to the CSS box-sizing is no longer prefixed styles are flipped in RTL Now enable the theme's scss property Confirm that the only CSS defined is setting the body background to green.
    • Affected Branches:
      MOODLE_32_STABLE
    • Fixed Branches:
      MOODLE_32_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-56959-master

      Description

      This issue was identified looking at the problem described here: https://moodle.org/mod/forum/discuss.php?d=342859#p1382427

      Since MDL-56078, the pre_scss callback includes the preset. Therefore, rather than prepending SCSS this callback returns the whole SCSS file. This works fine until we extend Boost. When extending Boost, both callbacks from the child and parent are called, from ancestors to descendants.

      In the case described in the forum, that caused the whole SCSS to be rendered twice, and some variables not to have any effect (not sure why, but that's the case). Regardless, the pre callback does not do what it's meant to do any more as Boost includes everything from the start, and thus we can't inject anything before the main SCSS content.

        Attachments

          Issue Links

            Activity

              People

              Assignee:
              fred Frédéric Massart
              Reporter:
              fred Frédéric Massart
              Peer reviewer:
              Damyon Wiese
              Integrator:
              Dan Poltawski
              Tester:
              Jake Dallimore
              Participants:
              Component watchers:
              Bas Brands
              Votes:
              0 Vote for this issue
              Watchers:
              6 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:
                Fix Release Date:
                5/Dec/16