Event cypress tests (#611)

* Bump prismjs from 1.25.0 to 1.27.0 in /dashboards-observability (#508) (#574) Bumps [prismjs](https://github.com/PrismJS/prism) from 1.25.0 to 1.27.0. - [Release notes](https://github.com/PrismJS/prism/releases) - [Changelog](https://github.com/PrismJS/prism/blob/master/CHANGELOG.md) - [Commits](PrismJS/prism@v1.25.0...v1.27.0) --- updated-dependencies: - dependency-name: prismjs dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> (cherry picked from commit b4f491a) Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * change to support java 8 in compile and runtime (#575) (#576) Signed-off-by: Zhongnan Su <szhongna@amazon.com> (cherry picked from commit 5c43e9d) Co-authored-by: Zhongnan Su <szhongna@amazon.com> * Add 1.3.0 release notes (#580) (#582) Signed-off-by: Eugene Lee <eugenesk@amazon.com> * cypress tests Signed-off-by: Eric Wei <menwe@amazon.com> * add stashed changes and resolve intermittent failed tests Signed-off-by: Eric Wei <menwe@amazon.com> * run tests and update snapshots Signed-off-by: Eric Wei <menwe@amazon.com> * added one missed changes Signed-off-by: Eric Wei <menwe@amazon.com> * update snapshots after merging main Signed-off-by: Eric Wei <menwe@amazon.com> * added back one missing tests Signed-off-by: Eric Wei <menwe@amazon.com> * merged main and run tests Signed-off-by: Eric Wei <menwe@amazon.com> * added snapshots Signed-off-by: Eric Wei <menwe@amazon.com> Co-authored-by: opensearch-trigger-bot[bot] <98922864+opensearch-trigger-bot[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Zhongnan Su <szhongna@amazon.com>
opensearch-project · Apr 5, 2022 · 94035bb · 94035bb
1 parent 82c3d24
commit 94035bb
Show file tree

Hide file tree

Showing 14 changed files with 321 additions and 90 deletions.
diff --git a/dashboards-observability/.cypress/integration/event_analytics.spec.js b/dashboards-observability/.cypress/integration/event_analytics.spec.js
diff --git a/dashboards-observability/.cypress/utils/constants.js b/dashboards-observability/.cypress/utils/constants.js
@@ -93,25 +93,6 @@ export const PPL_QUERY_TEXT = `%ppl
 source=opensearch_dashboards_sample_data_flights
 `
 
-// event analytics
-export const TEST_QUERIES = [
-  {
-    query: 'source = opensearch_dashboards_sample_data_flights'
-  },
-  {
-    query: 'source = opensearch_dashboards_sample_data_flights | stats avg(FlightDelayMin) by Carrier'
-  },
-  {
-    query: 'source = opensearch_dashboards_sample_data_logs'
-  },
-];
-
-export const TESTING_PANEL = 'Mock Testing Panels';
-export const SAVE_QUERY1 = 'Mock Flight Events Overview';
-export const SAVE_QUERY2 = 'Mock Flight count by destination';
-export const SAVE_QUERY3 = 'Mock Flight count by destination save to panel';
-export const SAVE_QUERY4 = 'Mock Flight peek';
-
 export const supressResizeObserverIssue = () => {
   // exception is thrown on loading EuiDataGrid in cypress only, ignore for now
   cy.on('uncaught:exception', (err, runnable) => {

diff --git a/dashboards-observability/.cypress/utils/event_constants.js b/dashboards-observability/.cypress/utils/event_constants.js
@@ -0,0 +1,71 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { supressResizeObserverIssue } from './constants'
+
+export const delay = 1000;
+export const YEAR_TO_DATE_DOM_ID = '[data-test-subj="superDatePickerCommonlyUsed_Year_to date"]'
+
+export const TEST_QUERIES = [
+  {
+    query: 'source = opensearch_dashboards_sample_data_flights',
+    dateRangeDOM: YEAR_TO_DATE_DOM_ID
+  },
+  {
+    query: 'source = opensearch_dashboards_sample_data_flights | stats avg(FlightDelayMin) by Carrier'
+  },
+  {
+    query: 'source = opensearch_dashboards_sample_data_logs'
+  },
+  {
+    query: 'source = opensearch_dashboards_sample_data_logs | stats count() by host',
+    dateRangeDOM: YEAR_TO_DATE_DOM_ID
+  },
+  {
+    query: 'source = opensearch_dashboards_sample_data_logs | stats count(), avg(bytes) by host, tags',
+    dateRangeDOM: YEAR_TO_DATE_DOM_ID
+  },
+];
+
+export const TESTING_PANEL = 'Mock Testing Panels';
+export const SAVE_QUERY1 = 'Mock Flight Events Overview';
+export const SAVE_QUERY2 = 'Mock Flight count by destination';
+export const SAVE_QUERY3 = 'Mock Flight count by destination save to panel';
+export const SAVE_QUERY4 = 'Mock Flight peek';
+
+export const querySearch = (query, rangeSelected) => {
+  cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(query);
+  cy.get('[data-test-subj="superDatePickerToggleQuickMenuButton"]').click();
+  cy.get(rangeSelected).click();
+  cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').contains('Refresh').click();
+};
+
+export const landOnEventHome = () => {
+  cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics`);
+  cy.wait(delay);
+};
+
+export const landOnEventExplorer = () => {
+  cy.visit(
+    `${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/explorer`
+  );
+  cy.wait(delay);
+};
+
+export const landOnEventVisualizations = () => {
+  cy.visit(
+    `${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/explorer`
+  );
+  cy.get('button[id="main-content-vis"]').contains('Visualizations').click();
+  supressResizeObserverIssue();
+  cy.wait(delay);
+};
+
+export const landOnPanels = () => {
+  cy.visit(
+    `${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/operational_panels`
+  );
+  cy.wait(delay);
+};
diff --git a/dashboards-observability/public/components/app.tsx b/dashboards-observability/public/components/app.tsx
@@ -26,6 +26,11 @@ interface ObservabilityAppDeps {
   timestampUtils: any;
 }
 
+// for cypress to test redux store
+if (window.Cypress) {
+  window.store = store;
+}
+
 export const App = ({
   CoreStartProp,
   DepsStart,

diff --git a/dashboards-observability/public/components/explorer/sidebar/field_insights.tsx b/dashboards-observability/public/components/explorer/sidebar/field_insights.tsx
@@ -127,7 +127,7 @@ export const FieldInsights = ({ field, query }: any) => {
   }, [curReport, reportContent, field.name]);
 
   return (
-    <EuiFlexGroup direction="column">
+    <EuiFlexGroup direction="column" data-test-subj="sidebarField__fieldInsights">
       <EuiFlexItem grow={false}>
         <EuiFlexGroup wrap>
           {generalReports.map((report) => {

diff --git a/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx b/dashboards-observability/public/components/explorer/timechart_header/timechart_header.tsx
@@ -66,7 +66,7 @@ export function TimechartHeader({
             })}
             compressed
             id="dscResultsIntervalSelector"
-            data-test-subj="discoverIntervalSelect"
+            data-test-subj="eventAnalytics__EventIntervalSelect"
             options={options}
             value={interval}
             onChange={handleIntervalChange}

diff --git a/...plorer/visualizations/config_panel/config_editor/config_controls/config_value_options.tsx b/...plorer/visualizations/config_panel/config_editor/config_controls/config_value_options.tsx
@@ -13,6 +13,7 @@ export const ConfigValueOptions = ({
   vizState,
   handleConfigChange,
   sectionName,
+  sectionId = 'valueOptions'
 }: any) => {
   const { data } = visualizations;
   const { data: vizData = {}, metadata: { fields = [] } = {} } = data?.rawVizData;
@@ -55,7 +56,7 @@ export const ConfigValueOptions = ({
   return (
     <EuiAccordion
       initialIsOpen
-      id={`configPanel__${sectionName}`}
+      id={`configPanel__${sectionId}`}
       buttonContent={sectionName}
       paddingSize="s"
     >

diff --git a/...blic/components/explorer/visualizations/config_panel/config_editor/default_vis_editor.tsx b/...blic/components/explorer/visualizations/config_panel/config_editor/default_vis_editor.tsx
@@ -27,6 +27,7 @@ export const VizDataPanel = ({ visualizations, onConfigChange, vizState = {}, ta
           handleConfigChange={handleConfigEditing(section.mapTo)}
           vizState={vizState[section.mapTo] || section.defaultState || {}}
           sectionName={section.name}
+          sectionId={section.id}
         />
       </EuiFormRow>
     );

diff --git a/...rds-observability/public/components/explorer/visualizations/config_panel/config_panel.tsx b/...rds-observability/public/components/explorer/visualizations/config_panel/config_panel.tsx
@@ -186,7 +186,9 @@ export const ConfigPanel = ({ visualizations, setCurVisId }: any) => {
         gutterSize="none"
         responsive={false}
       >
-        <EuiFlexItem>
+        <EuiFlexItem
+          data-test-subj="configPane__vizTypeSelector"
+        >
           <EuiSpacer size="s" />
           <EuiComboBox
             aria-label="config chart selector"

diff --git a/.../visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap b/.../visualizations/shared_components/__tests__/__snapshots__/shared_components.test.tsx.snap
@@ -7,11 +7,13 @@ exports[`Shared components Renders empty placeholder component 1`] = `
   <EuiText
     className="lnsChart__empty"
     color="subdued"
+    data-test-subj="vizWorkspace__noData"
     size="xs"
     textAlign="center"
   >
     <div
       className="euiText euiText--extraSmall lnsChart__empty"
+      data-test-subj="vizWorkspace__noData"
     >
       <EuiTextAlign
         textAlign="center"
@@ -71,7 +73,7 @@ exports[`Shared components Renders empty placeholder component 1`] = `
               <p>
                 <FormattedMessage
                   defaultMessage="No results found"
-                  id="xpack.lens.xyVisualization.noDataLabel"
+                  id="visualization_noData"
                   values={Object {}}
                 >
                   <span>

diff --git a/...ability/public/components/explorer/visualizations/shared_components/empty_placeholder.tsx b/...ability/public/components/explorer/visualizations/shared_components/empty_placeholder.tsx
@@ -9,12 +9,12 @@ import { FormattedMessage } from '@osd/i18n/react';
 
 export const EmptyPlaceholder = (props: {icon: string}) => (
   <>
-    <EuiText className="lnsChart__empty" textAlign="center" color="subdued" size="xs">
+    <EuiText className="lnsChart__empty" textAlign="center" color="subdued" size="xs" data-test-subj="vizWorkspace__noData">
       <EuiIcon type={props.icon} color="subdued" size="l" />
       <EuiSpacer size="s" />
       <p>
         <FormattedMessage
-          id="xpack.lens.xyVisualization.noDataLabel"
+          id="visualization_noData"
           defaultMessage="No results found"
         />
       </p>

diff --git a/...servability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx b/...servability/public/components/explorer/visualizations/workspace_panel/workspace_panel.tsx
@@ -21,7 +21,7 @@ interface IWorkSpacePanel {
 export function WorkspacePanel({ visualizations }: IWorkSpacePanel) {
   const [isTableViewOn, setIsTableViewOn] = useState(false);
   const VisualizationPanel = useMemo(() => {
-    return <Visualization visualizations={visualizations} />;
+    return <Visualization visualizations={visualizations} data-test-subj="workspace__visualizations"  />;
   }, [visualizations]);
 
   return (
@@ -55,6 +55,7 @@ export function WorkspacePanel({ visualizations }: IWorkSpacePanel) {
                     setIsTableViewOn((staleState) => !staleState);
                   }}
                   aria-describedby="table view switcher"
+                  data-test-subj="workspace__dataTableViewSwitch"
                   compressed
                 />
               </EuiPanel>
@@ -64,7 +65,10 @@ export function WorkspacePanel({ visualizations }: IWorkSpacePanel) {
         </EuiFlexItem>
         <EuiFlexItem>
           <EuiPanel paddingSize="s">
-            {isTableViewOn ? <DataTable visualizations={visualizations} /> : VisualizationPanel}
+            {isTableViewOn ? 
+            <DataTable 
+              visualizations={visualizations}
+            /> : VisualizationPanel}
           </EuiPanel>
         </EuiFlexItem>
       </EuiFlexGroup>

diff --git a/dashboards-observability/public/components/visualizations/charts/data_table/data_table.tsx b/dashboards-observability/public/components/visualizations/charts/data_table/data_table.tsx
@@ -87,6 +87,7 @@ export const DataTable = ({ visualizations }: any) => {
   return (
     <EuiDataGrid
       aria-label="viz data table"
+      data-test-subj="workspace__dataTable"
       columns={columns}
       columnVisibility={{ visibleColumns, setVisibleColumns }}
       rowCount={raw_data.length}

diff --git a/dashboards-observability/public/components/visualizations/charts/text/text.tsx b/dashboards-observability/public/components/visualizations/charts/text/text.tsx
@@ -16,8 +16,10 @@ export const Text = ({ visualizations }: any) => {
   const { dataConfig = {} } = visualizations?.data?.userConfigs;
 
   return (
-    <EuiMarkdownFormat>
-      {dataConfig.text?.markdown ? dataConfig.text?.markdown : DEFAULT_MARKDOWN}
-    </EuiMarkdownFormat>
+    <div data-test-subj="workspace__viz_markdown">
+      <EuiMarkdownFormat>
+        {dataConfig.text?.markdown ? dataConfig.text?.markdown : DEFAULT_MARKDOWN}
+      </EuiMarkdownFormat>
+    </div>
   );
 };