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

If SassC is used, core SCSS variables and Bootstrap includes can't be used in Boost's RAW SCSS.

    XMLWordPrintable

Details

    • Bug
    • Resolution: Unresolved
    • Minor
    • None
    • 3.8.5, 3.9.2
    • Themes
    • MOODLE_38_STABLE, MOODLE_39_STABLE

    Description

      Prerequisites

      • As server admin, install SassC on your server
      • In config.php, configure the path to SassC, for example:

        $CFG->pathtosassc = '/bin/sassc';
        

      Problem 1: Core SCSS Variables are not passed to SassC

      Steps to reproduce:

      • Login as admin
      • Go to Site Administration -> Apperance -> Themes -> Boost -> "Advanced settings" tab
      • Set the theme_boost | scss setting to

        body {
            color: $gray !important;
        }
        

      • Click "Save changes"

      Expected result:

      • The RAW SCSS is stored and compiled and used
      • All body text is gray now

      Actual result:

      • The RAW SCSS is not accepted
      • There is a Debug message saying:

        Coding error detected, it must be fixed by a programmer: Error: Undefined variable: "$gray". on line 2 of stdin >> color: $gray !important; -----------^
        

      • The stack track is:

        Stack trace:
        line 138 of /lib/classes/scss.php: coding_exception thrown
        line 10934 of /lib/adminlib.php: call to core_scss->compile()
        line 2404 of /lib/adminlib.php: call to admin_setting_scsscode->validate()
        line 8499 of /lib/adminlib.php: call to admin_setting_configtext->write_setting()
        line 44 of /admin/settings.php: call to admin_write_settings()
        

      Problem 2: Bootstrap includes are not possible with SassC

      Steps to reproduce:

      • Login as admin
      • Go to Site Administration -> Apperance -> Themes -> Boost -> "Advanced settings" tab
      • Set the theme_boost | scss setting to

        @include media-breakpoint-down(md) {
            body {
                color: red !important;
            }
        }
        

      • Click "Save changes"

      Expected result:

      • The RAW SCSS is stored and compiled and used
      • On small screens, all body text is red now

      Actual result:

      • The RAW SCSS is not accepted
      • There is a Debug message saying:

        Coding error detected, it must be fixed by a programmer: Error: no mixin named media-breakpoint-down Backtrace: stdin:1 on line 1 of stdin >> @include media-breakpoint-down(md) { ---------^
        

      • The stack track is the same as with problem 1.

      Analysis

      • Both problems happen only if you configure Moodle to use SassC. If you use the Built-in SaSS compiler, everything is fine.
      • The problem only happens because the theme_boost | scss setting validates the configured RAW SCSS. This was introduced in MDL-56488. If you change the theme_boost | scss setting from admin_setting_scsscode to admin_setting_configtextarea in /theme/boost/settings.php, the RAW SCSS is accepted and properly processed anyway even if SassC is used. That's why I mark this issue as a regression of MDL-56488, knowing that this is not fully true.
      • This issue is related to MDL-62773 where callumb described something similar for custom SCSS variables.

      Attachments

        Issue Links

          Activity

            People

              Unassigned Unassigned
              abias Alexander Bias
              Votes:
              0 Vote for this issue
              Watchers:
              3 Start watching this issue

              Dates

                Created:
                Updated:

                Clockify

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