Add check for watchEffect.

Author: ota-meshi

docs/rules/README.md

@@ -58,6 +58,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-watch-after-await](./no-watch-after-await.md) | disallow asynchronously registered `watch` |  |
 | [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 |  |
@@ -273,7 +274,6 @@ For example:
 | [vue/no-restricted-syntax](./no-restricted-syntax.md) | disallow specified syntax |  |
 | [vue/no-static-inline-styles](./no-static-inline-styles.md) | disallow static inline `style` attributes |  |
 | [vue/no-unsupported-features](./no-unsupported-features.md) | disallow unsupported Vue.js syntax on the specified version | :wrench: |
-| [vue/no-watch-after-await](./no-watch-after-await.md) | disallow asynchronously registered `watch` |  |
 | [vue/object-curly-spacing](./object-curly-spacing.md) | enforce consistent spacing inside braces | :wrench: |
 | [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |
 | [vue/require-direct-export](./require-direct-export.md) | require the component to be directly exported |  |

docs/rules/no-watch-after-await.md

@@ -7,6 +7,8 @@ description: disallow asynchronously registered `watch`
 # vue/no-watch-after-await
 > disallow asynchronously registered `watch`
 
+- :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/vue3-strongly-recommended"` and `"plugin:vue/vue3-recommended"`.
+
 ## :book: Rule Details
 
 This rule reports the `watch()` after `await` expression.  

lib/configs/vue3-essential.js

@@ -26,6 +26,7 @@ module.exports = {
     'vue/no-unused-components': 'error',
     'vue/no-unused-vars': 'error',
     'vue/no-use-v-if-with-v-for': 'error',
+    'vue/no-watch-after-await': 'error',
     'vue/require-component-is': 'error',
     'vue/require-prop-type-constructor': 'error',
     'vue/require-render-return': 'error',

lib/rules/no-watch-after-await.js

@@ -11,7 +11,7 @@ module.exports = {
     type: 'suggestion',
     docs: {
       description: 'disallow asynchronously registered `watch`',
-      category: undefined,
+      categories: ['vue3-essential'],
       url: 'https://eslint.vuejs.org/rules/no-watch-after-await.html'
     },
     fixable: null,
@@ -45,6 +45,9 @@ module.exports = {
               [ReferenceTracker.ESM]: true,
               watch: {
                 [ReferenceTracker.CALL]: true
+              },
+              watchEffect: {
+                [ReferenceTracker.CALL]: true
               }
             }
           }

tests/lib/rules/no-watch-after-await.js

@@ -41,6 +41,21 @@ tester.run('no-watch-after-await', rule, {
       </script>
       `
     },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      import {watch, watchEffect} from 'vue'
+      export default {
+        async setup() {
+          watchEffect(() => { /* ... */ })
+          watch(() => { /* ... */ })
+          await doSomething()
+        }
+      }
+      </script>
+      `
+    },
     {
       filename: 'test.vue',
       code: `
@@ -82,6 +97,32 @@ tester.run('no-watch-after-await', rule, {
         }
       ]
     },
+    {
+      filename: 'test.vue',
+      code: `
+      <script>
+      import {watch, watchEffect} from 'vue'
+      export default {
+        async setup() {
+          await doSomething()
+
+          watchEffect(() => { /* ... */ })
+          watch(() => { /* ... */ })
+        }
+      }
+      </script>
+      `,
+      errors: [
+        {
+          messageId: 'forbidden',
+          line: 8
+        },
+        {
+          messageId: 'forbidden',
+          line: 9
+        }
+      ]
+    },
     {
       filename: 'test.vue',
       code: `