Dropdown Itemのaria-checkedをcheckboxタイプ限定に修正

wa-dropdown-itemコンポーネントで、type="checkbox"以外の通常メニューアイテムに誤ってaria-checked属性が付与されていた問題を修正しました。これにより、aria-allowed-attr規則に違反するアクセシビリティ問題が解消されます。

背景

通常のwa-dropdown-item（role="menuitem"）にaria-checked属性が付与されるというアクセシビリティ違反が報告されていました（#2179）。WAI-ARIAの仕様では、aria-checkedはrole="menuitemcheckbox"にのみ有効な属性であり、role="menuitem"に付与することは不正です。

Issue #2179 によれば、この問題はchecked属性のデフォルト値がfalseに設定されていることに起因しています。これによりtypeがcheckboxでないアイテムに対してもaria-checked="false"が書き込まれていました。公式ドキュメントのDropdownページで実際に再現可能であり、通常のメニューアイテムを開発者ツールで確認するとaria-checked=falseが付与された状態になっていました。

技術的な変更

updated()メソッド内の2箇所に条件分岐を追加し、aria-checkedの操作をtype === 'checkbox'の場合のみに限定しました。

checkedプロパティ変更時の処理（変更前）:

if (changedProperties.has('checked')) {
  this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
  this.customStates.set('checked', this.checked);
}

checkedプロパティ変更時の処理（変更後）:

if (changedProperties.has('checked')) {
  if (this.type === 'checkbox') {
    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
  } else {
    this.removeAttribute('aria-checked');
  }
  this.customStates.set('checked', this.checked);
}

typeプロパティ変更時の処理（変更後）:

if (changedProperties.has('type')) {
  if (this.type === 'checkbox') {
    this.setAttribute('role', 'menuitemcheckbox');
    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
  } else {
    this.setAttribute('role', 'menuitem');
    this.removeAttribute('aria-checked');
  }
}

type変更時の処理ではaria-checkedの追加・削除も同時に行うようになりました。これにより、typeがcheckboxからnormalへ（またはその逆へ）動的に切り替わった場合も、roleとaria-checkedが常に整合した状態になります。

あわせて4つのテストケースが追加されています：

• 通常アイテムにaria-checkedが存在しないこと
• type="checkbox"のアイテムにaria-checked="false"が付与されること
• type="checkbox" checkedのアイテムにaria-checked="true"が付与されること
• typeをcheckboxからnormalに変更したときaria-checkedが削除されること

まとめ

本PRは、checked属性のデフォルト値に起因するアクセシビリティ違反を、最小限の条件分岐で修正したものです。typeとcheckedの両変更ハンドラにガードを配置することで、動的なtype切り替えを含むあらゆるケースでroleとaria-checkedの整合性が保証されるようになりました。