gh-15232: Fixed syncing themes not updating the color scheme (gh-15233)

src/zen/spaces/ZenGradientGenerator.mjs

@@ -1509,7 +1509,7 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
       baseColor = this.blendColors(
         accentColor,
         baseColor.slice(0, 3),
-        this.canBeTransparent ? 25 : 5
+        this.canBeTransparent ? 20 : 5
       ).concat(opacity);
     }
     return baseColor;
@@ -1538,16 +1538,16 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
         return;
       }
 
+      if (theme === null) {
+        browser.gZenThemePicker.invalidateGradientCache(uuid);
+      }
+
       // Do not rebuild if the workspace is not the same as the current one
       const windowWorkspace = browser.gZenWorkspaces.getActiveWorkspace();
       if (windowWorkspace.uuid !== uuid) {
         return;
       }
 
-      if (theme === null) {
-        browser.gZenThemePicker.invalidateGradientCache(uuid);
-      }
-
       // get the theme from the window
       workspaceTheme = this.fixTheme(theme || windowWorkspace.theme);
       const docElement = browser.document.documentElement;
@@ -1983,9 +1983,7 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature {
 
   invalidateGradientCache(uuid) {
     delete this.#gradientsCache[uuid];
-    window.dispatchEvent(
-      new Event("ZenGradientCacheChanged", { bubbles: true })
-    );
+    gZenWorkspaces.workspaceElement(uuid)?.onGradientCacheChanged();
   }
 
   getGradientForWorkspace(workspace, { getGradient = true } = {}) {

src/zen/spaces/ZenSpace.mjs

@@ -268,12 +268,6 @@ export class nsZenWorkspace extends MozXULElement {
 
     this.#updateOverflow();
 
-    this.onGradientCacheChanged = this.#onGradientCacheChanged.bind(this);
-    window.addEventListener(
-      "ZenGradientCacheChanged",
-      this.onGradientCacheChanged
-    );
-
     this.pinnedTabsContainer.addEventListener("TabPinned", () => {
       // If a tab is pinned and the pinned tabs section is collapsed, uncollapse it.
       if (this.collapsiblePins.collapsed) {
@@ -300,13 +294,6 @@ export class nsZenWorkspace extends MozXULElement {
     });
   }
 
-  disconnectedCallback() {
-    window.removeEventListener(
-      "ZenGradientCacheChanged",
-      this.onGradientCacheChanged
-    );
-  }
-
   get active() {
     return this.hasAttribute("active");
   }
@@ -395,7 +382,7 @@ export class nsZenWorkspace extends MozXULElement {
     return this.querySelector("#tabs-newtab-button");
   }
 
-  #onGradientCacheChanged() {
+  onGradientCacheChanged() {
     const { isDarkMode, isExplicitMode, toolbarColor, primaryColor } =
       gZenThemePicker.getGradientForWorkspace(
         gZenWorkspaces.getWorkspaceFromId(this.workspaceUuid),