From f00cceadf1706893f66c39332da5f972b68d305c Mon Sep 17 00:00:00 2001
From: ota <otameshiyo23@gmail.com>
Date: Tue, 5 Feb 2019 17:17:17 +0900
Subject: [PATCH 1/2] =?UTF-8?q?=E2=AD=90=EF=B8=8FNew:=20Add=20vue/no-unsup?=
 =?UTF-8?q?ported-features=20rule?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/rules/README.md                          |   1 +
 docs/rules/no-unsupported-features.md         |  81 +++++
 lib/index.js                                  |   1 +
 lib/rules/no-unsupported-features.js          | 143 +++++++++
 .../syntaxes/dynamic-directive-arguments.js   |  25 ++
 lib/rules/syntaxes/slot-scope-attribute.js    |  60 ++++
 .../v-bind-prop-modifier-shorthand.js         |  33 ++
 lib/rules/syntaxes/v-slot.js                  |  57 ++++
 tests/lib/rules/no-unsupported-features.js    |  63 ++++
 .../dynamic-directive-arguments.js            |  86 ++++++
 .../slot-scope-attribute.js                   |  92 ++++++
 .../rules/no-unsupported-features/utils.js    |  38 +++
 .../v-bind-prop-modifier-shorthand.js         |  87 ++++++
 .../rules/no-unsupported-features/v-slot.js   | 287 ++++++++++++++++++
 14 files changed, 1054 insertions(+)
 create mode 100644 docs/rules/no-unsupported-features.md
 create mode 100644 lib/rules/no-unsupported-features.js
 create mode 100644 lib/rules/syntaxes/dynamic-directive-arguments.js
 create mode 100644 lib/rules/syntaxes/slot-scope-attribute.js
 create mode 100644 lib/rules/syntaxes/v-bind-prop-modifier-shorthand.js
 create mode 100644 lib/rules/syntaxes/v-slot.js
 create mode 100644 tests/lib/rules/no-unsupported-features.js
 create mode 100644 tests/lib/rules/no-unsupported-features/dynamic-directive-arguments.js
 create mode 100644 tests/lib/rules/no-unsupported-features/slot-scope-attribute.js
 create mode 100644 tests/lib/rules/no-unsupported-features/utils.js
 create mode 100644 tests/lib/rules/no-unsupported-features/v-bind-prop-modifier-shorthand.js
 create mode 100644 tests/lib/rules/no-unsupported-features/v-slot.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 82baedd01..cf68a089e 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -153,6 +153,7 @@ For example:
 | [vue/no-boolean-default](./no-boolean-default.md) | disallow boolean defaults | :wrench: |
 | [vue/no-empty-pattern](./no-empty-pattern.md) | disallow empty destructuring patterns |  |
 | [vue/no-restricted-syntax](./no-restricted-syntax.md) | disallow specified syntax |  |
+| [vue/no-unsupported-features](./no-unsupported-features.md) | disallow unsupported Vue.js syntax on the specified version | :wrench: |
 | [vue/object-curly-spacing](./object-curly-spacing.md) | enforce consistent spacing inside braces | :wrench: |
 | [vue/require-direct-export](./require-direct-export.md) | require the component to be directly exported |  |
 | [vue/script-indent](./script-indent.md) | enforce consistent indentation in `<script>` | :wrench: |
