feat: add disableAttrs and skipAttrs support (#59)

* feat: add disableAttrs and skipAttrs support

* fix: doc example code

* fix: config issue

lib/rules/forbid-tags.js

@@ -10,7 +10,7 @@ module.exports = {
     fixable: null,
     messages: {
       forbiddenTag: "<{{tag}}> is forbidden",
-      forbiddenTagWithMessage: "<{{tag}}> is forbidden, {{message}}",
+      forbiddenTagWithMessage: "{{message}}",
     },
     schema: [
       {
@@ -30,6 +30,26 @@ module.exports = {
                   required: ["tag"],
                   additionalProperties: false,
                 },
+                {
+                  type: "object",
+                  properties: {
+                    tag: { type: "string" },
+                    message: { type: "string" },
+                    disableAttrs: { type: "array" },
+                  },
+                  required: ["tag", "disableAttrs"],
+                  additionalProperties: false,
+                },
+                {
+                  type: "object",
+                  properties: {
+                    tag: { type: "string" },
+                    message: { type: "string" },
+                    skipAttrs: { type: "array" },
+                  },
+                  required: ["tag", "skipAttrs"],
+                  additionalProperties: false,
+                },
               ],
             },
           },
@@ -52,11 +72,40 @@ module.exports = {
       }
     });
     return {
-      WXElement(node) {
+      WXStartTag(node) {
         if (node && node.name && indexedForbidConfigs[node.name]) {
           const msg = indexedForbidConfigs[node.name].message;
+          const disableAttrs =
+            indexedForbidConfigs[node.name].disableAttrs || [];
+          const skipAttrs = indexedForbidConfigs[node.name].skipAttrs || [];
+          const attrs = new Set(
+            (node.attributes || []).map((attr) => attr.key)
+          );
+
+          if (disableAttrs.length) {
+            if (disableAttrs.some((attr) => attrs.has(attr))) {
+              context.report({
+                node: node,
+                messageId: "forbiddenTagWithMessage",
+                data: {
+                  tag: node.name,
+                  message: msg
+                    ? msg
+                    : `If you need to use the following attributes [${disableAttrs.join(
+                        ", "
+                      )}], you can't use <${node.name} />`,
+                },
+              });
+            }
+            return;
+          }
+
+          if (skipAttrs.length && skipAttrs.some((attr) => attrs.has(attr))) {
+            return;
+          }
+
           context.report({
-            node: node.startTag ? node.startTag : node,
+            node: node,
             messageId: msg ? "forbiddenTagWithMessage" : "forbiddenTag",
             data: { tag: node.name, message: msg },
           });

tests/rules/forbid-tags.js

@@ -19,6 +19,14 @@ tester.run("forbid-tags", rule, {
       code: "<Button />",
       options: [{ forbid: [{ tag: "button" }] }],
     },
+    {
+      code: "<view hover-class='button' />",
+      options: [{ forbid: [{ tag: "view", skipAttrs: ["hover-class"] }] }],
+    },
+    {
+      code: "<v class='button' />",
+      options: [{ forbid: [{ tag: "v", disableAttrs: ["hover-class"] }] }],
+    },
   ],
   invalid: [
     {
@@ -72,5 +80,36 @@ tester.run("forbid-tags", rule, {
         },
       ],
     },
+    {
+      code: "<view main='button' />",
+      options: [
+        {
+          forbid: [
+            {
+              tag: "view",
+              message:
+                "<view> is forbidden, but if you want to set hover-class you must use <view />",
+              skipAttrs: ["hover-class", "hover-start-time"],
+            },
+          ],
+        },
+      ],
+      errors: [
+        `<view> is forbidden, but if you want to set hover-class you must use <view />`,
+      ],
+    },
+    {
+      code: "<v hover-class='button' />",
+      options: [
+        {
+          forbid: [
+            { tag: "v", disableAttrs: ["hover-class", "hover-start-time"] },
+          ],
+        },
+      ],
+      errors: [
+        `If you need to use the following attributes [hover-class, hover-start-time], you can't use <v />`,
+      ],
+    },
   ],
 });

website/docs/rules/forbid-tags.md

@@ -53,16 +53,86 @@ You may want to forbid usage of certain tags in favor of others, (e.g. forbid al
 
 </eslint-code-block>
 
+```js
+// following code use this config
+{
+  "wxml/forbid-tags": [
+    "error",
+    {
+      "forbid":
+      [
+        {
+          "tag": "view",
+          "message": "If you need use hover-class you should use <view /> otherwise use <v />",
+          "skipAttrs": ["hover-class"]
+        }
+      ]
+    }
+  ]
+}
+```
+
+<eslint-code-block :rules="{'wxml/forbid-tags': ['error', { forbid: [{ tag: 'view', message: 'If you need use hover-class you should use <view /> otherwise use <v />', skipAttrs: ['hover-class'] } ] }]}" >
+
+```wxml
+<!-- ✓ GOOD -->
+<view hover-class='button'>text</view>
+
+<!-- ✗ BAD -->
+<view class='button'>text</view>
+```
+
+</eslint-code-block>
+
+```js
+// following code use this config
+{
+  "wxml/forbid-tags": [
+    "error",
+    {
+      "forbid":
+      [
+        {
+          "tag": "v",
+          "message": "If you need use hover-class you should use <view /> otherwise use <v />",
+          "disableAttrs": ["hover-class"]
+        }
+      ]
+    }
+  ]
+}
+```
+
+<eslint-code-block :rules="{'wxml/forbid-tags': ['error', { forbid: [{ tag: 'v', message: 'If you need use hover-class you should use <view /> otherwise use <v />', disableAttrs: ['hover-class'] } ] }]}" >
+
+```wxml
+<!-- ✓ GOOD -->
+<v class='button' />
+<v class='button' />text</v>
+
+<!-- ✗ BAD -->
+<v hover-class='button' />
+<v hover-class='button'>text</v>
+```
+
+</eslint-code-block>
+
 ::: tip 💡 tips
 
 You can edit code via online editor, it's online REPL, try to fix eslint problem !
 
 :::
 
+## History
+
+| Version | Changes
+|:---|:---|
+| v0.7.5 | Add `disableAttrs` and `skipAttrs` config support |
+
 ## Config
 
 ```typescript
-"wxml/forbid-tags": [<enabled>, { "forbid": [<string|{ tag: string, message: string }>] }]
+"wxml/forbid-tags": [<enabled>, { "forbid": [<string|{ tag: string, message?: string, disableAttrs?: string[], skipAttrs?: string[] }>] }]
 ```
 
 ## Version