From 3808ddf9480b58cdbf05dce6bfb9740c5787a597 Mon Sep 17 00:00:00 2001 From: Ashley Harrison Date: Fri, 12 Dec 2025 11:08:04 +0000 Subject: [PATCH] "fix" some CorrelationsPage tests --- .../correlations/CorrelationsPage.test.tsx | 26 ++++++++++++++----- 1 file changed, 19 insertions(+), 7 deletions(-) diff --git a/public/app/features/correlations/CorrelationsPage.test.tsx b/public/app/features/correlations/CorrelationsPage.test.tsx index f8938a14a94..87559af1c9e 100644 --- a/public/app/features/correlations/CorrelationsPage.test.tsx +++ b/public/app/features/correlations/CorrelationsPage.test.tsx @@ -1,4 +1,4 @@ -import { render, waitFor, screen, within, Matcher, getByRole } from '@testing-library/react'; +import { render, waitFor, screen, within, Matcher, getByRole, act, fireEvent } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import { merge, uniqueId } from 'lodash'; import { openMenu } from 'react-select-event'; @@ -300,7 +300,9 @@ describe('CorrelationsPage', () => { await userEvent.click(screen.getByText('Regular expression')); await userEvent.type(screen.getByLabelText(/expression/i), 'test expression'); - await userEvent.click(await screen.findByRole('button', { name: /add$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /add$/i }))); await waitFor(() => { expect(mocks.reportInteraction).toHaveBeenCalledWith('grafana_correlations_added'); @@ -451,7 +453,9 @@ describe('CorrelationsPage', () => { await userEvent.clear(screen.getByRole('textbox', { name: /results field/i })); await userEvent.type(screen.getByRole('textbox', { name: /results field/i }), 'Line'); - await userEvent.click(screen.getByRole('button', { name: /add$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /add$/i }))); await waitFor(() => { expect(mocks.reportInteraction).toHaveBeenCalledWith('grafana_correlations_added'); @@ -518,7 +522,9 @@ describe('CorrelationsPage', () => { await userEvent.click(screen.getByRole('button', { name: /next$/i })); await userEvent.click(screen.getByRole('button', { name: /next$/i })); - await userEvent.click(screen.getByRole('button', { name: /save$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /save$/i }))); expect(await screen.findByRole('cell', { name: /edited label$/i }, { timeout: 5000 })).toBeInTheDocument(); @@ -536,7 +542,9 @@ describe('CorrelationsPage', () => { const rowExpanderButton = within(tableRows[0]).getByRole('button', { name: /toggle row expanded/i }); await userEvent.click(rowExpanderButton); - await userEvent.click(screen.getByRole('button', { name: /next$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /next$/i }))); await userEvent.click(screen.getByRole('button', { name: /next$/i })); // select Logfmt, be sure expression field is disabled @@ -575,7 +583,9 @@ describe('CorrelationsPage', () => { await userEvent.click(screen.getByRole('button', { name: /save$/i })); expect(screen.getByText('Please define an expression')).toBeInTheDocument(); await userEvent.type(screen.getByLabelText(/expression/i), 'test expression'); - await userEvent.click(screen.getByRole('button', { name: /save$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /save$/i }))); await waitFor(() => { expect(mocks.reportInteraction).toHaveBeenCalledWith('grafana_correlations_edited'); }); @@ -726,7 +736,9 @@ describe('CorrelationsPage', () => { expect(descriptionInput).toBeInTheDocument(); expect(descriptionInput).toHaveAttribute('readonly'); - await userEvent.click(screen.getByRole('button', { name: /next$/i })); + // TODO investigate why we need act/fireEvent + // see https://github.com/testing-library/react-testing-library/issues/1375 + await act(() => fireEvent.click(screen.getByRole('button', { name: /next$/i }))); await userEvent.click(screen.getByRole('button', { name: /next$/i })); // expect the transformation to exist but be read only