Fix declaration-property-value-no-unknown false negatives for neste…

…d declarations (#7079)


Co-authored-by: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>

.changeset/serious-pumas-march.md

@@ -0,0 +1,5 @@
+---
+"stylelint": patch
+---
+
+Fixed: `declaration-property-value-no-unknown` false negatives for nested declarations

lib/reference/__tests__/atKeywords.test.mjs

@@ -0,0 +1,9 @@
+import { atKeywords, nestingSupportedAtKeywords } from '../atKeywords.js';
+
+describe('atKeywords', () => {
+	it('nestingSupportedAtKeywords is a subset of all atKeywords', () => {
+		for (const keyword of nestingSupportedAtKeywords) {
+			expect(atKeywords).toContain(keyword);
+		}
+	});
+});

lib/reference/atKeywords.js

@@ -2,6 +2,9 @@
 
 const uniteSets = require('../utils/uniteSets.js');
 
+// https://www.w3.org/TR/css-nesting-1/#conditionals
+const nestingSupportedAtKeywords = new Set(['container', 'layer', 'media', 'scope', 'supports']);
+
 // https://www.w3.org/TR/css-page-3/#syntax-page-selector
 const pageMarginAtKeywords = new Set([
 	'top-left-corner',
@@ -45,6 +48,7 @@ const atKeywords = uniteSets(pageMarginAtKeywords, [
 	'page',
 	'property',
 	'scroll-timeline',
+	'scope',
 	'styleset',
 	'stylistic',
 	'supports',
@@ -54,4 +58,5 @@ const atKeywords = uniteSets(pageMarginAtKeywords, [
 
 module.exports = {
 	atKeywords,
+	nestingSupportedAtKeywords,
 };

lib/rules/declaration-property-value-no-unknown/__tests__/index.mjs

@@ -9,6 +9,9 @@ testRule({
 		{
 			code: 'a { top: 0; }',
 		},
+		{
+			code: 'a { @media screen { top: 0; } }',
+		},
 		{
 			code: 'a { margin: auto 10em; }',
 		},
@@ -66,6 +69,14 @@ testRule({
 			endLine: 1,
 			endColumn: 17,
 		},
+		{
+			code: 'a { @media screen { top: unknown; } }',
+			message: messages.rejected('top', 'unknown'),
+			line: 1,
+			column: 26,
+			endLine: 1,
+			endColumn: 33,
+		},
 		{
 			code: 'a { top: red; }',
 			message: messages.rejected('top', 'red'),

lib/rules/declaration-property-value-no-unknown/index.js

@@ -15,6 +15,7 @@ const isStandardSyntaxProperty = require('../../utils/isStandardSyntaxProperty')
 const isStandardSyntaxDeclaration = require('../../utils/isStandardSyntaxDeclaration');
 const { isAtRule } = require('../../utils/typeGuards');
 const { isRegExp, isString } = require('../../utils/validateTypes');
+const { nestingSupportedAtKeywords } = require('../../reference/atKeywords');
 
 const ruleName = 'declaration-property-value-no-unknown';
 
@@ -111,7 +112,7 @@ const rule = (primary, secondaryOptions) => {
 			}
 
 			const { error } =
-				parent && isAtRule(parent)
+				parent && isAtRule(parent) && !nestingSupportedAtKeywords.has(parent.name.toLowerCase())
 					? forkedLexer.matchAtruleDescriptor(parent.name, prop, cssTreeValueNode)
 					: forkedLexer.matchProperty(prop, cssTreeValueNode);