Uploaded image for project: 'Moodle app'
  1. Moodle app
  2. MOBILE-3607

Site plugins: CSS should be included in DOM in reliable order

    XMLWordPrintable

    Details

    • Type: Improvement
    • Status: Closed
    • Priority: Minor
    • Resolution: Fixed
    • Affects Version/s: 3.9.3
    • Fix Version/s: 3.9.4
    • Component/s: Site add-ons
    • Labels:
    • Testing Instructions:
      Hide
      1. Using Chrome or Moodle Desktop (so that you have access to developer tools), connect to a site with more than one site plugin.
      2. Turn on developer tools and look inside the '<head>' tag using the Elements panel to find the styles for the site plugins (as shown in the screenshots in this issue).
        • EXPECTED: The styles for each plugin should be included and should be in alphabetical order, based on the 'id' attribute of the style element
      Show
      Using Chrome or Moodle Desktop (so that you have access to developer tools), connect to a site with more than one site plugin. Turn on developer tools and look inside the '<head>' tag using the Elements panel to find the styles for the site plugins (as shown in the screenshots in this issue). EXPECTED: The styles for each plugin should be included and should be in alphabetical order, based on the 'id' attribute of the style element
    • Affected Branches:
      MOODLE_39_STABLE
    • Fixed Branches:
      MOODLE_39_STABLE
    • Pull Master Branch:
    • Sprint:
      Moodle App 3.9.4

      Description

      When site plugins are loaded, the app adds the CSS files that are defined in their mobile.php.

      As multiple plugins are loaded at once, they may complete loading in any order. Currently this results in the CSS files being added in that order. For example, if plugin A's CSS loads before B, then plugin A styles will appear before B in the resulting DOM.

      In an ideal world, plugin A would not apply styles to the same selectors as plugin B (and vice versa) but if they do, this causes inconsistent behaviour (whichever one loads last 'wins') which is very difficult to debug and track down.

      It would remove the possibility for this inconsistency if styles were inserted into alphabetical order in the DOM based on the plugin/handler name instead of always added at the end.

      The example screenshot style-order.png from 2 consecutive runs of moodle desktop demonstrates the random ordering.

        Attachments

        1. style-order.png
          164 kB
          Sam Marshall
        2. style-order-after.png
          42 kB
          Sam Marshall

          Activity

            People

            Assignee:
            quen Sam Marshall
            Reporter:
            quen Sam Marshall
            Peer reviewer:
            Dani Palou
            Integrator:
            Juan Leyva
            Tester:
            Pau Ferrer
            Participants:
            Component watchers:
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

              Dates

              Created:
              Updated:
              Resolved:
              Fix Release Date:
              28/Dec/20