Fix false negatives for dollar variables in *-notation (#5031)

stylelint · Nov 17, 2020 · 1e6f944 · 1e6f944
1 parent d347a29
commit 1e6f944
Show file tree

Hide file tree

Showing 6 changed files with 188 additions and 9 deletions.
diff --git a/lib/rules/alpha-value-notation/__tests__/index.js b/lib/rules/alpha-value-notation/__tests__/index.js
@@ -303,3 +303,70 @@ testRule({
 		},
 	],
 });
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['number'],
+	fix: true,
+
+	accept: [
+		{
+			code: '$a: rgb(0, 0, 0);',
+		},
+		{
+			code: '$a: rgb(0 0 0);',
+		},
+		{
+			code: '$a: rgba(0, 0, 0, 0.5);',
+		},
+		{
+			code: '$a: rgb(0 0 0 / 0.5);',
+		},
+		{
+			code: 'a { color: rgb(0 0 0 / $a) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: rgb(0 0 0 / 50%);',
+			fixed: '$a: rgb(0 0 0 / 0.5);',
+			message: messages.expected('50%', '0.5'),
+			line: 1,
+			column: 17,
+		},
+	],
+});
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['percentage'],
+	fix: true,
+
+	accept: [
+		{
+			code: '$a: rgba(0, 0, 0, 50%);',
+		},
+		{
+			code: '$a: rgb(0 0 0 / 50%);',
+		},
+		{
+			code: '$a: 50%; a { color: rgb(0 0 0 / $a) }',
+		},
+		{
+			code: '$a: 0.5; a { color: rgb(0 0 0 / $a) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: rgb(0 0 0 / 0.5);',
+			fixed: '$a: rgb(0 0 0 / 50%);',
+			message: messages.expected('0.5', '50%'),
+			line: 1,
+			column: 17,
+		},
+	],
+});
diff --git a/lib/rules/alpha-value-notation/index.js b/lib/rules/alpha-value-notation/index.js
@@ -6,7 +6,6 @@ const _ = require('lodash');
 const valueParser = require('postcss-value-parser');
 
 const declarationValueIndex = require('../../utils/declarationValueIndex');
-const isStandardSyntaxDeclaration = require('../../utils/isStandardSyntaxDeclaration');
 const isStandardSyntaxValue = require('../../utils/isStandardSyntaxValue');
 const optionsMatches = require('../../utils/optionsMatches');
 const report = require('../../utils/report');
@@ -43,8 +42,6 @@ function rule(primary, options, context) {
 		if (!validOptions) return;
 
 		root.walkDecls((decl) => {
-			if (!isStandardSyntaxDeclaration(decl)) return;
-
 			let needsFix = false;
 			const parsedValue = valueParser(getValue(decl));
 

diff --git a/lib/rules/color-function-notation/__tests__/index.js b/lib/rules/color-function-notation/__tests__/index.js
@@ -360,3 +360,72 @@ testRule({
 		},
 	],
 });
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['modern'],
+	fix: true,
+
+	accept: [
+		{
+			code: '$a: rgb(0 0 0);',
+		},
+		{
+			code: '$a: rgb(0 0 0 / 0);',
+		},
+		{
+			code: 'a { color: rgb($a $b $c / $d) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: rgb(0, 0, 0);',
+			fixed: '$a: rgb(0 0 0);',
+			message: messages.expected('modern'),
+			line: 1,
+			column: 5,
+		},
+		{
+			code: 'a { color: rgba($a, $b, $c, $d) }',
+			fixed: 'a { color: rgb($a $b $c / $d) }',
+			message: messages.expected('modern'),
+			line: 1,
+			column: 12,
+		},
+	],
+});
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['legacy'],
+
+	accept: [
+		{
+			code: '$a: rgb(0, 0, 0);',
+		},
+		{
+			code: '$a: rgba(0, 0, 0, 0);',
+		},
+		{
+			code: 'a { color: rgba($a, $b, $c, $d) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: rgb(0 0 0 / 0);',
+			message: messages.expected('legacy'),
+			line: 1,
+			column: 5,
+		},
+		{
+			code: 'a { color: rgb($a $b $c / $d) }',
+			message: messages.expected('legacy'),
+			line: 1,
+			column: 12,
+		},
+	],
+});
diff --git a/lib/rules/color-function-notation/index.js b/lib/rules/color-function-notation/index.js
@@ -5,7 +5,6 @@
 const valueParser = require('postcss-value-parser');
 
 const declarationValueIndex = require('../../utils/declarationValueIndex');
-const isStandardSyntaxDeclaration = require('../../utils/isStandardSyntaxDeclaration');
 const report = require('../../utils/report');
 const ruleMessages = require('../../utils/ruleMessages');
 const validateOptions = require('../../utils/validateOptions');
@@ -29,8 +28,6 @@ function rule(primary, secondary, context) {
 		if (!validOptions) return;
 
 		root.walkDecls((decl) => {
-			if (!isStandardSyntaxDeclaration(decl)) return;
-
 			let needsFix = false;
 			const parsedValue = valueParser(getValue(decl));
 

diff --git a/lib/rules/hue-degree-notation/__tests__/index.js b/lib/rules/hue-degree-notation/__tests__/index.js
@@ -196,3 +196,55 @@ testRule({
 		},
 	],
 });
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['angle'],
+	fix: true,
+
+	accept: [
+		{
+			code: '$a: hsl(0deg 0 0);',
+		},
+		{
+			code: 'a { color: hsl($a 0 0) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: hsl(0 0 0);',
+			fixed: '$a: hsl(0deg 0 0);',
+			message: messages.expected('0', '0deg'),
+			line: 1,
+			column: 9,
+		},
+	],
+});
+
+testRule({
+	ruleName,
+	syntax: 'scss',
+	config: ['number'],
+	fix: true,
+
+	accept: [
+		{
+			code: '$a: hsl(0 0 0);',
+		},
+		{
+			code: 'a { color: hsl($a 0 0) }',
+		},
+	],
+
+	reject: [
+		{
+			code: '$a: hsl(0deg 0 0);',
+			fixed: '$a: hsl(0 0 0);',
+			message: messages.expected('0deg', '0'),
+			line: 1,
+			column: 9,
+		},
+	],
+});
diff --git a/lib/rules/hue-degree-notation/index.js b/lib/rules/hue-degree-notation/index.js
@@ -5,7 +5,6 @@
 const valueParser = require('postcss-value-parser');
 
 const declarationValueIndex = require('../../utils/declarationValueIndex');
-const isStandardSyntaxDeclaration = require('../../utils/isStandardSyntaxDeclaration');
 const isStandardSyntaxValue = require('../../utils/isStandardSyntaxValue');
 const report = require('../../utils/report');
 const ruleMessages = require('../../utils/ruleMessages');
@@ -31,8 +30,6 @@ function rule(primary, secondary, context) {
 		if (!validOptions) return;
 
 		root.walkDecls((decl) => {
-			if (!isStandardSyntaxDeclaration(decl)) return;
-
 			let needsFix = false;
 			const parsedValue = valueParser(getValue(decl));