Refactor trace analytics in main to merge into observability

common/constants/shared.ts

@@ -18,7 +18,7 @@ export const PPL_ENDPOINT = '/_plugins/_ppl';
 
 export const observabilityID = 'observability';
 export const observabilityTitle = 'Observability';
-export const observabilityPluginOrder = 500;
+export const observabilityPluginOrder = 6000;
 
 // Shared Constants 
 export const UI_DATE_FORMAT = 'MM/DD/YYYY hh:mm A';

common/constants/trace_analytics.ts

@@ -0,0 +1,23 @@
+/*
+ * SPDX-License-Identifier: Apache-2.0
+ *
+ * The OpenSearch Contributors require contributions made to
+ * this file be licensed under the Apache-2.0 license or a
+ * compatible open source license.
+ *
+ * Modifications Copyright OpenSearch Contributors. See
+ * GitHub history for details.
+ */
+
+export const DATA_PREPPER_INDEX_NAME = 'otel-v1-apm-span-*';
+export const DATA_PREPPER_SERVICE_INDEX_NAME = 'otel-v1-apm-service-map*';
+export const TRACE_ANALYTICS_DATE_FORMAT = 'MM/DD/YYYY HH:mm:ss';
+export const TRACE_ANALYTICS_PLOTS_DATE_FORMAT = 'MMM D, YYYY HH:mm:ss';
+export const SERVICE_MAP_MAX_NODES = 500;
+// size limit when requesting edge related queries, not necessarily the number of edges
+export const SERVICE_MAP_MAX_EDGES = 1000;
+export const TRACES_MAX_NUM = 3000;
+export const TRACE_ANALYTICS_DOCUMENTATION_LINK = 'https://docs-beta.opensearch.org/monitoring-plugins/trace/';
+
+export const TRACE_ANALYTICS_INDICES_ROUTE = '/api/observability/trace_analytics/indices';
+export const TRACE_ANALYTICS_DSL_ROUTE = '/api/observability/trace_analytics/query';

public/components/app.tsx

