From 49849cf42c3d9febdd7ace60888b3c03b637b088 Mon Sep 17 00:00:00 2001 From: Antonio Date: Wed, 9 Aug 2023 17:22:05 +0200 Subject: [PATCH] [Cases] Fix flaky test in user actions pagination (#163474) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fixes #156750 Fixes #156747 Fixes #156744 Fixes #156743 Fixes #156748 Fixes #156746 Fixes #156745 Fixes #156749 ## Summary Basically what you suggested offline @js-jankisalvi. | Scenario | Old Test | Functional test where it is covered | | ------------- | ------------- | ------------- | | Only shows one list of user actions when `total_user_actions < 10` | `'renders only one action list when user actions are less than or equal to 10'` | `'initially renders user actions list correctly'`| | `Show More` button does not show up when `total_user_actions <= page_size` | `'shows more button visible 21st user action added'` | `'initially renders user actions list correctly'` | | Shows 2 user action lists when `total_user_actions > page_size` | `'renders two user actions list when user actions are more than 10'` | `'shows more actions on button click'` | | loading spinner | `'Loading spinner when user actions loading'` | `'shows more actions on button click'` | ## Flaky Test Runner Let's make sure that the functional tests don't become flaky too. https://buildkite.com/elastic/kibana-flaky-test-suite-runner/builds/2826 --- .../components/user_actions/index.test.tsx | 225 ------------------ .../apps/cases/group1/view_case.ts | 12 + 2 files changed, 12 insertions(+), 225 deletions(-) diff --git a/x-pack/plugins/cases/public/components/user_actions/index.test.tsx b/x-pack/plugins/cases/public/components/user_actions/index.test.tsx index 1d3ba134f7e6d..15c2a8661edb0 100644 --- a/x-pack/plugins/cases/public/components/user_actions/index.test.tsx +++ b/x-pack/plugins/cases/public/components/user_actions/index.test.tsx @@ -373,229 +373,4 @@ describe.skip(`UserActions`, () => { expect(screen.getAllByText('Damaged Raccoon')[0]).toBeInTheDocument(); }); }); - - // FLAKY: https://github.com/elastic/kibana/issues/156750 - // FLAKY: https://github.com/elastic/kibana/issues/156749 - // FLAKY: https://github.com/elastic/kibana/issues/156748 - // FLAKY: https://github.com/elastic/kibana/issues/156747 - // FLAKY: https://github.com/elastic/kibana/issues/156746 - // FLAKY: https://github.com/elastic/kibana/issues/156745 - // FLAKY: https://github.com/elastic/kibana/issues/156744 - // FLAKY: https://github.com/elastic/kibana/issues/156743 - describe.skip('pagination', () => { - beforeEach(() => { - jest.clearAllMocks(); - }); - - it('Loading spinner when user actions loading', () => { - useFindCaseUserActionsMock.mockReturnValue({ isLoading: true }); - useInfiniteFindCaseUserActionsMock.mockReturnValue({ isLoading: true }); - appMockRender.render( - - ); - - expect(screen.getByTestId('user-actions-loading')).toBeInTheDocument(); - }); - - it('renders two user actions list when user actions are more than 10', () => { - appMockRender.render(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(2); - }); - - it('renders only one user actions list when last page is 0', async () => { - useFindCaseUserActionsMock.mockReturnValue({ - ...defaultUseFindCaseUserActions, - data: { userActions: [] }, - }); - const props = { - ...defaultProps, - userActionsStats: { - total: 0, - totalComments: 0, - totalOtherActions: 0, - }, - }; - - appMockRender.render(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(1); - }); - - it('renders only one user actions list when last page is 1', async () => { - useFindCaseUserActionsMock.mockReturnValue({ - ...defaultUseFindCaseUserActions, - data: { userActions: [] }, - }); - const props = { - ...defaultProps, - userActionsStats: { - total: 1, - totalComments: 0, - totalOtherActions: 1, - }, - }; - - appMockRender.render(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(1); - }); - - it('renders only one action list when user actions are less than or equal to 10', async () => { - useFindCaseUserActionsMock.mockReturnValue({ - ...defaultUseFindCaseUserActions, - data: { userActions: [] }, - }); - const props = { - ...defaultProps, - userActionsStats: { - total: 10, - totalComments: 6, - totalOtherActions: 4, - }, - }; - - appMockRender.render(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(1); - }); - - it('call fetchNextPage on showMore button click', async () => { - useInfiniteFindCaseUserActionsMock.mockReturnValue({ - ...defaultInfiniteUseFindCaseUserActions, - hasNextPage: true, - }); - const props = { - ...defaultProps, - userActionsStats: { - total: 25, - totalComments: 10, - totalOtherActions: 15, - }, - }; - - appMockRender.render(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(2); - - const showMore = screen.getByTestId('cases-show-more-user-actions'); - - expect(showMore).toBeInTheDocument(); - - userEvent.click(showMore); - - await waitFor(() => { - expect(defaultInfiniteUseFindCaseUserActions.fetchNextPage).toHaveBeenCalled(); - }); - }); - - it('shows more button visible 21st user action added', async () => { - const mockUserActions = [ - ...caseUserActions, - getUserAction('comment', UserActionActions.create), - getUserAction('comment', UserActionActions.update), - getUserAction('comment', UserActionActions.create), - getUserAction('comment', UserActionActions.update), - getUserAction('comment', UserActionActions.create), - getUserAction('comment', UserActionActions.update), - getUserAction('comment', UserActionActions.create), - ]; - useInfiniteFindCaseUserActionsMock.mockReturnValue({ - ...defaultInfiniteUseFindCaseUserActions, - data: { - pages: [ - { - total: 20, - page: 1, - perPage: 10, - userActions: mockUserActions, - }, - ], - }, - }); - useFindCaseUserActionsMock.mockReturnValue({ - ...defaultUseFindCaseUserActions, - data: { - total: 20, - page: 2, - perPage: 10, - userActions: mockUserActions, - }, - }); - const props = { - ...defaultProps, - userActionsStats: { - total: 20, - totalComments: 10, - totalOtherActions: 10, - }, - }; - - const { rerender } = appMockRender.render(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(2); - expect(screen.queryByTestId('cases-show-more-user-actions')).not.toBeInTheDocument(); - - useInfiniteFindCaseUserActionsMock.mockReturnValue({ - ...defaultInfiniteUseFindCaseUserActions, - data: { - pages: [ - { - total: 21, - page: 1, - perPage: 10, - userActions: mockUserActions, - }, - { - total: 21, - page: 2, - perPage: 10, - userActions: [getUserAction('comment', UserActionActions.create)], - }, - ], - }, - hasNextPage: true, - }); - useFindCaseUserActionsMock.mockReturnValue({ - ...defaultUseFindCaseUserActions, - data: { - total: 21, - page: 2, - perPage: 10, - userActions: mockUserActions, - }, - }); - - const newProps = { - ...props, - userActionsStats: { - total: 21, - totalComments: 11, - totalOtherActions: 10, - }, - }; - - rerender(); - - await waitForComponentToUpdate(); - - expect(screen.getAllByTestId('user-actions-list')).toHaveLength(2); - - const firstUserActionsList = screen.getAllByTestId('user-actions-list')[0]; - - expect(firstUserActionsList.getElementsByTagName('li')).toHaveLength(11); - - expect(screen.getByTestId('cases-show-more-user-actions')).toBeInTheDocument(); - }); - }); }); diff --git a/x-pack/test/functional_with_es_ssl/apps/cases/group1/view_case.ts b/x-pack/test/functional_with_es_ssl/apps/cases/group1/view_case.ts index ab4ed59336826..b44f62e71b9a0 100644 --- a/x-pack/test/functional_with_es_ssl/apps/cases/group1/view_case.ts +++ b/x-pack/test/functional_with_es_ssl/apps/cases/group1/view_case.ts @@ -724,6 +724,16 @@ export default ({ getPageObject, getService }: FtrProviderContext) => { await cases.api.deleteAllCases(); }); + it('initially renders user actions list correctly', async () => { + expect(testSubjects.missingOrFail('cases-show-more-user-actions')); + + const userActionsLists = await find.allByCssSelector( + '[data-test-subj="user-actions-list"]' + ); + + expect(userActionsLists).length(1); + }); + it('shows more actions on button click', async () => { await cases.api.generateUserActions({ caseId: createdCase.id, @@ -731,6 +741,8 @@ export default ({ getPageObject, getService }: FtrProviderContext) => { totalUpdates: 4, }); + expect(testSubjects.missingOrFail('user-actions-loading')); + await header.waitUntilLoadingHasFinished(); await testSubjects.click('case-refresh');