diff options
Diffstat (limited to '')
-rw-r--r-- | devtools/client/inspector/rules/test/browser_rules_mark_overridden_07.js | 93 |
1 files changed, 93 insertions, 0 deletions
diff --git a/devtools/client/inspector/rules/test/browser_rules_mark_overridden_07.js b/devtools/client/inspector/rules/test/browser_rules_mark_overridden_07.js new file mode 100644 index 0000000000..bdfe34a307 --- /dev/null +++ b/devtools/client/inspector/rules/test/browser_rules_mark_overridden_07.js @@ -0,0 +1,93 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Tests that the rule view marks overridden rules correctly based on the +// specificity of the rule. + +const TEST_URI = ` + <style type='text/css'> + #testid { + margin-left: 23px; + } + + div { + margin-right: 23px; + margin-left: 1px !important; + } + + body { + color: blue; + } + + body { + margin-right: 1px !important; + font-size: 79px; + line-height: 100px !important; + color: green !important; + } + + body { + color: red; + } + + span { + font-size: 12px; + line-height: 10px; + } + </style> + <body> + <span> + <div id='testid' class='testclass'>Styled Node</div> + </span> + </body> +`; + +add_task(async function () { + await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); + const { inspector, view } = await openRuleView(); + await selectNode("#testid", inspector); + testMarkOverridden(inspector, view); +}); + +function testMarkOverridden(inspector, view) { + const elementStyle = view._elementStyle; + + const RESULTS = [ + // We skip the first element + [], + [{ name: "margin-left", value: "23px", overridden: true }], + [ + { name: "margin-right", value: "23px", overridden: false }, + { name: "margin-left", value: "1px", overridden: false }, + ], + [ + { name: "font-size", value: "12px", overridden: false }, + { name: "line-height", value: "10px", overridden: false }, + ], + [{ name: "color", value: "red", overridden: true }], + [ + { name: "margin-right", value: "1px", overridden: true }, + { name: "font-size", value: "79px", overridden: true }, + { name: "line-height", value: "100px", overridden: true }, + { name: "color", value: "green", overridden: false }, + ], + [{ name: "color", value: "blue", overridden: true }], + ]; + + for (let i = 1; i < RESULTS.length; ++i) { + const idRule = elementStyle.rules[i]; + + for (const propIndex in RESULTS[i]) { + const expected = RESULTS[i][propIndex]; + const prop = idRule.textProps[propIndex]; + + info("Checking rule " + i + ", property " + propIndex); + + is(prop.name, expected.name, "check property name"); + is(prop.value, expected.value, "check property value"); + is(prop.overridden, expected.overridden, "check property overridden"); + } + } +} |