Merge autoland to mozilla-central. a=merge

browser/actors/moz.build

@@ -23,7 +23,7 @@ with Files("PageStyleChild.jsm"):
     BUG_COMPONENT = ("Firefox", "Menus")
 
 with Files("PluginChild.jsm"):
-    BUG_COMPONENT = ("Core", "Plug-ins")
+    BUG_COMPONENT = ("Core", "Audio/Video: GMP")
 
 with Files("ScreenshotsComponentChild.jsm"):
     BUG_COMPONENT = ("Firefox", "Screenshots")

browser/base/content/browser-box.inc.xhtml

@@ -5,20 +5,16 @@
 <hbox flex="1" id="browser">
   <vbox id="sidebar-box" hidden="true" class="chromeclass-extrachrome">
     <box id="sidebar-header" align="center">
-      <toolbarbutton id="sidebar-switcher-target" flex="1" class="tabbable">
+      <toolbarbutton id="sidebar-switcher-target" class="tabbable">
         <image id="sidebar-icon" consumeanchor="sidebar-switcher-target"/>
-        <label id="sidebar-title" crop="end" flex="1" control="sidebar"/>
+        <label id="sidebar-title" crop="end" control="sidebar"/>
         <image id="sidebar-switcher-arrow"/>
       </toolbarbutton>
       <image id="sidebar-throbber"/>
-# To ensure the button label's intrinsic width doesn't expand the sidebar
-# if the label is long, the button needs flex=1.
-# To ensure the button doesn't expand unnecessarily for short labels, the
-# spacer should significantly out-flex the button.
-      <spacer flex="1000"/>
+      <spacer id="sidebar-spacer"/>
       <toolbarbutton id="sidebar-close" class="close-icon tabbable" data-l10n-id="sidebar-close-button" oncommand="SidebarUI.hide();"/>
     </box>
-    <browser id="sidebar" flex="1" autoscroll="false" disablehistory="true" disablefullscreen="true"
+    <browser id="sidebar" autoscroll="false" disablehistory="true" disablefullscreen="true"
               style="min-width: 14em; width: 18em; max-width: 36em;" tooltip="aHTMLTooltip"/>
   </vbox>
 

browser/base/content/browser.css

@@ -32,8 +32,21 @@ body {
   min-width: -moz-fit-content;
 }
 
-/* Prevent shrinking the page content to 0 height and width */
+/* We set large flex on both containers to allow the devtools toolbox to
+ * set a flex value itself. We don't want the toolbox to actually take up free
+ * space, but we do want it to collapse when the window shrinks, and with
+ * flex: 0 it can't.
+ *
+ * When the toolbox is on the bottom it's a sibling of browserStack, and when
+ * it's on the side it's a sibling of browserContainer.
+ */
+.browserContainer {
+  -moz-box-flex: 10000;
+}
+
 .browserStack {
+  -moz-box-flex: 10000;
+  /* Prevent shrinking the page content to 0 height and width */
   min-height: 25px;
   min-width: 25px;
 }

browser/base/content/moz.build

@@ -56,7 +56,7 @@ with Files("test/permissions/**"):
     BUG_COMPONENT = ("Firefox", "Site Permissions")
 
 with Files("test/plugins/**"):
-    BUG_COMPONENT = ("Core", "Plug-ins")
+    BUG_COMPONENT = ("Core", "Audio/Video: GMP")
 
 with Files("test/popupNotifications/**"):
     BUG_COMPONENT = ("Toolkit", "Notifications and Alerts")

browser/base/content/navigator-toolbox.inc.xhtml

@@ -155,7 +155,7 @@
         </toolbarbutton>
       </toolbaritem>
       <toolbarspring cui-areatype="toolbar" class="chromeclass-toolbar-additional"/>
-      <toolbaritem id="urlbar-container" flex="400" persist="width"
+      <toolbaritem id="urlbar-container" persist="width"
                    removable="false"
                    class="chromeclass-location" overflows="false">
         <toolbartabstop/>
@@ -654,7 +654,6 @@
                  class="chromeclass-toolbar-additional"
                  data-l10n-id="navbar-search"
                  align="center"
-                 flex="175"
                  persist="width">
       <toolbartabstop/>
       <searchbar id="searchbar" flex="1"/>

browser/base/content/pageinfo/pageInfo.js

@@ -833,17 +833,17 @@ function onImageSelect() {
     previewBox.collapsed = true;
     mediaSaveBox.collapsed = true;
     splitter.collapsed = true;
-    tree.flex = 1;
+    tree.setAttribute("flex", "1");
   } else if (count > 1) {
     splitter.collapsed = true;
     previewBox.collapsed = true;
     mediaSaveBox.collapsed = false;
-    tree.flex = 1;
+    tree.setAttribute("flex", "1");
   } else {
     mediaSaveBox.collapsed = true;
     splitter.collapsed = false;
     previewBox.collapsed = false;
-    tree.flex = 0;
+    tree.setAttribute("flex", "0");
     makePreview(getSelectedRows(tree)[0]);
   }
 }

