From b9def18b3199ba34f68cb55ce838b8d05c272fcb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sat, 25 Jan 2020 00:48:10 +0100
Subject: [PATCH 1/6] feat(RFC0005): allow v-model argument when v-model is
 used on custom component

---
 docs/rules/valid-v-model.md      | 3 ++-
 lib/rules/valid-v-model.js       | 2 +-
 tests/lib/rules/valid-v-model.js | 4 ++++
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/docs/rules/valid-v-model.md b/docs/rules/valid-v-model.md
index 0aa8a7531..61fb5ce55 100644
--- a/docs/rules/valid-v-model.md
+++ b/docs/rules/valid-v-model.md
@@ -15,7 +15,7 @@ This rule checks whether every `v-model` directive is valid.
 
 This rule reports `v-model` directives in the following cases:
 
-- The directive has that argument. E.g. `<input v-model:aaa="foo">`
+- The directive used on HTMLElement has an argument. E.g. `<input v-model:aaa="foo">`
 - The directive has the modifiers which are not supported. E.g. `<input v-model.bbb="foo">`
 - The directive does not have that attribute value. E.g. `<input v-model>`
 - The directive does not have the attribute value which is valid as LHS. E.g. `<input v-model="foo() + bar()">`
@@ -32,6 +32,7 @@ This rule reports `v-model` directives in the following cases:
   <input v-model.lazy="foo">
   <textarea v-model="foo"/>
   <MyComponent v-model="foo"/>
+  <MyComponent v-model:propName="foo"/>
   <div v-for="todo in todos">
     <input v-model="todo.name">
   </div>
diff --git a/lib/rules/valid-v-model.js b/lib/rules/valid-v-model.js
index d969f2c0e..32fc696d6 100644
--- a/lib/rules/valid-v-model.js
+++ b/lib/rules/valid-v-model.js
@@ -112,7 +112,7 @@ module.exports = {
           })
         }
 
