diff --git a/plugins/search/src/components/SearchContext/SearchContextForStorybook.stories.tsx b/plugins/search/src/components/SearchContext/SearchContextForStorybook.stories.tsx index 4528a6e46d..e969e0d8cc 100644 --- a/plugins/search/src/components/SearchContext/SearchContextForStorybook.stories.tsx +++ b/plugins/search/src/components/SearchContext/SearchContextForStorybook.stories.tsx @@ -25,7 +25,10 @@ type QueryResultProps = { }; /** - * Utility context provider only for use in Storybook stories. + * Utility context provider only for use in Storybook stories. You should use + * the real `` exported by `@backstage/plugin-search` in + * your app instead of this! In some cases (like the search page) it may + * already be provided on your behalf. */ export const SearchContextProvider = ( props: ComponentProps & QueryResultProps, diff --git a/plugins/search/src/components/SearchType/SearchType.Accordion.test.tsx b/plugins/search/src/components/SearchType/SearchType.Accordion.test.tsx index d56b40b879..6b4171a024 100644 --- a/plugins/search/src/components/SearchType/SearchType.Accordion.test.tsx +++ b/plugins/search/src/components/SearchType/SearchType.Accordion.test.tsx @@ -15,13 +15,19 @@ */ import React from 'react'; -import { render } from '@testing-library/react'; +import { ApiProvider } from '@backstage/core-app-api'; +import { TestApiRegistry } from '@backstage/test-utils'; +import { act, render } from '@testing-library/react'; import user from '@testing-library/user-event'; -import { SearchContext } from '../SearchContext'; +import { searchApiRef } from '../../apis'; +import { SearchContext, SearchContextProvider } from '../SearchContext'; import { SearchType } from './SearchType'; describe('SearchType.Accordion', () => { + const query = jest.fn(); + const mockApis = TestApiRegistry.from([searchApiRef, { query }]); + const contextSpy = { result: { loading: false, value: { results: [] } }, term: '', @@ -42,14 +48,20 @@ describe('SearchType.Accordion', () => { }; beforeEach(() => { + query.mockResolvedValue({ results: [] }); + }); + + afterEach(() => { jest.resetAllMocks(); }); - it('should render as expected', () => { + it('should render as expected', async () => { const { getByText } = render( - - - , + + + + + , ); // The given label should be rendered. @@ -63,6 +75,8 @@ describe('SearchType.Accordion', () => { // The given type is also visible expect(getByText(expectedType.name)).toBeInTheDocument(); + + await act(() => Promise.resolve()); }); it('should set entire types array when a type is selected', () => {