From 0efc927e7b29f799f00471150bed120f013dd218 Mon Sep 17 00:00:00 2001
From: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>
Date: Tue, 4 Oct 2022 01:34:15 +0900
Subject: [PATCH 1/5] Add custom message formatting to some standard config
 rules

- `custom-media-pattern`
- `custom-property-pattern`
- `keyframes-name-pattern`
- `selector-class-pattern`
- `selector-id-pattern`
---
 .../custom-media-pattern/__tests__/index.js   | 16 ++++-----
 lib/rules/custom-media-pattern/index.js       | 14 ++++----
 .../__tests__/index.js                        | 36 ++++++++++++-------
 lib/rules/custom-property-pattern/index.js    | 16 +++++----
 lib/rules/keyframes-name-pattern/index.js     |  3 +-
 lib/rules/selector-class-pattern/index.js     |  3 +-
 lib/rules/selector-id-pattern/index.js        |  3 +-
 7 files changed, 54 insertions(+), 37 deletions(-)

diff --git a/lib/rules/custom-media-pattern/__tests__/index.js b/lib/rules/custom-media-pattern/__tests__/index.js
index e9c771000a..ce36db7bf0 100644
--- a/lib/rules/custom-media-pattern/__tests__/index.js
+++ b/lib/rules/custom-media-pattern/__tests__/index.js
@@ -27,7 +27,7 @@ testRule({
 	reject: [
 		{
 			code: '@custom-media --foa-bar (min-width: 0);',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--foa-bar', /foo-.+/),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -35,7 +35,7 @@ testRule({
 		},
 		{
 			code: '@cUsToM-mEdIa --foa-bar (min-width: 0);',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--foa-bar', /foo-.+/),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -43,7 +43,7 @@ testRule({
 		},
 		{
 			code: '@CUSTOM-MEDIA --foa-bar (min-width: 0);',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--foa-bar', /foo-.+/),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -51,7 +51,7 @@ testRule({
 		},
 		{
 			code: '@custom-media --foa (min-width: 0);',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--foa', /foo-.+/),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -79,7 +79,7 @@ testRule({
 	reject: [
 		{
 			code: '@custom-media --foa-bar (min-width: 0);',
-			message: messages.expected('foo-.+'),
+			message: messages.expected('--foa-bar', 'foo-.+'),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -87,7 +87,7 @@ testRule({
 		},
 		{
 			code: '@custom-media --foa (min-width: 0);',
-			message: messages.expected('foo-.+'),
+			message: messages.expected('--foa', 'foo-.+'),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -112,7 +112,7 @@ testRule({
 	reject: [
 		{
 			code: '@custom-media --ape-ageLess',
-			message: messages.expected(/^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
+			message: messages.expected('--ape-ageLess', /^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
 			line: 1,
 			column: 15,
 			endLine: 1,
@@ -120,7 +120,7 @@ testRule({
 		},
 		{
 			code: '@custom-media --Ape-AgeLess',
-			message: messages.expected(/^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
+			message: messages.expected('--Ape-AgeLess', /^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
 			line: 1,
 			column: 15,
 			endLine: 1,
diff --git a/lib/rules/custom-media-pattern/index.js b/lib/rules/custom-media-pattern/index.js
index 209255cdeb..8eb47c0913 100644
--- a/lib/rules/custom-media-pattern/index.js
+++ b/lib/rules/custom-media-pattern/index.js
@@ -9,7 +9,8 @@ const { isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'custom-media-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (pattern) => `Expected custom media query name to match pattern "${pattern}"`,
+	expected: (name, pattern) =>
+		`Expected custom media query name "${name}" to match pattern "${pattern}"`,
 });
 
 const meta = {
@@ -35,14 +36,12 @@ const rule = (primary) => {
 				return;
 			}
 
-			const match = atRule.params.match(/^--(\S+)\b/);
+			const [fullName, customMediaName] = atRule.params.match(/^--(\S+)\b/) || [];
 
-			if (match == null || match[0] == null) {
+			if (fullName === undefined || customMediaName === undefined) {
 				throw new Error(`Unexpected at-rule params: "${atRule.params}"`);
 			}
 
-			const customMediaName = match[1];
-
 			if (regexpPattern.test(customMediaName)) {
 				return;
 			}
@@ -50,10 +49,11 @@ const rule = (primary) => {
 			const index = atRuleParamIndex(atRule);
 
 			report({
-				message: messages.expected(primary),
+				message: messages.expected,
+				messageArgs: [fullName, primary],
 				node: atRule,
 				index,
-				endIndex: index + match[0].length,
+				endIndex: index + fullName.length,
 				result,
 				ruleName,
 			});
diff --git a/lib/rules/custom-property-pattern/__tests__/index.js b/lib/rules/custom-property-pattern/__tests__/index.js
index e5cd60cfe3..02073b10cd 100644
--- a/lib/rules/custom-property-pattern/__tests__/index.js
+++ b/lib/rules/custom-property-pattern/__tests__/index.js
@@ -28,7 +28,7 @@ testRule({
 	reject: [
 		{
 			code: ':root { --boo-bar: 0; }',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--boo-bar', /foo-.+/),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -36,7 +36,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-: 0; }',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--foo-', /foo-.+/),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -44,7 +44,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-color: #f00; } a { color: var(--boo-color); }',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--boo-color', /foo-.+/),
 			line: 1,
 			column: 45,
 			endLine: 1,
@@ -52,7 +52,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-sub-color: #f00; } a { color: var(--foo-color, var(--boo-sub-color)); }',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--boo-sub-color', /foo-.+/),
 			line: 1,
 			column: 66,
 			endLine: 1,
@@ -60,7 +60,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-color: #f00; } a { color: VAR(--boo-color)); }',
-			message: messages.expected(/foo-.+/),
+			message: messages.expected('--boo-color', /foo-.+/),
 			line: 1,
 			column: 45,
 			endLine: 1,
@@ -69,8 +69,20 @@ testRule({
 		{
 			code: ':root { --foo-color: #f00; } a { color: var(--boo-color), var(--boo-sub-color)); }',
 			warnings: [
-				{ message: messages.expected(/foo-.+/), line: 1, column: 45, endLine: 1, endColumn: 56 },
-				{ message: messages.expected(/foo-.+/), line: 1, column: 63, endLine: 1, endColumn: 78 },
+				{
+					message: messages.expected('--boo-color', /foo-.+/),
+					line: 1,
+					column: 45,
+					endLine: 1,
+					endColumn: 56,
+				},
+				{
+					message: messages.expected('--boo-sub-color', /foo-.+/),
+					line: 1,
+					column: 63,
+					endLine: 1,
+					endColumn: 78,
+				},
 			],
 		},
 	],
@@ -92,7 +104,7 @@ testRule({
 	reject: [
 		{
 			code: ':root { --boo-bar: 0; }',
-			message: messages.expected('foo-.+'),
+			message: messages.expected('--boo-bar', 'foo-.+'),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -100,7 +112,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-: 0; }',
-			message: messages.expected('foo-.+'),
+			message: messages.expected('--foo-', 'foo-.+'),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -125,7 +137,7 @@ testRule({
 	reject: [
 		{
 			code: ':root { --boo-Foo-bar: 0; }',
-			message: messages.expected(/^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
+			message: messages.expected('--boo-Foo-bar', /^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -133,7 +145,7 @@ testRule({
 		},
 		{
 			code: ':root { --foo-bar: 0; }',
-			message: messages.expected(/^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
+			message: messages.expected('--foo-bar', /^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
 			line: 1,
 			column: 9,
 			endLine: 1,
@@ -141,7 +153,7 @@ testRule({
 		},
 		{
 			code: ':root { --Foo-Bar: 0; }',
-			message: messages.expected(/^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
+			message: messages.expected('--Foo-Bar', /^[A-Z][a-z]+-[a-z][a-zA-Z]+$/),
 			line: 1,
 			column: 9,
 			endLine: 1,
diff --git a/lib/rules/custom-property-pattern/index.js b/lib/rules/custom-property-pattern/index.js
index b7dc96ed53..525854381d 100644
--- a/lib/rules/custom-property-pattern/index.js
+++ b/lib/rules/custom-property-pattern/index.js
@@ -13,7 +13,8 @@ const isStandardSyntaxProperty = require('../../utils/isStandardSyntaxProperty')
 const ruleName = 'custom-property-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (pattern) => `Expected custom property name to match pattern "${pattern}"`,
+	expected: (name, pattern) =>
+		`Expected custom property name "${name}" to match pattern "${pattern}"`,
 });
 
 const meta = {
@@ -62,27 +63,28 @@ const rule = (primary) => {
 
 				if (!firstNode || check(firstNode.value)) return;
 
-				complain(declarationValueIndex(decl) + firstNode.sourceIndex, firstNode.value.length, decl);
+				complain(declarationValueIndex(decl) + firstNode.sourceIndex, firstNode.value, decl);
 			});
 
 			if (check(prop)) return;
 
-			complain(0, prop.length, decl);
+			complain(0, prop, decl);
 		});
 
 		/**
 		 * @param {number} index
-		 * @param {number} length
+		 * @param {string} propName
 		 * @param {import('postcss').Declaration} decl
 		 */
-		function complain(index, length, decl) {
+		function complain(index, propName, decl) {
 			report({
 				result,
 				ruleName,
-				message: messages.expected(primary),
+				message: messages.expected,
+				messageArgs: [propName, primary],
 				node: decl,
 				index,
-				endIndex: index + length,
+				endIndex: index + propName.length,
 			});
 		}
 	};
diff --git a/lib/rules/keyframes-name-pattern/index.js b/lib/rules/keyframes-name-pattern/index.js
index 75f87afa3d..e8ca378c4c 100644
--- a/lib/rules/keyframes-name-pattern/index.js
+++ b/lib/rules/keyframes-name-pattern/index.js
@@ -49,7 +49,8 @@ const rule = (primary) => {
 			report({
 				index,
 				endIndex,
-				message: messages.expected(value, primary),
+				message: messages.expected,
+				messageArgs: [value, primary],
 				node: keyframesNode,
 				ruleName,
 				result,
diff --git a/lib/rules/selector-class-pattern/index.js b/lib/rules/selector-class-pattern/index.js
index f5abe688da..2023dde3d7 100644
--- a/lib/rules/selector-class-pattern/index.js
+++ b/lib/rules/selector-class-pattern/index.js
@@ -100,7 +100,8 @@ const rule = (primary, secondaryOptions) => {
 				report({
 					result,
 					ruleName,
-					message: messages.expected(selector, primary),
+					message: messages.expected,
+					messageArgs: [selector, primary],
 					node: ruleNode,
 					index,
 					endIndex,
diff --git a/lib/rules/selector-id-pattern/index.js b/lib/rules/selector-id-pattern/index.js
index fa6ba5f463..64abc184fe 100644
--- a/lib/rules/selector-id-pattern/index.js
+++ b/lib/rules/selector-id-pattern/index.js
@@ -48,7 +48,8 @@ const rule = (primary) => {
 					report({
 						result,
 						ruleName,
-						message: messages.expected(selector, primary),
+						message: messages.expected,
+						messageArgs: [selector, primary],
 						node: ruleNode,
 						word: selector,
 					});

From 0d6a9ab09d8aed32e006fd995d2d81ecb5c12505 Mon Sep 17 00:00:00 2001
From: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>
Date: Tue, 4 Oct 2022 02:06:15 +0900
Subject: [PATCH 2/5] Add changelog entry

---
 .changeset/many-tools-build.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/many-tools-build.md

diff --git a/.changeset/many-tools-build.md b/.changeset/many-tools-build.md
new file mode 100644
index 0000000000..1d217de1dd
--- /dev/null
+++ b/.changeset/many-tools-build.md
@@ -0,0 +1,5 @@
+---
+"stylelint": minor
+---
+
+Added: custom message formatting to `custom-media-pattern`, `custom-property-pattern`, `keyframes-name-pattern`, `selector-class-pattern`, and `selector-id-pattern`

From 328e4363b565a5688abd047e72befc8272739436 Mon Sep 17 00:00:00 2001
From: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>
Date: Tue, 4 Oct 2022 07:52:07 +0900
Subject: [PATCH 3/5] Update .changeset/many-tools-build.md

Co-authored-by: Richard Hallows <jeddy3@users.noreply.github.com>
---
 .changeset/many-tools-build.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/many-tools-build.md b/.changeset/many-tools-build.md
index 1d217de1dd..4e41b0e7fe 100644
--- a/.changeset/many-tools-build.md
+++ b/.changeset/many-tools-build.md
@@ -2,4 +2,4 @@
 "stylelint": minor
 ---
 
-Added: custom message formatting to `custom-media-pattern`, `custom-property-pattern`, `keyframes-name-pattern`, `selector-class-pattern`, and `selector-id-pattern`
+Added: `*-pattern` custom message formatting

From 19f313e3fc652b036db4da1a478a0d48f12f3678 Mon Sep 17 00:00:00 2001
From: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>
Date: Tue, 4 Oct 2022 08:38:17 +0900
Subject: [PATCH 4/5] Unify and simplify messages

---
 lib/rules/custom-media-pattern/index.js    | 3 +--
 lib/rules/custom-property-pattern/index.js | 3 +--
 lib/rules/keyframes-name-pattern/index.js  | 3 +--
 lib/rules/selector-class-pattern/index.js  | 3 +--
 lib/rules/selector-id-pattern/index.js     | 3 +--
 lib/rules/selector-nested-pattern/index.js | 3 +--
 6 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/lib/rules/custom-media-pattern/index.js b/lib/rules/custom-media-pattern/index.js
index 3021d841a2..fae968dc42 100644
--- a/lib/rules/custom-media-pattern/index.js
+++ b/lib/rules/custom-media-pattern/index.js
@@ -9,8 +9,7 @@ const { isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'custom-media-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (name, pattern) =>
-		`Expected custom media query name "${name}" to match pattern "${pattern}"`,
+	expected: (mediaName, pattern) => `Expected "${mediaName}" to match pattern "${pattern}"`,
 });
 
 const meta = {
diff --git a/lib/rules/custom-property-pattern/index.js b/lib/rules/custom-property-pattern/index.js
index db47ef9556..ceef283801 100644
--- a/lib/rules/custom-property-pattern/index.js
+++ b/lib/rules/custom-property-pattern/index.js
@@ -13,8 +13,7 @@ const isStandardSyntaxProperty = require('../../utils/isStandardSyntaxProperty')
 const ruleName = 'custom-property-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (name, pattern) =>
-		`Expected custom property name "${name}" to match pattern "${pattern}"`,
+	expected: (propName, pattern) => `Expected "${propName}" to match pattern "${pattern}"`,
 });
 
 const meta = {
diff --git a/lib/rules/keyframes-name-pattern/index.js b/lib/rules/keyframes-name-pattern/index.js
index 9064d83ed1..dbdd96dd5e 100644
--- a/lib/rules/keyframes-name-pattern/index.js
+++ b/lib/rules/keyframes-name-pattern/index.js
@@ -10,8 +10,7 @@ const { isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'keyframes-name-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (keyframeName, pattern) =>
-		`Expected keyframe name "${keyframeName}" to match pattern "${pattern}"`,
+	expected: (keyframeName, pattern) => `Expected "${keyframeName}" to match pattern "${pattern}"`,
 });
 
 const meta = {
diff --git a/lib/rules/selector-class-pattern/index.js b/lib/rules/selector-class-pattern/index.js
index 9cbbe9c461..69c0b83cc9 100644
--- a/lib/rules/selector-class-pattern/index.js
+++ b/lib/rules/selector-class-pattern/index.js
@@ -13,8 +13,7 @@ const { isBoolean, isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'selector-class-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (selector, pattern) =>
-		`Expected class selector "${selector}" to match pattern "${pattern}"`,
+	expected: (selector, pattern) => `Expected "${selector}" to match pattern "${pattern}"`,
 });
 
 const meta = {
diff --git a/lib/rules/selector-id-pattern/index.js b/lib/rules/selector-id-pattern/index.js
index f42a311c2e..e22c6ef74d 100644
--- a/lib/rules/selector-id-pattern/index.js
+++ b/lib/rules/selector-id-pattern/index.js
@@ -10,8 +10,7 @@ const { isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'selector-id-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (selector, pattern) =>
-		`Expected ID selector "${selector}" to match pattern "${pattern}"`,
+	expected: (selector, pattern) => `Expected "${selector}" to match pattern "${pattern}"`,
 });
 
 const meta = {
diff --git a/lib/rules/selector-nested-pattern/index.js b/lib/rules/selector-nested-pattern/index.js
index 873b532b29..1b5ff94f71 100644
--- a/lib/rules/selector-nested-pattern/index.js
+++ b/lib/rules/selector-nested-pattern/index.js
@@ -9,8 +9,7 @@ const { isRegExp, isString } = require('../../utils/validateTypes');
 const ruleName = 'selector-nested-pattern';
 
 const messages = ruleMessages(ruleName, {
-	expected: (selector, pattern) =>
-		`Expected nested selector "${selector}" to match pattern "${pattern}"`,
+	expected: (selector, pattern) => `Expected "${selector}" to match pattern "${pattern}"`,
 });
 
 const meta = {

From 3267990a3c85da81cd81a2e9d014c354fd9c217e Mon Sep 17 00:00:00 2001
From: Masafumi Koba <473530+ybiquitous@users.noreply.github.com>
Date: Tue, 4 Oct 2022 08:41:17 +0900
Subject: [PATCH 5/5] Add custom message formatting to
 `selector-nested-pattern`

---
 lib/rules/selector-nested-pattern/index.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/lib/rules/selector-nested-pattern/index.js b/lib/rules/selector-nested-pattern/index.js
index 1b5ff94f71..d43c826e64 100644
--- a/lib/rules/selector-nested-pattern/index.js
+++ b/lib/rules/selector-nested-pattern/index.js
@@ -48,7 +48,8 @@ const rule = (primary) => {
 			report({
 				result,
 				ruleName,
-				message: messages.expected(selector, primary),
+				message: messages.expected,
+				messageArgs: [selector, primary],
 				node: ruleNode,
 				word: selector,
 			});