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
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
/**
* Tests that if only hidden widgets are overflowed that the
* OverflowableToolbar won't show the overflow panel anchor.
*/
const kHiddenButtonID = "fake-hidden-button";
const kDisplayNoneButtonID = "display-none-button";
const kWebExtensionButtonID1 = "fake-webextension-button-1";
const kWebExtensionButtonID2 = "fake-webextension-button-2";
let gWin = null;
add_setup(async function () {
gWin = await BrowserTestUtils.openNewBrowserWindow();
// To make it easier to write a test where we can control overflowing
// for a test that can run in a bunch of environments with slightly
// different rules on when things will overflow, we'll go ahead and
// just remove everything removable from the nav-bar by default. Then
// we'll add our hidden item, and a single WebExtension item, and
// force toolbar overflow.
let widgetIDs = CustomizableUI.getWidgetIdsInArea(CustomizableUI.AREA_NAVBAR);
for (let widgetID of widgetIDs) {
if (CustomizableUI.isWidgetRemovable(widgetID)) {
CustomizableUI.removeWidgetFromArea(widgetID);
}
}
CustomizableUI.createWidget({
id: kWebExtensionButtonID1,
label: "Test WebExtension widget 1",
defaultArea: CustomizableUI.AREA_NAVBAR,
webExtension: true,
});
CustomizableUI.createWidget({
id: kWebExtensionButtonID2,
label: "Test WebExtension widget 2",
defaultArea: CustomizableUI.AREA_NAVBAR,
webExtension: true,
});
// Let's force the WebExtension widgets to be significantly wider. This
// just makes it easier to ensure that both of these (which are to the left
// of the hidden widget) get overflowed.
for (let webExtID of [kWebExtensionButtonID1, kWebExtensionButtonID2]) {
let webExtNode = CustomizableUI.getWidget(webExtID).forWindow(gWin).node;
webExtNode.style.minWidth = "100px";
}
CustomizableUI.createWidget({
id: kHiddenButtonID,
label: "Test hidden=true widget",
defaultArea: CustomizableUI.AREA_NAVBAR,
});
// Now hide the button with hidden=true so that it has no dimensions.
let hiddenButtonNode =
CustomizableUI.getWidget(kHiddenButtonID).forWindow(gWin).node;
hiddenButtonNode.hidden = true;
CustomizableUI.createWidget({
id: kDisplayNoneButtonID,
label: "Test display:none widget",
defaultArea: CustomizableUI.AREA_NAVBAR,
});
// Now hide the button with display: none so that it has no dimensions.
let displayNoneButtonNode =
CustomizableUI.getWidget(kDisplayNoneButtonID).forWindow(gWin).node;
displayNoneButtonNode.style.display = "none";
registerCleanupFunction(async () => {
CustomizableUI.destroyWidget(kWebExtensionButtonID1);
CustomizableUI.destroyWidget(kWebExtensionButtonID2);
CustomizableUI.destroyWidget(kHiddenButtonID);
CustomizableUI.destroyWidget(kDisplayNoneButtonID);
await BrowserTestUtils.closeWindow(gWin);
await CustomizableUI.reset();
});
});
add_task(async function test_hidden_widget_overflow() {
gWin.resizeTo(kForceOverflowWidthPx, window.outerHeight);
// Wait until the left-most fake WebExtension button is overflowing.
let webExtNode = CustomizableUI.getWidget(kWebExtensionButtonID1).forWindow(
gWin
).node;
await BrowserTestUtils.waitForMutationCondition(
webExtNode,
{ attributes: true },
() => {
return webExtNode.hasAttribute("overflowedItem");
}
);
let hiddenButtonNode =
CustomizableUI.getWidget(kHiddenButtonID).forWindow(gWin).node;
Assert.ok(
hiddenButtonNode.hasAttribute("overflowedItem"),
"Hidden button should be overflowed."
);
let overflowButton = gWin.document.getElementById("nav-bar-overflow-button");
Assert.ok(
!BrowserTestUtils.isVisible(overflowButton),
"Overflow panel button should be hidden."
);
});
|