browser_rules_edit-selector_04.js (2164B)
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 selector highlighter is removed when modifying a selector and 7 // the selector highlighter works for the newly added unmatched rule. 8 9 const TEST_URI = ` 10 <style type="text/css"> 11 p { 12 background: red; 13 } 14 </style> 15 <p>Test the selector highlighter</p> 16 `; 17 18 add_task(async function () { 19 await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); 20 const { inspector, view } = await openRuleView(); 21 await selectNode("p", inspector); 22 23 await testSelectorHighlight(view, "p"); 24 await testEditSelector(inspector, view, "body"); 25 await testSelectorHighlight(view, "body"); 26 }); 27 28 async function testSelectorHighlight(view, selector) { 29 info("Test creating selector highlighter"); 30 31 info("Clicking on a selector icon"); 32 const { highlighter, isShown } = await clickSelectorIcon(view, selector); 33 34 ok(highlighter, "The selector highlighter instance was created"); 35 ok(isShown, "The selector highlighter was shown"); 36 } 37 38 async function testEditSelector(inspector, view, name) { 39 info("Test editing existing selector fields"); 40 41 const ruleEditor = getRuleViewRuleEditor(view, 1); 42 43 info("Focusing an existing selector name in the rule-view"); 44 const editor = await focusEditableField(view, ruleEditor.selectorText); 45 46 is( 47 inplaceEditor(ruleEditor.selectorText), 48 editor, 49 "The selector editor got focused" 50 ); 51 52 const onRuleViewChanged = view.once("ruleview-changed"); 53 const { waitForHighlighterTypeHidden } = getHighlighterTestHelpers(inspector); 54 const onSelectorHighlighterHidden = waitForHighlighterTypeHidden( 55 inspector.highlighters.TYPES.SELECTOR 56 ); 57 58 info("Entering a new selector name and committing"); 59 editor.input.value = name; 60 EventUtils.synthesizeKey("KEY_Enter"); 61 62 info("Waiting for Rules view to update"); 63 await onRuleViewChanged; 64 await onSelectorHighlighterHidden; 65 const highlighter = inspector.highlighters.getActiveHighlighter( 66 inspector.highlighters.TYPES.SELECTOR 67 ); 68 69 ok(!highlighter, "The highlighter instance was removed"); 70 }