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
|
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that a button to access tools hidden by toolbar overflow is displayed when the
// toolbar starts to present an overflow.
const { Toolbox } = require("resource://devtools/client/framework/toolbox.js");
add_task(async function () {
const tab = await addTab("about:blank");
info("Open devtools on the Inspector in a bottom dock");
const toolbox = await openToolboxForTab(
tab,
"inspector",
Toolbox.HostType.BOTTOM
);
const hostWindow = toolbox.topWindow;
const originalWidth = hostWindow.outerWidth;
const originalHeight = hostWindow.outerHeight;
info(
"Resize devtools window to a width that should not trigger any overflow"
);
let onResize = once(hostWindow, "resize");
hostWindow.resizeTo(1350, 300);
await onResize;
info("Wait for all buttons to be displayed");
await waitUntil(() => {
return (
toolbox.panelDefinitions.length ===
toolbox.doc.querySelectorAll(".devtools-tab").length
);
});
let chevronMenuButton = toolbox.doc.querySelector(".tools-chevron-menu");
ok(!chevronMenuButton, "The chevron menu button is not displayed");
info("Resize devtools window to a width that should trigger an overflow");
onResize = once(hostWindow, "resize");
hostWindow.resizeTo(800, 300);
await onResize;
await waitUntil(() => !toolbox.doc.querySelector(".tools-chevron-menu"));
info("Wait until the chevron menu button is available");
await waitUntil(() => toolbox.doc.querySelector(".tools-chevron-menu"));
chevronMenuButton = toolbox.doc.querySelector(".tools-chevron-menu");
ok(chevronMenuButton, "The chevron menu button is displayed");
info(
"Open the tools-chevron-menupopup and verify that the inspector button is checked"
);
await openChevronMenu(toolbox);
const inspectorButton = toolbox.doc.querySelector(
"#tools-chevron-menupopup-inspector"
);
ok(!inspectorButton, "The chevron menu doesn't have the inspector button.");
const consoleButton = toolbox.doc.querySelector(
"#tools-chevron-menupopup-webconsole"
);
ok(!consoleButton, "The chevron menu doesn't have the console button.");
const storageButton = toolbox.doc.querySelector(
"#tools-chevron-menupopup-storage"
);
ok(storageButton, "The chevron menu has the storage button.");
info("Switch to the performance using the tools-chevron-menupopup popup");
const onSelected = toolbox.once("storage-selected");
storageButton.click();
await onSelected;
info("Restore the original window size");
onResize = once(hostWindow, "resize");
hostWindow.resizeTo(originalWidth, originalHeight);
await onResize;
});
|
