fixed ids for axa (#2860)

fixes: #2845

src/components/group/GroupPickerDialog.tsx

@@ -257,7 +257,7 @@ export const GroupPickerDialog = ({
 
                       setSelectedRows(newSelectedRows);
                     }}
-                    aria-labelledby="data-list-check"
+                    aria-labelledby={`select-${group.name}`}
                   />
                 )}
 
@@ -265,16 +265,19 @@ export const GroupPickerDialog = ({
                   dataListCells={[
                     <DataListCell key={`name-${group.id}`}>
                       {filter === "" ? (
-                        group.name
+                        <span id={`select-${group.name}`}>{group.name}</span>
                       ) : (
-                        <GroupPath group={findSubGroup(group, filter)} />
+                        <GroupPath
+                          id={`select-${group.name}`}
+                          group={findSubGroup(group, filter)}
+                        />
                       )}
                     </DataListCell>,
                   ]}
                 />
                 <DataListAction
+                  id="actions"
                   aria-labelledby={`select-${group.name}`}
-                  id={`select-${group.name}`}
                   aria-label={t("groupName")}
                   isPlainButtonAction
                 >

src/components/view-header/ViewHeader.tsx

@@ -84,6 +84,8 @@ export const ViewHeader = ({
     setIsLowerDropdownOpen(!isLowerDropdownOpen);
   };
 
+  const toKey = (value: string) => value.replace(/\s/g, "-");
+
   return (
     <>
       <PageSection variant="light">
@@ -121,7 +123,7 @@ export const ViewHeader = ({
                 {onToggle && (
                   <ToolbarItem>
                     <Switch
-                      id={`${titleKey}-switch`}
+                      id={`${toKey(titleKey)}-switch`}
                       data-testid={`${titleKey}-switch`}
                       label={t("common:enabled")}
                       labelOff={t("common:disabled")}
@@ -135,7 +137,7 @@ export const ViewHeader = ({
                     {helpTextKey && (
                       <HelpItem
                         helpText={t(helpTextKey)}
-                        fieldLabelId={`${titleKey}-switch`}
+                        fieldLabelId={`${toKey(titleKey)}-switch`}
                       />
                     )}
                   </ToolbarItem>

src/realm-settings/AddMessageBundleModal.tsx

@@ -69,7 +69,7 @@ export const AddMessageBundleModal = ({
         <FormGroup
           label={t("common:key")}
           name="key"
-          fieldId="key"
+          fieldId="key-id"
           helperTextInvalid={t("common:required")}
           validated={
             errors.key ? ValidatedOptions.error : ValidatedOptions.default
@@ -81,7 +81,7 @@ export const AddMessageBundleModal = ({
             ref={register({ required: true })}
             autoFocus
             type="text"
-            id="add-key"
+            id="key-id"
             name="key"
             validated={
               errors.key ? ValidatedOptions.error : ValidatedOptions.default
@@ -102,7 +102,7 @@ export const AddMessageBundleModal = ({
             data-testid="value-input"
             ref={register({ required: true })}
             type="text"
-            id="add-value"
+            id="value-id"
             name="value"
             validated={
               errors.value ? ValidatedOptions.error : ValidatedOptions.default

src/realm-settings/NewClientPolicyForm.tsx

@@ -459,7 +459,7 @@ export default function NewClientPolicyForm() {
         >
           <FormGroup
             label={t("common:name")}
-            fieldId="kc-name"
+            fieldId="kc-client-profile-name"
             isRequired
             helperTextInvalid={t("common:required")}
             validated={