listitem-parent-valid

リスト項目はリストコンテナーの中にある必要があります

automaticWCAG 1.3.1 (A)確度:high重大度:seriousperceivable

<li>要素が<ul>、<ol>、<menu>、またはrole="list"を持つ要素に含まれていることを確認します。

適用範囲:親要素を持つ<li>要素に適用されます。

期待される結果:親要素が、ロールの上書きのない<ul>/<ol>/<menu>(3つとも暗黙のロールはlist)、または明示的なロールが"list"、"directory"(非推奨ですが、WAI-ARIA 1.2ではlistitemの必須の親です)、"presentation"、"none"の要素です。本物のリストコンテナーの外で使われた<li>(例:<div>の下の汎用的なflex/gridの項目)は、支援技術にリスト項目として公開されません。

検出結果が報告する内容:

  • reasonCode:親が、明示的なロールでlistを置き換えた<ul>、<ol>、<menu>(<ul role="tablist">)である場合はLIST_ROLE_OVERRIDDEN、それ以外はLISTITEM_INVALID_PARENTです。どちらもfailになります。
  • parentElement:<li>の親のタグ名で、リストの代わりに<li>を含んでいるコンテナーです。
  • parentRole:LIST_ROLE_OVERRIDDENの場合、親のロールです。
  • parentElementは、data.detailsのほかのフィールドと異なり、安定した契約です。

これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。

例

pass
<ul>
<li>Apple</li>
</ul>

<li>が<ul>の中にあります。

fail
<div>
<li>Date</li>
</div>

<li>に<ul>/<ol>/role="list"の祖先がありません。

ソースコードを見る