From e23f506af23f4a6cb03caf70c306c48e96c97b01 Mon Sep 17 00:00:00 2001
From: ota <y.ohta.z3@future.co.jp>
Date: Mon, 12 Nov 2018 15:41:24 +0900
Subject: [PATCH 01/14] New: Add `vue/valid-v-bind-sync` rule

---
 README.md                            |   1 +
 docs/rules/valid-v-bind-sync.md      |  48 ++++++
 lib/index.js                         |   1 +
 lib/rules/valid-v-bind-sync.js       | 131 ++++++++++++++++
 lib/utils/index.js                   |  11 ++
 lib/utils/svg-elements.json          |   1 +
 tests/lib/rules/valid-v-bind-sync.js | 225 +++++++++++++++++++++++++++
 7 files changed, 418 insertions(+)
 create mode 100644 docs/rules/valid-v-bind-sync.md
 create mode 100644 lib/rules/valid-v-bind-sync.js
 create mode 100644 lib/utils/svg-elements.json
 create mode 100644 tests/lib/rules/valid-v-bind-sync.js

diff --git a/README.md b/README.md
index 3e1e0ef95..b0bace4e5 100644
--- a/README.md
+++ b/README.md
@@ -237,6 +237,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | :wrench: | [vue/no-spaces-around-equal-signs-in-attribute](./docs/rules/no-spaces-around-equal-signs-in-attribute.md) | disallow spaces around equal signs in attribute |
 | :wrench: | [vue/script-indent](./docs/rules/script-indent.md) | enforce consistent indentation in `<script>` |
 | :wrench: | [vue/singleline-html-element-content-newline](./docs/rules/singleline-html-element-content-newline.md) | require a line break before and after the contents of a singleline element |
+|  | [vue/valid-v-bind-sync](./docs/rules/valid-v-bind-sync.md) | enforce valid `.sync` modifier on `v-bind` directives |
 
 ### Deprecated
 
diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
new file mode 100644
index 000000000..dab3d8902
--- /dev/null
+++ b/docs/rules/valid-v-bind-sync.md
@@ -0,0 +1,48 @@
+# enforce valid `.sync` modifier on `v-bind` directives (vue/valid-v-bind-sync)
+
+This rule checks whether every `.sync` modifier on `v-bind` directives is valid.
+
+## :book: Rule Details
+
+This rule reports `.sync` modifier on `v-bind` directives in the following cases:
+
+- The directive does not have the attribute value which is valid as LHS. E.g. `<MyComponent v-bind:aaa.sync="foo() + bar()" />`
+- The directive is on non Vue-components. E.g. `<input v-bind:aaa.sync="foo"></div>`
+- The directive's reference is iteration variables. E.g. `<div v-for="x in list"><MyComponent v-bind:aaa.sync="x" /></div>`
+
+This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
+
+```vue
+<MyComponent v-bind:aaa.sync="foo + bar" />
+<MyComponent :aaa.sync="foo + bar" />
+
+<input v-bind:aaa.sync="foo">
+<input :aaa.sync="foo">
+
+<div v-for="todo in todos">
+  <MyComponent v-bind:aaa.sync="todo" />
+  <MyComponent :aaa.sync="todo" />
+</div>
+```
+
+:+1: Examples of **correct** code for this rule:
+
+```vue
+<MyComponent v-bind:aaa.sync="foo"/>
+<MyComponent :aaa.sync="foo"/>
+
+<div v-for="todo in todos">
+  <MyComponent v-bind:aaa.sync="todo.name"/>
+  <MyComponent :aaa.sync="todo.name"/>
+</div>
+```
+
+## :wrench: Options
+
+Nothing.
+
+## :couple: Related rules
+
+- [no-parsing-error]
+
+[no-parsing-error]: no-parsing-error.md
diff --git a/lib/index.js b/lib/index.js
index fff64d396..e0c6a92c5 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -55,6 +55,7 @@ module.exports = {
     'v-bind-style': require('./rules/v-bind-style'),
     'v-on-style': require('./rules/v-on-style'),
     'valid-template-root': require('./rules/valid-template-root'),
+    'valid-v-bind-sync': require('./rules/valid-v-bind-sync'),
     'valid-v-bind': require('./rules/valid-v-bind'),
     'valid-v-cloak': require('./rules/valid-v-cloak'),
     'valid-v-else-if': require('./rules/valid-v-else-if'),
diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
new file mode 100644
index 000000000..3b6d23050
--- /dev/null
+++ b/lib/rules/valid-v-bind-sync.js
@@ -0,0 +1,131 @@
+/**
+ * @fileoverview enforce valid `.sync` modifier on `v-bind` directives
+ * @author Yosuke Ota
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const utils = require('../utils')
+
+// ------------------------------------------------------------------------------
+// Helpers
+// ------------------------------------------------------------------------------
+
+/**
+ * Check whether the given node is valid or not.
+ * @param {ASTNode} node The element node to check.
+ * @returns {boolean} `true` if the node is valid.
+ */
+function isValidElement (node) {
+  if (
+    (!utils.isHtmlElementNode(node) && !utils.isSvgElementNode(node)) ||
+    utils.isHtmlWellKnownElementName(node.rawName) ||
+    utils.isSvgWellKnownElementName(node.rawName)
+  ) {
+    // non Vue-component
+    return false
+  }
+  return true
+}
+
+/**
+ * Check whether the given node can be LHS.
+ * @param {ASTNode} node The node to check.
+ * @returns {boolean} `true` if the node can be LHS.
+ */
+function isLhs (node) {
+  return node != null && (
+    node.type === 'Identifier' ||
+    node.type === 'MemberExpression'
+  )
+}
+
+/**
+ * Get the variable by names.
+ * @param {string} name The variable name to find.
+ * @param {ASTNode} leafNode The node to look up.
+ * @returns {Variable|null} The found variable or null.
+ */
+function getVariable (name, leafNode) {
+  let node = leafNode
+
+  while (node != null) {
+    const variables = node.variables
+    const variable = variables && variables.find(v => v.id.name === name)
+
+    if (variable != null) {
+      return variable
+    }
+
+    node = node.parent
+  }
+
+  return null
+}
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    docs: {
+      description: 'enforce valid `.sync` modifier on `v-bind` directives',
+      category: undefined,
+      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.3/docs/rules/valid-v-bind-sync.md'
+    },
+    fixable: null,
+    schema: []
+  },
+
+  create (context) {
+    return utils.defineTemplateBodyVisitor(context, {
+      "VAttribute[directive=true][key.name='bind']" (node) {
+        if (node.key.modifiers.indexOf('sync') < 0) {
+          return
+        }
+        const element = node.parent.parent
+        const name = element.name
+
+        if (!isValidElement(element)) {
+          context.report({
+            node,
+            loc: node.loc,
+            message: "'.sync' modifiers aren't supported on <{{name}}> non Vue-components.",
+            data: { name }
+          })
+        }
+
+        if (node.value) {
+          if (!isLhs(node.value.expression)) {
+            context.report({
+              node,
+              loc: node.loc,
+              message: "'.sync' modifiers require the attribute value which is valid as LHS."
+            })
+          }
+
+          for (const reference of node.value.references) {
+            const id = reference.id
+            if (id.parent.type !== 'VExpressionContainer') {
+              continue
+            }
+
+            const variable = getVariable(id.name, element)
+            if (variable != null) {
+              context.report({
+                node,
+                loc: node.loc,
+                message: "'.sync' modifiers cannot update the iteration variable '{{varName}}' itself.",
+                data: { varName: id.name }
+              })
+            }
+          }
+        }
+      }
+    })
+  }
+}
diff --git a/lib/utils/index.js b/lib/utils/index.js
index 28caa444d..089f37484 100644
--- a/lib/utils/index.js
+++ b/lib/utils/index.js
@@ -11,6 +11,7 @@
 
 const HTML_ELEMENT_NAMES = new Set(require('./html-elements.json'))
 const VOID_ELEMENT_NAMES = new Set(require('./void-elements.json'))
