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

added acessibility fixes

Browse source
This commit is contained in:
Agnieszka Gancarczyk 2021-07-12 15:09:14 +01:00
parent 7682f5c4c5
commit 74deaad0b9
17 changed files with 63 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/client-scopes/details/ScopeForm.tsx
View file

@ -70,7 +70,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
id="name-help-icon"
helpText="client-scopes-help:name"
forLabel={t("common:name")}
forID="kc-name"
forID={t(`common:helpLabel`, { label: t("common:name") })}
/>
}
fieldId="kc-name"
@ -96,7 +96,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:description"
forLabel={t("common:description")}
forID="kc-description"
forID={t(`common:helpLabel`, { label: t("common:description") })}
/>
}
fieldId="kc-description"
@ -125,7 +125,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:type"
forLabel={t("type")}
forID="type"
forID={t(`common:helpLabel`, { label: t("type") })}
/>
}
fieldId="type"
@ -158,7 +158,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:protocol"
forLabel="protocol"
forID="kc-protocol"
forID={t(`common:helpLabel`, { label: t("protocol") })}
/>
}
fieldId="kc-protocol"
@ -200,7 +200,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:displayOnConsentScreen"
forLabel={t("displayOnConsentScreen")}
forID="kc-display.on.consent.screen"
forID={t(`common:helpLabel`, { label: t("displayOnConsentScreen") })}
/>
}
fieldId="kc-display.on.consent.screen"
@ -211,7 +211,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
defaultValue="true"
render={({ onChange, value }) => (
<Switch
id="kc-display.on.consent.screen"
id="kc-display.on.consent.screen-switch"
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value === "true"}
@ -227,7 +227,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:consentScreenText"
forLabel={t("consentScreenText")}
forID="kc-consent-screen-text"
forID={t(`common:helpLabel`, { label: t("consentScreenText") })}
/>
}
fieldId="kc-consent-screen-text"
@ -247,7 +247,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:includeInTokenScope"
forLabel={t("includeInTokenScope")}
forID="includeInTokenScope"
forID={t(`common:helpLabel`, { label: t("includeInTokenScope") })}
/>
}
fieldId="includeInTokenScope"
@ -258,7 +258,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
defaultValue="true"
render={({ onChange, value }) => (
<Switch
id="includeInTokenScope"
id="includeInTokenScope-switch"
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value === "true"}
@ -273,7 +273,7 @@ export const ScopeForm = ({ clientScope, save }: ScopeFormProps) => {
<HelpItem
helpText="client-scopes-help:guiOrder"
forLabel={t("guiOrder")}
forID="kc-gui-order"
forID={t(`common:helpLabel`, { label: t("guiOrder") })}
/>
}
fieldId="kc-gui-order"

4
src/clients/AdvancedTab.tsx
View file

@ -198,7 +198,7 @@ export const AdvancedTab = ({
<HelpItem
helpText="clients-help:notBefore"
forLabel={t("notBefore")}
forID="kc-not-before"
forID={t(`common:helpLabel`, { label: t("notBefore") })}
/>
}
>
@ -244,7 +244,7 @@ export const AdvancedTab = ({
<HelpItem
helpText="clients-help:nodeReRegistrationTimeout"
forLabel={t("nodeReRegistrationTimeout")}
forID="nodeReRegistrationTimeout"
forID={t(`common:helpLabel`, { label: t("nodeReRegistrationTimeout") })}
/>
}
>

10
src/clients/advanced/AdvancedSettings.tsx
View file

@ -40,7 +40,7 @@ export const AdvancedSettings = ({
<HelpItem
helpText="clients-help:assertionLifespan"
forLabel={t("assertionLifespan")}
forID="assertionLifespan"
forID={t(`common:helpLabel`, { label: t("assertionLifespan") })}
/>
}
>
@ -67,7 +67,7 @@ export const AdvancedSettings = ({
<HelpItem
helpText="clients-help:accessTokenLifespan"
forLabel={t("accessTokenLifespan")}
forID="accessTokenLifespan"
forID={t(`common:helpLabel`, { label: t("accessTokenLifespan") })}
/>
}
>
@ -93,7 +93,7 @@ export const AdvancedSettings = ({
<HelpItem
helpText="clients-help:oAuthMutual"
forLabel={t("oAuthMutual")}
forID="oAuthMutual"
forID={t(`common:helpLabel`, { label: t("oAuthMutual") })}
/>
}
>
@ -103,7 +103,7 @@ export const AdvancedSettings = ({
control={control}
render={({ onChange, value }) => (
<Switch
id="oAuthMutual"
id="oAuthMutual-switch"
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value === "true"}
@ -120,7 +120,7 @@ export const AdvancedSettings = ({
<HelpItem
helpText="clients-help:keyForCodeExchange"
forLabel={t("keyForCodeExchange")}
forID="keyForCodeExchange"
forID={t(`common:helpLabel`, { label: t("keyForCodeExchange") })}
/>
}
>

4
src/clients/advanced/AuthenticationOverrides.tsx
View file

@ -64,7 +64,7 @@ export const AuthenticationOverrides = ({
<HelpItem
helpText="clients-help:browserFlow"
forLabel={t("browserFlow")}
forID="browserFlow"
forID={t(`common:helpLabel`, { label: t("browserFlow") })}
/>
}
>
@ -97,7 +97,7 @@ export const AuthenticationOverrides = ({
<HelpItem
helpText="clients-help:directGrant"
forLabel={t("directGrant")}
forID="directGrant"
forID={t(`common:helpLabel`, { label: t("directGrant") })}
/>
}
>

4
src/clients/advanced/OpenIdConnectCompatibilityModes.tsx
View file

@ -27,7 +27,7 @@ export const OpenIdConnectCompatibilityModes = ({
<HelpItem
helpText="clients-help:excludeSessionStateFromAuthenticationResponse"
forLabel={t("excludeSessionStateFromAuthenticationResponse")}
forID="excludeSessionStateFromAuthenticationResponse"
forID={t(`common:helpLabel`, { label: t("excludeSessionStateFromAuthenticationResponse") })}
/>
}
>
@ -37,7 +37,7 @@ export const OpenIdConnectCompatibilityModes = ({
control={control}
render={({ onChange, value }) => (
<Switch
id="excludeSessionStateFromAuthenticationResponse"
id="excludeSessionStateFromAuthenticationResponse-switch"
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value === "true"}

4
src/clients/keys/Keys.tsx
View file

@ -143,7 +143,7 @@ export const Keys = ({ clientId, save }: KeysProps) => {
<HelpItem
helpText="clients-help:useJwksUrl"
forLabel={t("useJwksUrl")}
forID="useJwksUrl"
forID={t(`common:helpLabel`, { label: t("useJwksUrl") })}
/>
}
>
@ -154,7 +154,7 @@ export const Keys = ({ clientId, save }: KeysProps) => {
render={({ onChange, value }) => (
<Switch
data-testid="useJwksUrl"
id="useJwksUrl"
id="useJwksUrl-switch"
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value === "true"}

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

@ -27,7 +27,7 @@ export const FormPanel = ({
<CardHeader className="kc-form-panel__header">
<CardTitle tabIndex={0}>
<Title
headingLevel="h4"
headingLevel="h1"
size="xl"
className="kc-form-panel__title"
id={scrollId}

1
src/components/time-selector/TimeSelector.tsx
View file

@ -81,6 +81,7 @@ export const TimeSelector = ({
{...rest}
type="number"
id={`kc-time-${new Date().getTime()}`}
aria-label="kc-time"
min="0"
value={timeValue}
onChange={(value) => {

1
src/groups/GroupsModal.tsx
View file

@ -99,6 +99,7 @@ export const GroupsModal = ({
>
<TextInput
data-testid="groupNameInput"
aria-label="group name input"
ref={register({ required: true })}
autoFocus
type="text"

8
src/identity-providers/icons/FontAwesomeIcon.tsx
View file

@ -11,13 +11,13 @@ export const FontAwesomeIcon = ({ icon }: FontAwesomeIconProps) => {
const styles = { style: { height: "2em", width: "2em" } };
switch (icon) {
case "bitbucket":
return <img src={bitbucketIcon} {...styles} />;
return <img src={bitbucketIcon} {...styles} aria-label="bitbucket icon"/>;
case "microsoft":
return <img src={microsoftIcon} {...styles} />;
return <img src={microsoftIcon} {...styles} aria-label="microsoft icon"/>;
case "instagram":
return <img src={instagramIcon} {...styles} />;
return <img src={instagramIcon} {...styles} aria-label="instagram icon"/>;
case "paypal":
return <img src={paypalIcon} {...styles} />;
return <img src={paypalIcon} {...styles} aria-label="paypal icon"/>;
default:
return <></>;
}

1
src/realm-roles/RealmRoleForm.tsx
View file

@ -59,6 +59,7 @@ export const RealmRoleForm = ({
>
<TextArea
name="description"
aria-label="description"
isDisabled={getValues().name?.includes("default-roles")}
ref={register({
maxLength: {

10
src/realm-settings/EmailTab.tsx
View file

@ -180,7 +180,7 @@ export const RealmSettingsEmailTab = ({
<HelpItem
helpText="realm-settings-help:fromDisplayName"
forLabel={t("authentication")}
forID="kc-user-manged-access"
forID={t(`common:helpLabel`, { label: t("authentication") })}
/>
}
>
@ -217,7 +217,7 @@ export const RealmSettingsEmailTab = ({
<HelpItem
helpText="realm-settings-help:replyToDisplayName"
forLabel={t("replyToDisplayName")}
forID="kc-user-manged-access"
forID={t(`common:helpLabel`, { label: t("replyToDisplayName") })}
/>
}
>
@ -236,7 +236,7 @@ export const RealmSettingsEmailTab = ({
<HelpItem
helpText="realm-settings-help:envelopeFrom"
forLabel={t("envelopeFrom")}
forID="kc-envelope-from"
forID={t(`common:helpLabel`, { label: t("envelopeFrom") })}
/>
}
>
@ -328,7 +328,7 @@ export const RealmSettingsEmailTab = ({
defaultValue={authenticationEnabled}
render={({ onChange, value }) => (
<Switch
id="kc-authentication"
id="kc-authentication-switch"
data-testid="email-authentication-switch"
label={t("common:enabled")}
labelOff={t("common:disabled")}
@ -369,7 +369,7 @@ export const RealmSettingsEmailTab = ({
<HelpItem
helpText="realm-settings-help:password"
forLabel={t("password")}
forID="kc-password"
forID={t(`common:helpLabel`, { label: t("password") })}
/>
}
>

8
src/realm-settings/GeneralTab.tsx
View file

@ -86,7 +86,7 @@ export const RealmSettingsGeneralTab = ({
<HelpItem
helpText="realm-settings-help:frontendUrl"
forLabel={t("frontendUrl")}
forID="kc-frontend-url"
forID={t(`common:helpLabel`, { label: t("frontendUrl") })}
/>
}
>
@ -104,7 +104,7 @@ export const RealmSettingsGeneralTab = ({
<HelpItem
helpText="realm-settings-help:requireSsl"
forLabel={t("requireSsl")}
forID="kc-require-ssl"
forID={t(`common:helpLabel`, { label: t("requireSsl") })}
/>
}
>
@ -145,7 +145,7 @@ export const RealmSettingsGeneralTab = ({
<HelpItem
helpText="realm-settings-help:userManagedAccess"
forLabel={t("userManagedAccess")}
forID="kc-user-manged-access"
forID={t(`common:helpLabel`, { label: t("userManagedAccess") })}
/>
}
fieldId="kc-user-manged-access"
@ -172,7 +172,7 @@ export const RealmSettingsGeneralTab = ({
<HelpItem
helpText="realm-settings-help:endpoints"
forLabel={t("endpoints")}
forID="kc-endpoints"
forID={t(`common:helpLabel`, { label: t("endpoints") })}
/>
}
fieldId="kc-endpoints"

28
src/realm-settings/LoginTab.tsx
View file

@ -32,13 +32,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("userRegistrationHelpText")}
forLabel={t("userRegistration")}
forID="kc-user-reg"
forID={t(`common:helpLabel`, { label: t("userRegistration") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-user-reg"
id="kc-user-reg-switch"
data-testid="user-reg-switch"
name="registrationAllowed"
label={t("common:on")}
@ -56,13 +56,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("forgotPasswordHelpText")}
forLabel={t("forgotPassword")}
forID="kc-forgot-pw"
forID={t(`common:helpLabel`, { label: t("forgotPassword") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-forgot-pw"
id="kc-forgot-pw-switch"
data-testid="forgot-pw-switch"
name="resetPasswordAllowed"
label={t("common:on")}
@ -80,13 +80,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("rememberMeHelpText")}
forLabel={t("rememberMe")}
forID="kc-remember-me"
forID={t(`common:helpLabel`, { label: t("rememberMe") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-remember-me"
id="kc-remember-me-switch"
data-testid="remember-me-switch"
name="rememberMe"
label={t("common:on")}
@ -108,13 +108,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("emailAsUsernameHelpText")}
forLabel={t("emailAsUsername")}
forID="kc-email-as-username"
forID={t(`common:helpLabel`, { label: t("emailAsUsername") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-email-as-username"
id="kc-email-as-username-switch"
data-testid="email-as-username-switch"
name="registrationEmailAsUsername"
label={t("common:on")}
@ -132,13 +132,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("loginWithEmailHelpText")}
forLabel={t("loginWithEmail")}
forID="kc-login-with-email"
forID={t(`common:helpLabel`, { label: t("loginWithEmail") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-login-with-email"
id="kc-login-with-email-switch"
data-testid="login-with-email-switch"
name="loginWithEmailAllowed"
label={t("common:on")}
@ -156,13 +156,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("duplicateEmailsHelpText")}
forLabel={t("duplicateEmails")}
forID="kc-duplicate-emails"
forID={t(`common:helpLabel`, { label: t("duplicateEmails") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-duplicate-emails"
id="kc-duplicate-emails-switch"
data-testid="duplicate-emails-switch"
label={t("common:on")}
labelOff={t("common:off")}
@ -188,13 +188,13 @@ export const RealmSettingsLoginTab = ({
<HelpItem
helpText={t("verifyEmailHelpText")}
forLabel={t("verifyEmail")}
forID="kc-verify-email"
forID={t(`common:helpLabel`, { label: t("verifyEmail") })}
/>
}
hasNoPaddingTop
>
<Switch
id="kc-verify-email"
id="kc-verify-email-switch"
data-testid="verify-email-switch"
name="verifyEmail"
label={t("common:on")}

8
src/realm-settings/event-config/EventConfigForm.tsx
View file

@ -57,7 +57,7 @@ export const EventConfigForm = ({
<HelpItem
helpText={`realm-settings-help:save-${type}-events`}
forLabel={t("saveEvents")}
forID={eventKey}
forID={t(`common:helpLabel`, { label: t("saveEvents") })}
/>
}
>
@ -68,7 +68,7 @@ export const EventConfigForm = ({
render={({ onChange, value }) => (
<Switch
data-testid={eventKey}
id={eventKey}
id={`${eventKey}-switch`}
label={t("common:on")}
labelOff={t("common:off")}
isChecked={value}
@ -94,7 +94,7 @@ export const EventConfigForm = ({
<HelpItem
helpText="realm-settings-help:includeRepresentation"
forLabel={t("includeRepresentation")}
forID="includeRepresentation"
forID={t(`common:helpLabel`, { label: t("includeRepresentation") })}
/>
}
>
@ -123,7 +123,7 @@ export const EventConfigForm = ({
<HelpItem
helpText="realm-settings-help:expiration"
forLabel={t("expiration")}
forID="expiration"
forID={t(`common:helpLabel`, { label: t("expiration") })}
/>
}
>

2
src/realm-settings/event-config/EventsTab.tsx
View file

@ -138,7 +138,7 @@ export const EventsTab = () => {
data-testid="rs-events-tab"
>
<PageSection>
<Title headingLevel="h4" size="xl">
<Title headingLevel="h1" size="xl">
{t("userEventsConfig")}
</Title>
</PageSection>

8
src/user/UserForm.tsx
View file

@ -214,7 +214,7 @@ export const UserForm = ({
<HelpItem
helpText="users-help:emailVerified"
forLabel={t("emailVerified")}
forID="email-verified"
forID={t(`common:helpLabel`, { label: t("emailVerified") })}
/>
}
>
@ -270,7 +270,7 @@ export const UserForm = ({
<HelpItem
helpText="users-help:disabled"
forLabel={t("enabled")}
forID="enabled-label"
forID={t(`common:helpLabel`, { label: t("enabled") })}
/>
}
>
@ -299,7 +299,7 @@ export const UserForm = ({
<HelpItem
helpText="users-help:requiredUserActions"
forLabel={t("requiredUserActions")}
forID="required-user-actions-label"
forID={t(`common:helpLabel`, { label: t("requiredUserActions") })}
/>
}
>
@ -346,7 +346,7 @@ export const UserForm = ({
<HelpItem
helpText="users-help:groups"
forLabel={t("common:groups")}
forID="kc-join-groups-button"
forID={t(`common:helpLabel`, { label: t("common:groups") })}
/>
}
>