browser_toolbox_error_count.js (6921B)
1 /* Any copyright is dedicated to the Public Domain. 2 * http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 // Test for error icon and the error count displayed at right of the 6 // toolbox toolbar 7 8 Services.scriptloader.loadSubScript( 9 "chrome://mochitests/content/browser/devtools/client/webconsole/test/browser/shared-head.js", 10 this 11 ); 12 13 const TEST_URI = `https://example.com/document-builder.sjs?html=<meta charset=utf8></meta> 14 <script> 15 console.error("Cache Error1"); 16 console.exception(false, "Cache Exception"); 17 console.warn("Cache warning"); 18 console.assert(false, "Cache assert"); 19 cache.unknown.access 20 </script><body>`; 21 22 const { Toolbox } = require("resource://devtools/client/framework/toolbox.js"); 23 24 add_task(async function () { 25 // Make sure we start the test with the split console closed, and the split console setting enabled 26 await pushPref("devtools.toolbox.splitconsole.open", false); 27 await pushPref("devtools.toolbox.splitconsole.enabled", true); 28 29 const tab = await addTab(TEST_URI); 30 31 const toolbox = await openToolboxForTab( 32 tab, 33 "inspector", 34 Toolbox.HostType.BOTTOM 35 ); 36 37 info("Check for cached errors"); 38 // (console.error + console.exception + console.assert + error) 39 let expectedErrorCount = 4; 40 41 await waitFor(() => getErrorIcon(toolbox)); 42 is( 43 getErrorIcon(toolbox).getAttribute("title"), 44 "Show Split Console", 45 "Icon has expected title" 46 ); 47 is( 48 getErrorIconCount(toolbox), 49 expectedErrorCount, 50 "Correct count is displayed" 51 ); 52 53 info("Check that calling console.clear clears the error count"); 54 ContentTask.spawn(tab.linkedBrowser, null, function () { 55 content.console.clear(); 56 }); 57 await waitFor( 58 () => !getErrorIcon(toolbox), 59 "Wait until the error button hides" 60 ); 61 ok(true, "The button was hidden after calling console.clear()"); 62 63 info("Check that realtime errors increase the counter"); 64 ContentTask.spawn(tab.linkedBrowser, null, function () { 65 content.console.error("Live Error1"); 66 content.console.error("Live Error2"); 67 content.console.exception("Live Exception"); 68 content.console.warn("Live warning"); 69 content.console.assert(false, "Live assert"); 70 content.fetch("unknown-url-that-will-404"); 71 const script = content.document.createElement("script"); 72 script.textContent = `a.b.c.d`; 73 content.document.body.append(script); 74 }); 75 76 expectedErrorCount = 6; 77 await waitFor(() => getErrorIconCount(toolbox) === expectedErrorCount); 78 79 info("Check if split console opens on clicking the error icon"); 80 const onSplitConsoleOpen = toolbox.once("split-console"); 81 getErrorIcon(toolbox).click(); 82 await onSplitConsoleOpen; 83 ok( 84 toolbox.splitConsole, 85 "The split console was opened after clicking on the icon." 86 ); 87 88 // Select the console and check that the icon title is updated 89 await toolbox.selectTool("webconsole"); 90 is( 91 getErrorIcon(toolbox).getAttribute("title"), 92 null, 93 "When the console is selected, the icon does not have a title" 94 ); 95 96 const hud = toolbox.getCurrentPanel().hud; 97 const webconsoleDoc = hud.ui.window.document; 98 // wait until all error messages are displayed in the console 99 await waitFor( 100 async () => (await findAllErrors(hud)).length === expectedErrorCount 101 ); 102 103 info("Clear the console output and check that the error icon is hidden"); 104 webconsoleDoc.querySelector(".devtools-clear-icon").click(); 105 await waitFor(() => !getErrorIcon(toolbox)); 106 ok(true, "Clearing the console does hide the icon"); 107 await waitFor(async () => (await findAllErrors(hud)).length === 0); 108 109 info("Check that the error count is capped at 99"); 110 expectedErrorCount = 100; 111 ContentTask.spawn(tab.linkedBrowser, expectedErrorCount, function (count) { 112 for (let i = 0; i < count; i++) { 113 content.console.error(i); 114 } 115 }); 116 117 // Wait until all the messages are displayed in the console 118 await waitFor( 119 async () => (await findAllErrors(hud)).length === expectedErrorCount 120 ); 121 122 await waitFor(() => getErrorIconCount(toolbox) === "99+"); 123 ok(true, "The message count doesn't go higher than 99"); 124 125 info( 126 "Reload the page and check that the error icon has the expected content" 127 ); 128 await reloadBrowser(); 129 130 // (console.error, console.exception, console.assert and exception) 131 expectedErrorCount = 4; 132 await waitFor(() => getErrorIconCount(toolbox) === expectedErrorCount); 133 ok(true, "Correct count is displayed"); 134 135 // wait until all error messages are displayed in the console 136 await waitFor( 137 async () => (await findAllErrors(hud)).length === expectedErrorCount 138 ); 139 140 info("Disable the error icon from the options panel"); 141 const onOptionsSelected = toolbox.once("options-selected"); 142 toolbox.selectTool("options"); 143 const optionsPanel = await onOptionsSelected; 144 const errorCountButtonToggleEl = optionsPanel.panelWin.document.querySelector( 145 "input#command-button-errorcount" 146 ); 147 errorCountButtonToggleEl.click(); 148 149 await waitFor(() => !getErrorIcon(toolbox)); 150 ok(true, "The error icon hides when disabling it from the settings panel"); 151 152 info("Check that emitting new errors don't show the icon"); 153 ContentTask.spawn(tab.linkedBrowser, null, function () { 154 content.console.error("Live Error1 while disabled"); 155 content.console.error("Live Error2 while disabled"); 156 }); 157 158 expectedErrorCount = expectedErrorCount + 2; 159 // Wait until messages are displayed in the console, so the toolbar would have the time 160 // to render the error icon again. 161 await toolbox.selectTool("webconsole"); 162 await waitFor( 163 async () => (await findAllErrors(hud)).length === expectedErrorCount 164 ); 165 is( 166 getErrorIcon(toolbox), 167 null, 168 "The icon is still hidden even after generating new errors" 169 ); 170 171 info("Re-enable the error icon"); 172 await toolbox.selectTool("options"); 173 errorCountButtonToggleEl.click(); 174 await waitFor(() => getErrorIconCount(toolbox) === expectedErrorCount); 175 ok( 176 true, 177 "The error is displayed again, with the correct error count, after enabling it from the settings panel" 178 ); 179 180 info("Disable the split console from the options panel"); 181 const splitConsoleButtonToggleEl = 182 optionsPanel.panelWin.document.querySelector( 183 "input#devtools-enable-split-console" 184 ); 185 splitConsoleButtonToggleEl.click(); 186 await waitFor( 187 () => getErrorIcon(toolbox).getAttribute("title") === "Show Console" 188 ); 189 ok( 190 true, 191 "The error count icon title changed to reflect split console being disabled" 192 ); 193 194 info( 195 "Check if with split console being disabled click leads to the console tab" 196 ); 197 const onWebConsole = toolbox.once("webconsole-selected"); 198 getErrorIcon(toolbox).click(); 199 await onWebConsole; 200 ok(!toolbox.splitConsole, "Web Console opened instead of split console"); 201 202 toolbox.destroy(); 203 }); 204 205 function findAllErrors(hud) { 206 return findMessagesVirtualizedByType({ hud, typeSelector: ".error" }); 207 }