-        if (node.key.argument) {
+        if (node.key.argument && !utils.isCustomComponent(element)) {
           context.report({
             node,
             loc: node.loc,
diff --git a/tests/lib/rules/valid-v-model.js b/tests/lib/rules/valid-v-model.js
index f267ad455..e800e60e7 100644
--- a/tests/lib/rules/valid-v-model.js
+++ b/tests/lib/rules/valid-v-model.js
@@ -114,6 +114,10 @@ tester.run('valid-v-model', rule, {
     {
       filename: 'test.vue',
       code: '<template><input v-bind:type="a" v-model="b"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:aaa="a"></MyComponent></template>'
     }
   ],
   invalid: [

From efe4a584357c1b3666b56d7c4ffabd11f592e106 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sat, 25 Jan 2020 01:27:12 +0100
Subject: [PATCH 2/6] feat(RFC0005): add no-v-model-argument rule which
 disallows v-model arguments.

Vue 2 compatibility rule
---
 docs/rules/README.md                   |  1 +
 docs/rules/no-v-model-argument.md      | 49 ++++++++++++++++++++++++++
 lib/configs/essential.js               |  1 +
 lib/index.js                           |  1 +
 lib/rules/no-v-model-argument.js       | 47 ++++++++++++++++++++++++
 tests/lib/rules/no-v-model-argument.js | 44 +++++++++++++++++++++++
 6 files changed, 143 insertions(+)
 create mode 100644 docs/rules/no-v-model-argument.md
 create mode 100644 lib/rules/no-v-model-argument.js
 create mode 100644 tests/lib/rules/no-v-model-argument.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 30c0f93d1..2c4bcb124 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -50,6 +50,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-unused-components](./no-unused-components.md) | disallow registering components that are not used inside templates |  |
 | [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |  |
 | [vue/no-use-v-if-with-v-for](./no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |  |
+| [vue/no-v-model-argument](./no-v-model-argument.md) | disallow adding an argument to `v-model` used in custom component |  |
 | [vue/require-component-is](./require-component-is.md) | require `v-bind:is` of `<component>` elements |  |
 | [vue/require-prop-type-constructor](./require-prop-type-constructor.md) | require prop type to be a constructor | :wrench: |
 | [vue/require-render-return](./require-render-return.md) | enforce render function to always return value |  |
diff --git a/docs/rules/no-v-model-argument.md b/docs/rules/no-v-model-argument.md
new file mode 100644
index 000000000..f67b3a3b6
--- /dev/null
+++ b/docs/rules/no-v-model-argument.md
@@ -0,0 +1,49 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-v-model-argument
+description: disallow adding an argument to `v-model` used in custom component
+---
+# vue/no-v-model-argument
+> disallow adding an argument to `v-model` used in custom component
+
+- :gear: This rule is included in all of `"plugin:vue/essential"`, `"plugin:vue/strongly-recommended"` and `"plugin:vue/recommended"`.
+
+This rule checks whether `v-model` used on custom component do not have an argument.
+
+## :book: Rule Details
+
+This rule reports `v-model` directives in the following cases:
+
+- The directive used on component has an argument. E.g. `<MyComponent v-model:aaa="foo" />`
+
+<eslint-code-block :rules="{'vue/no-v-model-argument': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <MyComponent v-model="foo" />
+
+
+  <!-- ✗ BAD -->
+  <MyComponent v-model:aaa="foo" />
+</template>
+```
+
+</eslint-code-block>
+
+
+## :wrench: Options
+
+Nothing.
+
+## :couple: Related rules
+
+- [valid-v-model]
+
+[valid-v-model]: valid-v-model.md
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-v-model-argument.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-v-model-argument.js)
diff --git a/lib/configs/essential.js b/lib/configs/essential.js
index a335310fe..ffbd01075 100644
--- a/lib/configs/essential.js
+++ b/lib/configs/essential.js
@@ -18,6 +18,7 @@ module.exports = {
     'vue/no-unused-components': 'error',
     'vue/no-unused-vars': 'error',
     'vue/no-use-v-if-with-v-for': 'error',
+    'vue/no-v-model-argument': 'error',
     'vue/require-component-is': 'error',
     'vue/require-prop-type-constructor': 'error',
     'vue/require-render-return': 'error',
diff --git a/lib/index.js b/lib/index.js
index d1b9bd9ef..160f431e0 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -63,6 +63,7 @@ module.exports = {
     'no-unused-vars': require('./rules/no-unused-vars'),
     'no-use-v-if-with-v-for': require('./rules/no-use-v-if-with-v-for'),
     'no-v-html': require('./rules/no-v-html'),
+    'no-v-model-argument': require('./rules/no-v-model-argument'),
     'object-curly-spacing': require('./rules/object-curly-spacing'),
     'order-in-components': require('./rules/order-in-components'),
     'prop-name-casing': require('./rules/prop-name-casing'),
diff --git a/lib/rules/no-v-model-argument.js b/lib/rules/no-v-model-argument.js
new file mode 100644
index 000000000..85b149ea6
--- /dev/null
+++ b/lib/rules/no-v-model-argument.js
@@ -0,0 +1,47 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview This rule checks whether v-model used on custom component do not have an argument
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow adding an argument to `v-model` used in custom component',
+      category: 'essential',
+      url: 'https://eslint.vuejs.org/rules/no-v-model-argument.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      vModelRequireNoArgument: "'v-model' directives require no argument."
+    }
+  },
+
+  create (context) {
+    return utils.defineTemplateBodyVisitor(context, {
+      "VAttribute[directive=true][key.name.name='model']" (node) {
+        const element = node.parent.parent
+
+        if (node.key.argument && utils.isCustomComponent(element)) {
+          context.report({
+            node,
+            loc: node.loc,
+            messageId: 'vModelRequireNoArgument'
+          })
+        }
+      }
+    })
+  }
+}
diff --git a/tests/lib/rules/no-v-model-argument.js b/tests/lib/rules/no-v-model-argument.js
new file mode 100644
index 000000000..5cf5c5952
--- /dev/null
+++ b/tests/lib/rules/no-v-model-argument.js
@@ -0,0 +1,44 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview This rule checks whether v-model used on custom component do not have an argument
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const rule = require('../../../lib/rules/no-v-model-argument')
+const RuleTester = require('eslint').RuleTester
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const ruleTester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: { ecmaVersion: 2015 }
+})
+
+ruleTester.run('no-v-model-argument', rule, {
+
+  valid: [
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model="bar"></MyComponent></template>'
+    }
+  ],
+
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:foo="bar"></MyComponent></template>',
+      errors: ["'v-model' directives require no argument."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:foo.trim="bar"></MyComponent></template>',
+      errors: ["'v-model' directives require no argument."]
+    }
+  ]
+})

From 7fcd2eb2b3736bb84119dc4cdca1c4dd6421c238 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sat, 25 Jan 2020 19:34:04 +0100
Subject: [PATCH 3/6] feat(RFC0005): add no-deprecated-v-bind-sync rule

---
 docs/rules/README.md                         |   1 +
 docs/rules/no-deprecated-v-bind-sync.md      |  49 ++++++++
 docs/rules/valid-v-bind.md                   |   8 ++
 lib/index.js                                 |   1 +
 lib/rules/no-deprecated-v-bind-sync.js       |  44 ++++++++
 tests/lib/rules/no-deprecated-v-bind-sync.js | 113 +++++++++++++++++++
 6 files changed, 216 insertions(+)
 create mode 100644 docs/rules/no-deprecated-v-bind-sync.md
 create mode 100644 lib/rules/no-deprecated-v-bind-sync.js
 create mode 100644 tests/lib/rules/no-deprecated-v-bind-sync.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 2c4bcb124..7c225d373 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -159,6 +159,7 @@ For example:
 | [vue/no-deprecated-scope-attribute](./no-deprecated-scope-attribute.md) | disallow deprecated `scope` attribute (in Vue.js 2.5.0+) | :wrench: |
 | [vue/no-deprecated-slot-attribute](./no-deprecated-slot-attribute.md) | disallow deprecated `slot` attribute (in Vue.js 2.6.0+) | :wrench: |
 | [vue/no-deprecated-slot-scope-attribute](./no-deprecated-slot-scope-attribute.md) | disallow deprecated `slot-scope` attribute (in Vue.js 2.6.0+) | :wrench: |
+| [vue/no-deprecated-v-bind-sync](./no-deprecated-v-bind-sync.md) | disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+) | :wrench: |
 | [vue/no-empty-pattern](./no-empty-pattern.md) | disallow empty destructuring patterns |  |
 | [vue/no-irregular-whitespace](./no-irregular-whitespace.md) | disallow irregular whitespace |  |
 | [vue/no-reserved-component-names](./no-reserved-component-names.md) | disallow the use of reserved names in component definitions |  |
diff --git a/docs/rules/no-deprecated-v-bind-sync.md b/docs/rules/no-deprecated-v-bind-sync.md
new file mode 100644
index 000000000..b400ef173
--- /dev/null
+++ b/docs/rules/no-deprecated-v-bind-sync.md
@@ -0,0 +1,49 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-deprecated-v-bind-sync
+description: disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
+---
+# vue/no-deprecated-v-bind-sync
+> disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
+
+## :book: Rule Details
+
+This rule reports use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
+
+<eslint-code-block :rules="{'vue/no-deprecated-v-bind-sync': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <MyComponent v-bind:propName="foo"/>
+  <MyComponent :propName="foo"/>
+
+
+  <!-- ✗ BAD -->
+  <MyComponent v-bind:propName.sync="foo"/>
+  <MyComponent v-bind.sync="foo"/>
+  <MyComponent :propName.sync="foo"/>
+</template>
+```
+
+</eslint-code-block>
+
+## :wrench: Options
+
+Nothing.
+
+## :couple: Related rules
+
+- [valid-v-bind]
+
+[valid-v-bind]: valid-v-bind.md
+
+## :books: Further reading
+
+- [RFC: Replace v-bind.sync with v-model argument](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0005-replace-v-bind-sync-with-v-model-argument.md)
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-deprecated-v-bind-sync.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-deprecated-v-bind-sync.js)
diff --git a/docs/rules/valid-v-bind.md b/docs/rules/valid-v-bind.md
index 30d096e42..03c550f44 100644
--- a/docs/rules/valid-v-bind.md
+++ b/docs/rules/valid-v-bind.md
@@ -54,6 +54,14 @@ Nothing.
 
 [no-parsing-error]: no-parsing-error.md
 
+- [no-deprecated-v-bind-sync]
+
+[no-deprecated-v-bind-sync]: no-deprecated-v-bind-sync.md
+
+- [valid-v-bind-sync]
+
+[valid-v-bind-sync]: valid-v-bind-sync.md
+
 ## :mag: Implementation
 
 - [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/valid-v-bind.js)
diff --git a/lib/index.js b/lib/index.js
index 160f431e0..fd348ad15 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -42,6 +42,7 @@ module.exports = {
     'no-deprecated-scope-attribute': require('./rules/no-deprecated-scope-attribute'),
     'no-deprecated-slot-attribute': require('./rules/no-deprecated-slot-attribute'),
     'no-deprecated-slot-scope-attribute': require('./rules/no-deprecated-slot-scope-attribute'),
+    'no-deprecated-v-bind-sync': require('./rules/no-deprecated-v-bind-sync'),
     'no-dupe-keys': require('./rules/no-dupe-keys'),
     'no-duplicate-attributes': require('./rules/no-duplicate-attributes'),
     'no-empty-pattern': require('./rules/no-empty-pattern'),
diff --git a/lib/rules/no-deprecated-v-bind-sync.js b/lib/rules/no-deprecated-v-bind-sync.js
new file mode 100644
index 000000000..075798e7c
--- /dev/null
+++ b/lib/rules/no-deprecated-v-bind-sync.js
@@ -0,0 +1,44 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview Disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)',
+      category: undefined,
+      url: 'https://eslint.vuejs.org/rules/no-deprecated-v-bind-sync.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      syncModifierIsDeprecated: "'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."
+    }
+  },
+  create (context) {
+    return utils.defineTemplateBodyVisitor(context, {
+      "VAttribute[directive=true][key.name.name='bind']" (node) {
+        if (node.key.modifiers.map(mod => mod.name).includes('sync')) {
+          context.report({
+            node,
+            loc: node.loc,
+            messageId: 'syncModifierIsDeprecated'
+          })
+        }
+      }
+    })
+  }
+}
diff --git a/tests/lib/rules/no-deprecated-v-bind-sync.js b/tests/lib/rules/no-deprecated-v-bind-sync.js
new file mode 100644
index 000000000..1698623c0
--- /dev/null
+++ b/tests/lib/rules/no-deprecated-v-bind-sync.js
@@ -0,0 +1,113 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview Disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const rule = require('../../../lib/rules/no-deprecated-v-bind-sync')
+const RuleTester = require('eslint').RuleTester
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const ruleTester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: { ecmaVersion: 2015 }
+})
+
+ruleTester.run('no-deprecated-v-bind-sync', rule, {
+
+  valid: [
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent v-bind:foo='bar'/></template>"
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent :foo='bar'/></template>"
+    }
+  ],
+
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent v-bind:foo.sync='bar'/></template>",
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent :foo.sync='bar'/></template>",
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent v-bind.sync='bar'/></template>",
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync.unknown="foo" /></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="x.foo" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x - 1]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`${x}`]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`prefix_${x}`]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x ? x : \'_\']" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x || \'_\']" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x()]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[/r/.match(x) ? 0 : 1]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[typeof x]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[tag`${x}`]" /></div></div></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    }
+  ]
+})

