diff --git a/src/plugins/content_management/public/components/card_container/card_list.test.tsx b/src/plugins/content_management/public/components/card_container/card_list.test.tsx index fce99b3e6174..262fbeb4a71f 100644 --- a/src/plugins/content_management/public/components/card_container/card_list.test.tsx +++ b/src/plugins/content_management/public/components/card_container/card_list.test.tsx @@ -20,7 +20,7 @@ test('render list of cards', () => { jest .spyOn(embeddableStart, 'EmbeddablePanel') .mockImplementation(() => CardEmbeddablePanel); - render( + const { container, queryAllByText } = render( { } /> ); - expect(screen.queryAllByText('CardEmbeddablePanel')).toHaveLength(2); + expect(queryAllByText('CardEmbeddablePanel')).toHaveLength(2); + // verify container has div with class euiFlexGroup + expect(container.querySelector('.euiFlexGroup')).toBeInTheDocument(); +}); + +test('render list of cards with grid', () => { + const embeddableStart = embeddablePluginMock.createStartContract(); + jest + .spyOn(embeddableStart, 'EmbeddablePanel') + .mockImplementation(() => CardEmbeddablePanel); + const { container } = render( + + ); + // verify container has div with class euiFlexGrid + expect(container.querySelector('.euiFlexGrid')).toBeInTheDocument(); }); diff --git a/src/plugins/content_management/public/constants.ts b/src/plugins/content_management/public/constants.ts index 057eef4d08a7..e1d4ab07ecbc 100644 --- a/src/plugins/content_management/public/constants.ts +++ b/src/plugins/content_management/public/constants.ts @@ -20,7 +20,6 @@ export const SEARCH_OVERVIEW_PAGE_ID = `${SEARCH_USE_CASE_ID}_overview`; export const OBSERVABILITY_OVERVIEW_PAGE_ID = `${OBSERVABILITY_USE_CASE_ID}_overview`; export const SECURITY_ANALYTICS_OVERVIEW_PAGE_ID = `${SECURITY_ANALYTICS_USE_CASE_ID}_overview`; export const HOME_PAGE_ID = 'osd_homepage'; -export const SEARCH_OVERVIEW_ID = 'search_overview'; // section ids export enum SECTIONS { diff --git a/src/plugins/home/public/application/components/sample_data/sample_data_card.test.tsx b/src/plugins/home/public/application/components/sample_data/sample_data_card.test.tsx index 44d7a4b6f007..1879f5c60898 100644 --- a/src/plugins/home/public/application/components/sample_data/sample_data_card.test.tsx +++ b/src/plugins/home/public/application/components/sample_data/sample_data_card.test.tsx @@ -19,7 +19,7 @@ describe('Sample data card', () => { it('should call the getTargetArea function with the correct arguments', () => { registerSampleDataCard(contentManagement, coreStart); const call = registerContentProviderMock.mock.calls[0]; - expect(call[0].getTargetArea()).toEqual(['analytics_overview/get_started']); + expect(call[0].getTargetArea()).toEqual('analytics_overview/get_started'); expect(call[0].getContent()).toMatchInlineSnapshot(` Object { "cardProps": Object { @@ -39,5 +39,10 @@ describe('Sample data card', () => { "title": "Try openSearch", } `); + + // search use case overview + expect(registerContentProviderMock.mock.calls[1][0].getTargetArea()).toEqual( + 'search_overview/get_started' + ); }); }); diff --git a/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.test.tsx b/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.test.tsx new file mode 100644 index 000000000000..40ca5e3bbc99 --- /dev/null +++ b/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.test.tsx @@ -0,0 +1,78 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { render } from '@testing-library/react'; +import React from 'react'; +import { coreMock } from '../../../../../../core/public/mocks'; +import { OpenSearchDashboardsContextProvider } from '../../../../../opensearch_dashboards_react/public'; +import { contentManagementPluginMocks } from '../../../../../content_management/public/mocks'; +import { SearchUseCaseOverviewApp } from './search_use_case_app'; +import { ContentManagementPluginStart } from '../../../../../content_management/public'; +import { BehaviorSubject } from 'rxjs'; +import { WorkspaceObject } from 'opensearch-dashboards/public'; + +describe('', () => { + const renderPageMock = jest.fn(); + renderPageMock.mockReturnValue('dummy page'); + const mock = { + ...contentManagementPluginMocks.createStartContract(), + renderPage: renderPageMock, + }; + const coreStartMocks = coreMock.createStart(); + + function renderSearchUseCaseOverviewApp( + contentManagement: ContentManagementPluginStart, + services = { ...coreStartMocks } + ) { + return ( + + + + ); + } + + beforeEach(() => { + jest.clearAllMocks(); + }); + + it('render for workspace disabled case', () => { + const { container } = render(renderSearchUseCaseOverviewApp(mock, coreStartMocks)); + + expect(container).toMatchInlineSnapshot(` +
+ dummy page +
+ `); + + expect(coreStartMocks.chrome.setBreadcrumbs).toHaveBeenCalledWith([ + { text: 'Search overview' }, + ]); + expect(mock.renderPage).toBeCalledWith('search_overview'); + }); + + it('render for workspace enabled case', () => { + const coreStartMocksWithWorkspace = { + ...coreStartMocks, + workspaces: { + ...coreStartMocks.workspaces, + currentWorkspace$: new BehaviorSubject({ + id: 'foo', + name: 'foo ws', + }), + }, + }; + + const { container } = render(renderSearchUseCaseOverviewApp(mock, coreStartMocksWithWorkspace)); + + expect(container).toMatchInlineSnapshot(` +
+ dummy page +
+ `); + + expect(coreStartMocks.chrome.setBreadcrumbs).toHaveBeenCalledWith([{ text: 'foo ws' }]); + expect(mock.renderPage).toBeCalledWith('search_overview'); + }); +}); diff --git a/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.tsx b/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.tsx index cf9ef82ee900..4a0a54042a31 100644 --- a/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.tsx +++ b/src/plugins/home/public/application/components/usecase_overview/search_use_case_app.tsx @@ -12,7 +12,7 @@ import { i18n } from '@osd/i18n'; import { useOpenSearchDashboards } from '../../../../../opensearch_dashboards_react/public'; import { ContentManagementPluginStart, - SEARCH_OVERVIEW_ID, + SEARCH_OVERVIEW_PAGE_ID, } from '../../../../../content_management/public'; interface Props { @@ -39,7 +39,7 @@ export const SearchUseCaseOverviewApp = ({ contentManagement }: Props) => { return ( - {contentManagement ? contentManagement.renderPage(SEARCH_OVERVIEW_ID) : null} + {contentManagement ? contentManagement.renderPage(SEARCH_OVERVIEW_PAGE_ID) : null} ); }; diff --git a/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.test.tsx b/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.test.tsx new file mode 100644 index 000000000000..3d622b44d046 --- /dev/null +++ b/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.test.tsx @@ -0,0 +1,115 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { coreMock } from '../../../../../../core/public/mocks'; +import { contentManagementPluginMocks } from '../../../../../content_management/public/mocks'; +import { registerContentToSearchUseCasePage, setupSearchUseCase } from './search_use_case_setup'; + +describe('Search use case setup', () => { + const coreStart = coreMock.createStart(); + const registerContentProviderMock = jest.fn(); + const registerPageMock = jest.fn(); + + const contentManagementSetupMock = { + ...contentManagementPluginMocks.createSetupContract(), + registerPage: registerPageMock, + }; + + const contentManagementStartMock = { + ...contentManagementPluginMocks.createStartContract(), + registerContentProvider: registerContentProviderMock, + }; + + it('setupSearchUseCase', () => { + setupSearchUseCase(contentManagementSetupMock); + expect(registerPageMock).toHaveBeenCalledTimes(1); + + const call = registerPageMock.mock.calls[0]; + expect(call[0]).toMatchInlineSnapshot(` + Object { + "id": "search_overview", + "sections": Array [ + Object { + "id": "get_started", + "kind": "card", + "order": 1000, + "title": "Set up search", + }, + Object { + "columns": 2, + "grid": true, + "id": "different_search_types", + "kind": "card", + "order": 2000, + "title": "Try out different search techniques", + }, + Object { + "columns": 2, + "grid": true, + "id": "config_evaluate_search", + "kind": "card", + "order": 3000, + "title": "Configure and evaluate search", + }, + ], + "title": "Overview", + } + `); + }); + + it('registerContentToSearchUseCasePage', () => { + registerContentToSearchUseCasePage(contentManagementStartMock, coreStart); + + const call = registerContentProviderMock.mock.calls[0]; + expect(call[0].getTargetArea()).toEqual('search_overview/get_started'); + expect(call[0].getContent()).toMatchInlineSnapshot(` + Object { + "cardProps": Object { + "selectable": Object { + "children": , + "isSelected": false, + "onClick": [Function], + }, + }, + "description": "You can run a search using REST API or language client. For experimentation, you can also run queries interactively.", + "id": "access_search_functionality", + "kind": "card", + "order": 10, + "title": "Access search functionality", + } + `); + + // search type section + const searchTypesCall = registerContentProviderMock.mock.calls[2]; + expect(searchTypesCall[0].getTargetArea()).toEqual('search_overview/different_search_types'); + expect(searchTypesCall[0].getContent()).toMatchInlineSnapshot(` + Object { + "cardProps": Object { + "children":
+ + View Documentation + +
, + "layout": "horizontal", + }, + "description": "Lexical or keyword search matches documents based on exact words or phrases. Search the text using human-friendly query string query syntax or create complex, customizable queries using Query DSL—the OpenSearch query language.", + "getIcon": [Function], + "id": "text_search", + "kind": "card", + "order": 10, + "title": "Text search", + } + `); + }); +}); diff --git a/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.tsx b/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.tsx index 1aefda21a48c..d3a7abf8986c 100644 --- a/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.tsx +++ b/src/plugins/home/public/application/components/usecase_overview/search_use_case_setup.tsx @@ -10,14 +10,14 @@ import { i18n } from '@osd/i18n'; import { ContentManagementPluginSetup, ContentManagementPluginStart, - SEARCH_OVERVIEW_ID, + SEARCH_OVERVIEW_PAGE_ID, SECTIONS, SEARCH_OVERVIEW_CONTENT_AREAS, } from '../../../../../content_management/public'; export const setupSearchUseCase = (contentManagement: ContentManagementPluginSetup) => { contentManagement.registerPage({ - id: SEARCH_OVERVIEW_ID, + id: SEARCH_OVERVIEW_PAGE_ID, title: 'Overview', sections: [ {