Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[8.x] [ResponseOps][Cases] Remove appMockRender from flaky tests (#201406) #201504

Open
wants to merge 1 commit into
base: 8.x
Choose a base branch
from
Open

[8.x] [ResponseOps][Cases] Remove appMockRender from flaky tests (#201406) #201504

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 5 additions & 17 deletions x-pack/plugins/cases/public/components/case_form_fields/severity.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,7 @@
*/

import React from 'react';
import { screen, waitFor } from '@testing-library/react';
import type { AppMockRenderer } from '../../common/mock';
import { createAppMockRenderer } from '../../common/mock';
import { render, screen, waitFor } from '@testing-library/react';
import { Severity } from './severity';
import userEvent from '@testing-library/user-event';
import { waitForEuiPopoverOpen } from '@elastic/eui/lib/test/rtl';
Expand All @@ -17,18 +15,8 @@ import { FormTestComponent } from '../../common/test_utils';
const onSubmit = jest.fn();

describe('Severity form field', () => {
let appMockRender: AppMockRenderer;

beforeEach(() => {
appMockRender = createAppMockRenderer();
});

afterEach(async () => {
await appMockRender.clearQueryCache();
});

it('renders', async () => {
appMockRender.render(
render(
<FormTestComponent onSubmit={onSubmit}>
<Severity isLoading={false} />
</FormTestComponent>
Expand All @@ -40,7 +28,7 @@ describe('Severity form field', () => {

// default to LOW in this test configuration
it('defaults to the correct value', async () => {
appMockRender.render(
render(
<FormTestComponent onSubmit={onSubmit}>
<Severity isLoading={false} />
</FormTestComponent>
Expand All @@ -51,7 +39,7 @@ describe('Severity form field', () => {
});

it('selects the correct value when changed', async () => {
appMockRender.render(
render(
<FormTestComponent onSubmit={onSubmit}>
<Severity isLoading={false} />
</FormTestComponent>
Expand All @@ -73,7 +61,7 @@ describe('Severity form field', () => {
});

it('disables when loading data', async () => {
appMockRender.render(
render(
<FormTestComponent onSubmit={onSubmit}>
<Severity isLoading={true} />
</FormTestComponent>
Expand Down
11 changes: 4 additions & 7 deletions x-pack/plugins/cases/public/components/case_form_fields/title.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@

import type { FC, PropsWithChildren } from 'react';
import React from 'react';
import { screen } from '@testing-library/react';
import { render, screen } from '@testing-library/react';

import type { FormHook } from '@kbn/es-ui-shared-plugin/static/forms/hook_form_lib';
import type { CaseFormFieldsSchemaProps } from './schema';
Expand All @@ -17,11 +17,9 @@ import userEvent from '@testing-library/user-event';

import { Title } from './title';
import { schema } from '../create/schema';
import { createAppMockRenderer, type AppMockRenderer } from '../../common/mock';

describe('Title', () => {
let globalForm: FormHook;
let appMockRender: AppMockRenderer;

const MockHookWrapperComponent: FC<PropsWithChildren<unknown>> = ({ children }) => {
const { form } = useForm<CaseFormFieldsSchemaProps>({
Expand All @@ -38,11 +36,10 @@ describe('Title', () => {

beforeEach(() => {
jest.resetAllMocks();
appMockRender = createAppMockRenderer();
});

it('it renders', async () => {
appMockRender.render(
render(
<MockHookWrapperComponent>
<Title isLoading={false} />
</MockHookWrapperComponent>
Expand All @@ -52,7 +49,7 @@ describe('Title', () => {
});

it('it disables the input when loading', async () => {
appMockRender.render(
render(
<MockHookWrapperComponent>
<Title isLoading={true} />
</MockHookWrapperComponent>
Expand All @@ -61,7 +58,7 @@ describe('Title', () => {
});

it('it changes the title', async () => {
appMockRender.render(
render(
<MockHookWrapperComponent>
<Title isLoading={false} />
</MockHookWrapperComponent>
Expand Down
32 changes: 11 additions & 21 deletions x-pack/plugins/cases/public/components/filter_popover/index.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,31 +6,21 @@
*/

import React from 'react';
import { waitForEuiPopoverOpen, screen } from '@elastic/eui/lib/test/rtl';
import { waitFor } from '@testing-library/react';
import { waitForEuiPopoverOpen } from '@elastic/eui/lib/test/rtl';
import { render, waitFor, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';

import type { AppMockRenderer } from '../../common/mock';
import { createAppMockRenderer } from '../../common/mock';

import { FilterPopover } from '.';

describe('FilterPopover ', () => {
let appMockRender: AppMockRenderer;
const onSelectedOptionsChanged = jest.fn();
const tags: string[] = ['coke', 'pepsi'];

beforeEach(() => {
appMockRender = createAppMockRenderer();
jest.clearAllMocks();
});

afterEach(async () => {
await appMockRender.clearQueryCache();
});

it('renders button label correctly', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -43,7 +33,7 @@ describe('FilterPopover ', () => {
});

it('renders empty label correctly', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -61,7 +51,7 @@ describe('FilterPopover ', () => {
});

it('renders string type options correctly', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -79,7 +69,7 @@ describe('FilterPopover ', () => {
});

it('should call onSelectionChange with selected option', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -100,7 +90,7 @@ describe('FilterPopover ', () => {
});

it('should call onSelectionChange with empty array when option is deselected', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -126,7 +116,7 @@ describe('FilterPopover ', () => {
const maxLengthLabel = `You have selected maximum number of ${maxLength} tags to filter`;

it('should show message when maximum options are selected', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -152,7 +142,7 @@ describe('FilterPopover ', () => {
});

it('should not show message when maximum length label is missing', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -176,7 +166,7 @@ describe('FilterPopover ', () => {
});

it('should not show message and disable options when maximum length property is missing', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand All @@ -198,7 +188,7 @@ describe('FilterPopover ', () => {
});

it('should allow to select more options when maximum length property is missing', async () => {
appMockRender.render(
render(
<FilterPopover
buttonLabel={'Tags'}
onSelectedOptionsChanged={onSelectedOptionsChanged}
Expand Down
10 changes: 2 additions & 8 deletions x-pack/plugins/cases/public/components/user_actions/comment/registered_attachments.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
*/

import React from 'react';
import { screen } from '@testing-library/react';
import { render, screen } from '@testing-library/react';

import type {
AttachmentType,
Expand All @@ -16,8 +16,6 @@ import { AttachmentActionType } from '../../../client/attachment_framework/types
import { AttachmentTypeRegistry } from '../../../../common/registry';
import { getMockBuilderArgs } from '../mock';
import { createRegisteredAttachmentUserActionBuilder } from './registered_attachments';
import type { AppMockRenderer } from '../../../common/mock';
import { createAppMockRenderer } from '../../../common/mock';

const getLazyComponent = () =>
React.lazy(() => {
Expand All @@ -32,8 +30,6 @@ const getLazyComponent = () =>
});

describe('createRegisteredAttachmentUserActionBuilder', () => {
let appMockRender: AppMockRenderer;

const attachmentTypeId = 'test';
const builderArgs = getMockBuilderArgs();
const registry = new AttachmentTypeRegistry<AttachmentType<CommonAttachmentViewProps>>(
Expand Down Expand Up @@ -77,7 +73,6 @@ describe('createRegisteredAttachmentUserActionBuilder', () => {
};

beforeEach(() => {
appMockRender = createAppMockRenderer();
jest.clearAllMocks();
});

Expand Down Expand Up @@ -161,8 +156,7 @@ describe('createRegisteredAttachmentUserActionBuilder', () => {
const userAction =
createRegisteredAttachmentUserActionBuilder(userActionBuilderArgs).build()[0];

// @ts-expect-error: children is a proper React element
appMockRender.render(userAction.children);
render(userAction.children);

expect(await screen.findByText('My component')).toBeInTheDocument();
});
Expand Down
16 changes: 5 additions & 11 deletions x-pack/plugins/cases/public/components/user_actions/show_more_button.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,31 +6,25 @@
*/

import React from 'react';
import { screen } from '@testing-library/react';
import { screen, render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { ShowMoreButton } from './show_more_button';
import type { AppMockRenderer } from '../../common/mock';
import { createAppMockRenderer } from '../../common/mock';

const showMoreClickMock = jest.fn();

// FLAKY: https://github.com/elastic/kibana/issues/192672
describe.skip('ShowMoreButton', () => {
let appMockRender: AppMockRenderer;

describe('ShowMoreButton', () => {
beforeEach(() => {
jest.clearAllMocks();
appMockRender = createAppMockRenderer();
});

it('renders correctly', () => {
appMockRender.render(<ShowMoreButton onShowMoreClick={showMoreClickMock} />);
render(<ShowMoreButton onShowMoreClick={showMoreClickMock} />);

expect(screen.getByTestId('cases-show-more-user-actions')).toBeInTheDocument();
});

it('shows loading state and is disabled when isLoading is true', () => {
appMockRender.render(<ShowMoreButton onShowMoreClick={showMoreClickMock} isLoading={true} />);
render(<ShowMoreButton onShowMoreClick={showMoreClickMock} isLoading={true} />);

const btn = screen.getByTestId('cases-show-more-user-actions');

Expand All @@ -40,7 +34,7 @@ describe.skip('ShowMoreButton', () => {
});

it('calls onShowMoreClick on button click', async () => {
appMockRender.render(<ShowMoreButton onShowMoreClick={showMoreClickMock} />);
render(<ShowMoreButton onShowMoreClick={showMoreClickMock} />);

await userEvent.click(screen.getByTestId('cases-show-more-user-actions'));
expect(showMoreClickMock).toHaveBeenCalled();
Expand Down