browser/base/content/pageinfo/pageInfo.xhtml

@@ -152,11 +152,11 @@
         <tree id="metatree" flex="1" hidecolumnpicker="true" contextmenu="picontext">
           <treecols>
             <treecol id="meta-name"    data-l10n-id="general-meta-name"
-                     persist="width" flex="1"
+                     persist="width" style="-moz-box-flex: 1"
                      onclick="gMetaView.onPageMediaSort('meta-name');"/>
             <splitter class="tree-splitter"/>
             <treecol id="meta-content" data-l10n-id="general-meta-content"
-                     persist="width" flex="4"
+                     persist="width" style="-moz-box-flex: 4"
                      onclick="gMetaView.onPageMediaSort('meta-content');"/>
           </treecols>
           <treechildren id="metatreechildren" flex="1"/>
@@ -172,23 +172,23 @@
       <tree id="imagetree" onselect="onImageSelect();" contextmenu="picontext"
             ondragstart="onBeginLinkDrag(event, 'image-address', 'image-alt')">
         <treecols>
-          <treecol primary="true" persist="width" flex="10"
+          <treecol primary="true" persist="width" style="-moz-box-flex: 10"
                         width="10" id="image-address" data-l10n-id="media-address"
                         onclick="gImageView.onPageMediaSort('image-address');"/>
           <splitter class="tree-splitter"/>
-          <treecol persist="hidden width" flex="2"
+          <treecol persist="hidden width" style="-moz-box-flex: 2"
                         width="2"  id="image-type"    data-l10n-id="media-type"
                         onclick="gImageView.onPageMediaSort('image-type');"/>
           <splitter class="tree-splitter"/>
-          <treecol hidden="true" persist="hidden width" flex="2"
+          <treecol hidden="true" persist="hidden width" style="-moz-box-flex: 2"
                         width="2"  id="image-size"  data-l10n-id="media-size" value="size"
                         onclick="gImageView.onPageMediaSort('image-size');"/>
           <splitter class="tree-splitter"/>
-          <treecol hidden="true" persist="hidden width" flex="4"
-                        width="4"  id="image-alt"    data-l10n-id="media-alt-header"
+          <treecol hidden="true" persist="hidden width" style="-moz-box-flex: 4"
+                        width="4"  id="image-alt" data-l10n-id="media-alt-header"
                         onclick="gImageView.onPageMediaSort('image-alt');"/>
           <splitter class="tree-splitter"/>
-          <treecol hidden="true" persist="hidden width" flex="1"
+          <treecol hidden="true" persist="hidden width" style="-moz-box-flex: 1"
                         width="1"  id="image-count"    data-l10n-id="media-count"
                         onclick="gImageView.onPageMediaSort('image-count');"/>
         </treecols>

browser/base/content/tabbrowser.js

@@ -2161,22 +2161,14 @@
       let notificationbox = document.createXULElement("notificationbox");
       notificationbox.setAttribute("notificationside", "top");
 
-      // We set large flex on both containers to allow the devtools toolbox to
-      // set a flex attribute. We don't want the toolbox to actually take up free
-      // space, but we do want it to collapse when the window shrinks, and with
-      // flex=0 it can't. When the toolbox is on the bottom it's a sibling of
-      // browserStack, and when it's on the side it's a sibling of
-      // browserContainer.
       let stack = document.createXULElement("stack");
       stack.className = "browserStack";
       stack.appendChild(b);
-      stack.setAttribute("flex", "10000");
 
       let browserContainer = document.createXULElement("vbox");
       browserContainer.className = "browserContainer";
       browserContainer.appendChild(notificationbox);
       browserContainer.appendChild(stack);
-      browserContainer.setAttribute("flex", "10000");
 
       let browserSidebarContainer = document.createXULElement("hbox");
       browserSidebarContainer.className = "browserSidebarContainer";

browser/components/BrowserGlue.jsm

@@ -4130,50 +4130,6 @@ BrowserGlue.prototype = {
       lazy.UrlbarPrefs.migrateResultGroups();
     }
 
