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
|
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
const TEST_URI = `data:text/html;charset=utf-8,<!DOCTYPE html>
<p>Web Console test for scroll when filtering.</p>
<script>
for (let i = 0; i < 100; i++) {
console.log("init-" + i);
}
</script>
`;
add_task(async function () {
const hud = await openNewTabAndConsole(TEST_URI);
const { ui } = hud;
const outputContainer = ui.outputNode.querySelector(".webconsole-output");
info("Console should be scrolled to bottom on initial load from page logs");
await waitFor(() => findConsoleAPIMessage(hud, "init-99"));
ok(hasVerticalOverflow(outputContainer), "There is a vertical overflow");
ok(
isScrolledToBottom(outputContainer),
"The console is scrolled to the bottom"
);
info(
"Filter out some messages and check that the scroll position is not impacted"
);
let onMessagesFiltered = waitFor(
() => !findConsoleAPIMessage(hud, "init-0"),
null,
200
);
await setFilterState(hud, { text: "init-9" });
await onMessagesFiltered;
ok(
isScrolledToBottom(outputContainer),
"The console is still scrolled to the bottom after filtering"
);
info(
"Clear the text filter and check that the scroll position is not impacted"
);
let onMessagesUnFiltered = waitFor(
() => findConsoleAPIMessage(hud, "init-0"),
null,
200
);
await setFilterState(hud, { text: "" });
await onMessagesUnFiltered;
ok(
isScrolledToBottom(outputContainer),
"The console is still scrolled to the bottom after clearing the filter"
);
info("Scroll up");
outputContainer.scrollTop = 0;
info("Wait for the layout to stabilize");
await new Promise(r =>
window.requestAnimationFrame(() => TestUtils.executeSoon(r))
);
await setFilterState(hud, { text: "init-9" });
onMessagesFiltered = waitFor(
async () => !findConsoleAPIMessage(hud, "init-0"),
null,
200
);
await onMessagesFiltered;
is(
outputContainer.scrollTop,
0,
"The console is still scrolled to the top after filtering"
);
info(
"Clear the text filter and check that the scroll position is not impacted"
);
onMessagesUnFiltered = waitFor(
() => findConsoleAPIMessage(hud, "init-0"),
null,
200
);
await setFilterState(hud, { text: "" });
await onMessagesUnFiltered;
is(
outputContainer.scrollTop,
0,
"The console is still scrolled to the top after clearing the filter"
);
});
function hasVerticalOverflow(container) {
return container.scrollHeight > container.clientHeight;
}
function isScrolledToBottom(container) {
if (!container.lastChild) {
return true;
}
const lastNodeHeight = container.lastChild.clientHeight;
return (
container.scrollTop + container.clientHeight >=
container.scrollHeight - lastNodeHeight / 2
);
}
|
