fixed aria issues (#2927)

fixes: #2852
This commit is contained in:
Erik Jan de Wit 2022-07-08 11:04:39 +02:00 committed by GitHub
parent 91b7c35d3b
commit f35f4c0b11
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -57,6 +57,7 @@ export const FlowRow = ({
className="keycloak__authentication__flow-item" className="keycloak__authentication__flow-item"
id={execution.id} id={execution.id}
isExpanded={!execution.isCollapsed} isExpanded={!execution.isCollapsed}
aria-labelledby={`title-id-${execution.id}`}
> >
<DataListItemRow <DataListItemRow
className="keycloak__authentication__flow-row" className="keycloak__authentication__flow-row"
@ -65,17 +66,14 @@ export const FlowRow = ({
aria-labelledby={execution.id} aria-labelledby={execution.id}
> >
<DataListControl> <DataListControl>
<DataListDragButton <DataListDragButton aria-label={t("common-help:dragHelp")} />
aria-labelledby={execution.id}
aria-describedby={t("common-help:dragHelp")}
/>
</DataListControl> </DataListControl>
{hasSubList && ( {hasSubList && (
<DataListToggle <DataListToggle
onClick={() => onRowClick(execution)} onClick={() => onRowClick(execution)}
isExpanded={!execution.isCollapsed} isExpanded={!execution.isCollapsed}
id={`toggle1-${execution.id}`} id={`toggle1-${execution.id}`}
aria-controls={`expand-${execution.id}`} aria-controls={execution.executionList![0].id}
/> />
)} )}
<DataListItemCells <DataListItemCells
@ -83,7 +81,7 @@ export const FlowRow = ({
<DataListCell key={`${execution.id}-name`}> <DataListCell key={`${execution.id}-name`}>
{!execution.authenticationFlow && ( {!execution.authenticationFlow && (
<FlowTitle <FlowTitle
id={execution.id} id={`title-id-${execution.id}`}
key={execution.id} key={execution.id}
title={execution.displayName!} title={execution.displayName!}
/> />