browser_grids_display-setting-show-grid-areas.js (1578B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Tests that the 'Display grid areas' grid highlighter setting will update 7 // the redux store and pref setting. 8 9 const TEST_URI = ` 10 <style type='text/css'> 11 #grid { 12 display: grid; 13 } 14 </style> 15 <div id="grid"> 16 <div id="cell1">cell1</div> 17 <div id="cell2">cell2</div> 18 </div> 19 `; 20 21 const SHOW_GRID_AREAS_PREF = "devtools.gridinspector.showGridAreas"; 22 23 add_task(async function () { 24 await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); 25 const { inspector, gridInspector } = await openLayoutView(); 26 const { document: doc } = gridInspector; 27 const { store } = inspector; 28 29 await selectNode("#grid", inspector); 30 const checkbox = doc.getElementById("grid-setting-show-grid-areas"); 31 32 ok( 33 !Services.prefs.getBoolPref(SHOW_GRID_AREAS_PREF), 34 "'Display grid areas' is pref off by default." 35 ); 36 37 info("Toggling ON the 'Display grid areas' setting."); 38 let onCheckboxChange = waitUntilState( 39 store, 40 state => state.highlighterSettings.showGridAreasOverlay 41 ); 42 checkbox.click(); 43 await onCheckboxChange; 44 45 info("Toggling OFF the 'Display grid areas' setting."); 46 onCheckboxChange = waitUntilState( 47 store, 48 state => !state.highlighterSettings.showGridAreasOverlay 49 ); 50 checkbox.click(); 51 await onCheckboxChange; 52 53 ok( 54 !Services.prefs.getBoolPref(SHOW_GRID_AREAS_PREF), 55 "'Display grid areas' is pref off." 56 ); 57 58 Services.prefs.clearUserPref(SHOW_GRID_AREAS_PREF); 59 });