From 88a6ca0b8fb616b20cdfa87bc6c4ae4b871673a6 Mon Sep 17 00:00:00 2001 From: "Eyo O. Eyo" <7893459+eokoneyo@users.noreply.github.com> Date: Fri, 22 Nov 2024 11:45:06 +0100 Subject: [PATCH] [React18] Migrate test suites to account for testing library upgrades kibana-data-discovery (#201144) This PR migrates test suites that use `renderHook` from the library `@testing-library/react-hooks` to adopt the equivalent and replacement of `renderHook` from the export that is now available from `@testing-library/react`. This work is required for the planned migration to react18. ## Context In this PR, usages of `waitForNextUpdate` that previously could have been destructured from `renderHook` are now been replaced with `waitFor` exported from `@testing-library/react`, furthermore `waitFor` that would also have been destructured from the same renderHook result is now been replaced with `waitFor` from the export of `@testing-library/react`. ***Why is `waitFor` a sufficient enough replacement for `waitForNextUpdate`, and better for testing values subject to async computations?*** WaitFor will retry the provided callback if an error is returned, till the configured timeout elapses. By default the retry interval is `50ms` with a timeout value of `1000ms` that effectively translates to at least 20 retries for assertions placed within waitFor. See https://testing-library.com/docs/dom-testing-library/api-async/#waitfor for more information. This however means that for person's writing tests, said person has to be explicit about expectations that describe the internal state of the hook being tested. This implies checking for instance when a react query hook is being rendered, there's an assertion that said hook isn't loading anymore. In this PR you'd notice that this pattern has been adopted, with most existing assertions following an invocation of `waitForNextUpdate` being placed within a `waitFor` invocation. In some cases the replacement is simply a `waitFor(() => new Promise((resolve) => resolve(null)))` (many thanks to @kapral18, for point out exactly why this works), where this suffices the assertions that follow aren't placed within a waitFor so this PR doesn't get larger than it needs to be. It's also worth pointing out this PR might also contain changes to test and application code to improve said existing test. ### What to do next? 1. Review the changes in this PR. 2. If you think the changes are correct, approve the PR. ## Any questions? If you have any questions or need help with this PR, please leave comments in this PR. --------- Co-authored-by: Davis McPhee --- .../src/hooks/use_pager.test.tsx | 2 +- .../get_sidebar_visibility.test.tsx | 2 +- .../src/hooks/use_existing_fields.test.tsx | 81 +++++++++---------- .../src/hooks/use_field_filters.test.tsx | 3 +- .../src/hooks/use_grouped_fields.test.tsx | 68 ++++++++-------- .../src/hooks/use_new_fields.test.tsx | 2 +- .../hooks/use_context_app_fetch.test.tsx | 4 +- .../layout/use_discover_histogram.test.tsx | 6 +- .../layout/use_fetch_more_records.test.tsx | 10 +-- .../top_nav/use_top_nav_links.test.tsx | 2 +- .../main/hooks/use_esql_mode.test.tsx | 9 ++- .../main/hooks/use_inspector.test.ts | 2 +- .../application/main/hooks/use_url.test.ts | 2 +- .../discover_state_provider.tsx | 5 +- .../use_additional_cell_actions.test.tsx | 7 +- .../hooks/use_profile_accessor.test.ts | 2 +- .../hooks/use_profiles.test.tsx | 2 +- .../hooks/use_root_profile.test.tsx | 31 +++---- .../customization_provider.test.tsx | 2 +- .../get_search_embeddable_factory.test.tsx | 8 +- .../saved_search_alias_match_redirect.test.ts | 2 +- .../public/hooks/use_data_view.test.tsx | 6 +- .../hooks/use_navigation_props.test.tsx | 4 +- .../doc_viewer_table/test_filters.test.ts | 2 +- .../public/hooks/use_es_doc_search.test.tsx | 13 +-- .../chart/hooks/use_chart_actions.test.ts | 3 +- .../hooks/use_edit_visualization.test.ts | 22 ++--- .../public/chart/hooks/use_lens_props.test.ts | 3 +- .../public/chart/hooks/use_refetch.test.ts | 2 +- .../chart/hooks/use_time_range.test.tsx | 2 +- .../public/chart/hooks/use_total_hits.test.ts | 3 +- .../container/hooks/use_state_props.test.ts | 20 ++++- .../public/hooks/use_request_params.test.ts | 2 +- .../public/hooks/use_stable_callback.test.ts | 2 +- 34 files changed, 170 insertions(+), 166 deletions(-) diff --git a/packages/kbn-discover-utils/src/hooks/use_pager.test.tsx b/packages/kbn-discover-utils/src/hooks/use_pager.test.tsx index 9e3b450e89cfa..5eee2b760759a 100644 --- a/packages/kbn-discover-utils/src/hooks/use_pager.test.tsx +++ b/packages/kbn-discover-utils/src/hooks/use_pager.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { usePager } from './use_pager'; describe('usePager', () => { diff --git a/packages/kbn-unified-field-list/src/containers/unified_field_list_sidebar/get_sidebar_visibility.test.tsx b/packages/kbn-unified-field-list/src/containers/unified_field_list_sidebar/get_sidebar_visibility.test.tsx index 85f223e4b1cfb..01c3bb2677e3c 100644 --- a/packages/kbn-unified-field-list/src/containers/unified_field_list_sidebar/get_sidebar_visibility.test.tsx +++ b/packages/kbn-unified-field-list/src/containers/unified_field_list_sidebar/get_sidebar_visibility.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { act } from '@testing-library/react-hooks'; +import { act } from '@testing-library/react'; import { getSidebarVisibility } from './get_sidebar_visibility'; const localStorageKey = 'test-sidebar-visibility'; diff --git a/packages/kbn-unified-field-list/src/hooks/use_existing_fields.test.tsx b/packages/kbn-unified-field-list/src/hooks/use_existing_fields.test.tsx index 06b043014c2fd..c3b77ad72f5ac 100644 --- a/packages/kbn-unified-field-list/src/hooks/use_existing_fields.test.tsx +++ b/packages/kbn-unified-field-list/src/hooks/use_existing_fields.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { waitFor, renderHook } from '@testing-library/react'; import { stubLogstashDataView as dataView } from '@kbn/data-views-plugin/common/data_view.stub'; import { createStubDataView, stubFieldSpecMap } from '@kbn/data-plugin/public/stubs'; import { dataViewPluginMocks } from '@kbn/data-views-plugin/public/mocks'; @@ -94,7 +94,7 @@ describe('UnifiedFieldList useExistingFields', () => { }; }); - const hookFetcher = renderHook(useExistingFieldsFetcher, { + renderHook(useExistingFieldsFetcher, { initialProps: { dataViews: [dataView], services: mockedServices, @@ -107,7 +107,7 @@ describe('UnifiedFieldList useExistingFields', () => { const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalledWith( expect.objectContaining({ @@ -167,7 +167,7 @@ describe('UnifiedFieldList useExistingFields', () => { const hookReader1 = renderHook(useExistingFieldsReader); const hookReader2 = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalled(); @@ -199,7 +199,7 @@ describe('UnifiedFieldList useExistingFields', () => { throw new Error('test'); }); - const hookFetcher = renderHook(useExistingFieldsFetcher, { + renderHook(useExistingFieldsFetcher, { initialProps: { dataViews: [dataView], services: mockedServices, @@ -212,7 +212,7 @@ describe('UnifiedFieldList useExistingFields', () => { const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalled(); @@ -232,7 +232,7 @@ describe('UnifiedFieldList useExistingFields', () => { } ); - const hookFetcher = renderHook(useExistingFieldsFetcher, { + renderHook(useExistingFieldsFetcher, { initialProps: { dataViews: [dataView, anotherDataView, dataViewWithRestrictions], services: mockedServices, @@ -244,7 +244,7 @@ describe('UnifiedFieldList useExistingFields', () => { }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const currentResult = hookReader.result.current; @@ -310,8 +310,7 @@ describe('UnifiedFieldList useExistingFields', () => { }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); - await hookFetcher.waitFor(() => !hookFetcher.result.current.isProcessing); + await waitFor(() => () => !hookFetcher.result.current.isProcessing); expect(dataViewWithRestrictions.getAggregationRestrictions).toHaveBeenCalled(); expect(ExistingFieldsServiceApi.loadFieldExisting).not.toHaveBeenCalled(); @@ -346,7 +345,7 @@ describe('UnifiedFieldList useExistingFields', () => { }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalledWith( expect.objectContaining({ @@ -370,7 +369,7 @@ describe('UnifiedFieldList useExistingFields', () => { dataViews: [dataView, anotherDataView], }); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenNthCalledWith( 2, @@ -424,7 +423,7 @@ describe('UnifiedFieldList useExistingFields', () => { }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalledWith( expect.objectContaining({ @@ -447,32 +446,32 @@ describe('UnifiedFieldList useExistingFields', () => { query: { query: 'test', language: 'kuery' }, }); - await hookFetcher.waitForNextUpdate(); - - expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenNthCalledWith( - 2, - expect.objectContaining({ - fromDate: '2021-01-01', - toDate: '2022-01-01', - dslQuery: { - bool: { - filter: [ - { - multi_match: { - lenient: true, - query: 'test', - type: 'best_fields', + await waitFor(() => + expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenNthCalledWith( + 2, + expect.objectContaining({ + fromDate: '2021-01-01', + toDate: '2022-01-01', + dslQuery: { + bool: { + filter: [ + { + multi_match: { + lenient: true, + query: 'test', + type: 'best_fields', + }, }, - }, - ], - must: [], - must_not: [], - should: [], + ], + must: [], + must_not: [], + should: [], + }, }, - }, - dataView, - timeFieldName: dataView.timeFieldName, - }) + dataView, + timeFieldName: dataView.timeFieldName, + }) + ) ); }); @@ -497,7 +496,7 @@ describe('UnifiedFieldList useExistingFields', () => { }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalledWith( expect.objectContaining({ @@ -522,7 +521,7 @@ describe('UnifiedFieldList useExistingFields', () => { toDate: '2022-01-01', }); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenNthCalledWith( 2, @@ -558,12 +557,12 @@ describe('UnifiedFieldList useExistingFields', () => { query: { query: '', language: 'lucene' }, filters: [], }; - const hookFetcher = renderHook(useExistingFieldsFetcher, { + renderHook(useExistingFieldsFetcher, { initialProps: params, }); const hookReader = renderHook(useExistingFieldsReader); - await hookFetcher.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); expect(ExistingFieldsServiceApi.loadFieldExisting).toHaveBeenCalledWith( expect.objectContaining({ diff --git a/packages/kbn-unified-field-list/src/hooks/use_field_filters.test.tsx b/packages/kbn-unified-field-list/src/hooks/use_field_filters.test.tsx index d0adb4125ab3d..60f84e9cdf2c1 100644 --- a/packages/kbn-unified-field-list/src/hooks/use_field_filters.test.tsx +++ b/packages/kbn-unified-field-list/src/hooks/use_field_filters.test.tsx @@ -7,8 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; -import { act } from 'react-test-renderer'; +import { act, renderHook } from '@testing-library/react'; import { stubLogstashDataView as dataView } from '@kbn/data-views-plugin/common/data_view.stub'; import type { DataViewField } from '@kbn/data-views-plugin/common'; import { coreMock } from '@kbn/core/public/mocks'; diff --git a/packages/kbn-unified-field-list/src/hooks/use_grouped_fields.test.tsx b/packages/kbn-unified-field-list/src/hooks/use_grouped_fields.test.tsx index a0a8e055e6d62..946396c83f2d3 100644 --- a/packages/kbn-unified-field-list/src/hooks/use_grouped_fields.test.tsx +++ b/packages/kbn-unified-field-list/src/hooks/use_grouped_fields.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook, act } from '@testing-library/react-hooks'; +import { waitFor, renderHook, act } from '@testing-library/react'; import { stubDataViewWithoutTimeField, stubLogstashDataView as dataView, @@ -56,11 +56,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { allFields: null, services: mockedServices, }; - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldListGroupedProps = result.current.fieldListGroupedProps; expect(fieldListGroupedProps.fieldGroups).toMatchSnapshot(); @@ -101,11 +101,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { }) ); - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldListGroupedProps = result.current.fieldListGroupedProps; const fieldGroups = fieldListGroupedProps.fieldGroups; @@ -163,11 +163,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { }) ); - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldListGroupedProps = result.current.fieldListGroupedProps; const fieldGroups = fieldListGroupedProps.fieldGroups; @@ -235,11 +235,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { }) ); - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldListGroupedProps = result.current.fieldListGroupedProps; const fieldGroups = fieldListGroupedProps.fieldGroups; @@ -292,11 +292,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { allFields: allFieldsIncludingUnmapped, services: mockedServices, }; - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -373,11 +373,11 @@ describe('UnifiedFieldList useGroupedFields()', () => { allFields, services: mockedServices, }; - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const scrollToTopResetCounter1 = result.current.fieldListGroupedProps.scrollToTopResetCounter; @@ -392,7 +392,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }); it('should work correctly when custom unsupported fields are skipped', async () => { - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -401,7 +401,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -422,7 +422,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }); it('should work correctly when selected fields are present', async () => { - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -432,7 +432,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -531,7 +531,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }; } }); - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -540,7 +540,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -572,10 +572,10 @@ describe('UnifiedFieldList useGroupedFields()', () => { }) ); - const { result, waitForNextUpdate, rerender } = renderHook(useGroupedFields, { + const { result, rerender } = renderHook(useGroupedFields, { initialProps: props, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); let fieldListGroupedProps = result.current.fieldListGroupedProps; fieldGroups = fieldListGroupedProps.fieldGroups; @@ -604,7 +604,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { allFields: anotherDataView.fields, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); fieldListGroupedProps = result.current.fieldListGroupedProps; fieldGroups = fieldListGroupedProps.fieldGroups; @@ -633,7 +633,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { // `bytes` is popular, but we are skipping it here to test that it would not be shown under Popular and Available const onSupportedFieldFilter = jest.fn((field) => field.name !== 'bytes'); - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -643,7 +643,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -668,7 +668,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }); it('should work correctly when global filters are set', async () => { - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields: [], @@ -677,14 +677,14 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; expect(fieldGroups).toMatchSnapshot(); }); it('should work correctly and show unmapped fields separately', async () => { - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields: allFieldsIncludingUnmapped, @@ -692,7 +692,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -718,7 +718,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { allFields[2], allFields[0], ]; - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -727,7 +727,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldGroups = result.current.fieldListGroupedProps.fieldGroups; @@ -750,7 +750,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }); it('should include filters props', async () => { - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -758,7 +758,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const { fieldListFiltersProps, fieldListGroupedProps } = result.current; const fieldGroups = fieldListGroupedProps.fieldGroups; @@ -806,7 +806,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { const additionalFieldGroups = { smartFields, }; - const { result, waitForNextUpdate } = renderHook(useGroupedFields, { + const { result } = renderHook(useGroupedFields, { initialProps: { dataViewId: dataView.id!, allFields, @@ -815,7 +815,7 @@ describe('UnifiedFieldList useGroupedFields()', () => { }, }); - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); const fieldListGroupedProps = result.current.fieldListGroupedProps; const fieldGroups = fieldListGroupedProps.fieldGroups; expect(fieldGroups.SmartFields?.fields?.length).toBe(1); diff --git a/packages/kbn-unified-field-list/src/hooks/use_new_fields.test.tsx b/packages/kbn-unified-field-list/src/hooks/use_new_fields.test.tsx index b091ed015e312..4f34f5d16dc51 100644 --- a/packages/kbn-unified-field-list/src/hooks/use_new_fields.test.tsx +++ b/packages/kbn-unified-field-list/src/hooks/use_new_fields.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { stubLogstashDataView as dataView } from '@kbn/data-views-plugin/common/data_view.stub'; import { DataViewField } from '@kbn/data-views-plugin/common'; import { useNewFields, type UseNewFieldsParams } from './use_new_fields'; diff --git a/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx b/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx index acfaaf7daba3e..edffaa1c32530 100644 --- a/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx +++ b/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx @@ -8,7 +8,7 @@ */ import React from 'react'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { createFilterManagerMock } from '@kbn/data-plugin/public/query/filter_manager/filter_manager.mock'; import { CONTEXT_TIE_BREAKER_FIELDS_SETTING } from '@kbn/discover-utils'; import { DiscoverServices } from '../../../build_services'; @@ -106,7 +106,7 @@ const initDefaults = (tieBreakerFields: string[], dataViewId = 'the-data-view-id return { result: renderHook(() => useContextAppFetch(props.props), { - wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + wrapper: ({ children }: React.PropsWithChildren) => ( {children} ), }).result, diff --git a/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx b/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx index e14b5afc30d04..287b5a60386f4 100644 --- a/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx +++ b/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx @@ -9,7 +9,7 @@ import React, { ReactElement } from 'react'; import { AggregateQuery, Query } from '@kbn/es-query'; -import { act, renderHook, WrapperComponent } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { BehaviorSubject, Subject } from 'rxjs'; import { FetchStatus } from '../../../types'; import type { DiscoverStateContainer } from '../../state_management/discover_state'; @@ -121,9 +121,7 @@ describe('useDiscoverHistogram', () => { hideChart, }; - const Wrapper: WrapperComponent> = ({ - children, - }) => ( + const Wrapper = ({ children }: React.PropsWithChildren) => ( {children as ReactElement} ); diff --git a/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx b/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx index 4bab0f75e87e6..eeb0cd8ccb1b4 100644 --- a/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx +++ b/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx @@ -8,10 +8,10 @@ */ import { BehaviorSubject } from 'rxjs'; -import { renderHook, WrapperComponent } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { buildDataTableRecord } from '@kbn/discover-utils'; import { dataViewMock, esHitsMockWithSort } from '@kbn/discover-utils/src/__mocks__'; -import { useFetchMoreRecords, UseFetchMoreRecordsParams } from './use_fetch_more_records'; +import { useFetchMoreRecords } from './use_fetch_more_records'; import { getDiscoverStateMock } from '../../../../__mocks__/discover_state.mock'; import { DataDocuments$, @@ -47,10 +47,8 @@ describe('useFetchMoreRecords', () => { return stateContainer; }; - const getWrapper = ( - stateContainer: DiscoverStateContainer - ): WrapperComponent> => { - return ({ children }) => ( + const getWrapper = (stateContainer: DiscoverStateContainer) => { + return ({ children }: React.PropsWithChildren) => ( <>{children} diff --git a/src/plugins/discover/public/application/main/components/top_nav/use_top_nav_links.test.tsx b/src/plugins/discover/public/application/main/components/top_nav/use_top_nav_links.test.tsx index 2c51d57a32615..a70b200a74346 100644 --- a/src/plugins/discover/public/application/main/components/top_nav/use_top_nav_links.test.tsx +++ b/src/plugins/discover/public/application/main/components/top_nav/use_top_nav_links.test.tsx @@ -9,7 +9,7 @@ import React from 'react'; import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { dataViewMock } from '@kbn/discover-utils/src/__mocks__'; import { useTopNavLinks } from './use_top_nav_links'; import { DiscoverServices } from '../../../../build_services'; diff --git a/src/plugins/discover/public/application/main/hooks/use_esql_mode.test.tsx b/src/plugins/discover/public/application/main/hooks/use_esql_mode.test.tsx index 9f3fe7004f5f6..486c477c8833e 100644 --- a/src/plugins/discover/public/application/main/hooks/use_esql_mode.test.tsx +++ b/src/plugins/discover/public/application/main/hooks/use_esql_mode.test.tsx @@ -8,8 +8,7 @@ */ import React from 'react'; -import { renderHook } from '@testing-library/react-hooks'; -import { waitFor } from '@testing-library/react'; +import { waitFor, renderHook } from '@testing-library/react'; import { DataViewsContract } from '@kbn/data-plugin/public'; import { discoverServiceMock } from '../../../__mocks__/services'; import { useEsqlMode } from './use_esql_mode'; @@ -76,8 +75,10 @@ const getDataViewsService = () => { }; const getHookContext = (stateContainer: DiscoverStateContainer) => { - return ({ children }: { children: JSX.Element }) => ( - {children} + return ({ children }: React.PropsWithChildren) => ( + + <>{children} + ); }; const renderHookWithContext = ( diff --git a/src/plugins/discover/public/application/main/hooks/use_inspector.test.ts b/src/plugins/discover/public/application/main/hooks/use_inspector.test.ts index 53d66419cabac..ccade68ff2c8d 100644 --- a/src/plugins/discover/public/application/main/hooks/use_inspector.test.ts +++ b/src/plugins/discover/public/application/main/hooks/use_inspector.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { discoverServiceMock } from '../../../__mocks__/services'; import { useInspector } from './use_inspector'; import { Adapters, RequestAdapter } from '@kbn/inspector-plugin/common'; diff --git a/src/plugins/discover/public/application/main/hooks/use_url.test.ts b/src/plugins/discover/public/application/main/hooks/use_url.test.ts index 427765eac1325..24c6fe6af303d 100644 --- a/src/plugins/discover/public/application/main/hooks/use_url.test.ts +++ b/src/plugins/discover/public/application/main/hooks/use_url.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { createSearchSessionMock } from '../../../__mocks__/search_session'; import { useUrl } from './use_url'; import { diff --git a/src/plugins/discover/public/application/main/state_management/discover_state_provider.tsx b/src/plugins/discover/public/application/main/state_management/discover_state_provider.tsx index d5bbbd0b7c39b..2266a7d5276f7 100644 --- a/src/plugins/discover/public/application/main/state_management/discover_state_provider.tsx +++ b/src/plugins/discover/public/application/main/state_management/discover_state_provider.tsx @@ -57,10 +57,9 @@ export const { export const DiscoverMainProvider = ({ value, children, -}: { +}: React.PropsWithChildren<{ value: DiscoverStateContainer; - children: React.ReactElement; -}) => { +}>) => { return ( diff --git a/src/plugins/discover/public/context_awareness/hooks/use_additional_cell_actions.test.tsx b/src/plugins/discover/public/context_awareness/hooks/use_additional_cell_actions.test.tsx index 88dffdfa1ce6a..df96e4ee57a37 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_additional_cell_actions.test.tsx +++ b/src/plugins/discover/public/context_awareness/hooks/use_additional_cell_actions.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { DISCOVER_CELL_ACTION_TYPE, createCellAction, @@ -76,7 +76,7 @@ describe('useAdditionalCellActions', () => { }; const render = () => { - return renderHook((props) => useAdditionalCellActions(props), { + return renderHook(useAdditionalCellActions, { initialProps, wrapper: ({ children }) => ( {children} @@ -90,6 +90,7 @@ describe('useAdditionalCellActions', () => { afterEach(() => { mockUuid = 0; + jest.clearAllMocks(); }); it('should return metadata', async () => { @@ -108,7 +109,7 @@ describe('useAdditionalCellActions', () => { expect(mockActions).toHaveLength(1); expect(mockTriggerActions[DISCOVER_CELL_ACTIONS_TRIGGER.id]).toEqual(['root-action-2']); await act(() => discoverServiceMock.profilesManager.resolveDataSourceProfile({})); - rerender(); + rerender(initialProps); expect(result.current.instanceId).toEqual('3'); expect(mockActions).toHaveLength(2); expect(mockTriggerActions[DISCOVER_CELL_ACTIONS_TRIGGER.id]).toEqual([ diff --git a/src/plugins/discover/public/context_awareness/hooks/use_profile_accessor.test.ts b/src/plugins/discover/public/context_awareness/hooks/use_profile_accessor.test.ts index 65f6f7fb3f30a..b079115d69288 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_profile_accessor.test.ts +++ b/src/plugins/discover/public/context_awareness/hooks/use_profile_accessor.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { AppliedProfile, getMergedAccessor } from '../composable_profile'; import { useProfileAccessor } from './use_profile_accessor'; import { getDataTableRecords } from '../../__fixtures__/real_hits'; diff --git a/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx b/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx index b42fc1c4b3c49..ad142371aebb5 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx +++ b/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx @@ -8,7 +8,7 @@ */ import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import React from 'react'; import { discoverServiceMock } from '../../__mocks__/services'; import type { GetProfilesOptions } from '../profiles_manager'; diff --git a/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx b/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx index 26c3aa2df3f15..d6984eb94cb42 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx +++ b/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx @@ -8,7 +8,7 @@ */ import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; -import { act, renderHook } from '@testing-library/react-hooks'; +import { waitFor, act, renderHook } from '@testing-library/react'; import React from 'react'; import { discoverServiceMock } from '../../__mocks__/services'; import { useRootProfile } from './use_root_profile'; @@ -37,31 +37,34 @@ describe('useRootProfile', () => { }); it('should return rootProfileLoading as true', async () => { - const { result, waitForNextUpdate } = render(); + const { result } = render(); expect(result.current.rootProfileLoading).toBe(true); expect((result.current as Record).AppWrapper).toBeUndefined(); // avoid act warning - await waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); }); it('should return rootProfileLoading as false', async () => { - const { result, waitForNextUpdate } = render(); - await waitForNextUpdate(); - expect(result.current.rootProfileLoading).toBe(false); - expect((result.current as Record).AppWrapper).toBeDefined(); + const { result } = render(); + await waitFor(() => { + expect(result.current.rootProfileLoading).toBe(false); + expect((result.current as Record).AppWrapper).toBeDefined(); + }); }); it('should return rootProfileLoading as true when solutionNavId changes', async () => { - const { result, rerender, waitForNextUpdate } = render(); - await waitForNextUpdate(); - expect(result.current.rootProfileLoading).toBe(false); - expect((result.current as Record).AppWrapper).toBeDefined(); + const { result, rerender } = render(); + await waitFor(() => { + expect(result.current.rootProfileLoading).toBe(false); + expect((result.current as Record).AppWrapper).toBeDefined(); + }); act(() => mockSolutionNavId$.next('newSolutionNavId')); rerender(); expect(result.current.rootProfileLoading).toBe(true); expect((result.current as Record).AppWrapper).toBeUndefined(); - await waitForNextUpdate(); - expect(result.current.rootProfileLoading).toBe(false); - expect((result.current as Record).AppWrapper).toBeDefined(); + await waitFor(() => { + expect(result.current.rootProfileLoading).toBe(false); + expect((result.current as Record).AppWrapper).toBeDefined(); + }); }); }); diff --git a/src/plugins/discover/public/customizations/customization_provider.test.tsx b/src/plugins/discover/public/customizations/customization_provider.test.tsx index 7dbdc9e3c3475..4b871c4ae8b7b 100644 --- a/src/plugins/discover/public/customizations/customization_provider.test.tsx +++ b/src/plugins/discover/public/customizations/customization_provider.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { act, renderHook } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import React from 'react'; import { getDiscoverStateMock } from '../__mocks__/discover_state.mock'; import { diff --git a/src/plugins/discover/public/embeddable/get_search_embeddable_factory.test.tsx b/src/plugins/discover/public/embeddable/get_search_embeddable_factory.test.tsx index b1c589f3e1d84..621703ad3991b 100644 --- a/src/plugins/discover/public/embeddable/get_search_embeddable_factory.test.tsx +++ b/src/plugins/discover/public/embeddable/get_search_embeddable_factory.test.tsx @@ -18,7 +18,7 @@ import { BuildReactEmbeddableApiRegistration } from '@kbn/embeddable-plugin/publ import { PresentationContainer } from '@kbn/presentation-containers'; import { PhaseEvent, PublishesUnifiedSearch, StateComparators } from '@kbn/presentation-publishing'; import { VIEW_MODE } from '@kbn/saved-search-plugin/common'; -import { act, render } from '@testing-library/react'; +import { act, render, waitFor } from '@testing-library/react'; import { AggregateQuery, Filter, Query, TimeRange } from '@kbn/es-query'; import { createDataViewDataSource } from '../../common/data_sources'; @@ -143,8 +143,10 @@ describe('saved search embeddable', () => { expect(api.dataLoading.getValue()).toBe(false); expect(discoverComponent.queryByTestId('embeddedSavedSearchDocTable')).toBeInTheDocument(); - expect(discoverComponent.getByTestId('embeddedSavedSearchDocTable').textContent).toEqual( - 'No results found' + await waitFor(() => + expect(discoverComponent.getByTestId('embeddedSavedSearchDocTable').textContent).toEqual( + 'No results found' + ) ); }); diff --git a/src/plugins/discover/public/hooks/saved_search_alias_match_redirect.test.ts b/src/plugins/discover/public/hooks/saved_search_alias_match_redirect.test.ts index c1c6c4ac0e963..4e4469188d0b8 100644 --- a/src/plugins/discover/public/hooks/saved_search_alias_match_redirect.test.ts +++ b/src/plugins/discover/public/hooks/saved_search_alias_match_redirect.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import type { History } from 'history'; import { useSavedSearchAliasMatchRedirect } from './saved_search_alias_match_redirect'; diff --git a/src/plugins/discover/public/hooks/use_data_view.test.tsx b/src/plugins/discover/public/hooks/use_data_view.test.tsx index 5ef2194ab8db1..9e8a1c8a1fd44 100644 --- a/src/plugins/discover/public/hooks/use_data_view.test.tsx +++ b/src/plugins/discover/public/hooks/use_data_view.test.tsx @@ -9,7 +9,7 @@ import React from 'react'; import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; -import { renderHook } from '@testing-library/react-hooks'; +import { waitFor, renderHook } from '@testing-library/react'; import { useDataView } from './use_data_view'; const adhocDataView = { @@ -38,11 +38,11 @@ const mockServices = { const render = async ({ dataViewId }: { dataViewId: string }) => { const hookResult = renderHook(() => useDataView({ index: dataViewId }), { - wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + wrapper: ({ children }: React.PropsWithChildren) => ( {children} ), }); - await hookResult.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); return hookResult; }; diff --git a/src/plugins/discover/public/hooks/use_navigation_props.test.tsx b/src/plugins/discover/public/hooks/use_navigation_props.test.tsx index 36c86e01a9bb9..16b02b44d4340 100644 --- a/src/plugins/discover/public/hooks/use_navigation_props.test.tsx +++ b/src/plugins/discover/public/hooks/use_navigation_props.test.tsx @@ -8,7 +8,7 @@ */ import React, { MouseEvent } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; +import { waitFor, renderHook } from '@testing-library/react'; import { useNavigationProps } from './use_navigation_props'; import type { DataView } from '@kbn/data-views-plugin/public'; import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; @@ -65,7 +65,7 @@ const render = async () => { ), } ); - await renderResult.waitForNextUpdate(); + await waitFor(() => new Promise((resolve) => resolve(null))); return renderResult; }; diff --git a/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/test_filters.test.ts b/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/test_filters.test.ts index 6d0a8c5dfc96c..7bcfb2d7aa071 100644 --- a/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/test_filters.test.ts +++ b/src/plugins/unified_doc_viewer/public/components/doc_viewer_table/test_filters.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook, act } from '@testing-library/react-hooks'; +import { renderHook, act } from '@testing-library/react'; import { Storage } from '@kbn/kibana-utils-plugin/public'; import { useTableFilters, diff --git a/src/plugins/unified_doc_viewer/public/hooks/use_es_doc_search.test.tsx b/src/plugins/unified_doc_viewer/public/hooks/use_es_doc_search.test.tsx index f86cd00f14ce1..dac1f46e4b424 100644 --- a/src/plugins/unified_doc_viewer/public/hooks/use_es_doc_search.test.tsx +++ b/src/plugins/unified_doc_viewer/public/hooks/use_es_doc_search.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook, act } from '@testing-library/react-hooks'; +import { waitFor, renderHook, act } from '@testing-library/react'; import { type EsDocSearchProps, buildSearchBody, useEsDocSearch } from './use_es_doc_search'; import { Subject } from 'rxjs'; import type { DataView } from '@kbn/data-views-plugin/public'; @@ -281,13 +281,14 @@ describe('Test of helper / hook', () => { }, }); mockSearchResult.complete(); - await hook.waitForNextUpdate(); }); - expect(hook.result.current.slice(0, 2)).toEqual([ - ElasticRequestState.Found, - buildDataTableRecord(record), - ]); + await waitFor(() => + expect(hook.result.current.slice(0, 2)).toEqual([ + ElasticRequestState.Found, + buildDataTableRecord(record), + ]) + ); }); test('useEsDocSearch for text based languages', async () => { diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_chart_actions.test.ts b/src/plugins/unified_histogram/public/chart/hooks/use_chart_actions.test.ts index ab8acc7b694fe..94c7c88005f71 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_chart_actions.test.ts +++ b/src/plugins/unified_histogram/public/chart/hooks/use_chart_actions.test.ts @@ -7,8 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; -import { act } from 'react-test-renderer'; +import { act, renderHook } from '@testing-library/react'; import { UnifiedHistogramChartContext } from '../../types'; import { useChartActions } from './use_chart_actions'; diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_edit_visualization.test.ts b/src/plugins/unified_histogram/public/chart/hooks/use_edit_visualization.test.ts index e64b41e40e547..626950e535616 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_edit_visualization.test.ts +++ b/src/plugins/unified_histogram/public/chart/hooks/use_edit_visualization.test.ts @@ -9,9 +9,7 @@ import type { DataView } from '@kbn/data-views-plugin/common'; import type { TypedLensByValueInput } from '@kbn/lens-plugin/public'; -import { renderHook } from '@testing-library/react-hooks'; -import { act } from 'react-test-renderer'; -import { setTimeout } from 'timers/promises'; +import { waitFor, renderHook } from '@testing-library/react'; import { dataViewMock } from '../../__mocks__/data_view'; import { dataViewWithTimefieldMock } from '../../__mocks__/data_view_with_timefield'; import { unifiedHistogramServicesMock } from '../../__mocks__/services'; @@ -44,8 +42,7 @@ describe('useEditVisualization', () => { lensAttributes, }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeDefined(); + await waitFor(() => expect(hook.result.current).toBeDefined()); hook.result.current!(); expect(navigateToPrefilledEditor).toHaveBeenCalledWith({ id: '', @@ -64,8 +61,7 @@ describe('useEditVisualization', () => { lensAttributes: {} as unknown as TypedLensByValueInput['attributes'], }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeUndefined(); + await waitFor(() => expect(hook.result.current).toBeUndefined()); }); it('should return undefined if the data view is not time based', async () => { @@ -78,8 +74,7 @@ describe('useEditVisualization', () => { lensAttributes: {} as unknown as TypedLensByValueInput['attributes'], }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeUndefined(); + await waitFor(() => expect(hook.result.current).toBeUndefined()); }); it('should return undefined if is on text based mode', async () => { @@ -93,8 +88,7 @@ describe('useEditVisualization', () => { isPlainRecord: true, }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeUndefined(); + await waitFor(() => expect(hook.result.current).toBeUndefined()); }); it('should return undefined if the time field is not visualizable', async () => { @@ -113,8 +107,7 @@ describe('useEditVisualization', () => { lensAttributes: {} as unknown as TypedLensByValueInput['attributes'], }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeUndefined(); + await waitFor(() => expect(hook.result.current).toBeUndefined()); }); it('should return undefined if there are no compatible actions', async () => { @@ -127,7 +120,6 @@ describe('useEditVisualization', () => { lensAttributes: {} as unknown as TypedLensByValueInput['attributes'], }) ); - await act(() => setTimeout(0)); - expect(hook.result.current).toBeUndefined(); + await waitFor(() => expect(hook.result.current).toBeUndefined()); }); }); diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_lens_props.test.ts b/src/plugins/unified_histogram/public/chart/hooks/use_lens_props.test.ts index 9d1522398b018..d66856bdb4f0d 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_lens_props.test.ts +++ b/src/plugins/unified_histogram/public/chart/hooks/use_lens_props.test.ts @@ -7,8 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; -import { act } from 'react-test-renderer'; +import { act, renderHook } from '@testing-library/react'; import { Subject } from 'rxjs'; import type { UnifiedHistogramInputMessage } from '../../types'; import { dataViewWithTimefieldMock } from '../../__mocks__/data_view_with_timefield'; diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_refetch.test.ts b/src/plugins/unified_histogram/public/chart/hooks/use_refetch.test.ts index 3695e08337610..cf8590009062b 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_refetch.test.ts +++ b/src/plugins/unified_histogram/public/chart/hooks/use_refetch.test.ts @@ -10,7 +10,7 @@ import { useRefetch } from './use_refetch'; import { DataView } from '@kbn/data-views-plugin/common'; import { AggregateQuery, Filter, Query, TimeRange } from '@kbn/es-query'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { UnifiedHistogramBreakdownContext, UnifiedHistogramChartContext, diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_time_range.test.tsx b/src/plugins/unified_histogram/public/chart/hooks/use_time_range.test.tsx index 0daa6ca6be066..7341dbe451c81 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_time_range.test.tsx +++ b/src/plugins/unified_histogram/public/chart/hooks/use_time_range.test.tsx @@ -9,7 +9,7 @@ import { uiSettingsServiceMock } from '@kbn/core-ui-settings-browser-mocks'; import { TimeRange } from '@kbn/data-plugin/common'; -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { UnifiedHistogramBucketInterval } from '../../types'; import { useTimeRange } from './use_time_range'; diff --git a/src/plugins/unified_histogram/public/chart/hooks/use_total_hits.test.ts b/src/plugins/unified_histogram/public/chart/hooks/use_total_hits.test.ts index 1a6146e6a4c31..4ba57d490db6f 100644 --- a/src/plugins/unified_histogram/public/chart/hooks/use_total_hits.test.ts +++ b/src/plugins/unified_histogram/public/chart/hooks/use_total_hits.test.ts @@ -12,11 +12,10 @@ import { UnifiedHistogramFetchStatus, UnifiedHistogramInput$ } from '../../types import { dataViewWithTimefieldMock } from '../../__mocks__/data_view_with_timefield'; import { useTotalHits } from './use_total_hits'; import { useEffect as mockUseEffect } from 'react'; -import { renderHook } from '@testing-library/react-hooks'; import { dataPluginMock } from '@kbn/data-plugin/public/mocks'; import { searchSourceInstanceMock } from '@kbn/data-plugin/common/search/search_source/mocks'; import { of, Subject, throwError } from 'rxjs'; -import { waitFor } from '@testing-library/react'; +import { waitFor, renderHook } from '@testing-library/react'; import { RequestAdapter } from '@kbn/inspector-plugin/common'; import { DataViewType, SearchSourceSearchOptions } from '@kbn/data-plugin/common'; import { expressionsPluginMock } from '@kbn/expressions-plugin/public/mocks'; diff --git a/src/plugins/unified_histogram/public/container/hooks/use_state_props.test.ts b/src/plugins/unified_histogram/public/container/hooks/use_state_props.test.ts index 44a36be34d1ab..5a3356ba9e038 100644 --- a/src/plugins/unified_histogram/public/container/hooks/use_state_props.test.ts +++ b/src/plugins/unified_histogram/public/container/hooks/use_state_props.test.ts @@ -9,8 +9,7 @@ import { DataView, DataViewField, DataViewType } from '@kbn/data-views-plugin/common'; import { RequestAdapter } from '@kbn/inspector-plugin/common'; -import { renderHook } from '@testing-library/react-hooks'; -import { act } from 'react-test-renderer'; +import { waitFor, renderHook, act } from '@testing-library/react'; import type { DatatableColumn } from '@kbn/expressions-plugin/common'; import { convertDatatableColumnToDataViewFieldSpec } from '@kbn/data-view-utils'; import { UnifiedHistogramFetchStatus, UnifiedHistogramSuggestionContext } from '../../types'; @@ -491,7 +490,7 @@ describe('useStateProps', () => { `); }); - it('should execute callbacks correctly', () => { + it('should execute callbacks correctly', async () => { const stateService = getStateService({ initialState }); const { result } = renderHook(() => useStateProps({ @@ -503,6 +502,21 @@ describe('useStateProps', () => { columns: undefined, }) ); + + await waitFor(() => + expect(result.current).toEqual( + expect.objectContaining({ + onTopPanelHeightChange: expect.any(Function), + onTimeIntervalChange: expect.any(Function), + onTotalHitsChange: expect.any(Function), + onChartHiddenChange: expect.any(Function), + onChartLoad: expect.any(Function), + onBreakdownFieldChange: expect.any(Function), + onSuggestionContextChange: expect.any(Function), + }) + ) + ); + const { onTopPanelHeightChange, onTimeIntervalChange, diff --git a/src/plugins/unified_histogram/public/hooks/use_request_params.test.ts b/src/plugins/unified_histogram/public/hooks/use_request_params.test.ts index 33df774f20a33..44624252041f9 100644 --- a/src/plugins/unified_histogram/public/hooks/use_request_params.test.ts +++ b/src/plugins/unified_histogram/public/hooks/use_request_params.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { unifiedHistogramServicesMock } from '../__mocks__/services'; const getUseRequestParams = async () => { diff --git a/src/plugins/unified_histogram/public/hooks/use_stable_callback.test.ts b/src/plugins/unified_histogram/public/hooks/use_stable_callback.test.ts index 7e13f153bc626..db498930c98f8 100644 --- a/src/plugins/unified_histogram/public/hooks/use_stable_callback.test.ts +++ b/src/plugins/unified_histogram/public/hooks/use_stable_callback.test.ts @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { renderHook } from '@testing-library/react-hooks'; +import { renderHook } from '@testing-library/react'; import { useStableCallback } from './use_stable_callback'; describe('useStableCallback', () => {