browser_inspector_highlighter-geometry_iframe.js (1491B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 "use strict"; 6 7 // Test the creation of the geometry highlighter elements on remote frame. 8 9 const TEST_URL = `data:text/html;charset=utf-8, 10 <iframe src="https://example.org/document-builder.sjs?html=${encodeURIComponent(` 11 <div id='positioned' style=' 12 background:yellow; 13 position:absolute; 14 left:5rem; 15 top:30px;' 16 > 17 Hello from iframe 18 </div>`)}"> 19 </iframe>`; 20 21 add_task(async function () { 22 const { inspector } = await openInspectorForURL(TEST_URL); 23 24 info("Select the absolute positioned node in the iframe"); 25 await selectNodeInFrames(["iframe", "#positioned"], inspector); 26 27 info("Click on the button enabling the highlighter"); 28 const onHighlighterShown = inspector.highlighters.once( 29 "geometry-editor-highlighter-shown" 30 ); 31 const boxModelPanel = inspector.getPanel("boxmodel"); 32 const button = await waitFor(() => 33 boxModelPanel.document.querySelector(".layout-geometry-editor") 34 ); 35 button.click(); 36 37 await onHighlighterShown; 38 ok(true, "Highlighter is displayed"); 39 40 info("Click on the button again to disable the highlighter"); 41 const onHighlighterHidden = inspector.highlighters.once( 42 "geometry-editor-highlighter-hidden" 43 ); 44 45 button.click(); 46 await onHighlighterHidden; 47 ok("Highlighter is hidden"); 48 });