From e73905a089535e77f230749f0af21ef856179e90 Mon Sep 17 00:00:00 2001 From: Eric Wei Date: Tue, 14 Dec 2021 09:39:50 -0800 Subject: [PATCH 1/4] tests Signed-off-by: Eric Wei --- .../__snapshots__/data_grid.test.tsx.snap | 430 + .../__snapshots__/no_results.test.tsx.snap | 211 + .../explorer/__tests__/data_grid.test.tsx | 48 + .../explorer/__tests__/explorer.test.tsx | 55 + .../explorer/__tests__/no_results.test.tsx | 27 + .../__snapshots__/docViewer.test.tsx.snap | 761 ++ .../__snapshots__/docViewerRow.test.tsx.snap | 64 + .../docTable/__tests__/docViewer.test.tsx | 34 + .../docTable/__tests__/docViewerRow.test.tsx | 39 + .../explorer/docTable/docViewRow.tsx | 1 - .../json_code_block.test.tsx.snap | 142 + .../__tests__/json_code_block.test.tsx | 34 + .../__snapshots__/hits_counter.test.tsx.snap | 142 + .../__tests__/hits_counter.test.tsx | 32 + .../public/components/explorer/home.tsx | 4 +- .../saved_query_table.test.tsx.snap | 1686 ++++ .../__tests__/saved_query_table.test.tsx | 35 + ...istory_table.tsx => saved_query_table.tsx} | 6 +- .../__snapshots__/save_panel.test.tsx.snap | 695 ++ .../save_panel/__tests__/save_panel.test.tsx | 40 + .../components/explorer/save_panel/index.ts | 2 +- .../{savePanel.tsx => save_panel.tsx} | 2 - .../__snapshots__/field.test.tsx.snap | 296 + .../__snapshots__/sidebar.test.tsx.snap | 8644 +++++++++++++++++ .../explorer/sidebar/__tests__/field.test.tsx | 41 + .../sidebar/__tests__/sidebar.test.tsx | 93 + .../timechart_header.test.tsx.snap | 333 + .../__tests__/timechart_header.test.tsx | 35 + .../timechart_header/timechart_header.tsx | 26 +- .../__snapshots__/datapanel.test.tsx.snap | 6258 ++++++++++++ .../field_accordion.test.tsx.snap | 5890 +++++++++++ .../__snapshots__/field_item.test.tsx.snap | 288 + .../__snapshots__/field_list.test.tsx.snap | 234 + .../lens_field_icon.test.tsx.snap | 55 + .../__tests__/datapanel.test.tsx | 45 + .../__tests__/field_accordion.test.tsx | 36 + .../__tests__/field_item.test.tsx | 36 + .../__tests__/field_list.test.tsx | 33 + .../__tests__/lens_field_icon.test.tsx | 29 + .../__snapshots__/assets.test.tsx.snap | 64 + .../assets/__tests__/assets.test.tsx | 57 + .../explorer/visualizations/assets/legend.tsx | 38 - .../__snapshots__/config_panel.test.tsx.snap | 3666 +++++++ .../__tests__/config_panel.test.tsx | 81 + .../count_distribution.test.tsx.snap | 48 + .../__tests__/count_distribution.test.tsx | 43 + .../shared_components.test.tsx.snap | 198 + .../__tests__/shared_components.test.tsx | 52 + .../visualizations/shared_components/index.ts | 1 - .../legend_settings_popover.tsx | 158 - .../shared_components/toolbar_popover.tsx | 81 - .../__snapshots__/workspace.test.tsx.snap | 1725 ++++ .../__tests__/workspace.test.tsx | 137 + .../workspace_panel/workspace_panel.tsx | 3 - .../charts/__tests__/bar.test.tsx | 36 + .../charts/__tests__/horizontal_bar.test.tsx | 36 + .../charts/__tests__/line.test.tsx | 36 + .../plotly/__tests__/plotly.test.tsx | 73 + .../test/event_analytics_constants.ts | 470 + 59 files changed, 33550 insertions(+), 315 deletions(-) create mode 100644 dashboards-observability/public/components/explorer/__tests__/__snapshots__/data_grid.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/__tests__/__snapshots__/no_results.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/__tests__/data_grid.test.tsx create mode 100644 dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx create mode 100644 dashboards-observability/public/components/explorer/__tests__/no_results.test.tsx create mode 100644 dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewer.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewerRow.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/docTable/__tests__/docViewer.test.tsx create mode 100644 dashboards-observability/public/components/explorer/docTable/__tests__/docViewerRow.test.tsx create mode 100644 dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/json_code_block.test.tsx create mode 100644 dashboards-observability/public/components/explorer/hits_counter/__tests__/__snapshots__/hits_counter.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/hits_counter/__tests__/hits_counter.test.tsx create mode 100644 dashboards-observability/public/components/explorer/home_table/__tests__/__snapshots__/saved_query_table.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/home_table/__tests__/saved_query_table.test.tsx rename dashboards-observability/public/components/explorer/home_table/{history_table.tsx => saved_query_table.tsx} (97%) create mode 100644 dashboards-observability/public/components/explorer/save_panel/__tests__/__snapshots__/save_panel.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/save_panel/__tests__/save_panel.test.tsx rename dashboards-observability/public/components/explorer/save_panel/{savePanel.tsx => save_panel.tsx} (98%) create mode 100644 dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/sidebar.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/sidebar/__tests__/field.test.tsx create mode 100644 dashboards-observability/public/components/explorer/sidebar/__tests__/sidebar.test.tsx create mode 100644 dashboards-observability/public/components/explorer/timechart_header/__tests__/__snapshots__/timechart_header.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/timechart_header/__tests__/timechart_header.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_accordion.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_item.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_list.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/lens_field_icon.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/field_accordion.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/field_item.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/assets/__tests__/__snapshots__/assets.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/assets/__tests__/assets.test.tsx delete mode 100644 dashboards-observability/public/components/explorer/visualizations/assets/legend.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/config_panel.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/shared_components.test.tsx delete mode 100644 dashboards-observability/public/components/explorer/visualizations/shared_components/legend_settings_popover.tsx delete mode 100644 dashboards-observability/public/components/explorer/visualizations/shared_components/toolbar_popover.tsx create mode 100644 dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap create mode 100644 dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/workspace.test.tsx create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/bar.test.tsx create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/horizontal_bar.test.tsx create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/line.test.tsx create mode 100644 dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx create mode 100644 dashboards-observability/test/event_analytics_constants.ts diff --git a/dashboards-observability/public/components/explorer/__tests__/__snapshots__/data_grid.test.tsx.snap b/dashboards-observability/public/components/explorer/__tests__/__snapshots__/data_grid.test.tsx.snap new file mode 100644 index 000000000..4fa0f57dc --- /dev/null +++ b/dashboards-observability/public/components/explorer/__tests__/__snapshots__/data_grid.test.tsx.snap @@ -0,0 +1,430 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Datagrid component Renders data grid component 1`] = ` + + + + + + + + + + + + + + + + + + + + + + + + +
+ + double_per_ip_bytes + + host + + ip_count + + per_ip_bytes + + resp_code + + sum_bytes +
+ +
+ +
+ +`; diff --git a/dashboards-observability/public/components/explorer/__tests__/__snapshots__/no_results.test.tsx.snap b/dashboards-observability/public/components/explorer/__tests__/__snapshots__/no_results.test.tsx.snap new file mode 100644 index 000000000..e7e97a213 --- /dev/null +++ b/dashboards-observability/public/components/explorer/__tests__/__snapshots__/no_results.test.tsx.snap @@ -0,0 +1,211 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`No result component Renders No result component 1`] = ` + + + + + +
+ + +
+ +
+ + } + > +
+
+ + + + No results match your search criteria + + +
+
+ + +
+ + +
+

+ + Expand your time range or modify your query + +

+

+ + Your query may not match anything in the current time range, or there may not be any data at all in the currently selected time range. Try change time range, query filters or choose different time fields + +

