duplicate-id-aria
ARIAで参照されるIDは一意である必要があります
ARIAのID参照属性(aria-labelledby、aria-describedby、aria-owns、aria-controls、aria-activedescendant、aria-flowto、aria-errormessage、aria-details)で参照されるidの値が、文書内で一意であることを確認します。
適用範囲:文書に、空でないaria-labelledby、aria-describedby、aria-owns、aria-controls、aria-activedescendant、aria-flowto、aria-errormessage、aria-details属性が少なくとも1つある場合(つまり解決すべきARIAのID参照が少なくとも1つある場合)に適用されます。
期待される結果:これらの属性で参照されるidの値のそれぞれについて、そのidを持つ要素が文書内にちょうど1つあります。重複していても参照は壊れません。ツリー順で最初の要素に解決されるため、名前は引き続き算出されます。その要素が意図したターゲットかどうかは作成者の意図次第で、マークアップにはその情報がないため、判定結果はcantTellになります。
検出結果が報告する内容:
id:ARIA属性が参照している、重複したidです。duplicateCount:文書内でそのidを持つ要素の数です。
これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。
例
<span id="lbl">Name</span><input type="text" aria-labelledby="lbl">
IDlblは一意なので、参照は曖昧さなく解決されます。
<span id="lbl">Name</span><span id="lbl">Duplicate</span><input type="text" aria-labelledby="lbl">
aria-labelledby="lbl"はそのIDを持つ最初の要素に解決されます。それが意図したターゲットかどうかは作成上の問題で、マークアップからは判断できません。
確認方法
このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。
DUPLICATE_ID_ARIA_REFERENCED
- レポートに示された要素を調べ、ARIA属性と、それが参照する重複したidを控えてください。
- 開発者ツールでマークアップからid="the-id"を検索し、それを持つ各要素とそのテキストを控えてください。ブラウザーは最初のものを使います。
- 参照元の要素についてブラウザーの開発者ツールでアクセシビリティペインを開き、得られる名前または説明を読んでください。
- それを画面上で要素の隣にあるテキスト(たとえば、その要素自身のカードのタイトル)と比べてください。
満たす場合:名前または説明が意図された要素から得られているか、重複しているすべての要素が同じテキストを持っています。
満たさない場合:参照元の要素が誤った要素からテキストを得ています。たとえば、カード2にカード1のタイトルで名前が付いており、WCAG 4.1.2(および1.3.1)を満たしません。