⭐️New: Add vue/no-unsupported-features rule

Author: ota-meshi

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: |

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)

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'),

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)
+  }
+}

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
+    }
+  }
+}

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
+    }
+  }
+}

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
+    }
+  }
+}

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
+    }
+  }
+}

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
+        }
+      ]
+    }
+  ]
+})
+

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
+        }
+      ]
+    }
+  ]
+})
+

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
+        }
+      ]
+    }
+  ]
+})

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]
+    }
+  }
+}

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
+        }
+      ]
+    }
+  ]
+})
+

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
+        }
+      ]
+    }
+  ]
+})