summaryrefslogtreecommitdiffstats
path: root/browser/base/content/test/performance/browser_tabopen.js
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /browser/base/content/test/performance/browser_tabopen.js
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'browser/base/content/test/performance/browser_tabopen.js')
-rw-r--r--browser/base/content/test/performance/browser_tabopen.js201
1 files changed, 201 insertions, 0 deletions
diff --git a/browser/base/content/test/performance/browser_tabopen.js b/browser/base/content/test/performance/browser_tabopen.js
new file mode 100644
index 0000000000..2457812cb7
--- /dev/null
+++ b/browser/base/content/test/performance/browser_tabopen.js
@@ -0,0 +1,201 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * WHOA THERE: We should never be adding new things to EXPECTED_REFLOWS.
+ * Instead of adding reflows to the list, you should be modifying your code to
+ * avoid the reflow.
+ *
+ * See https://firefox-source-docs.mozilla.org/performance/bestpractices.html
+ * for tips on how to do that.
+ */
+const EXPECTED_REFLOWS = [
+ /**
+ * Nothing here! Please don't add anything new!
+ */
+];
+
+/*
+ * This test ensures that there are no unexpected
+ * uninterruptible reflows when opening new tabs.
+ */
+add_task(async function () {
+ // Force-enable tab animations
+ gReduceMotionOverride = false;
+
+ // TODO (bug 1702653): Disable tab shadows for tests since the shadow
+ // can extend outside of the boundingClientRect. The tabRect will need
+ // to grow to include the shadow size.
+ gBrowser.tabContainer.setAttribute("noshadowfortests", "true");
+
+ await ensureNoPreloadedBrowser();
+ await disableFxaBadge();
+
+ // The test starts on about:blank and opens an about:blank
+ // tab which triggers opening the toolbar since
+ // ensureNoPreloadedBrowser sets AboutNewTab.newTabURL to about:blank.
+ await SpecialPowers.pushPrefEnv({
+ set: [["browser.toolbars.bookmarks.visibility", "never"]],
+ });
+
+ // Prepare the window to avoid flicker and reflow that's unrelated to our
+ // tab opening operation.
+ gURLBar.focus();
+
+ let tabStripRect =
+ gBrowser.tabContainer.arrowScrollbox.getBoundingClientRect();
+
+ let firstTabRect = gBrowser.selectedTab.getBoundingClientRect();
+ let tabPaddingStart = parseFloat(
+ getComputedStyle(gBrowser.selectedTab).paddingInlineStart
+ );
+ let minTabWidth = firstTabRect.width - 2 * tabPaddingStart;
+ let maxTabWidth = firstTabRect.width;
+ let firstTabLabelRect =
+ gBrowser.selectedTab.textLabel.getBoundingClientRect();
+ let newTabButtonRect = document
+ .getElementById("tabs-newtab-button")
+ .getBoundingClientRect();
+ let textBoxRect = gURLBar
+ .querySelector("moz-input-box")
+ .getBoundingClientRect();
+
+ let inRange = (val, min, max) => min <= val && val <= max;
+
+ info(`tabStripRect=${JSON.stringify(tabStripRect)}`);
+ info(`firstTabRect=${JSON.stringify(firstTabRect)}`);
+ info(`tabPaddingStart=${JSON.stringify(tabPaddingStart)}`);
+ info(`firstTabLabelRect=${JSON.stringify(firstTabLabelRect)}`);
+ info(`newTabButtonRect=${JSON.stringify(newTabButtonRect)}`);
+ info(`textBoxRect=${JSON.stringify(textBoxRect)}`);
+
+ let inTabStrip = function (r) {
+ return (
+ r.y1 >= tabStripRect.top &&
+ r.y2 <= tabStripRect.bottom &&
+ r.x1 >= tabStripRect.left &&
+ r.x2 <= tabStripRect.right
+ );
+ };
+
+ const kTabCloseIconWidth = 13;
+
+ let isExpectedChange = function (r) {
+ // We expect all changes to be within the tab strip.
+ if (!inTabStrip(r)) {
+ return false;
+ }
+
+ // The first tab should get deselected at the same time as the next tab
+ // starts appearing, so we should have one rect that includes the first tab
+ // but is wider.
+ if (
+ inRange(r.w, minTabWidth, maxTabWidth * 2) &&
+ inRange(r.x1, firstTabRect.x, firstTabRect.x + tabPaddingStart)
+ ) {
+ return true;
+ }
+
+ // The second tab gets painted several times due to tabopen animation.
+ let isSecondTabRect =
+ inRange(
+ r.x1,
+ // When the animation starts the tab close icon overflows.
+ // -1 for the border on Win7
+ firstTabRect.right - kTabCloseIconWidth - 1,
+ firstTabRect.right + firstTabRect.width
+ ) &&
+ r.x2 <
+ firstTabRect.right +
+ firstTabRect.width +
+ // Sometimes the '+' is in the same rect.
+ newTabButtonRect.width;
+
+ if (isSecondTabRect) {
+ return true;
+ }
+ // The '+' icon moves with an animation. At the end of the animation
+ // the former and new positions can touch each other causing the rect
+ // to have twice the icon's width.
+ if (
+ r.h == kTabCloseIconWidth &&
+ r.w <= 2 * kTabCloseIconWidth + kMaxEmptyPixels
+ ) {
+ return true;
+ }
+
+ // We sometimes have a rect for the right most 2px of the '+' button.
+ if (r.h == 2 && r.w == 2) {
+ return true;
+ }
+
+ // Same for the 'X' icon.
+ if (r.h == 10 && r.w <= 2 * 10) {
+ return true;
+ }
+
+ // Other changes are unexpected.
+ return false;
+ };
+
+ // Add a reflow observer and open a new tab.
+ await withPerfObserver(
+ async function () {
+ let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
+ BrowserOpenTab();
+ await BrowserTestUtils.waitForEvent(
+ gBrowser.selectedTab,
+ "TabAnimationEnd"
+ );
+ await switchDone;
+ },
+ {
+ expectedReflows: EXPECTED_REFLOWS,
+ frames: {
+ filter: rects => rects.filter(r => !isExpectedChange(r)),
+ exceptions: [
+ {
+ name:
+ "bug 1446452 - the new tab should appear at the same time as the" +
+ " previous one gets deselected",
+ condition: r =>
+ // In tab strip
+ r.y1 >= tabStripRect.top &&
+ r.y2 <= tabStripRect.bottom &&
+ // Position and size of the first tab.
+ r.x1 == firstTabRect.left &&
+ inRange(
+ r.w,
+ firstTabRect.width - 1, // -1 as the border doesn't change
+ firstTabRect.width
+ ),
+ },
+ {
+ name: "the urlbar placeolder moves up and down by a few pixels",
+ // This seems to only happen on the second run in --verify
+ condition: r =>
+ r.x1 >= textBoxRect.left &&
+ r.x2 <= textBoxRect.right &&
+ r.y1 >= textBoxRect.top &&
+ r.y2 <= textBoxRect.bottom,
+ },
+ {
+ name: "bug 1477966 - the name of a deselected tab should appear immediately",
+ condition: r =>
+ AppConstants.platform == "macosx" &&
+ r.x1 >= firstTabLabelRect.x &&
+ r.x2 <= firstTabLabelRect.right &&
+ r.y1 >= firstTabLabelRect.y &&
+ r.y2 <= firstTabLabelRect.bottom,
+ },
+ ],
+ },
+ }
+ );
+
+ let switchDone = BrowserTestUtils.waitForEvent(window, "TabSwitchDone");
+ BrowserTestUtils.removeTab(gBrowser.selectedTab);
+ await switchDone;
+});