commit 6bbcf4b20183dfdabced33bd00d2a01bd3da796a
parent 5b9cbf23a9cf2499f900ffab67b19a0ad2628f7b
Author: Nicolas Chevobbe <nchevobbe@mozilla.com>
Date: Fri, 31 Oct 2025 05:58:41 +0000
Bug 1997145 - Refactor test_selectormatcheselement.html. r=firefox-style-system-reviewers,layout-reviewers,dshin
Depends on D270626
Differential Revision: https://phabricator.services.mozilla.com/D270549
Diffstat:
1 file changed, 51 insertions(+), 39 deletions(-)
diff --git a/layout/inspector/tests/test_selectormatcheselement.html b/layout/inspector/tests/test_selectormatcheselement.html
@@ -42,60 +42,72 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=1037519
</head>
<body>
<div id="foo">foo content</div>
-<pre id="test">
-<script type="application/javascript">
-const InspectorUtils = SpecialPowers.InspectorUtils;
+<script>
-function do_test() {
- var element = document.querySelector("#foo");
+const InspectorUtils = SpecialPowers.InspectorUtils;
- var elementRules = InspectorUtils.getMatchingCSSRules(element);
+add_task(async () => {
+ const element = document.querySelector("#foo");
+ const elementRules = InspectorUtils.getMatchingCSSRules(element);
- var multiSelectorRule = elementRules[2];
- is(multiSelectorRule.selectorText, `#foo, #bar, #foo::before`, "Got expected multi-selector rule");
- is (multiSelectorRule.selectorMatchesElement(0, element), true,
- "Matches #foo");
- is (multiSelectorRule.selectorMatchesElement(1, element), false,
- "Doesn't match #bar");
- is (multiSelectorRule.selectorMatchesElement(0, element, ":bogus"), false,
- "Doesn't match #foo with a bogus pseudo");
- is (multiSelectorRule.selectorMatchesElement(2, element, ":bogus"), false,
- "Doesn't match #foo::before with bogus pseudo");
- is (multiSelectorRule.selectorMatchesElement(0, element, ":after"), false,
- "Does match #foo::before with the :after pseudo");
+ const multiSelectorRule = elementRules[2];
+ is(
+ multiSelectorRule.selectorText,
+ `#foo, #bar, #foo::before`,
+ "Got expected multi-selector rule"
+ );
+ ok(
+ multiSelectorRule.selectorMatchesElement(0, element),
+ "Matches #foo"
+ );
+ ok(
+ !multiSelectorRule.selectorMatchesElement(1, element),
+ "Doesn't match #bar"
+ );
+ ok(
+ !multiSelectorRule.selectorMatchesElement(0, element, ":bogus"),
+ "Doesn't match #foo with a bogus pseudo"
+ );
+ ok(
+ !multiSelectorRule.selectorMatchesElement(2, element, ":bogus"),
+ "Doesn't match #foo::before with bogus pseudo"
+ );
+ ok(
+ !multiSelectorRule.selectorMatchesElement(0, element, ":after"),
+ "Does match #foo::before with the :after pseudo"
+ );
- var nestedRule = elementRules[4];
+ const nestedRule = elementRules[4];
is(nestedRule.selectorText, `div&`, "Got expected nested rule");
- is (nestedRule.selectorMatchesElement(0, element), true, "Matches div&");
+ ok(nestedRule.selectorMatchesElement(0, element), "Matches div&");
checkPseudo(":before");
checkPseudo(":after");
checkPseudo(":first-letter");
checkPseudo(":first-line");
- SimpleTest.finish();
-
function checkPseudo(pseudo) {
- var rules = InspectorUtils.getMatchingCSSRules(element, pseudo);
- var rule = rules[rules.length - 1];
-
- is (rule.selectorMatchesElement(0, element), false,
- "Doesn't match without " + pseudo);
- is (rule.selectorMatchesElement(1, element), false,
- "Doesn't match without " + pseudo);
-
- is (rule.selectorMatchesElement(0, element, pseudo), true,
- "Matches on #foo" + pseudo);
- is (rule.selectorMatchesElement(1, element, pseudo), false,
- "Doesn't match on #bar" + pseudo);
+ const rule = InspectorUtils.getMatchingCSSRules(element, pseudo).at(-1);
+ ok(
+ !rule.selectorMatchesElement(0, element),
+ "Doesn't match without " + pseudo
+ );
+ ok(
+ !rule.selectorMatchesElement(1, element),
+ "Doesn't match without " + pseudo
+ );
+ ok(
+ rule.selectorMatchesElement(0, element, pseudo),
+ "Matches on #foo" + pseudo
+ );
+ ok(
+ !rule.selectorMatchesElement(1, element, pseudo),
+ "Doesn't match on #bar" + pseudo
+ );
}
-}
-
-SimpleTest.waitForExplicitFinish();
-addLoadEvent(do_test);
+});
</script>
-</pre>
</body>
</html>
