Skip to content

Commit 83e4311

Browse files
g-planeg-plane
committed
accept option "always" or "never" 
1 parent dbfe89c commit 83e4311

File tree

4 files changed

+175
-20
lines changed

4 files changed

+175
-20
lines changed

‎docs/rules/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -353,7 +353,7 @@ For example:
353353
| [vue/no-v-text](./no-v-text.md) | disallow use of v-text | |
354354
| [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |
355355
| [vue/prefer-separate-static-class](./prefer-separate-static-class.md) | require static class names in template to be in a separate `class` attribute | :wrench: |
356-
| [vue/prefer-true-attribute-shorthand](./prefer-true-attribute-shorthand.md) | require shorthand form attribute when `v-bind` value is `true` | :bulb: |
356+
| [vue/prefer-true-attribute-shorthand](./prefer-true-attribute-shorthand.md) | require shorthand form attribute when `v-bind` value is `true` | :wrench::bulb: |
357357
| [vue/require-direct-export](./require-direct-export.md) | require the component to be directly exported | |
358358
| [vue/require-emit-validator](./require-emit-validator.md) | require type definitions in emits | :bulb: |
359359
| [vue/require-expose](./require-expose.md) | require declare public properties using `expose` | :bulb: |

‎docs/rules/prefer-true-attribute-shorthand.md

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,14 @@ description: require shorthand form attribute when `v-bind` value is `true`
99
> require shorthand form attribute when `v-bind` value is `true`
1010
1111
- :exclamation: <badge text="This rule has not been released yet." vertical="middle" type="error"> ***This rule has not been released yet.*** </badge>
12+
- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
1213
- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
1314

1415
## :book: Rule Details
1516

1617
`v-bind` attribute with `true` value usually can be written in shorthand form. This can reduce verbosity.
1718

18-
<eslint-code-block :rules="{'vue/prefer-true-attribute-shorthand': ['error']}">
19+
<eslint-code-block fix :rules="{'vue/prefer-true-attribute-shorthand': ['error']}">
1920

2021
```vue
2122
<template>
@@ -76,7 +77,33 @@ Those two calls will introduce different render result. See [this demo](https://
7677

7778
## :wrench: Options
7879

79-
Nothing.
80+
Default options is `"always"`.
81+
82+
```json
83+
{
84+
"vue/prefer-true-attribute-shorthand": ["error", "always" | "never"]
85+
}
86+
```
87+
88+
- `"always"` (default) ... requires shorthand form.
89+
- `"never"` ... requires long form.
90+
91+
### `"never"`
92+
93+
<eslint-code-block fix :rules="{'vue/prefer-true-attribute-shorthand': ['error', 'never']}">
94+
95+
```vue
96+
<template>
97+
<!-- ✗ BAD -->
98+
<MyComponent show />
99+
100+
<!-- ✓ GOOD -->
101+
<MyComponent :show="true" />
102+
<MyComponent v-bind:show="true" />
103+
</template>
104+
```
105+
106+
</eslint-code-block>
80107

81108
## :mag: Implementation
82109

‎lib/rules/prefer-true-attribute-shorthand.js

Lines changed: 33 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -23,23 +23,40 @@ module.exports = {
2323
categories: undefined,
2424
url: 'https://eslint.vuejs.org/rules/prefer-true-attribute-shorthand.html'
2525
},
26-
fixable: null,
26+
fixable: 'code',
2727
hasSuggestions: true,
28-
schema: [],
28+
schema: [{ enum: ['always', 'never'] }],
2929
messages: {
30-
report:
31-
"Boolean prop with 'true' value can be written in shorthand form.",
32-
fix: 'Rewrite this prop into shorthand form.'
30+
expectShort:
31+
"Boolean prop with 'true' value should be written in shorthand form.",
32+
expectLong:
33+
"Boolean prop with 'true' value should be written in long form.",
34+
suggestion: 'Rewrite this prop into shorthand form.'
3335
}
3436
},
3537
/** @param {RuleContext} context */
3638
create(context) {
39+
/** @type {'always' | 'never'} */
40+
const option = context.options[0] || 'always'
41+
3742
return utils.defineTemplateBodyVisitor(context, {
38-
/** @param {VDirective} node */
39-
"VAttribute[directive=true][key.name.name='bind']"(node) {
40-
const { argument } = node.key
43+
VAttribute(node) {
44+
if (option === 'never' && !node.directive && !node.value) {
45+
context.report({
46+
node,
47+
messageId: 'expectLong',
48+
fix: (fixer) =>
49+
fixer.replaceText(node, `:${node.key.rawName}="true"`)
50+
})
51+
return
52+
}
53+
54+
if (option !== 'always') {
55+
return
56+
}
57+
4158
if (
42-
!argument ||
59+
!node.directive ||
4360
!node.value ||
4461
!node.value.expression ||
4562
node.value.expression.type !== 'Literal' ||
@@ -48,12 +65,17 @@ module.exports = {
4865
return
4966
}
5067

68+
const { argument } = node.key
69+
if (!argument) {
70+
return
71+
}
72+
5173
context.report({
5274
node,
53-
messageId: 'report',
75+
messageId: 'expectShort',
5476
suggest: [
5577
{
56-
messageId: 'fix',
78+
messageId: 'suggestion',
5779
fix: (fixer) => {
5880
const sourceCode = context.getSourceCode()
5981
return fixer.replaceText(node, sourceCode.getText(argument))

‎tests/lib/rules/prefer-true-attribute-shorthand.js

Lines changed: 112 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,41 @@ tester.run('prefer-true-attribute-shorthand', rule, {
8080
<MyComp :show="false" />
8181
</template>
8282
`
83+
},
84+
{
85+
filename: 'test.vue',
86+
code: `
87+
<template>
88+
<MyComp show />
89+
</template>
90+
`
91+
},
92+
{
93+
filename: 'test.vue',
94+
code: `
95+
<template>
96+
<MyComp show />
97+
</template>
98+
`,
99+
options: ['always']
100+
},
101+
{
102+
filename: 'test.vue',
103+
code: `
104+
<template>
105+
<MyComp :show="true" />
106+
</template>
107+
`,
108+
options: ['never']
109+
},
110+
{
111+
filename: 'test.vue',
112+
code: `
113+
<template>
114+
<MyComp v-bind:show="true" />
115+
</template>
116+
`,
117+
options: ['never']
83118
}
84119
],
85120
invalid: [
@@ -91,20 +126,21 @@ tester.run('prefer-true-attribute-shorthand', rule, {
91126
</template>`,
92127
errors: [
93128
{
94-
messageId: 'report',
129+
messageId: 'expectShort',
95130
line: 3,
96131
column: 17,
97132
suggestions: [
98133
{
99-
messageId: 'fix',
134+
messageId: 'suggestion',
100135
output: `
101136
<template>
102137
<MyComp show />
103138
</template>`
104139
}
105140
]
106141
}
107-
]
142+
],
143+
output: null
108144
},
109145
{
110146
filename: 'test.vue',
@@ -114,20 +150,90 @@ tester.run('prefer-true-attribute-shorthand', rule, {
114150
</template>`,
115151
errors: [
116152
{
117-
messageId: 'report',
153+
messageId: 'expectShort',
118154
line: 3,
119155
column: 17,
120156
suggestions: [
121157
{
122-
messageId: 'fix',
158+
messageId: 'suggestion',
123159
output: `
124160
<template>
125161
<MyComp show />
126162
</template>`
127163
}
128164
]
129165
}
130-
]
166+
],
167+
output: null
168+
},
169+
{
170+
filename: 'test.vue',
171+
code: `
172+
<template>
173+
<MyComp v-bind:show="true" />
174+
</template>`,
175+
options: ['always'],
176+
errors: [
177+
{
178+
messageId: 'expectShort',
179+
line: 3,
180+
column: 17,
181+
suggestions: [
182+
{
183+
messageId: 'suggestion',
184+
output: `
185+
<template>
186+
<MyComp show />
187+
</template>`
188+
}
189+
]
190+
}
191+
],
192+
output: null
193+
},
194+
{
195+
filename: 'test.vue',
196+
code: `
197+
<template>
198+
<MyComp :show="true" />
199+
</template>`,
200+
options: ['always'],
201+
errors: [
202+
{
203+
messageId: 'expectShort',
204+
line: 3,
205+
column: 17,
206+
suggestions: [
207+
{
208+
messageId: 'suggestion',
209+
output: `
210+
<template>
211+
<MyComp show />
212+
</template>`
213+
}
214+
]
215+
}
216+
],
217+
output: null
218+
},
219+
{
220+
filename: 'test.vue',
221+
code: `
222+
<template>
223+
<MyComp show />
224+
</template>`,
225+
options: ['never'],
226+
errors: [
227+
{
228+
messageId: 'expectLong',
229+
line: 3,
230+
column: 17
231+
}
232+
],
233+
output: `
234+
<template>
235+
<MyComp :show="true" />
236+
</template>`
131237
}
132238
]
133239
})

0 commit comments

Comments
 (0)