+const SVG_ELEMENT_NAMES = new Set(require('./svg-elements.json'))
 const assert = require('assert')
 const vueEslintParser = require('vue-eslint-parser')
 
@@ -283,6 +284,16 @@ module.exports = {
     return HTML_ELEMENT_NAMES.has(name)
   },
 
+  /**
+   * Check whether the given name is an well-known SVG element or not.
+   * @param {string} name The name to check.
+   * @returns {boolean} `true` if the name is an well-known SVG element name.
+   */
+  isSvgWellKnownElementName (name) {
+    assert(typeof name === 'string')
+    return SVG_ELEMENT_NAMES.has(name)
+  },
+
   /**
    * Check whether the given name is a void element name or not.
    * @param {string} name The name to check.
diff --git a/lib/utils/svg-elements.json b/lib/utils/svg-elements.json
new file mode 100644
index 000000000..aaee2e6f3
--- /dev/null
+++ b/lib/utils/svg-elements.json
@@ -0,0 +1 @@
+["a","animate","animateMotion","animateTransform","audio","canvas","circle","clipPath","defs","desc","discard","ellipse","feBlend","feColorMatrix","feComponentTransfer","feComposite","feConvolveMatrix","feDiffuseLighting","feDisplacementMap","feDistantLight","feDropShadow","feFlood","feFuncA","feFuncB","feFuncG","feFuncR","feGaussianBlur","feImage","feMerge","feMergeNode","feMorphology","feOffset","fePointLight","feSpecularLighting","feSpotLight","feTile","feTurbulence","filter","foreignObject","g","iframe","image","line","linearGradient","marker","mask","metadata","mpath","path","pattern","polygon","polyline","radialGradient","rect","script","set","stop","style","svg","switch","symbol","text","textPath","title","tspan","unknown","use","video","view"]
diff --git a/tests/lib/rules/valid-v-bind-sync.js b/tests/lib/rules/valid-v-bind-sync.js
new file mode 100644
index 000000000..e5d36d951
--- /dev/null
+++ b/tests/lib/rules/valid-v-bind-sync.js
@@ -0,0 +1,225 @@
+/**
+ * @author Yosuke Ota
+ */
+'use strict'
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const RuleTester = require('eslint').RuleTester
+const rule = require('../../../lib/rules/valid-v-bind-sync')
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const tester = new RuleTester({
+  parser: 'vue-eslint-parser',
+  parserOptions: { ecmaVersion: 2015 }
+})
+
+tester.run('valid-v-bind-sync', rule, {
+  valid: [
+    {
+      filename: 'test.vue',
+      code: ''
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync="foo" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-bind:foo.sync="foo" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync="foo.bar" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-bind.sync="foo" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><svg><MyComponent :foo.sync="foo" /></svg></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="x.foo" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x - 1]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`${x}`]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[`prefix_${x}`]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x ? x : \'_\']" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x || \'_\']" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[x()]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[/r/.match(x) ? 0 : 1]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[typeof x]" /></div></div></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="foo[tag`${x}`]" /></div></div></template>'
+    },
+    // not .sync
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo="a + b" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-bind:foo="a + b" /></template>'
+    },
+    // does not report
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-bind:foo.sync /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync.unknown="foo" /></template>'
+    }
+  ],
+  invalid: [
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <MyComponent :foo.sync="a + b" />
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers require the attribute value which is valid as LHS.",
+        line: 3,
+        column: 24,
+        endColumn: 41
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <MyComponent v-bind:foo.sync="a + b" />
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers require the attribute value which is valid as LHS.",
+        line: 3,
+        column: 24,
+        endColumn: 47
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <input :foo.sync="foo">
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers aren't supported on <input> non Vue-components.",
+        line: 3,
+        column: 18,
+        endColumn: 33
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <input v-bind:foo.sync="foo">
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers aren't supported on <input> non Vue-components.",
+        line: 3,
+        column: 18,
+        endColumn: 39
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div v-for="x in list">
+            <MyComponent :foo.sync="x" />
+          </div>
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers cannot update the iteration variable 'x' itself.",
+        line: 4,
+        column: 26,
+        endColumn: 39
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div v-for="e in list">
+            <MyComponent v-bind:foo.sync="e" />
+          </div>
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers cannot update the iteration variable 'e' itself.",
+        line: 4,
+        column: 26,
+        endColumn: 45
+      }]
+    },
+
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div :foo.sync="foo"></div>
+        </template>
+      `,
+      errors: ["'.sync' modifiers aren't supported on <div> non Vue-components."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent v-bind.sync="foo()" /></template>',
+      errors: ["'.sync' modifiers require the attribute value which is valid as LHS."]
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><svg><MyComponent :foo.sync="foo()" /></svg></template>',
+      errors: ["'.sync' modifiers require the attribute value which is valid as LHS."]
+    }
+  ]
+})

From 142120faa95befd4daa7319e9e68b7377287e8c9 Mon Sep 17 00:00:00 2001
From: ota <y.ohta.z3@future.co.jp>
Date: Mon, 12 Nov 2018 15:47:07 +0900
Subject: [PATCH 02/14] update doc

---
 docs/rules/valid-v-bind-sync.md | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
index dab3d8902..cc5a9b2c9 100644
--- a/docs/rules/valid-v-bind-sync.md
+++ b/docs/rules/valid-v-bind-sync.md
@@ -6,12 +6,14 @@ This rule checks whether every `.sync` modifier on `v-bind` directives is valid.
 
 This rule reports `.sync` modifier on `v-bind` directives in the following cases:
 
-- The directive does not have the attribute value which is valid as LHS. E.g. `<MyComponent v-bind:aaa.sync="foo() + bar()" />`
-- The directive is on non Vue-components. E.g. `<input v-bind:aaa.sync="foo"></div>`
-- The directive's reference is iteration variables. E.g. `<div v-for="x in list"><MyComponent v-bind:aaa.sync="x" /></div>`
+- The `.sync` modifier does not have the attribute value which is valid as LHS. E.g. `<MyComponent v-bind:aaa.sync="foo() + bar()" />`
+- The `.sync` modifier is on non Vue-components. E.g. `<input v-bind:aaa.sync="foo"></div>`
+- The `.sync` modifier's reference is iteration variables. E.g. `<div v-for="x in list"><MyComponent v-bind:aaa.sync="x" /></div>`
 
 This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
 
+:-1: Examples of **incorrect** code for this rule:
+
 ```vue
 <MyComponent v-bind:aaa.sync="foo + bar" />
 <MyComponent :aaa.sync="foo + bar" />

