trace analytics collapse dashboard queries, align naming to industry …

…conventions (opensearch-project#514) * trace analytics v2 first remove expensive dashboard page Signed-off-by: Derek Ho <[email protected]> * get trace groups request working and mapping correctly Signed-off-by: Derek Ho <[email protected]> * get trace group filter fully working Signed-off-by: Derek Ho <[email protected]> * try some service map adjustments Signed-off-by: Derek Ho <[email protected]> * change to up down to fully show labels Signed-off-by: Derek Ho <[email protected]> * put dashboard in accordian at bottom of services and only make calls if it is open Signed-off-by: Derek Ho <[email protected]> * some changes to support dashboard content in accordian Signed-off-by: Derek Ho <[email protected]> * demo code Signed-off-by: Derek Ho <[email protected]> * fix tests Signed-off-by: Derek Ho <[email protected]> * remove dashboard from app analytics Signed-off-by: Derek Ho <[email protected]> * fix up with tests Signed-off-by: Derek Ho <[email protected]> * fix test Signed-off-by: Derek Ho <[email protected]> * revert only and extract to constant Signed-off-by: Derek Ho <[email protected]> * add auth const Signed-off-by: Derek Ho <[email protected]> * address self-PR review Signed-off-by: Derek Ho <[email protected]> * remove unecessary code Signed-off-by: Derek Ho <[email protected]> * change timeout to 25 seconds Signed-off-by: Derek Ho <[email protected]> * change to row in accordian Signed-off-by: Derek Ho <[email protected]> * update labels and tests Signed-off-by: Derek Ho <[email protected]> * update cypress test Signed-off-by: Derek Ho <[email protected]> * verify cypress tests work with changes Signed-off-by: Derek Ho <[email protected]> * remove accidental only Signed-off-by: Derek Ho <[email protected]> * address PR review comments Signed-off-by: Derek Ho <[email protected]> * make missing configuration more clear Signed-off-by: Derek Ho <[email protected]> * update snapshots Signed-off-by: Derek Ho <[email protected]> * update snapshot Signed-off-by: Derek Ho <[email protected]> --------- Signed-off-by: Derek Ho <[email protected]>
paulstn · Sep 8, 2023 · 5da297b · 5da297b
1 parent f1bb44e
commit 5da297b
Show file tree

Hide file tree

Showing 38 changed files with 942 additions and 4,303 deletions.
diff --git a/.cypress/integration/4_trace_analytics_dashboard.spec.js b/.cypress/integration/4_trace_analytics_dashboard.spec.js
@@ -6,6 +6,9 @@
 /// <reference types="cypress" />
 
 import { testDataSet, delay, setTimeFilter, jaegerTestDataSet } from '../utils/constants';
+import { suppressResizeObserverIssue } from '../utils/constants';
+
+suppressResizeObserverIssue();//needs to be in file once
 
 describe('Dump test data', () => {
   it('Indexes test data', () => {
@@ -88,6 +91,7 @@ describe('Testing dashboard table', () => {
       },
     });
     setTimeFilter();
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
   });
 
   it('Renders the dashboard table', () => {
@@ -97,15 +101,6 @@ describe('Testing dashboard table', () => {
     cy.contains('7.14%').should('exist');
   });
 
-  it('Has working breadcrumbs', () => {
-    cy.get('.euiBreadcrumb').contains('Dashboard').click();
-    cy.get('.euiTitle').contains('Dashboard').should('exist');
-    cy.get('.euiBreadcrumb').contains('Trace analytics').click();
-    cy.get('.euiTitle').contains('Dashboard').should('exist');
-    cy.get('.euiBreadcrumb').contains('Observability').click();
-    cy.get('.euiTitle').contains('Logs').should('exist');
-  });
-
   it('Adds the percentile filters', () => {
     cy.contains(' >= 95 percentile').click({ force: true });
     cy.contains(' >= 95 percentile').click({ force: true });
@@ -131,7 +126,6 @@ describe('Testing dashboard table', () => {
   it('Redirects to traces table with filter', () => {
     cy.get('.euiLink').contains('13').click();
 
-    cy.get('h2.euiTitle').contains('Traces').should('exist');
     cy.contains(' (13)').should('exist');
     cy.contains('client_create_order').should('exist');
 
@@ -149,20 +143,20 @@ describe('Testing plots', () => {
       },
     });
     setTimeFilter();
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
   });
 
   it('Renders service map', () => {
     // plotly scale texts are in attribute "data-unformatted"
-    cy.get('text.ytitle[data-unformatted="Latency (ms)"]').should('exist');
+    cy.get('text.ytitle[data-unformatted="Average duration (ms)"]').should('exist');
     cy.get('text[data-unformatted="200"]').should('exist');
     cy.get('.vis-network').should('exist');
 
-    cy.get('.euiButton__text[title="Error rate"]').click();
-    cy.get('text.ytitle[data-unformatted="Error rate"]').should('exist');
-    cy.get('text[data-unformatted="10%"]').should('exist');
+    cy.get('.euiButton__text[title="Errors"]').click();
+    cy.get('text.ytitle[data-unformatted="Error rate (%)"]').should('exist');
 
-    cy.get('.euiButton__text[title="Throughput"]').click();
-    cy.get('text.ytitle[data-unformatted="Throughput"]').should('exist');
+    cy.get('.euiButton__text[title="Request Rate"]').click();
+    cy.get('text.ytitle[data-unformatted="Request rate (spans)"]').should('exist');
     cy.get('text[data-unformatted="50"]').should('exist');
 
     cy.get('input[type="search"]').eq(1).focus().type('payment{enter}');
@@ -184,6 +178,7 @@ describe('Latency by trace group table', () =>{
       },
     });
     setTimeFilter();
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
   });
 
   it('Verify columns in Latency by trace group table along with pagination functionality', () => {
@@ -194,9 +189,9 @@ describe('Latency by trace group table', () =>{
     cy.get('[data-test-subj="tableHeaderCell_24_hour_latency_trend_3"]').should('exist');
     cy.get('[data-test-subj="tableHeaderCell_dashboard_error_rate_4"]').should('exist');
     cy.get('[data-test-subj="tableHeaderCell_dashboard_traces_5"]').should('exist');
-    cy.get('[data-test-subj="tablePaginationPopoverButton"]').click();
+    cy.get('[data-test-subj="tablePaginationPopoverButton"]').eq(1).click();
     cy.get('.euiIcon.euiIcon--medium.euiIcon--inherit.euiContextMenu__icon').eq(0).should('exist').click();
-    cy.get('[data-test-subj="pagination-button-next"]').should('exist').click();
+    cy.get('[data-test-subj="pagination-button-next"]').eq(1).should('exist').click();
     cy.get('button[data-test-subj="dashboard-table-trace-group-name-button"]').contains('mysql').should('exist');
   });
 
@@ -225,7 +220,7 @@ describe('Latency by trace group table', () =>{
     cy.get('[data-test-subj="superDatePickerApplyTimeButton"]').click();
     cy.wait(delay);//Fails without
     cy.get('.euiTableCellContent.euiTableCellContent--alignRight.euiTableCellContent--overflowingContent').contains('211.04').should('exist');
-    cy.get('button[data-test-subj="dashboard-table-trace-group-name-button"]').click();
+    cy.get('button[data-test-subj="dashboard-table-trace-group-name-button"]').eq(0).click();
     cy.get('.euiBadge.euiBadge--hollow.euiBadge--iconRight.globalFilterItem').click();
     cy.get('.euiIcon.euiIcon--medium.euiContextMenu__arrow').click();
     cy.get('.euiContextMenuPanelTitle').contains('Edit filter').should('exist');
@@ -350,6 +345,7 @@ describe('Testing switch mode to jaeger', () => {
     setTimeFilter();
     cy.get("[data-test-subj='indexPattern-switch-link']").click();
     cy.get("[data-test-subj='jaeger-mode']").click();
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
   });
 
   it('Verifies errors mode columns and data', () => {
@@ -358,15 +354,14 @@ describe('Testing switch mode to jaeger', () => {
     cy.contains('100%').should('exist');
     cy.contains('7').should('exist');
     cy.contains('Service and Operation Name').should('exist');
-    cy.contains('Average latency (ms)').should('exist');
+    cy.contains('Average duration (ms)').should('exist');
     cy.contains('Error rate').should('exist');
     cy.contains('Traces').should('exist');
   });
 
   it('Verifies traces links to traces page', () => {
-    cy.get('.euiLink').contains('7').click();
+    cy.get('[data-test-subj="dashboard-table-traces-button"]').contains('7').click();
 
-    cy.get('h2.euiTitle').contains('Traces').should('exist');
     cy.contains(' (7)').should('exist');
     cy.get("[data-test-subj='filterBadge']").eq(0).contains('process.serviceName: redis')
     cy.get("[data-test-subj='filterBadge']").eq(1).contains('operationName: GetDriver');  
@@ -379,7 +374,7 @@ describe('Testing switch mode to jaeger', () => {
     cy.contains('0%').should('exist');
     cy.contains('8').should('exist');
     cy.contains('Service and Operation Name').should('exist');
-    cy.contains('Average latency (ms)').should('exist');
+    cy.contains('Average duration (ms)').should('exist');
     cy.contains('Error rate').should('exist');
     cy.contains('Traces').should('exist');
   });

diff --git a/.cypress/integration/5_trace_analytics_services.spec.js b/.cypress/integration/5_trace_analytics_services.spec.js
@@ -5,7 +5,10 @@
 
 /// <reference types="cypress" />
 
-import { delay, SERVICE_NAME, SERVICE_SPAN_ID, setTimeFilter, verify_traces_spans_data_grid_cols_exists, count_table_row } from '../utils/constants';
+import { delay, SERVICE_NAME, SERVICE_SPAN_ID, setTimeFilter, verify_traces_spans_data_grid_cols_exists, count_table_row, AUTH_SERVICE_SPAN_ID } from '../utils/constants';
+import { suppressResizeObserverIssue } from '../utils/constants';
+
+suppressResizeObserverIssue();//needs to be in file once
 
 describe('Testing services table empty state', () => {
   beforeEach(() => {
@@ -49,9 +52,9 @@ describe('Testing services table', () => {
   it('Verify columns in Services table', () => {
     cy.get('.euiFlexItem.euiFlexItem--flexGrow10 .panel-title').contains('Services').should('exist');
     cy.get('.euiTableCellContent__text[title="Name"]').should('exist');
-    cy.get('.euiTableCellContent__text[title="Average latency (ms)"]').should('exist');
+    cy.get('.euiTableCellContent__text[title="Average duration (ms)"]').should('exist');
     cy.get('.euiTableCellContent__text[title="Error rate"]').should('exist');
-    cy.get('.euiTableCellContent__text[title="Throughput"]').should('exist');
+    cy.get('.euiTableCellContent__text[title="Request rate"]').should('exist');
     cy.get('.euiTableCellContent__text[title="No. of connected services"]').should('exist');
     cy.get('.euiTableCellContent__text[title="Connected services"]').should('exist');
     cy.get('.euiTableCellContent__text[title="Traces"]').should('exist');
@@ -110,9 +113,7 @@ describe('Testing service view', () => {
     cy.get('.euiBreadcrumb').contains(SERVICE_NAME).click();
     cy.get('h2.euiTitle').contains(SERVICE_NAME).should('exist');
     cy.get('.euiBreadcrumb').contains('Services').click();
-    cy.get('.euiTitle').contains('Services').should('exist');
     cy.get('.euiBreadcrumb').contains('Trace analytics').click();
-    cy.get('.euiTitle').contains('Dashboard').should('exist');
     cy.get('.euiBreadcrumb').contains('Observability').click();
     cy.get('.euiTitle').contains('Logs').should('exist');
   });
@@ -143,10 +144,10 @@ describe('Testing Service map', () => {
   it('Render Service map', () => {
     cy.get('.euiText.euiText--medium .panel-title').contains('Service map');
     cy.get('[data-test-subj="latency"]').should('exist');
-    cy.get('.ytitle').contains('Latency (ms)');
-    cy.get('[data-text = "Error rate"]').click();
+    cy.get('.ytitle').contains('Average duration (ms)');
+    cy.get('[data-text = "Errors"]').click();
     cy.contains('60%');
-    cy.get('[data-text = "Throughput"]').click();
+    cy.get('[data-text = "Duration"]').click();
     cy.contains('100');
     cy.get('.euiText.euiText--medium').contains('Focus on').should('exist');
     cy.get('[placeholder="Service name"]').focus().type('database{enter}');
@@ -238,7 +239,7 @@ describe('Testing traces Spans table and verify columns functionality', () => {
   it('Renders the spans table and click on first span to verify details', () => {
     cy.get('.euiLink.euiLink--primary').contains('authentication').should('exist').click();
     verify_traces_spans_data_grid_cols_exists();
-    cy.get('.euiLink--primary').eq(4).click();
+    cy.contains(AUTH_SERVICE_SPAN_ID).click();
     cy.get('[data-test-subj="spanDetailFlyout"] .euiTitle.euiTitle--medium').contains('Span detail').should('exist');
     cy.get('.euiFlyoutBody .panel-title').contains('Overview').should('exist');
     cy.get('.euiTextColor.euiTextColor--subdued').contains('Span ID').should('exist');
@@ -284,16 +285,15 @@ describe('Testing switch mode to jaeger', () => {
     cy.contains('310.29').should('exist');
     cy.contains('0%').should('exist');
     cy.contains('Name').should('exist');
-    cy.contains('Average latency (ms)').should('exist');
+    cy.contains('Average duration (ms)').should('exist');
     cy.contains('Error rate').should('exist');
-    cy.contains('Throughput').should('exist');
+    cy.contains('Request rate').should('exist');
     cy.contains('Traces').should('exist');
   });
 
   it('Verifies traces links to traces page with filter applied', () => {
     cy.get('.euiTableRow').should('have.length.lessThan', 7);//Replaces Wait
     cy.get('.euiLink').contains('7').click();
-    cy.get('h2.euiTitle').contains('Traces').should('exist');
     cy.contains(' (7)').should('exist');
     cy.get("[data-test-subj='filterBadge']").eq(0).contains('process.serviceName: customer')
   })

diff --git a/.cypress/integration/6_trace_analytics_traces.spec.js b/.cypress/integration/6_trace_analytics_traces.spec.js
@@ -87,9 +87,7 @@ describe('Testing trace view', () => {
     cy.get(`.euiBreadcrumb[href="#/traces/${TRACE_ID}"]`).click();
     cy.get('h2.euiTitle').contains(TRACE_ID).should('exist');
     cy.get('.euiBreadcrumb[href="#/traces"]').click();
-    cy.get('.euiTitle').contains('Traces').should('exist');
     cy.get('.euiBreadcrumb[href="#/"]').click();
-    cy.get('.euiTitle').contains('Dashboard').should('exist');
     cy.get('.euiBreadcrumb[href="observability-logs#/"]').click();
     cy.get('.euiTitle').contains('Logs').should('exist');
   });
@@ -125,7 +123,7 @@ describe('Testing traces table', () => {
   it('Renders the traces table and verify Table Column, Pagination and Rows Data ', () => {
     cy.get('.euiTableCellContent__text').contains('Trace ID').should('exist');
     cy.get('.euiTableCellContent__text').contains('Trace group').should('exist');
-    cy.get('.euiTableCellContent__text').contains('Latency (ms)').should('exist');
+    cy.get('.euiTableCellContent__text').contains('Duration (ms)').should('exist');
     cy.get('.euiTableCellContent__text').contains('Percentile in trace group').should('exist');
     cy.get('.euiTableCellContent__text').contains('Errors').should('exist');
     cy.get('.euiTableCellContent__text').contains('Last updated').should('exist');

diff --git a/.cypress/integration/7_app_analytics.spec.js b/.cypress/integration/7_app_analytics.spec.js
@@ -253,19 +253,19 @@ describe('Viewing application', () => {
   });
 
   it('Shows latency variance in dashboards table', () => {
-    changeTimeTo24('months');
+    changeTimeTo24('years');
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
     cy.get('[data-test-subj="dashboardTable"]').first().within(($table) => {
       cy.get('.plot-container').should('have.length.at.least', 1);
     })
   });
 
   it('Adds filter when Trace group name is clicked', () => {
     cy.wait(delay);//List not loading without
-    cy.get('[data-test-subj="app-analytics-overviewTab"]').click();
+    cy.get('[data-test-subj="trace-groups-service-operation-accordian"]').click();
     cy.get('[data-test-subj="dashboard-table-trace-group-name-button"]').contains('client_create_order').click();
-    cy.get('.euiTableRow').should('have.length', 1, { timeout: timeoutDelay });
     cy.get('[data-test-subj="client_create_orderFilterBadge"]').should('exist');
-    cy.get('[data-test-subj="filterBadge"]').click();
+    cy.get('[data-test-subj="filterBadge"]').eq(1).click();
     cy.get('[data-test-subj="deleteFilterIcon"]').click();
     cy.get('[data-test-subj="client_create_orderFilterBadge"]').should('not.exist');
   });
@@ -276,7 +276,7 @@ describe('Viewing application', () => {
     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');
-      cy.get('[data-text="Error rate"]').click();
+      cy.get('[data-text="Errors"]').click();
       cy.get('.ytitle').contains('Error rate').should('exist');
     });
     cy.get('[data-test-subj="dataGridRowCell"] button').contains('718dc32a693c8a17').click();
@@ -307,6 +307,7 @@ describe('Viewing application', () => {
   it('Opens span detail flyout when Span ID is clicked', () => {
     cy.get('[data-test-subj="app-analytics-traceTab"]').click();
     cy.wait(delay);
+    cy.get('input[type="search"]').focus().type(`5ff3516909562c60`);
     cy.get('[data-test-subj="dataGridRowCell"]').contains('5ff3516909562c60').click();
     cy.get('[data-test-subj="spanDetailFlyout"]').should('be.visible');
     cy.get('[data-test-subj="spanDetailFlyout"]').within(($flyout) => {
@@ -543,6 +544,7 @@ describe('Editing application', () => {
   });
 });
 
+
 describe('Application Analytics home page', () => {
   beforeEach(() => {
     moveToHomePage();

diff --git a/.cypress/utils/constants.js b/.cypress/utils/constants.js
@@ -11,6 +11,7 @@ export const TRACE_ID = '8832ed6abbb2a83516461960c89af49d';
 export const SPAN_ID = 'a673bc074b438374';
 export const SERVICE_NAME = 'frontend-client';
 export const SERVICE_SPAN_ID = '7df5609a6d104736';
+export const AUTH_SERVICE_SPAN_ID = '277a5934acf55dcf';
 
 export const testDataSet = [
   {