add data grid tests

Signed-off-by: Eric <[email protected]>

.cypress/integration/event_analytics_test/data_grid.spec.js

@@ -0,0 +1,46 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {
+  querySearch,
+  landOnEventExplorer,
+  clearQuerySearchBoxText,
+  selectDefaultDataSource,
+} from '../../utils/event_analytics/helpers';
+import { TEST_QUERIES } from '../../utils/event_analytics/constants';
+
+describe('Open flyout for a data row to see details', () => {
+  beforeEach(() => {
+    landOnEventExplorer();
+    selectDefaultDataSource();
+    clearQuerySearchBoxText('searchAutocompleteTextArea');
+    querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);
+  });
+
+  it('Should be able to open flyout and see data, json and traces', () => {
+    cy.get('[data-test-subj="dataGrid__openFlyoutBtn"]').first().click();
+    cy.get('.observability-flyout').should('exist');
+    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
+      .contains('Table')
+      .should('be.visible');
+    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
+      .contains('JSON')
+      .should('be.visible');
+    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
+      .contains('Traces')
+      .should('be.visible');
+  });
+
+  it('Should be able to see surrounding docs', () => {
+    cy.get('[data-test-subj="dataGrid__openFlyoutBtn"]').first().click();
+    cy.get('.observability-flyout span.euiButton__text')
+      .contains('View surrounding events')
+      .should('be.visible')
+      .click();
+    cy.get('.observability-flyout #surroundingFyout')
+      .contains('View surrounding events')
+      .should('exist');
+  });
+});

.cypress/integration/event_analytics_test/event_analytics.spec.js

@@ -25,14 +25,14 @@ import {
   FIELD_AGENT,
 } from '../../utils/event_analytics/constants';
 import { COMMAND_TIMEOUT_LONG } from '../../utils/constants';
-
 import {
   querySearch,
   landOnEventHome,
   landOnEventExplorer,
   landOnEventVisualizations,
   landOnPanels,
   clearQuerySearchBoxText,
+  selectDefaultDataSource
 } from '../../utils/event_analytics/helpers';
 
 describe('Adding sample data and visualization', () => {
@@ -54,42 +54,10 @@ describe('Has working breadcrumbs', () => {
   });
 });
 
