dlitem-parent-valid
Description-list items must be inside a description list
Checks that <dt>/<dd> elements are contained by a <dl>, directly or via one wrapping <div>.
Applies to. Applies to <dt>/<dd> elements that have a parent element in the flat tree, as the page renders it: a <dt>/<dd> slotted into a shadow <dl><slot></slot></dl> is in that list, and a <slot> in between is seen through. A <dt>/<dd> a shadow host doesn't slot is not rendered and is left out.
Expectation. The parent is <dl>, or the parent is a <div> whose own parent is <dl> (a single level of wrapping div is allowed, matching how authors commonly group dt/dd pairs). A <dt>/<dd> used outside a real description-list container keeps its term or definition role, but no list pairs it with the definition or term that goes with it. Every finding is reported at CANTTELL, not FAIL. HTML-AAM gives <dt> and <dd> their term and definition roles wherever they sit, so what a broken content model loses is the pairing of terms with definitions, which only the <dl>'s structure and order state. That is a WCAG failure (SC 1.3.1) only where the page shows the pairing, and H40 is only a sufficient technique: a person settles it.
What a finding reports.
parentElement: the tag name of the element's parent, the container it is in instead of a<dl>.
These data.details fields help to read and reproduce a finding. Apart from reasonCode and the few fields Output schema names as stable, they are not a stable contract: a field may be renamed or dropped in a minor release, so don’t build on them.
Examples
<dl><dt>Term</dt><dd>Definition</dd></dl>
Both dt and dd are inside a <dl> ancestor.
<div><dt>orphan</dt></div>
<dt> has no <dl> ancestor at all. It keeps its term role, so whether a WCAG criterion fails depends on whether the page shows it paired with a definition.
How to check
When this rule can’t decide, it reports cantTell and leaves the question to a person. Each question it can ask is listed here under its reason code, with the steps to answer it. A finding carries the same steps as howToCheck, in the scan’s language. See Output schema.
DLITEM_INVALID_PARENT
- Inspect the <dt> or <dd> the report names and note that no <dl> contains it.
- Look at how the page shows the terms and definitions: whether each definition is shown as belonging to a term, by position, indentation or style.
- With a screen reader, read the content and note whether each definition is announced with the term it belongs to.
Pass. The page shows no pairing that the markup loses: the terms and definitions are not shown as belonging together, or the markup still pairs them. Still fix the markup: HTML does not allow it.
Fail. The page shows a definition belonging to a term that the markup does not pair it with, so that relationship is not programmatically determinable (WCAG 1.3.1).