1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
|
/* 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://developer.mozilla.org/en-US/Firefox/Performance_best_practices_for_Firefox_fe_engineers
* 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;
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 firstTabLabelRect = gBrowser.selectedTab.textLabel.getBoundingClientRect();
let textBoxRect = gURLBar
.querySelector("moz-input-box")
.getBoundingClientRect();
let inRange = (val, min, max) => min <= val && val <= max;
// 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 =>
!(
// We expect all changes to be within the tab strip.
(
r.y1 >= tabStripRect.top &&
r.y2 <= tabStripRect.bottom &&
r.x1 >= tabStripRect.left &&
r.x2 <= tabStripRect.right &&
// 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.
((inRange(r.w, firstTabRect.width, firstTabRect.width * 2) &&
r.x1 == firstTabRect.x) ||
// The second tab gets painted several times due to tabopen animation.
(inRange(
r.x1,
firstTabRect.right - 1, // -1 for the border on Win7
firstTabRect.right + firstTabRect.width
) &&
r.x2 < firstTabRect.right + firstTabRect.width + 25) || // The + 25 is because sometimes the '+' is in the same rect.
// 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.
(r.h == 14 && r.w <= 2 * 14 + kMaxEmptyPixels) ||
// We sometimes have a rect for the right most 2px of the '+' button.
(r.h == 2 && r.w == 2) ||
// Same for the 'X' icon.
(r.h == 10 && r.w <= 2 * 10))
)
)
),
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;
});
|