eslint-plugin-crisp 1.5.2 → 1.5.3

package/index.js

@@ -58,6 +58,7 @@ import ruleVuePropsDeclarationLineBreak from "./rules/vue-props-declaration-line
 import ruleVuePropsDeclarationMultiline from "./rules/vue-props-declaration-multiline.js";
 import ruleVuePropsDeclarationOrder from "./rules/vue-props-declaration-order.js";
 import ruleVueRefCase from "./rules/vue-ref-case.js";
+import ruleVueWatchHandler from "./rules/vue-watch-handler.js";
 
 import fs from "fs";
 
@@ -128,7 +129,8 @@ const plugin = {
     "vue-props-declaration-line-break": ruleVuePropsDeclarationLineBreak,
     "vue-props-declaration-multiline": ruleVuePropsDeclarationMultiline,
     "vue-props-declaration-order": ruleVuePropsDeclarationOrder,
-    "vue-ref-case": ruleVueRefCase
+    "vue-ref-case": ruleVueRefCase,
+    "vue-watch-handler": ruleVueWatchHandler
   }
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-crisp",
-  "version": "1.5.2",
+  "version": "1.5.3",
   "description": "Custom ESLint Rules for Crisp",
   "author": "Crisp IM SAS",
   "main": "index.js",

package/recommended-vue.js

@@ -111,11 +111,6 @@ export default function configRecommendedVue(pluginCrisp) {
           {
             "selector": "SwitchCase > *.consequent[type!='BlockStatement']",
             "message": "Switch cases without braces are disallowed."
-          },
-
-          {
-            "selector": "Property[key.name='watch'] > ObjectExpression > Property[value.type='FunctionExpression']",
-            "message": "Watchers must use the object form with a `handler` function."
           }
         ],
         "no-tabs": "error",
@@ -397,7 +392,8 @@ export default function configRecommendedVue(pluginCrisp) {
         "crisp/vue-props-declaration-line-break": "error",
         "crisp/vue-props-declaration-multiline": "error",
         "crisp/vue-props-declaration-order": "error",
-        "crisp/vue-ref-case": "error"
+        "crisp/vue-ref-case": "error",
+        "crisp/vue-watch-handler": "error"
       }
     }
   ];

package/rules/vue-watch-handler.js

@@ -0,0 +1,115 @@
+const VALID_SIGNATURES = [
+  [],
+  ["value"],
+  ["newValue"],
+  ["newValue", "oldValue"]
+];
+
+function getPropertyName(property) {
+  if (property.computed) {
+    return null;
+  }
+
+  if (property.key.type === "Identifier") {
+    return property.key.name;
+  }
+
+  return property.key.value;
+}
+
+function hasValidSignature(handler) {
+  return VALID_SIGNATURES.some((signature) => {
+    return (
+      handler.params.length === signature.length &&
+      handler.params.every((parameter, index) => {
+        return (
+          parameter.type === "Identifier" &&
+          parameter.name === signature[index]
+        );
+      })
+    );
+  });
+}
+
+export default {
+  meta: {
+    type: "suggestion",
+    docs: {
+      description: "enforce Vue watcher handler form and signature",
+      category: "Stylistic Issues",
+      recommended: false
+    },
+    fixable: null,
+    schema: [],
+    messages: {
+      objectForm: "Watchers must use the object form with a `handler` function.",
+      missingHandler: "Watcher objects must define a `handler` function.",
+      invalidHandler: "Watcher `handler` must be a function.",
+      invalidSignature:
+        "Watcher `handler` must use one of these signatures: " +
+        "`handler()`, `handler(value)`, `handler(newValue)`, or " +
+        "`handler(newValue, oldValue)`."
+    }
+  },
+
+  create(context) {
+    return {
+      'Property[key.name="watch"] > ObjectExpression'(node) {
+        node.properties.forEach((watcher) => {
+          if (watcher.type !== "Property") {
+            return;
+          }
+
+          if (watcher.value.type !== "ObjectExpression") {
+            context.report({
+              node: watcher,
+              messageId: "objectForm"
+            });
+
+            return;
+          }
+
+          const handlerProperty = watcher.value.properties.find((property) => {
+            return (
+              property.type === "Property" &&
+              getPropertyName(property) === "handler"
+            );
+          });
+
+          if (!handlerProperty) {
+            context.report({
+              node: watcher,
+              messageId: "missingHandler"
+            });
+
+            return;
+          }
+
+          const handler = handlerProperty.value;
+
+          if (
+            handlerProperty.kind !== "init" ||
+            (
+              handler.type !== "FunctionExpression" &&
+              handler.type !== "ArrowFunctionExpression"
+            )
+          ) {
+            context.report({
+              node: handlerProperty,
+              messageId: "invalidHandler"
+            });
+
+            return;
+          }
+
+          if (!hasValidSignature(handler)) {
+            context.report({
+              node: handlerProperty,
+              messageId: "invalidSignature"
+            });
+          }
+        });
+      }
+    };
+  }
+};