Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add *-pattern custom message formatting #6391

Merged
merged 6 commits into from Oct 4, 2022
Merged

Add *-pattern custom message formatting #6391

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
0efc927
Add custom message formatting to some standard config rules
ybiquitous Oct 3, 2022
0d6a9ab
Add changelog entry
ybiquitous Oct 3, 2022
328e436
Update .changeset/many-tools-build.md
ybiquitous Oct 3, 2022
e0d100d
Merge branch 'main' into add-custom-message-formatting-to-standard-co…
ybiquitous Oct 3, 2022
19f313e
Unify and simplify messages
ybiquitous Oct 3, 2022
3267990
Add custom message formatting to `selector-nested-pattern`
ybiquitous Oct 3, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/many-tools-build.md
View file
Open in desktop
@@ -0,0 +1,5 @@
---
"stylelint": minor
---

Added: `*-pattern` custom message formatting
16 changes: 8 additions & 8 deletions lib/rules/custom-media-pattern/__tests__/index.js
View file
Open in desktop
Expand Up @@ -27,31 +27,31 @@ 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,
endColumn: 24,
},
{
code: '@cUsToM-mEdIa --foa-bar (min-width: 0);',
message: messages.expected(/foo-.+/),
message: messages.expected('--foa-bar', /foo-.+/),
line: 1,
column: 15,
endLine: 1,
endColumn: 24,
},
{
code: '@CUSTOM-MEDIA --foa-bar (min-width: 0);',
message: messages.expected(/foo-.+/),
message: messages.expected('--foa-bar', /foo-.+/),
line: 1,
column: 15,
endLine: 1,
endColumn: 24,
},
{
code: '@custom-media --foa (min-width: 0);',
message: messages.expected(/foo-.+/),
message: messages.expected('--foa', /foo-.+/),
line: 1,
column: 15,
endLine: 1,
Expand Down Expand Up @@ -79,15 +79,15 @@ 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,
endColumn: 24,
},
{
code: '@custom-media --foa (min-width: 0);',
message: messages.expected('foo-.+'),
message: messages.expected('--foa', 'foo-.+'),
line: 1,
column: 15,
endLine: 1,
Expand All @@ -112,15 +112,15 @@ 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,
endColumn: 28,
},
{
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,
Expand Down
14 changes: 7 additions & 7 deletions lib/rules/custom-media-pattern/index.js
View file
Open in desktop
Expand Up @@ -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}"`,
ybiquitous marked this conversation as resolved.
Show resolved Hide resolved
});

const meta = {
Expand All @@ -35,25 +36,24 @@ 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;
}

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,
});
Expand Down
36 changes: 24 additions & 12 deletions lib/rules/custom-property-pattern/__tests__/index.js
View file
Open in desktop
Expand Up @@ -28,39 +28,39 @@ testRule({
reject: [
{
code: ':root { --boo-bar: 0; }',
message: messages.expected(/foo-.+/),
message: messages.expected('--boo-bar', /foo-.+/),
line: 1,
column: 9,
endLine: 1,
endColumn: 18,
},
{
code: ':root { --foo-: 0; }',
message: messages.expected(/foo-.+/),
message: messages.expected('--foo-', /foo-.+/),
line: 1,
column: 9,
endLine: 1,
endColumn: 15,
},
{
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,
endColumn: 56,
},
{
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,
endColumn: 81,
},
{
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,
Expand All @@ -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,
},
],
},
],
Expand All @@ -92,15 +104,15 @@ testRule({
reject: [
{
code: ':root { --boo-bar: 0; }',
message: messages.expected('foo-.+'),
message: messages.expected('--boo-bar', 'foo-.+'),
line: 1,
column: 9,
endLine: 1,
endColumn: 18,
},
{
code: ':root { --foo-: 0; }',
message: messages.expected('foo-.+'),
message: messages.expected('--foo-', 'foo-.+'),
line: 1,
column: 9,
endLine: 1,
Expand All @@ -125,23 +137,23 @@ 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,
endColumn: 22,
},
{
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,
endColumn: 18,
},
{
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,
Expand Down
16 changes: 9 additions & 7 deletions lib/rules/custom-property-pattern/index.js
View file
Open in desktop
Expand Up @@ -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 = {
Expand Down Expand Up @@ -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,
});
}
};
Expand Down
3 changes: 2 additions & 1 deletion lib/rules/keyframes-name-pattern/index.js
View file
Open in desktop
Expand Up @@ -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,
Expand Down
3 changes: 2 additions & 1 deletion lib/rules/selector-class-pattern/index.js
View file
Open in desktop
Expand Up @@ -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,
Expand Down
3 changes: 2 additions & 1 deletion lib/rules/selector-id-pattern/index.js
View file
Open in desktop
Expand Up @@ -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,
});
Expand Down