browser_inspector_highlighter-cssgrid_02.js (1505B)
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 that grid layouts without items don't cause grid highlighter errors. 8 9 const TEST_URL = ` 10 <style type='text/css'> 11 .grid { 12 display: grid; 13 grid-template-columns: 20px 20px; 14 grid-gap: 15px; 15 } 16 </style> 17 <div class="grid"></div> 18 `; 19 20 const { TYPES } = ChromeUtils.importESModule( 21 "resource://devtools/shared/highlighters.mjs" 22 ); 23 const HIGHLIGHTER_TYPE = TYPES.GRID; 24 25 add_task(async function () { 26 const { inspector, highlighterTestFront } = await openInspectorForURL( 27 "data:text/html;charset=utf-8," + encodeURIComponent(TEST_URL) 28 ); 29 const front = inspector.inspectorFront; 30 const highlighter = await front.getHighlighterByType(HIGHLIGHTER_TYPE); 31 32 info("Try to show the highlighter on the grid container"); 33 const node = await getNodeFront(".grid", inspector); 34 await highlighter.show(node); 35 36 let hidden = await highlighterTestFront.getHighlighterNodeAttribute( 37 "css-grid-canvas", 38 "hidden", 39 highlighter 40 ); 41 ok(!hidden, "The highlighter is visible"); 42 43 info("Hiding the highlighter"); 44 await highlighter.hide(); 45 46 hidden = await highlighterTestFront.getHighlighterNodeAttribute( 47 "css-grid-canvas", 48 "hidden", 49 highlighter 50 ); 51 ok(hidden, "The highlighter is hidden"); 52 53 await highlighter.finalize(); 54 });