diff --git a/public/app/features/logs/components/log-context/LogRowContextModal.test.tsx b/public/app/features/logs/components/log-context/LogRowContextModal.test.tsx index 6161d600cd2..cb5be11c0c6 100644 --- a/public/app/features/logs/components/log-context/LogRowContextModal.test.tsx +++ b/public/app/features/logs/components/log-context/LogRowContextModal.test.tsx @@ -9,6 +9,7 @@ import { createLogRow } from '../__mocks__/logRow'; import { LogRowContextModal } from './LogRowContextModal'; const getRowContext = jest.fn().mockResolvedValue({ data: { fields: [], rows: [] } }); +const getRowContextQuery = jest.fn().mockResolvedValue({ datasource: { uid: 'test-uid' } }); const dispatchMock = jest.fn(); jest.mock('app/types', () => ({ @@ -127,6 +128,35 @@ describe('LogRowContextModal', () => { await waitFor(() => expect(getRowContext).toHaveBeenCalledTimes(4)); }); + it('should call getRowContextQuery when limit changes', async () => { + render( + {}} + getRowContext={getRowContext} + getRowContextQuery={getRowContextQuery} + timeZone={timeZone} + /> + ); + + // this will call it initially and in the first fetchResults + await waitFor(() => expect(getRowContextQuery).toHaveBeenCalledTimes(2)); + + const tenLinesButton = screen.getByRole('button', { + name: /50 lines/i, + }); + await userEvent.click(tenLinesButton); + const twentyLinesButton = screen.getByRole('menuitemradio', { + name: /20 lines/i, + }); + act(() => { + userEvent.click(twentyLinesButton); + }); + + await waitFor(() => expect(getRowContextQuery).toHaveBeenCalledTimes(3)); + }); + it('should show a split view button', async () => { const getRowContextQuery = jest.fn().mockResolvedValue({ datasource: { uid: 'test-uid' } }); @@ -175,7 +205,7 @@ describe('LogRowContextModal', () => { /> ); - await waitFor(() => expect(getRowContextQuery).toHaveBeenCalledTimes(1)); + await waitFor(() => expect(getRowContextQuery).toHaveBeenCalledTimes(2)); }); it('should close modal', async () => { diff --git a/public/app/features/logs/components/log-context/LogRowContextModal.tsx b/public/app/features/logs/components/log-context/LogRowContextModal.tsx index 5de66b363f6..78da6fd3f11 100644 --- a/public/app/features/logs/components/log-context/LogRowContextModal.tsx +++ b/public/app/features/logs/components/log-context/LogRowContextModal.tsx @@ -190,8 +190,14 @@ export const LogRowContextModal: React.FunctionComponent { + const contextQuery = getRowContextQuery ? await getRowContextQuery(row) : null; + setContextQuery(contextQuery); + }; + const [{ loading }, fetchResults] = useAsyncFn(async () => { if (open && row && limit) { + await updateContextQuery(); const rawResults = await Promise.all([ getRowContext(row, { limit: logsSortOrder === LogsSortOrder.Descending ? limit + 1 : limit, @@ -268,10 +274,7 @@ export const LogRowContextModal: React.FunctionComponent { - const contextQuery = getRowContextQuery ? await getRowContextQuery(row) : null; - setContextQuery(contextQuery); - }, [getRowContextQuery, row]); + useAsync(updateContextQuery, [getRowContextQuery, row]); return (