summaryrefslogtreecommitdiffstats
path: root/devtools/client/webconsole/test/browser/browser_webconsole_split_persist.js
blob: 2f037c6ee009ab31ee9fc2aa7f9ccceef54f0320 (plain)
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
144
/* Any copyright is dedicated to the Public Domain.
 * http://creativecommons.org/publicdomain/zero/1.0/ */

"use strict";

// Test that the split console state is persisted.

const TEST_URI =
  "data:text/html;charset=utf-8,<!DOCTYPE html><p>Web Console test for splitting</p>";

add_task(async function () {
  const getFluentString = await getFluentStringHelper([
    "devtools/client/toolbox.ftl",
  ]);
  const hideLabel = getFluentString("toolbox-meatball-menu-hideconsole-label");
  const showLabel = getFluentString("toolbox-meatball-menu-splitconsole-label");

  info("Opening a tab while there is no user setting on split console pref");
  let toolbox = await openNewTabAndToolbox(TEST_URI, "inspector");
  ok(!toolbox.splitConsole, "Split console is hidden by default");
  is(
    await getSplitConsoleMenuLabel(toolbox),
    showLabel,
    "Split console menu item says split by default"
  );

  await toggleSplitConsoleWithEscape(toolbox);
  ok(toolbox.splitConsole, "Split console is now visible.");
  is(
    await getSplitConsoleMenuLabel(toolbox),
    hideLabel,
    "Split console menu item now says hide"
  );
  ok(getVisiblePrefValue(), "Visibility pref is true");

  is(
    parseInt(getHeightPrefValue(), 10),
    parseInt(toolbox.webconsolePanel.style.height, 10),
    "Panel height matches the pref"
  );
  toolbox.webconsolePanel.style.height = "200px";

  await toolbox.destroy();

  info(
    "Opening a tab while there is a true user setting on split console pref"
  );
  toolbox = await openNewTabAndToolbox(TEST_URI, "inspector");
  ok(toolbox.splitConsole, "Split console is visible by default.");
  ok(
    isInputFocused(toolbox.getPanel("webconsole").hud),
    "Split console input is focused by default"
  );
  is(
    await getSplitConsoleMenuLabel(toolbox),
    hideLabel,
    "Split console menu item initially says hide"
  );
  is(
    getHeightPrefValue(),
    200,
    "Height is set based on panel height after closing"
  );

  toolbox.webconsolePanel.style.height = "1px";
  Assert.greater(
    toolbox.webconsolePanel.clientHeight,
    1,
    "The actual height of the console is bound with a min height"
  );

  await toggleSplitConsoleWithEscape(toolbox);
  ok(!toolbox.splitConsole, "Split console is now hidden.");
  is(
    await getSplitConsoleMenuLabel(toolbox),
    showLabel,
    "Split console menu item now says split"
  );
  ok(!getVisiblePrefValue(), "Visibility pref is false");

  await toolbox.destroy();

  is(
    getHeightPrefValue(),
    1,
    "Height is set based on panel height after closing"
  );

  info(
    "Opening a tab while there is a false user setting on split " +
      "console pref"
  );
  toolbox = await openNewTabAndToolbox(TEST_URI, "inspector");

  ok(!toolbox.splitConsole, "Split console is hidden by default.");
  ok(!getVisiblePrefValue(), "Visibility pref is false");

  await toolbox.destroy();
});

function getVisiblePrefValue() {
  return Services.prefs.getBoolPref("devtools.toolbox.splitconsole.open");
}

function getHeightPrefValue() {
  return Services.prefs.getIntPref("devtools.toolbox.splitconsoleHeight");
}

async function getSplitConsoleMenuLabel(toolbox) {
  const button = toolbox.doc.getElementById("toolbox-meatball-menu-button");
  await waitUntil(
    () => toolbox.win.getComputedStyle(button).pointerEvents === "auto"
  );
  return new Promise(resolve => {
    EventUtils.synthesizeMouseAtCenter(button, {}, toolbox.win);

    toolbox.doc.addEventListener(
      "popupshown",
      () => {
        const menuItem = toolbox.doc.getElementById(
          "toolbox-meatball-menu-splitconsole"
        );

        toolbox.doc.addEventListener(
          "popuphidden",
          () => {
            resolve(menuItem?.querySelector(".label")?.textContent);
          },
          { once: true }
        );
        EventUtils.synthesizeKey("KEY_Escape");
      },
      { once: true }
    );
  });
}

function toggleSplitConsoleWithEscape(toolbox) {
  const onceSplitConsole = toolbox.once("split-console");
  const toolboxWindow = toolbox.win;
  toolboxWindow.focus();
  EventUtils.sendKey("ESCAPE", toolboxWindow);
  return onceSplitConsole;
}