diff options
Diffstat (limited to 'devtools/client/webconsole/test/browser/browser_console_modes.js')
| -rw-r--r-- | devtools/client/webconsole/test/browser/browser_console_modes.js | 248 |
1 files changed, 248 insertions, 0 deletions
diff --git a/devtools/client/webconsole/test/browser/browser_console_modes.js b/devtools/client/webconsole/test/browser/browser_console_modes.js new file mode 100644 index 0000000000..796d5d1aef --- /dev/null +++ b/devtools/client/webconsole/test/browser/browser_console_modes.js @@ -0,0 +1,248 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// Test that messages from different contexts appears in the Browser Console and that their +// visibility can be controlled through the UI (either with the ChromeDebugToolbar mode whe +// Fission is enabled, or through the "Show Content Messages" setting when it's not). + +"use strict"; + +const FILTER_PREFIX = "BC_TEST|"; + +const contentArgs = { + log: FILTER_PREFIX + "MyLog", + warn: FILTER_PREFIX + "MyWarn", + error: FILTER_PREFIX + "MyError", + exception: FILTER_PREFIX + "MyException", + info: FILTER_PREFIX + "MyInfo", + debug: FILTER_PREFIX + "MyDebug", + counterName: FILTER_PREFIX + "MyCounter", + timerName: FILTER_PREFIX + "MyTimer", +}; + +const TEST_URI = `data:text/html,<!DOCTYPE html><meta charset=utf8>console API calls<script> + console.log("${contentArgs.log}", {hello: "world"}); + console.warn("${contentArgs.warn}", {hello: "world"}); + console.error("${contentArgs.error}", {hello: "world"}); + console.exception("${contentArgs.exception}", {hello: "world"}); + console.info("${contentArgs.info}", {hello: "world"}); + console.debug("${contentArgs.debug}", {hello: "world"}); + console.count("${contentArgs.counterName}"); + console.time("${contentArgs.timerName}"); + console.timeLog("${contentArgs.timerName}", "MyTimeLog", {hello: "world"}); + console.timeEnd("${contentArgs.timerName}"); + console.trace("${FILTER_PREFIX}", {hello: "world"}); + console.assert(false, "${FILTER_PREFIX}", {hello: "world"}); + console.table(["${FILTER_PREFIX}", {hello: "world"}]); +</script>`; + +// Test can be a bit long +requestLongerTimeout(2); + +add_task(async function () { + // Show the content messages + await pushPref("devtools.browsertoolbox.scope", "everything"); + // Show context selector + await pushPref("devtools.chrome.enabled", true); + await pushPref("devtools.webconsole.input.context", true); + + // Open the WebConsole on the tab to check changing mode won't focus the tab + await openNewTabAndConsole(TEST_URI); + + // Open the Browser Console + const hud = await BrowserConsoleManager.toggleBrowserConsole(); + // Set a filter to have predictable results, otherwise we may get messages from Firefox + // polluting the test. + await setFilterState(hud, { text: FILTER_PREFIX }); + + const chromeDebugToolbar = hud.ui.document.querySelector( + ".chrome-debug-toolbar" + ); + ok( + !!chromeDebugToolbar, + "ChromeDebugToolbar is displayed when the Browser Console has fission support" + ); + is( + hud.chromeWindow.document.title, + "Multiprocess Browser Console", + "Browser Console window has expected title" + ); + + const evaluationContextSelectorButton = await waitFor(() => + hud.ui.outputNode.querySelector(".webconsole-evaluation-selector-button") + ); + + info("Select the content process target"); + const pid = + gBrowser.selectedTab.linkedBrowser.browsingContext.currentWindowGlobal + .osPid; + getContextSelectorItems(hud) + .find(item => + item.querySelector(".label")?.innerText?.startsWith(`(pid ${pid})`) + ) + .click(); + + await waitFor(() => + evaluationContextSelectorButton.classList.contains("checked") + ); + + // We can't directly throw in the script as it would be treated as an evaluation result + // and wouldn't be hidden when switching modes. + // Here we use an async-iife in which we throw so this will trigger the proper error + // reporting path. + await executeAndWaitForResultMessage( + hud, + `(async function(){ + throw new Error("${FILTER_PREFIX}Content error") + })(); + 21+21`, + 42 + ); + + await waitFor(() => findErrorMessage(hud, "Content error")); + ok(true, "Error message from content process is displayed"); + + // Emit an error message from the parent process + executeSoon(() => { + expectUncaughtException(); + throw new Error(`${FILTER_PREFIX}Parent error`); + }); + + await waitFor(() => findErrorMessage(hud, "Parent error")); + ok(true, "Parent process message is displayed"); + + const suffix = ` Object { hello: "world" }`; + const expectedMessages = [ + contentArgs.log + suffix, + contentArgs.warn + suffix, + contentArgs.error + suffix, + contentArgs.exception + suffix, + contentArgs.info + suffix, + contentArgs.debug + suffix, + `${contentArgs.counterName}: 1`, + `MyTimeLog${suffix}`, + `timer ended`, + `console.trace() ${FILTER_PREFIX}${suffix}`, + `Assertion failed: ${FILTER_PREFIX}${suffix}`, + `console.table()`, + ]; + + info("wait for all the messages to be displayed"); + await waitFor( + () => + expectedMessages.every( + expectedMessage => + findMessagePartsByType(hud, { + text: expectedMessage, + typeSelector: ".console-api", + partSelector: ".message-body", + }).length == 1 + ), + "wait for all the messages to be displayed", + 100 + ); + ok(true, "Expected messages are displayed in the browser console"); + + const tableMessage = findConsoleAPIMessage(hud, "console.table()", ".table"); + + const table = await waitFor(() => + tableMessage.querySelector(".consoletable") + ); + ok(table, "There is a table element"); + const tableTextContent = table.textContent; + ok( + tableTextContent.includes(FILTER_PREFIX) && + tableTextContent.includes(`world`) && + tableTextContent.includes(`hello`), + "Table has expected content" + ); + + info("Set Browser Console Mode to parent process only"); + chromeDebugToolbar + .querySelector( + `.chrome-debug-toolbar input[name="chrome-debug-mode"][value="parent-process"]` + ) + .click(); + info("Wait for content messages to be hidden"); + await waitFor(() => !findConsoleAPIMessage(hud, contentArgs.log)); + + for (const expectedMessage of expectedMessages) { + ok( + !findConsoleAPIMessage(hud, expectedMessage), + `"${expectedMessage}" is hidden` + ); + } + + is( + hud.chromeWindow.document.title, + "Parent process Browser Console", + "Browser Console window title was updated" + ); + + ok(hud.iframeWindow.document.hasFocus(), "Browser Console is still focused"); + + await waitFor( + () => !evaluationContextSelectorButton.classList.contains("checked") + ); + ok(true, "Changing mode did reset the context selector"); + ok( + findMessageByType(hud, "21+21", ".command"), + "The evaluation message is still displayed" + ); + ok( + findEvaluationResultMessage(hud, `42`), + "The evaluation result is still displayed" + ); + + info( + "Check that message from parent process is still visible in the Browser Console" + ); + ok( + !!findErrorMessage(hud, "Parent error"), + "Parent process message is still displayed" + ); + + info("Set Browser Console Mode to Multiprocess"); + chromeDebugToolbar + .querySelector( + `.chrome-debug-toolbar input[name="chrome-debug-mode"][value="everything"]` + ) + .click(); + + info("Wait for content messages to be displayed"); + await waitFor(() => + expectedMessages.every(expectedMessage => + findConsoleAPIMessage(hud, expectedMessage) + ) + ); + + for (const expectedMessage of expectedMessages) { + // Search into the message body as the message location could have some of the + // searched text. + is( + findMessagePartsByType(hud, { + text: expectedMessage, + typeSelector: ".console-api", + partSelector: ".message-body", + }).length, + 1, + `"${expectedMessage}" is visible` + ); + } + + is( + findErrorMessages(hud, "Content error").length, + 1, + "error message from content process is only displayed once" + ); + + is( + hud.chromeWindow.document.title, + "Multiprocess Browser Console", + "Browser Console window title was updated again" + ); + + info("Clear and close the Browser Console"); + await safeCloseBrowserConsole({ clearOutput: true }); +}); |