[Cases] Fix edit tags flaky tests (elastic#175763)

## Summary Fixes: elastic#175655, elastic#175623, elastic#175622, elastic#175619, elastic#175618 ### Checklist Delete any items that are not applicable to this PR. - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios ### For maintainers - [x] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
CoenWarmer · Feb 15, 2024 · 2b6e02e · 2b6e02e
1 parent ce8d3fc
commit 2b6e02e
Showing 1 changed file with 38 additions and 58 deletions.
diff --git a/x-pack/plugins/cases/public/components/case_view/components/edit_tags.test.tsx b/x-pack/plugins/cases/public/components/case_view/components/edit_tags.test.tsx
@@ -11,7 +11,7 @@ import userEvent from '@testing-library/user-event';
 
 import type { EditTagsProps } from './edit_tags';
 import { EditTags } from './edit_tags';
-import { readCasesPermissions, TestProviders, createAppMockRenderer } from '../../../common/mock';
+import { readCasesPermissions, createAppMockRenderer } from '../../../common/mock';
 import type { AppMockRenderer } from '../../../common/mock';
 import { useGetTags } from '../../../containers/use_get_tags';
 import { MAX_LENGTH_PER_TAG } from '../../../../common/constants';
@@ -25,15 +25,7 @@ const defaultProps: EditTagsProps = {
   tags: [],
 };
 
-// The suite is skipped for having several flaky tests
-// See:
-// https://github.com/elastic/kibana/issues/175618
-// https://github.com/elastic/kibana/issues/175619
-// https://github.com/elastic/kibana/issues/175621
-// https://github.com/elastic/kibana/issues/175622
-// https://github.com/elastic/kibana/issues/175623
-// https://github.com/elastic/kibana/issues/175655
-describe.skip('EditTags ', () => {
+describe('EditTags ', () => {
   let appMockRender: AppMockRenderer;
 
   const sampleTags = ['coke', 'pepsi'];
@@ -46,128 +38,116 @@ describe.skip('EditTags ', () => {
       data: sampleTags,
       refetch: fetchTags,
     }));
+
     appMockRender = createAppMockRenderer();
   });
 
   it('renders no tags, and then edit', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    expect(screen.getByTestId('no-tags')).toBeInTheDocument();
+    expect(await screen.findByTestId('no-tags')).toBeInTheDocument();
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
     await waitFor(() => {
       expect(screen.queryByTestId('no-tags')).not.toBeInTheDocument();
-      expect(screen.getByTestId('edit-tags')).toBeInTheDocument();
     });
+
+    expect(await screen.findByTestId('edit-tags')).toBeInTheDocument();
   });
 
   it('edit tag from options on submit', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    userEvent.type(screen.getByRole('combobox'), `${sampleTags[0]}{enter}`);
+    userEvent.type(await screen.findByRole('combobox'), `${sampleTags[0]}{enter}`);
 
-    userEvent.click(screen.getByTestId('edit-tags-submit'));
+    userEvent.click(await screen.findByTestId('edit-tags-submit'));
 
     await waitFor(() => expect(onSubmit).toBeCalledWith([sampleTags[0]]));
   });
 
   it('add new tags on submit', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    await waitFor(() => {
-      expect(screen.getByTestId('edit-tags')).toBeInTheDocument();
-    });
+    expect(await screen.findByTestId('edit-tags')).toBeInTheDocument();
 
-    userEvent.type(screen.getByRole('combobox'), 'dude{enter}');
+    userEvent.type(await screen.findByRole('combobox'), 'dude{enter}');
 
-    userEvent.click(screen.getByTestId('edit-tags-submit'));
+    userEvent.click(await screen.findByTestId('edit-tags-submit'));
 
     await waitFor(() => expect(onSubmit).toBeCalledWith(['dude']));
   });
 
   it('trims the tags on submit', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    await waitFor(() => {
-      expect(screen.getByTestId('edit-tags')).toBeInTheDocument();
-    });
+    expect(await screen.findByTestId('edit-tags')).toBeInTheDocument();
 
-    userEvent.type(screen.getByRole('combobox'), 'dude      {enter}');
+    userEvent.type(await screen.findByRole('combobox'), 'dude      {enter}');
 
-    userEvent.click(screen.getByTestId('edit-tags-submit'));
+    userEvent.click(await screen.findByTestId('edit-tags-submit'));
 
     await waitFor(() => expect(onSubmit).toBeCalledWith(['dude']));
   });
 
   it('cancels on cancel', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    userEvent.type(screen.getByRole('combobox'), 'new{enter}');
+    userEvent.type(await screen.findByRole('combobox'), 'new{enter}');
 
-    await waitFor(() => {
-      expect(screen.getByTestId('comboBoxInput')).toHaveTextContent('new');
-    });
+    expect(await screen.findByTestId('comboBoxInput')).toHaveTextContent('new');
 
-    userEvent.click(screen.getByTestId('edit-tags-cancel'));
+    userEvent.click(await screen.findByTestId('edit-tags-cancel'));
 
     await waitFor(() => {
       expect(onSubmit).not.toBeCalled();
-      expect(screen.getByTestId('no-tags')).toBeInTheDocument();
     });
+
+    expect(await screen.findByTestId('no-tags')).toBeInTheDocument();
   });
 
   it('shows error when tag is empty', async () => {
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    await waitFor(() => {
-      expect(screen.getByTestId('edit-tags')).toBeInTheDocument();
-    });
+    expect(await screen.findByTestId('edit-tags')).toBeInTheDocument();
 
-    userEvent.type(screen.getByRole('combobox'), ' {enter}');
+    userEvent.type(await screen.findByRole('combobox'), ' {enter}');
 
-    await waitFor(() => {
-      expect(screen.getByText('A tag must contain at least one non-space character.'));
-    });
+    expect(await screen.findByText('A tag must contain at least one non-space character.'));
   });
 
   it('shows error when tag is too long', async () => {
     const longTag = 'z'.repeat(MAX_LENGTH_PER_TAG + 1);
 
     appMockRender.render(<EditTags {...defaultProps} />);
 
-    userEvent.click(screen.getByTestId('tag-list-edit-button'));
+    userEvent.click(await screen.findByTestId('tag-list-edit-button'));
 
-    await waitFor(() => {
-      expect(screen.getByTestId('edit-tags')).toBeInTheDocument();
-    });
+    expect(await screen.findByTestId('edit-tags')).toBeInTheDocument();
 
-    userEvent.paste(screen.getByRole('combobox'), `${longTag}`);
+    userEvent.paste(await screen.findByRole('combobox'), `${longTag}`);
     userEvent.keyboard('{enter}');
 
-    await waitFor(() => {
-      expect(
-        screen.getByText('The length of the tag is too long. The maximum length is 256 characters.')
-      );
-    });
+    expect(
+      await screen.findByText(
+        'The length of the tag is too long. The maximum length is 256 characters.'
+      )
+    );
   });
 
   it('does not render when the user does not have update permissions', () => {
-    appMockRender.render(
-      <TestProviders permissions={readCasesPermissions()}>
-        <EditTags {...defaultProps} />
-      </TestProviders>
-    );
+    appMockRender = createAppMockRenderer({ permissions: readCasesPermissions() });
+    appMockRender.render(<EditTags {...defaultProps} />);
 
     expect(screen.queryByTestId('tag-list-edit')).not.toBeInTheDocument();
   });