diff --git a/changelogs/fragments/6752.yml b/changelogs/fragments/6752.yml new file mode 100644 index 000000000000..f43473bea2b8 --- /dev/null +++ b/changelogs/fragments/6752.yml @@ -0,0 +1,2 @@ +fix: +- Add test for data_source_error_menu, data_source_item, data_source_multi_selectable ([#6752](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6752)) \ No newline at end of file diff --git a/src/plugins/data_source_management/public/components/data_source_error_menu/__snapshots__/data_source_error_menu.test.tsx.snap b/src/plugins/data_source_management/public/components/data_source_error_menu/__snapshots__/data_source_error_menu.test.tsx.snap new file mode 100644 index 000000000000..f1f00f7c0ca8 --- /dev/null +++ b/src/plugins/data_source_management/public/components/data_source_error_menu/__snapshots__/data_source_error_menu.test.tsx.snap @@ -0,0 +1,95 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`DataSourceErrorMenu renders without crashing 1`] = ` + + + } + closePopover={[Function]} + data-test-subj="dataSourceErrorPopover" + display="inlineBlock" + hasArrow={true} + id="dataSourceErrorPopover" + isOpen={false} + ownFocus={true} + panelPaddingSize="none" + > + + + + Failed to fetch data sources + + + + + + + Refresh the page + + + + + + +`; diff --git a/src/plugins/data_source_management/public/components/data_source_error_menu/data_source_error_menu.test.tsx b/src/plugins/data_source_management/public/components/data_source_error_menu/data_source_error_menu.test.tsx new file mode 100644 index 000000000000..90a1ad1a4a0b --- /dev/null +++ b/src/plugins/data_source_management/public/components/data_source_error_menu/data_source_error_menu.test.tsx @@ -0,0 +1,28 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { shallow } from 'enzyme'; +import { DataSourceErrorMenu } from './data_source_error_menu'; +import { coreMock } from '../../../../../core/public/mocks'; +import { render } from '@testing-library/react'; + +describe('DataSourceErrorMenu', () => { + const applicationMock = coreMock.createStart().application; + it('renders without crashing', () => { + const component = shallow(); + expect(component).toMatchSnapshot(); + }); + + it('should toggle popover when icon button is clicked', () => { + const container = render(); + const iconButton = container.getByTestId('dataSourceErrorMenuHeaderLink'); + iconButton.click(); + expect(container.getByTestId('dataSourceErrorPopover')).toBeVisible(); + expect(container.getByTestId('datasourceTableEmptyState')).toHaveTextContent( + 'Failed to fetch data sources' + ); + }); +}); diff --git a/src/plugins/data_source_management/public/components/data_source_item/data_source_item.test.tsx b/src/plugins/data_source_management/public/components/data_source_item/data_source_item.test.tsx index 8cb736f2fb61..49c6c34a84f6 100644 --- a/src/plugins/data_source_management/public/components/data_source_item/data_source_item.test.tsx +++ b/src/plugins/data_source_management/public/components/data_source_item/data_source_item.test.tsx @@ -43,4 +43,21 @@ describe('Test on ShowDataSourceOption', () => { expect(component.find(EuiFlexItem)).toHaveLength(2); expect(component.find(EuiBadge)).toHaveLength(1); }); + + it('should render the component with a default data source', () => { + const item: DataSourceOption = { + id: 'default data source', + label: 'DataSource 1', + visible: true, + }; + const defaultDataSource = 'default data source'; + const wrapper = shallow( + + ); + + expect(wrapper.find(EuiFlexGroup).exists()).toBe(true); + expect(wrapper.find(EuiFlexItem).exists()).toBe(true); + expect(wrapper.find(EuiBadge).exists()).toBe(true); + expect(wrapper.find(EuiBadge).prop('children')).toBe('Default'); + }); }); diff --git a/src/plugins/data_source_management/public/components/data_source_multi_selectable/data_source_multi_selectable.test.tsx b/src/plugins/data_source_management/public/components/data_source_multi_selectable/data_source_multi_selectable.test.tsx index 957080dbd1ab..7a9f1f96ed0c 100644 --- a/src/plugins/data_source_management/public/components/data_source_multi_selectable/data_source_multi_selectable.test.tsx +++ b/src/plugins/data_source_management/public/components/data_source_multi_selectable/data_source_multi_selectable.test.tsx @@ -4,13 +4,13 @@ */ import { SavedObjectsClientContract } from 'opensearch-dashboards/public'; -import { notificationServiceMock } from '../../../../../core/public/mocks'; +import { fatalErrorsServiceMock, notificationServiceMock } from '../../../../../core/public/mocks'; import { getDataSourcesWithFieldsResponse, mockResponseForSavedObjectsCalls, mockManagementPlugin, } from '../../mocks'; -import { ShallowWrapper, shallow } from 'enzyme'; +import { ShallowWrapper, mount, shallow } from 'enzyme'; import { DataSourceMultiSelectable } from './data_source_multi_selectable'; import React from 'react'; import { render, fireEvent, screen } from '@testing-library/react'; @@ -91,6 +91,11 @@ describe('DataSourceMultiSelectable', () => { ); await nextTick(); expect(toasts.add).toBeCalledTimes(1); + expect(toasts.add).toBeCalledWith({ + color: 'danger', + text: expect.any(Function), + title: 'Failed to fetch data sources', + }); }); it('should callback when onChange happens', async () => { @@ -111,7 +116,7 @@ describe('DataSourceMultiSelectable', () => { expect(callbackMock).toBeCalledWith([]); }); - it('should retrun correct state when ui Settings provided', async () => { + it('should return correct state when ui Settings provided', async () => { spyOn(uiSettings, 'get').and.returnValue('test1'); component = shallow( { expect(component.state('selectedOptions')).toHaveLength(3); }); - it('should retrun correct state when ui Settings provided and hide cluster is false', async () => { + it('should return correct state when ui Settings provided and hide cluster is false', async () => { spyOn(uiSettings, 'get').and.returnValue('test1'); component = shallow( { expect(component.state('defaultDataSource')).toEqual('test1'); expect(component.state('selectedOptions')).toHaveLength(4); }); + + it('should handle no available data source error when selected option is empty and hide localcluster', async () => { + mockResponseForSavedObjectsCalls(client, 'find', {}); + const wrapper = mount( + + ); + await wrapper.instance().componentDidMount!(); + expect(wrapper.state('selectedOptions')).toHaveLength(0); + expect(wrapper.state('showEmptyState')).toBe(true); + }); + + it('should not handle no available data source error when selected option is empty and not hide localcluster', async () => { + mockResponseForSavedObjectsCalls(client, 'find', {}); + const wrapper = mount( + + ); + await wrapper.instance().componentDidMount!(); + expect(wrapper.state('selectedOptions')).toHaveLength(1); + expect(wrapper.state('showEmptyState')).toBe(false); + }); }); diff --git a/src/plugins/data_source_management/public/mocks.ts b/src/plugins/data_source_management/public/mocks.ts index 86b7192c6324..a33a55d6799c 100644 --- a/src/plugins/data_source_management/public/mocks.ts +++ b/src/plugins/data_source_management/public/mocks.ts @@ -283,7 +283,6 @@ export const mockDataSourceAttributesWithSigV4Auth = { }, }; - export const mockDataSourceAttributesWithNoAuth = { id: 'test123', title: 'create-test-ds123',