From 065c05ac15c842671b255220fad5b7e7080baa03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Mon, 27 Mar 2023 15:09:24 -0400
Subject: [PATCH 1/6] Adds aria labels and removes option id to get
 announcements

---
 .../privileges/es/cluster_privileges.tsx      |  6 +++
 .../es/elasticsearch_privileges.tsx           | 43 ++++++++++---------
 .../privileges/es/index_privilege_form.tsx    | 16 +++++++
 3 files changed, 44 insertions(+), 21 deletions(-)

diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/cluster_privileges.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/cluster_privileges.tsx
index 0e44970d8ef7a8..4eb98279908496 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/cluster_privileges.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/cluster_privileges.tsx
@@ -9,6 +9,8 @@ import { EuiComboBox, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import _ from 'lodash';
 import React, { Component } from 'react';
 
+import { i18n } from '@kbn/i18n';
+
 import type { Role } from '../../../../../../common/model';
 import { isRoleReadOnly } from '../../../../../../common/model';
 
@@ -41,6 +43,10 @@ export class ClusterPrivileges extends Component<Props, {}> {
     return (
       <EuiFlexItem key={'clusterPrivs'}>
         <EuiComboBox
+          aria-label={i18n.translate(
+            'xpack.security.management.editRole.clusterPrivilegeForm.clusterPrivilegesAriaLabel',
+            { defaultMessage: 'Cluster privileges' }
+          )}
           data-test-subj={'cluster-privileges-combobox'}
           options={options}
           selectedOptions={selectedOptions}
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
index 045c4d924c4267..f995e85adedc58 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
@@ -118,27 +118,28 @@ export class ElasticsearchPrivileges extends Component<Props, {}> {
             </p>
           }
         >
-          <EuiFormRow hasEmptyLabelSpace>
-            <EuiComboBox
-              placeholder={
-                this.props.editable
-                  ? i18n.translate(
-                      'xpack.security.management.editRole.elasticSearchPrivileges.addUserTitle',
-                      { defaultMessage: 'Add a user…' }
-                    )
-                  : undefined
-              }
-              options={this.props.runAsUsers.map((username) => ({
-                id: username,
-                label: username,
-                isGroupLabelOption: false,
-              }))}
-              selectedOptions={this.props.role.elasticsearch.run_as.map((u) => ({ label: u }))}
-              onCreateOption={this.onCreateRunAsOption}
-              onChange={this.onRunAsUserChange}
-              isDisabled={!editable}
-            />
-          </EuiFormRow>
+          <EuiComboBox
+            aria-label={i18n.translate(
+              'xpack.security.management.editRole.elasticSearchPrivileges.runAsUserAriaLabel',
+              { defaultMessage: 'Run as user' }
+            )}
+            placeholder={
+              this.props.editable
+                ? i18n.translate(
+                    'xpack.security.management.editRole.elasticSearchPrivileges.addUserTitle',
+                    { defaultMessage: 'Add a user…' }
+                  )
+                : undefined
+            }
+            options={this.props.runAsUsers.map((username) => ({
+              label: username,
+              isGroupLabelOption: false,
+            }))}
+            selectedOptions={this.props.role.elasticsearch.run_as.map((u) => ({ label: u }))}
+            onCreateOption={this.onCreateRunAsOption}
+            onChange={this.onRunAsUserChange}
+            isDisabled={!editable}
+          />
         </EuiDescribedFormGroup>
 
         <EuiSpacer />
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
index fbc440c0ed984e..662c2062cfdb77 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
@@ -128,6 +128,10 @@ export class IndexPrivilegeForm extends Component<Props, State> {
               {...this.props.validator.validateIndexPrivilege(this.props.indexPrivilege)}
             >
               <EuiComboBox
+                aria-label={i18n.translate(
+                  'xpack.security.management.editRole.indexPrivilegeForm.indicesAriaLabel',
+                  { defaultMessage: 'Indices' }
+                )}
                 data-test-subj={`indicesInput${this.props.formIndex}`}
                 options={this.props.indexPatterns.map(toOption)}
                 selectedOptions={this.props.indexPrivilege.names.map(toOption)}
@@ -148,6 +152,10 @@ export class IndexPrivilegeForm extends Component<Props, State> {
               fullWidth={true}
             >
               <EuiComboBox
+                aria-label={i18n.translate(
+                  'xpack.security.management.editRole.indexPrivilegeForm.privilegesAriaLabel',
+                  { defaultMessage: 'Index privileges' }
+                )}
                 data-test-subj={`privilegesInput${this.props.formIndex}`}
                 options={this.props.availableIndexPrivileges.map(toOption)}
                 selectedOptions={this.props.indexPrivilege.privileges.map(toOption)}
@@ -243,6 +251,10 @@ export class IndexPrivilegeForm extends Component<Props, State> {
                   >
                     <Fragment>
                       <EuiComboBox
+                        aria-label={i18n.translate(
+                          'xpack.security.management.editRole.indexPrivilegeForm.grantedFieldsAriaLabel',
+                          { defaultMessage: 'Granted fields' }
+                        )}
                         data-test-subj={`fieldInput${this.props.formIndex}`}
                         options={this.state.flsOptions.map(toOption)}
                         selectedOptions={grant.map(toOption)}
@@ -268,6 +280,10 @@ export class IndexPrivilegeForm extends Component<Props, State> {
                   >
                     <Fragment>
                       <EuiComboBox
+                        aria-label={i18n.translate(
+                          'xpack.security.management.editRole.indexPrivilegeForm.deniedFieldsAriaLabel',
+                          { defaultMessage: 'Denied fields' }
+                        )}
                         data-test-subj={`deniedFieldInput${this.props.formIndex}`}
                         options={this.state.flsOptions.map(toOption)}
                         selectedOptions={except.map(toOption)}

From adafdf19d85b0872f07d6ad82f63987ee9f9b2e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Mon, 27 Mar 2023 15:49:56 -0400
Subject: [PATCH 2/6] Removes redundant aria-labels where ui label is
 inherited. Removes unnecessary components.

---
 .../privileges/es/index_privilege_form.tsx    | 60 +++++++------------
 1 file changed, 20 insertions(+), 40 deletions(-)

diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
index 662c2062cfdb77..934de8921ec88c 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/index_privilege_form.tsx
@@ -128,10 +128,6 @@ export class IndexPrivilegeForm extends Component<Props, State> {
               {...this.props.validator.validateIndexPrivilege(this.props.indexPrivilege)}
             >
               <EuiComboBox
-                aria-label={i18n.translate(
-                  'xpack.security.management.editRole.indexPrivilegeForm.indicesAriaLabel',
-                  { defaultMessage: 'Indices' }
-                )}
                 data-test-subj={`indicesInput${this.props.formIndex}`}
                 options={this.props.indexPatterns.map(toOption)}
                 selectedOptions={this.props.indexPrivilege.names.map(toOption)}
@@ -152,10 +148,6 @@ export class IndexPrivilegeForm extends Component<Props, State> {
               fullWidth={true}
             >
               <EuiComboBox
-                aria-label={i18n.translate(
-                  'xpack.security.management.editRole.indexPrivilegeForm.privilegesAriaLabel',
-                  { defaultMessage: 'Index privileges' }
-                )}
                 data-test-subj={`privilegesInput${this.props.formIndex}`}
                 options={this.props.availableIndexPrivileges.map(toOption)}
                 selectedOptions={this.props.indexPrivilege.privileges.map(toOption)}
@@ -249,22 +241,16 @@ export class IndexPrivilegeForm extends Component<Props, State> {
                       ) : undefined
                     }
                   >
-                    <Fragment>
-                      <EuiComboBox
-                        aria-label={i18n.translate(
-                          'xpack.security.management.editRole.indexPrivilegeForm.grantedFieldsAriaLabel',
-                          { defaultMessage: 'Granted fields' }
-                        )}
-                        data-test-subj={`fieldInput${this.props.formIndex}`}
-                        options={this.state.flsOptions.map(toOption)}
-                        selectedOptions={grant.map(toOption)}
-                        onCreateOption={this.onCreateGrantedField}
-                        onChange={this.onGrantedFieldsChange}
-                        isDisabled={this.props.isRoleReadOnly}
-                        async={true}
-                        isLoading={this.state.isFieldListLoading}
-                      />
-                    </Fragment>
+                    <EuiComboBox
+                      data-test-subj={`fieldInput${this.props.formIndex}`}
+                      options={this.state.flsOptions.map(toOption)}
+                      selectedOptions={grant.map(toOption)}
+                      onCreateOption={this.onCreateGrantedField}
+                      onChange={this.onGrantedFieldsChange}
+                      isDisabled={this.props.isRoleReadOnly}
+                      async={true}
+                      isLoading={this.state.isFieldListLoading}
+                    />
                   </EuiFormRow>
                 </EuiFlexItem>
                 <EuiFlexItem>
@@ -278,22 +264,16 @@ export class IndexPrivilegeForm extends Component<Props, State> {
                     fullWidth={true}
                     className="indexPrivilegeForm__deniedFieldsRow"
                   >
-                    <Fragment>
-                      <EuiComboBox
-                        aria-label={i18n.translate(
-                          'xpack.security.management.editRole.indexPrivilegeForm.deniedFieldsAriaLabel',
-                          { defaultMessage: 'Denied fields' }
-                        )}
-                        data-test-subj={`deniedFieldInput${this.props.formIndex}`}
-                        options={this.state.flsOptions.map(toOption)}
-                        selectedOptions={except.map(toOption)}
-                        onCreateOption={this.onCreateDeniedField}
-                        onChange={this.onDeniedFieldsChange}
-                        isDisabled={isRoleReadOnly}
-                        async={true}
-                        isLoading={this.state.isFieldListLoading}
-                      />
-                    </Fragment>
+                    <EuiComboBox
+                      data-test-subj={`deniedFieldInput${this.props.formIndex}`}
+                      options={this.state.flsOptions.map(toOption)}
+                      selectedOptions={except.map(toOption)}
+                      onCreateOption={this.onCreateDeniedField}
+                      onChange={this.onDeniedFieldsChange}
+                      isDisabled={isRoleReadOnly}
+                      async={true}
+                      isLoading={this.state.isFieldListLoading}
+                    />
                   </EuiFormRow>
                 </EuiFlexItem>
               </EuiFlexGroup>

From 25252cab03ee5065268bb5f33b928c28cc691544 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Mon, 27 Mar 2023 16:53:10 -0400
Subject: [PATCH 3/6] Adds aria-label to spaces nav selectable

---
 .../public/nav_control/components/spaces_menu.tsx   | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/x-pack/plugins/spaces/public/nav_control/components/spaces_menu.tsx b/x-pack/plugins/spaces/public/nav_control/components/spaces_menu.tsx
index 1d54c639d84d80..adad431cd05eac 100644
--- a/x-pack/plugins/spaces/public/nav_control/components/spaces_menu.tsx
+++ b/x-pack/plugins/spaces/public/nav_control/components/spaces_menu.tsx
@@ -20,7 +20,7 @@ import type {
   EuiSelectableOnChangeEvent,
   EuiSelectableSearchableSearchProps,
 } from '@elastic/eui/src/components/selectable/selectable';
-import React, { Component, lazy, Suspense } from 'react';
+import React, { Component, Fragment, lazy, Suspense } from 'react';
 
 import type { ApplicationStart, Capabilities } from '@kbn/core/public';
 import { i18n } from '@kbn/i18n';
@@ -85,8 +85,11 @@ class SpacesMenuUI extends Component<Props> {
           };
 
     return (
-      <>
+      <Fragment>
         <EuiSelectable
+          aria-label={i18n.translate('xpack.spaces.navControl.spacesMenu.spacesAriaLabel', {
+            defaultMessage: 'Spaces',
+          })}
           id={this.props.id}
           className={'spcMenu'}
           title={i18n.translate('xpack.spaces.navControl.spacesMenu.changeCurrentSpaceTitle', {
@@ -105,7 +108,7 @@ class SpacesMenuUI extends Component<Props> {
           }}
         >
           {(list, search) => (
-            <>
+            <Fragment>
               <EuiPopoverTitle paddingSize="s">
                 {search ||
                   i18n.translate('xpack.spaces.navControl.spacesMenu.selectSpacesTitle', {
@@ -113,11 +116,11 @@ class SpacesMenuUI extends Component<Props> {
                   })}
               </EuiPopoverTitle>
               {list}
-            </>
+            </Fragment>
           )}
         </EuiSelectable>
         <EuiPopoverFooter paddingSize="s">{this.renderManageButton()}</EuiPopoverFooter>
-      </>
+      </Fragment>
     );
   }
 

From d276aa3f2f04ab7eec67d576ad9a4792e34af9d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Tue, 28 Mar 2023 11:38:54 -0400
Subject: [PATCH 4/6] Updates test snapshots

---
 .../cluster_privileges.test.tsx.snap          |  1 +
 .../elasticsearch_privileges.test.tsx.snap    | 37 ++++++++-----------
 2 files changed, 16 insertions(+), 22 deletions(-)

diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/cluster_privileges.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/cluster_privileges.test.tsx.snap
index dd27fe13e84a3d..ae57c00324ccd0 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/cluster_privileges.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/cluster_privileges.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`it renders without crashing 1`] = `
     key="clusterPrivs"
   >
     <EuiComboBox
+      aria-label="Cluster privileges"
       async={false}
       compressed={false}
       data-test-subj="cluster-privileges-combobox"
diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
index 5c4097aacd3253..6a796bffe7ad5e 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
@@ -100,28 +100,21 @@ exports[`it renders without crashing 1`] = `
       </h3>
     }
   >
-    <EuiFormRow
-      describedByIds={Array []}
-      display="row"
-      hasChildLabel={true}
-      hasEmptyLabelSpace={true}
-      labelType="label"
-    >
-      <EuiComboBox
-        async={false}
-        compressed={false}
-        fullWidth={false}
-        isClearable={true}
-        isDisabled={false}
-        onChange={[Function]}
-        onCreateOption={[Function]}
-        options={Array []}
-        placeholder="Add a user…"
-        selectedOptions={Array []}
-        singleSelection={false}
-        sortMatchesBy="none"
-      />
-    </EuiFormRow>
+    <EuiComboBox
+      aria-label="Run as user"
+      async={false}
+      compressed={false}
+      fullWidth={false}
+      isClearable={true}
+      isDisabled={false}
+      onChange={[Function]}
+      onCreateOption={[Function]}
+      options={Array []}
+      placeholder="Add a user…"
+      selectedOptions={Array []}
+      singleSelection={false}
+      sortMatchesBy="none"
+    />
   </EuiDescribedFormGroup>
   <EuiSpacer />
   <EuiTitle

From 9dfdd156cecc80ee697019db230e6fb679b40c67 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Thu, 30 Mar 2023 10:14:15 -0400
Subject: [PATCH 5/6] Updates aria label for run as combo

---
 .../edit_role/privileges/es/elasticsearch_privileges.tsx      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
index f995e85adedc58..6ae205c62cfa71 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/elasticsearch_privileges.tsx
@@ -120,8 +120,8 @@ export class ElasticsearchPrivileges extends Component<Props, {}> {
         >
           <EuiComboBox
             aria-label={i18n.translate(
-              'xpack.security.management.editRole.elasticSearchPrivileges.runAsUserAriaLabel',
-              { defaultMessage: 'Run as user' }
+              'xpack.security.management.editRole.elasticSearchPrivileges.runAsPrivilegesAriaLabel',
+              { defaultMessage: 'Run as privileges' }
             )}
             placeholder={
               this.props.editable

From be7af742ddfb856567cd66f12aa79d36261e1720 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cjeramysoucy=E2=80=9D?= <jeramy.soucy@elastic.co>
Date: Thu, 30 Mar 2023 10:49:34 -0400
Subject: [PATCH 6/6] Updates test snapshot

---
 .../es/__snapshots__/elasticsearch_privileges.test.tsx.snap     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
index 6a796bffe7ad5e..25196b9929f5a5 100644
--- a/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
+++ b/x-pack/plugins/security/public/management/roles/edit_role/privileges/es/__snapshots__/elasticsearch_privileges.test.tsx.snap
@@ -101,7 +101,7 @@ exports[`it renders without crashing 1`] = `
     }
   >
     <EuiComboBox
-      aria-label="Run as user"
+      aria-label="Run as privileges"
       async={false}
       compressed={false}
       fullWidth={false}