diff --git a/.changeset/many-tools-build.md b/.changeset/many-tools-build.md new file mode 100644 index 0000000000..4e41b0e7fe --- /dev/null +++ b/.changeset/many-tools-build.md @@ -0,0 +1,5 @@ +--- +"stylelint": minor +--- + +Added: `*-pattern` custom message formatting 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 d5a3ced4e2..fae968dc42 100644 --- a/lib/rules/custom-media-pattern/index.js +++ b/lib/rules/custom-media-pattern/index.js @@ -9,7 +9,7 @@ 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: (mediaName, pattern) => `Expected "${mediaName}" to match pattern "${pattern}"`, }); const meta = { @@ -35,14 +35,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 +48,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 3d4081f956..ceef283801 100644 --- a/lib/rules/custom-property-pattern/index.js +++ b/lib/rules/custom-property-pattern/index.js @@ -13,7 +13,7 @@ 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: (propName, pattern) => `Expected "${propName}" to match pattern "${pattern}"`, }); const meta = { @@ -62,27 +62,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 f61fcd837a..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 = { @@ -49,7 +48,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 e1ee172e41..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 = { @@ -100,7 +99,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 1871e4ae33..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 = { @@ -48,7 +47,8 @@ const rule = (primary) => { report({ result, ruleName, - message: messages.expected(selector, primary), + message: messages.expected, + messageArgs: [selector, primary], node: ruleNode, word: selector, }); diff --git a/lib/rules/selector-nested-pattern/index.js b/lib/rules/selector-nested-pattern/index.js index 873b532b29..d43c826e64 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 = { @@ -49,7 +48,8 @@ const rule = (primary) => { report({ result, ruleName, - message: messages.expected(selector, primary), + message: messages.expected, + messageArgs: [selector, primary], node: ruleNode, word: selector, });