diff options
Diffstat (limited to 'devtools/client/webconsole/test/browser/browser_webconsole_filter_scroll.js')
-rw-r--r-- | devtools/client/webconsole/test/browser/browser_webconsole_filter_scroll.js | 108 |
1 files changed, 108 insertions, 0 deletions
diff --git a/devtools/client/webconsole/test/browser/browser_webconsole_filter_scroll.js b/devtools/client/webconsole/test/browser/browser_webconsole_filter_scroll.js new file mode 100644 index 0000000000..cafef1fee1 --- /dev/null +++ b/devtools/client/webconsole/test/browser/browser_webconsole_filter_scroll.js @@ -0,0 +1,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 + ); +} |