IHK-GfI / lux-components

Other
16 stars 5 forks source link

Barrierefreiheit: lux-tile - ARIA-Attribute ergänzen #358

Closed patrowe closed 1 year ago

patrowe commented 1 year ago

Die Komponente lux-tile ist eine interaktive Schaltfläche. Daher muss sie als solche gekennzeichnet werden, damit sie von den Screen-Readern als solche erkannt wird.

Akzeptanzkriterium Die Komponente hat foglende Attribute erhalten: aria-role = "link" aria-label soll mit dem Wert von "luxLabel" belegt werden aria-description soll mit dem Wert von "luxSubtitel" belegt werden.

patrowe commented 1 year ago

Die Anforderungen wurden umgesetzt. @DSeifer Bitte testen!

Test

Vorbedingungen:

Durchführung Auf der Startseite der Demo mit dem Tab-Key zu der Kachel "Komponenten" navigieren. Sichtbar durch den hellblauen Focus-Ring um die Kachel. Die Ansage des Screenreaders unter Windows soll wie folgt lauten: "Komponenten - Link - Alle Komponenten auf einen Blick"

Voice-Over unter MacOs unterstütz die aria-description nicht vollständig, daher lautet die Ansage nur: "Komponenten - Link"

DSeifer commented 1 year ago

Unter Windows 10 Enterprise 22H2 (19045.3324) und MacOS 13.5.2 mit den jeweils aktuellen Browserversionen nachgetestet: MacOS: Safari -> Sprachausgabe: "Link - Komponenten - Inhalt" Firefox -> Sprachausgabe: "Link - Komponenten - Haut - Alle Komponenten auf einem Blick" Chrome -> Sprachausgabe: "Link - Komponenten - Mein"

Windows: Edge -> Sprachausgabe: "Mein Landmark - Komponenten - Link - Alle Komponenten auf einem Blick" Chrome -> Sprachausgabe: "Komponenten - Link - Alle Komponenten auf einem Blick" Firefox -> Sprachausgabe: "Mein Landmark - Komponenten - Link - Alle Komponenten auf einem Blick"

Nach Rücksprache mit der Entwicklerin wird der Issue geschlossen.