[Index Management] Added data-test-subj values to the index context…

… menu buttons (#114900)
elastic · Oct 14, 2021 · f2f6bb5 · f2f6bb5
1 parent 32f650f
commit f2f6bb5
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 28 deletions.
diff --git a/x-pack/plugins/index_management/__jest__/components/index_table.test.js b/x-pack/plugins/index_management/__jest__/components/index_table.test.js
@@ -88,7 +88,7 @@ const snapshot = (rendered) => {
   expect(rendered).toMatchSnapshot();
 };
 
-const openMenuAndClickButton = (rendered, rowIndex, buttonIndex) => {
+const openMenuAndClickButton = (rendered, rowIndex, buttonSelector) => {
   // Select a row.
   const checkboxes = findTestSubject(rendered, 'indexTableRowCheckbox');
   checkboxes.at(rowIndex).simulate('change', { target: { checked: true } });
@@ -100,18 +100,18 @@ const openMenuAndClickButton = (rendered, rowIndex, buttonIndex) => {
   rendered.update();
 
   // Click an action in the context menu.
-  const contextMenuButtons = findTestSubject(rendered, 'indexTableContextMenuButton');
-  contextMenuButtons.at(buttonIndex).simulate('click');
+  const contextMenuButton = findTestSubject(rendered, buttonSelector);
+  contextMenuButton.simulate('click');
   rendered.update();
 };
 
-const testEditor = (rendered, buttonIndex, rowIndex = 0) => {
-  openMenuAndClickButton(rendered, rowIndex, buttonIndex);
+const testEditor = (rendered, buttonSelector, rowIndex = 0) => {
+  openMenuAndClickButton(rendered, rowIndex, buttonSelector);
   rendered.update();
   snapshot(findTestSubject(rendered, 'detailPanelTabSelected').text());
 };
 
-const testAction = (rendered, buttonIndex, rowIndex = 0) => {
+const testAction = (rendered, buttonSelector, rowIndex = 0) => {
   // This is leaking some implementation details about how Redux works. Not sure exactly what's going on
   // but it looks like we're aware of how many Redux actions are dispatched in response to user interaction,
   // so we "time" our assertion based on how many Redux actions we observe. This is brittle because it
@@ -127,7 +127,7 @@ const testAction = (rendered, buttonIndex, rowIndex = 0) => {
     dispatchedActionsCount++;
   });
 
-  openMenuAndClickButton(rendered, rowIndex, buttonIndex);
+  openMenuAndClickButton(rendered, rowIndex, buttonSelector);
   // take snapshot of initial state.
   snapshot(status(rendered, rowIndex));
 };
@@ -140,6 +140,11 @@ const namesText = (rendered) => {
   return names(rendered).map((button) => button.text());
 };
 
+const getActionMenuButtons = (rendered) => {
+  return findTestSubject(rendered, 'indexContextMenu')
+    .find('button')
+    .map((span) => span.text());
+};
 describe('index table', () => {
   beforeEach(() => {
     // Mock initialization of services
@@ -232,7 +237,7 @@ describe('index table', () => {
     await runAllPromises();
     rendered.update();
 
-    let button = findTestSubject(rendered, 'indexTableContextMenuButton');
+    let button = findTestSubject(rendered, 'indexActionsContextMenuButton');
     expect(button.length).toEqual(0);
 
     const checkboxes = findTestSubject(rendered, 'indexTableRowCheckbox');
@@ -247,7 +252,7 @@ describe('index table', () => {
     await runAllPromises();
     rendered.update();
 
-    let button = findTestSubject(rendered, 'indexTableContextMenuButton');
+    let button = findTestSubject(rendered, 'indexActionsContextMenuButton');
     expect(button.length).toEqual(0);
 
     const checkboxes = findTestSubject(rendered, 'indexTableRowCheckbox');
@@ -353,7 +358,7 @@ describe('index table', () => {
     const actionButton = findTestSubject(rendered, 'indexActionsContextMenuButton');
     actionButton.simulate('click');
     rendered.update();
-    snapshot(findTestSubject(rendered, 'indexTableContextMenuButton').map((span) => span.text()));
+    snapshot(getActionMenuButtons(rendered));
   });
 
   test('should show the right context menu options when one index is selected and closed', async () => {
@@ -367,7 +372,7 @@ describe('index table', () => {
     const actionButton = findTestSubject(rendered, 'indexActionsContextMenuButton');
     actionButton.simulate('click');
     rendered.update();
-    snapshot(findTestSubject(rendered, 'indexTableContextMenuButton').map((span) => span.text()));
+    snapshot(getActionMenuButtons(rendered));
   });
 
   test('should show the right context menu options when one open and one closed index is selected', async () => {
@@ -382,7 +387,7 @@ describe('index table', () => {
     const actionButton = findTestSubject(rendered, 'indexActionsContextMenuButton');
     actionButton.simulate('click');
     rendered.update();
-    snapshot(findTestSubject(rendered, 'indexTableContextMenuButton').map((span) => span.text()));
+    snapshot(getActionMenuButtons(rendered));
   });
 
   test('should show the right context menu options when more than one open index is selected', async () => {
@@ -397,7 +402,7 @@ describe('index table', () => {
     const actionButton = findTestSubject(rendered, 'indexActionsContextMenuButton');
     actionButton.simulate('click');
     rendered.update();
-    snapshot(findTestSubject(rendered, 'indexTableContextMenuButton').map((span) => span.text()));
+    snapshot(getActionMenuButtons(rendered));
   });
 
   test('should show the right context menu options when more than one closed index is selected', async () => {
@@ -412,28 +417,28 @@ describe('index table', () => {
     const actionButton = findTestSubject(rendered, 'indexActionsContextMenuButton');
     actionButton.simulate('click');
     rendered.update();
-    snapshot(findTestSubject(rendered, 'indexTableContextMenuButton').map((span) => span.text()));
+    snapshot(getActionMenuButtons(rendered));
   });
 
   test('flush button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testAction(rendered, 8);
+    testAction(rendered, 'flushIndexMenuButton');
   });
 
   test('clear cache button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testAction(rendered, 7);
+    testAction(rendered, 'clearCacheIndexMenuButton');
   });
 
   test('refresh button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testAction(rendered, 6);
+    testAction(rendered, 'refreshIndexMenuButton');
   });
 
   test('force merge button works from context menu', async () => {
@@ -442,7 +447,7 @@ describe('index table', () => {
     rendered.update();
 
     const rowIndex = 0;
-    openMenuAndClickButton(rendered, rowIndex, 5);
+    openMenuAndClickButton(rendered, rowIndex, 'forcemergeIndexMenuButton');
     snapshot(status(rendered, rowIndex));
     expect(rendered.find('.euiModal').length).toBe(1);
 
@@ -478,7 +483,7 @@ describe('index table', () => {
       JSON.stringify(modifiedIndices),
     ]);
 
-    testAction(rendered, 4);
+    testAction(rendered, 'closeIndexMenuButton');
   });
 
   test('open index button works from context menu', async () => {
@@ -499,34 +504,34 @@ describe('index table', () => {
       JSON.stringify(modifiedIndices),
     ]);
 
-    testAction(rendered, 3, 1);
+    testAction(rendered, 'openIndexMenuButton', 1);
   });
 
   test('show settings button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testEditor(rendered, 0);
+    testEditor(rendered, 'showSettingsIndexMenuButton');
   });
 
   test('show mappings button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testEditor(rendered, 1);
+    testEditor(rendered, 'showMappingsIndexMenuButton');
   });
 
   test('show stats button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testEditor(rendered, 2);
+    testEditor(rendered, 'showStatsIndexMenuButton');
   });
 
   test('edit index button works from context menu', async () => {
     const rendered = mountWithIntl(component);
     await runAllPromises();
     rendered.update();
-    testEditor(rendered, 3);
+    testEditor(rendered, 'editIndexMenuButton');
   });
 });
diff --git a/...ication/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.js b/...ication/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.js
@@ -75,6 +75,7 @@ export class IndexActionsContextMenu extends Component {
     const items = [];
     if (!detailPanel && selectedIndexCount === 1) {
       items.push({
+        'data-test-subj': 'showSettingsIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.showIndexSettingsLabel', {
           defaultMessage:
             'Show {selectedIndexCount, plural, one {index} other {indices} } settings',
@@ -85,6 +86,7 @@ export class IndexActionsContextMenu extends Component {
         },
       });
       items.push({
+        'data-test-subj': 'showMappingsIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.showIndexMappingLabel', {
           defaultMessage: 'Show {selectedIndexCount, plural, one {index} other {indices} } mapping',
           values: { selectedIndexCount },
@@ -95,6 +97,7 @@ export class IndexActionsContextMenu extends Component {
       });
       if (allOpen) {
         items.push({
+          'data-test-subj': 'showStatsIndexMenuButton',
           name: i18n.translate('xpack.idxMgmt.indexActionsMenu.showIndexStatsLabel', {
             defaultMessage: 'Show {selectedIndexCount, plural, one {index} other {indices} } stats',
             values: { selectedIndexCount },
@@ -105,6 +108,7 @@ export class IndexActionsContextMenu extends Component {
         });
       }
       items.push({
+        'data-test-subj': 'editIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.editIndexSettingsLabel', {
           defaultMessage:
             'Edit {selectedIndexCount, plural, one {index} other {indices} } settings',
@@ -117,6 +121,7 @@ export class IndexActionsContextMenu extends Component {
     }
     if (allOpen) {
       items.push({
+        'data-test-subj': 'closeIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.closeIndexLabel', {
           defaultMessage: 'Close {selectedIndexCount, plural, one {index} other {indices} }',
           values: { selectedIndexCount },
@@ -131,6 +136,7 @@ export class IndexActionsContextMenu extends Component {
         },
       });
       items.push({
+        'data-test-subj': 'forcemergeIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.forceMergeIndexLabel', {
           defaultMessage: 'Force merge {selectedIndexCount, plural, one {index} other {indices} }',
           values: { selectedIndexCount },
@@ -141,6 +147,7 @@ export class IndexActionsContextMenu extends Component {
         },
       });
       items.push({
+        'data-test-subj': 'refreshIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.refreshIndexLabel', {
           defaultMessage: 'Refresh {selectedIndexCount, plural, one {index} other {indices} }',
           values: { selectedIndexCount },
@@ -150,6 +157,7 @@ export class IndexActionsContextMenu extends Component {
         },
       });
       items.push({
+        'data-test-subj': 'clearCacheIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.clearIndexCacheLabel', {
           defaultMessage: 'Clear {selectedIndexCount, plural, one {index} other {indices} } cache',
           values: { selectedIndexCount },
@@ -159,6 +167,7 @@ export class IndexActionsContextMenu extends Component {
         },
       });
       items.push({
+        'data-test-subj': 'flushIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.flushIndexLabel', {
           defaultMessage: 'Flush {selectedIndexCount, plural, one {index} other {indices} }',
           values: { selectedIndexCount },
@@ -191,6 +200,7 @@ export class IndexActionsContextMenu extends Component {
       }
     } else {
       items.push({
+        'data-test-subj': 'openIndexMenuButton',
         name: i18n.translate('xpack.idxMgmt.indexActionsMenu.openIndexLabel', {
           defaultMessage: 'Open {selectedIndexCount, plural, one {index} other {indices} }',
           values: { selectedIndexCount },
@@ -239,9 +249,6 @@ export class IndexActionsContextMenu extends Component {
         }
       }
     });
-    items.forEach((item) => {
-      item['data-test-subj'] = 'indexTableContextMenuButton';
-    });
     const panelTree = {
       id: 0,
       title: i18n.translate('xpack.idxMgmt.indexActionsMenu.panelTitle', {
@@ -732,7 +739,11 @@ export class IndexActionsContextMenu extends Component {
                 anchorPosition={anchorPosition}
                 repositionOnScroll
               >
-                <EuiContextMenu initialPanelId={0} panels={panels} />
+                <EuiContextMenu
+                  initialPanelId={0}
+                  panels={panels}
+                  data-test-subj="indexContextMenu"
+                />
               </EuiPopover>
             </div>
           );