browser_inspector_reload_shadow_dom.js (1601B)
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 "use strict"; 5 6 // Check that the markup view selection is preserved even if the selection is in shadow-dom. 7 8 const HTML = ` 9 <html> 10 <head> 11 <meta charset="utf8"> 12 <title>Test</title> 13 </head> 14 <body> 15 <h1>Shadow DOM test</h1> 16 <test-component> 17 <div slot="slot1" id="el1">content</div> 18 </test-component> 19 <script> 20 'use strict'; 21 22 customElements.define('test-component', class extends HTMLElement { 23 constructor() { 24 super(); 25 const shadowRoot = this.attachShadow({mode: 'open'}); 26 shadowRoot.innerHTML = '<slot class="slot-class" name="slot1"></slot>'; 27 } 28 }); 29 </script> 30 </body> 31 </html> 32 `; 33 34 const TEST_URI = "data:text/html;charset=utf-8," + encodeURI(HTML); 35 36 add_task(async function () { 37 const { inspector } = await openInspectorForURL(TEST_URI); 38 39 info("Select node in shadow DOM"); 40 const nodeFront = await getNodeFrontInShadowDom( 41 "slot", 42 "test-component", 43 inspector 44 ); 45 await selectNode(nodeFront, inspector); 46 47 info("Reloading page."); 48 await navigateTo(TEST_URI); 49 50 const reloadedNodeFront = await getNodeFrontInShadowDom( 51 "slot", 52 "test-component", 53 inspector 54 ); 55 56 is( 57 inspector.selection.nodeFront, 58 reloadedNodeFront, 59 "<slot> is selected after reload." 60 ); 61 });