libre.sh/keycloak-scim
3
0
Fork 0
Code Issues 15 Pull requests Releases Packages Activity Actions

added accessibility fixes

Browse source
This commit is contained in:
Agnieszka Gancarczyk 2021-07-09 17:15:21 +01:00
parent 3c16cbe5e6
commit 032fa57383
7 changed files with 38 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/clients/ClientSettings.tsx
View file

@ -78,12 +78,13 @@ export const ClientSettings = ({ save, reset }: ClientSettingsProps) => {
<HelpItem <HelpItem
helpText="clients-help:validRedirectURIs" helpText="clients-help:validRedirectURIs"
forLabel={t("validRedirectUri")} forLabel={t("validRedirectUri")}
forID="kc-redirect" forID={t(`common:helpLabel`, { label: t("validRedirectUri") })}
/> />
} }
> >
<MultiLineInput <MultiLineInput
name="redirectUris" name="redirectUris"
aria-label={t("validRedirectUri")}
addButtonLabel="clients:addRedirectUri" addButtonLabel="clients:addRedirectUri"
/> />
</FormGroup> </FormGroup>
@ -94,7 +95,7 @@ export const ClientSettings = ({ save, reset }: ClientSettingsProps) => {
<HelpItem <HelpItem
helpText="clients-help:homeURL" helpText="clients-help:homeURL"
forLabel={t("homeURL")} forLabel={t("homeURL")}
forID="kc-home-url" forID={t(`common:helpLabel`, { label: t("homeURL") })}
/> />
} }
> >
@ -112,12 +113,13 @@ export const ClientSettings = ({ save, reset }: ClientSettingsProps) => {
<HelpItem <HelpItem
helpText="clients-help:webOrigins" helpText="clients-help:webOrigins"
forLabel={t("webOrigins")} forLabel={t("webOrigins")}
forID="kc-web-origins" forID={t(`common:helpLabel`, { label: t("webOrigins") })}
/> />
} }
> >
<MultiLineInput <MultiLineInput
name="webOrigins" name="webOrigins"
aria-label={t("webOrigins")}
addButtonLabel="clients:addWebOrigins" addButtonLabel="clients:addWebOrigins"
/> />
</FormGroup> </FormGroup>
@ -197,7 +199,7 @@ export const ClientSettings = ({ save, reset }: ClientSettingsProps) => {
control={control} control={control}
render={({ onChange, value }) => ( render={({ onChange, value }) => (
<Switch <Switch
id="kc-consent" id="kc-consent-switch"
label={t("common:on")} label={t("common:on")}
labelOff={t("common:off")} labelOff={t("common:off")}
isChecked={value} isChecked={value}
@ -217,7 +219,7 @@ export const ClientSettings = ({ save, reset }: ClientSettingsProps) => {
control={control} control={control}
render={({ onChange, value }) => ( render={({ onChange, value }) => (
<Switch <Switch
id="kc-display-on-client" id="kc-display-on-client-switch"
label={t("common:on")} label={t("common:on")}
labelOff={t("common:off")} labelOff={t("common:off")}
isChecked={value === "true"} isChecked={value === "true"}

30
src/clients/add/CapabilityConfig.tsx
View file

@ -49,7 +49,7 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:authentication" helpText="clients-help:authentication"
forLabel={t("authentication")} forLabel={t("authentication")}
forID="kc-authentication" forID={t(`common:helpLabel`, { label: t("authentication") })}
/> />
} }
> >
@ -60,7 +60,7 @@ export const CapabilityConfig = ({
render={({ onChange, value }) => ( render={({ onChange, value }) => (
<Switch <Switch
data-testid="authentication" data-testid="authentication"
id="kc-authentication" id="kc-authentication-switch"
name="publicClient" name="publicClient"
label={t("common:on")} label={t("common:on")}
labelOff={t("common:off")} labelOff={t("common:off")}
@ -84,7 +84,7 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:authorization" helpText="clients-help:authorization"
forLabel={t("authorization")} forLabel={t("authorization")}
forID="kc-authorization" forID={t(`common:helpLabel`, { label: t("authorization") })}
/> />
} }
> >
@ -95,7 +95,7 @@ export const CapabilityConfig = ({
render={({ onChange, value }) => ( render={({ onChange, value }) => (
<Switch <Switch
data-testid="authorization" data-testid="authorization"
id="kc-authorization" id="kc-authorization-switch"
name="authorizationServicesEnabled" name="authorizationServicesEnabled"
label={t("common:on")} label={t("common:on")}
labelOff={t("common:off")} labelOff={t("common:off")}
@ -135,7 +135,9 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:standardFlow" helpText="clients-help:standardFlow"
forLabel={t("standardFlow")} forLabel={t("standardFlow")}
forID="kc-flow-standard" forID={t(`common:helpLabel`, {
label: t("standardFlow"),
})}
/> />
</InputGroup> </InputGroup>
)} )}
@ -159,7 +161,9 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:directAccess" helpText="clients-help:directAccess"
forLabel={t("directAccess")} forLabel={t("directAccess")}
forID="kc-flow-direct" forID={t(`common:helpLabel`, {
label: t("directAccess"),
})}
/> />
</InputGroup> </InputGroup>
)} )}
@ -183,7 +187,9 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:implicitFlow" helpText="clients-help:implicitFlow"
forLabel={t("implicitFlow")} forLabel={t("implicitFlow")}
forID="kc-flow-implicit" forID={t(`common:helpLabel`, {
label: t("implicitFlow"),
})}
/> />
</InputGroup> </InputGroup>
)} )}
@ -213,7 +219,9 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:serviceAccount" helpText="clients-help:serviceAccount"
forLabel={t("serviceAccount")} forLabel={t("serviceAccount")}
forID="kc-flow-service-account" forID={t(`common:helpLabel`, {
label: t("serviceAccount"),
})}
/> />
</InputGroup> </InputGroup>
)} )}
@ -232,7 +240,9 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:encryptAssertions" helpText="clients-help:encryptAssertions"
forLabel={t("encryptAssertions")} forLabel={t("encryptAssertions")}
forID="kc-encrypt" forID={t(`common:helpLabel`, {
label: t("encryptAssertions"),
})}
/> />
} }
label={t("encryptAssertions")} label={t("encryptAssertions")}
@ -260,7 +270,7 @@ export const CapabilityConfig = ({
<HelpItem <HelpItem
helpText="clients-help:clientSignature" helpText="clients-help:clientSignature"
forLabel={t("clientSignature")} forLabel={t("clientSignature")}
forID="kc-client-signature" forID={t(`common:helpLabel`, { label: t("clientSignature") })}
/> />
} }
label={t("clientSignature")} label={t("clientSignature")}

