eslint-plugin-smarthr - npm Package Compare versions

Comparing version 0.2.23 to 0.2.24

CHANGELOG.md

@@ -5,2 +5,9 @@ # Changelog
 
+### [0.2.24](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.2.23...v0.2.24) (2023-03-10)
+
+
+### Features
+
+* next.js, react-routerのLinkコンポーネントに対応するオプションを追加 ([#59](https://github.com/kufu/eslint-plugin-smarthr/issues/59)) ([88996e8](https://github.com/kufu/eslint-plugin-smarthr/commit/88996e88dfd4c14bfaaa36594663737d47f1f029))
+
 ### [0.2.23](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.2.22...v0.2.23) (2023-03-09)
@@ -7,0 +14,0 @@

package.json

 {
   "name": "eslint-plugin-smarthr",
-  "version": "0.2.23",
+  "version": "0.2.24",
   "author": "SmartHR",
@@ -5,0 +5,0 @@ "license": "MIT",

rules/a11y-anchor-has-href-attribute/index.js

@@ -10,27 +10,77 @@ const { generateTagFormatter } = require('../../libs/format_styled_components')
 const REGEX_TARGET = /(Anchor|Link|^a)$/
-const findHref = (a) => a.name?.name == 'href'
+const check = (node, option) => {
+  let result = baseCheck(node)
 
+  if (
+    result && (
+      (option.nextjs && !nextCheck(node)) ||
+      (option.react_router && !reactRouterCheck(node))
+    )
+  ) {
+    result = null
+  }
+
+  return result
+}
+const baseCheck = (node) => {
+  const nodeName = node.name.name || ''
+
+  if (nodeName.match(REGEX_TARGET)) {
+    const href = node.attributes.find((a) => a.name?.name == 'href')
+
+    if (!href || !href.value) {
+      return nodeName
+    }
+  }
+
+  return false
+}
+const nextCheck = (node) => {
+  // HINT: next/link で `Link>a` という構造がありえるので直上のJSXElementを調べる
+  const target = node.parent.parent.openingElement
+
+  if (target) {
+    return baseCheck(target)
+  }
+
+  return false
+}
+const reactRouterCheck = (node) => {
+  const href = node.attributes.find((a) => a.name?.name == 'to')
+
+  return !href || !href.value
+}
+
+const SCHEMA = [
+  {
+    type: 'object',
+    properties: {
+      nextjs: { type: 'boolean' },
+      react_router: { type: 'boolean' },
+    },
+    additionalProperties: false,
+  }
+]
+
 module.exports = {
   meta: {
     type: 'problem',
-    schema: [],
+    schema: SCHEMA,
   },
   create(context) {
+    const option = context.options[0] || {}
+
     return {
       ...generateTagFormatter({ context, EXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
-        const nodeName = node.name.name || ''
+        const nodeName = check(node, option)
 
-        if (nodeName.match(REGEX_TARGET)) {
-          const href = node.attributes.find(findHref)
-
-          if (!href || !href.value) {
-            context.report({
-              node,
-              message: `${nodeName} に href 属性を設定してください。
+        if (nodeName) {
+          context.report({
+            node,
+            message: `${nodeName} に href 属性を設定してください。
  - onClickなどでページ遷移する場合、href属性に遷移先のURIを設定してください。Cmd + clickなどのキーボードショートカットに対応出来ます。
  - onClickなどの動作がURLの変更を行わない場合、リンクではなくbuttonでマークアップすることを検討してください。
  - リンクを無効化することを表したい場合、href属性に undefined を設定してください。`,
-            })
-          }
+          })
         }
@@ -41,2 +91,2 @@ },
 }
-module.exports.schema = []
+module.exports.schema = SCHEMA

rules/a11y-anchor-has-href-attribute/README.md

@@ -15,3 +15,9 @@ # smarthr/a11y-anchor-has-href-attribute
   rules: {
-    'smarthr/a11y-anchor-has-href-attribute': 'error', // 'warn', 'off'
+    'smarthr/a11y-anchor-has-href-attribute': [
+      'error', // 'warn', 'off'
+      // {
+      //   nextjs: true,
+      //   react_router: true,
+      // },
+    ]
   },
@@ -36,2 +42,8 @@ }
 <XxxLink href={undefined}>any</XxxLink>
+
+// nextjs: true
+<Link href={hoge}><a>any</a></Link>
+
+// react_router: true
+<Link to={hoge}>any</Link>
 ```

test/a11y-anchor-has-href-attribute.js

@@ -44,2 +44,10 @@ const rule = require('../rules/a11y-anchor-has-href-attribute')
     },
+    {
+      code: `<Link href="hoge"><a>ほげ</a></Link>`,
+      options: [{ nextjs: true }],
+    },
+    {
+      code: `<Link to="hoge">ほげ</Link>`,
+      options: [{ react_router: true }],
+    },
   ],
@@ -56,3 +64,6 @@ invalid: [
     { code: `<HogeLink href>hoge</HogeLink>`, errors: [{ message: generateErrorText('HogeLink') }] },
+    { code: `<HogeLink href="hoge"><a>hoge</a></HogeLink>`, errors: [{ message: generateErrorText('a') }] },
+    { code: `<HogeLink><a>hoge</a></HogeLink>`, options: [{ nextjs: true }], errors: [{ message: generateErrorText('a') }] },
+    { code: `<HogeLink to="hoge">hoge</HogeLink>`, errors: [{ message: generateErrorText('HogeLink') }] },
   ]
 })

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

178520

increased by1.17%

Lines of code

3454

increased by1.53%

No dependency changes