fix: [a11y-input-has-name-attribute]Inputにreact-hook-formのregisterが指定されている場合はエラーにならないようにする

[yamakeeeeeeeeen]

やりたいこと

• ESLintプラグイン「a11y-input-has-name-attribute」は、Input に name 属性が指定されていない場合にエラーを出力します。
• react-hook-form を使用する際、register 関数の引数で name を指定することで との紐づけを行いますが、現行ルールでは以下のようなコードもエラーとして扱われてしまいます：
  • <Input {...register('name')} />
• この問題を解消し、react-hook-form の register 関数が使用されている場合は name 属性を明示的に渡さなくてもエラーにならないようにしたいと考えています。

やったこと

• Input に react-hook-form の register 関数が渡されている場合は、エラーを出さないように ESLint のルールを修正しました。

[AtsushiM]

ロジック自体は大丈夫そうですが、attributesに対するチェックを最適化すると良いかも。
今の方法だと複数回attributesに対して操作が走る可能性があります。

let nameAttr = null
let hasSpreadAttr = false
let hasReactHookFormRegisterSpreadAttr = false
let hasRadioInput = false

attributes.forEach((attr) => {
  if (a.type === 'JSXSpreadAttribute') {
    hasSpreadAttr = true
    
    if (hasReactHookFormRegisterSpreadAttr == false && a.argument?.callee?.name === 'register') {
      hasReactHookFormRegisterSpreadAttr = true
    }
  } else {
    switch (a.name?.name) {
      case 'name': {
        nameAttr = a
        break
      }
      case 'type': {
        if (a.value.value === 'radio') {
          hasRadioInput = true
        }
        break
      }
    }
  }
})

[AtsushiM]

この方法ならattributesに対する検査は1loopだけで済むので高速化できます

[yamakeeeeeeeeen]

@AtsushiM 添付のコードにあるhasSpreadAttrやhasRadioInputにはbooleanを代入するだけでどこでも使われていないようなのですが、どういった意味があるのでしょうか？

[AtsushiM]

@yamakeeeeeeeeen
以下の箇所で都度someをしている箇所を置き換える想定です。
https://github.com/kufu/tamatebako/pull/490/files#diff-9bc6cdcc4ece3aff163a028a8962d667e77b90463af87f220e4464d8e4f9e3bbR90
https://github.com/kufu/tamatebako/pull/490/files#diff-9bc6cdcc4ece3aff163a028a8962d667e77b90463af87f220e4464d8e4f9e3bbR99

現在のロジックではattributes配列に対して、最大3回ループする可能性があり、処理が重いので1oopですべての計算を済ませてしまえば軽くなるよね！という感じの対応です

[AtsushiM]

もともと nameAttr を生成するためにattributesを一度はループする必要があるので、そのついでに他の計算もしてしまおう、という発想です