@@ -65,6 +65,7 @@ export const App = ({ CoreStart, pplService }: ObservabilityAppDeps) => {
                 path={['/trace_analytics', '/trace_analytics/home']}
                 render={(props) => (
                   <TraceAnalyticsHome
+                    {...props}
                     chrome={chrome}
                     http={http}
                     parentBreadcrumb={parentBreadcrumb}

public/components/trace_analytics/.cypress/integration/dashboard.spec.js

@@ -0,0 +1,139 @@
+/*
+ * SPDX-License-Identifier: Apache-2.0
+ *
+ * The OpenSearch Contributors require contributions made to
+ * this file be licensed under the Apache-2.0 license or a
+ * compatible open source license.
+ *
+ * Modifications Copyright OpenSearch Contributors. See
+ * GitHub history for details.
+ */
+
+/*
+ *   Copyright 2020 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ *
+ *   Licensed under the Apache License, Version 2.0 (the "License").
+ *   You may not use this file except in compliance with the License.
+ *   A copy of the License is located at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   or in the "license" file accompanying this file. This file is distributed
+ *   on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either
+ *   express or implied. See the License for the specific language governing
+ *   permissions and limitations under the License.
+ */
+
+/// <reference types="cypress" />
+
+import { delay, setTimeFilter } from '../utils/constants';
+
+describe('Testing dashboard table empty state', () => {
+  beforeEach(() => {
+    cy.visit('app/trace-analytics-dashboards#/dashboard', {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    cy.wait(delay * 3);
+  });
+
+  it('Renders empty state', () => {
+    cy.contains(' (0)').should('exist');
+    cy.get('h2.euiTitle').contains('No matches').should('exist');
+  });
+});
+
+describe('Testing dashboard table', () => {
+  beforeEach(() => {
+    cy.visit('app/trace-analytics-dashboards#/dashboard', {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    setTimeFilter();
+  });
+
+  it('Renders the dashboard table', () => {
+    cy.contains(' (10)').should('exist');
+    cy.contains('client_cancel_order').should('exist');
+    cy.contains('166.44').should('exist');
+    cy.contains('7.14%').should('exist');
+  });
+
+  it('Adds the percentile filters', () => {
+    cy.contains(' >= 95 percentile').click({ force: true });
+    cy.wait(delay);
+    cy.contains(' >= 95 percentile').click({ force: true });
+    cy.wait(delay);
+
+    cy.contains('Latency percentile within trace group: >= 95th').should('exist');
+    cy.contains(' (7)').should('exist');
+    cy.contains('318.69').should('exist');
+
+    cy.contains(' < 95 percentile').click({ force: true });
+    cy.wait(delay);
+    cy.contains(' < 95 percentile').click({ force: true });
+    cy.wait(delay);
+
+    cy.contains('Latency percentile within trace group: < 95th').should('exist');
+    cy.contains(' (8)').should('exist');
+    cy.contains('383.05').should('exist');
+  });
+
+  it('Opens latency trend popover', () => {
+    setTimeFilter(true);
+    cy.get('.euiButtonIcon[aria-label="Open popover"]').first().click();
+    cy.get('text.ytitle[data-unformatted="Hourly latency (ms)"]').should('exist');
+  });
+
+  it('Redirects to traces table with filter', () => {
+    cy.wait(delay * 5);
+    cy.get('.euiLink').contains('13').click();
+    cy.wait(delay);
+
+    cy.get('h2.euiTitle').contains('Traces').should('exist');
+    cy.contains(' (13)').should('exist');
+    cy.contains('client_create_order').should('exist');
+
+    cy.get('.euiSideNavItemButton__label').contains('Dashboard').click();
+    cy.wait(delay);
+
+    cy.contains('client_create_order').should('exist');
+  });
+});
+
+describe('Testing plots', () => {
+  beforeEach(() => {
+    cy.visit('app/trace-analytics-dashboards#/dashboard', {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    setTimeFilter();
+  });
+
+  it('Renders service map', () => {
+    cy.get('text.ytitle[data-unformatted="Latency (ms)"]').should('exist');
+    cy.get('text[data-unformatted="200"]').should('exist');
+    cy.get('.vis-network').should('exist');
+
+    cy.get('.euiToggle__input[title="Error rate"]').click();
+    cy.get('text.ytitle[data-unformatted="Error rate"]').should('exist');
+    cy.get('text[data-unformatted="10%"]').should('exist');
+
+    cy.get('.euiToggle__input[title="Throughput"]').click();
+    cy.get('text.ytitle[data-unformatted="Throughput"]').should('exist');
+    cy.get('text[data-unformatted="60"]').should('exist');
+
+    cy.get('input[type="search"]').eq(1).focus().type('payment{enter}');
+    cy.wait(delay);
+  });
+
+  it('Renders plots', () => {
+    cy.get('text.ytitle[data-unformatted="Error rate (%)"]').should('exist');
+    cy.get('text.annotation-text[data-unformatted="Now: 0%"]').should('exist');
+    cy.get('text.ytitle[data-unformatted="Throughput (n)"]').should('exist');
+    cy.get('text.annotation-text[data-unformatted="Now: 62"]').should('exist');
+  });
+});

public/components/trace_analytics/.cypress/integration/services.spec.js

@@ -0,0 +1,129 @@
+/*
+ * SPDX-License-Identifier: Apache-2.0
+ *
+ * The OpenSearch Contributors require contributions made to
+ * this file be licensed under the Apache-2.0 license or a
+ * compatible open source license.
+ *
+ * Modifications Copyright OpenSearch Contributors. See
+ * GitHub history for details.
+ */
+
+/*
+ *   Copyright 2020 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ *
+ *   Licensed under the Apache License, Version 2.0 (the "License").
+ *   You may not use this file except in compliance with the License.
+ *   A copy of the License is located at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   or in the "license" file accompanying this file. This file is distributed
+ *   on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either
+ *   express or implied. See the License for the specific language governing
+ *   permissions and limitations under the License.
+ */
+
+/// <reference types="cypress" />
+
+import { delay, SERVICE_NAME, setTimeFilter } from '../utils/constants';
+
+describe('Testing services table empty state', () => {
+  beforeEach(() => {
+    cy.visit('app/trace-analytics-dashboards#/services', {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    cy.wait(delay * 3);
+  });
+
+  it('Renders empty state', () => {
+    cy.contains(' (0)').should('exist');
+    cy.get('h2.euiTitle').contains('No matches').should('exist');
+  });
+});
+
+describe('Testing services table', () => {
+  beforeEach(() => {
+    cy.visit('app/trace-analytics-dashboards#/services', {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    setTimeFilter();
+  });
+
+  it('Renders the services table', () => {
+    cy.contains(' (8)').should('exist');
+    cy.contains('analytics-service, frontend-client, recommendation').should('exist');
+    cy.contains('186.95').should('exist');
+    cy.contains('14.29%').should('exist');
+  });
+
+  it('Searches correctly', () => {
+    cy.get('input[type="search"]').first().focus().type(`${SERVICE_NAME}{enter}`);
+    cy.get('.euiButton__text').contains('Refresh').click();
+    cy.wait(delay);
+    cy.contains(' (1)').should('exist');
+    cy.contains('3.57%').should('exist');
+  });
+});
+
+describe('Testing service view empty state', () => {
+  beforeEach(() => {
+    // exception is thrown on loading EuiDataGrid in cypress only, ignore for now
+    cy.on('uncaught:exception', (err, runnable) => {
+      if (err.message.includes('ResizeObserver loop'))
+        return false;
+    });
+    cy.visit(`app/trace-analytics-dashboards#/services/${SERVICE_NAME}`, {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    cy.wait(delay * 3);
+  });
+
+  it('Renders service view empty state', () => {
+    cy.get('h2.euiTitle').contains('frontend-client').should('exist');
+    cy.get('.euiText').contains('0').should('exist');
+    cy.get('.euiText').contains('-').should('exist');
+  });
+});
+
+describe('Testing service view', () => {
+  beforeEach(() => {
+    // exception is thrown on loading EuiDataGrid in cypress only, ignore for now
+    cy.on('uncaught:exception', (err, runnable) => {
+      if (err.message.includes('ResizeObserver loop'))
+        return false;
+    });
+    cy.visit(`app/trace-analytics-dashboards#/services/${SERVICE_NAME}`, {
+      onBeforeLoad: (win) => {
+        win.sessionStorage.clear();
+      },
+    });
+    setTimeFilter(undefined, false);
+  });
+
+  it('Renders service view', () => {
+    cy.get('h2.euiTitle').contains('frontend-client').should('exist');
+    cy.contains('178.6').should('exist');
+    cy.contains('3.57%').should('exist');
+    cy.get('div.vis-network').should('exist');
+  });
+
+  it('Renders spans data grid, flyout, filters', () => {
+    cy.get('button[data-datagrid-interactable="true"]').eq(0).click({ force: true });
+    cy.wait(delay);
+    cy.contains('Span detail').should('exist');
+    cy.contains('Span attributes').should('exist');
+    cy.get('.euiTextColor').contains('Span ID').trigger('mouseover');
+    cy.get('.euiButtonIcon[aria-label="span-flyout-filter-icon"').click({ force: true });
+    cy.wait(delay);
+
+    cy.get('.euiBadge__text').contains('spanId: ').should('exist');
+    cy.contains('Spans (1)').should('exist');
+  });
+});