Bug 1367797 - Add reflow tests for adding, removing and switching tabs while the tab strip is overflowed. r?florian draft
authorMike Conley <mconley@mozilla.com>
Mon, 20 Nov 2017 14:58:32 -0500
changeset 700790 fd1ccdf00ef78b648e033eb1d78d2d25ab675f52
parent 700789 ecf27c343d2011bff77c535fdb13d40d67e71ecf
child 741001 69e50b7468eea6a527fbcb43c573dfbb2d4bf562
push id89973
push usermconley@mozilla.com
push dateMon, 20 Nov 2017 22:09:48 +0000
reviewersflorian
bugs1367797
milestone59.0a1
Bug 1367797 - Add reflow tests for adding, removing and switching tabs while the tab strip is overflowed. r?florian MozReview-Commit-ID: DFpA2eGk2X0
browser/base/content/test/performance/browser_tabstrip_overflow_underflow_reflows.js
--- a/browser/base/content/test/performance/browser_tabstrip_overflow_underflow_reflows.js
+++ b/browser/base/content/test/performance/browser_tabstrip_overflow_underflow_reflows.js
@@ -45,16 +45,60 @@ add_task(async function() {
     await BrowserTestUtils.waitForEvent(gBrowser.selectedTab, "transitionend",
         false, e => e.propertyName === "max-width");
     await switchDone;
     await BrowserTestUtils.waitForCondition(() => {
       return gBrowser.tabContainer.arrowScrollbox.hasAttribute("scrolledtoend");
     });
   }, EXPECTED_OVERFLOW_REFLOWS, window);
 
+  await withReflowObserver(async function(dirtyFrame) {
+    let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
+    BrowserOpenTab();
+    await switchDone;
+    await BrowserTestUtils.waitForCondition(() => {
+      return gBrowser.tabContainer.arrowScrollbox.hasAttribute("scrolledtoend");
+    });
+  }, [], window);
+
+  await withReflowObserver(async function(dirtyFrame) {
+    let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
+    await BrowserTestUtils.removeTab(gBrowser.selectedTab, { animate: true });
+    await switchDone;
+  }, [], window);
+
+  // At this point, we have an overflowed tab strip, and we've got the last tab
+  // selected. This should mean that the first tab is scrolled out of view.
+  // Let's test that we don't reflow when switching to that first tab.
+
+  let lastTab = gBrowser.selectedTab;
+  let arrowScrollbox = gBrowser.tabContainer.arrowScrollbox;
+  // First, we'll check that the first tab is actually scrolled out of view.
+  let firstTab = gBrowser.tabContainer.firstChild;
+  let firstTabRect = firstTab.getBoundingClientRect();
+  Assert.ok(firstTabRect.left + firstTabRect.width < arrowScrollbox.scrollPosition,
+            "First tab should be scrolled out of view.");
+
+  // Now switch to the first tab. We shouldn't flush layout at all.
+  await withReflowObserver(async function(dirtyFrame) {
+    let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
+    await BrowserTestUtils.switchTab(gBrowser, firstTab);
+    await switchDone;
+    await BrowserTestUtils.waitForCondition(() => {
+      return gBrowser.tabContainer.arrowScrollbox.hasAttribute("scrolledtostart");
+    });
+  }, [], window);
+
+  // Okay, switch back to the last tab...
+  await BrowserTestUtils.switchTab(gBrowser, lastTab);
+  await BrowserTestUtils.waitForCondition(() => {
+    return gBrowser.tabContainer.arrowScrollbox.hasAttribute("scrolledtoend");
+  });
+
+  // ... and make sure we don't flush layout when closing it.
   await withReflowObserver(async function() {
     let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
     let transitionPromise =
       BrowserTestUtils.waitForEvent(gBrowser.selectedTab,
                                     "transitionend", false,
                                     e => e.propertyName === "max-width");
     await BrowserTestUtils.removeTab(gBrowser.selectedTab, { animate: true });
     await transitionPromise;