browser_inspector_highlighter-05.js (2508B)
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 /* eslint-disable mozilla/no-arbitrary-setTimeout */ 5 6 "use strict"; 7 8 // This is testing that the Anonymous Content is properly inserted into the document. 9 // Usually that is happening during the "interactive" state of the document, to have them 10 // ready as soon as possible. 11 // However, in some conditions, that's not possible since we don't have access yet to 12 // the `CustomContentContainer`, that is used to add the Anonymous Content. 13 // That can happen if the page has some external resource, as <link>, that takes time 14 // to load and / or returns the wrong content. This is not happening, for instance, with 15 // images. 16 // 17 // In those case, we want to be sure that if we're not able to insert the Anonymous 18 // Content at the "interactive" state, we're doing so when the document is loaded. 19 // 20 // See: https://bugzilla.mozilla.org/show_bug.cgi?id=1365075 21 22 const server = createTestHTTPServer(); 23 const filepath = "/slow.css"; 24 const cssuri = `http://localhost:${server.identity.primaryPort}${filepath}`; 25 26 // Register a slow css file handler so we can simulate a long loading time. 27 server.registerContentType("css", "text/css"); 28 server.registerPathHandler(filepath, (metadata, response) => { 29 info("CSS has been requested"); 30 response.processAsync(); 31 setTimeout(() => { 32 info("CSS is responding"); 33 response.finish(); 34 }, 2000); 35 }); 36 37 const TEST_URL = 38 "data:text/html," + 39 encodeURIComponent(` 40 <!DOCTYPE html> 41 <html> 42 <head> 43 <link href="${cssuri}" rel="stylesheet" /> 44 </head> 45 <body> 46 <p>Slow page</p> 47 </body> 48 </html> 49 `); 50 51 add_task(async function () { 52 info("Open the inspector to a blank page."); 53 const { inspector } = await openInspectorForURL("about:blank"); 54 55 info("Navigate to the test url and waiting for the page to be loaded."); 56 await navigateTo(TEST_URL); 57 58 info("Shows the box model highligher for the <p> node."); 59 const nodeFront = await getNodeFront("p", inspector); 60 await inspector.highlighters.showHighlighterTypeForNode( 61 inspector.highlighters.TYPES.BOXMODEL, 62 nodeFront 63 ); 64 65 info("Check the node is highlighted."); 66 const highlighterTestFront = await getHighlighterTestFront(inspector.toolbox); 67 is( 68 await highlighterTestFront.isHighlighting(), 69 true, 70 "Box Model highlighter is working as expected." 71 ); 72 });