1 files changed, 32 insertions, 13 deletions
diff --git a/tests/wpt/tests/css/css-nesting/parsing.html b/tests/wpt/tests/css/css-nesting/parsing.html
index b189190f412..ee9f3548446 100644
--- a/tests/wpt/tests/css/css-nesting/parsing.html
+++ b/tests/wpt/tests/css/css-nesting/parsing.html
@@ -23,11 +23,12 @@
       assert_equals(ss.rules.length, 1, "Outer rule should exist.");
       const rule = ss.rules[0];
       assert_equals(rule.cssRules.length, 1, "Inner rule should exist.");
-      assert_equals(rule.selectorText, expected, `Inner rule's selector should be "${expected}".`);
+      const innerRule = rule.cssRules[0];
+      assert_equals(innerRule.selectorText, expected, `Inner rule's selector should be "${expected}".`);
     }, ruleText);
   }
 
-  function testInvalidSelector(sel, {parent=".foo"}={}) {
+  function testInvalidNestingSelector(sel, {parent=".foo"}={}) {
     resetStylesheet();
     const ruleText = `${parent} { ${sel} { color: green; }}`
     test(()=>{
@@ -38,30 +39,48 @@
     }, "INVALID: " + ruleText);
   }
 
+  // basic usage
   testNestedSelector("&");
   testNestedSelector("&.bar");
   testNestedSelector("& .bar");
   testNestedSelector("& > .bar");
-  testNestedSelector("> & .bar");
+
+  // relative selector
   testNestedSelector("> .bar", {expected:"& > .bar"});
+  testNestedSelector("> & .bar", {expected: "& > & .bar"});
   testNestedSelector("+ .bar &", {expected:"& + .bar &"});
+  testNestedSelector("+ .bar, .foo, > .baz", {expected:"& + .bar, .foo, & > .baz"});
+
+  // implicit relative (and not)
+  testNestedSelector(".foo");
   testNestedSelector(".test > & .bar");
-  testNestedSelector("+ .bar, .foo, > .baz", {expected:"& + .bar, & .foo, & > .baz"});
-  testNestedSelector(".foo, .foo &", {expected:"& .foo, .foo &"});
+  testNestedSelector(".foo, .foo &");
+  testNestedSelector(":is(.bar, .baz)");
   testNestedSelector("&:is(.bar, .baz)");
-  testNestedSelector(":is(.bar, .baz)", {expected:"&:is(.bar, .baz)"});
-  testNestedSelector("&:is(.bar, &.baz)");
   testNestedSelector(":is(.bar, &.baz)");
+  testNestedSelector("&:is(.bar, &.baz)");
+
+  // Mixing nesting selector with other simple selectors
   testNestedSelector("div&");
-  testNestedSelector(".bar&");
-  testNestedSelector("[bar]&");
-  testNestedSelector("#bar&");
+  testInvalidNestingSelector("&div"); // type selector must be first
+  testNestedSelector(".class&");
+  testNestedSelector("&.class");
+  testNestedSelector("[attr]&");
+  testNestedSelector("&[attr]");
+  testNestedSelector("#id&");
+  testNestedSelector("&#id");
   testNestedSelector(":hover&");
+  testNestedSelector("&:hover");
   testNestedSelector(":is(div)&");
-  testNestedSelector(".bar > &");
+  testNestedSelector("&:is(div)");
+
+  // Multiple nesting selectors
   testNestedSelector("& .bar & .baz & .qux");
+  testNestedSelector("&&");
+
+  // Selector list in inner rule
   testNestedSelector("& > section, & > article");
-  testNestedSelector("& + .baz, &.qux", {parent:".foo, .bar"});
 
-  testInvalidSelector("&div");
+  // Selector list in both inner and outer rule.
+  testNestedSelector("& + .baz, &.qux", {parent:".foo, .bar"});
 </script>