diff --git a/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping-expected.txt b/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping-expected.txt
new file mode 100644
index 000000000000..2df786e9f03c
--- /dev/null
+++ b/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping-expected.txt
@@ -0,0 +1,33 @@
+Tests for the CSS.getMatchedStyleForNode command and container rule groups.
+
+
+== Running test suite: CSS.getMatchedStyleForNode.NestingStyleGrouping
+-- Running test case: CSS.getMatchedStyleForNode.NestingStyleGrouping.NormalProperty
+PASS: Should have 1 authored rules.
+- Testing rule #0
+PASS: Selector text should be "#outerA".
+PASS: "color" property value should be "red".
+PASS: Rule should have no groupings.
+
+-- Running test case: CSS.getMatchedStyleForNode.NestingStyleGrouping.NestedRulePropertyWithImplicitAmpersand
+PASS: Should have 2 authored rules.
+- Testing rule #0
+PASS: Selector text should be ".innerA".
+PASS: "color" property value should be "green".
+PASS: Rule should have 1 grouping(s).
+PASS: Grouping 0 should have a type of "style-rule".
+PASS: Grouping 0 should have a text of "#outerA".
+- Testing rule #1
+PASS: Selector text should be "#outerA".
+PASS: "color" property value should be "red".
+PASS: Rule should have no groupings.
+
+-- Running test case: CSS.getMatchedStyleForNode.NestingStyleGrouping.NestedRulePropertyWithImplicitAmpersand
+PASS: Should have 1 authored rules.
+- Testing rule #0
+PASS: Selector text should be ".outer:not(&)".
+PASS: "color" property value should be "blue".
+PASS: Rule should have 1 grouping(s).
+PASS: Grouping 0 should have a type of "style-rule".
+PASS: Grouping 0 should have a text of "#outerA".
+
diff --git a/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping.html b/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping.html
new file mode 100644
index 000000000000..b8659aba45eb
--- /dev/null
+++ b/LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping.html
@@ -0,0 +1,133 @@
+
+
+
+
+
+
+
+
+ Tests for the CSS.getMatchedStyleForNode command and container rule groups.
+
+
+
+
+
diff --git a/LayoutTests/inspector/css/setGroupingHeaderText-expected.txt b/LayoutTests/inspector/css/setGroupingHeaderText-expected.txt
index 4f25da3e2faf..f4d6da286b6b 100644
--- a/LayoutTests/inspector/css/setGroupingHeaderText-expected.txt
+++ b/LayoutTests/inspector/css/setGroupingHeaderText-expected.txt
@@ -186,3 +186,23 @@ PASS: Setting text should succeed.
PASS: Text should change.
PASS: Text should change on the same grouping attached to a different rule.
+-- Running test case: CSS.setGroupingHeaderText.StyleRule
+PASS: Should have 2 authored rule.
+PASS: Should find grouping of type 'style-rule'.
+Setting text to '#test, #test2'.
+PASS: Setting text should succeed.
+PASS: Text should change.
+PASS: Text should change on the same grouping attached to a different rule.
+Setting text to '#test {} #test'.
+PASS: Setting text should fail.
+PASS: Text should not change.
+PASS: Text should not change on the same grouping attached to a different rule.
+Setting text to ''.
+PASS: Setting text should fail.
+PASS: Text should not change.
+PASS: Text should not change on the same grouping attached to a different rule.
+Setting text to '#test'.
+PASS: Setting text should succeed.
+PASS: Text should change.
+PASS: Text should change on the same grouping attached to a different rule.
+
diff --git a/LayoutTests/inspector/css/setGroupingHeaderText.html b/LayoutTests/inspector/css/setGroupingHeaderText.html
index 4e3329cc8a8f..3181f8e45c5b 100644
--- a/LayoutTests/inspector/css/setGroupingHeaderText.html
+++ b/LayoutTests/inspector/css/setGroupingHeaderText.html
@@ -7,14 +7,14 @@
{
let suite = InspectorTest.createAsyncSuite("CSS.setGroupingHeaderText");
- function addTestCase({name, description, groupingType, subtestCases})
+ function addTestCase({name, description, selector, groupingType, subtestCases})
{
suite.addTestCase({
name,
description,
async test() {
let documentNode = await WI.domManager.requestDocument();
- let nodeId = await documentNode.querySelector("#test");
+ let nodeId = await documentNode.querySelector(selector);
let domNode = WI.domManager.nodeForId(nodeId);
InspectorTest.assert(domNode, `Should find DOM Node for selector '#test'.`);
@@ -60,6 +60,7 @@
addTestCase({
name: "CSS.setGroupingHeaderText.MediaRule",
description: "@media rules should be mutable and should only accept syntactically correct text.",
+ selector: "#test",
groupingType: WI.CSSGrouping.Type.MediaRule,
subtestCases: [
{ text: "not print" },
@@ -78,6 +79,7 @@
addTestCase({
name: "CSS.setGroupingHeaderText.SupportsRule",
description: "@supports rules should be mutable and should only accept syntactically correct text.",
+ selector: "#test",
groupingType: WI.CSSGrouping.Type.SupportsRule,
subtestCases: [
{ text: "(color: purple)" },
@@ -98,6 +100,7 @@
addTestCase({
name: "CSS.setGroupingHeaderText.LayerRule",
description: "@layer rules should be mutable and should only accept syntactically correct text.",
+ selector: "#test",
groupingType: WI.CSSGrouping.Type.LayerRule,
subtestCases: [
{ text: "howdy" },
@@ -112,6 +115,7 @@
addTestCase({
name: "CSS.setGroupingHeaderText.ContainerRule",
description: "@container rules should be mutable and should only accept syntactically correct text.",
+ selector: "#test",
groupingType: WI.CSSGrouping.Type.ContainerRule,
subtestCases: [
{ text: "name (min-width: 42px)" },
@@ -127,6 +131,18 @@
],
});
+ addTestCase({
+ name: "CSS.setGroupingHeaderText.StyleRule",
+ description: "Parent style rules for a nested style rule should be mutable and should only accept syntactically correct text.",
+ selector: "#nested",
+ groupingType: WI.CSSGrouping.Type.StyleRule,
+ subtestCases: [
+ { text: "#test, #test2" },
+ { text: "#test {} #test", expectsFailure: true },
+ { text: "", expectsFailure: true },
+ ],
+ });
+
suite.runTestCasesAndFinish();
}
@@ -141,6 +157,14 @@
@container (min-width: 1px) {
#test {
color: lawngreen;
+
+ #nested {
+ color: rebeccapurple;
+ }
+
+ .nested {
+ color: seagreen;
+ }
}
.test {
@@ -154,6 +178,8 @@
Tests for the CSS.setGroupingHeaderText command.
-
+