From 3820b96601adb8baaf01e8edf92c0a3a7bb7133a Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Mon, 12 Nov 2018 23:11:43 +0900
Subject: [PATCH 03/14] update use messageId

---
 lib/rules/valid-v-bind-sync.js | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 3b6d23050..01a8bb1ab 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -78,7 +78,12 @@ module.exports = {
       url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.3/docs/rules/valid-v-bind-sync.md'
     },
     fixable: null,
-    schema: []
+    schema: [],
+    messages: {
+      unexpectedInvalidElement: "'.sync' modifiers aren't supported on <{{name}}> non Vue-components.",
+      unexpectedNonLhsExpression: "'.sync' modifiers require the attribute value which is valid as LHS.",
+      unexpectedUpdateIterationVariable: "'.sync' modifiers cannot update the iteration variable '{{varName}}' itself."
+    }
   },
 
   create (context) {
@@ -94,7 +99,7 @@ module.exports = {
           context.report({
             node,
             loc: node.loc,
-            message: "'.sync' modifiers aren't supported on <{{name}}> non Vue-components.",
+            messageId: 'unexpectedInvalidElement',
             data: { name }
           })
         }
@@ -104,7 +109,7 @@ module.exports = {
             context.report({
               node,
               loc: node.loc,
-              message: "'.sync' modifiers require the attribute value which is valid as LHS."
+              messageId: 'unexpectedNonLhsExpression'
             })
           }
 
@@ -119,7 +124,7 @@ module.exports = {
               context.report({
                 node,
                 loc: node.loc,
-                message: "'.sync' modifiers cannot update the iteration variable '{{varName}}' itself.",
+                messageId: 'unexpectedUpdateIterationVariable',
                 data: { varName: id.name }
               })
             }

From 5acb2e7823f0b1ea44ed368afcaaa80be17da27d Mon Sep 17 00:00:00 2001
From: ota <y.ohta.z3@future.co.jp>
Date: Tue, 13 Nov 2018 20:54:50 +0900
Subject: [PATCH 04/14] Change: null comparison to Boolean call.

---
 lib/rules/valid-v-bind-sync.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 01a8bb1ab..0330fa2e3 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -37,7 +37,7 @@ function isValidElement (node) {
  * @returns {boolean} `true` if the node can be LHS.
  */
 function isLhs (node) {
-  return node != null && (
+  return Boolean(node) && (
     node.type === 'Identifier' ||
     node.type === 'MemberExpression'
   )
@@ -52,11 +52,11 @@ function isLhs (node) {
 function getVariable (name, leafNode) {
   let node = leafNode
 
-  while (node != null) {
+  while (node) {
     const variables = node.variables
     const variable = variables && variables.find(v => v.id.name === name)
 
-    if (variable != null) {
+    if (variable) {
       return variable
     }
 
@@ -75,7 +75,7 @@ module.exports = {
     docs: {
       description: 'enforce valid `.sync` modifier on `v-bind` directives',
       category: undefined,
-      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.3/docs/rules/valid-v-bind-sync.md'
+      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.4/docs/rules/valid-v-bind-sync.md'
     },
     fixable: null,
     schema: [],
@@ -120,7 +120,7 @@ module.exports = {
             }
 
             const variable = getVariable(id.name, element)
-            if (variable != null) {
+            if (variable) {
               context.report({
                 node,
                 loc: node.loc,

From 17b02f2688cd9aa12c0952db25f8a36aa88d70f5 Mon Sep 17 00:00:00 2001
From: ota <y.ohta.z3@future.co.jp>
Date: Tue, 13 Nov 2018 20:57:59 +0900
Subject: [PATCH 05/14] add testcase

---
 tests/lib/rules/valid-v-bind-sync.js | 36 ++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/tests/lib/rules/valid-v-bind-sync.js b/tests/lib/rules/valid-v-bind-sync.js
index e5d36d951..958fbf75c 100644
--- a/tests/lib/rules/valid-v-bind-sync.js
+++ b/tests/lib/rules/valid-v-bind-sync.js
@@ -45,6 +45,14 @@ tester.run('valid-v-bind-sync', rule, {
       filename: 'test.vue',
       code: '<template><svg><MyComponent :foo.sync="foo" /></svg></template>'
     },
+    {
+      filename: 'test.vue',
+      code: '<template><MyComponent :foo.sync="this.foo().bar" /></template>'
+    },
+    {
+      filename: 'test.vue',
+      code: '<template><svg><MyComponent :foo.sync="this.foo().bar" /></svg></template>'
+    },
     {
       filename: 'test.vue',
       code: '<template><div><div v-for="x in list"><MyComponent :foo.sync="x.foo" /></div></div></template>'
@@ -155,6 +163,34 @@ tester.run('valid-v-bind-sync', rule, {
         endColumn: 33
       }]
     },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <MyComponent :foo.sync="foo()" />
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers require the attribute value which is valid as LHS.",
+        line: 3,
+        column: 24,
+        endColumn: 41
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <MyComponent :foo.sync="this.foo()" />
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers require the attribute value which is valid as LHS.",
+        line: 3,
+        column: 24,
+        endColumn: 46
+      }]
+    },
     {
       filename: 'test.vue',
       code: `

From e4222a2d119c93eea4f51affa4f9a724c85e4981 Mon Sep 17 00:00:00 2001
From: ota <y.ohta.z3@future.co.jp>
Date: Thu, 22 Nov 2018 10:54:02 +0900
Subject: [PATCH 06/14] Update: to use reference.variable

---
 lib/rules/valid-v-bind-sync.js       | 26 +---------------------
 tests/lib/rules/valid-v-bind-sync.js | 33 +++++++++++++++++++++++++++-
 2 files changed, 33 insertions(+), 26 deletions(-)

diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 0330fa2e3..3f9d1121a 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -43,29 +43,6 @@ function isLhs (node) {
   )
 }
 
-/**
- * Get the variable by names.
- * @param {string} name The variable name to find.
- * @param {ASTNode} leafNode The node to look up.
- * @returns {Variable|null} The found variable or null.
- */
-function getVariable (name, leafNode) {
-  let node = leafNode
-
-  while (node) {
-    const variables = node.variables
-    const variable = variables && variables.find(v => v.id.name === name)
-
-    if (variable) {
-      return variable
-    }
-
-    node = node.parent
-  }
-
-  return null
-}
-
 // ------------------------------------------------------------------------------
 // Rule Definition
 // ------------------------------------------------------------------------------
@@ -118,8 +95,7 @@ module.exports = {
             if (id.parent.type !== 'VExpressionContainer') {
               continue
             }
-
-            const variable = getVariable(id.name, element)
+            const variable = reference.variable
             if (variable) {
               context.report({
                 node,
diff --git a/tests/lib/rules/valid-v-bind-sync.js b/tests/lib/rules/valid-v-bind-sync.js
index 958fbf75c..97fb33e9d 100644
--- a/tests/lib/rules/valid-v-bind-sync.js
+++ b/tests/lib/rules/valid-v-bind-sync.js
@@ -237,7 +237,38 @@ tester.run('valid-v-bind-sync', rule, {
         endColumn: 45
       }]
     },
-
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div v-for="e1 in list1">
+            <div><div>
+              <div v-for="e2 in list2">
+                <MyComponent v-bind:foo.sync="e1" />
+              </div>
+            </div></div>
+          </div>
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers cannot update the iteration variable 'e1' itself.",
+        line: 6
+      }]
+    },
+    {
+      filename: 'test.vue',
+      code: `
+        <template>
+          <div v-for="(e, index) in list">
+            <MyComponent v-bind:foo.sync="index" />
+          </div>
+        </template>
+      `,
+      errors: [{
+        message: "'.sync' modifiers cannot update the iteration variable 'index' itself.",
+        line: 4
+      }]
+    },
     {
       filename: 'test.vue',
       code: `

From 2cbe6b031df63e830646e236d31f27da38f8692b Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Sat, 24 Nov 2018 01:11:39 +0900
Subject: [PATCH 07/14] fixed eslint error

---
 lib/rules/valid-v-bind-sync.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 3f9d1121a..c23d98ce7 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -52,7 +52,7 @@ module.exports = {
     docs: {
       description: 'enforce valid `.sync` modifier on `v-bind` directives',
       category: undefined,
-      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.4/docs/rules/valid-v-bind-sync.md'
+      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.5/docs/rules/valid-v-bind-sync.md'
     },
     fixable: null,
     schema: [],

From e10b9a910ace7cd6251f8650f3612dacee202993 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Tue, 4 Dec 2018 13:34:07 +0900
Subject: [PATCH 08/14] update document

---
 docs/rules/README.md            |  1 +
 docs/rules/valid-v-bind-sync.md | 66 ++++++++++++++++++++-------------
 lib/rules/valid-v-bind-sync.js  |  2 +-
 3 files changed, 42 insertions(+), 27 deletions(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index dcc4d9b2a..23dcb643e 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -136,6 +136,7 @@ For example:
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [vue/script-indent](./script-indent.md) | enforce consistent indentation in `<script>` | :wrench: |
+| [vue/valid-v-bind-sync](./valid-v-bind-sync.md) | enforce valid `.sync` modifier on `v-bind` directives |  |
 
 ## Deprecated
 
diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
index cc5a9b2c9..b0e77c157 100644
--- a/docs/rules/valid-v-bind-sync.md
+++ b/docs/rules/valid-v-bind-sync.md
@@ -1,4 +1,11 @@
-# enforce valid `.sync` modifier on `v-bind` directives (vue/valid-v-bind-sync)
+---
+pageClass: rule-details
+sidebarDepth: 0
+title: vue/valid-v-bind-sync
+description: enforce valid `.sync` modifier on `v-bind` directives
+---
+# vue/valid-v-bind-sync
+> enforce valid `.sync` modifier on `v-bind` directives
 
 This rule checks whether every `.sync` modifier on `v-bind` directives is valid.
 
@@ -10,34 +17,36 @@ This rule reports `.sync` modifier on `v-bind` directives in the following cases
 - The `.sync` modifier is on non Vue-components. E.g. `<input v-bind:aaa.sync="foo"></div>`
 - The `.sync` modifier's reference is iteration variables. E.g. `<div v-for="x in list"><MyComponent v-bind:aaa.sync="x" /></div>`
 
-This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
-
-:-1: Examples of **incorrect** code for this rule:
-
+<eslint-code-block :rules="{'vue/valid-v-bind-sync': ['error']}">
 ```vue
-<MyComponent v-bind:aaa.sync="foo + bar" />
-<MyComponent :aaa.sync="foo + bar" />
-
-<input v-bind:aaa.sync="foo">
-<input :aaa.sync="foo">
-
-<div v-for="todo in todos">
-  <MyComponent v-bind:aaa.sync="todo" />
-  <MyComponent :aaa.sync="todo" />
-</div>
+<template>
+  <!-- ✓ GOOD -->
+  <MyComponent v-bind:aaa.sync="foo + bar" />
+  <MyComponent :aaa.sync="foo + bar" />
+
+  <input v-bind:aaa.sync="foo">
+  <input :aaa.sync="foo">
+
+  <div v-for="todo in todos">
+    <MyComponent v-bind:aaa.sync="todo" />
+    <MyComponent :aaa.sync="todo" />
+  </div>
+
+  <!-- ✗ BAD -->
+  <MyComponent v-bind:aaa.sync="foo"/>
+  <MyComponent :aaa.sync="foo"/>
+
+  <div v-for="todo in todos">
+    <MyComponent v-bind:aaa.sync="todo.name"/>
+    <MyComponent :aaa.sync="todo.name"/>
+  </div>
+</template>
 ```
+</eslint-code-block>
 
-:+1: Examples of **correct** code for this rule:
-
-```vue
-<MyComponent v-bind:aaa.sync="foo"/>
-<MyComponent :aaa.sync="foo"/>
-
-<div v-for="todo in todos">
-  <MyComponent v-bind:aaa.sync="todo.name"/>
-  <MyComponent :aaa.sync="todo.name"/>
-</div>
-```
+::: warning Note
+This rule does not check syntax errors in directives because it's checked by [no-parsing-error] rule.
+:::
 
 ## :wrench: Options
 
@@ -48,3 +57,8 @@ Nothing.
 - [no-parsing-error]
 
 [no-parsing-error]: no-parsing-error.md
+
+## :mag: Implementation
+
+- [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/valid-v-bind-sync.js)
+- [Test source](https://github.com/vuejs/eslint-plugin-vue/blob/master/tests/lib/rules/valid-v-bind-sync.js)
diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index c23d98ce7..2aeb7c90f 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -52,7 +52,7 @@ module.exports = {
     docs: {
       description: 'enforce valid `.sync` modifier on `v-bind` directives',
       category: undefined,
-      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0-beta.5/docs/rules/valid-v-bind-sync.md'
+      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0/docs/rules/valid-v-bind-sync.md'
     },
     fixable: null,
     schema: [],

From 53ccd6000dbbdc22edb382092455381579e50872 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Tue, 4 Dec 2018 13:36:32 +0900
Subject: [PATCH 09/14] revert readme

---
 README.md | 295 +-----------------------------------------------------
 1 file changed, 2 insertions(+), 293 deletions(-)

diff --git a/README.md b/README.md
index 593e2dfd5..b4bf11f0d 100644
--- a/README.md
+++ b/README.md
@@ -13,298 +13,7 @@ See https://vuejs.github.io/eslint-plugin-vue/
 
 ## :anchor: Versioning Policy
 
-If you want to check previous releases [go here](https://github.com/vuejs/eslint-plugin-vue/releases).
-
-## :art: Playground on the Web
-
-You can try this plugin on the Web.
-
-- https://mysticatea.github.io/vue-eslint-demo/
-
-## :grey_exclamation: Requirements
-
-- [ESLint](http://eslint.org/) `^5.0.0`.
-- Node.js `>=6.5.0`
-
-## :cd: Installation
-
-```bash
-npm install --save-dev eslint eslint-plugin-vue@next
-```
-
-## :rocket: Usage
-
-Create `.eslintrc.*` file to configure rules. See also: [http://eslint.org/docs/user-guide/configuring](http://eslint.org/docs/user-guide/configuring).
-
-Example **.eslintrc.js**:
-
-```js
-module.exports = {
-  extends: [
-    // add more generic rulesets here, such as:
-    // 'eslint:recommended',
-    'plugin:vue/essential'
-  ],
-  rules: {
-    // override/add rules settings here, such as:
-    // 'vue/no-unused-vars': 'error'
-  }
-}
-```
-
-### Single File Components
-
-ESLint only targets `.js` files by default. You must include the `.vue` extension using [the `--ext` option](https://eslint.org/docs/user-guide/configuring#specifying-file-extensions-to-lint) or a glob pattern.
-
-Examples:
-
-```bash
-eslint --ext .js,.vue src
-eslint src/**/*.{js,vue}
-```
-
-### Attention
-
-All component-related rules are being applied to code that passes any of the following checks:
-
-* `Vue.component()` expression
-* `Vue.extend()` expression
-* `Vue.mixin()` expression
-* `export default {}` in `.vue` or `.jsx` file
-
-If you however want to take advantage of our rules in any of your custom objects that are Vue components, you might need to use special comment `// @vue/component` that marks object in the next line as a Vue component in any file, e.g.:
-
-```js
-// @vue/component
-const CustomComponent = {
-  name: 'custom-component',
-  template: '<div></div>'
-}
-```
-```js
-Vue.component('AsyncComponent', (resolve, reject) => {
-  setTimeout(() => {
-    // @vue/component
-    resolve({
-      name: 'async-component',
-      template: '<div></div>'
-    })
-  }, 500)
-})
-```
-
-### `eslint-disable` functionality in `<template>`
-
-You can use `<!-- eslint-disable -->`-like HTML comments in `<template>` of `.vue` files. For example:
-
-```html
-<template>
-  <!-- eslint-disable-next-line vue/max-attributes-per-line -->
-  <div a="1" b="2" c="3" d="4">
-  </div>
-</template>
-```
-
-If you want to disallow `eslint-disable` functionality, please disable [vue/comment-directive](./docs/rules/comment-directive.md) rule.
-
-## :gear: Configs
-
-This plugin provides four predefined configs:
-- `plugin:vue/base` - Settings and rules to enable correct ESLint parsing
-- `plugin:vue/essential` - Above, plus rules to prevent errors or unintended behavior
-- `plugin:vue/strongly-recommended` - Above, plus rules to considerably improve code readability and/or dev experience
-- `plugin:vue/recommended` - Above, plus rules to enforce subjective community defaults to ensure consistency
-
-## :bulb: Rules
-
-Rules are grouped by priority to help you understand their purpose. The `--fix` option on the command line automatically fixes problems reported by rules which have a wrench :wrench: below.
-
-<!--RULES_TABLE_START-->
-
-### Base Rules (Enabling Correct ESLint Parsing)
-
-Enforce all the rules in this category, as well as all higher priority rules, with:
-
-```json
-{
-  "extends": "plugin:vue/base"
-}
-```
-
-|    | Rule ID | Description |
-|:---|:--------|:------------|
-|  | [vue/comment-directive](./docs/rules/comment-directive.md) | support comment-directives in `<template>` |
-|  | [vue/jsx-uses-vars](./docs/rules/jsx-uses-vars.md) | prevent variables used in JSX to be marked as unused |
-
-### Priority A: Essential (Error Prevention)
-
-Enforce all the rules in this category, as well as all higher priority rules, with:
-
-```json
-{
-  "extends": "plugin:vue/essential"
-}
-```
-
-|    | Rule ID | Description |
-|:---|:--------|:------------|
-|  | [vue/no-async-in-computed-properties](./docs/rules/no-async-in-computed-properties.md) | disallow asynchronous actions in computed properties |
-|  | [vue/no-dupe-keys](./docs/rules/no-dupe-keys.md) | disallow duplication of field names |
-|  | [vue/no-duplicate-attributes](./docs/rules/no-duplicate-attributes.md) | disallow duplication of attributes |
-|  | [vue/no-parsing-error](./docs/rules/no-parsing-error.md) | disallow parsing errors in `<template>` |
-|  | [vue/no-reserved-keys](./docs/rules/no-reserved-keys.md) | disallow overwriting reserved keys |
-| :wrench: | [vue/no-shared-component-data](./docs/rules/no-shared-component-data.md) | enforce component's data property to be a function |
-|  | [vue/no-side-effects-in-computed-properties](./docs/rules/no-side-effects-in-computed-properties.md) | disallow side effects in computed properties |
-|  | [vue/no-template-key](./docs/rules/no-template-key.md) | disallow `key` attribute on `<template>` |
-|  | [vue/no-textarea-mustache](./docs/rules/no-textarea-mustache.md) | disallow mustaches in `<textarea>` |
-|  | [vue/no-unused-components](./docs/rules/no-unused-components.md) | disallow registering components that are not used inside templates |
-|  | [vue/no-unused-vars](./docs/rules/no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |
-|  | [vue/no-use-v-if-with-v-for](./docs/rules/no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |
-|  | [vue/require-component-is](./docs/rules/require-component-is.md) | require `v-bind:is` of `<component>` elements |
-| :wrench: | [vue/require-prop-type-constructor](./docs/rules/require-prop-type-constructor.md) | require prop type to be a constructor |
-|  | [vue/require-render-return](./docs/rules/require-render-return.md) | enforce render function to always return value |
-|  | [vue/require-v-for-key](./docs/rules/require-v-for-key.md) | require `v-bind:key` with `v-for` directives |
-|  | [vue/require-valid-default-prop](./docs/rules/require-valid-default-prop.md) | enforce props default values to be valid |
-|  | [vue/return-in-computed-property](./docs/rules/return-in-computed-property.md) | enforce that a return statement is present in computed property |
-|  | [vue/use-v-on-exact](./docs/rules/use-v-on-exact.md) | enforce usage of `exact` modifier on `v-on` |
-|  | [vue/valid-template-root](./docs/rules/valid-template-root.md) | enforce valid template root |
-|  | [vue/valid-v-bind](./docs/rules/valid-v-bind.md) | enforce valid `v-bind` directives |
-|  | [vue/valid-v-cloak](./docs/rules/valid-v-cloak.md) | enforce valid `v-cloak` directives |
-|  | [vue/valid-v-else-if](./docs/rules/valid-v-else-if.md) | enforce valid `v-else-if` directives |
-|  | [vue/valid-v-else](./docs/rules/valid-v-else.md) | enforce valid `v-else` directives |
-|  | [vue/valid-v-for](./docs/rules/valid-v-for.md) | enforce valid `v-for` directives |
-|  | [vue/valid-v-html](./docs/rules/valid-v-html.md) | enforce valid `v-html` directives |
-|  | [vue/valid-v-if](./docs/rules/valid-v-if.md) | enforce valid `v-if` directives |
-|  | [vue/valid-v-model](./docs/rules/valid-v-model.md) | enforce valid `v-model` directives |
-|  | [vue/valid-v-on](./docs/rules/valid-v-on.md) | enforce valid `v-on` directives |
-|  | [vue/valid-v-once](./docs/rules/valid-v-once.md) | enforce valid `v-once` directives |
-|  | [vue/valid-v-pre](./docs/rules/valid-v-pre.md) | enforce valid `v-pre` directives |
-|  | [vue/valid-v-show](./docs/rules/valid-v-show.md) | enforce valid `v-show` directives |
-|  | [vue/valid-v-text](./docs/rules/valid-v-text.md) | enforce valid `v-text` directives |
-
-### Priority B: Strongly Recommended (Improving Readability)
-
-Enforce all the rules in this category, as well as all higher priority rules, with:
-
-```json
-{
-  "extends": "plugin:vue/strongly-recommended"
-}
-```
-
-|    | Rule ID | Description |
-|:---|:--------|:------------|
-| :wrench: | [vue/attribute-hyphenation](./docs/rules/attribute-hyphenation.md) | enforce attribute naming style on custom components in template |
-| :wrench: | [vue/component-name-in-template-casing](./docs/rules/component-name-in-template-casing.md) | enforce specific casing for the component naming style in template |
-| :wrench: | [vue/html-closing-bracket-newline](./docs/rules/html-closing-bracket-newline.md) | require or disallow a line break before tag's closing brackets |
-| :wrench: | [vue/html-closing-bracket-spacing](./docs/rules/html-closing-bracket-spacing.md) | require or disallow a space before tag's closing brackets |
-| :wrench: | [vue/html-end-tags](./docs/rules/html-end-tags.md) | enforce end tag style |
-| :wrench: | [vue/html-indent](./docs/rules/html-indent.md) | enforce consistent indentation in `<template>` |
-| :wrench: | [vue/html-self-closing](./docs/rules/html-self-closing.md) | enforce self-closing style |
-| :wrench: | [vue/max-attributes-per-line](./docs/rules/max-attributes-per-line.md) | enforce the maximum number of attributes per line |
-| :wrench: | [vue/multiline-html-element-content-newline](./docs/rules/multiline-html-element-content-newline.md) | require a line break before and after the contents of a multiline element |
-| :wrench: | [vue/mustache-interpolation-spacing](./docs/rules/mustache-interpolation-spacing.md) | enforce unified spacing in mustache interpolations |
-| :wrench: | [vue/name-property-casing](./docs/rules/name-property-casing.md) | enforce specific casing for the name property in Vue components |
-| :wrench: | [vue/no-multi-spaces](./docs/rules/no-multi-spaces.md) | disallow multiple spaces |
-| :wrench: | [vue/no-spaces-around-equal-signs-in-attribute](./docs/rules/no-spaces-around-equal-signs-in-attribute.md) | disallow spaces around equal signs in attribute |
-|  | [vue/no-template-shadow](./docs/rules/no-template-shadow.md) | disallow variable declarations from shadowing variables declared in the outer scope |
-| :wrench: | [vue/prop-name-casing](./docs/rules/prop-name-casing.md) | enforce specific casing for the Prop name in Vue components |
-|  | [vue/require-default-prop](./docs/rules/require-default-prop.md) | require default value for props |
-|  | [vue/require-prop-types](./docs/rules/require-prop-types.md) | require type definitions in props |
-| :wrench: | [vue/singleline-html-element-content-newline](./docs/rules/singleline-html-element-content-newline.md) | require a line break before and after the contents of a singleline element |
-| :wrench: | [vue/v-bind-style](./docs/rules/v-bind-style.md) | enforce `v-bind` directive style |
-| :wrench: | [vue/v-on-style](./docs/rules/v-on-style.md) | enforce `v-on` directive style |
-
-### Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
-
-Enforce all the rules in this category, as well as all higher priority rules, with:
-
-```json
-{
-  "extends": "plugin:vue/recommended"
-}
-```
-
-|    | Rule ID | Description |
-|:---|:--------|:------------|
-| :wrench: | [vue/attributes-order](./docs/rules/attributes-order.md) | enforce order of attributes |
-| :wrench: | [vue/html-quotes](./docs/rules/html-quotes.md) | enforce quotes style of HTML attributes |
-|  | [vue/no-v-html](./docs/rules/no-v-html.md) | disallow use of v-html to prevent XSS attack |
-| :wrench: | [vue/order-in-components](./docs/rules/order-in-components.md) | enforce order of properties in components |
-|  | [vue/this-in-template](./docs/rules/this-in-template.md) | enforce usage of `this` in template |
-
-### Uncategorized
-
-|    | Rule ID | Description |
-|:---|:--------|:------------|
-| :wrench: | [vue/script-indent](./docs/rules/script-indent.md) | enforce consistent indentation in `<script>` |
-|  | [vue/valid-v-bind-sync](./docs/rules/valid-v-bind-sync.md) | enforce valid `.sync` modifier on `v-bind` directives |
-
-### Deprecated
-
-> - :warning: We're going to remove deprecated rules in the next major release. Please migrate to successor/new rules.
-> - :innocent: We don't fix bugs which are in deprecated rules since we don't have enough resources.
-
-| Rule ID | Replaced by |
-|:--------|:------------|
-| [vue/no-confusing-v-for-v-if](./docs/rules/no-confusing-v-for-v-if.md) | [vue/no-use-v-if-with-v-for](./docs/rules/no-use-v-if-with-v-for.md) |
-
-<!--RULES_TABLE_END-->
-
-## :couple: FAQ
-
-### What is the "Use the latest vue-eslint-parser" error?
-
-The most rules of `eslint-plugin-vue` require `vue-eslint-parser` to check `<template>` ASTs.
-
-Make sure you have one of the following settings in your **.eslintrc**:
-
-- `"extends": ["plugin:vue/recommended"]`
-- `"extends": ["plugin:vue/base"]`
-
-If you already use other parser (e.g. `"parser": "babel-eslint"`), please move it into `parserOptions`, so it doesn't collide with the `vue-eslint-parser` used by this plugin's configuration:
-
-```diff
-- "parser": "babel-eslint",
-  "parserOptions": {
-+     "parser": "babel-eslint",
-      "ecmaVersion": 2017,
-      "sourceType": "module"
-  }
-```
-
-The `vue-eslint-parser` uses the parser which is set by `parserOptions.parser` to parse scripts.
-
-### Why doesn't it work on .vue file?
-
-1. Make sure you don't have `eslint-plugin-html` in your config. The `eslint-plugin-html` extracts the content from `<script>` tags, but `eslint-plugin-vue` requires `<script>` tags and `<template>` tags in order to distinguish template and script in single file components.
-
-  ```diff
-    "plugins": [
-      "vue",
-  -   "html"
-    ]
-  ```
-
-2. Make sure your tool is set to lint `.vue` files.
-  - CLI targets only `.js` files by default. You have to specify additional extensions by `--ext` option or glob patterns. E.g. `eslint "src/**/*.{js,vue}"` or `eslint src --ext .vue`. If you use `@vue/cli-plugin-eslint` and the `vue-cli-service lint` command - you don't have to worry about it.
-  - VSCode targets only JavaScript or HTML files by default. You have to add `"vue"` to the `"eslint.validate"` array in vscode settings. e.g. `"eslint.validate": [ "javascript", "javascriptreact", "vue" ]`
-  - If you use `Vetur` plugin in VSCode - set `"vetur.validation.template": false` to avoid default Vetur template validation. Check out [vetur documentation](https://github.com/vuejs/vetur/blob/master/docs/linting-error.md) for more info.
-  - For Atom editor, you need to go into Settings -> Packages -> linter-eslint, under the option “List of scopes to run eslint on”, add `text.html.vue`.
-  - For Sublime Text, you need to open command-pallete via cmd+shift+p (cmd => ctrl for windows) and type "Preferences: SublimeLinter Settings", paste to the config on the right side:
-  ```json
-  {
-    "linters": {
-      "eslint": {
-        "selector": "source.js, text.html.vue"
-      }
-    }
-  }
-  ```
-
-## :anchor: Semantic Versioning Policy
-
-This plugin follows [semantic versioning](http://semver.org/) and [ESLint's Semantic Versioning Policy](https://github.com/eslint/eslint#semantic-versioning-policy).
+This plugin is following [Semantic Versioning](http://semver.org/) and [ESLint's Semantic Versioning Policy](https://github.com/eslint/eslint#semantic-versioning-policy).
 
 ## :newspaper: Changelog
 
@@ -342,4 +51,4 @@ If you'll stuck, remember there are plenty of rules you can learn from already,
 
 ## :lock: License
 
-See the [LICENSE](LICENSE) file for license rights and limitations (MIT).
+See the [LICENSE](LICENSE) file for license rights and limitations (MIT).
\ No newline at end of file

From e7d91450781439f614eeebb49ba9d46d74479f38 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Tue, 4 Dec 2018 13:37:18 +0900
Subject: [PATCH 10/14] fix eof

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index b4bf11f0d..a983f6e42 100644
--- a/README.md
+++ b/README.md
@@ -51,4 +51,4 @@ If you'll stuck, remember there are plenty of rules you can learn from already,
 
 ## :lock: License
 
-See the [LICENSE](LICENSE) file for license rights and limitations (MIT).
\ No newline at end of file
+See the [LICENSE](LICENSE) file for license rights and limitations (MIT).

From aa15ddb9aebdd089c1e03cf29918ad08549e232c Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Tue, 4 Dec 2018 13:48:40 +0900
Subject: [PATCH 11/14] fixed doc

---
 docs/rules/valid-v-bind-sync.md | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
index b0e77c157..9e0ec6c81 100644
--- a/docs/rules/valid-v-bind-sync.md
+++ b/docs/rules/valid-v-bind-sync.md
@@ -21,6 +21,15 @@ This rule reports `.sync` modifier on `v-bind` directives in the following cases
 ```vue
 <template>
   <!-- ✓ GOOD -->
+  <MyComponent v-bind:aaa.sync="foo"/>
+  <MyComponent :aaa.sync="foo"/>
+
+  <div v-for="todo in todos">
+    <MyComponent v-bind:aaa.sync="todo.name"/>
+    <MyComponent :aaa.sync="todo.name"/>
+  </div>
+
+  <!-- ✗ BAD -->
   <MyComponent v-bind:aaa.sync="foo + bar" />
   <MyComponent :aaa.sync="foo + bar" />
 
@@ -31,15 +40,6 @@ This rule reports `.sync` modifier on `v-bind` directives in the following cases
     <MyComponent v-bind:aaa.sync="todo" />
     <MyComponent :aaa.sync="todo" />
   </div>
-
-  <!-- ✗ BAD -->
-  <MyComponent v-bind:aaa.sync="foo"/>
-  <MyComponent :aaa.sync="foo"/>
-
-  <div v-for="todo in todos">
-    <MyComponent v-bind:aaa.sync="todo.name"/>
-    <MyComponent :aaa.sync="todo.name"/>
-  </div>
 </template>
 ```
 </eslint-code-block>

From c115f544a646edddd0c6db66811a6f9b1f9a9171 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Mon, 7 Jan 2019 00:31:04 +0900
Subject: [PATCH 12/14] update docs

---
 docs/rules/README.md            | 1 +
 docs/rules/valid-v-bind-sync.md | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 513827d01..df09e152a 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -148,6 +148,7 @@ For example:
 | [vue/script-indent](./script-indent.md) | enforce consistent indentation in `<script>` | :wrench: |
 | [vue/space-infix-ops](./space-infix-ops.md) | require spacing around infix operators | :wrench: |
 | [vue/space-unary-ops](./space-unary-ops.md) | enforce consistent spacing before or after unary operators | :wrench: |
+| [vue/valid-v-bind-sync](./valid-v-bind-sync.md) | enforce valid `.sync` modifier on `v-bind` directives |  |
 
 ## Deprecated
 
diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
index 9e0ec6c81..2f2c45244 100644
--- a/docs/rules/valid-v-bind-sync.md
+++ b/docs/rules/valid-v-bind-sync.md
@@ -18,6 +18,7 @@ This rule reports `.sync` modifier on `v-bind` directives in the following cases
 - The `.sync` modifier's reference is iteration variables. E.g. `<div v-for="x in list"><MyComponent v-bind:aaa.sync="x" /></div>`
 
 <eslint-code-block :rules="{'vue/valid-v-bind-sync': ['error']}">
+
 ```vue
 <template>
   <!-- ✓ GOOD -->
@@ -42,6 +43,7 @@ This rule reports `.sync` modifier on `v-bind` directives in the following cases
   </div>
 </template>
 ```
+
 </eslint-code-block>
 
 ::: warning Note

From 50826535eebc78860a9fae27cbbc5d4465e38d84 Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Mon, 7 Jan 2019 00:33:56 +0900
Subject: [PATCH 13/14] fixed lint errors

---
 lib/rules/valid-v-bind-sync.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 2aeb7c90f..497fef78b 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -49,10 +49,11 @@ function isLhs (node) {
 
 module.exports = {
   meta: {
+    type: 'problem',
     docs: {
       description: 'enforce valid `.sync` modifier on `v-bind` directives',
       category: undefined,
-      url: 'https://github.com/vuejs/eslint-plugin-vue/blob/v5.0.0/docs/rules/valid-v-bind-sync.md'
+      url: 'https://eslint.vuejs.org/rules/valid-v-bind-sync.html'
     },
     fixable: null,
     schema: [],

From 8a61053ae0e937cac63641dc4ee5b0770e65b42b Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Thu, 28 Feb 2019 19:12:07 +0900
Subject: [PATCH 14/14] fixed

---
 docs/rules/valid-v-bind-sync.md | 4 ++++
 lib/rules/valid-v-bind-sync.js  | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/docs/rules/valid-v-bind-sync.md b/docs/rules/valid-v-bind-sync.md
index 2f2c45244..6e8d9504e 100644
--- a/docs/rules/valid-v-bind-sync.md
+++ b/docs/rules/valid-v-bind-sync.md
@@ -60,6 +60,10 @@ Nothing.
 
 [no-parsing-error]: no-parsing-error.md
 
+## :books: Further reading
+
+- [Guide - `.sync` Modifier]([https://vuejs.org/v2/guide/list.html#v-for-with-a-Component](https://vuejs.org/v2/guide/components-custom-events.html#sync-Modifier))
+
 ## :mag: Implementation
 
 - [Rule source](https://github.com/vuejs/eslint-plugin-vue/blob/master/lib/rules/valid-v-bind-sync.js)
diff --git a/lib/rules/valid-v-bind-sync.js b/lib/rules/valid-v-bind-sync.js
index 497fef78b..727d0390e 100644
--- a/lib/rules/valid-v-bind-sync.js
+++ b/lib/rules/valid-v-bind-sync.js
@@ -66,8 +66,8 @@ module.exports = {
 
   create (context) {
     return utils.defineTemplateBodyVisitor(context, {
-      "VAttribute[directive=true][key.name='bind']" (node) {
-        if (node.key.modifiers.indexOf('sync') < 0) {
+      "VAttribute[directive=true][key.name.name='bind']" (node) {
+        if (!node.key.modifiers.map(mod => mod.name).includes('sync')) {
           return
         }
         const element = node.parent.parent