Namn, roll, värde

Vad kriteriet kräver

För alla användargränssnittskomponenter kan namn och roll programmatiskt bestämmas; tillstånd, egenskaper och värden kan programmatiskt sättas.

Hur Granska kontrollerar

Vi flaggar custom-komponenter (dropdowns, tabs, accordions, modals) utan rätt role, aria-expanded, aria-selected etc.

Vanliga felmönster

• <div> som beter sig som button utan role=button
• Tabs utan role="tablist"/"tab"/"tabpanel"
• Accordion-toggles utan aria-expanded

Kodfix-exempel (Next.js)

Granska genererar liknande fixar anpassade per stack. Det här är ett representativt exempel.

<button
  type="button"
  aria-expanded={open}
  aria-controls={`panel-${id}`}
  onClick={() => setOpen(!open)}
>
  {label}
</button>
<div id={`panel-${id}`} hidden={!open}>
  {children}
</div>