Refactor *-specificity tests and documentation to align with standa…

…rd CSS (#7688)

* Refactor `selector-max-specificity` tests so that we match standard CSS

* also update no-descending-specificity and update docs

* undo

* update example in docs

* update end positions

lib/rules/no-descending-specificity/__tests__/index.mjs

@@ -81,7 +81,7 @@ testRule({
 			code: ':root { foo: {}; }',
 		},
 		{
-			code: ':global(.buildResultsSummaryTable) span {} :global(.buildResultsSummaryTable) span:nth-child(2) {}',
+			code: ':is(.buildResultsSummaryTable) span {} :is(.buildResultsSummaryTable) span:nth-child(2) {}',
 		},
 		{
 			code: 'a:hover {} a::before {}',
@@ -99,10 +99,10 @@ testRule({
 			code: 'a :where(a, b) {} :where(c, d) {}',
 		},
 		{
-			code: 'a b :global(.foo) {} a :global(.bar) {}',
+			code: 'a b :is(.foo) {} a :is(.bar) {}',
 		},
 		{
-			code: ':global(.foo) {} :global { .bar {} }',
+			code: ':is(.foo) {} :host { .bar {} }',
 		},
 	],
 

lib/rules/selector-max-specificity/README.md

@@ -100,7 +100,7 @@ Given:
 [
   "0,2,0",
   {
-    "ignoreSelectors": [":global", ":local", "/^my-/"]
+    "ignoreSelectors": [":host", ":host-context", "/^my-/"]
   }
 ]
 ```
@@ -109,17 +109,17 @@ The following patterns are _not_ considered problems:
 
 <!-- prettier-ignore -->
 ```css
-:global(.foo) .bar {}
+:host(.foo) .bar {}
 ```
 
 <!-- prettier-ignore -->
 ```css
-:local(.foo.bar) {}
+:host-context(.foo.bar) {}
 ```
 
 <!-- prettier-ignore -->
 ```css
-:local(.foo, :global(.bar).baz) {}
+:host-context(.foo, :host(.bar).baz) {}
 ```
 
 <!-- prettier-ignore -->
@@ -131,17 +131,17 @@ The following patterns are considered problems:
 
 <!-- prettier-ignore -->
 ```css
-:global(.foo) .bar.baz {}
+:host(.foo) .bar.baz {}
 ```
 
 <!-- prettier-ignore -->
 ```css
-:local(.foo.bar.baz) {}
+:host-context(.foo.bar.baz) {}
 ```
 
 <!-- prettier-ignore -->
 ```css
-:local(.foo, :global(.bar), .foo.bar.baz) {}
+:host-context(.foo, :host(.bar), .foo.bar.baz) {}
 ```
 
 <!-- prettier-ignore -->

lib/rules/selector-max-specificity/__tests__/index.mjs

@@ -491,79 +491,91 @@ testRule({
 	config: [
 		'0,1,0',
 		{
-			ignoreSelectors: [':global', ':local', '/my-/'],
+			ignoreSelectors: [':is', ':has', ':host', '/my-/'],
 		},
 	],
 
 	accept: [
 		{
-			code: ':global(.b) {}',
+			code: ':is(.b) {}',
 		},
 		{
-			code: ':global(.b, :local(.c)) {}',
+			code: ':is(.b, :has(.c)) {}',
 		},
 		{
-			code: ':local(.b) {}',
+			code: ':has(.b) {}',
 		},
 		{
-			code: ':local(.b, :global(.c)) {}',
+			code: ':has(.b, :is(.c)) {}',
+		},
+		{
+			code: ':has(.b, :is(a a)) {}',
 		},
 		{
 			code: 'my-tag.a {}',
 		},
 		{
 			code: ':nth-child(even of my-tag) {}',
 		},
+		{
+			code: '.a:host {}',
+		},
+		{
+			code: '.a:host(:where(.b)) {}',
+		},
+		{
+			code: ':host(.a) {}',
+		},
 	],
 
 	reject: [
 		{
-			code: '.a:global(.b) {}',
-			message: messages.expected('.a:global(.b)', '0,1,0'),
+			code: '.a:is(.b) {}',
+			message: messages.expected('.a:is(.b)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 14,
+			endColumn: 10,
 		},
 		{
-			code: '.a:global(.b, .c) {}',
-			message: messages.expected('.a:global(.b, .c)', '0,1,0'),
+			code: '.a:is(.b, .c) {}',
+			message: messages.expected('.a:is(.b, .c)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 18,
+			endColumn: 14,
 		},
 		{
-			code: ':global(.b, .c.d) {}',
-			message: messages.expected(':global(.b, .c.d)', '0,1,0'),
+			code: ':is(.b, .c.d) {}',
+			message: messages.expected(':is(.b, .c.d)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 18,
+			endColumn: 14,
 		},
 		{
-			code: '.a:local(.b) {}',
-			message: messages.expected('.a:local(.b)', '0,1,0'),
+			code: '.a:has(.b) {}',
+			message: messages.expected('.a:has(.b)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 13,
+			endColumn: 11,
 		},
 		{
-			code: '.a:local(.b, .c) {}',
-			message: messages.expected('.a:local(.b, .c)', '0,1,0'),
+			code: '.a:has(.b, .c) {}',
+			message: messages.expected('.a:has(.b, .c)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 17,
+			endColumn: 15,
 		},
 		{
-			code: ':local(.b, .c.d) {}',
-			message: messages.expected(':local(.b, .c.d)', '0,1,0'),
+			code: ':has(.b, .c.d) {}',
+			message: messages.expected(':has(.b, .c.d)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 17,
+			endColumn: 15,
 		},
 		{
 			code: 'my-tag.a.b {}',
@@ -573,6 +585,30 @@ testRule({
 			endLine: 1,
 			endColumn: 11,
 		},
+		{
+			code: 'a.b:host {}',
+			message: messages.expected('a.b:host', '0,1,0'),
+			line: 1,
+			column: 1,
+			endLine: 1,
+			endColumn: 9,
+		},
+		{
+			code: 'a:host(.b) {}',
+			message: messages.expected('a:host(.b)', '0,1,0'),
+			line: 1,
+			column: 1,
+			endLine: 1,
+			endColumn: 11,
+		},
+		{
+			code: ':host(a.b) {}',
+			message: messages.expected(':host(a.b)', '0,1,0'),
+			line: 1,
+			column: 1,
+			endLine: 1,
+			endColumn: 11,
+		},
 	],
 });
 
@@ -593,12 +629,12 @@ testRule({
 
 	reject: [
 		{
-			code: '.a:global(.b) {}',
-			message: messages.expected('.a:global(.b)', '0,1,0'),
+			code: '.a:is(.b) {}',
+			message: messages.expected('.a:is(.b)', '0,1,0'),
 			line: 1,
 			column: 1,
 			endLine: 1,
-			endColumn: 14,
+			endColumn: 10,
 		},
 	],
 });