+
+ +
+ +
+ + + + + +`; diff --git a/dashboards-observability/public/components/explorer/__tests__/data_grid.test.tsx b/dashboards-observability/public/components/explorer/__tests__/data_grid.test.tsx new file mode 100644 index 000000000..a45d7ecd9 --- /dev/null +++ b/dashboards-observability/public/components/explorer/__tests__/data_grid.test.tsx @@ -0,0 +1,48 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { DataGrid } from '../data_grid'; +import { + SELECTED_FIELDS, + AVAILABLE_FIELDS, + UNSELECTED_FIELDS, + QUERIED_FIELDS +} from '../../../../common/constants/explorer'; +import { + AVAILABLE_FIELDS as SIDEBAR_AVAILABLE_FIELDS, + QUERY_FIELDS, + DATA_GRID_ROWS +} from '../../../../test/event_analytics_constants'; + +describe('Datagrid component', () => { + configure({ adapter: new Adapter() }); + + it('Renders data grid component', async () => { + const explorerFields = { + [SELECTED_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, + [QUERIED_FIELDS]: QUERY_FIELDS + }; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx b/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx new file mode 100644 index 000000000..4c5642654 --- /dev/null +++ b/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx @@ -0,0 +1,55 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { useHistory } from 'react-router-dom'; +import httpClientMock from '../../../../test/__mocks__/httpClientMock'; +import { Explorer } from '../explorer'; +import PPLService from '../../../services/requests/ppl'; +import DSLService from '../../../services/requests/dsl'; +import SavedObjects from '../../../services/saved_objects/event_analytics/saved_objects'; +import TimestampUtils from '../../../services/timestamp/timestamp'; +import { coreStartMock } from '../../../../test/__mocks__/coreMocks'; + +describe.skip('Event explorer component', () => { + configure({ adapter: new Adapter() }); + + it('Renders explorer component', async () => { + const pplService = new PPLService(httpClientMock); + const dslService = new DSLService(httpClientMock); + const tabId = 'query-panel-1'; + const savedObjects = new SavedObjects(httpClientMock); + const timestampUtils = new TimestampUtils(dslService); + const setToast = jest.fn(); + const history = jest.fn() as any; + history.replace = jest.fn(); + history.push = jest.fn(); + const notifications = coreStartMock.notifications; + const savedObjectId = 'JIcoln0BYMuJGDsOLTnM'; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/__tests__/no_results.test.tsx b/dashboards-observability/public/components/explorer/__tests__/no_results.test.tsx new file mode 100644 index 000000000..b87c8dc13 --- /dev/null +++ b/dashboards-observability/public/components/explorer/__tests__/no_results.test.tsx @@ -0,0 +1,27 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { NoResults } from '../no_results'; + +describe('No result component', () => { + configure({ adapter: new Adapter() }); + + it('Renders No result component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewer.test.tsx.snap b/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewer.test.tsx.snap new file mode 100644 index 000000000..8b1132246 --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewer.test.tsx.snap @@ -0,0 +1,761 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Datagrid Doc viewer component Renders Doc viewer component 1`] = ` + +
+ , + "id": "doc_viewer_tab_1", + "name": "Table", + } + } + tabs={ + Array [ + Object { + "content": , + "id": "doc_viewer_tab_1", + "name": "Table", + }, + Object { + "content": , + "id": "doc_viewer_tab_2", + "name": "JSON", + }, + ] + } + > +
+ +
+ + + + + + +
+ +
+ + + + + + + + + + + + + + + + + + + +
+ + + } + delay="regular" + position="top" + > + + + + + + + + + + } + delay="regular" + position="top" + > + + + + + + + + + + } + delay="regular" + position="top" + > + + + + + + + + + + +
+ +
+ + + + Carrier + + + +
+ +
+ + + 		+
+
+ + + } + delay="regular" + position="top" + > + + + + + + + + + + } + delay="regular" + position="top" + > + + + + + + + + + + } + delay="regular" + position="top" + > + + + + + + + + + + +
+ +
+ + + + avg(FlightDelayMin) + + + +
+ +
+ + + 		+
+
+ + +
+
+ +
+ +`; diff --git a/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewerRow.test.tsx.snap b/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewerRow.test.tsx.snap new file mode 100644 index 000000000..fdeca17de --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/__tests__/__snapshots__/docViewerRow.test.tsx.snap @@ -0,0 +1,64 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Datagrid Doc viewer row component Renders Doc viewer row component 1`] = ` + + + + + + + 45.957544288332315 + + + +`; diff --git a/dashboards-observability/public/components/explorer/docTable/__tests__/docViewer.test.tsx b/dashboards-observability/public/components/explorer/docTable/__tests__/docViewer.test.tsx new file mode 100644 index 000000000..3a807d7c9 --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/__tests__/docViewer.test.tsx @@ -0,0 +1,34 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { DocViewer } from '../docViewer'; + +describe('Datagrid Doc viewer component', () => { + configure({ adapter: new Adapter() }); + + it('Renders Doc viewer component', async () => { + + const hit = { + 'Carrier': 'JetBeats', + 'avg(FlightDelayMin)': '45.957544288332315' + }; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/docTable/__tests__/docViewerRow.test.tsx b/dashboards-observability/public/components/explorer/docTable/__tests__/docViewerRow.test.tsx new file mode 100644 index 000000000..684ede48c --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/__tests__/docViewerRow.test.tsx @@ -0,0 +1,39 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { DocViewRow } from '../docViewRow'; + +describe('Datagrid Doc viewer row component', () => { + configure({ adapter: new Adapter() }); + + it('Renders Doc viewer row component', async () => { + + const hit = { + 'Carrier': 'JetBeats', + 'avg(FlightDelayMin)': '45.957544288332315' + }; + const selectedCols = [{ + name: 'avg(FlightDelayMin)', + type: 'double' + }]; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/docTable/docViewRow.tsx b/dashboards-observability/public/components/explorer/docTable/docViewRow.tsx index 833f5fcec..43926b256 100644 --- a/dashboards-observability/public/components/explorer/docTable/docViewRow.tsx +++ b/dashboards-observability/public/components/explorer/docTable/docViewRow.tsx @@ -12,7 +12,6 @@ import { } from 'lodash'; import { EuiIcon } from '@elastic/eui'; import { DocViewer } from './docViewer'; -import { DocDetailTitle } from './detailTable/docDetailTitle'; import { IField } from '../../../../common/types/explorer'; export interface IDocType { diff --git a/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap new file mode 100644 index 000000000..48ca53c75 --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap @@ -0,0 +1,142 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Doc viewer json block component Renders json block component 1`] = ` + + + + + { + "Carrier": "JetBeats", + "avg(FlightDelayMin)": "45.957544288332315" +} +
+ } + > + { + "Carrier": "JetBeats", + "avg(FlightDelayMin)": "45.957544288332315" +} + + +
+ 
+            
+
+
+
+ + + + + + + + + + + +
+
+
+ + + + +`; diff --git a/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/json_code_block.test.tsx b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/json_code_block.test.tsx new file mode 100644 index 000000000..cef6e648d --- /dev/null +++ b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/json_code_block.test.tsx @@ -0,0 +1,34 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { JsonCodeBlock } from '../json_code_block'; + +describe('Doc viewer json block component', () => { + configure({ adapter: new Adapter() }); + + it('Renders json block component', async () => { + + const hit = { + 'Carrier': 'JetBeats', + 'avg(FlightDelayMin)': '45.957544288332315' + }; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/hits_counter/__tests__/__snapshots__/hits_counter.test.tsx.snap b/dashboards-observability/public/components/explorer/hits_counter/__tests__/__snapshots__/hits_counter.test.tsx.snap new file mode 100644 index 000000000..13a8ec20c --- /dev/null +++ b/dashboards-observability/public/components/explorer/hits_counter/__tests__/__snapshots__/hits_counter.test.tsx.snap @@ -0,0 +1,142 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Hits counter component Renders hits counter 1`] = ` + + + + + +
+ +
+ +
+ + 815 + + + + hits + +
+ +
+ +
+ + + + + +`; diff --git a/dashboards-observability/public/components/explorer/hits_counter/__tests__/hits_counter.test.tsx b/dashboards-observability/public/components/explorer/hits_counter/__tests__/hits_counter.test.tsx new file mode 100644 index 000000000..fca4b5fee --- /dev/null +++ b/dashboards-observability/public/components/explorer/hits_counter/__tests__/hits_counter.test.tsx @@ -0,0 +1,32 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { HitsCounter } from '../hits_counter'; + +describe('Hits counter component', () => { + configure({ adapter: new Adapter() }); + + it('Renders hits counter', async () => { + const onResetQuery = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/home.tsx b/dashboards-observability/public/components/explorer/home.tsx index 96c1b1ce9..d2e1ac5b4 100644 --- a/dashboards-observability/public/components/explorer/home.tsx +++ b/dashboards-observability/public/components/explorer/home.tsx @@ -48,7 +48,7 @@ import { addTab, selectQueryTabs } from './slices/query_tab_slice'; import { init as initFields } from './slices/field_slice'; import { init as initQuery, changeQuery } from './slices/query_slice'; import { init as initQueryResult, selectQueryResult } from './slices/query_result_slice'; -import { Histories as EventHomeHistories } from './home_table/history_table'; +import { SavedQueryTable } from './home_table/saved_query_table'; import { selectQueries } from './slices/query_slice'; import { setSelectedQueryTab } from './slices/query_tab_slice'; import { DeletePanelModal } from '../custom_panels/helpers/modal_containers'; @@ -404,7 +404,7 @@ export const Home = (props: IHomeProps) => { {savedHistories.length > 0 ? ( - + +
+ + +
+ +
+ + + +
+
+ + + + +
+ + + + + +
+ +
+
+ + + +
+ + +
+ + +
+ + + Type + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="field_value_selection_0" + isOpen={false} + ownFocus={true} + panelClassName="euiFilterGroup__popoverPanel" + panelPaddingSize="none" + withTitle={false} + > + +
+
+ + + + + +
+
+ + + +
+ + +
+ +
+ + + +
+ + +
+
+ +
+ +
+ +
+ + +
+ +
+ +
+ + +
+ + +
+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ + +
+ +
+
+ + +
+
+
+ + + +
+ 		+
+ + + Name + + +
+ 		+
+ + + Type + + +
+
+
+ + +
+ +
+
+ + +
+
+
+
+ + + + + +
+
+ 		+
+ Name +
+
+ + + +
+ 		+
+ Type +
+
+ + Visualization + +
+
+
+ + +
+ +
+
+ + +
+
+
+
+ + + + + +
+
+ 		+
+ Name +
+
+ + + +
+ 		+
+ Type +
+
+ + Visualization + +
+
+ +
+ +
+ +
+ + + +
+ +
+ + + : + 10 + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + isOpen={false} + ownFocus={false} + panelPaddingSize="none" + withTitle={true} + > + +
+
+ + + +
+
+ + +
+ + +
+ + + +
+ +
+ + +
+ +
+ +
+ + +`; diff --git a/dashboards-observability/public/components/explorer/home_table/__tests__/saved_query_table.test.tsx b/dashboards-observability/public/components/explorer/home_table/__tests__/saved_query_table.test.tsx new file mode 100644 index 000000000..c8e4eee8b --- /dev/null +++ b/dashboards-observability/public/components/explorer/home_table/__tests__/saved_query_table.test.tsx @@ -0,0 +1,35 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { SavedQueryTable } from '../saved_query_table'; +import { SAVED_HISTORIES } from '../../../../../test/event_analytics_constants'; + +describe('Saved query table component', () => { + configure({ adapter: new Adapter() }); + + it('Renders saved query table', async () => { + const handleHistoryClick = jest.fn(); + const handleSelectHistory = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/home_table/history_table.tsx b/dashboards-observability/public/components/explorer/home_table/saved_query_table.tsx similarity index 97% rename from dashboards-observability/public/components/explorer/home_table/history_table.tsx rename to dashboards-observability/public/components/explorer/home_table/saved_query_table.tsx index c8912f9f0..50802c13b 100644 --- a/dashboards-observability/public/components/explorer/home_table/history_table.tsx +++ b/dashboards-observability/public/components/explorer/home_table/saved_query_table.tsx @@ -11,19 +11,19 @@ import { } from '@elastic/eui'; import { FILTER_OPTIONS } from '../../../../common/constants/explorer'; -interface TableData { +interface savedQueryTableProps { savedHistories: Array; handleHistoryClick: (objectId: string) => void; handleSelectHistory: (selectedHistories: Array) => void; isTableLoading: boolean; } -export function Histories({ +export function SavedQueryTable({ savedHistories, handleHistoryClick, handleSelectHistory, isTableLoading -}: TableData) { +}: savedQueryTableProps) { const [pageIndex, setPageIndex] = useState(0); const [pageSize, setPageSize] = useState(10); const pageIndexRef = useRef(); diff --git a/dashboards-observability/public/components/explorer/save_panel/__tests__/__snapshots__/save_panel.test.tsx.snap b/dashboards-observability/public/components/explorer/save_panel/__tests__/__snapshots__/save_panel.test.tsx.snap new file mode 100644 index 000000000..6344e67ec --- /dev/null +++ b/dashboards-observability/public/components/explorer/save_panel/__tests__/__snapshots__/save_panel.test.tsx.snap @@ -0,0 +1,695 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Saved query table component Renders saved query table 1`] = ` + + +

+ Custom operational dashboards/application +

+ + +
+
+ +
+ + +
+
+
+ + + + + + + + [Logs] Web traffic Panel + + + + + + + + + + + + + + + + [Logs] Web traffic Panel 2 + + + + + + + + + +
+ +
+
+ +
+ +
+ + + + + + + + +
+ +
+
+ + +
+ + +
+ Search existing dashboards or applications by name +
+ +
+
+ + +

+ Name +

+ + +
+
+ + +
+
+ + + + +
+
+ + + +
+ Name for your savings +
+ +
+
+ + +`; diff --git a/dashboards-observability/public/components/explorer/save_panel/__tests__/save_panel.test.tsx b/dashboards-observability/public/components/explorer/save_panel/__tests__/save_panel.test.tsx new file mode 100644 index 000000000..8a907ac2a --- /dev/null +++ b/dashboards-observability/public/components/explorer/save_panel/__tests__/save_panel.test.tsx @@ -0,0 +1,40 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { SavePanel } from '../save_panel'; +import { SELECTED_PANELS_OPTIONS } from '../../../../../test/event_analytics_constants'; +import SavedObjects from '../../../../services/saved_objects/event_analytics/saved_objects'; +import httpClientMock from '../../../../../test/__mocks__/httpClientMock'; + +describe('Saved query table component', () => { + configure({ adapter: new Adapter() }); + + it('Renders saved query table', async () => { + const handleNameChange = jest.fn(); + const handleOptionChange = jest.fn(); + const savedObjects = new SavedObjects(httpClientMock); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/save_panel/index.ts b/dashboards-observability/public/components/explorer/save_panel/index.ts index d78fa44d9..de81603f7 100644 --- a/dashboards-observability/public/components/explorer/save_panel/index.ts +++ b/dashboards-observability/public/components/explorer/save_panel/index.ts @@ -3,4 +3,4 @@ * SPDX-License-Identifier: Apache-2.0 */ -export { SavePanel } from './savePanel'; \ No newline at end of file +export { SavePanel } from './save_panel'; \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/save_panel/savePanel.tsx b/dashboards-observability/public/components/explorer/save_panel/save_panel.tsx similarity index 98% rename from dashboards-observability/public/components/explorer/save_panel/savePanel.tsx rename to dashboards-observability/public/components/explorer/save_panel/save_panel.tsx index 5aab3e0d9..2d89b5f7a 100644 --- a/dashboards-observability/public/components/explorer/save_panel/savePanel.tsx +++ b/dashboards-observability/public/components/explorer/save_panel/save_panel.tsx @@ -21,7 +21,6 @@ interface ISavedPanelProps { handleNameChange: any; handleOptionChange: any; savedObjects: SavedObjects; - isTextFieldInvalid: boolean; savePanelName: string; showOptionList: boolean; } @@ -38,7 +37,6 @@ export const SavePanel = ({ handleNameChange, handleOptionChange, savedObjects, - isTextFieldInvalid, savePanelName, showOptionList, }: ISavedPanelProps) => { diff --git a/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap b/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap new file mode 100644 index 000000000..44f6114c2 --- /dev/null +++ b/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap @@ -0,0 +1,296 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Field component Renders a sidebar field 1`] = ` + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
+
+ + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + size="s" + > +
+ +
+ + + + + + + + + + +
+
+ +
+
+ + + +`; diff --git a/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/sidebar.test.tsx.snap b/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/sidebar.test.tsx.snap new file mode 100644 index 000000000..1ee28c193 --- /dev/null +++ b/dashboards-observability/public/components/explorer/sidebar/__tests__/__snapshots__/sidebar.test.tsx.snap @@ -0,0 +1,8644 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Siderbar component Renders empty sidebar component 1`] = ` + + + + +
+ +
+ +
+ + +
+
+ + + + +
+ + + + + +
+ +
+
+ + +
+ +
+ +
+
+ + + + +`; + +exports[`Siderbar component Renders sidebar component 1`] = ` + + + + +
+ +
+ +
+ + +
+
+ + + + +
+ + + + + +
+ +
+
+ + +
+ +
+ +
+ +

+ + Query fields + +

+ + +
+ +
    +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + double_per_ip_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + double_per_ip_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + ip_count + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + ip_count + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + per_ip_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + per_ip_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + resp_code + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + resp_code + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
  • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + sum_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
    +
    + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + sum_bytes + + } + isActive={false} + onClick={[Function]} + size="s" + > +
    + +
    + + + + + + + + + + +
    +
    +     +
    +
    +     +     +     +
    • +
+ +

+ + Selected Fields + +

+ + +
+ +
    +
    + +

    + + Available Fields + +

    +     +
    + + + +
    +
    +
      +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + Default Timestamp + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + Default Timestamp + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + Default Timestamp + + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    • + + + + + + Override + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + size="s" + /> + } + closePopover={[Function]} + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="dscSidebarItem__fieldPopoverPanel" + panelPaddingSize="m" + > + +
      +
      + + + + + Override + + + + + + + + + + } + fieldIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + size="s" + > +
      + +
      + + + + + + + + + + + + + + +
      +
      +       +
      +
      +       +       +       +
      • +
    +
+
+ + + + +`; diff --git a/dashboards-observability/public/components/explorer/sidebar/__tests__/field.test.tsx b/dashboards-observability/public/components/explorer/sidebar/__tests__/field.test.tsx new file mode 100644 index 000000000..c6660d934 --- /dev/null +++ b/dashboards-observability/public/components/explorer/sidebar/__tests__/field.test.tsx @@ -0,0 +1,41 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { Field } from '../field'; +import { AGENT_FIELD } from '../../../../../test/event_analytics_constants'; + +describe('Field component', () => { + configure({ adapter: new Adapter() }); + + it('Renders a sidebar field', async () => { + const onToggleField = jest.fn(); + const handleOverrideTimestamp = jest.fn(); + const selectedTimestamp = 'timestamp'; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/sidebar/__tests__/sidebar.test.tsx b/dashboards-observability/public/components/explorer/sidebar/__tests__/sidebar.test.tsx new file mode 100644 index 000000000..0e8e23ec4 --- /dev/null +++ b/dashboards-observability/public/components/explorer/sidebar/__tests__/sidebar.test.tsx @@ -0,0 +1,93 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { Sidebar } from '../sidebar'; +import { + SELECTED_FIELDS, + AVAILABLE_FIELDS, + UNSELECTED_FIELDS, + QUERIED_FIELDS +} from '../../../../../common/constants/explorer'; +import { + AVAILABLE_FIELDS as SIDEBAR_AVAILABLE_FIELDS, + QUERY_FIELDS, + JSON_DATA, + JSON_DATA_ALL +} from '../../../../../test/event_analytics_constants'; + +describe('Siderbar component', () => { + configure({ adapter: new Adapter() }); + + it('Renders empty sidebar component', async () => { + const explorerFields = { + [SELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [QUERIED_FIELDS]: [] + }; + const handleAddField = jest.fn(); + const handleOverrideTimestamp = jest.fn(); + const selectedTimestamp = 'timestamp'; + const explorerData = {}; + const handleRemoveField = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders sidebar component', async () => { + const explorerFields = { + [SELECTED_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, + [QUERIED_FIELDS]: QUERY_FIELDS + }; + const handleAddField = jest.fn(); + const handleOverrideTimestamp = jest.fn(); + const selectedTimestamp = 'timestamp'; + const explorerData = { + 'jsonData': JSON_DATA, + 'jsonDataAll': JSON_DATA_ALL + }; + const handleRemoveField = jest.fn(); + + const wrapper = mount( + + ); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/timechart_header/__tests__/__snapshots__/timechart_header.test.tsx.snap b/dashboards-observability/public/components/explorer/timechart_header/__tests__/__snapshots__/timechart_header.test.tsx.snap new file mode 100644 index 000000000..af8ade96a --- /dev/null +++ b/dashboards-observability/public/components/explorer/timechart_header/__tests__/__snapshots__/timechart_header.test.tsx.snap @@ -0,0 +1,333 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Time chart header component Renders Time chart header component 1`] = ` + + + + + +
+ +
+ + + +
+ + + +
+ + +
+ + +
+
+ + + + +
+ + + + + +
+ +
+
+ + +
+ +
+ + + + + +`; diff --git a/dashboards-observability/public/components/explorer/timechart_header/__tests__/timechart_header.test.tsx b/dashboards-observability/public/components/explorer/timechart_header/__tests__/timechart_header.test.tsx new file mode 100644 index 000000000..138c76bc7 --- /dev/null +++ b/dashboards-observability/public/components/explorer/timechart_header/__tests__/timechart_header.test.tsx @@ -0,0 +1,35 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { TimechartHeader } from '../timechart_header'; +import { TIME_INTERVAL_OPTIONS } from '../../../../../common/constants/explorer'; + +describe('Time chart header component', () => { + configure({ adapter: new Adapter() }); + + it('Renders Time chart header component', async () => { + + const onChangeInterval = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx b/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx index 1bbd8d2cb..651563023 100644 --- a/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx +++ b/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx @@ -14,14 +14,6 @@ export interface TimechartHeaderProps { * Format of date to be displayed */ dateFormat?: string; - /** - * Interval for the buckets of the recent request - */ - bucketInterval?: { - scaled?: boolean; - description?: string; - scale?: number; - }; /** * Range of dates to be displayed */ @@ -44,26 +36,10 @@ export interface TimechartHeaderProps { } export function TimechartHeader({ - bucketInterval, - dateFormat, - timeRange, options, - onChangeInterval, - stateInterval, + onChangeInterval }: TimechartHeaderProps) { const [interval, setInterval] = useState(options[0].value); - const toMoment = useCallback( - (datetime: string) => { - if (!datetime) { - return ''; - } - if (!dateFormat) { - return datetime; - } - return moment(datetime).format(dateFormat); - }, - [dateFormat] - ); const handleIntervalChange = (e: React.ChangeEvent) => { setInterval(e.target.value); diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap new file mode 100644 index 000000000..f5ac0cf29 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap @@ -0,0 +1,6258 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`No result component Renders No result component 1`] = ` + + +
+ +
+ +
+
+ + +
+ + + + + +
+
+ + + + + +
+ +
+
+ + +
+ +
+ + +
+ +
+
+ + + + Available fields + + + } + extraAction={ + + 20 + + } + id="1" + initialIsOpen={false} + isLoading={false} + isLoadingMessage={false} + paddingSize="none" + > +
+
+ +
+ + + 20 + + +
+
+
+ +
+
+ +
+ +
+ + + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + +
+
+
+ +
+
+ + +
+
+ +
+ +
+ + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_accordion.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_accordion.test.tsx.snap new file mode 100644 index 000000000..66a902235 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_accordion.test.tsx.snap @@ -0,0 +1,5890 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Visualization field components Renders fields accordion 1`] = ` + + + + Available fields + + + } + extraAction={ + + 20 + + } + id="3367" + initialIsOpen={false} + isLoading={false} + isLoadingMessage={false} + paddingSize="none" + > +
+
+ +
+ + + 20 + + +
+
+
+ +
+
+ +
+ +
+ + + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + bytes + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + clientip + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + event + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + extension + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + geo + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + host + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + index + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + ip + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + machine + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + memory + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + message + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + phpmemory + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + referer + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + request + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + response + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + tags + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + timestamp + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + url + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + utc_time + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + +
+
+
+ +
+
+ + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_item.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_item.test.tsx.snap new file mode 100644 index 000000000..221fe7cdf --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_item.test.tsx.snap @@ -0,0 +1,288 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Visualization field components Renders field item component 1`] = ` + + + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + /> + + } + className="lnsFieldItem__popoverAnchor" + closePopover={[Function]} + data-test-subj="lnsFieldListPanelField" + display="block" + hasArrow={true} + isOpen={false} + ownFocus={true} + panelClassName="lnsFieldItem__fieldPanel" + panelPaddingSize="m" + > + +
+
+ + + + } + fieldInfoIcon={ + + } + fieldName={ + + agent + + } + isActive={false} + onClick={[Function]} + onDragEnd={[Function]} + onDragLeave={[Function]} + onDragOver={[Function]} + onDragStart={[Function]} + onDrop={[Function]} + > +
+ +
+ + + +
+
+ + + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_list.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_list.test.tsx.snap new file mode 100644 index 000000000..024db81a7 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/field_list.test.tsx.snap @@ -0,0 +1,234 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Visualization field components Renders field list component 1`] = ` + +
+
+ + + + Available fields + + + } + extraAction={ + + 0 + + } + id="3327" + initialIsOpen={false} + isLoading={false} + isLoadingMessage={false} + paddingSize="none" + > +
+
+ +
+ + + 0 + + +
+
+
+ +
+
+ +
+ +
+
+
+ +
+
+ + +
+
+ +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/lens_field_icon.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/lens_field_icon.test.tsx.snap new file mode 100644 index 000000000..e6d98be81 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/lens_field_icon.test.tsx.snap @@ -0,0 +1,55 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Visualization field components Renders field list component 1`] = ` + + + + + + + + + + + + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx new file mode 100644 index 000000000..1b0cec4dd --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx @@ -0,0 +1,45 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { DataPanel } from '../datapanel'; +import { + SELECTED_FIELDS, + AVAILABLE_FIELDS, + UNSELECTED_FIELDS, + QUERIED_FIELDS +} from '../../../../../common/constants/explorer'; +import { + AVAILABLE_FIELDS as SIDEBAR_AVAILABLE_FIELDS, + QUERY_FIELDS +} from '../../../../../test/event_analytics_constants'; + +describe('No result component', () => { + configure({ adapter: new Adapter() }); + + const explorerFields = { + [SELECTED_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, + [QUERIED_FIELDS]: QUERY_FIELDS + }; + it('Renders No result component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/field_accordion.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_accordion.test.tsx new file mode 100644 index 000000000..1e2ed85cd --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_accordion.test.tsx @@ -0,0 +1,36 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { FieldsAccordion } from '../fields_accordion'; +import { + AVAILABLE_FIELDS +} from '../../../../../test/event_analytics_constants'; + +describe('Visualization field components', () => { + configure({ adapter: new Adapter() }); + + it('Renders fields accordion', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/field_item.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_item.test.tsx new file mode 100644 index 000000000..03b4db9a9 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_item.test.tsx @@ -0,0 +1,36 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { FieldItem } from '../field_item'; +import { + AVAILABLE_FIELDS +} from '../../../../../test/event_analytics_constants'; + +describe('Visualization field components', () => { + configure({ adapter: new Adapter() }); + + it('Renders field item component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx new file mode 100644 index 000000000..8b8f8f3c0 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx @@ -0,0 +1,33 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { FieldList } from '../fieldList'; +import { + AVAILABLE_FIELDS +} from '../../../../../test/event_analytics_constants'; + +describe('Visualization field components', () => { + configure({ adapter: new Adapter() }); + + it('Renders field list component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx new file mode 100644 index 000000000..4a7dc5823 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx @@ -0,0 +1,29 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { LensFieldIcon } from '../lens_field_icon'; + +describe('Visualization field components', () => { + configure({ adapter: new Adapter() }); + + it('Renders field list component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/__snapshots__/assets.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/__snapshots__/assets.test.tsx.snap new file mode 100644 index 000000000..c1e1bd73a --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/__snapshots__/assets.test.tsx.snap @@ -0,0 +1,64 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Assets components Renders bar component 1`] = ` + + + + + + +`; + +exports[`Assets components Renders bar horizontal component 1`] = ` + + + + + + +`; + +exports[`Assets components Renders line component 1`] = ` + + + + + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/assets.test.tsx b/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/assets.test.tsx new file mode 100644 index 000000000..7559ec48a --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/assets/__tests__/assets.test.tsx @@ -0,0 +1,57 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { LensIconChartBar } from '../chart_bar'; +import { LensIconChartBarHorizontal } from '../chart_bar_horizontal'; +import { LensIconChartLine } from '../chart_line'; +import { EuiIconLegend } from '../legend'; + + +describe('Assets components', () => { + configure({ adapter: new Adapter() }); + + it('Renders bar component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders bar horizontal component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders line component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/assets/legend.tsx b/dashboards-observability/public/components/explorer/visualizations/assets/legend.tsx deleted file mode 100644 index caee9b6fe..000000000 --- a/dashboards-observability/public/components/explorer/visualizations/assets/legend.tsx +++ /dev/null @@ -1,38 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import * as React from 'react'; - -export const EuiIconLegend = ({ title, titleId, ...props }: { title: string; titleId: string }) => ( - - {title ? {title} : null} - - - - - - - -); diff --git a/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap new file mode 100644 index 000000000..319bdb828 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/__snapshots__/config_panel.test.tsx.snap @@ -0,0 +1,3666 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Config panel component Renders config panel wrapper component with fields 1`] = ` + + + , + "id": "setting-panel", + "name": "Settings", + }, + ] + } + > +
+ +
+ + + +
+ +
+ + +
+
+ + +
+ +

+ X-axis +

+ + +
+ + +
+ + +
+
+
+ + + agent + + + +
+ +
+
+ +
+ +
+ + + + + + + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+ +

+ Y-axis +

+ + +
+ + +
+ + +
+
+
+

+ Select a field +

+ +
+ +
+
+ +
+ +
+ + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+
+ + + +`; + +exports[`Config panel component Renders empty config panel wrapper component 1`] = ` + + + , + "id": "setting-panel", + "name": "Settings", + }, + ] + } + > +
+ +
+ + + +
+ +
+ + +
+
+ + +
+ +

+ X-axis +

+ + +
+ + +
+ + +
+
+
+

+ Select a field +

+ +
+ +
+
+ +
+ +
+ + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+ +

+ Y-axis +

+ + +
+ + +
+ + +
+
+
+

+ Select a field +

+ +
+ +
+
+ +
+ +
+ + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+
+ + + +`; + +exports[`Config panel component Renders panel item component 1`] = ` + + + , + "id": "setting-panel", + "name": "Settings", + }, + ] + } + > +
+ +
+ + + +
+ +
+ + +
+
+ + +
+ +

+ X-axis +

+ + +
+ + +
+ + +
+
+
+ + + agent + + + +
+ +
+
+ +
+ +
+ + + + + + + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+ +

+ Y-axis +

+ + +
+ + +
+ + +
+
+
+

+ Select a field +

+ +
+ +
+
+ +
+ +
+ + + +
+ +
+
+ + +
+ + +
+ + +
+
+ +
+
+ +
+
+ +
+ here goes advanced setting +
+ +
+
+ +
+
+ +
+ + + +
+ +
+
+ + +
+
+ + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/config_panel.test.tsx b/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/config_panel.test.tsx new file mode 100644 index 000000000..9e46476aa --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/config_panel/__tests__/config_panel.test.tsx @@ -0,0 +1,81 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { ConfigPanelWrapper } from '../config_panel'; +import { + SELECTED_FIELDS, + AVAILABLE_FIELDS, + UNSELECTED_FIELDS, + QUERIED_FIELDS +} from '../../../../../../common/constants/explorer'; +import { + AVAILABLE_FIELDS as SIDEBAR_AVAILABLE_FIELDS, + QUERY_FIELDS +} from '../../../../../../test/event_analytics_constants'; + +describe('Config panel component', () => { + configure({ adapter: new Adapter() }); + + it('Renders empty config panel wrapper component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders config panel wrapper component with fields', async () => { + + const explorerFields = { + [SELECTED_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, + [QUERIED_FIELDS]: QUERY_FIELDS + }; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders panel item component', async () => { + + const explorerFields = { + [SELECTED_FIELDS]: [], + [UNSELECTED_FIELDS]: [], + [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, + [QUERIED_FIELDS]: QUERY_FIELDS + }; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap new file mode 100644 index 000000000..92078d77b --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap @@ -0,0 +1,48 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`No result component Renders count distribution component with data 1`] = ` + +`; + +exports[`No result component Renders empty count distribution component 1`] = ``; diff --git a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx new file mode 100644 index 000000000..7180e5e85 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx @@ -0,0 +1,43 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { CountDistribution } from '../count_distribution'; +import { SAMPLE_VISUALIZATIONS } from '../../../../../../test/event_analytics_constants'; + +describe('No result component', () => { + configure({ adapter: new Adapter() }); + + it('Renders empty count distribution component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders count distribution component with data', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap new file mode 100644 index 000000000..7fc0731ee --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap @@ -0,0 +1,198 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Shared components Renders empty placeholder component 1`] = ` + + +
+ +
+ +
+ + + + + + + + + +
+ +

+ + + No results found + + +

+
+ +
+ +
+ + +`; + +exports[`Shared components Renders tool bar button component 1`] = ` + + + + + + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/shared_components.test.tsx b/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/shared_components.test.tsx new file mode 100644 index 000000000..4871839ec --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/shared_components/__tests__/shared_components.test.tsx @@ -0,0 +1,52 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { EmptyPlaceholder } from '../empty_placeholder'; +import { LensIconChartBar } from '../../assets/chart_bar'; +import { ToolbarButton } from '../toolbar_button'; + +describe('Shared components', () => { + configure({ adapter: new Adapter() }); + + it('Renders empty placeholder component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders tool bar button component', async () => { + + const handleClick = jest.fn(); + const WrappedComponent = () =>
testing
; + + const wrapper = mount( + + + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/shared_components/index.ts b/dashboards-observability/public/components/explorer/visualizations/shared_components/index.ts index 9e5a2eace..dfbd82f35 100644 --- a/dashboards-observability/public/components/explorer/visualizations/shared_components/index.ts +++ b/dashboards-observability/public/components/explorer/visualizations/shared_components/index.ts @@ -6,4 +6,3 @@ export * from './empty_placeholder'; export { ToolbarPopoverProps, ToolbarPopover } from './toolbar_popover'; export { ToolbarButtonProps, ToolbarButton } from './toolbar_button'; -export { LegendSettingsPopover } from './legend_settings_popover'; diff --git a/dashboards-observability/public/components/explorer/visualizations/shared_components/legend_settings_popover.tsx b/dashboards-observability/public/components/explorer/visualizations/shared_components/legend_settings_popover.tsx deleted file mode 100644 index 1ef54f635..000000000 --- a/dashboards-observability/public/components/explorer/visualizations/shared_components/legend_settings_popover.tsx +++ /dev/null @@ -1,158 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import React from 'react'; -import { i18n } from '@kbn/i18n'; -import { EuiFormRow, EuiButtonGroup, EuiSwitch, EuiSwitchEvent } from '@elastic/eui'; -import { Position } from '@elastic/charts'; -import { ToolbarPopover } from '../shared_components'; - -export interface LegendSettingsPopoverProps { - /** - * Determines the legend display options - */ - legendOptions: Array<{ id: string; value: 'auto' | 'show' | 'hide' | 'default'; label: string }>; - /** - * Determines the legend mode - */ - mode: 'default' | 'show' | 'hide' | 'auto'; - /** - * Callback on display option change - */ - onDisplayChange: (id: string) => void; - /** - * Sets the legend position - */ - position?: Position; - /** - * Callback on position option change - */ - onPositionChange: (id: string) => void; - /** - * If true, nested legend switch is rendered - */ - renderNestedLegendSwitch?: boolean; - /** - * nested legend switch status - */ - nestedLegend?: boolean; - /** - * Callback on nested switch status change - */ - onNestedLegendChange?: (event: EuiSwitchEvent) => void; -} - -const toggleButtonsIcons = [ - { - id: Position.Bottom, - label: i18n.translate('xpack.lens.shared.legendPositionBottom', { - defaultMessage: 'Bottom', - }), - iconType: 'arrowDown', - }, - { - id: Position.Left, - label: i18n.translate('xpack.lens.shared.legendPositionLeft', { - defaultMessage: 'Left', - }), - iconType: 'arrowLeft', - }, - { - id: Position.Right, - label: i18n.translate('xpack.lens.shared.legendPositionRight', { - defaultMessage: 'Right', - }), - iconType: 'arrowRight', - }, - { - id: Position.Top, - label: i18n.translate('xpack.lens.shared.legendPositionTop', { - defaultMessage: 'Top', - }), - iconType: 'arrowUp', - }, -]; - -export const LegendSettingsPopover: React.FunctionComponent = ({ - legendOptions, - mode, - onDisplayChange, - position, - onPositionChange, - renderNestedLegendSwitch, - nestedLegend, - onNestedLegendChange = () => {}, -}) => { - return ( - - - value === mode)!.id} - onChange={onDisplayChange} - /> - - - - - {renderNestedLegendSwitch && ( - - - - )} - - ); -}; diff --git a/dashboards-observability/public/components/explorer/visualizations/shared_components/toolbar_popover.tsx b/dashboards-observability/public/components/explorer/visualizations/shared_components/toolbar_popover.tsx deleted file mode 100644 index 4d2c7527c..000000000 --- a/dashboards-observability/public/components/explorer/visualizations/shared_components/toolbar_popover.tsx +++ /dev/null @@ -1,81 +0,0 @@ -/* - * Copyright OpenSearch Contributors - * SPDX-License-Identifier: Apache-2.0 - */ - -import React, { useState } from 'react'; -import { EuiFlexItem, EuiPopover, EuiIcon, EuiPopoverTitle, IconType } from '@elastic/eui'; -import { ToolbarButton, ToolbarButtonProps } from './toolbar_button'; -import { EuiIconLegend } from '../assets/legend'; - -const typeToIconMap: { [type: string]: string | IconType } = { - legend: EuiIconLegend as IconType, - values: 'visText', -}; - -export interface ToolbarPopoverProps { - /** - * Determines popover title - */ - title: string; - /** - * Determines the button icon - */ - type: 'legend' | 'values' | IconType; - /** - * Determines if the popover is disabled - */ - isDisabled?: boolean; - /** - * Button group position - */ - groupPosition?: ToolbarButtonProps['groupPosition']; - buttonDataTestSubj?: string; -} - -export const ToolbarPopover: React.FunctionComponent = ({ - children, - title, - type, - isDisabled = false, - groupPosition, - buttonDataTestSubj, -}) => { - const [open, setOpen] = useState(false); - - const iconType: string | IconType = typeof type === 'string' ? typeToIconMap[type] : type; - - return ( - - { - setOpen(!open); - }} - title={title} - hasArrow={false} - isDisabled={isDisabled} - groupPosition={groupPosition} - dataTestSubj={buttonDataTestSubj} - > - { title } - - - } - isOpen={open} - closePopover={() => { - setOpen(false); - }} - anchorPosition="downRight" - > - {title} - {children} - - - ); -}; diff --git a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap new file mode 100644 index 000000000..36004c00b --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap @@ -0,0 +1,1725 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Visualization chart switch components Renders workspace with bar component 1`] = ` + +
+ + + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +`; + +exports[`Visualization chart switch components Renders workspace with horionzontal bar component 1`] = ` + +
+ + + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +`; + +exports[`Visualization chart switch components Renders workspace with line bar component 1`] = ` + +
+ + + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +`; + +exports[`Visualization workspace panel Renders workspace panel 1`] = ` + + , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + } + } + visualizationTypes={ + Array [ + Object { + "chart": , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + }, + Object { + "chart": , + "fullLabel": "H. Bar", + "icon": [Function], + "id": "horizontal_bar", + "label": "H. Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-horizontal-bar-2", + }, + Object { + "chart": , + "fullLabel": "Line", + "icon": [Function], + "id": "line", + "label": "Line", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-line-3", + }, + ] + } + > +
+ +
+ +
+ , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + } + } + visualizationTypes={ + Array [ + Object { + "chart": , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + }, + Object { + "chart": , + "fullLabel": "H. Bar", + "icon": [Function], + "id": "horizontal_bar", + "label": "H. Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-horizontal-bar-2", + }, + Object { + "chart": , + "fullLabel": "Line", + "icon": [Function], + "id": "line", + "label": "Line", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-line-3", + }, + ] + } + > +
+ + + } + fullLabel="Bar" + icon={[Function]} + id="bar" + label="Bar" + selection={ + Object { + "dataLoss": "nothing", + } + } + visualizationId="vis-bar-1" + /> + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +
+ +
+ +
+ + +
+ +
+ + +
+ + +
+ +
+ +
+ + + + + + + + + +
+ +

+ + + No results found + + +

+
+ +
+ +
+ + +
+ + +
+ +
+ + + + +`; + +exports[`Visualization workspace panel wrapper Renders workspace panel wrapper 1`] = ` + +
+ +
+ +
+ +
+ + + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +
+ +
+ +
+ + +
+ +
+ +
+ + + +`; diff --git a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/workspace.test.tsx b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/workspace.test.tsx new file mode 100644 index 000000000..d41e49804 --- /dev/null +++ b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/workspace.test.tsx @@ -0,0 +1,137 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import { forEach } from 'lodash'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { ChartSwitch } from '../chart_switch'; +import { Bar } from '../../../../visualizations/charts/bar'; +import { HorizontalBar } from '../../../../visualizations/charts/horizontal_bar' +import { Line } from '../../../../visualizations/charts/line'; +import { LensIconChartBar } from '../../assets/chart_bar'; +import { LensIconChartBarHorizontal } from '../../assets/chart_bar_horizontal'; +import { LensIconChartLine } from '../../assets/chart_line'; +import { + VISUALIZATION_TYPES, + SAMPLE_VISUALIZATIONS +} from '../../../../../../test/event_analytics_constants'; +import { WorkspacePanel } from '../workspace_panel'; +import { WorkspacePanelWrapper } from '../workspace_panel_wrapper'; + +const attachVisualizationComponents = () => { + VISUALIZATION_TYPES[0]['chart'] = () => ; + VISUALIZATION_TYPES[0]['icon'] = () => ; + VISUALIZATION_TYPES[1]['chart'] = () => ; + VISUALIZATION_TYPES[1]['icon'] = () => ; + VISUALIZATION_TYPES[2]['chart'] = () => ; + VISUALIZATION_TYPES[2]['icon'] = () => ; +}; + +describe('Visualization chart switch components', () => { + configure({ adapter: new Adapter() }); + beforeAll(() => { + attachVisualizationComponents(); + }); + + it('Renders workspace with bar component', async () => { + + const setVis = jest.fn(); + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders workspace with horionzontal bar component', async () => { + + const setVis = jest.fn(); + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); + + it('Renders workspace with line bar component', async () => { + + const setVis = jest.fn(); + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); + +describe('Visualization workspace panel', () => { + it('Renders workspace panel', async () => { + + const setCurVisId = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); + +describe('Visualization workspace panel wrapper', () => { + it('Renders workspace panel wrapper', async () => { + + const setVis = jest.fn(); + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx index 01bfc6e1b..6fd0b3ac0 100644 --- a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx +++ b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx @@ -41,9 +41,6 @@ interface IWorkSpacePanel { curVisId: string; setCurVisId: any; visualizations: any; - savedObjects: SavedObjects; - onSaveVisualization: any; - getSavedObjects: any; } export function WorkspacePanel({ diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/bar.test.tsx b/dashboards-observability/public/components/visualizations/charts/__tests__/bar.test.tsx new file mode 100644 index 000000000..d56af8afe --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/bar.test.tsx @@ -0,0 +1,36 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { Bar } from '../bar'; +import { + LAYOUT_CONFIG, + SAMPLE_VISUALIZATIONS +} from '../../../../../test/event_analytics_constants'; + +describe('Bar component', () => { + configure({ adapter: new Adapter() }); + + it('Renders bar component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/horizontal_bar.test.tsx b/dashboards-observability/public/components/visualizations/charts/__tests__/horizontal_bar.test.tsx new file mode 100644 index 000000000..a3ae0a5e1 --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/horizontal_bar.test.tsx @@ -0,0 +1,36 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { HorizontalBar } from '../horizontal_bar'; +import { + LAYOUT_CONFIG, + SAMPLE_VISUALIZATIONS +} from '../../../../../test/event_analytics_constants'; + +describe('Horizontal bar component', () => { + configure({ adapter: new Adapter() }); + + it('Renders horizontal bar component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/line.test.tsx b/dashboards-observability/public/components/visualizations/charts/__tests__/line.test.tsx new file mode 100644 index 000000000..8a4c3515e --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/line.test.tsx @@ -0,0 +1,36 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { Line } from '../line'; +import { + LAYOUT_CONFIG, + SAMPLE_VISUALIZATIONS +} from '../../../../../test/event_analytics_constants'; + +describe('Line component', () => { + configure({ adapter: new Adapter() }); + + it('Renders line component', async () => { + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx b/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx new file mode 100644 index 000000000..c4d4f57cc --- /dev/null +++ b/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx @@ -0,0 +1,73 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { waitFor } from '@testing-library/react'; +import { Plt } from '../plot'; +import { + LAYOUT_CONFIG, + SAMPLE_VISUALIZATIONS, +} from '../../../../../test/event_analytics_constants'; +import { LONG_CHART_COLOR } from '../../../../../common/constants/shared'; + +describe('Ploty base component', () => { + configure({ adapter: new Adapter() }); + + it('Renders Ploty base component', async () => { + + const barValues = [{ + displaylogo: false, + marker: { + color: [ + "#3CA1C7", + "#8C55A3", + "#DB748A", + "#F2BE4B" + ] + }, + name: "avg(FlightDelayMin)", + responsive: true, + type: 'bar', + x: [ + "JetBeats", + "Logstash Airways", + "OpenSearch Dashboards Airlines", + "OpenSearch-Air" + ], + y: [ + 45.957544288332315, + 49.55268688081657, + 46.368274582560296, + 47.41304347826087 + ] + }]; + + const wrapper = mount( + + ); + + wrapper.update(); + + await waitFor(() => { + expect(wrapper).toMatchSnapshot(); + }); + }); +}); \ No newline at end of file diff --git a/dashboards-observability/test/event_analytics_constants.ts b/dashboards-observability/test/event_analytics_constants.ts new file mode 100644 index 000000000..5dc367a73 --- /dev/null +++ b/dashboards-observability/test/event_analytics_constants.ts @@ -0,0 +1,470 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { LONG_CHART_COLOR } from '../common/constants/shared'; + +export const AVAILABLE_FIELDS = [ + { + name: 'agent', + type: 'string' + }, + { + name: 'bytes', + type: 'long' + }, + { + name: 'clientip', + type: 'ip' + }, + { + name: 'event', + type: 'struct' + }, + { + name: 'extension', + type: 'string' + }, + { + name: 'geo', + type: 'struct' + }, + { + name: 'host', + type: 'string' + }, + { + name: 'index', + type: 'string' + }, + { + name: 'ip', + type: 'ip' + }, + { + name: 'machine', + type: 'struct' + }, + { + name: 'memory', + type: 'double' + }, + { + name: 'message', + type: 'string' + }, + { + name: 'phpmemory', + type: 'long' + }, + { + name: 'referer', + type: 'string' + }, + { + name: 'request', + type: 'string' + }, + { + name: 'response', + type: 'string' + }, + { + name: 'tags', + type: 'string' + }, + { + name: 'timestamp', + type: 'timestamp' + }, + { + name: 'url', + type: 'string' + }, + { + name: 'utc_time', + type: 'timestamp' + } +]; + +export const QUERY_FIELDS = [ + { + name: 'double_per_ip_bytes', + type: 'long' + }, + { + name: 'host', + type: 'text' + }, + { + name: 'ip_count', + type: 'integer' + }, + { + name: 'per_ip_bytes', + type: 'long' + }, + { + name: 'resp_code', + type: 'text' + }, + { + name: 'sum_bytes', + type: 'long' + } +]; + +export const JSON_DATA = [ + { + ip_count: 176, + sum_bytes: 1021420, + host: 'artifacts.opensearch.org', + resp_code: '404', + per_ip_bytes: 5803, + double_per_ip_bytes: 11606 + }, + { + ip_count: 111, + sum_bytes: 560638, + host: 'www.opensearch.org', + resp_code: '404', + per_ip_bytes: 5050, + double_per_ip_bytes: 10100 + }, + { + ip_count: 94, + sum_bytes: 0, + host: 'artifacts.opensearch.org', + resp_code: '503', + per_ip_bytes: 0, + double_per_ip_bytes: 0 + }, + { + ip_count: 78, + sum_bytes: 0, + host: 'www.opensearch.org', + resp_code: '503', + per_ip_bytes: 0, + double_per_ip_bytes: 0 + }, + { + ip_count: 43, + sum_bytes: 247840, + host: 'cdn.opensearch-opensearch-opensearch.org', + resp_code: '404', + per_ip_bytes: 5763, + double_per_ip_bytes: 11526 + }, + { + ip_count: 34, + sum_bytes: 0, + host: 'cdn.opensearch-opensearch-opensearch.org', + resp_code: '503', + per_ip_bytes: 0, + double_per_ip_bytes: 0 + }, + { + ip_count: 13, + sum_bytes: 57735, + host: 'opensearch-opensearch-opensearch.org', + resp_code: '404', + per_ip_bytes: 4441, + double_per_ip_bytes: 8882 + }, + { + ip_count: 6, + sum_bytes: 0, + host: 'opensearch-opensearch-opensearch.org', + resp_code: '503', + per_ip_bytes: 0, + double_per_ip_bytes: 0 + } +]; + +export const JSON_DATA_ALL = [ + { + referer: 'http://twitter.com/success/wendy-lawrence', + request: '/opensearch/opensearch-1.0.0.deb', + agent: 'Mozilla/5.0 (X11; Linux x86_64; rv:6.0a1) Gecko/20110421 Firefox/6.0a1', + extension: 'deb', + memory: 'null', + geo: '{"srcdest":"IN:US","src":"IN","coordinates":{"lat":39.41042861,"lon":-88.8454325},"dest":"US"}', + utc_time: '2021-11-14 00:39:02.912', + clientip: '223.87.60.27', + host: 'artifacts.opensearch.org', + event: '{"dataset":"sample_web_logs"}', + phpmemory: 'null', + timestamp: '2021-11-14 00:39:02.912', + ip: '223.87.60.27', + index: 'opensearch_dashboards_sample_data_logs', + message: '223.87.60.27 - - [2018-07-22T00:39:02.912Z] "GET /opensearch/opensearch-1.0.0.deb_1 HTTP/1.1" 200 6219 "-" "Mozilla/5.0 (X11; Linux x86_64; rv:6.0a1) Gecko/20110421 Firefox/6.0a1"', + url: 'https://artifacts.opensearch.org/downloads/opensearch/opensearch-1.0.0.deb_1', + tags: 'success', + bytes: 6219, + machine: '{"os":"win 8","ram":8589934592}', + response: '200' + }, + { + referer: 'http://www.opensearch-opensearch-opensearch.com/success/james-mcdivitt', + request: '/beats/metricbeat', + agent: 'Mozilla/5.0 (X11; Linux x86_64; rv:6.0a1) Gecko/20110421 Firefox/6.0a1', + extension: '', + memory: 'null', + geo: '{"srcdest":"JP:IN","src":"JP","coordinates":{"lat":38.58338806,"lon":-86.46248778},"dest":"IN"}', + utc_time: '2021-11-14 03:26:21.326', + clientip: '130.246.123.197', + host: 'www.opensearch.org', + event: '{"dataset":"sample_web_logs"}', + phpmemory: 'null', + timestamp: '2021-11-14 03:26:21.326', + ip: '130.246.123.197', + index: 'opensearch_dashboards_sample_data_logs', + message: '130.246.123.197 - - [2018-07-22T03:26:21.326Z] "GET /beats/metricbeat_1 HTTP/1.1" 200 6850 "-" "Mozilla/5.0 (X11; Linux x86_64; rv:6.0a1) Gecko/20110421 Firefox/6.0a1"', + url: 'https://www.opensearch.org/downloads/beats/metricbeat_1', + tags: 'success', + bytes: 6850, + machine: '{"os":"win 8","ram":3221225472}', + response: '200', + }, + { + referer: 'http://twitter.com/success/konstantin-feoktistov', + request: '/styles/main.css', + agent: 'Mozilla/5.0 (X11; Linux i686) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.50 Safari/534.24', + extension: 'css', + memory: 'null', + geo: '{"srcdest":"CO:DE","src":"CO","coordinates":{"lat":36.96015,"lon":-78.18499861},"dest":"DE"}', + utc_time: '2021-11-14 03:30:25.131', + clientip: '120.49.143.213', + host: 'cdn.opensearch-opensearch-opensearch.org', + event: '{"dataset":"sample_web_logs"}', + phpmemory: 'null', + timestamp: '2021-11-14 03:30:25.131', + ip: '120.49.143.213', + index: 'opensearch_dashboards_sample_data_logs', + message: '120.49.143.213 - - [2018-07-22T03:30:25.131Z] "GET /styles/main.css_1 HTTP/1.1" 503 0 "-" "Mozilla/5.0 (X11; Linux i686) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.50 Safari/534.24"', + url: 'https://cdn.opensearch-opensearch-opensearch.org/styles/main.css_1', + tags: 'success', + bytes: 0, + machine: '{"os":"ios","ram":20401094656}', + response: '503' + }, +]; + +export const AGENT_FIELD = { + name: 'agent', + type: 'string' +}; + +export const SAVED_HISTORIES = [ + { + createdTimeMs: '1638901792922', + lastUpdatedTimeMs: '1638901792922', + objectId: 'Kocoln0BYMuJGDsOwDma', + savedVisualization: { + description: '', + name: 'Mock Flight count by destination save to panel', + query: 'source = opensearch_dashboards_sample_data_flights | stats avg(FlightDelayMin) by Carrier', + type: 'bar', + selected_date_range: { + end: 'now', + start: 'now-15m', + text: '' + }, + selected_fields: { + text: '', + tokens: [] + }, + selected_timestamp: { + name: 'timestamp', + type: 'timestamp' + } + }, + tenant: '', + }, + { + createdTimeMs: '1638901777572', + lastUpdatedTimeMs: '1638901777572', + objectId: 'KIcoln0BYMuJGDsOhDmk', + savedVisualization: { + description: '', + name: 'Mock Flight count by destination', + query: 'source = opensearch_dashboards_sample_data_flights | stats avg(FlightDelayMin) by Carrier', + type: 'bar', + selected_date_range: { + end: 'now', + start: 'now-15m', + text: '' + }, + selected_fields: { + text: '', + tokens: [] + }, + selected_timestamp: { + name: 'timestamp', + type: 'timestamp' + } + }, + tenant: '', + } +]; + +export const SELECTED_PANELS_OPTIONS = [ + { + label: '[Logs] Web traffic Panel', + panel: { + dateCreated: 1637781403888, + dateModified: 1637781403888, + id: 'uRZgU30B661cwDZT-ILw', + name: '[Logs] Web traffic Panel' + }, + }, + { + label: '[Logs] Web traffic Panel 2', + panel: { + dateCreated: 1637781403888, + dateModified: 1637781403888, + id: 'uRZgU30B661cwDZT-ILw', + name: '[Logs] Web traffic Panel' + }, + } +]; + +export const DATA_GRID_ROWS = [ + { + AvgTicketPrice: 841.2656, + Cancelled: 'false', + Carrier: 'OpenSearch Dashboards Airlines', + Dest: 'Sydney Kingsford Smith International Airport', + DestAirportID: 'SYD', + DestCityName: 'Sydney', + DestCountry: 'AU', + DestLocation: '{\"lat\":-33.94609833,\"lon\":151.177002}', + DestRegion: 'SE-BD', + DestWeather: "Rain", + DistanceKilometers: 16492.326, + DistanceMiles: 10247.856, + FlightDelay: 'false', + FlightDelayMin: 0, + FlightDelayType: 'No Delay', + FlightNum: '9HY9SWR', + FlightTimeHour: '17.179506930998397', + FlightTimeMin: 1030.7704, + Origin: 'Frankfurt am Main Airport', + OriginAirportID: "FRA", + OriginCityName: 'Frankfurt am Main', + OriginCountry: 'DE', + OriginLocation: '{\"lat\":50.033333,\"lon\":8.570556}', + OriginRegion: 'DE-HE', + OriginWeather: 'Sunny', + dayOfWeek: 0, + timestamp: "2021-05-24 00:00:00" + }, + { + AvgTicketPrice: 882.98267, + Cancelled: 'false', + Carrier: 'Logstash Airways', + Dest: 'Venice Marco Polo Airport', + DestAirportID: 'VE05', + DestCityName: 'Venice', + DestCountry: 'IT', + DestLocation: '{\"lat\":45.505299,\"lon\":12.3519}', + DestRegion: 'IT-34', + DestWeather: "Sunny", + DistanceKilometers: 8823.4, + DistanceMiles: 5482.6064, + FlightDelay: 'false', + FlightDelayMin: 0, + FlightDelayType: 'No Delay', + FlightNum: 'X98CCZO', + FlightTimeHour: '7.73982468459836', + FlightTimeMin: 464.3895, + Origin: 'Cape Town International Airport', + OriginAirportID: "CPT", + OriginCityName: 'Cape Town', + OriginCountry: 'ZA', + OriginLocation: '{\"lat\":-33.96480179,\"lon\":18.60169983}', + OriginRegion: 'SE-BD', + OriginWeather: 'Clear', + dayOfWeek: 0, + timestamp: "2021-05-24 18:27:00" + } +]; + +export const SAMPLE_VISUALIZATIONS = { + 'count()': [2549, 9337, 1173], + 'span(timestamp,1M)': [ + '2021-05-01 00:00:00', + '2021-06-01 00:00:00', + '2021-07-01 00:00:00' + ], + jsonData: [ + { + 'count()': 2549, + 'span(timestamp,1M)': '2021-05-01 00:00:00' + }, + { + 'count()': 9337, + 'span(timestamp,1M)': '2021-06-01 00:00:00' + }, + { + 'count()': 2549, + 'span(timestamp,1M)': '2021-07-01 00:00:00' + } + ], + metadata: { + fields: [ + { + name: 'count()', + type: 'integer' + }, + { + name: 'span(timestamp,1M)', + type: 'timestamp' + } + ] + } +}; + +export const VISUALIZATION_TYPES = [ + { + fullLabel: 'Bar', + id: 'bar', + label: 'bar', + selection: { + dataLoss: 'nothing' + }, + visualizationId: 'vis-bar-6636' + }, + { + fullLabel: 'H. Bar', + id: 'horizontal_bar', + label: 'H. Bar', + selection: { + dataLoss: 'nothing' + }, + visualizationId: 'vis-bar-6637' + }, + { + fullLabel: 'Line', + id: 'line', + label: 'line', + selection: { + dataLoss: 'nothing' + }, + visualizationId: 'vis-bar-6638' + } +]; + +export const LAYOUT_CONFIG = { + showlegend: true, + margin: { + l: 60, + r: 10, + b: 15, + t: 30, + pad: 0, + }, + height: 220, + colorway: [LONG_CHART_COLOR], +}; \ No newline at end of file From d409d840c127616d9ba24698193ec3b572f7a03e Mon Sep 17 00:00:00 2001 From: Eric Wei Date: Tue, 14 Dec 2021 10:42:35 -0800 Subject: [PATCH 2/4] updated some snapshots Signed-off-by: Eric Wei --- .../__snapshots__/plotly.test.tsx.snap | 317 ++++++++++++++++++ 1 file changed, 317 insertions(+) create mode 100644 dashboards-observability/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap diff --git a/dashboards-observability/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap b/dashboards-observability/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap new file mode 100644 index 000000000..a426dfc52 --- /dev/null +++ b/dashboards-observability/public/components/visualizations/plotly/__tests__/__snapshots__/plotly.test.tsx.snap @@ -0,0 +1,317 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Ploty base component Renders Ploty base component 1`] = ` + + +
+ + +`; + +exports[`Ploty base component Renders Ploty base component 2`] = ` + + +
+ + +`; From 9ad8772be451c7cb51da842d1003cf29fba4b12f Mon Sep 17 00:00:00 2001 From: Eric Wei Date: Tue, 14 Dec 2021 11:02:33 -0800 Subject: [PATCH 3/4] resolved few failing tests Signed-off-by: Eric Wei --- .../count_distribution.test.tsx.snap | 457 +++- .../__tests__/count_distribution.test.tsx | 2 +- .../__snapshots__/workspace.test.tsx.snap | 2378 ++++++++++++++++- .../test/event_analytics_constants.ts | 14 +- 4 files changed, 2721 insertions(+), 130 deletions(-) diff --git a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap index 92078d77b..19230150b 100644 --- a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap +++ b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/__snapshots__/count_distribution.test.tsx.snap @@ -1,14 +1,21 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`No result component Renders count distribution component with data 1`] = ` +exports[`Count distribution component Renders count distribution component with data 1`] = ` + + + +
+ + + + +`; + +exports[`Count distribution component Renders count distribution component with data 2`] = ` + +> + + + +
+ + + + `; -exports[`No result component Renders empty count distribution component 1`] = ``; +exports[`Count distribution component Renders empty count distribution component 1`] = ``; diff --git a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx index 7180e5e85..9ae80ea7c 100644 --- a/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx +++ b/dashboards-observability/public/components/explorer/visualizations/count_distribution/__tests__/count_distribution.test.tsx @@ -10,7 +10,7 @@ import { waitFor } from '@testing-library/react'; import { CountDistribution } from '../count_distribution'; import { SAMPLE_VISUALIZATIONS } from '../../../../../../test/event_analytics_constants'; -describe('No result component', () => { +describe('Count distribution component', () => { configure({ adapter: new Adapter() }); it('Renders empty count distribution component', async () => { diff --git a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap index 36004c00b..c02bfcabc 100644 --- a/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap +++ b/dashboards-observability/public/components/explorer/visualizations/workspace_panel/__tests__/__snapshots__/workspace.test.tsx.snap @@ -805,11 +805,1363 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` setCurVisId={[MockFunction]} visualizations={ Object { - "count()": Array [ - 2549, - 9337, - 1173, + "data": Object { + "count()": Array [ + 2549, + 9337, + 1173, + ], + "span(timestamp,1M)": Array [ + "2021-05-01 00:00:00", + "2021-06-01 00:00:00", + "2021-07-01 00:00:00", + ], + }, + "jsonData": Array [ + Object { + "count()": 2549, + "span(timestamp,1M)": "2021-05-01 00:00:00", + }, + Object { + "count()": 9337, + "span(timestamp,1M)": "2021-06-01 00:00:00", + }, + Object { + "count()": 2549, + "span(timestamp,1M)": "2021-07-01 00:00:00", + }, ], + "metadata": Object { + "fields": Array [ + Object { + "name": "count()", + "type": "integer", + }, + Object { + "name": "span(timestamp,1M)", + "type": "timestamp", + }, + ], + }, + } + } +> + , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + } + } + visualizationTypes={ + Array [ + Object { + "chart": , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + }, + Object { + "chart": , + "fullLabel": "H. Bar", + "icon": [Function], + "id": "horizontal_bar", + "label": "H. Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-horizontal-bar-2", + }, + Object { + "chart": , + "fullLabel": "Line", + "icon": [Function], + "id": "line", + "label": "Line", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-line-3", + }, + ] + } + > +
+ +
+ +
+ , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + } + } + visualizationTypes={ + Array [ + Object { + "chart": , + "fullLabel": "Bar", + "icon": [Function], + "id": "bar", + "label": "Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-bar-1", + }, + Object { + "chart": , + "fullLabel": "H. Bar", + "icon": [Function], + "id": "horizontal_bar", + "label": "H. Bar", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-horizontal-bar-2", + }, + Object { + "chart": , + "fullLabel": "Line", + "icon": [Function], + "id": "line", + "label": "Line", + "selection": Object { + "dataLoss": "nothing", + }, + "visualizationId": "vis-line-3", + }, + ] + } + > +
+ + + } + fullLabel="Bar" + icon={[Function]} + id="bar" + label="Bar" + selection={ + Object { + "dataLoss": "nothing", + } + } + visualizationId="vis-bar-1" + /> + + } + closePopover={[Function]} + display="inlineBlock" + hasArrow={true} + id="lnsChartSwitchPopover" + initialFocus=".lnsChartSwitch__popoverPanel" + isOpen={false} + ownFocus={true} + panelClassName="lnsChartSwitch__popoverPanel" + panelPaddingSize="s" + > + +
+
+ + + + + + + +
+
+ + +
+ +
+ +
+ +
+ + +
+ +
+ + +
+ + + +
+ + + +
+ + +
+ +
+ + + + +`; + +exports[`Visualization workspace panel Renders workspace panel 2`] = ` + @@ -852,8 +2199,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` title="" vis={ Object { - "chart": , "fullLabel": "Bar", "icon": [Function], @@ -868,8 +2279,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` visualizationTypes={ Array [ Object { - "chart": , "fullLabel": "Bar", "icon": [Function], @@ -881,8 +2356,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` "visualizationId": "vis-bar-1", }, Object { - "chart": , "fullLabel": "H. Bar", "icon": [Function], @@ -894,8 +2433,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` "visualizationId": "vis-horizontal-bar-2", }, Object { - "chart": , "fullLabel": "Line", "icon": [Function], @@ -932,8 +2535,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` setVis={[MockFunction]} vis={ Object { - "chart": , "fullLabel": "Bar", "icon": [Function], @@ -948,8 +2615,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` visualizationTypes={ Array [ Object { - "chart": , "fullLabel": "Bar", "icon": [Function], @@ -961,8 +2692,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` "visualizationId": "vis-bar-1", }, Object { - "chart": , "fullLabel": "H. Bar", "icon": [Function], @@ -974,8 +2769,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` "visualizationId": "vis-horizontal-bar-2", }, Object { - "chart": , "fullLabel": "Line", "icon": [Function], @@ -1002,8 +2861,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` > } fullLabel="Bar" @@ -1147,8 +3070,72 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` > } fullLabel="Bar" @@ -1260,91 +3247,260 @@ exports[`Visualization workspace panel Renders workspace panel 1`] = ` onDragStart={[Function]} onDrop={[Function]} > - - -
- -
- -
- - - - - - - - - -
- -

- - - No results found - - -

-
- -
- -
- - +
+ + +
diff --git a/dashboards-observability/test/event_analytics_constants.ts b/dashboards-observability/test/event_analytics_constants.ts index 5dc367a73..e35504e05 100644 --- a/dashboards-observability/test/event_analytics_constants.ts +++ b/dashboards-observability/test/event_analytics_constants.ts @@ -392,12 +392,14 @@ export const DATA_GRID_ROWS = [ ]; export const SAMPLE_VISUALIZATIONS = { - 'count()': [2549, 9337, 1173], - 'span(timestamp,1M)': [ - '2021-05-01 00:00:00', - '2021-06-01 00:00:00', - '2021-07-01 00:00:00' - ], + data: { + 'count()': [2549, 9337, 1173], + 'span(timestamp,1M)': [ + '2021-05-01 00:00:00', + '2021-06-01 00:00:00', + '2021-07-01 00:00:00' + ], + }, jsonData: [ { 'count()': 2549, From e2235a532b089a6bf16d7be466da5a25b546ebe7 Mon Sep 17 00:00:00 2001 From: Eric Wei Date: Tue, 14 Dec 2021 11:21:15 -0800 Subject: [PATCH 4/4] few modifications Signed-off-by: Eric Wei --- .../explorer/__tests__/explorer.test.tsx | 1 - .../json_code_block.test.tsx.snap | 2 +- .../__tests__/json_code_block.test.tsx | 4 +- .../__snapshots__/datapanel.test.tsx.snap | 2 +- .../field_accordion.test.tsx.snap | 2 +- .../__snapshots__/field_item.test.tsx.snap | 2 +- .../__snapshots__/field_list.test.tsx.snap | 2 +- .../lens_field_icon.test.tsx.snap | 2 +- .../__tests__/datapanel.test.tsx | 4 +- .../__tests__/field_accordion.test.tsx | 4 +- .../__tests__/field_item.test.tsx | 2 +- .../__tests__/field_list.test.tsx | 2 +- .../__tests__/lens_field_icon.test.tsx | 4 +- .../__snapshots__/assets.test.tsx.snap | 6 +- .../assets/__tests__/assets.test.tsx | 7 +- .../__tests__/__snapshots__/bar.test.tsx.snap | 389 ++++++++++++ .../horizontal_bar.test.tsx.snap | 567 ++++++++++++++++++ .../__snapshots__/line.test.tsx.snap | 397 ++++++++++++ .../plotly/__tests__/plotly.test.tsx | 6 +- 19 files changed, 1376 insertions(+), 29 deletions(-) create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap create mode 100644 dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap diff --git a/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx b/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx index 4c5642654..2b196a6df 100644 --- a/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx +++ b/dashboards-observability/public/components/explorer/__tests__/explorer.test.tsx @@ -7,7 +7,6 @@ import { configure, mount } from 'enzyme'; import Adapter from 'enzyme-adapter-react-16'; import React from 'react'; import { waitFor } from '@testing-library/react'; -import { useHistory } from 'react-router-dom'; import httpClientMock from '../../../../test/__mocks__/httpClientMock'; import { Explorer } from '../explorer'; import PPLService from '../../../services/requests/ppl'; diff --git a/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap index 48ca53c75..fd63e4c24 100644 --- a/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap +++ b/dashboards-observability/public/components/explorer/docTable/json_code_block/__tests__/__snapshots__/json_code_block.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Doc viewer json block component Renders json block component 1`] = ` +exports[`Doc viewer JSON block component Renders JSON block component 1`] = ` { +describe('Doc viewer JSON block component', () => { configure({ adapter: new Adapter() }); - it('Renders json block component', async () => { + it('Renders JSON block component', async () => { const hit = { 'Carrier': 'JetBeats', diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap index f5ac0cf29..3aa9e30e6 100644 --- a/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/__snapshots__/datapanel.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`No result component Renders No result component 1`] = ` +exports[`Data panel component Renders data panel component 1`] = ` diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx index 1b0cec4dd..d6f99c338 100644 --- a/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/datapanel.test.tsx @@ -19,7 +19,7 @@ import { QUERY_FIELDS } from '../../../../../test/event_analytics_constants'; -describe('No result component', () => { +describe('Data panel component', () => { configure({ adapter: new Adapter() }); const explorerFields = { @@ -28,7 +28,7 @@ describe('No result component', () => { [AVAILABLE_FIELDS]: SIDEBAR_AVAILABLE_FIELDS, [QUERIED_FIELDS]: QUERY_FIELDS }; - it('Renders No result component', async () => { + it('Renders data panel component', async () => { const wrapper = mount( { +describe('Visualization fields accordion component', () => { configure({ adapter: new Adapter() }); - it('Renders fields accordion', async () => { + it('Renders fields accordion component', async () => { const wrapper = mount( { +describe('Visualization field item component', () => { configure({ adapter: new Adapter() }); it('Renders field item component', async () => { diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx index 8b8f8f3c0..15f97b5c2 100644 --- a/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/field_list.test.tsx @@ -12,7 +12,7 @@ import { AVAILABLE_FIELDS } from '../../../../../test/event_analytics_constants'; -describe('Visualization field components', () => { +describe('Visualization field list component', () => { configure({ adapter: new Adapter() }); it('Renders field list component', async () => { diff --git a/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx b/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx index 4a7dc5823..bdc846feb 100644 --- a/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx +++ b/dashboards-observability/public/components/explorer/visualizations/__tests__/lens_field_icon.test.tsx @@ -9,10 +9,10 @@ import React from 'react'; import { waitFor } from '@testing-library/react'; import { LensFieldIcon } from '../lens_field_icon'; -describe('Visualization field components', () => { +describe('Visualization field icon component', () => { configure({ adapter: new Adapter() }); - it('Renders field list component', async () => { + it('Renders field icon component', async () => { const wrapper = mount( `; -exports[`Assets components Renders bar horizontal component 1`] = ` +exports[`Assets components Renders lens icon of horizontal bar component 1`] = ` `; -exports[`Assets components Renders line component 1`] = ` +exports[`Assets components Renders lens icon of line component 1`] = ` { configure({ adapter: new Adapter() }); - it('Renders bar component', async () => { + it('Renders lens icon of bar component', async () => { const wrapper = mount( @@ -29,7 +28,7 @@ describe('Assets components', () => { }); }); - it('Renders bar horizontal component', async () => { + it('Renders lens icon of horizontal bar component', async () => { const wrapper = mount( @@ -42,7 +41,7 @@ describe('Assets components', () => { }); }); - it('Renders line component', async () => { + it('Renders lens icon of line component', async () => { const wrapper = mount( diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap new file mode 100644 index 000000000..9a16cf5d6 --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/bar.test.tsx.snap @@ -0,0 +1,389 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Bar component Renders bar component 1`] = ` + + + +
+ + + +`; + +exports[`Bar component Renders bar component 2`] = ` + + + +
+ + + +`; diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap new file mode 100644 index 000000000..f73261fc7 --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/horizontal_bar.test.tsx.snap @@ -0,0 +1,567 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Horizontal bar component Renders horizontal bar component 1`] = ` + + + + +
+ + + + +`; + +exports[`Horizontal bar component Renders horizontal bar component 2`] = ` + + + + +
+ + + + +`; diff --git a/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap new file mode 100644 index 000000000..915d62476 --- /dev/null +++ b/dashboards-observability/public/components/visualizations/charts/__tests__/__snapshots__/line.test.tsx.snap @@ -0,0 +1,397 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Line component Renders line component 1`] = ` + + + +
+ + + +`; + +exports[`Line component Renders line component 2`] = ` + + + +
+ + + +`; diff --git a/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx b/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx index c4d4f57cc..02fab5123 100644 --- a/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx +++ b/dashboards-observability/public/components/visualizations/plotly/__tests__/plotly.test.tsx @@ -8,11 +8,7 @@ import Adapter from 'enzyme-adapter-react-16'; import React from 'react'; import { waitFor } from '@testing-library/react'; import { Plt } from '../plot'; -import { - LAYOUT_CONFIG, - SAMPLE_VISUALIZATIONS, -} from '../../../../../test/event_analytics_constants'; -import { LONG_CHART_COLOR } from '../../../../../common/constants/shared'; +import { LAYOUT_CONFIG } from '../../../../../test/event_analytics_constants'; describe('Ploty base component', () => { configure({ adapter: new Adapter() });