fix: Fixed URL bar unfocusing when pressing the newtab button and fixed workspace switching animations, b=(no-bug), c=tabs, workspaces

src/browser/components/preferences/zen-settings.js

@@ -742,11 +742,13 @@ var gZenWorkspacesSettings = {
     };
     Services.prefs.addObserver('zen.tab-unloader.enabled', tabsUnloaderPrefListener);
     Services.prefs.addObserver('zen.glance.enabled', tabsUnloaderPrefListener); // We can use the same listener for both prefs
+    Services.prefs.addObserver('zen.workspaces.container-specific-essentials-enabled', tabsUnloaderPrefListener);
     Services.prefs.addObserver('zen.glance.activation-method', tabsUnloaderPrefListener);
     window.addEventListener('unload', () => {
       Services.prefs.removeObserver('zen.tab-unloader.enabled', tabsUnloaderPrefListener);
       Services.prefs.removeObserver('zen.glance.enabled', tabsUnloaderPrefListener);
       Services.prefs.removeObserver('zen.glance.activation-method', tabsUnloaderPrefListener);
+      Services.prefs.removeObserver('zen.workspaces.container-specific-essentials-enabled', tabsUnloaderPrefListener);
     });
   },
 };

src/browser/components/urlbar/UrlbarInput-sys-mjs.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/components/urlbar/UrlbarInput.sys.mjs b/browser/components/urlbar/UrlbarInput.sys.mjs
-index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..75a14c7c52e9a8b2f39b8e9822c7988b5a33fd7b 100644
+index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..a469d122622fcf361eea8faa4a8d3a13a5a9e4f1 100644
 --- a/browser/components/urlbar/UrlbarInput.sys.mjs
 +++ b/browser/components/urlbar/UrlbarInput.sys.mjs
 @@ -68,6 +68,13 @@ XPCOMUtils.defineLazyPreferenceGetter(
@@ -200,3 +200,12 @@ index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..75a14c7c52e9a8b2f39b8e9822c7988b
  
          // Keep the focus status, since the attribute may be changed
          // upon calling this.focus().
+@@ -4218,7 +4277,7 @@ export class UrlbarInput {
+         }
+         // Don't close the view when clicking on a tab; we may want to keep the
+         // view open on tab switch, and the TabSelect event arrived earlier.
+-        if (event.target.closest("tab")) {
++        if (event.target.closest("tab") || event.target.closest("#tabs-newtab-button")) {
+           break;
+         }
+ 

src/zen/tabs/zen-tabs/vertical-tabs.css

@@ -991,6 +991,7 @@
 #tabs-newtab-button {
   display: none;
   opacity: 0.5;
+  -moz-user-focus: ignore !important;
 }
 
 @media -moz-pref('zen.tabs.show-newtab-vertical') {

src/zen/workspaces/ZenWorkspaces.mjs

@@ -1863,7 +1863,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
         document.getElementById('zen-tabs-wrapper').style.marginTop = essentialsHeight + 'px';
         pinnedContainer.style.marginTop = '';
       } else {
-        arrowMarginTop += forAnimation ? 0 : essentialsHeight;
+        arrowMarginTop += essentialsHeight;
         pinnedContainer.style.marginTop = essentialsHeight + 'px';
         if (forAnimation) {
           document.getElementById('zen-tabs-wrapper').style.marginTop = '';
@@ -1977,8 +1977,15 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
         essentialsContainer.parentNode.appendChild(essentialsClone);
       }
     }
+    if (shouldAnimate) {
       if (shouldAnimate && this.containerSpecificEssentials) {
         document.getElementById('zen-tabs-wrapper').style.marginTop = '';
+        const waitForContainers = [];
+        for (const element of document.querySelectorAll('.zen-workspace-tabs-section.zen-workspace-pinned-tabs-section')) {
+          waitForContainers.push(this.updateTabsContainers(element, true));
+        }
+        await Promise.all(waitForContainers);
+      }
     }
     for (const element of document.querySelectorAll('.zen-workspace-tabs-section')) {
       if (element.classList.contains('zen-essentials-container')) {
@@ -1990,16 +1997,16 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       const offset = -(newWorkspaceIndex - elementWorkspaceIndex) * 100;
       const newTransform = `translateX(${offset}%)`;
       if (shouldAnimate) {
-        if (element.classList.contains('zen-workspace-pinned-tabs-section') && this.containerSpecificEssentials) {
-          // Note: Do not call with await on purpose, for better timing on animations
-          this.updateTabsContainers(element, true);
-        }
         element.removeAttribute('hidden');
+        // For some reason, motion seems to reset the margin top randomly
+        // so we explicitly set it to the current value
+        const marginTop = element.style.marginTop;
         animations.push(
           gZenUIManager.motion.animate(
             element,
             {
               transform: existingTransform ? [existingTransform, newTransform] : newTransform,
+              marginTop: existingTransform ? [marginTop, marginTop] : marginTop,
             },
             {
               type: 'spring',