-    if (currentUIVersion < 119 && AppConstants.NIGHTLY_BUILD) {
-      // Uninstall outdated monochromatic themes for the following UI versions:
-      // 118: Uninstall prototype monochromatic purple theme.
-      // 119 (bug 1732957): Uninstall themes with old IDs.
-      const themeIdsToMigrate = [
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-        "[email protected]",
-      ];
-      try {
-        for (let id of themeIdsToMigrate) {
-          lazy.AddonManager.getAddonByID(id).then(addon => {
-            if (!addon) {
-              // Either the addon wasn't installed, or the call to getAddonByID failed.
-              return;
-            }
-            addon.uninstall().catch(Cu.reportError);
-          }, Cu.reportError);
-        }
-      } catch (error) {
-        Cu.reportError(
-          "Could not access the AddonManager to upgrade the profile. This is most " +
-            "likely because the upgrader is being run from an xpcshell test where " +
-            "the AddonManager is not initialized."
-        );
-      }
-    }
-
     if (currentUIVersion < 120) {
       // Migrate old titlebar bool pref to new int-based one.
       const oldPref = "browser.tabs.drawInTitlebar";

browser/components/firefoxview/featureCallout.mjs

@@ -247,6 +247,12 @@ function _positionCallout() {
   function clearPosition() {
     positions.forEach(position => {
       container.style[position] = "unset";
+      if (container.classList.contains(`arrow-${position}`)) {
+        container.classList.remove(`arrow-${position}`);
+      }
+      if (container.classList.contains(`arrow-inline-${position}`)) {
+        container.classList.remove(`arrow-inline-${position}`);
+      }
     });
   }
 
@@ -270,13 +276,15 @@ function _positionCallout() {
         containerTop
       )}px`;
       centerHorizontally(container, parentEl);
+      container.classList.add("arrow-top");
     },
     // Point to an element below the callout
     bottom() {
       let containerTop =
         getOffset(parentEl).top - container.clientHeight + margin;
       container.style.top = `${Math.max(containerTop, 0)}px`;
       centerHorizontally(container, parentEl);
+      container.classList.add("arrow-bottom");
     },
     // Point to an element to the right of the callout
     left() {
@@ -286,18 +294,24 @@ function _positionCallout() {
         containerLeft
       )}px`;
       container.style.top = `${getOffset(parentEl).top}px`;
+      container.classList.add("arrow-inline-start");
     },
     // Point to an element to the left of the callout
     right() {
       let containerLeft =
         getOffset(parentEl).left - container.offsetWidth + margin;
       container.style.left = `${Math.max(containerLeft, margin)}px`;
       container.style.top = `${getOffset(parentEl).top}px`;
+      container.classList.add("arrow-inline-end");
     },
   };
 
   clearPosition(container);
 
+  if (!container.classList.contains("callout-arrow")) {
+    container.classList.add("callout-arrow");
+  }
+
   if (["start", "end"].includes(arrowPosition)) {
     if (RTL) {
       positioners[arrowPosition === "start" ? "right" : "left"]();

browser/components/firefoxview/tests/browser/browser_feature_callout.js

@@ -415,3 +415,62 @@ add_task(async function feature_callout_only_highlights_existing_elements() {
     }
   );
 });
+
+add_task(async function feature_callout_arrow_class_exists() {
+  await SpecialPowers.pushPrefEnv({
+    set: [
+      ["browser.firefox-view.feature-tour", "{}"],
+      ["intl.l10n.pseudo", ""],
+    ],
+  });
+
+  await BrowserTestUtils.withNewTab(
+    {
+      gBrowser,
+      url: "about:firefoxview",
+    },
+    async browser => {
+      const { document } = browser.contentWindow;
+
+      await waitForCalloutRender(document);
+      await waitForCalloutPositioned(document);
+
+      const arrowParent = document.querySelector(".callout-arrow.arrow-top");
+      ok(arrowParent, "Arrow class exists on parent container");
+    }
+  );
+});
+
+add_task(async function feature_callout_arrow_is_not_flipped_on_ltr() {
+  await SpecialPowers.pushPrefEnv({
+    set: [
+      ["browser.firefox-view.feature-tour", "{}"],
+      ["intl.l10n.pseudo", ""],
+    ],
+  });
+
+  await BrowserTestUtils.withNewTab(
+    {
+      gBrowser,
+      url: "about:firefoxview",
+    },
+    async browser => {
+      const { document } = browser.contentWindow;
+
+      await waitForCalloutRender(document);
+      await waitForCalloutPositioned(document);
+      // Advance to third screen
+      clickPrimaryButton(document);
+      await waitForCalloutScreen(document, ".FEATURE_CALLOUT_2");
+      clickPrimaryButton(document);
+      await waitForCalloutScreen(document, ".FEATURE_CALLOUT_3");
+      let arrowParent = document.querySelector(
+        ".callout-arrow.arrow-inline-end"
+      );
+      ok(
+        arrowParent,
+        "Feature Callout arrow parent has arrow-end class when arrow direction is set to 'end'"
+      );
+    }
+  );
+});