diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /devtools/client/inspector/test/browser_inspector_highlighter-03.js | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | devtools/client/inspector/test/browser_inspector_highlighter-03.js | 125 |
1 files changed, 125 insertions, 0 deletions
diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-03.js b/devtools/client/inspector/test/browser_inspector_highlighter-03.js new file mode 100644 index 0000000000..8be820248b --- /dev/null +++ b/devtools/client/inspector/test/browser_inspector_highlighter-03.js @@ -0,0 +1,125 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ +"use strict"; + +// Test that iframes are correctly highlighted. + +const IFRAME_SRC = `<style> + body { + margin:0; + height:100%; + background-color:tomato; + } + </style> + <body class=remote>hello from iframe</body>`; + +const DOCUMENT_SRC = `<style> + iframe { + height:200px; + border: 11px solid black; + padding: 13px; + } + body,iframe,h1 { + margin:0; + padding: 0; + } + </style> + <body> + <iframe src='https://example.com/document-builder.sjs?html=${encodeURIComponent( + IFRAME_SRC + )}'></iframe> + </body>`; + +const TEST_URI = "data:text/html;charset=utf-8," + DOCUMENT_SRC; + +add_task(async function () { + const { inspector, toolbox, highlighterTestFront } = + await openInspectorForURL(TEST_URI); + + info("Waiting for box mode to show."); + const topLevelBodyNodeFront = await getNodeFront("body", inspector); + await inspector.highlighters.showHighlighterTypeForNode( + inspector.highlighters.TYPES.BOXMODEL, + topLevelBodyNodeFront + ); + + info("Waiting for element picker to become active."); + await startPicker(toolbox); + + info("Check that hovering iframe padding does highlight the iframe element"); + // the iframe has 13px of padding, so hovering at [1,1] should be enough. + await hoverElement(inspector, "iframe", 1, 1); + + await isNodeCorrectlyHighlighted(highlighterTestFront, "iframe"); + + info("Scrolling the document"); + await setContentPageElementProperty( + "iframe", + "style", + "margin-bottom: 2000px" + ); + await SpecialPowers.spawn(gBrowser.selectedBrowser, [], () => + content.scrollBy(0, 40) + ); + + // target the body within the iframe + const iframeBodySelector = ["iframe", "body"]; + let iframeHighlighterTestFront = highlighterTestFront; + let bodySelectorWithinHighlighterEnv = iframeBodySelector; + + if (isFissionEnabled() || isEveryFrameTargetEnabled()) { + const target = toolbox.commands.targetCommand + .getAllTargets([toolbox.commands.targetCommand.TYPES.FRAME]) + .find(t => t.url.startsWith("https://example.com")); + + // We need to retrieve the highlighterTestFront for the frame target. + iframeHighlighterTestFront = await getHighlighterTestFront(toolbox, { + target, + }); + + bodySelectorWithinHighlighterEnv = ["body"]; + } + + info("Check that hovering the iframe <body> highlights the expected element"); + await hoverElement(inspector, iframeBodySelector, 40, 40); + + ok( + await iframeHighlighterTestFront.assertHighlightedNode( + bodySelectorWithinHighlighterEnv + ), + "highlighter is shown on the iframe body" + ); + await isNodeCorrectlyHighlighted( + iframeHighlighterTestFront, + iframeBodySelector + ); + + info("Scrolling the document up"); + // scroll up so we can inspect the top level document again + await SpecialPowers.spawn(gBrowser.selectedBrowser, [], () => + content.scrollTo(0, 0) + ); + + info("Check that hovering iframe padding again does work"); + // the iframe has 13px of padding, so hovering at [1,1] should be enough. + await hoverElement(inspector, "iframe", 1, 1); + await isNodeCorrectlyHighlighted(highlighterTestFront, "iframe"); + + info("And finally check that hovering the iframe <body> again does work"); + info("Check that hovering the iframe <body> highlights the expected element"); + await hoverElement(inspector, iframeBodySelector, 40, 40); + + ok( + await iframeHighlighterTestFront.assertHighlightedNode( + bodySelectorWithinHighlighterEnv + ), + "highlighter is shown on the iframe body" + ); + await isNodeCorrectlyHighlighted( + iframeHighlighterTestFront, + iframeBodySelector + ); + + info("Stop the element picker."); + await toolbox.nodePicker.stop({ canceled: true }); +}); |