-describe('Open flyout for a data row to see details', () => {
-  beforeEach(() => {
-    landOnEventExplorer();
-    clearQuerySearchBoxText('searchAutocompleteTextArea');
-    querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);
-  });
-
-  it('Should be able to open flyout and see data, json and traces', () => {
-    cy.get('[data-test-subj="eventExplorer__flyoutArrow"]').first().click();
-    cy.get('.observability-flyout').should('exist');
-    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
-      .contains('Table')
-      .should('be.visible');
-    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
-      .contains('JSON')
-      .should('be.visible');
-    cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
-      .contains('Traces')
-      .should('be.visible');
-  });
-
-  it('Should be able to see surrounding docs', () => {
-    cy.get('[data-test-subj="eventExplorer__flyoutArrow"]').first().click();
-    cy.get('.observability-flyout span.euiButton__text')
-      .contains('View surrounding events')
-      .should('be.visible')
-      .click();
-    cy.get('.observability-flyout #surroundingFyout')
-      .contains('View surrounding events')
-      .should('exist');
-  });
-});
-
 describe('Saves a query on explorer page', () => {
   it('Saves a visualization on visualization tab of explorer page', () => {
     landOnEventExplorer();
+    selectDefaultDataSource();
     querySearch(TEST_QUERIES[1].query, TEST_QUERIES[1].dateRangeDOM);
     cy.get('button[id="main-content-vis"]').contains('Visualizations').click();
     cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').click();
@@ -127,6 +95,7 @@ describe('Saves a query on explorer page', () => {
 
   it('Saves a query on event tab of explorer page', () => {
     landOnEventExplorer();
+    selectDefaultDataSource();
     querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);
 
     cy.get('.tab-title').contains('Events').click();
@@ -147,6 +116,7 @@ describe('Saves a query on explorer page', () => {
 
   it('Click on a saved query from event analytics home', () => {
     landOnEventExplorer();
+    selectDefaultDataSource();
     querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);
 
     cy.get('.tab-title').contains('Events').click();
@@ -345,9 +315,10 @@ describe('Live tail stop automatically', () => {
   });
 });
 
-describe('Visualizing data', () => {
+describe.only('Visualizing data', () => {
   beforeEach(() => {
     landOnEventVisualizations();
+    selectDefaultDataSource();
     querySearch(TEST_QUERIES[2].query, YEAR_TO_DATE_DOM_ID);
   });
 

.cypress/utils/event_analytics/helpers.js

@@ -44,7 +44,7 @@ export const landOnPanels = () => {
   cy.visit(
     `${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/`
   );
-  cy.wait(delay);
+  // cy.wait(delay);
 };
 
 const vis_name_sub_string = Math.floor(Math.random() * 100);
@@ -58,7 +58,7 @@ export const saveVisualizationAndVerify = () => {
     .eq(1)
     .type(`Test visualization` + vis_name_sub_string, { force: true });
   cy.get('[data-test-subj="eventExplorer__querySaveConfirm"]').click({ force: true });
-  cy.wait(delay);
+  // cy.wait(delay);
   cy.get('.euiHeaderBreadcrumbs a').eq(1).click({ force: true });
   cy.get('.euiFlexGroup .euiFormControlLayout__childrenWrapper input')
     .eq(0)
@@ -80,3 +80,10 @@ export const deleteVisualization = () => {
   cy.get('button[data-test-subj = "popoverModal__deleteButton"]').click();
   cy.get('.euiToastHeader').should('exist');
 };
+
+export const selectDefaultDataSource = () => {
+  cy.get('[data-test-subj="dataExplorerDSSelect"] input').type('Default cluster', {
+    force: true,
+  });
+  cy.contains('.euiComboBoxOption__content', 'Default cluster').click();
+};

.eslintrc.js

@@ -17,7 +17,6 @@ module.exports = {
     'plugin:jest/recommended',
     'plugin:prettier/recommended',
   ],
-
   rules: {
     '@typescript-eslint/no-unused-vars': [
       'error',

public/components/event_analytics/explorer/events_views/docViewRow.tsx

@@ -196,10 +196,6 @@ export const FlyoutButton = forwardRef((props: FlyoutButtonProps, ref) => {
     return cols;
   };
 
-  const memorizedTds = useMemo(() => {
-    return getTds(doc, selectedCols, false);
-  }, [doc, selectedCols, detailsOpen, surroundingEventsOpen]);
-
   const memorizedDocFlyout = useMemo(() => {
     return (
       <DocFlyout
@@ -292,6 +288,7 @@ export const FlyoutButton = forwardRef((props: FlyoutButtonProps, ref) => {
         onClick={() => toggleDetailOpen()}
         iconType={detailsOpen || surroundingEventsOpen ? 'minimize' : 'inspect'}
         aria-label="inspect document details"
+        data-test-subj="dataGrid__openFlyoutBtn"
       />
       {flyout}
     </>

public/components/event_analytics/explorer/events_views/surrounding_flyout.tsx

@@ -65,7 +65,6 @@ export const SurroundingFlyout = ({
   setToggleSize,
   dataGridColumns,
   dataGridColumnVisibility,
-  sortingFields,
   rowHeightsOptions,
 }: Props) => {
   const [numNewEvents, setNumNewEvents] = useState(5);
@@ -220,6 +219,7 @@ export const SurroundingFlyout = ({
             className="header-button"
             iconType="sortRight"
             iconSide="right"
+            data-test-subj="dataGrid__FlyoutSurroundingDocs"
           >
             View event details
           </EuiButton>