diff options
Diffstat (limited to 'devtools/client/inspector/rules/test/browser_rules_add-property-and-reselect.js')
-rw-r--r-- | devtools/client/inspector/rules/test/browser_rules_add-property-and-reselect.js | 63 |
1 files changed, 63 insertions, 0 deletions
diff --git a/devtools/client/inspector/rules/test/browser_rules_add-property-and-reselect.js b/devtools/client/inspector/rules/test/browser_rules_add-property-and-reselect.js new file mode 100644 index 0000000000..d71af090cf --- /dev/null +++ b/devtools/client/inspector/rules/test/browser_rules_add-property-and-reselect.js @@ -0,0 +1,63 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Tests that adding properties to rules work and reselecting the element still +// show them. + +const TEST_URI = URL_ROOT + "doc_content_stylesheet.html"; + +add_task(async function () { + await addTab(TEST_URI); + const { inspector, view } = await openRuleView(); + await selectNode("#target", inspector); + + info("Setting a font-weight property on all rules"); + await setPropertyOnAllRules(view, inspector); + + info("Reselecting the element"); + await selectNode("body", inspector); + await selectNode("#target", inspector); + + checkPropertyOnAllRules(view); +}); + +async function setPropertyOnAllRules(view, inspector) { + // Set the inline style rule first independently because it needs to wait for specific + // events and the DOM mutation that it causes refreshes the rules view, so we need to + // get the list of rules again later. + info("Adding font-weight:bold in the inline style rule"); + const inlineStyleRuleEditor = view._elementStyle.rules[0].editor; + + const onMutation = inspector.once("markupmutation"); + const onRuleViewRefreshed = view.once("ruleview-refreshed"); + + inlineStyleRuleEditor.addProperty("font-weight", "bold", "", true); + + await Promise.all([onMutation, onRuleViewRefreshed]); + + // Now set the other rules after having retrieved the list. + const allRules = view._elementStyle.rules; + + for (let i = 1; i < allRules.length; i++) { + info(`Adding font-weight:bold in rule ${i}`); + const rule = allRules[i]; + const ruleEditor = rule.editor; + + const onRuleViewChanged = view.once("ruleview-changed"); + + ruleEditor.addProperty("font-weight", "bold", "", true); + + await onRuleViewChanged; + } +} + +function checkPropertyOnAllRules(view) { + for (const rule of view._elementStyle.rules) { + const lastProperty = rule.textProps[rule.textProps.length - 1]; + + is(lastProperty.name, "font-weight", "Last property name is font-weight"); + is(lastProperty.value, "bold", "Last property value is bold"); + } +} |