diff --git a/lib/rules/syntaxes/slot-scope-attribute.js b/lib/rules/syntaxes/slot-scope-attribute.js index 87aa19d11..8e8464170 100644 --- a/lib/rules/syntaxes/slot-scope-attribute.js +++ b/lib/rules/syntaxes/slot-scope-attribute.js @@ -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 `` * @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 @@ -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 }) diff --git a/tests/lib/rules/no-deprecated-slot-scope-attribute.js b/tests/lib/rules/no-deprecated-slot-scope-attribute.js index ab9a610ba..ba5ce74f1 100644 --- a/tests/lib/rules/no-deprecated-slot-scope-attribute.js +++ b/tests/lib/rules/no-deprecated-slot-scope-attribute.js @@ -14,22 +14,27 @@ tester.run('no-deprecated-slot-scope-attribute', rule, { valid: [ ``, ``, ``, + ``, ``, ``, `` + `, + `