[Cases] Fix failing tests: SuggestUsersPopover (#181051)

Fixes #171600
Fixes #171601

## Summary

I refactored the tests to follow a few best practices:
- Replaced all occurrences of `waitFor(() => screen.getBy...` with
`await screen.findBy`.
- Replaces `fireEvent` with `userEvent`.
- Refactored multiple instances where we did the same query multiple
times in the same test.

This at least made the warnings go away from the test suite.

There is still a `for` loop around the tests to check for flakiness.
This commit is contained in:
Antonio 2024-04-22 11:44:54 +02:00 committed by GitHub
parent d5c1335f78
commit dd6483732d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -8,7 +8,9 @@
import React from 'react';
import type { AppMockRenderer } from '../../../common/mock';
import { createAppMockRenderer } from '../../../common/mock';
import { screen, fireEvent, waitFor } from '@testing-library/react';
import { screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import type { SuggestUsersPopoverProps } from './suggest_users_popover';
import { SuggestUsersPopover } from './suggest_users_popover';
import { userProfiles } from '../../../containers/user_profiles/api.mock';
@ -18,24 +20,25 @@ import type { AssigneeWithProfile } from '../../user_profiles/types';
jest.mock('../../../containers/user_profiles/api');
// FLAKY: https://github.com/elastic/kibana/issues/171600
// FLAKY: https://github.com/elastic/kibana/issues/171601
describe.skip('SuggestUsersPopover', () => {
const asAssignee = (profile: UserProfileWithAvatar): AssigneeWithProfile => ({
uid: profile.uid,
profile,
});
describe('SuggestUsersPopover', () => {
let appMockRender: AppMockRenderer;
let defaultProps: SuggestUsersPopoverProps;
const defaultProps: SuggestUsersPopoverProps = {
isLoading: false,
assignedUsersWithProfiles: [],
isPopoverOpen: true,
onUsersChange: jest.fn(),
togglePopover: jest.fn(),
onClosePopover: jest.fn(),
currentUserProfile: undefined,
};
beforeEach(() => {
appMockRender = createAppMockRenderer();
defaultProps = {
isLoading: false,
assignedUsersWithProfiles: [],
isPopoverOpen: true,
onUsersChange: jest.fn(),
togglePopover: jest.fn(),
onClosePopover: jest.fn(),
currentUserProfile: undefined,
};
});
it('calls onUsersChange when 1 user is selected', async () => {
@ -45,13 +48,8 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
fireEvent.change(screen.getByPlaceholderText('Search users'), { target: { value: 'dingo' } });
await waitFor(() => {
expect(screen.getByText('WD')).toBeInTheDocument();
});
fireEvent.click(screen.getByText('WD'));
userEvent.paste(await screen.findByPlaceholderText('Search users'), 'dingo');
userEvent.click(await screen.findByText('WD'));
expect(onUsersChange.mock.calls[0][0]).toMatchInlineSnapshot(`
Array [
@ -76,15 +74,9 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
fireEvent.change(screen.getByPlaceholderText('Search users'), { target: { value: 'elastic' } });
await waitFor(() => {
expect(screen.getByText('WD')).toBeInTheDocument();
expect(screen.getByText('DR')).toBeInTheDocument();
});
fireEvent.click(screen.getByText('WD'));
fireEvent.click(screen.getByText('DR'));
userEvent.paste(await screen.findByPlaceholderText('Search users'), 'elastic');
userEvent.click(await screen.findByText('WD'));
userEvent.click(await screen.findByText('DR'));
expect(onUsersChange.mock.calls[1][0]).toMatchInlineSnapshot(`
Array [
@ -124,13 +116,8 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
fireEvent.change(screen.getByPlaceholderText('Search users'), { target: { value: 'elastic' } });
await waitFor(() => {
expect(screen.getByText('WD')).toBeInTheDocument();
});
fireEvent.click(screen.getByText('WD'));
userEvent.paste(await screen.findByPlaceholderText('Search users'), 'elastic');
userEvent.click(await screen.findByText('WD'));
expect(onUsersChange.mock.calls[0][0]).toMatchInlineSnapshot(`
Array [
@ -174,14 +161,11 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
expect(screen.queryByText('assigned')).not.toBeInTheDocument();
fireEvent.change(screen.getByPlaceholderText('Search users'), { target: { value: 'dingo' } });
await waitFor(() => {
expect(screen.getByText('WD')).toBeInTheDocument();
});
userEvent.paste(await screen.findByPlaceholderText('Search users'), 'dingo');
userEvent.click(await screen.findByText('WD'));
fireEvent.click(screen.getByText('WD'));
expect(screen.getByText('1 assigned')).toBeInTheDocument();
expect(await screen.findByText('1 assigned')).toBeInTheDocument();
});
it('shows the 1 assigned total after clicking on a user', async () => {
@ -190,9 +174,11 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
expect(screen.queryByText('assigned')).not.toBeInTheDocument();
fireEvent.change(screen.getByPlaceholderText('Search users'), { target: { value: 'dingo' } });
fireEvent.click(screen.getByText('WD'));
expect(screen.getByText('1 assigned')).toBeInTheDocument();
userEvent.paste(await screen.findByPlaceholderText('Search users'), 'dingo');
userEvent.click(await screen.findByText('WD'));
expect(await screen.findByText('1 assigned')).toBeInTheDocument();
});
it('shows the 1 assigned total when the users are passed in', async () => {
@ -204,8 +190,8 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
expect(screen.getByText('1 assigned')).toBeInTheDocument();
expect(screen.getByText('Damaged Raccoon')).toBeInTheDocument();
expect(await screen.findByText('1 assigned')).toBeInTheDocument();
expect(await screen.findByText('Damaged Raccoon')).toBeInTheDocument();
});
it('calls onTogglePopover when clicking the edit button after the popover is already open', async () => {
@ -218,11 +204,9 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
await waitFor(() => {
expect(screen.getByTestId('case-view-assignees-edit-button')).not.toBeDisabled();
});
expect(await screen.findByTestId('case-view-assignees-edit-button')).not.toBeDisabled();
fireEvent.click(screen.getByTestId('case-view-assignees-edit-button'));
userEvent.click(await screen.findByTestId('case-view-assignees-edit-button'));
expect(togglePopover).toBeCalled();
});
@ -232,11 +216,6 @@ describe.skip('SuggestUsersPopover', () => {
await waitForEuiPopoverOpen();
await waitFor(() => expect(screen.getByText('Damaged Raccoon')).toBeInTheDocument());
expect(await screen.findByText('Damaged Raccoon')).toBeInTheDocument();
});
});
const asAssignee = (profile: UserProfileWithAvatar): AssigneeWithProfile => ({
uid: profile.uid,
profile,
});