Skip to content

Commit fb4c1c0

Browse files
ST-DDTwaynzhFloEdelmann
authored
feat(no-deprecated-slot-attribute): regex ignore patterns (#2773)
Co-authored-by: waynzh <waynzh19@gmail.com> Co-authored-by: Flo Edelmann <git@flo-edelmann.de>
1 parent ca97301 commit fb4c1c0

File tree

4 files changed

+108
-6
lines changed

4 files changed

+108
-6
lines changed

.changeset/tangy-eagles-start.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'eslint-plugin-vue': minor
3+
---
4+
5+
[`vue/no-deprecated-slot-attribute`](https://eslint.vuejs.org/rules/no-deprecated-slot-attribute.html) `ignore` option now supports regex patterns.

docs/rules/no-deprecated-slot-attribute.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ This rule reports deprecated `slot` attribute in Vue.js v2.6.0+.
4848
}
4949
```
5050

51-
- `"ignore"` (`string[]`) An array of tags that ignore this rules. This option will check both kebab-case and PascalCase versions of the given tag names. Default is empty.
51+
- `"ignore"` (`string[]`) An array of tags or regular expression patterns (e.g. `/^custom-/`) that ignore these rules. This option will check both kebab-case and PascalCase versions of the given tag names. Default is empty.
5252

5353
### `"ignore": ["my-component"]`
5454

lib/rules/syntaxes/slot-attribute.js

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,19 @@
55
'use strict'
66

77
const canConvertToVSlot = require('./utils/can-convert-to-v-slot')
8+
const regexp = require('../../utils/regexp')
89
const casing = require('../../utils/casing')
910

1011
module.exports = {
1112
deprecated: '2.6.0',
1213
supported: '<3.0.0',
1314
/** @param {RuleContext} context @returns {TemplateListener} */
1415
createTemplateBodyVisitor(context) {
16+
/** @type {{ ignore: string[] }} */
1517
const options = context.options[0] || {}
16-
/** @type {Set<string>} */
17-
const ignore = new Set(options.ignore)
18+
const { ignore = [] } = options
19+
/** @type {RegExp[]} */
20+
const ignorePatterns = ignore.map(regexp.toRegExp)
1821

1922
const sourceCode = context.getSourceCode()
2023
const tokenStore =
@@ -122,10 +125,16 @@ module.exports = {
122125
*/
123126
function reportSlot(slotAttr) {
124127
const componentName = slotAttr.parent.parent.rawName
128+
const componentNamePascalCase = casing.pascalCase(componentName)
129+
const componentNameKebabCase = casing.kebabCase(componentName)
130+
125131
if (
126-
ignore.has(componentName) ||
127-
ignore.has(casing.pascalCase(componentName)) ||
128-
ignore.has(casing.kebabCase(componentName))
132+
ignorePatterns.some(
133+
(pattern) =>
134+
pattern.test(componentName) ||
135+
pattern.test(componentNamePascalCase) ||
136+
pattern.test(componentNameKebabCase)
137+
)
129138
) {
130139
return
131140
}

tests/lib/rules/no-deprecated-slot-attribute.js

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,18 @@ tester.run('no-deprecated-slot-attribute', rule, {
5555
</LinkList>
5656
</template>`,
5757
options: [{ ignore: ['one', 'two', 'my-component'] }]
58+
},
59+
{
60+
code: `<template>
61+
<LinkList>
62+
<one slot="one" />
63+
<two slot="two" />
64+
<my-component slot="my-component-slot" />
65+
<myComponent slot="myComponent-slot" />
66+
<MyComponent slot="MyComponent-slot" />
67+
</LinkList>
68+
</template>`,
69+
options: [{ ignore: ['/one/', '/^Two$/i', '/^my-.*/i'] }]
5870
}
5971
],
6072
invalid: [
@@ -644,6 +656,82 @@ tester.run('no-deprecated-slot-attribute', rule, {
644656
],
645657
errors: ['`slot` attributes are deprecated.']
646658
},
659+
{
660+
code: `
661+
<template>
662+
<my-component>
663+
<one slot="one">
664+
A
665+
</one>
666+
<two slot="two">
667+
B
668+
</two>
669+
</my-component>
670+
</template>`,
671+
output: `
672+
<template>
673+
<my-component>
674+
<one slot="one">
675+
A
676+
</one>
677+
<template v-slot:two>\n<two >
678+
B
679+
</two>\n</template>
680+
</my-component>
681+
</template>`,
682+
options: [
683+
{
684+
ignore: ['/one/']
685+
}
686+
],
687+
errors: [
688+
{
689+
message: '`slot` attributes are deprecated.',
690+
line: 7,
691+
endLine: 7,
692+
column: 16,
693+
endColumn: 20
694+
}
695+
]
696+
},
697+
{
698+
code: `
699+
<template>
700+
<my-component>
701+
<one slot="one">
702+
A
703+
</one>
704+
<two slot="two">
705+
B
706+
</two>
707+
</my-component>
708+
</template>`,
709+
output: `
710+
<template>
711+
<my-component>
712+
<one slot="one">
713+
A
714+
</one>
715+
<template v-slot:two>\n<two >
716+
B
717+
</two>\n</template>
718+
</my-component>
719+
</template>`,
720+
options: [
721+
{
722+
ignore: ['/^one$/']
723+
}
724+
],
725+
errors: [
726+
{
727+
message: '`slot` attributes are deprecated.',
728+
line: 7,
729+
endLine: 7,
730+
column: 16,
731+
endColumn: 20
732+
}
733+
]
734+
},
647735
{
648736
code: `
649737
<template>

0 commit comments

Comments
 (0)