Skip to content

Commit

Permalink
[Refactoring] Use JDBC response format for visualizations (opensearch…
Browse files Browse the repository at this point in the history
…-project#324)

* use jdbc format

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

* use jdbc format for line

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

* use josn for pie and add changes for related rendering flows

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

* use jdbc for heatmap

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

* change viz to jdbc elsewhere and make related changes to use jdbc data

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

* correct suppress naming

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

* added download path for issue causing app reloads

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

* quick resolution for few tests

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

* update jest tests/snapshots

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

* keep viz for on calculating availability for now

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

* add cypress downloads to gitignore

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

* disable no-console

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

* better naming and type defination

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

* update function doc and types

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

---------

Signed-off-by: Eric Wei <[email protected]>
  • Loading branch information
mengweieric authored Mar 15, 2023
1 parent ea4836f commit 8de4b3e
Show file tree
Hide file tree
Showing 40 changed files with 5,356 additions and 757 deletions.
86 changes: 21 additions & 65 deletions .cypress/integration/1_event_analytics.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,20 +22,15 @@ import {
HOST_TEXT_2,
HOST_TEXT_3,
HOST_TEXT_4,
AGENT_TEXT_1,
AGENT_TEXT_2,
AGENT_TEXT_3,
BAR_LEG_TEXT_1,
BAR_LEG_TEXT_2,
BAR_LEG_TEXT_3,
VIS_TYPE_PIE,
VIS_TYPE_HBAR,
VIS_TYPE_VBAR,
VIS_TYPE_HEATMAP,
FIELD_HOST,
FIELD_AGENT
} from '../utils/event_analytics/constants';
import { supressResizeObserverIssue, COMMAND_TIMEOUT_LONG } from '../utils/constants';
import { suppressResizeObserverIssue, COMMAND_TIMEOUT_LONG } from '../utils/constants';
import { clearQuerySearchBoxText } from '../utils/event_analytics/helpers';

describe('Adding sample data and visualization', () => {
Expand Down Expand Up @@ -90,7 +85,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="docTable"] tbody tr button.euiButtonIcon').first().click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('.observability-flyout').should('exist');
cy.get('.observability-flyout .osdDocViewer .euiTabs span.euiTab__content')
.contains('Table')
Expand All @@ -117,7 +112,7 @@ describe('Open flyout for a data row to see details', () => {
describe('Add/delete/switch explorer top level tabs', () => {
before(() => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
});

it('Add a new tab', () => {
Expand All @@ -138,7 +133,7 @@ describe('Add/delete/switch explorer top level tabs', () => {
.find('button.euiTab')
.first()
.click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="eventExplorer__topLevelTabbing"]')
.find('button.euiTab')
.first()
Expand Down Expand Up @@ -215,22 +210,22 @@ describe('Click actions', () => {
cy.get('[data-test-subj="eventHomeAction__delete"]').click();
cy.get('[data-test-subj="popoverModal__deleteTextInput"]').type('delete');
cy.get('[data-test-subj="popoverModal__deleteButton"').click();
cy.get('.euiToastHeader__title').contains('successfully').should('exist');
cy.get('.euiToastHeader__title').should('contain', 'successfully');
});
});

describe('Saves a query on explorer page', () => {
it('Saves a visualization on visualization tab of explorer page', () => {
landOnEventExplorer();
querySearch(TEST_QUERIES[1].query, TEST_QUERIES[1].dateRangeDOM);
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[id="main-content-vis"]').contains('Visualizations').click();
cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').click();
cy.get('[data-test-subj="eventExplorer__querySaveName"]')
.focus()
.type(SAVE_QUERY2, { force: true });
cy.get('[data-test-subj="eventExplorer__querySaveConfirm"]').click({ force: true });
cy.get('.euiToastHeader__title').should('contain', 'successfully');
cy.get('.euiToastHeader__title').contains('successfully').should('exist');
landOnEventHome();
cy.get('[data-test-subj="eventHome__savedQueryTableName"]').first().contains(SAVE_QUERY2);
});
Expand All @@ -245,7 +240,7 @@ describe('Saves a query on explorer page', () => {
cy.wait(delay);
landOnEventExplorer();
querySearch(TEST_QUERIES[1].query, TEST_QUERIES[1].dateRangeDOM);
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[id="main-content-vis"]', { timeout: COMMAND_TIMEOUT_LONG })
.contains('Visualizations')
.click();
Expand All @@ -261,7 +256,7 @@ describe('Saves a query on explorer page', () => {

it('Saves a query on event tab of explorer page', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);

cy.get('.tab-title').contains('Events').click();
Expand All @@ -281,7 +276,7 @@ describe('Saves a query on explorer page', () => {

it('Click on a saved query from event analytics home', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
querySearch(TEST_QUERIES[0].query, TEST_QUERIES[0].dateRangeDOM);

cy.get('.tab-title').contains('Events').click();
Expand Down Expand Up @@ -310,7 +305,7 @@ describe('Saves a query on explorer page', () => {
describe('Override timestamp for an index', () => {
it('Click override button to override default timestamp', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
clearQuerySearchBoxText('searchAutocompleteTextArea');
cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(TEST_QUERIES[2].query);
cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').contains('Refresh').click();
Expand All @@ -330,7 +325,7 @@ describe('Override timestamp for an index', () => {
describe('Toggle sidebar fields', () => {
it('Toggle fields between available and selected section', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
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');
Expand All @@ -344,7 +339,7 @@ describe('Toggle sidebar fields', () => {
describe('Search fields in sidebar', () => {
it('Search a field', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
querySearch(TEST_QUERIES[0].query, YEAR_TO_DATE_DOM_ID);
cy.get('[data-test-subj="eventExplorer__sidebarSearch"]').type('A');
cy.get('[data-test-subj="field-Cancelled"]').should('not.exist');
Expand Down Expand Up @@ -373,7 +368,7 @@ describe('Delete saved objects', () => {
describe('Click to view field insights', () => {
beforeEach(() => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
querySearch(TEST_QUERIES[2].query, YEAR_TO_DATE_DOM_ID);
});

Expand Down Expand Up @@ -411,7 +406,7 @@ describe('Click to view field insights', () => {
describe('Switch on and off livetail', () => {
it('Switch on and off in live tail', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(TEST_QUERIES[1].query);
cy.get('[data-test-subj=eventLiveTail]').click();
cy.get('[data-test-subj=eventLiveTail__delay10s]').click();
Expand All @@ -424,7 +419,7 @@ describe('Switch on and off livetail', () => {
describe('Live tail stop automatically', () => {
it('Moving to other tab should stop live tail automatically', () => {
landOnEventExplorer();
supressResizeObserverIssue();
suppressResizeObserverIssue();
clearQuerySearchBoxText('searchAutocompleteTextArea');
cy.get('[data-test-subj="searchAutocompleteTextArea"]').type(TEST_QUERIES[1].query);
cy.get('[data-test-subj=eventLiveTail]').click();
Expand All @@ -433,7 +428,7 @@ describe('Live tail stop automatically', () => {
});

it('Add a new tab', () => {
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="eventExplorer__topLevelTabbing"]')
.find('button.euiTab')
.then((lists) => {
Expand All @@ -453,7 +448,7 @@ describe('Live tail stop automatically', () => {
.find('button.euiTab')
.first()
.click();
supressResizeObserverIssue();
suppressResizeObserverIssue();

cy.get('[data-test-subj="eventExplorer__topLevelTabbing"]')
.find('button.euiTab')
Expand All @@ -474,7 +469,7 @@ describe('Live tail stop automatically', () => {
const initialLength = Cypress.$(lists).length;
cy.get('[data-test-subj="eventExplorer__topLevelTabbing"] button.euiTab').eq(1).click();
cy.get('button.euiTab-isSelected [data-test-subj="eventExplorer__tabClose"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="eventExplorer__topLevelTabbing"]')
.find('button.euiTab')
.should('have.length', initialLength - 1);
Expand All @@ -487,7 +482,7 @@ describe('Live tail stop automatically', () => {
});

describe('Visualizing data', () => {
before(() => {
beforeEach(() => {
landOnEventVisualizations();
querySearch(TEST_QUERIES[2].query, YEAR_TO_DATE_DOM_ID);
});
Expand Down Expand Up @@ -542,50 +537,11 @@ describe('Visualizing data', () => {
cy.get(`input[value="${FIELD_AGENT}"]`).click();
cy.get('[data-test-subj="panelCloseBtn"]').click();
cy.get('[data-test-subj="visualizeEditorRenderButton"]').click();
supressResizeObserverIssue();

cy.get('.infolayer .legendtext').as('legandTxt');
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_1);
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_2);
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_3);
});
suppressResizeObserverIssue();

it('Visualize horizontal bar chart', () => {
cy.get('[data-test-subj="comboBoxInput"]').click();
cy.get('[data-test-subj="comboBoxOptionsList "] span').contains(VIS_TYPE_HBAR).click();
cy.get('[data-test-subj="vizConfigSection-dimensions"]')
.find('[data-test-subj="viz-config-section"]')
.eq(1)
.find('[data-test-subj="viz-config-delete-btn"]')
.click();
cy.get('[data-test-subj="vizConfigSection-breakdowns"]')
.find('[data-test-subj="viz-config-add-btn"]')
.click();
cy.get('[data-test-subj="explorer__vizDataConfig-panel"]')
.find('[data-test-subj="comboBoxInput"]')
.click()
.type(FIELD_AGENT);
cy.get(`input[value="${FIELD_AGENT}"]`).click();
cy.get('[data-test-subj="panelCloseBtn"]').click();
cy.get('[data-test-subj="visualizeEditorRenderButton"]').click();
cy.get('.infolayer .legendtext').as('legandTxt');
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_1);
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_2);
cy.get('@legandTxt').should('contain', BAR_LEG_TEXT_3);
});

it('Visualize heatmap chart', () => {
cy.get('[data-test-subj="comboBoxInput"]').click();
cy.get('[data-test-subj="comboBoxOptionsList "] span').contains(VIS_TYPE_HEATMAP).click();
supressResizeObserverIssue();
cy.get('g.cartesianlayer g.xy g.xaxislayer-above g.xtick text').as('legandXTxt');
cy.get('@legandXTxt').should('contain', HOST_TEXT_1);
cy.get('@legandXTxt').should('contain', HOST_TEXT_3);
cy.get('@legandXTxt').should('contain', HOST_TEXT_4);
cy.get('@legandXTxt').should('contain', HOST_TEXT_2);
cy.get('g.cartesianlayer g.xy g.yaxislayer-above g.ytick text').as('legandYTxt');
cy.get('@legandYTxt').should('contain', AGENT_TEXT_1);
cy.get('@legandYTxt').should('contain', AGENT_TEXT_2);
cy.get('@legandYTxt').should('contain', AGENT_TEXT_3);
});
});
10 changes: 5 additions & 5 deletions .cypress/integration/3_panels.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import {
SAMPLE_VISUALIZATIONS_NAMES,
} from '../utils/panel_constants';

import { supressResizeObserverIssue } from '../utils/constants';
import { suppressResizeObserverIssue } from '../utils/constants';

const moveToEventsHome = () => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/`);
Expand Down Expand Up @@ -59,7 +59,7 @@ describe('Creating visualizations', () => {
});
cy.get('.euiButton__text').contains('Refresh').trigger('mouseover').click();
cy.wait(delay);
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[id="main-content-vis"]').contains('Visualizations').trigger('mouseover').click();
cy.wait(delay * 2);
cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').trigger('mouseover').click();
Expand All @@ -80,7 +80,7 @@ describe('Creating visualizations', () => {
});
cy.get('.euiButton__text').contains('Refresh').trigger('mouseover').click();
cy.wait(delay);
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[id="main-content-vis"]').contains('Visualizations').trigger('mouseover').click();
cy.wait(delay);
cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').trigger('mouseover').click();
Expand Down Expand Up @@ -384,7 +384,7 @@ describe('Testing a panel', () => {
});
cy.get('button[data-test-subj="superDatePickerApplyTimeButton"]').click();

supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[id="main-content-vis"]').contains('Visualizations').trigger('mouseover').click();
cy.wait(delay * 2);
cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').trigger('mouseover').click();
Expand Down Expand Up @@ -420,7 +420,7 @@ describe('Testing a panel', () => {
.contains(PPL_VISUALIZATIONS_NAMES[0])
.should('exist');
cy.get('button[aria-label="actionMenuButton"]').eq(0).trigger('mouseover').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('button[data-test-subj="editVizContextMenuItem"]').click();
cy.wait(delay * 3);
cy.url().should('match', new RegExp('(.*)#/event_analytics/explorer'));
Expand Down
16 changes: 8 additions & 8 deletions .cypress/integration/7_app_analytics.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ import {
TYPING_DELAY,
timeoutDelay
} from '../utils/app_constants';
import { supressResizeObserverIssue } from '../utils/constants';
import { suppressResizeObserverIssue } from '../utils/constants';

describe('Creating application', () => {
beforeEach(() => {
Expand Down Expand Up @@ -233,7 +233,7 @@ describe('Viewing application', () => {
cy.get('[data-test-subj="app-analytics-serviceTab"]').click();
cy.get('[data-test-subj="superDatePickerShowDatesButton"]').should('contain', 'Last 24 months');
cy.get('[data-test-subj="app-analytics-traceTab"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="superDatePickerShowDatesButton"]').should('contain', 'Last 24 months');
cy.get('[data-test-subj="app-analytics-logTab"]').click();
cy.get('[data-test-subj="superDatePickerShowDatesButton"]').should('contain', 'Last 24 months');
Expand Down Expand Up @@ -262,7 +262,7 @@ describe('Viewing application', () => {
cy.get('[data-test-subj="app-analytics-serviceTab"]').click();
cy.wait(delay);
cy.get('.euiLink').contains('authentication').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="serviceDetailFlyoutTitle"]').should('be.visible');
cy.get('[data-test-subj="serviceDetailFlyout"]').within(($flyout) => {
cy.get('[data-test-subj="Number of connected servicesDescriptionList"]').should('contain', '3');
Expand All @@ -279,7 +279,7 @@ describe('Viewing application', () => {

it('Opens trace detail flyout when Trace ID is clicked', () => {
cy.get('[data-test-subj="app-analytics-traceTab"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.wait(delay);
cy.get('[title="03f9c770db5ee2f1caac0afc36db49ba"]').click();
cy.get('[data-test-subj="traceDetailFlyoutTitle"]').should('be.visible');
Expand All @@ -300,7 +300,7 @@ describe('Viewing application', () => {

it('Opens span detail flyout when Span ID is clicked', () => {
cy.get('[data-test-subj="app-analytics-traceTab"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.wait(delay);
cy.get('[data-test-subj="dataGridRowCell"]').contains('5ff3516909562c60').click();
cy.get('[data-test-subj="spanDetailFlyout"]').should('be.visible');
Expand Down Expand Up @@ -334,7 +334,7 @@ describe('Viewing application', () => {
changeTimeTo24('months');
cy.wait(delay * 2);
cy.get('[data-test-subj="main-content-visTab"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="eventExplorer__saveManagementPopover"]').click();
cy.get('[data-test-subj="eventExplorer__querySaveName"]').click().type(visOneName);
cy.wait(delay);
Expand All @@ -351,7 +351,7 @@ describe('Viewing application', () => {
cy.get('[data-test-subj="app-analytics-panelTab"]').click();
cy.get('[aria-label="actionMenuButton"]').click();
cy.get('[data-test-subj="editVizContextMenuItem"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="superDatePickerShowDatesButton"]').should('contain', 'Last 24 months');
cy.get('.euiTab[id="availability-panel"]').click();
cy.get('[title="Bar"]').click();
Expand Down Expand Up @@ -389,7 +389,7 @@ describe('Viewing application', () => {
cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').click();
cy.wait(delay);
cy.get('[data-test-subj="main-content-visTab"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('.euiTab[id="availability-panel"]').click();
cy.get('[title="Bar"]').click();
cy.focused().type('{downArrow}');
Expand Down
8 changes: 4 additions & 4 deletions .cypress/utils/app_constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* SPDX-License-Identifier: Apache-2.0
*/

import { supressResizeObserverIssue } from './constants';
import { suppressResizeObserverIssue } from './constants';

export const delay = 1000;
export const timeoutDelay = 30000;
Expand All @@ -18,13 +18,13 @@ export const moveToHomePage = () => {
export const moveToCreatePage = () => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/application_analytics/`);
cy.get('.euiButton[href="#/application_analytics/create"]').eq(0).click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.get('[data-test-subj="createPageTitle"]').should('contain', 'Create application');
};

export const moveToApplication = (name) => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/application_analytics/`);
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.wait(delay * 6);
cy.get(`[data-test-subj="${name}ApplicationLink"]`).click();
cy.wait(delay);
Expand All @@ -36,7 +36,7 @@ export const moveToEditPage = () => {
moveToApplication(nameOne);
cy.get('[data-test-subj="app-analytics-configTab"]').click();
cy.get('[data-test-subj="editApplicationButton"]').click();
supressResizeObserverIssue();
suppressResizeObserverIssue();
cy.wait(delay);
cy.get('[data-test-subj="createPageTitle"]').should('contain', 'Edit application');
};
Expand Down
Loading

0 comments on commit 8de4b3e

Please sign in to comment.