2
src/clients/add/GeneralSettings.tsx
View file

@ -30,7 +30,7 @@ export const GeneralSettings = () => {
<HelpItem <HelpItem
helpText="clients-help:clientType" helpText="clients-help:clientType"
forLabel={t("clientType")} forLabel={t("clientType")}
forID="kc-type" forID={t(`common:helpLabel`, { label: t("clientType") })}
/> />
} }
> >

2
src/components/list-empty-state/ListEmptyState.tsx
View file

@ -47,7 +47,7 @@ export const ListEmptyState = ({
) : ( ) : (
hasIcon && <EmptyStateIcon icon={icon ? icon : PlusCircleIcon} /> hasIcon && <EmptyStateIcon icon={icon ? icon : PlusCircleIcon} />
)} )}
<Title headingLevel="h4" size="lg"> <Title headingLevel="h1" size="lg">
{message} {message}
</Title> </Title>
<EmptyStateBody>{instructions}</EmptyStateBody> <EmptyStateBody>{instructions}</EmptyStateBody>

2
src/components/multi-line-input/MultiLineInput.tsx
View file

@ -64,6 +64,7 @@ export const MultiLineInput = ({
variant={ButtonVariant.link} variant={ButtonVariant.link}
onClick={() => remove(index)} onClick={() => remove(index)}
tabIndex={-1} tabIndex={-1}
aria-label={t("common:remove")}
isDisabled={index === fields.length - 1} isDisabled={index === fields.length - 1}
> >
<MinusCircleIcon /> <MinusCircleIcon />
@ -74,6 +75,7 @@ export const MultiLineInput = ({
variant={ButtonVariant.link} variant={ButtonVariant.link}
onClick={() => append({})} onClick={() => append({})}
tabIndex={-1} tabIndex={-1}
aria-label={t("common:add")}
isDisabled={ isDisabled={
rest.isDisabled || rest.isDisabled ||
!(currentValues && currentValues[index]?.value) !(currentValues && currentValues[index]?.value)

2
src/components/scroll-form/ScrollPanel.tsx
View file

@ -14,7 +14,7 @@ export const ScrollPanel = (props: ScrollPanelProps) => {
return ( return (
<section {...rest} className="kc-form-panel__panel"> <section {...rest} className="kc-form-panel__panel">
<Title <Title
headingLevel="h4" headingLevel="h1"
size="xl" size="xl"
className="kc-form-panel__title" className="kc-form-panel__title"
id={scrollId} id={scrollId}

8
src/dashboard/Dashboard.tsx
View file

@ -114,7 +114,9 @@ const Dashboard = () => {
<DescriptionListTerm> <DescriptionListTerm>
{t("enabledFeatures")}{" "} {t("enabledFeatures")}{" "}
<HelpItem <HelpItem
forID="enabledFeatures" forID={t(`common:helpLabel`, {
label: t("enabledFeatures"),
})}
forLabel={t("enabledFeatures")} forLabel={t("enabledFeatures")}
helpText="dashboard:infoEnabledFeatures" helpText="dashboard:infoEnabledFeatures"
/> />
@ -143,7 +145,9 @@ const Dashboard = () => {
<DescriptionListTerm> <DescriptionListTerm>
{t("disabledFeatures")}{" "} {t("disabledFeatures")}{" "}
<HelpItem <HelpItem
forID="disabledFeatures" forID={t(`common:helpLabel`, {
label: t("disabledFeatures"),
})}
forLabel={t("disabledFeatures")} forLabel={t("disabledFeatures")}
helpText="dashboard:infoDisabledFeatures" helpText="dashboard:infoDisabledFeatures"
/> />