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
|
"use strict";
/**
* WHOA THERE: We should never be adding new things to EXPECTED_REFLOWS. This
* list should slowly go away as we improve the performance of the front-end.
* Instead of adding more 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 = [
{
stack: [
"clientX@chrome://browser/content/tabbrowser-tabs.js",
"startTabDrag@chrome://browser/content/tabbrowser-tabs.js",
"on_dragstart@chrome://browser/content/tabbrowser-tabs.js",
"handleEvent@chrome://browser/content/tabbrowser-tabs.js",
"synthesizeMouseAtPoint@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
"synthesizeMouse@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
"synthesizePlainDragAndDrop@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
],
maxCount: 2,
},
{
stack: [
"startTabDrag@chrome://browser/content/tabbrowser-tabs.js",
"on_dragstart@chrome://browser/content/tabbrowser-tabs.js",
"handleEvent@chrome://browser/content/tabbrowser-tabs.js",
"synthesizeMouseAtPoint@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
"synthesizeMouse@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
"synthesizePlainDragAndDrop@chrome://mochikit/content/tests/SimpleTest/EventUtils.js",
],
},
];
/**
* This test ensures that there are no unexpected uninterruptible reflows when
* detaching a tab via drag and drop. The first testcase tests a non-overflowed
* tab strip, and the second tests an overflowed one.
*/
add_task(async function test_detach_not_overflowed() {
await ensureNoPreloadedBrowser();
await createTabs(1);
// Make sure we didn't overflow, as expected
await TestUtils.waitForCondition(() => {
return !gBrowser.tabContainer.hasAttribute("overflow");
});
let win;
await withPerfObserver(
async function () {
win = await detachTab(gBrowser.tabs[1]);
},
{
expectedReflows: EXPECTED_REFLOWS,
// we are opening a whole new window, so there's no point in tracking
// rects being painted
frames: { filter: rects => [] },
}
);
await BrowserTestUtils.closeWindow(win);
win = null;
});
add_task(async function test_detach_overflowed() {
const TAB_COUNT_FOR_OVERFLOW = computeMaxTabCount();
await createTabs(TAB_COUNT_FOR_OVERFLOW + 1);
// Make sure we overflowed, as expected
await TestUtils.waitForCondition(() => {
return gBrowser.tabContainer.hasAttribute("overflow");
});
let win;
await withPerfObserver(
async function () {
win = await detachTab(
gBrowser.tabs[Math.floor(TAB_COUNT_FOR_OVERFLOW / 2)]
);
},
{
expectedReflows: EXPECTED_REFLOWS,
// we are opening a whole new window, so there's no point in tracking
// rects being painted
frames: { filter: rects => [] },
}
);
await BrowserTestUtils.closeWindow(win);
win = null;
await removeAllButFirstTab();
});
async function detachTab(tab) {
let newWindowPromise = BrowserTestUtils.waitForNewWindow();
await EventUtils.synthesizePlainDragAndDrop({
srcElement: tab,
// destElement is null because tab detaching happens due
// to a drag'n'drop on an invalid drop target.
destElement: null,
// don't move horizontally because that could cause a tab move
// animation, and there's code to prevent a tab detaching if
// the dragged tab is released while the animation is running.
stepX: 0,
stepY: 100,
});
return newWindowPromise;
}
|