Skip to content

Commit

Permalink
Change to autofix
Browse files Browse the repository at this point in the history
  • Loading branch information
ota-meshi committed Apr 2, 2019
1 parent a0ca7dd commit c9afae4
Show file tree
Hide file tree
Showing 2 changed files with 47 additions and 70 deletions.
55 changes: 24 additions & 31 deletions lib/rules/syntaxes/slot-scope-attribute.js
Expand Up @@ -11,54 +11,49 @@ module.exports = {

/**
* Checks whether the given node can convert to the `v-slot`.
* @param {VAttribute | null} slotAttr node of `slot`
* @param {VElement} slotAttr node of `slot`
* @param {VStartTag} startTag node of `<element v-slot ... >`
* @returns {boolean} `true` if the given node can convert to the `v-slot`
*/
function canConvertToVSlot (slotAttr, element) {
function canConvertToVSlot (startTag) {
if (startTag.parent.name !== 'template') {
return false
}

const slotAttr = startTag.attributes
.find(attr => attr.directive === false && attr.key.name === 'slot')
if (slotAttr) {
if (!slotAttr.value) {
return true
}
const slotName = slotAttr.value.value
// If non-Latin characters are included it can not be converted.
return !/[^a-z]/i.test(slotName)
// if the element have `slot` it can not be converted.
// Conversion of `slot` is done with `vue/no-deprecated-slot-attribute`.
return false
}

const vBindSlotAttr = element.attributes
const vBindSlotAttr = startTag.attributes
.find(attr =>
attr.directive === true &&
attr.key.name.name === 'bind' &&
attr.key.argument &&
attr.key.argument.name === 'slot')
// if the element have `v-bind:slot` it can not be converted.
// Conversion of `v-bind:slot` is done with `vue/no-deprecated-slot-attribute`.
return !vBindSlotAttr
if (vBindSlotAttr) {
// if the element have `v-bind:slot` it can not be converted.
// Conversion of `v-bind:slot` is done with `vue/no-deprecated-slot-attribute`.
return false
}
return true
}

/**
* Convert to `v-slot`.
* @param {object} fixer fixer
* @param {VAttribute | null} slotAttr node of `slot`
* @param {VAttribute | null} scopeAttr node of `slot-scope`
* @returns {*} fix data
*/
function fixSlotToVSlot (fixer, slotAttr, scopeAttr) {
const nameArgument = slotAttr && slotAttr.value && slotAttr.value.value
? `:${slotAttr.value.value}`
: ''
function fixSlotScopeToVSlot (fixer, scopeAttr) {
const scopeValue = scopeAttr && scopeAttr.value
? `=${sourceCode.getText(scopeAttr.value)}`
: ''

const replaceText = `v-slot${nameArgument}${scopeValue}`
const fixers = [
fixer.replaceText(slotAttr || scopeAttr, replaceText)
]
if (slotAttr && scopeAttr) {
fixers.push(fixer.remove(scopeAttr))
}
return fixers
const replaceText = `v-slot${scopeValue}`
return fixer.replaceText(scopeAttr, replaceText)
}
/**
* Reports `slot-scope` node
Expand All @@ -72,13 +67,11 @@ module.exports = {
fix: fixToUpgrade
// fix to use `v-slot`
? (fixer) => {
const element = scopeAttr.parent
const slotAttr = element.attributes
.find(attr => attr.directive === false && attr.key.name === 'slot')
if (!canConvertToVSlot(slotAttr, element)) {
const startTag = scopeAttr.parent
if (!canConvertToVSlot(startTag)) {
return null
}
return fixSlotToVSlot(fixer, slotAttr, scopeAttr)
return fixSlotScopeToVSlot(fixer, scopeAttr)
}
: null
})
Expand Down
62 changes: 23 additions & 39 deletions tests/lib/rules/no-deprecated-slot-scope-attribute.js
Expand Up @@ -14,22 +14,27 @@ tester.run('no-deprecated-slot-scope-attribute', rule, {
valid: [
`<template>
<LinkList>
<a v-slot:name />
<template v-slot:name><a /></template>
</LinkList>
</template>`,
`<template>
<LinkList>
<a #name />
<template #name><a /></template>
</LinkList>
</template>`,
`<template>
<LinkList>
<a v-slot="{a}" />
<template v-slot="{a}"><a /></template>
</LinkList>
</template>`,
`<template>
<LinkList v-slot="{a}">
<a />
</LinkList>
</template>`,
`<template>
<LinkList>
<a #default="{a}" />
<template #default="{a}"><a /></template>
</LinkList>
</template>`,
`<template>
Expand All @@ -39,22 +44,26 @@ tester.run('no-deprecated-slot-scope-attribute', rule, {
</template>`,
`<template>
<LinkList>
<a />
<template><a /></template>
</LinkList>
</template>`
</template>`,
`<template>
<LinkList>
<a />
</LinkList>`
],
invalid: [
{
code: `
<template>
<LinkList>
<a slot="name" disabled slot-scope="{a}"/>
<template slot-scope="{a}"><a /></template>
</LinkList>
</template>`,
output: `
<template>
<LinkList>
<a v-slot:name="{a}" disabled />
<template v-slot="{a}"><a /></template>
</LinkList>
</template>`,
errors: [
Expand All @@ -68,13 +77,13 @@ tester.run('no-deprecated-slot-scope-attribute', rule, {
code: `
<template>
<LinkList>
<a slot-scope />
<template slot-scope><a /></template>
</LinkList>
</template>`,
output: `
<template>
<LinkList>
<a v-slot />
<template v-slot><a /></template>
</LinkList>
</template>`,
errors: [
Expand All @@ -84,52 +93,27 @@ tester.run('no-deprecated-slot-scope-attribute', rule, {
}
]
},
// cannot fix
{
code: `
<template>
<LinkList>
<a slot-scope="{a}" />
</LinkList>
</template>`,
output: `
<template>
<LinkList>
<a v-slot="{a}" />
</LinkList>
</template>`,
errors: [
{
message: '`slot-scope` are deprecated.',
line: 4
}
]
},
{
code: `
<template>
<LinkList>
<a slot-scope="{a}" slot="name"/>
</LinkList>
</template>`,
output: `
<template>
<LinkList>
<a v-slot:name="{a}"/>
</LinkList>
</template>`,
output: null,
errors: [
{
message: '`slot-scope` are deprecated.',
line: 4
}
]
},
// cannot fix
{
code: `
<template>
<LinkList>
<a slot-scope="{a}" slot="f o o"/>
<template slot-scope="{a}" slot="foo"><a /></template>
</LinkList>
</template>`,
output: null,
Expand All @@ -144,7 +128,7 @@ tester.run('no-deprecated-slot-scope-attribute', rule, {
code: `
<template>
<LinkList>
<a slot-scope="{a}" :slot="arg"/>
<template slot-scope="{a}" :slot="arg"><a /></template>
</LinkList>
</template>`,
output: null,
Expand Down

0 comments on commit c9afae4

Please sign in to comment.