DEV: Revert stylesheet refactors (#13584)

DEV: Revert stylesheet refactors (#13584)

  • Revert “FIX: Clear appropriate cache when updating font settings (#13582)”

This reverts commit de6cc7a92412538b2460e1b6f4855da343054899.

  • Revert “DEV: Improve output of Stylesheet::Mananger.precompile_theme_css.”

This reverts commit 95038856c9ddeee7d0d8083a75006a5e3492dd54.

  • Revert “FIX: Child themes being precompiled multiple times.”

This reverts commit 6986b36985fa242cb3d346b05f84d3878573c354.

  • Revert “Update spec/components/stylesheet/manager_spec.rb”

This reverts commit ddaa7cc7eac2850f9a8614077c1170942ebc0311.

  • Revert “Refactor scss live refreshing”

This reverts commit a838293aaf1e3b21c34c1964603e1b85c5673935.

  • Revert “Precompile core stylesheets independently of themes”

This reverts commit 99d259d39bdaade6d20951c84def890dc91246a5.

  • Revert “DEV: Add simple digest for core stylesheets”

This reverts commit d82c58e6cc5dd43b8bfb062838a24cac85ac9ca2.

diff --git a/app/assets/javascripts/discourse/app/initializers/live-development.js b/app/assets/javascripts/discourse/app/initializers/live-development.js
index bf92d0e..e657240 100644
--- a/app/assets/javascripts/discourse/app/initializers/live-development.js
+++ b/app/assets/javascripts/discourse/app/initializers/live-development.js
@@ -1,6 +1,7 @@
 import DiscourseURL from "discourse/lib/url";
 import Handlebars from "handlebars";
 import { isDevelopment } from "discourse-common/config/environment";
+import { refreshCSS } from "discourse/lib/theme-selector";
 
 //  Use the message bus for live reloading of components for faster development.
 export default {
@@ -50,7 +51,7 @@ export default {
     // Observe file changes
     messageBus.subscribe(
       "/file-change",
-      (data) => {
+      function (data) {
         if (Handlebars.compile && !Ember.TEMPLATES.empty) {
           // hbs notifications only happen in dev
           Ember.TEMPLATES.empty = Handlebars.compile("<div></div>");
@@ -59,12 +60,20 @@ export default {
           if (me === "refresh") {
             // Refresh if necessary
             document.location.reload(true);
-          } else if (me.new_href && me.target) {
-            const link_target = me.theme_id
-              ? `[data-target="${me.target}"][data-theme-id="${me.theme_id}"]`
-              : `[data-target="${me.target}"]`;
-            document.querySelectorAll(`link${link_target}`).forEach((link) => {
-              this.refreshCSS(link, me.new_href);
+          } else {
+            $("link").each(function () {
+              if (me.hasOwnProperty("theme_id") && me.new_href) {
+                const target = $(this).data("target");
+                const themeId = $(this).data("theme-id");
+                if (
+                  target === me.target &&
+                  (!themeId || themeId === me.theme_id)
+                ) {
+                  refreshCSS(this, null, me.new_href);
+                }
+              } else if (this.href.match(me.name) && (me.hash || me.new_href)) {
+                refreshCSS(this, me.hash, me.new_href);
+              }
             });
           }
         });
@@ -72,23 +81,4 @@ export default {
       session.mbLastFileChangeId
     );
   },
-
-  refreshCSS(node, newHref) {
-    if (node.dataset.reloading) {
-      clearTimeout(node.dataset.timeout);
-    }
-
-    node.dataset.reloading = true;
-
-    let reloaded = node.cloneNode(true);
-    reloaded.href = newHref;
-    node.insertAdjacentElement("afterend", reloaded);
-
-    let timeout = setTimeout(() => {
-      node.parentNode.removeChild(node);
-      reloaded.dataset.reloading = false;
-    }, 2000);
-
-    node.dataset.timeout = timeout;
-  },
 };
diff --git a/app/assets/javascripts/discourse/app/lib/theme-selector.js b/app/assets/javascripts/discourse/app/lib/theme-selector.js
index 4d7c9a9..fdc4cb9 100644
--- a/app/assets/javascripts/discourse/app/lib/theme-selector.js
+++ b/app/assets/javascripts/discourse/app/lib/theme-selector.js
@@ -44,6 +44,41 @@ export function setLocalTheme(ids, themeSeq) {
   }
 }
 
+export function refreshCSS(node, hash, newHref) {
+  let $orig = $(node);
+
+  if ($orig.data("reloading")) {
+    clearTimeout($orig.data("timeout"));
+    $orig.data("copy").remove();
+  }
+
+  if (!$orig.data("orig")) {
+    $orig.data("orig", node.href);
+  }
+
+  $orig.data("reloading", true);
+
+  const orig = $(node).data("orig");
+
+  let reloaded = $orig.clone(true);
+  if (hash) {
+    reloaded[0].href =
+      orig + (orig.indexOf("?") >= 0 ? "&hash=" : "?hash=") + hash;
+  } else {
+    reloaded[0].href = newHref;
+  }
+
+  $orig.after(reloaded);
+
+  let timeout = setTimeout(() => {
+    $orig.remove();
+    reloaded.data("reloading", false);
+  }, 2000);
+
+  $orig.data("timeout", timeout);
+  $orig.data("copy", reloaded);
+}
+
 export function listThemes(site) {
   let themes = site.get("user_themes");
 
diff --git a/config/initializers/014-track-setting-changes.rb b/config/initializers/014-track-setting-changes.rb
index ba916ab..1340d1d 100644
--- a/config/initializers/014-track-setting-changes.rb
+++ b/config/initializers/014-track-setting-changes.rb
@@ -27,7 +27,7 @@ DiscourseEvent.on(:site_setting_changed) do |name, old_value, new_value|
     end
   end
 
-  Stylesheet::Manager.clear_color_scheme_cache! if [:base_font, :heading_font].include?(name)
+  Stylesheet::Manager.clear_core_cache!(["desktop", "mobile"]) if [:base_font, :heading_font].include?(name)
 
   Report.clear_cache(:storage_stats) if [:backup_location, :s3_backup_bucket].include?(name)
 
diff --git a/lib/stylesheet/compiler.rb b/lib/stylesheet/compiler.rb
index 72231f4..efc4718 100644
--- a/lib/stylesheet/compiler.rb
+++ b/lib/stylesheet/compiler.rb
@@ -29,6 +29,9 @@ module Stylesheet
         file += File.read path
 
         case asset.to_s
+        when "desktop", "mobile"
+          file += importer.category_backgrounds
+          file += importer.font
         when "embed", "publish"
           file += importer.font
         when "wizard"
@@ -36,8 +39,6 @@ module Stylesheet
         when Stylesheet::Manager::COLOR_SCHEME_STYLESHEET
           file += importer.import_color_definitions
           file += importer.import_wcag_overrides
-          file += importer.category_backgrounds
-          file += importer.font
         end
       end
 
diff --git a/lib/stylesheet/manager.rb b/lib/stylesheet/manager.rb
index 9890259..e871394 100644
--- a/lib/stylesheet/manager.rb
+++ b/lib/stylesheet/manager.rb
@@ -42,58 +42,52 @@ class Stylesheet::Manager
   end
 
   def self.precompile_css
-    targets = [:desktop, :mobile, :desktop_rtl, :mobile_rtl, :admin, :wizard]
-    targets += Discourse.find_plugin_css_assets(include_disabled: true, mobile_view: true, desktop_view: true)
-
-    targets.each do |target|
-      $stderr.puts "precompile target: #{target}"
-
-      Stylesheet::Manager::Builder.new(target: target, manager: nil).compile(force: true)
-    end
-  end
-
-  def self.precompile_theme_css
-    themes = Theme.where('user_selectable OR id = ?', SiteSetting.default_theme_id).pluck(:id, :color_scheme_id)
+    themes = Theme.where('user_selectable OR id = ?', SiteSetting.default_theme_id).pluck(:id, :name, :color_scheme_id)
+    themes << nil
 
     color_schemes = ColorScheme.where(user_selectable: true).to_a
     color_schemes << ColorScheme.find_by(id: SiteSetting.default_dark_mode_color_scheme_id)
-    color_schemes << ColorScheme.base
     color_schemes = color_schemes.compact.uniq
 
-    targets = [:desktop_theme, :mobile_theme]
-    compiled = Set.new
+    targets = [:desktop, :mobile, :desktop_rtl, :mobile_rtl, :desktop_theme, :mobile_theme, :admin, :wizard]
+    targets += Discourse.find_plugin_css_assets(include_disabled: true, mobile_view: true, desktop_view: true)
 
-    themes.each do |theme_id, color_scheme_id|
+    themes.each do |id, name, color_scheme_id|
+      theme_id = id || SiteSetting.default_theme_id
       manager = self.new(theme_id: theme_id)
 
       targets.each do |target|
-        next if theme_id == -1
+        if target =~ THEME_REGEX
+          next if theme_id == -1
 
-        scss_checker = ScssChecker.new(target, manager.theme_ids)
+          scss_checker = ScssChecker.new(target, manager.theme_ids)
 
-        manager.load_themes(manager.theme_ids).each do |theme|
-          next if compiled.include?("#{target}_#{theme.id}")
+          manager.load_themes(manager.theme_ids).each do |theme|
+            builder = Stylesheet::Manager::Builder.new(
+              target: target, theme: theme, manager: manager
+            )
 
-          builder = Stylesheet::Manager::Builder.new(
-            target: target, theme: theme, manager: manager
-          )
+            STDERR.puts "precompile target: #{target} #{builder.theme.name}"
+            next if theme.component && !scss_checker.has_scss(theme.id)
+            builder.compile(force: true)
+          end
+        else

[... diff too long, it was truncated ...]

GitHub sha: 128fdf9d9ce92275ecb0a2bdb12bdf038a811a45

This commit appears in #13584 which was approved by tgxworld. It was merged by tgxworld.