browser_inspector_highlighter-eyedropper-xul.js (2692B)
1 /* Any copyright is dedicated to the Public Domain. 2 http://creativecommons.org/publicdomain/zero/1.0/ */ 3 4 "use strict"; 5 6 // Test that the eyedropper icons in the toolbar and in the color picker aren't displayed 7 // when the page isn't an HTML one. 8 9 const TEST_URL = URL_ROOT_SSL + "doc_inspector_eyedropper_disabled.xhtml"; 10 const TEST_URL_2 = 11 "data:text/html;charset=utf-8,<h1 style='color:red'>HTML test page</h1>"; 12 13 add_task(async function () { 14 await SpecialPowers.pushPermissions([ 15 { type: "allowXULXBL", allow: true, context: URL_ROOT_SSL }, 16 ]); 17 18 const { inspector } = await openInspectorForURL(TEST_URL); 19 20 info("Check the inspector toolbar"); 21 let button = inspector.panelDoc.querySelector("#inspector-eyedropper-toggle"); 22 ok(isDisabled(button), "The button is hidden in the toolbar"); 23 24 info("Check the color picker"); 25 await selectNode("#box", inspector); 26 27 // Find the color swatch in the rule-view. 28 let ruleView = inspector.getPanel("ruleview").view; 29 let ruleViewDocument = ruleView.styleDocument; 30 let swatchEl = ruleViewDocument.querySelector(".inspector-colorswatch"); 31 32 info("Open the color picker"); 33 let cPicker = ruleView.tooltips.getTooltip("colorPicker"); 34 let onColorPickerReady = cPicker.once("ready"); 35 swatchEl.click(); 36 await onColorPickerReady; 37 38 button = cPicker.tooltip.container.querySelector("#eyedropper-button"); 39 ok(isDisabled(button), "The button is disabled in the color picker"); 40 41 // Close the picker to avoid pending Promise when the connection closes because of 42 // the navigation to the HTML document (See Bug 1721369). 43 cPicker.hide(); 44 45 info("Navigate to a HTML document"); 46 const toolbarUpdated = inspector.once("inspector-toolbar-updated"); 47 await navigateTo(TEST_URL_2); 48 await toolbarUpdated; 49 50 info("Check the inspector toolbar in HTML document"); 51 button = inspector.panelDoc.querySelector("#inspector-eyedropper-toggle"); 52 ok(!isDisabled(button), "The button is enabled in the toolbar"); 53 54 info("Check the color picker in HTML document"); 55 // Find the color swatch in the rule-view. 56 await selectNode("h1", inspector); 57 58 ruleView = inspector.getPanel("ruleview").view; 59 ruleViewDocument = ruleView.styleDocument; 60 swatchEl = ruleViewDocument.querySelector(".inspector-colorswatch"); 61 62 info("Open the color picker in HTML document"); 63 cPicker = ruleView.tooltips.getTooltip("colorPicker"); 64 onColorPickerReady = cPicker.once("ready"); 65 swatchEl.click(); 66 await onColorPickerReady; 67 68 button = cPicker.tooltip.container.querySelector("#eyedropper-button"); 69 ok(!isDisabled(button), "The button is enabled in the color picker"); 70 }); 71 72 function isDisabled(button) { 73 return button.disabled; 74 }