🆙 update(no-missing-keys): support i18n functional component

Author: kazupon

docs/rules/no-missing-keys.md

@@ -15,6 +15,7 @@ You can be detected with this rule the following:
 - `$tc`
 - `tc`
 - `v-t`
+- `<i18n>` 
 
 :-1: Examples of **incorrect** code for this rule:
 
@@ -34,6 +35,8 @@ localization codes:
     <p>{{ $t('hi) }}</p>
     <!-- ✗ BAD -->
     <p v-t="'hi'"></p>
+    <!-- ✗ BAD -->
+    <i18n path="hi" tag="p"></i18n>
   </div>
 </template>
 ```
@@ -68,6 +71,8 @@ localization codes:
     <p>{{ $t('hello') }}</p>
     <!-- ✗ GOOD -->
     <p v-t="'hello'"></p>
+    <!-- ✗ GOOD -->
+    <i18n path="hello" tag="p"></i18n>
   </div>
 </template>
 ```

lib/rules/no-missing-keys.js

@@ -34,6 +34,14 @@ function create (context) {
       checkDirective(context, localeDir, localeMessages, node)
     },
 
+    "VElement[name=i18n] > VStartTag > VAttribute[key.name='path']" (node) {
+      checkComponent(context, localeDir, localeMessages, node)
+    },
+
+    "VElement[name=i18n] > VStartTag > VAttribute[key.name.name='path']" (node) {
+      checkComponent(context, localeDir, localeMessages, node)
+    },
+
     CallExpression (node) {
       checkCallExpression(context, localeDir, localeMessages, node)
     }
@@ -59,6 +67,20 @@ function checkDirective (context, localeDir, localeMessages, node) {
   }
 }
 
+function checkComponent (context, localeDir, localeMessages, node) {
+  if (node.value && node.value.type === 'VLiteral') {
+    const key = node.value.value
+    if (!key) {
+      // TODO: should be error
+      return
+    }
+    const missings = findMissingsFromLocaleMessages(localeMessages, key, localeDir)
+    if (missings.length) {
+      missings.forEach(missing => context.report({ node, ...missing }))
+    }
+  }
+}
+
 function checkCallExpression (context, localeDir, localeMessages, node) {
   const funcName = (node.callee.type === 'MemberExpression' && node.callee.property.name) || node.callee.name
 

tests/lib/rules/no-missing-keys.js

@@ -91,6 +91,18 @@ tester.run('no-missing-keys', rule, {
       `'missing' does not exist in '${resolve('en.json')}'`,
       `'missing' does not exist in '${resolve('ja.json')}'`
     ]
+  }, {
+    // using <i18n> functional component in template block
+    settings,
+    code: `<template>
+      <div id="app">
+        <i18n path="missing"/>
+      </div>
+    </template>`,
+    errors: [
+      `'missing' does not exist in '${resolve('en.json')}'`,
+      `'missing' does not exist in '${resolve('ja.json')}'`
+    ]
   }, {
     // settings.vue-i18n.localeDir' error
     code: `$t('missing')`,