eslint-plugin-crisp 1.4.19 → 1.4.20

package/README.md

@@ -226,6 +226,7 @@ Each item has emojis denoting:
 | [crisp/vue-header-check](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-header-check.js) | Ensures `script`, `template` and `style` tags start with corresponding comment block |  | 🟢 |
 | [crisp/vue-html-indent](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-html-indent.js) | Enforces consistent indentation in `template` (supports for Pug) |  | 🟢 |
 | [crisp/vue-html-quotes](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-html-quotes.js) | Enforces HTML attributes to be enclosed with double quotes |  | 🟢 |
+| [crisp/vue-no-name-option](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-no-name-option.js) | Disallows explicit component names in Vue single-file components |  | 🟢 |
 | [crisp/vue-no-regex-data](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-no-regex-data.js) | Disallows regular expressions to be declared in Vue data object |  | 🟢 |
 | [crisp/vue-props-declaration-line-break](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-props-declaration-line-break.js) | Enforces line break between type and default function in prop definition |  | 🟢 |
 | [crisp/vue-props-declaration-multiline](https://github.com/crisp-oss/eslint-plugin-crisp/blob/master/rules/vue-props-declaration-multiline.js) | Enforces props declarations to be multiline |  | 🟢 |

package/index.js

@@ -52,6 +52,7 @@ import ruleVueHtmlIndent from "./rules/vue-html-indent.js";
 import ruleVueHtmlQuotes from "./rules/vue-html-quotes.js";
 import ruleVueMethodsSeparator from "./rules/vue-methods-separator.js";
 import ruleVueNameProp from "./rules/vue-name-prop.js";
+import ruleVueNoNameOption from "./rules/vue-no-name-option.js";
 import ruleVueNoRegexData from "./rules/vue-no-regex-data.js";
 import ruleVuePropsDeclarationLineBreak from "./rules/vue-props-declaration-line-break.js";
 import ruleVuePropsDeclarationMultiline from "./rules/vue-props-declaration-multiline.js";
@@ -122,6 +123,7 @@ const plugin = {
     "vue-html-quotes": ruleVueHtmlQuotes,
     "vue-methods-separator": ruleVueMethodsSeparator,
     "vue-name-prop": ruleVueNameProp,
+    "vue-no-name-option": ruleVueNoNameOption,
     "vue-no-regex-data": ruleVueNoRegexData,
     "vue-props-declaration-line-break": ruleVuePropsDeclarationLineBreak,
     "vue-props-declaration-multiline": ruleVuePropsDeclarationMultiline,

package/package.json

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

package/recommended-vue.js

@@ -391,6 +391,7 @@ export default function configRecommendedVue(pluginCrisp) {
         "crisp/vue-html-quotes": "error",
         "crisp/vue-methods-separator": "error",
         "crisp/vue-name-prop": "error",
+        "crisp/vue-no-name-option": "error",
         "crisp/vue-no-regex-data": "error",
         "crisp/vue-props-declaration-line-break": "error",
         "crisp/vue-props-declaration-multiline": "error",

package/rules/vue-no-name-option.js

@@ -0,0 +1,108 @@
+export default {
+  meta: {
+    type: "suggestion",
+    docs: {
+      description: "disallow explicit names in Vue single-file components",
+      category: "Best Practices",
+      recommended: false
+    },
+    fixable: "code",
+    schema: []
+  },
+
+  create(context) {
+    const fileName = (context.filename || context.getFilename()).replace(/\\/g, "/");
+
+    if (!fileName.endsWith(".vue")) {
+      return {};
+    }
+
+    return {
+      ExportDefaultDeclaration(node) {
+        const componentOptions = getComponentOptions(node.declaration);
+
+        if (!componentOptions) {
+          return;
+        }
+
+        componentOptions.properties.forEach((property) => {
+          if (!isNameProperty(property)) {
+            return;
+          }
+
+          context.report({
+            node: property,
+            message: "Vue single-file components must rely on their inferred filename.",
+
+            fix(fixer) {
+              return removeProperty(fixer, context, componentOptions, property);
+            }
+          });
+        });
+      }
+    };
+  }
+};
+
+// Returns the component options passed to defineComponent()
+function getComponentOptions(node) {
+  if (!isDefineComponentCall(node)) {
+    return null;
+  }
+
+  const options = node.arguments[0];
+
+  return options?.type === "ObjectExpression" ? options : null;
+}
+
+// Returns whether the node is a defineComponent() call
+function isDefineComponentCall(node) {
+  if (!node || node.type !== "CallExpression") {
+    return false;
+  }
+
+  if (node.callee.type === "Identifier") {
+    return node.callee.name === "defineComponent";
+  }
+
+  return (
+    node.callee.type === "MemberExpression" &&
+    node.callee.property.type === "Identifier" &&
+    node.callee.property.name === "defineComponent"
+  );
+}
+
+// Returns whether the property is the component name option
+function isNameProperty(property) {
+  if (property.type !== "Property") {
+    return false;
+  }
+
+  if (property.key.type === "Identifier") {
+    return property.key.name === "name";
+  }
+
+  return property.key.type === "Literal" && property.key.value === "name";
+}
+
+// Removes a property and its adjacent comma
+function removeProperty(fixer, context, options, property) {
+  const sourceCode = context.sourceCode || context.getSourceCode();
+  const nextToken = sourceCode.getTokenAfter(property);
+
+  if (nextToken?.value === ",") {
+    return fixer.removeRange([property.range[0], nextToken.range[1]]);
+  }
+
+  const propertyIndex = options.properties.indexOf(property);
+
+  if (propertyIndex > 0) {
+    const previousToken = sourceCode.getTokenBefore(property);
+
+    if (previousToken?.value === ",") {
+      return fixer.removeRange([previousToken.range[0], property.range[1]]);
+    }
+  }
+
+  return fixer.remove(property);
+}