From 2283e60036b0bd68c2a2fda5a904f7d6c9ffcb2a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Mon, 9 Dec 2024 23:16:16 +0000 Subject: [PATCH] [Cypress Updates] Event explorer updates (#2275) * update event analytics cypress tests Signed-off-by: Ritvi Bhatt * add sample logs data Signed-off-by: Ritvi Bhatt * fix adding sample data button click Signed-off-by: Ritvi Bhatt * update snapshots Signed-off-by: Ritvi Bhatt * check for visualization type in dropdown Signed-off-by: Ritvi Bhatt * wait for search to load Signed-off-by: Ritvi Bhatt * remove forgetten only Signed-off-by: Ritvi Bhatt --------- Signed-off-by: Ritvi Bhatt Co-authored-by: Ritvi Bhatt (cherry picked from commit 97382aa318b66b94a7010183da44954951b2d1fe) Signed-off-by: github-actions[bot] --- .../event_analytics.spec.js | 54 ++---- .../__snapshots__/flyout_button.test.tsx.snap | 3 + .../explorer/events_views/docViewRow.tsx | 5 +- .../__snapshots__/field.test.tsx.snap | 3 + .../__snapshots__/sidebar.test.tsx.snap | 158 +++++++++++++----- .../explorer/sidebar/field.tsx | 1 + .../explorer/sidebar/sidebar.tsx | 4 +- 7 files changed, 146 insertions(+), 82 deletions(-) diff --git a/.cypress/integration/event_analytics_test/event_analytics.spec.js b/.cypress/integration/event_analytics_test/event_analytics.spec.js index c018a00602..86cea2f1ae 100644 --- a/.cypress/integration/event_analytics_test/event_analytics.spec.js +++ b/.cypress/integration/event_analytics_test/event_analytics.spec.js @@ -37,11 +37,15 @@ import { } from '../../utils/event_analytics/helpers'; describe('Adding sample data and visualization', () => { - it('Adds sample flights data for event analytics', () => { + it('Adds sample flights and logs data for event analytics', () => { cy.visit(`${Cypress.env('opensearchDashboards')}/app/home#/tutorial_directory/sampleData`); cy.get('div[data-test-subj="sampleDataSetCardflights"]') .contains(/(Add|View) data/) .click(); + cy.visit(`${Cypress.env('opensearchDashboards')}/app/home#/tutorial_directory/sampleData`); + cy.get('div[data-test-subj="sampleDataSetCardlogs"]') + .contains(/(Add|View) data/) + .click(); }); }); @@ -53,28 +57,6 @@ describe('Has working breadcrumbs', () => { }); }); -describe('Search a query on event home', () => { - it('Search a query and redirect to explorer to display query output', () => { - landOnEventHome(); - - cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(TEST_QUERIES[0].query); - cy.get('[data-test-subj="superDatePickerToggleQuickMenuButton"]').click(); - cy.get('[data-test-subj="superDatePickerCommonlyUsed_Year_to date"]').click(); - cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').contains('Refresh').click(); - cy.window() - .its('store') - .invoke('getState') - .then((state) => { - expect(Object.values(state.queries)[0]['rawQuery'].trim()).equal(TEST_QUERIES[0].query); - expect(Object.values(state.queries)[0]['selectedDateRange'][0]).equal('now/y'); - expect(Object.values(state.queries)[0]['selectedDateRange'][1]).equal('now'); - }); - - cy.url().should('contain', '#/explorer'); - cy.get('[data-test-subj="searchAutocompleteTextArea"]').contains(TEST_QUERIES[0].query); - }); -}); - describe('Open flyout for a data row to see details', () => { beforeEach(() => { landOnEventExplorer(); @@ -83,7 +65,7 @@ describe('Open flyout for a data row to see details', () => { }); it('Should be able to open flyout and see data, json and traces', () => { - cy.get('[data-test-subj="eventExplorer__flyoutArrow"]').first().click(); + cy.get('[data-test-subj="eventExplorer__flyout"]').first().click(); cy.get('.observability-flyout').should('exist'); cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content') .contains('Table') @@ -97,7 +79,7 @@ describe('Open flyout for a data row to see details', () => { }); it('Should be able to see surrounding docs', () => { - cy.get('[data-test-subj="eventExplorer__flyoutArrow"]').first().click(); + cy.get('[data-test-subj="eventExplorer__flyout"]').first().click(); cy.get('.observability-flyout span.euiButton__text') .contains('View surrounding events') .should('be.visible') @@ -190,14 +172,12 @@ describe('Click actions test', () => { }); it('Actions - click event explorer', () => { - cy.get('[data-test-subj="eventHomeAction"]').click(); cy.get('[data-test-subj="eventHomeAction__explorer"]').click(); cy.url().should('contain', '#/explorer'); }); it('Actions - add sample data', () => { - cy.get('[data-test-subj="eventHomeAction"]').click(); - cy.get('[data-test-subj="eventHomeAction__addSamples"]').click(); + cy.get('[data-test-subj="actionAddSamples"]').click(); cy.get('[data-test-subj="confirmModalConfirmButton"]').click(); cy.get('.euiToastHeader__title').should('contain', 'successfully'); }); @@ -218,6 +198,7 @@ describe('Saves a query on explorer page', () => { 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(); + cy.get('[data-test-subj="comboBoxToggleListButton"]').eq(2).click(); cy.get('[data-test-subj="eventExplorer__querySaveName"]') .focus() .type(SAVE_QUERY2, { force: true }); @@ -299,7 +280,7 @@ describe('Override timestamp for an index', () => { landOnEventExplorer(); clearQuerySearchBoxText('searchAutocompleteTextArea'); cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(TEST_QUERIES[2].query); - cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').contains('Refresh').click(); + cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').click(); cy.get('.tab-title').contains('Events').click(); cy.get('[data-test-subj="eventExplorer__overrideDefaultTimestamp"]').click({ force: true }); @@ -318,10 +299,10 @@ describe('Toggle the sidebar fields', () => { querySearch(TEST_QUERIES[0].query, YEAR_TO_DATE_DOM_ID); cy.get('[data-test-subj="fieldToggle-AvgTicketPrice"]').click(); cy.get('[data-test-subj="field-AvgTicketPrice"]').should('exist'); - cy.get('[data-test-subj="docTable"]').find('th').contains('_source').should('not.exist'); + cy.get('[data-test-subj="docTable"]').find('.euiDataGridHeaderCell').contains('Source').should('not.exist'); cy.get('[data-test-subj="fieldToggle-AvgTicketPrice"]').click(); cy.get('[data-test-subj="field-AvgTicketPrice"]').should('exist'); - cy.get('[data-test-subj="docTable"]').find('th').contains('_source').should('exist'); + cy.get('[data-test-subj="docTable"]').find('.euiDataGridHeaderCell').contains('Source').should('exist'); }); }); @@ -473,7 +454,8 @@ describe('Visualizing data', () => { }); it('Visualize pie chart', () => { - cy.get('[data-test-subj="comboBoxInput"]').click(); + cy.get('[data-test-subj="globalLoadingIndicator"]').should('not.exist'); + cy.get('[data-test-subj="comboBoxInput"]').eq(1).click(); cy.get('[data-test-subj="comboBoxOptionsList "] span').contains(VIS_TYPE_PIE).click(); cy.get('[data-test-subj="vizConfigSection-series"]') .find('[data-test-subj="viz-config-add-btn"]') @@ -482,7 +464,7 @@ describe('Visualizing data', () => { cy.get('[data-test-subj="vizConfigSection-dimensions"]') .find('[data-test-subj="viz-config-add-btn"]') .click(); - cy.get('[data-test-subj="explorer__vizDataConfig-panel"]') + cy.get('.logExplorerVisConfig__section') .find('[data-test-subj="comboBoxInput"]') .click() .type(FIELD_HOST); @@ -497,7 +479,7 @@ describe('Visualizing data', () => { }); it('Visualize vertical bar chart', () => { - cy.get('[data-test-subj="comboBoxInput"]').click(); + cy.get('[data-test-subj="comboBoxInput"]').eq(1).click(); cy.get('[data-test-subj="comboBoxOptionsList "] span').contains(VIS_TYPE_VBAR).click(); cy.get('[data-test-subj="vizConfigSection-series"]') .find('[data-test-subj="viz-config-add-btn"]') @@ -506,7 +488,7 @@ describe('Visualizing data', () => { cy.get('[data-test-subj="vizConfigSection-dimensions"]') .find('[data-test-subj="viz-config-add-btn"]') .click(); - cy.get('[data-test-subj="explorer__vizDataConfig-panel"]') + cy.get('.logExplorerVisConfig__section') .find('[data-test-subj="comboBoxInput"]') .click() .type(FIELD_HOST); @@ -515,7 +497,7 @@ describe('Visualizing data', () => { cy.get('[data-test-subj="vizConfigSection-breakdowns"]') .find('[data-test-subj="viz-config-add-btn"]') .click(); - cy.get('[data-test-subj="explorer__vizDataConfig-panel"]') + cy.get('.logExplorerVisConfig__section') .find('[data-test-subj="comboBoxInput"]') .click() .type(FIELD_AGENT); diff --git a/public/components/event_analytics/explorer/events_views/__tests__/__snapshots__/flyout_button.test.tsx.snap b/public/components/event_analytics/explorer/events_views/__tests__/__snapshots__/flyout_button.test.tsx.snap index 3aee6f2fd7..e6945ec797 100644 --- a/public/components/event_analytics/explorer/events_views/__tests__/__snapshots__/flyout_button.test.tsx.snap +++ b/public/components/event_analytics/explorer/events_views/__tests__/__snapshots__/flyout_button.test.tsx.snap @@ -19,11 +19,13 @@ exports[`Datagrid Doc viewer row component Renders Doc viewer row component 1`] > { return cols; }; - const memorizedTds = useMemo(() => { - return getTds(doc, selectedCols, false); - }, [doc, selectedCols, detailsOpen, surroundingEventsOpen]); - const memorizedDocFlyout = useMemo(() => { return ( { onClick={() => toggleDetailOpen()} iconType={detailsOpen || surroundingEventsOpen ? 'minimize' : 'inspect'} aria-label="inspect document details" + data-test-subj="eventExplorer__flyout" /> {flyout} diff --git a/public/components/event_analytics/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap b/public/components/event_analytics/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap index df2df9cb99..12205581d4 100644 --- a/public/components/event_analytics/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap +++ b/public/components/event_analytics/explorer/sidebar/__tests__/__snapshots__/field.test.tsx.snap @@ -225,6 +225,7 @@ exports[`Field component Renders a sidebar field 1`] = `
{ aria-label={'inspect'} className="dscSidebarField__actionButton" isDisabled={!(isDefaultDataSourceType || appLogEvents)} + data-test-subj={`field-${field.name}-showDetails`} /> } > diff --git a/public/components/event_analytics/explorer/sidebar/sidebar.tsx b/public/components/event_analytics/explorer/sidebar/sidebar.tsx index d0eb9b353a..75e126bc93 100644 --- a/public/components/event_analytics/explorer/sidebar/sidebar.tsx +++ b/public/components/event_analytics/explorer/sidebar/sidebar.tsx @@ -266,7 +266,7 @@ export const Sidebar = (props: ISidebarProps) => { data-attr-field={field.name} paddingSize="s" className="dscSidebar__item" - data-test-subj={`fieldList-field`} + data-test-subj={`field-${field.name}`} > { data-attr-field={field.name} paddingSize="s" className="dscSidebar__item" - data-test-subj={`fieldList-field`} + data-test-subj={`field-${field.name}`} >