diff --git a/docs/rules/no-unsupported-features.md b/docs/rules/no-unsupported-features.md
new file mode 100644
index 000000000..cef2c33d4
--- /dev/null
+++ b/docs/rules/no-unsupported-features.md
@@ -0,0 +1,81 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-unsupported-features
+description: disallow unsupported Vue.js syntax on the specified version
+---
+# vue/no-unsupported-features
+> disallow unsupported Vue.js syntax on the specified version
+
+- :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.
+
+## :book: Rule Details
+
+This rule reports unsupported Vue.js syntax on the specified version.
+
+## :wrench: Options
+
+```json
+{
+  "vue/no-unsupported-features": ["error", {
+    "version": "^2.6.0",
+    "ignores": []
+  }]
+}
+```
+
+- `version` ... The `version` option accepts [the valid version range of `node-semver`](https://github.com/npm/node-semver#range-grammar). Set the version of Vue.js you are using. This option is required.
+- `ignores` ... You can use this `ignores` option to ignore the given features.
+The `"ignores"` option accepts an array of the following strings.
+  - Vue.js 2.6.0+
+    - `"dynamic-directive-arguments"` ... [dynamic directive arguments](https://vuejs.org/v2/guide/syntax.html#Dynamic-Arguments).
+    - `"v-slot"` ... [v-slot](https://vuejs.org/v2/api/#v-slot) directive.
+  - Vue.js 2.5.0+
+    - `"slot-scope-attribute"` ... [slot-scope](https://vuejs.org/v2/api/#slot-scope-deprecated) attributes.
+  - Vue.js `">=2.6.0-beta.1 <=2.6.0-beta.3"` or 2.6 custom build
+    - `"v-bind-prop-modifier-shorthand"` ... [v-bind](https://vuejs.org/v2/api/#v-bind) with `.prop` modifier shorthand.
+
+### `{"version": "^2.5.0"}`
+
+<eslint-code-block fix :rules="{'vue/no-unsupported-features': ['error', {'version': '^2.5.0'}]}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <CustomComponent :foo="val" />
+  <ListComponent>
+    <template slot="name" slot-scope="props">
+      {{ props.title }}
+    </template>
+  </ListComponent>
+
+  <!-- ✗ BAD -->
+  <!-- dynamic directive arguments -->
+  <CustomComponent :[foo]="val" />
+  <ListComponent>
+    <!-- v-slot -->
+    <template v-slot:name="props">
+      {{ props.title }}
+    </template>
+    <template #name="props">
+      {{ props.title }}
+    </template>
+  </ListComponent>
+</template>
+```
+
+</eslint-code-block>
+
+## :books: Further reading
+
+- [Guide - Dynamic Arguments](https://vuejs.org/v2/guide/syntax.html#Dynamic-Arguments)
+- [API - v-slot](https://vuejs.org/v2/api/#v-slot)
+- [API - slot-scope](https://vuejs.org/v2/api/#slot-scope-deprecated)
+- [Vue RFCs - 0001-new-slot-syntax](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0001-new-slot-syntax.md)
+- [Vue RFCs - 0002-slot-syntax-shorthand](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0002-slot-syntax-shorthand.md)
+- [Vue RFCs - 0003-dynamic-directive-arguments](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0003-dynamic-directive-arguments.md)
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-unsupported-features.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-unsupported-features.js)
diff --git a/lib/index.js b/lib/index.js
index 8dbae6823..4b669c749 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -48,6 +48,7 @@ module.exports = {
     'no-template-key': require('./rules/no-template-key'),
     'no-template-shadow': require('./rules/no-template-shadow'),
     'no-textarea-mustache': require('./rules/no-textarea-mustache'),
+    'no-unsupported-features': require('./rules/no-unsupported-features'),
     'no-unused-components': require('./rules/no-unused-components'),
     'no-unused-vars': require('./rules/no-unused-vars'),
     'no-use-v-if-with-v-for': require('./rules/no-use-v-if-with-v-for'),
diff --git a/lib/rules/no-unsupported-features.js b/lib/rules/no-unsupported-features.js
new file mode 100644
index 000000000..c4c361b3a
--- /dev/null
+++ b/lib/rules/no-unsupported-features.js
@@ -0,0 +1,143 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const { Range } = require('semver')
+const utils = require('../utils')
+
+const FEATURES = {
+  // Vue.js 2.5.0+
+  'slot-scope-attribute': require('./syntaxes/slot-scope-attribute'),
+  // Vue.js 2.6.0+
+  'dynamic-directive-arguments': require('./syntaxes/dynamic-directive-arguments'),
+  'v-slot': require('./syntaxes/v-slot'),
+
+  // >=2.6.0-beta.1 <=2.6.0-beta.3
+  'v-bind-prop-modifier-shorthand': require('./syntaxes/v-bind-prop-modifier-shorthand')
+}
+
+const cache = new Map()
+/**
+ * Get the `semver.Range` object of a given range text.
+ * @param {string} x The text expression for a semver range.
+ * @returns {Range|null} The range object of a given range text.
+ * It's null if the `x` is not a valid range text.
+ */
+function getSemverRange (x) {
+  const s = String(x)
+  let ret = cache.get(s) || null
+
+  if (!ret) {
+    try {
+      ret = new Range(s)
+    } catch (_error) {
+      // Ignore parsing error.
+    }
+    cache.set(s, ret)
+  }
+
+  return ret
+}
+
+/**
+ * Merge two visitors.
+ * @param {Visitor} x The visitor which is assigned.
+ * @param {Visitor} y The visitor which is assigning.
+ * @returns {Visitor} `x`.
+ */
+function merge (x, y) {
+  for (const key of Object.keys(y)) {
+    if (typeof x[key] === 'function') {
+      if (x[key]._handlers == null) {
+        const fs = [x[key], y[key]]
+        x[key] = node => fs.forEach(h => h(node))
+        x[key]._handlers = fs
+      } else {
+        x[key]._handlers.push(y[key])
+      }
+    } else {
+      x[key] = y[key]
+    }
+  }
+  return x
+}
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'disallow unsupported Vue.js syntax on the specified version',
+      category: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-unsupported-features.html'
+    },
+    fixable: 'code',
+    schema: [
+      {
+        type: 'object',
+        properties: {
+          version: {
+            type: 'string'
+          },
+          ignores: {
+            type: 'array',
+            items: {
+              enum: Object.keys(FEATURES)
+            },
+            uniqueItems: true
+          }
+        },
+        additionalProperties: false
+      }
+    ],
+    messages: {
+      // Vue.js 2.5.0+
+      forbiddenSlotScopeAttribute: '`slot-scope` are not supported until Vue.js "2.5.0".',
+      // Vue.js 2.6.0+
+      forbiddenDynamicDirectiveArguments: 'Dynamic arguments are not supported until Vue.js "2.6.0".',
+      forbiddenVSlot: '`v-slot` are not supported until Vue.js "2.6.0".',
+
+      // >=2.6.0-beta.1 <=2.6.0-beta.3
+      forbiddenVBindPropModifierShorthand: '`.prop` shorthand are not supported except Vue.js ">=2.6.0-beta.1 <=2.6.0-beta.3".'
+    }
+  },
+  create (context) {
+    const { version, ignores } = Object.assign(
+      {
+        version: null,
+        ignores: []
+      },
+      context.options[0] || {}
+    )
+    if (!version) {
+      // version is not set.
+      return {}
+    }
+    const versionRange = getSemverRange(version)
+
+    /**
+     * Check whether a given case object is full-supported on the configured node version.
+     * @param {{supported:string}} aCase The case object to check.
+     * @returns {boolean} `true` if it's supporting.
+     */
+    function isNotSupportingVersion (aCase) {
+      if (typeof aCase.supported === 'function') {
+        return !aCase.supported(versionRange)
+      }
+      return versionRange.intersects(getSemverRange(`<${aCase.supported}`))
+    }
+    const templateBodyVisitor = Object.keys(FEATURES)
+      .filter(syntaxName => !ignores.includes(syntaxName))
+      .filter(syntaxName => isNotSupportingVersion(FEATURES[syntaxName]))
+      .reduce((result, syntaxName) => {
+        const visitor = FEATURES[syntaxName].createTemplateBodyVisitor(context)
+        if (visitor) {
+          merge(result, visitor)
+        }
+        return result
+      }, {})
+
+    return utils.defineTemplateBodyVisitor(context, templateBodyVisitor)
+  }
+}
diff --git a/lib/rules/syntaxes/dynamic-directive-arguments.js b/lib/rules/syntaxes/dynamic-directive-arguments.js
new file mode 100644
index 000000000..4c5a5a7f1
--- /dev/null
+++ b/lib/rules/syntaxes/dynamic-directive-arguments.js
@@ -0,0 +1,25 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+module.exports = {
+  supported: '2.6.0',
+  createTemplateBodyVisitor (context) {
+    /**
+     * Reports dynamic argument node
+     * @param {VExpressionContainer} dinamicArgument node of dynamic argument
+     * @returns {void}
+     */
+    function reportDynamicArgument (dinamicArgument) {
+      context.report({
+        node: dinamicArgument,
+        messageId: 'forbiddenDynamicDirectiveArguments'
+      })
+    }
+
+    return {
+      'VAttribute[directive=true] > VDirectiveKey > VExpressionContainer': reportDynamicArgument
+    }
+  }
+}
diff --git a/lib/rules/syntaxes/slot-scope-attribute.js b/lib/rules/syntaxes/slot-scope-attribute.js
new file mode 100644
index 000000000..0182b387f
--- /dev/null
+++ b/lib/rules/syntaxes/slot-scope-attribute.js
@@ -0,0 +1,60 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+module.exports = {
+  deprecated: '2.6.0',
+  supported: '2.5.0',
+  createTemplateBodyVisitor (context, { fixToUpgrade } = {}) {
+    const sourceCode = context.getSourceCode()
+    /**
+     * 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 && slotAttr.value.value
+        ? `:${slotAttr.value.value}`
+        : ''
+      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
+    }
+    /**
+     * Reports `slot-scope` node
+     * @param {VAttribute} scopeAttr node of `slot-scope`
+     * @returns {void}
+     */
+    function reportSlotScope (scopeAttr) {
+      context.report({
+        node: scopeAttr.key,
+        messageId: 'forbiddenSlotScopeAttribute',
+        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')
+            return fixSlotToVSlot(fixer, slotAttr, scopeAttr)
+          }
+          : null
+      })
+    }
+
+    return {
+      "VAttribute[directive=true][key.name.name='slot-scope']": reportSlotScope
+    }
+  }
+}
diff --git a/lib/rules/syntaxes/v-bind-prop-modifier-shorthand.js b/lib/rules/syntaxes/v-bind-prop-modifier-shorthand.js
new file mode 100644
index 000000000..db5076cf2
--- /dev/null
+++ b/lib/rules/syntaxes/v-bind-prop-modifier-shorthand.js
@@ -0,0 +1,33 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+const { Range } = require('semver')
+const unsupported = new Range('<=2.5 || >=2.6.0')
+
+module.exports = {
+  // >=2.6.0-beta.1 <=2.6.0-beta.3
+  supported: (versionRange) => {
+    return !versionRange.intersects(unsupported)
+  },
+  createTemplateBodyVisitor (context) {
+    /**
+     * Reports `.prop` shorthand node
+     * @param {VDirectiveKey} bindPropKey node of `.prop` shorthand
+     * @returns {void}
+     */
+    function reportPropModifierShorthand (bindPropKey) {
+      context.report({
+        node: bindPropKey,
+        messageId: 'forbiddenVBindPropModifierShorthand',
+        // fix to use `:x.prop` (downgrade)
+        fix: fixer => fixer.replaceText(bindPropKey, `:${bindPropKey.argument.rawName}.prop`)
+      })
+    }
+
+    return {
+      "VAttribute[directive=true] > VDirectiveKey[name.name='bind'][name.rawName='.']": reportPropModifierShorthand
+    }
+  }
+}
diff --git a/lib/rules/syntaxes/v-slot.js b/lib/rules/syntaxes/v-slot.js
new file mode 100644
index 000000000..8f93df53f
--- /dev/null
+++ b/lib/rules/syntaxes/v-slot.js
@@ -0,0 +1,57 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+module.exports = {
+  supported: '2.6.0',
+  createTemplateBodyVisitor (context) {
+    const sourceCode = context.getSourceCode()
+    /**
+     * Convert to `slot` and `slot-scope`.
+     * @param {object} fixer fixer
+     * @param {VAttribute} vSlotAttr node of `v-slot`
+     * @returns {*} fix data
+     */
+    function fixVSlotToSlot (fixer, vSlotAttr) {
+      const key = vSlotAttr.key
+      if (key.modifiers.length) {
+        // unknown modifiers
+        return null
+      }
+      const name = key.argument ? key.argument.rawName : null
+      const scopedValueNode = vSlotAttr.value
+
+      const attrs = []
+      if (name) {
+        attrs.push(`slot="${name}"`)
+      }
+      if (scopedValueNode) {
+        attrs.push(
+          `slot-scope=${sourceCode.getText(scopedValueNode)}`
+        )
+      }
+      if (!attrs.length) {
+        attrs.push('slot') // useless
+      }
+      return fixer.replaceText(vSlotAttr, attrs.join(' '))
+    }
+    /**
+     * Reports `v-slot` node
+     * @param {VAttribute} vSlotAttr node of `v-slot`
+     * @returns {void}
+     */
+    function reportVSlot (vSlotAttr) {
+      context.report({
+        node: vSlotAttr.key,
+        messageId: 'forbiddenVSlot',
+        // fix to use `slot` (downgrade)
+        fix: fixer => fixVSlotToSlot(fixer, vSlotAttr)
+      })
+    }
+
+    return {
+      "VAttribute[directive=true][key.name.name='slot']": reportVSlot
+    }
+  }
+}
diff --git a/tests/lib/rules/no-unsupported-features.js b/tests/lib/rules/no-unsupported-features.js
new file mode 100644
index 000000000..1b87087c1
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features.js
@@ -0,0 +1,63 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+/**
+ * See to testcases in `./no-unsupported-features` directory for testcases of each features.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/no-unsupported-features')
+
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2019
+  }
+})
+
+tester.run('no-unsupported-features', rule, {
+  valid: [
+    {
+      code: `
+      <template>
+        <a
+          v-slot:name
+          :[href]="'/xxx'"
+        />
+      </template>`,
+      options: [{ version: '^2.6.0' }]
+    }
+  ],
+  invalid: [
+    {
+      code: `
+      <template>
+        <a
+          v-slot:name
+          :[href]="'/xxx'"
+        />
+      </template>`,
+      options: [{ version: '^2.5.0' }],
+      output: `
+      <template>
+        <a
+          slot="name"
+          :[href]="'/xxx'"
+        />
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        },
+        {
+          message: 'Dynamic arguments are not supported until Vue.js "2.6.0".',
+          line: 5
+        }
+      ]
+    }
+  ]
+})
+
diff --git a/tests/lib/rules/no-unsupported-features/dynamic-directive-arguments.js b/tests/lib/rules/no-unsupported-features/dynamic-directive-arguments.js
new file mode 100644
index 000000000..46c0725d5
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features/dynamic-directive-arguments.js
@@ -0,0 +1,86 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../../lib/rules/no-unsupported-features')
+const utils = require('./utils')
+
+const buildOptions = utils.optionsBuilder('dynamic-directive-arguments', '^2.5.0')
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2019
+  }
+})
+
+tester.run('no-unsupported-features/dynamic-directive-arguments', rule, {
+  valid: [
+    {
+      code: `
+      <template>
+        <a :[href]="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '^2.6.0' })
+    },
+    {
+      code: `
+      <template>
+        <a @[click]="onClick" />
+      </template>`,
+      options: buildOptions({ version: '^2.6.0' })
+    },
+    {
+      code: `
+      <template>
+        <a :href="'/xxx'" />
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <a @click="onClick" />
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <a :[href]="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '2.6.0-beta.2' })
+    }
+  ],
+  invalid: [
+    {
+      code: `
+      <template>
+        <a :[href]="'/xxx'" />
+      </template>`,
+      options: buildOptions(),
+      errors: [
+        {
+          message: 'Dynamic arguments are not supported until Vue.js "2.6.0".',
+          line: 3
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <a @[click]="onClick" />
+      </template>`,
+      options: buildOptions(),
+      errors: [
+        {
+          message: 'Dynamic arguments are not supported until Vue.js "2.6.0".',
+          line: 3
+        }
+      ]
+    }
+  ]
+})
+
diff --git a/tests/lib/rules/no-unsupported-features/slot-scope-attribute.js b/tests/lib/rules/no-unsupported-features/slot-scope-attribute.js
new file mode 100644
index 000000000..675eea30c
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features/slot-scope-attribute.js
@@ -0,0 +1,92 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../../lib/rules/no-unsupported-features')
+const utils = require('./utils')
+
+const buildOptions = utils.optionsBuilder('slot-scope-attribute', '^2.4.0')
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2019
+  }
+})
+
+tester.run('no-unsupported-features/slot-scope-attribute', rule, {
+  valid: [
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '^2.5.0' })
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot=name />
+        </LinkList>
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '^2.4.0', ignores: ['slot-scope-attribute'] })
+    }
+  ],
+  invalid: [
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot-scope />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: null,
+      errors: [
+        {
+          message: '`slot-scope` are not supported until Vue.js "2.5.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: null,
+      errors: [
+        {
+          message: '`slot-scope` are not supported until Vue.js "2.5.0".',
+          line: 4
+        }
+      ]
+    }
+  ]
+})
diff --git a/tests/lib/rules/no-unsupported-features/utils.js b/tests/lib/rules/no-unsupported-features/utils.js
new file mode 100644
index 000000000..9c94f062c
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features/utils.js
@@ -0,0 +1,38 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const rule = require('../../../../lib/rules/no-unsupported-features')
+
+const SYNTAXES = rule.meta.schema[0].properties.ignores.items.enum
+
+module.exports = {
+  SYNTAXES,
+  /**
+   * Define the options builder to exclude anything other than the given syntax.
+   * @param {string} targetSyntax syntax for given
+   * @param {string} defaultVersion default Vue.js version
+   * @returns {function} the options builder
+   */
+  optionsBuilder (targetSyntax, defaultVersion) {
+    const baseIgnores = SYNTAXES.filter(s => s !== targetSyntax)
+    return (option) => {
+      const ignores = [...baseIgnores]
+      let version = defaultVersion
+      if (!option) {
+        option = {}
+      }
+      if (option.ignores) {
+        ignores.push(...option.ignores)
+      }
+      if (option.version) {
+        version = option.version
+      }
+      option.ignores = ignores
+      option.version = version
+      return [option]
+    }
+  }
+}
diff --git a/tests/lib/rules/no-unsupported-features/v-bind-prop-modifier-shorthand.js b/tests/lib/rules/no-unsupported-features/v-bind-prop-modifier-shorthand.js
new file mode 100644
index 000000000..0dace1ac7
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features/v-bind-prop-modifier-shorthand.js
@@ -0,0 +1,87 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../../lib/rules/no-unsupported-features')
+const utils = require('./utils')
+
+const buildOptions = utils.optionsBuilder('v-bind-prop-modifier-shorthand', '^2.6.0')
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2019
+  }
+})
+
+tester.run('no-unsupported-features/v-bind-prop-modifier-shorthand', rule, {
+  valid: [
+    {
+      code: `
+      <template>
+        <a .href="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '2.6.0-beta.1' })
+    },
+    {
+      code: `
+      <template>
+        <a .href="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '2.6.0-beta.2' })
+    },
+    {
+      code: `
+      <template>
+        <a .href="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '2.6.0-beta.3' })
+    },
+    {
+      code: `
+      <template>
+        <a :href.prop="'/xxx'" />
+      </template>`,
+      options: buildOptions()
+    }
+  ],
+  invalid: [
+    {
+      code: `
+      <template>
+        <a .href="'/xxx'" />
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <a :href.prop="'/xxx'" />
+      </template>`,
+      errors: [
+        {
+          message: '`.prop` shorthand are not supported except Vue.js ">=2.6.0-beta.1 <=2.6.0-beta.3".',
+          line: 3
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <a .href="'/xxx'" />
+      </template>`,
+      options: buildOptions({ version: '2.5.99' }),
+      output: `
+      <template>
+        <a :href.prop="'/xxx'" />
+      </template>`,
+      errors: [
+        {
+          message: '`.prop` shorthand are not supported except Vue.js ">=2.6.0-beta.1 <=2.6.0-beta.3".',
+          line: 3
+        }
+      ]
+    }
+  ]
+})
+
diff --git a/tests/lib/rules/no-unsupported-features/v-slot.js b/tests/lib/rules/no-unsupported-features/v-slot.js
new file mode 100644
index 000000000..458f6efcb
--- /dev/null
+++ b/tests/lib/rules/no-unsupported-features/v-slot.js
@@ -0,0 +1,287 @@
+/**
+ * @author Yosuke Ota
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../../lib/rules/no-unsupported-features')
+const utils = require('./utils')
+
+const buildOptions = utils.optionsBuilder('v-slot', '^2.5.0')
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2019
+  }
+})
+
+tester.run('no-unsupported-features/v-slot', rule, {
+  valid: [
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '^2.6.0' })
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot=name />
+        </LinkList>
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions()
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '^2.5.0', ignores: ['v-slot'] })
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '>=2.0.0' })
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name />
+        </LinkList>
+      </template>`,
+      options: buildOptions({ version: '2.6.0-beta.2' })
+    }
+  ],
+  invalid: [
+
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a #default />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="default" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="name" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a #name />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="name" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a #default="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="default" slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="name" slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a #name="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="name" slot-scope="{a}" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    // syntax error
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot:name="{" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <a slot="name" slot-scope="{" />
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+
+    // unknown modifiers
+    {
+      code: `
+      <template>
+        <LinkList>
+          <a v-slot.mod="{a}" />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: null,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    }
+  ]
+})

From a4376eb94cfb68efd01ab00dde7e059a2acf02e1 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Tue, 2 Apr 2019 11:25:54 +0900
Subject: [PATCH 2/2] Change to autofix

---
 docs/rules/no-unsupported-features.md         |  1 +
 lib/rules/syntaxes/slot-scope-attribute.js    | 58 +++++++----
 lib/rules/syntaxes/v-slot.js                  | 36 ++++++-
 tests/lib/rules/no-unsupported-features.js    | 35 ++++---
 .../rules/no-unsupported-features/v-slot.js   | 99 ++++++++++++++-----
 5 files changed, 172 insertions(+), 57 deletions(-)

diff --git a/docs/rules/no-unsupported-features.md b/docs/rules/no-unsupported-features.md
index cef2c33d4..5bb39148f 100644
--- a/docs/rules/no-unsupported-features.md
+++ b/docs/rules/no-unsupported-features.md
@@ -74,6 +74,7 @@ The `"ignores"` option accepts an array of the following strings.
 - [Vue RFCs - 0001-new-slot-syntax](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0001-new-slot-syntax.md)
 - [Vue RFCs - 0002-slot-syntax-shorthand](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0002-slot-syntax-shorthand.md)
 - [Vue RFCs - 0003-dynamic-directive-arguments](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0003-dynamic-directive-arguments.md)
+- [Vue RFCs - v-bind .prop shorthand proposal](https://github.com/vuejs/rfcs/pull/18)
 
 ## :mag: Implementation
 
diff --git a/lib/rules/syntaxes/slot-scope-attribute.js b/lib/rules/syntaxes/slot-scope-attribute.js
index 0182b387f..8e8464170 100644
--- a/lib/rules/syntaxes/slot-scope-attribute.js
+++ b/lib/rules/syntaxes/slot-scope-attribute.js
@@ -8,29 +8,52 @@ module.exports = {
   supported: '2.5.0',
   createTemplateBodyVisitor (context, { fixToUpgrade } = {}) {
     const sourceCode = context.getSourceCode()
+
+    /**
+     * Checks whether the given node can convert to the `v-slot`.
+     * @param {VStartTag} startTag node of `<element v-slot ... >`
+     * @returns {boolean} `true` if the given node can convert to the `v-slot`
+     */
+    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 the element have `slot` it can not be converted.
+        // Conversion of `slot` is done with `vue/no-deprecated-slot-attribute`.
+        return false
+      }
+
+      const vBindSlotAttr = startTag.attributes
+        .find(attr =>
+          attr.directive === true &&
+          attr.key.name.name === 'bind' &&
+          attr.key.argument &&
+          attr.key.argument.name === 'slot')
+      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 && 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
@@ -44,10 +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')
-            return fixSlotToVSlot(fixer, slotAttr, scopeAttr)
+            const startTag = scopeAttr.parent
+            if (!canConvertToVSlot(startTag)) {
+              return null
+            }
+            return fixSlotScopeToVSlot(fixer, scopeAttr)
           }
           : null
       })
diff --git a/lib/rules/syntaxes/v-slot.js b/lib/rules/syntaxes/v-slot.js
index 8f93df53f..17b1018a1 100644
--- a/lib/rules/syntaxes/v-slot.js
+++ b/lib/rules/syntaxes/v-slot.js
@@ -7,6 +7,18 @@ module.exports = {
   supported: '2.6.0',
   createTemplateBodyVisitor (context) {
     const sourceCode = context.getSourceCode()
+
+    /**
+     * Checks whether the given node can convert to the `slot`.
+     * @param {VAttribute} vSlotAttr node of `v-slot`
+     * @returns {boolean} `true` if the given node can convert to the `slot`
+     */
+    function canConvertToSlot (vSlotAttr) {
+      if (vSlotAttr.parent.parent.name !== 'template') {
+        return false
+      }
+      return true
+    }
     /**
      * Convert to `slot` and `slot-scope`.
      * @param {object} fixer fixer
@@ -19,13 +31,22 @@ module.exports = {
         // unknown modifiers
         return null
       }
-      const name = key.argument ? key.argument.rawName : null
-      const scopedValueNode = vSlotAttr.value
 
       const attrs = []
-      if (name) {
-        attrs.push(`slot="${name}"`)
+      const argument = key.argument
+      if (argument) {
+        if (argument.type === 'VIdentifier') {
+          const name = argument.rawName
+          attrs.push(`slot="${name}"`)
+        } else if (argument.type === 'VExpressionContainer' && argument.expression) {
+          const expression = sourceCode.getText(argument.expression)
+          attrs.push(`:slot="${expression}"`)
+        } else {
+          // unknown or syntax error
+          return null
+        }
       }
+      const scopedValueNode = vSlotAttr.value
       if (scopedValueNode) {
         attrs.push(
           `slot-scope=${sourceCode.getText(scopedValueNode)}`
@@ -46,7 +67,12 @@ module.exports = {
         node: vSlotAttr.key,
         messageId: 'forbiddenVSlot',
         // fix to use `slot` (downgrade)
-        fix: fixer => fixVSlotToSlot(fixer, vSlotAttr)
+        fix: fixer => {
+          if (!canConvertToSlot(vSlotAttr)) {
+            return null
+          }
+          return fixVSlotToSlot(fixer, vSlotAttr)
+        }
       })
     }
 
diff --git a/tests/lib/rules/no-unsupported-features.js b/tests/lib/rules/no-unsupported-features.js
index 1b87087c1..ced993c05 100644
--- a/tests/lib/rules/no-unsupported-features.js
+++ b/tests/lib/rules/no-unsupported-features.js
@@ -22,10 +22,13 @@ tester.run('no-unsupported-features', rule, {
     {
       code: `
       <template>
-        <a
-          v-slot:name
-          :[href]="'/xxx'"
-        />
+        <VList>
+          <template v-slot:name>
+            <a
+              :[href]="'/xxx'"
+            />
+          </template>
+        </VList>
       </template>`,
       options: [{ version: '^2.6.0' }]
     }
@@ -34,18 +37,24 @@ tester.run('no-unsupported-features', rule, {
     {
       code: `
       <template>
-        <a
-          v-slot:name
-          :[href]="'/xxx'"
-        />
+        <VList>
+          <template v-slot:name>
+            <a
+              :[href]="'/xxx'"
+            />
+          </template>
+        </VList>
       </template>`,
       options: [{ version: '^2.5.0' }],
       output: `
       <template>
-        <a
-          slot="name"
-          :[href]="'/xxx'"
-        />
+        <VList>
+          <template slot="name">
+            <a
+              :[href]="'/xxx'"
+            />
+          </template>
+        </VList>
       </template>`,
       errors: [
         {
@@ -54,7 +63,7 @@ tester.run('no-unsupported-features', rule, {
         },
         {
           message: 'Dynamic arguments are not supported until Vue.js "2.6.0".',
-          line: 5
+          line: 6
         }
       ]
     }
diff --git a/tests/lib/rules/no-unsupported-features/v-slot.js b/tests/lib/rules/no-unsupported-features/v-slot.js
index 458f6efcb..fbde61e60 100644
--- a/tests/lib/rules/no-unsupported-features/v-slot.js
+++ b/tests/lib/rules/no-unsupported-features/v-slot.js
@@ -22,7 +22,7 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name />
+          <template v-slot:name ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions({ version: '^2.6.0' })
@@ -49,7 +49,7 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name />
+          <template v-slot:name ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions({ version: '^2.5.0', ignores: ['v-slot'] })
@@ -67,7 +67,7 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name />
+          <template v-slot:name ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions({ version: '2.6.0-beta.2' })
@@ -79,14 +79,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot />
+          <template v-slot ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot />
+          <template slot ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -100,14 +100,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a #default />
+          <template #default ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="default" />
+          <template slot="default" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -121,14 +121,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name />
+          <template v-slot:name ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="name" />
+          <template slot="name" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -142,14 +142,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a #name />
+          <template #name ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="name" />
+          <template slot="name" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -163,14 +163,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot="{a}" />
+          <template v-slot="{a}" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot-scope="{a}" />
+          <template slot-scope="{a}" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -184,14 +184,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a #default="{a}" />
+          <template #default="{a}" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="default" slot-scope="{a}" />
+          <template slot="default" slot-scope="{a}" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -205,14 +205,14 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name="{a}" />
+          <template v-slot:name="{a}" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="name" slot-scope="{a}" />
+          <template slot="name" slot-scope="{a}" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -226,14 +226,35 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a #name="{a}" />
+          <template #name="{a}" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="name" slot-scope="{a}" />
+          <template slot="name" slot-scope="{a}" ><a /></template>
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <template v-slot:[name]="{a}" ><a /></template>
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: `
+      <template>
+        <LinkList>
+          <template :slot="name" slot-scope="{a}" ><a /></template>
         </LinkList>
       </template>`,
       errors: [
@@ -248,16 +269,32 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot:name="{" />
+          <template v-slot:name="{" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
       output: `
       <template>
         <LinkList>
-          <a slot="name" slot-scope="{" />
+          <template slot="name" slot-scope="{" ><a /></template>
+        </LinkList>
+      </template>`,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 4
+        }
+      ]
+    },
+    {
+      code: `
+      <template>
+        <LinkList>
+          <template v-slot:[.]="{a}" ><a /></template>
         </LinkList>
       </template>`,
+      options: buildOptions(),
+      output: null,
       errors: [
         {
           message: '`v-slot` are not supported until Vue.js "2.6.0".',
@@ -271,7 +308,7 @@ tester.run('no-unsupported-features/v-slot', rule, {
       code: `
       <template>
         <LinkList>
-          <a v-slot.mod="{a}" />
+          <template v-slot.mod="{a}" ><a /></template>
         </LinkList>
       </template>`,
       options: buildOptions(),
@@ -282,6 +319,24 @@ tester.run('no-unsupported-features/v-slot', rule, {
           line: 4
         }
       ]
+    },
+
+    // cannot fix
+    {
+      code: `
+      <template>
+        <LinkList v-slot="{a}">
+          <a />
+        </LinkList>
+      </template>`,
+      options: buildOptions(),
+      output: null,
+      errors: [
+        {
+          message: '`v-slot` are not supported until Vue.js "2.6.0".',
+          line: 3
+        }
+      ]
     }
   ]
 })