feat: Inputにreact-hook-formのregisterが指定されている場合はエラーにならないようにする

kufu · Jan 15, 2025 · fabb54b · fabb54b
1 parent 2382b60
commit fabb54b
Showing 1 changed file with 34 additions and 7 deletions.
diff --git a/packages/eslint-plugin-smarthr/rules/a11y-input-has-name-attribute/index.js b/packages/eslint-plugin-smarthr/rules/a11y-input-has-name-attribute/index.js
@@ -1,5 +1,25 @@
+const JSON5 = require('json5');
+const fs = require('fs');
 const { generateTagFormatter } = require('../../libs/format_styled_components');
 
+const OPTION = (() => {
+  const file = `${process.cwd()}/package.json`;
+
+  if (!fs.existsSync(file)) {
+    return {};
+  }
+
+  const json = JSON5.parse(fs.readFileSync(file));
+  const dependencies = [
+    ...Object.keys(json.dependencies || {}),
+    ...Object.keys(json.devDependencies || {}),
+  ];
+
+  return {
+    react_hook_form: dependencies.includes('react-hook-form'),
+  };
+})();
+
 const EXPECTED_NAMES = {
   '(i|I)nput$': 'Input$',
   '(t|T)extarea$': 'Textarea$',
@@ -9,7 +29,7 @@ const EXPECTED_NAMES = {
   'RadioButtonPanel$': 'RadioButtonPanel$',
   'Check(b|B)ox$': 'CheckBox$',
   'Combo(b|B)ox$': 'ComboBox$',
-  '(Date|Wareki)Picker$': '(Date|Wareki)Picker$',
+  'DatePicker$': 'DatePicker$',
   'TimePicker$': 'TimePicker$',
   'DropZone$': 'DropZone$',
 }
@@ -21,6 +41,7 @@ const RADIO_BUTTON_REGEX = /RadioButton(Panel)?$/
 const findNameAttr = (a) => a?.name?.name === 'name'
 const findSpreadAttr = (a) => a.type === 'JSXSpreadAttribute'
 const findRadioInput = (a) => a.name?.name === 'type' && a.value.value === 'radio'
+const findReactHookFormRegisterSpreadAttr = (a) => a.type === 'JSXSpreadAttribute' && a.argument?.callee?.name === 'register'
 
 const MESSAGE_PART_FORMAT = `"${INPUT_NAME_REGEX.toString()}"にmatchするフォーマットで命名してください`
 const MESSAGE_UNDEFINED_NAME_PART = `
@@ -56,20 +77,26 @@ module.exports = {
     return {
       ...generateTagFormatter({ context, EXPECTED_NAMES }),
       JSXOpeningElement: (node) => {
-        const nodeName = node.name.name || '';
+        const { name, attributes } = node;
+        const nodeName = name.name || '';
 
         if (nodeName.match(TARGET_TAG_NAME_REGEX)) {
-          const nameAttr = node.attributes.find(findNameAttr)
+          const nameAttr = attributes.find(findNameAttr)
 
           if (!nameAttr) {
             if (
-              node.attributes.length === 0 ||
-              checkType !== 'allow-spread-attributes' ||
-              !node.attributes.some(findSpreadAttr)
+              !(
+                OPTION.react_hook_form &&
+                attributes.some(findReactHookFormRegisterSpreadAttr)
+              ) &&
+              (attributes.length === 0 ||
+                checkType !== 'allow-spread-attributes' ||
+                !attributes.some(findSpreadAttr))
             ) {
               const isRadio =
                 nodeName.match(RADIO_BUTTON_REGEX) ||
-                (nodeName.match(INPUT_TAG_REGEX) && node.attributes.some(findRadioInput));
+                (nodeName.match(INPUT_TAG_REGEX) &&
+                  attributes.some(findRadioInput));
 
               context.report({
                 node,