browser_rules_edit-value-after-name_02.js (2057B)
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 hitting shift + click on color swatch while editing the property 7 // name will only change the color unit and not lead to edit the property value. 8 // See also Bug 1248274. 9 10 const TEST_URI = ` 11 <style type="text/css"> 12 div { 13 color: red; 14 } 15 </style> 16 <div>Styled Node</div> 17 `; 18 19 add_task(async function () { 20 await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); 21 const { inspector, view } = await openRuleView(); 22 23 info("Test shift + click on color swatch while editing property name"); 24 25 await selectNode("div", inspector); 26 const prop = getTextProperty(view, 1, { 27 color: "red", 28 }); 29 const propEditor = prop.editor; 30 31 const swatchSpan = propEditor.valueSpan.querySelector( 32 ".inspector-colorswatch" 33 ); 34 35 info("Focus the background name span"); 36 await focusEditableField(view, propEditor.nameSpan); 37 const editor = inplaceEditor(propEditor.doc.activeElement); 38 39 info( 40 "Modify the property to background-color to trigger the " + 41 "property-value-updated event" 42 ); 43 editor.input.value = "background-color"; 44 45 const onPropertyValueUpdate = view.once("property-value-updated"); 46 const onSwatchUnitChange = once(swatchSpan, "unit-change"); 47 const onRuleViewChanged = view.once("ruleview-changed"); 48 49 info("blur propEditor.nameSpan by clicking on the color swatch"); 50 EventUtils.synthesizeMouseAtCenter( 51 swatchSpan, 52 { shiftKey: true }, 53 propEditor.doc.defaultView 54 ); 55 56 info( 57 "wait for ruleview-changed event to be triggered to prevent pending requests" 58 ); 59 await onRuleViewChanged; 60 61 info("wait for the color unit to change"); 62 await onSwatchUnitChange; 63 ok(true, "the color unit was changed"); 64 65 info("wait for the property value to be updated"); 66 await onPropertyValueUpdate; 67 68 ok( 69 !inplaceEditor(propEditor.valueSpan), 70 "The inplace editor wasn't shown " + 71 "as a result of the color swatch shift + click" 72 ); 73 });