Add custom parameter messages to *-pattern rules (#264)

__tests__/index.test.js

@@ -4,69 +4,76 @@ const config = require('../');
 const fs = require('fs');
 const stylelint = require('stylelint');
 
-const validCss = fs.readFileSync('./__tests__/valid.css', 'utf-8');
-const invalidCss = fs.readFileSync('./__tests__/invalid.css', 'utf-8');
-
 describe('flags no warnings with valid css', () => {
+	const validCss = fs.readFileSync('./__tests__/valid.css', 'utf-8');
 	let result;
 
-	beforeEach(() => {
-		result = stylelint.lint({
+	beforeEach(async () => {
+		result = await stylelint.lint({
 			code: validCss,
 			config,
 		});
 	});
 
 	it('did not error', () => {
-		return result.then((data) => expect(data.errored).toBeFalsy());
+		expect(result.errored).toBe(false);
 	});
 
 	it('flags no warnings', () => {
-		return result.then((data) => expect(data.results[0].warnings).toHaveLength(0));
+		expect(result.results[0].warnings).toHaveLength(0);
 	});
 });
 
 describe('flags warnings with invalid css', () => {
+	const invalidCss = fs.readFileSync('./__tests__/invalid.css', 'utf-8');
 	let result;
 
-	beforeEach(() => {
-		result = stylelint.lint({
+	beforeEach(async () => {
+		result = await stylelint.lint({
 			code: invalidCss,
 			config,
 		});
 	});
 
 	it('did error', () => {
-		return result.then((data) => expect(data.errored).toBeTruthy());
+		expect(result.errored).toBe(true);
 	});
 
-	it('flags one warning', () => {
-		return result.then((data) => expect(data.results[0].warnings).toHaveLength(1));
+	it('flags warnings', () => {
+		expect(result.results[0].warnings).toHaveLength(6);
 	});
 
 	it('correct warning text', () => {
-		return result.then((data) =>
-			expect(data.results[0].warnings[0].text).toBe(
-				'Expected a leading zero (number-leading-zero)',
-			),
-		);
+		expect(result.results[0].warnings.map((w) => w.text)).toEqual([
+			'Expected custom media query name "--FOO" to be kebab-case',
+			'Expected custom property name "--FOO" to be kebab-case',
+			'Expected keyframe name "FOO" to be kebab-case',
+			'Expected a leading zero (number-leading-zero)',
+			'Expected class selector ".FOO" to be kebab-case',
+			'Expected id selector "#FOO" to be kebab-case',
+		]);
 	});
 
 	it('correct rule flagged', () => {
-		return result.then((data) =>
-			expect(data.results[0].warnings[0].rule).toBe('number-leading-zero'),
-		);
+		expect(result.results[0].warnings.map((w) => w.rule)).toEqual([
+			'custom-media-pattern',
+			'custom-property-pattern',
+			'keyframes-name-pattern',
+			'number-leading-zero',
+			'selector-class-pattern',
+			'selector-id-pattern',
+		]);
 	});
 
 	it('correct severity flagged', () => {
-		return result.then((data) => expect(data.results[0].warnings[0].severity).toBe('error'));
+		expect(result.results[0].warnings[0].severity).toBe('error');
 	});
 
 	it('correct line number', () => {
-		return result.then((data) => expect(data.results[0].warnings[0].line).toBe(2));
+		expect(result.results[0].warnings[0].line).toBe(5);
 	});
 
 	it('correct column number', () => {
-		return result.then((data) => expect(data.results[0].warnings[0].column).toBe(8));
+		expect(result.results[0].warnings[0].column).toBe(15);
 	});
 });

__tests__/invalid.css

@@ -1,3 +1,13 @@
 a {
   top: .2em;
 }
+
+@custom-media --FOO;
+
+:root { --FOO: 1px; }
+
+@keyframes FOO { /* ... */ }
+
+.FOO { /* ... */ }
+
+#FOO { /* ... */ }

index.js

@@ -54,13 +54,13 @@ module.exports = {
 		'custom-media-pattern': [
 			'^([a-z][a-z0-9]*)(-[a-z0-9]+)*$',
 			{
-				message: 'Expected custom media query name to be kebab-case',
+				message: (name) => `Expected custom media query name "${name}" to be kebab-case`,
 			},
 		],
 		'custom-property-pattern': [
 			'^([a-z][a-z0-9]*)(-[a-z0-9]+)*$',
 			{
-				message: 'Expected custom property name to be kebab-case',
+				message: (name) => `Expected custom property name "${name}" to be kebab-case`,
 			},
 		],
 		'declaration-bang-space-after': 'never',
@@ -98,7 +98,7 @@ module.exports = {
 		'keyframes-name-pattern': [
 			'^([a-z][a-z0-9]*)(-[a-z0-9]+)*$',
 			{
-				message: 'Expected keyframe name to be kebab-case',
+				message: (name) => `Expected keyframe name "${name}" to be kebab-case`,
 			},
 		],
 		'length-zero-no-unit': true,
@@ -136,7 +136,7 @@ module.exports = {
 		'selector-class-pattern': [
 			'^([a-z][a-z0-9]*)(-[a-z0-9]+)*$',
 			{
-				message: 'Expected class selector to be kebab-case',
+				message: (selector) => `Expected class selector "${selector}" to be kebab-case`,
 			},
 		],
 		'selector-combinator-space-after': 'always',
@@ -145,7 +145,7 @@ module.exports = {
 		'selector-id-pattern': [
 			'^([a-z][a-z0-9]*)(-[a-z0-9]+)*$',
 			{
-				message: 'Expected id selector to be kebab-case',
+				message: (selector) => `Expected id selector "${selector}" to be kebab-case`,
 			},
 		],
 		'selector-list-comma-newline-after': 'always',

package.json

@@ -60,9 +60,9 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^2.7.1",
     "remark-cli": "^11.0.0",
-    "stylelint": "^14.12.1"
+    "stylelint": "^14.14.0"
   },
   "peerDependencies": {
-    "stylelint": "^14.11.0"
+    "stylelint": "^14.14.0"
   }
 }