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