From 7e4ebde54cfaa601e9d433ed15dd98b5f7b36b3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sat, 25 Jan 2020 20:46:29 +0100
Subject: [PATCH 4/6] feat(RFC0005): provide autofix fix for deprecated
 v-bind.prop.sync modifier

---
 docs/rules/no-deprecated-v-bind-sync.md      |  5 ++-
 lib/rules/no-deprecated-v-bind-sync.js       | 14 ++++++-
 tests/lib/rules/no-deprecated-v-bind-sync.js | 41 ++++++++++++++++++++
 3 files changed, 57 insertions(+), 3 deletions(-)

diff --git a/docs/rules/no-deprecated-v-bind-sync.md b/docs/rules/no-deprecated-v-bind-sync.md
index b400ef173..056b10a91 100644
--- a/docs/rules/no-deprecated-v-bind-sync.md
+++ b/docs/rules/no-deprecated-v-bind-sync.md
@@ -7,11 +7,13 @@ description: disallow use of deprecated `.sync` modifier on `v-bind` directive (
 # vue/no-deprecated-v-bind-sync
 > disallow use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
 
+- :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 use of deprecated `.sync` modifier on `v-bind` directive (in Vue.js 3.0.0+)
 
-<eslint-code-block :rules="{'vue/no-deprecated-v-bind-sync': ['error']}">
+<eslint-code-block fix :rules="{'vue/no-deprecated-v-bind-sync': ['error']}">
 
 ```vue
 <template>
@@ -22,6 +24,7 @@ This rule reports use of deprecated `.sync` modifier on `v-bind` directive (in V
 
   <!-- ✗ BAD -->
   <MyComponent v-bind:propName.sync="foo"/>
+  <MyComponent v-bind:[dynamiArg].sync="foo"/>
   <MyComponent v-bind.sync="foo"/>
   <MyComponent :propName.sync="foo"/>
 </template>
diff --git a/lib/rules/no-deprecated-v-bind-sync.js b/lib/rules/no-deprecated-v-bind-sync.js
index 075798e7c..240e3b0b3 100644
--- a/lib/rules/no-deprecated-v-bind-sync.js
+++ b/lib/rules/no-deprecated-v-bind-sync.js
@@ -22,7 +22,7 @@ module.exports = {
       category: undefined,
       url: 'https://eslint.vuejs.org/rules/no-deprecated-v-bind-sync.html'
     },
-    fixable: null,
+    fixable: 'code',
     schema: [],
     messages: {
       syncModifierIsDeprecated: "'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."
@@ -35,7 +35,17 @@ module.exports = {
           context.report({
             node,
             loc: node.loc,
-            messageId: 'syncModifierIsDeprecated'
+            messageId: 'syncModifierIsDeprecated',
+            fix: (fixer) => {
+              const isUsingSpreadSyntax = node.key.argument == null
+              const hasMultipleModifiers = node.key.modifiers.length > 1
+              if (isUsingSpreadSyntax || hasMultipleModifiers) {
+                return
+              }
+
+              const bindArgument = context.getSourceCode().getText(node.key.argument)
+              return fixer.replaceText(node.key, `v-model:${bindArgument}`)
+            }
           })
         }
       }
diff --git a/tests/lib/rules/no-deprecated-v-bind-sync.js b/tests/lib/rules/no-deprecated-v-bind-sync.js
index 1698623c0..6cf900265 100644
--- a/tests/lib/rules/no-deprecated-v-bind-sync.js
+++ b/tests/lib/rules/no-deprecated-v-bind-sync.js
@@ -30,6 +30,14 @@ ruleTester.run('no-deprecated-v-bind-sync', rule, {
     {
       filename: 'test.vue',
       code: "<template><MyComponent :foo='bar'/></template>"
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent v-bind:[dynamicArg]='bar'/></template>"
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent :[dynamicArg]='bar'/></template>"
     }
   ],
 
@@ -37,76 +45,109 @@ ruleTester.run('no-deprecated-v-bind-sync', rule, {
     {
       filename: 'test.vue',
       code: "<template><MyComponent v-bind:foo.sync='bar'/></template>",
+      output: "<template><MyComponent v-model:foo='bar'/></template>",
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: "<template><MyComponent :foo.sync='bar'/></template>",
+      output: "<template><MyComponent v-model:foo='bar'/></template>",
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent v-bind:[dynamicArg].sync='bar'/></template>",
+      output: "<template><MyComponent v-model:[dynamicArg]='bar'/></template>",
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: "<template><MyComponent :[dynamicArg].sync='bar'/></template>",
+      output: "<template><MyComponent v-model:[dynamicArg]='bar'/></template>",
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: "<template><MyComponent v-bind.sync='bar'/></template>",
+      output: "<template><MyComponent v-bind.sync='bar'/></template>",
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><MyComponent :foo.sync.unknown="foo" /></template>',
+      output: '<template><MyComponent :foo.sync.unknown="foo" /></template>',
+      errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :[dynamicArg].sync.unknown="foo" /></template>',
+      output: '<template><MyComponent :[dynamicArg].sync.unknown="foo" /></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="x.foo" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="x.foo" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[x]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x - 1]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[x - 1]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`${x}`]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[`${x}`]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`prefix_${x}`]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[`prefix_${x}`]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x ? x : \'_\']" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[x ? x : \'_\']" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x || \'_\']" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[x || \'_\']" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x()]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[x()]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[/r/.match(x) ? 0 : 1]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[/r/.match(x) ? 0 : 1]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[typeof x]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[typeof x]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[tag`${x}`]" /></div></div></template>',
+      output: '<template><div><div v-for="x in list"><MyComponent v-model:foo="foo[tag`${x}`]" /></div></div></template>',
       errors: ["'.sync' modifier on 'v-bind' directive is deprecated. Use 'v-model:propName' instead."]
     }
   ]

From 93a1ace7141dbbad350a053b07b5722f91ab5abd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sun, 26 Jan 2020 11:50:45 +0100
Subject: [PATCH 5/6] feat(RFC0011): add support for custom modifiers in
 valid-v-model used on Vue component

---
 docs/rules/valid-v-model.md      |  4 +++-
 lib/rules/valid-v-model.js       | 27 +++++++++++++++------------
 tests/lib/rules/valid-v-model.js | 16 ++++++++++++++++
 3 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/docs/rules/valid-v-model.md b/docs/rules/valid-v-model.md
index 61fb5ce55..934b5edff 100644
--- a/docs/rules/valid-v-model.md
+++ b/docs/rules/valid-v-model.md
@@ -16,7 +16,7 @@ This rule checks whether every `v-model` directive is valid.
 This rule reports `v-model` directives in the following cases:
 
 - The directive used on HTMLElement has an argument. E.g. `<input v-model:aaa="foo">`
-- The directive has the modifiers which are not supported. E.g. `<input v-model.bbb="foo">`
+- The directive used on HTMLElement has modifiers which are not supported. E.g. `<input v-model.bbb="foo">`
 - The directive does not have that attribute value. E.g. `<input v-model>`
 - The directive does not have the attribute value which is valid as LHS. E.g. `<input v-model="foo() + bar()">`
 - The directive is on unsupported elements. E.g. `<div v-model="foo"></div>`
@@ -33,6 +33,8 @@ This rule reports `v-model` directives in the following cases:
   <textarea v-model="foo"/>
   <MyComponent v-model="foo"/>
   <MyComponent v-model:propName="foo"/>
+  <MyComponent v-model.modifier="foo"/>
+  <MyComponent v-model:propName.modifier="foo"/>
   <div v-for="todo in todos">
     <input v-model="todo.name">
   </div>
diff --git a/lib/rules/valid-v-model.js b/lib/rules/valid-v-model.js
index 32fc696d6..69b358906 100644
--- a/lib/rules/valid-v-model.js
+++ b/lib/rules/valid-v-model.js
@@ -112,24 +112,27 @@ module.exports = {
           })
         }
 
-        if (node.key.argument && !utils.isCustomComponent(element)) {
-          context.report({
-            node,
-            loc: node.loc,
-            message: "'v-model' directives require no argument."
-          })
-        }
-
-        for (const modifier of node.key.modifiers) {
-          if (!VALID_MODIFIERS.has(modifier.name)) {
+        if (!utils.isCustomComponent(element)) {
+          if (node.key.argument) {
             context.report({
               node,
               loc: node.loc,
-              message: "'v-model' directives don't support the modifier '{{name}}'.",
-              data: { name: modifier.name }
+              message: "'v-model' directives require no argument."
             })
           }
+
+          for (const modifier of node.key.modifiers) {
+            if (!VALID_MODIFIERS.has(modifier.name)) {
+              context.report({
+                node,
+                loc: node.loc,
+                message: "'v-model' directives don't support the modifier '{{name}}'.",
+                data: { name: modifier.name }
+              })
+            }
+          }
         }
+
         if (!utils.hasAttributeValue(node)) {
           context.report({
             node,
diff --git a/tests/lib/rules/valid-v-model.js b/tests/lib/rules/valid-v-model.js
index e800e60e7..9b2d19cc6 100644
--- a/tests/lib/rules/valid-v-model.js
+++ b/tests/lib/rules/valid-v-model.js
@@ -118,6 +118,22 @@ tester.run('valid-v-model', rule, {
     {
       filename: 'test.vue',
       code: '<template><MyComponent v-model:aaa="a"></MyComponent></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:aaa.modifier="a"></MyComponent></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.modifier="a"></MyComponent></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:aaa.modifier.modifierTwo="a"></MyComponent></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.modifier.modifierTwo="a"></MyComponent></template>'
     }
   ],
   invalid: [

From 009ff3ece265addbc529d0b2d11e72ad11c871bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Przemys=C5=82aw=20Fa=C5=82owski?= <przemkow92@gmail.com>
Date: Sun, 26 Jan 2020 14:23:24 +0100
Subject: [PATCH 6/6] feat(RFC0011): add vue/no-custom-modifiers-on-v-model
 rule which checks if v-model has not allowed modifiers (Vue 2 backward
 compatibility)

---
 docs/rules/README.md                          |  1 +
 docs/rules/no-custom-modifiers-on-v-model.md  | 53 ++++++++++++++
 lib/configs/essential.js                      |  1 +
 lib/index.js                                  |  1 +
 lib/rules/no-custom-modifiers-on-v-model.js   | 57 +++++++++++++++
 .../rules/no-custom-modifiers-on-v-model.js   | 72 +++++++++++++++++++
 6 files changed, 185 insertions(+)
 create mode 100644 docs/rules/no-custom-modifiers-on-v-model.md
 create mode 100644 lib/rules/no-custom-modifiers-on-v-model.js
 create mode 100644 tests/lib/rules/no-custom-modifiers-on-v-model.js

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 7c225d373..8f7d9e9be 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -39,6 +39,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [vue/no-async-in-computed-properties](./no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |  |
+| [vue/no-custom-modifiers-on-v-model](./no-custom-modifiers-on-v-model.md) | disallow custom modifiers on v-model used on the component |  |
 | [vue/no-dupe-keys](./no-dupe-keys.md) | disallow duplication of field names |  |
 | [vue/no-duplicate-attributes](./no-duplicate-attributes.md) | disallow duplication of attributes |  |
 | [vue/no-parsing-error](./no-parsing-error.md) | disallow parsing errors in `<template>` |  |
diff --git a/docs/rules/no-custom-modifiers-on-v-model.md b/docs/rules/no-custom-modifiers-on-v-model.md
new file mode 100644
index 000000000..f204294b0
--- /dev/null
+++ b/docs/rules/no-custom-modifiers-on-v-model.md
@@ -0,0 +1,53 @@
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/no-custom-modifiers-on-v-model
+description: disallow custom modifiers on v-model used on the component
+---
+# vue/no-custom-modifiers-on-v-model
+> disallow custom modifiers on v-model used on the component
+
+- :gear: This rule is included in all of `"plugin:vue/essential"`, `"plugin:vue/strongly-recommended"` and `"plugin:vue/recommended"`.
+
+This rule checks whether `v-model `used on the component do not have custom modifiers.
+
+## Rule Details
+
+This rule reports `v-model` directives in the following cases:
+
+- The directive used on the component has custom modifiers. E.g. `<MyComponent v-model.aaa="foo" />`
+
+<eslint-code-block :rules="{'vue/no-custom-modifiers-on-v-model': ['error']}">
+
+```vue
+<template>
+  <!-- ✓ GOOD -->
+  <MyComponent v-model="foo" />
+  <MyComponent v-model.trim="foo" />
+  <MyComponent v-model.lazy="foo" />
+  <MyComponent v-model.number="foo" />
+
+
+  <!-- ✗ BAD -->
+  <MyComponent v-model.aaa="foo" />
+  <MyComponent v-model.aaa.bbb="foo" />
+
+</template>
+```
+
+</eslint-code-block>
+
+### Options
+
+Nothing.
+
+## :couple: Related rules
+
+- [valid-v-model]
+
+[valid-v-model]: valid-v-model.md
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/no-custom-modifiers-on-v-model.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/no-custom-modifiers-on-v-model.js)
diff --git a/lib/configs/essential.js b/lib/configs/essential.js
index ffbd01075..22d50a65d 100644
--- a/lib/configs/essential.js
+++ b/lib/configs/essential.js
@@ -7,6 +7,7 @@ module.exports = {
   extends: require.resolve('./base'),
   rules: {
     'vue/no-async-in-computed-properties': 'error',
+    'vue/no-custom-modifiers-on-v-model': 'error',
     'vue/no-dupe-keys': 'error',
     'vue/no-duplicate-attributes': 'error',
     'vue/no-parsing-error': 'error',
diff --git a/lib/index.js b/lib/index.js
index fd348ad15..524c74d7e 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -39,6 +39,7 @@ module.exports = {
     'no-async-in-computed-properties': require('./rules/no-async-in-computed-properties'),
     'no-boolean-default': require('./rules/no-boolean-default'),
     'no-confusing-v-for-v-if': require('./rules/no-confusing-v-for-v-if'),
+    'no-custom-modifiers-on-v-model': require('./rules/no-custom-modifiers-on-v-model'),
     'no-deprecated-scope-attribute': require('./rules/no-deprecated-scope-attribute'),
     'no-deprecated-slot-attribute': require('./rules/no-deprecated-slot-attribute'),
     'no-deprecated-slot-scope-attribute': require('./rules/no-deprecated-slot-scope-attribute'),
diff --git a/lib/rules/no-custom-modifiers-on-v-model.js b/lib/rules/no-custom-modifiers-on-v-model.js
new file mode 100644
index 000000000..0d4305afe
--- /dev/null
+++ b/lib/rules/no-custom-modifiers-on-v-model.js
@@ -0,0 +1,57 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview This rule checks whether v-model used on the component do not have custom modifiers
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+const VALID_MODIFIERS = new Set(['lazy', 'number', 'trim'])
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    type: 'problem',
+    docs: {
+      description: 'disallow custom modifiers on v-model used on the component',
+      category: 'essential',
+      url: 'https://eslint.vuejs.org/rules/no-custom-modifiers-on-v-model.html'
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      notSupportedModifier: "'v-model' directives don't support the modifier '{{name}}'."
+    }
+  },
+  create (context) {
+    return utils.defineTemplateBodyVisitor(context, {
+      "VAttribute[directive=true][key.name.name='model']" (node) {
+        const element = node.parent.parent
+
+        if (utils.isCustomComponent(element)) {
+          for (const modifier of node.key.modifiers) {
+            if (!VALID_MODIFIERS.has(modifier.name)) {
+              context.report({
+                node,
+                loc: node.loc,
+                messageId: 'notSupportedModifier',
+                data: { name: modifier.name }
+              })
+            }
+          }
+        }
+      }
+    })
+  }
+}
diff --git a/tests/lib/rules/no-custom-modifiers-on-v-model.js b/tests/lib/rules/no-custom-modifiers-on-v-model.js
new file mode 100644
index 000000000..ad80cdb77
--- /dev/null
+++ b/tests/lib/rules/no-custom-modifiers-on-v-model.js
@@ -0,0 +1,72 @@
+/**
+ * @author Przemyslaw Falowski (@przemkow)
+ * @fileoverview This rule checks whether v-model used on the component do not have custom modifiers
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const rule = require('../../../lib/rules/no-custom-modifiers-on-v-model')
+const RuleTester = require('eslint').RuleTester
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const ruleTester = new RuleTester({
+  parser: require.resolve('vue-eslint-parser'),
+  parserOptions: { ecmaVersion: 2015 }
+})
+
+ruleTester.run('no-custom-modifiers-on-v-model', rule, {
+
+  valid: [
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:propName="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:propName.trim="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.trim="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:propName.lazy="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.lazy="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:propName.number="foo"></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.number="foo"></template>'
+    }
+  ],
+
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model:propName.aaa="foo"></template>',
+      errors: ["'v-model' directives don't support the modifier 'aaa'."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-model.aaa="foo"></template>',
+      errors: ["'v-model' directives don't support the modifier 'aaa'."]
+    }
+  ]
+})