diff options
Diffstat (limited to 'devtools/client/webconsole/test/browser/browser_jsterm_evaluation_context_selector_targets_update.js')
-rw-r--r-- | devtools/client/webconsole/test/browser/browser_jsterm_evaluation_context_selector_targets_update.js | 242 |
1 files changed, 242 insertions, 0 deletions
diff --git a/devtools/client/webconsole/test/browser/browser_jsterm_evaluation_context_selector_targets_update.js b/devtools/client/webconsole/test/browser/browser_jsterm_evaluation_context_selector_targets_update.js new file mode 100644 index 0000000000..40c75a8e24 --- /dev/null +++ b/devtools/client/webconsole/test/browser/browser_jsterm_evaluation_context_selector_targets_update.js @@ -0,0 +1,242 @@ +/* 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/. */ + +"use strict"; + +const FILE_FOLDER = `browser/devtools/client/webconsole/test/browser`; +const TEST_URI = `https://example.com/${FILE_FOLDER}/test-console-evaluation-context-selector.html`; +const IFRAME_PATH = `${FILE_FOLDER}/test-console-evaluation-context-selector-child.html`; + +// Test that when a target is destroyed, it does not appear in the list anymore (and +// the context is set to the top one if the destroyed target was selected). + +add_task(async function () { + await pushPref("devtools.popups.debug", true); + await pushPref("devtools.webconsole.input.context", true); + + const hud = await openNewTabWithIframesAndConsole(TEST_URI, [ + `https://example.net/${IFRAME_PATH}?id=iframe-1`, + ]); + + const evaluationContextSelectorButton = hud.ui.outputNode.querySelector( + ".webconsole-evaluation-selector-button" + ); + + if (!isFissionEnabled() && !isEveryFrameTargetEnabled()) { + is( + evaluationContextSelectorButton, + null, + "context selector is only displayed when Fission or EFT is enabled" + ); + return; + } + + is( + evaluationContextSelectorButton.innerText, + "Top", + "The button has the expected 'Top' text" + ); + + setInputValue(hud, "document.location.host"); + await waitForEagerEvaluationResult(hud, `"example.com"`); + + info("Check the context selector menu"); + const expectedTopItem = { + label: "Top", + tooltip: TEST_URI, + }; + const expectedSeparatorItem = { separator: true }; + const expectedFirstIframeItem = { + label: "iframe-1|example.net", + tooltip: `https://example.net/${IFRAME_PATH}?id=iframe-1`, + }; + + await checkContextSelectorMenu(hud, [ + { + ...expectedTopItem, + checked: true, + }, + expectedSeparatorItem, + { + ...expectedFirstIframeItem, + checked: false, + }, + ]); + + info("Add another iframe"); + ContentTask.spawn(gBrowser.selectedBrowser, [IFRAME_PATH], function (path) { + const iframe = content.document.createElement("iframe"); + iframe.src = `https://test1.example.org/${path}?id=iframe-2`; + content.document.body.append(iframe); + }); + + // Wait until the new iframe is rendered in the context selector. + await waitFor(() => { + const items = getContextSelectorItems(hud); + return ( + items.length === 4 && + items.some(el => + el + .querySelector(".label") + ?.textContent.includes("iframe-2|test1.example.org") + ) + ); + }); + + const expectedSecondIframeItem = { + label: `iframe-2|test1.example.org`, + tooltip: `https://test1.example.org/${IFRAME_PATH}?id=iframe-2`, + }; + + await checkContextSelectorMenu(hud, [ + { + ...expectedTopItem, + checked: true, + }, + expectedSeparatorItem, + { + ...expectedFirstIframeItem, + checked: false, + }, + { + ...expectedSecondIframeItem, + checked: false, + }, + ]); + + info("Select the first iframe"); + selectTargetInContextSelector(hud, expectedFirstIframeItem.label); + + await waitFor(() => + evaluationContextSelectorButton.innerText.includes("example.net") + ); + await waitForEagerEvaluationResult(hud, `"example.net"`); + ok(true, "The context was set to the selected iframe document"); + + info("Remove the first iframe from the content document"); + ContentTask.spawn(gBrowser.selectedBrowser, [], function () { + content.document.querySelector("iframe").remove(); + }); + + await waitFor(() => + evaluationContextSelectorButton.innerText.includes("Top") + ); + ok( + true, + "The context was set to Top frame after the selected iframe was removed" + ); + await waitForEagerEvaluationResult(hud, `"example.com"`); + ok(true, "Instant evaluation is done against the top frame context"); + + await checkContextSelectorMenu(hud, [ + { + ...expectedTopItem, + checked: true, + }, + expectedSeparatorItem, + { + ...expectedSecondIframeItem, + checked: false, + }, + ]); + + info("Select the remaining iframe"); + selectTargetInContextSelector(hud, expectedSecondIframeItem.label); + + await waitFor(() => + evaluationContextSelectorButton.innerText.includes("test1.example.org") + ); + await waitForEagerEvaluationResult(hud, `"test1.example.org"`); + ok(true, "The context was set to the selected iframe document"); + + info("Remove the second iframe from the content document"); + ContentTask.spawn(gBrowser.selectedBrowser, [], function () { + content.document.querySelector("iframe").remove(); + }); + + await waitFor( + () => + !hud.ui.outputNode.querySelector(".webconsole-evaluation-selector-button") + ); + ok( + true, + "The evaluation context selector is hidden after last iframe was removed" + ); + + await waitForEagerEvaluationResult(hud, `"example.com"`); + ok(true, "Instant evaluation is done against the top frame context"); + + info("Open a popup"); + const originalTab = gBrowser.selectedTab; + let onSwitchedHost = hud.toolbox.once("host-changed"); + await ContentTask.spawn( + gBrowser.selectedBrowser, + [IFRAME_PATH], + function (path) { + content.open(`https://test2.example.org/${path}?id=popup`); + } + ); + await onSwitchedHost; + + // Wait until the popup is rendered in the context selector + // and that it is automatically switched to (aria-checked==true). + await waitFor(() => { + try { + const items = getContextSelectorItems(hud); + return ( + items.length === 3 && + items.some( + el => + el + .querySelector(".label") + ?.textContent.includes("popup|test2.example.org") && + el.getAttribute("aria-checked") === "true" + ) + ); + } catch (e) { + // The context list may be wiped while updating and getContextSelectorItems will throw + } + return false; + }); + + const expectedPopupItem = { + label: `popup|test2.example.org`, + tooltip: `https://test2.example.org/${IFRAME_PATH}?id=popup`, + }; + + await checkContextSelectorMenu(hud, [ + { + ...expectedTopItem, + checked: false, + }, + expectedSeparatorItem, + { + ...expectedPopupItem, + checked: true, + }, + ]); + + await waitForEagerEvaluationResult(hud, `"test2.example.org"`); + ok(true, "The context was set to the popup document"); + + info("Open a second popup and reload the original tab"); + onSwitchedHost = hud.toolbox.once("host-changed"); + await ContentTask.spawn( + originalTab.linkedBrowser, + [IFRAME_PATH], + function (path) { + content.open(`https://test2.example.org/${path}?id=popup2`); + } + ); + await onSwitchedHost; + + // Reloading the tab while having two popups opened used to + // generate exception in the context selector component + await BrowserTestUtils.reloadTab(originalTab); + + ok( + !hud.ui.document.querySelector(".app-error-panel"), + "The web console did not crash" + ); +}); |