Skip to content

Improve support for incomplete traces

Daniele Rossetti requested to merge drosse/incomplete-traces-handling into master

What does this MR do and why?

Improve UI in case of incomplete traces

  • On tracing list add the in progress label when in_progress: true
  • On tracing details add the in progress label when the root span is missing

Closes gitlab-org/opstrace/opstrace#2692 (closed)

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

image image

How to set up and validate locally

  • Prerequisites: be logged in and running GDK with Ultimate license
  • Enable :observability_tracing feature flag

Apply patch to load mocks ( copy the patch content below and run in your terminal: pbpaste | git apply )

diff --git a/app/assets/javascripts/observability/client.js b/app/assets/javascripts/observability/client.js
index c87a1bec0bef..5ac081cb644f 100644
--- a/app/assets/javascripts/observability/client.js
+++ b/app/assets/javascripts/observability/client.js
@@ -1,22 +1,235 @@
+/* eslint-disable @gitlab/require-i18n-strings */
 import { isValidDate } from '~/lib/utils/datetime_utility';
 import * as Sentry from '~/sentry/sentry_browser_wrapper';
 import axios from '~/lib/utils/axios_utils';
 import { logError } from '~/lib/logger';
 import { DEFAULT_SORTING_OPTION, SORTING_OPTIONS, CUSTOM_DATE_RANGE_OPTION } from './constants';

+const MOCK_TRACES = {
+  project_id: 51792562,
+  traces: [
+    {
+      timestamp: '2023-11-10T20:39:58.981780253Z',
+      timestamp_nano: 1699648798981780253,
+      trace_id: '2b1f08cd-9d10-4ac5-90c3-47fa84ab1c80',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 931979,
+      in_progress: true,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:39:58.981780253Z',
+          span_id: 'D28D2485217F1874',
+          trace_id: '2b1f08cd-9d10-4ac5-90c3-47fa84ab1c80',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 931979,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:39:58.981914178Z',
+          span_id: 'CE64EF2386D5B768',
+          trace_id: '2b1f08cd-9d10-4ac5-90c3-47fa84ab1c80',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 516542,
+          parent_span_id: 'D28D2485217F1874',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+    {
+      timestamp: '2023-11-10T20:39:28.655321683Z',
+      timestamp_nano: 1699648768655321683,
+      trace_id: '68a8cc4d-1403-4561-8721-e42ac8f0ec1b',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 806467,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:39:28.655321683Z',
+          span_id: '4AA0BAF116CD904D',
+          trace_id: '68a8cc4d-1403-4561-8721-e42ac8f0ec1b',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 806467,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:39:28.655458107Z',
+          span_id: '8716FEC7EF4E8BD9',
+          trace_id: '68a8cc4d-1403-4561-8721-e42ac8f0ec1b',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 440323,
+          parent_span_id: '4AA0BAF116CD904D',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+    {
+      timestamp: '2023-11-10T20:38:58.326464308Z',
+      timestamp_nano: 1699648738326464308,
+      trace_id: '2af9172b-a326-0462-4dac-e7030928f67a',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 1199391,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:38:58.326464308Z',
+          span_id: 'C8701AF08593B86B',
+          trace_id: '2af9172b-a326-0462-4dac-e7030928f67a',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 1199391,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:38:58.326669557Z',
+          span_id: '5A26A5CDAAFEAAE1',
+          trace_id: '2af9172b-a326-0462-4dac-e7030928f67a',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 606424,
+          parent_span_id: 'C8701AF08593B86B',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+    {
+      timestamp: '2023-11-10T20:38:28.003531546Z',
+      timestamp_nano: 1699648708003531546,
+      trace_id: '8f6293ce-895e-8c23-8966-03b9b6b60625',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 830728,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:38:28.003531546Z',
+          span_id: '1F03B387DE6C523B',
+          trace_id: '8f6293ce-895e-8c23-8966-03b9b6b60625',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 830728,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:38:28.00366749Z',
+          span_id: 'DD8501683E1D3F89',
+          trace_id: '8f6293ce-895e-8c23-8966-03b9b6b60625',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 427162,
+          parent_span_id: '1F03B387DE6C523B',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+    {
+      timestamp: '2023-11-10T20:37:57.682713952Z',
+      timestamp_nano: 1699648677682713952,
+      trace_id: 'd057c76c-1032-59e0-8a8d-d4cbca420107',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 850928,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:37:57.682713952Z',
+          span_id: 'C57FA0DFAD04CCC1',
+          trace_id: 'd057c76c-1032-59e0-8a8d-d4cbca420107',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 850928,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:37:57.682852917Z',
+          span_id: 'CFC23BEC4B935D8F',
+          trace_id: 'd057c76c-1032-59e0-8a8d-d4cbca420107',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 467103,
+          parent_span_id: 'C57FA0DFAD04CCC1',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+    {
+      timestamp: '2023-11-10T20:37:27.360383093Z',
+      timestamp_nano: 1699648647360383093,
+      trace_id: 'a6abd9ca-2299-e964-d233-3b782c8f5679',
+      service_name: 'featureflagservice',
+      operation: '/',
+      status_code: 'STATUS_CODE_UNSET',
+      duration_nano: 851823,
+      spans: [
+        {
+          timestamp: '2023-11-10T20:37:27.360383093Z',
+          span_id: 'B39BEA97214DDC03',
+          trace_id: 'a6abd9ca-2299-e964-d233-3b782c8f5679',
+          service_name: 'featureflagservice',
+          operation: '/',
+          duration_nano: 851823,
+          parent_span_id: '',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+        {
+          timestamp: '2023-11-10T20:37:27.360521433Z',
+          span_id: '64C63AB1CC3D1640',
+          trace_id: 'a6abd9ca-2299-e964-d233-3b782c8f5679',
+          service_name: 'featureflagservice',
+          operation: 'featureflagservice.repo.query:featureflags',
+          duration_nano: 455900,
+          parent_span_id: 'B39BEA97214DDC03',
+          status_code: 'STATUS_CODE_UNSET',
+        },
+      ],
+      total_spans: 2,
+      totalSpans: 2,
+    },
+  ],
+  total_traces: 6,
+  next_page_token:
+    'eyJsYXN0X3NlZW5fdGltZXN0YW1wIjoiMjAyMy0xMS0xMCAxNjoyNzo0Ny4xMDQ0NzcwOTIiLCJzZWVuX3RyYWNlX2lkcyI6WyI2ZTI0NjFjZS04MWVmLTRkYWItN2ZmYS1hMTRlMDRiODhmNWUiXX0=',
+};
+
 function reportErrorAndThrow(e) {
   logError(e);
   Sentry.captureException(e);
   throw e;
 }
+
+function mockReturnDataWithDelay(data) {
+  return new Promise((resolve) => {
+    setTimeout(() => resolve(data), 500);
+  });
+}
+
 // Provisioning API spec: https://gitlab.com/gitlab-org/opstrace/opstrace/-/blob/main/provisioning-api/pkg/provisioningapi/routes.go#L59
 async function enableObservability(provisioningUrl) {
   try {
-    // Note: axios.put(url, undefined, {withCredentials: true}) does not send cookies properly, so need to use the API below for the correct behaviour
-    return await axios(provisioningUrl, {
-      method: 'put',
-      withCredentials: true,
-    });
+    console.log('[DEBUG] Enabling Observability');
+    return mockReturnDataWithDelay();
   } catch (e) {
     return reportErrorAndThrow(e);
   }
@@ -25,11 +238,12 @@ async function enableObservability(provisioningUrl) {
 // Provisioning API spec: https://gitlab.com/gitlab-org/opstrace/opstrace/-/blob/main/provisioning-api/pkg/provisioningapi/routes.go#L37
 async function isObservabilityEnabled(provisioningUrl) {
   try {
-    const { data } = await axios.get(provisioningUrl, { withCredentials: true });
+    console.log('[DEBUG] Checking Observability Enabled');
+    const data = { status: 'ready' };
     if (data && data.status) {
       // we currently ignore the 'status' payload and just check if the request was successful
       // We might improve this as part of https://gitlab.com/gitlab-org/opstrace/opstrace/-/issues/2315
-      return true;
+      return mockReturnDataWithDelay(true);
     }
   } catch (e) {
     if (e.response.status === 404) {
@@ -41,19 +255,49 @@ async function isObservabilityEnabled(provisioningUrl) {
 }

 async function fetchTrace(tracingUrl, traceId) {
-  try {
-    if (!traceId) {
-      throw new Error('traceId is required.');
-    }
-
-    const { data } = await axios.get(`${tracingUrl}/${traceId}`, {
-      withCredentials: true,
-    });
-
-    return data;
-  } catch (e) {
-    return reportErrorAndThrow(e);
-  }
+  console.log(`[DEBUG] Fetch trace ${traceId} from ${tracingUrl}`);
+  return mockReturnDataWithDelay({
+    timestamp: '2024-03-15T06:24:02.387122Z',
+    timestamp_nano: 1710483842387122000,
+    trace_id: 'b0efc3ca-753a-18bb-6e32-58259de57675',
+    service_name: 'frontend-proxy',
+    operation: 'router frontend egress',
+    status_code: 'STATUS_CODE_UNSET',
+    duration_nano: 11806000,
+    total_spans: 1,
+    spans: [
+      {
+        timestamp: '2024-03-15T06:24:02.387122Z',
+        timestamp_nano: 1710483842387122000,
+        span_id: 'A0D65F3A934BAE23',
+        trace_id: 'b0efc3ca-753a-18bb-6e32-58259de57675',
+        service_name: 'frontend-proxy',
+        operation: 'router frontend egress',
+        duration_nano: 11806000,
+        parent_span_id: '4F48EEFD53889072',
+        status_code: 'STATUS_CODE_UNSET',
+        status_message: '',
+        trace_state: '',
+        span_kind: 'SPAN_KIND_CLIENT',
+        scope_name: '',
+        scope_version: '',
+        span_attributes: {
+          component: 'proxy',
+          'http.protocol': 'HTTP/1.1',
+          'http.status_code': '200',
+          'peer.address': '172.19.0.22:8080',
+          response_flags: '-',
+          upstream_address: '172.19.0.22:8080',
+          upstream_cluster: 'frontend',
+          'upstream_cluster.name': 'frontend',
+        },
+        resource_attributes: {
+          'service.name': 'frontend-proxy',
+          'service.namespace': 'opentelemetry-demo',
+        },
+      },
+    ],
+  });
 }

 /**
@@ -241,16 +485,15 @@ async function fetchTraces(
     : DEFAULT_SORTING_OPTION;
   params.append('sort', sortOrder);

+  console.log(`[DEBUG] Fetching traces with params: ${params.toString()}`);
+
   try {
-    const { data } = await axios.get(tracingUrl, {
-      withCredentials: true,
-      params,
-      signal: abortController?.signal,
-    });
+    const data = MOCK_TRACES;
+
     if (!Array.isArray(data.traces)) {
       throw new Error('traces are missing/invalid in the response'); // eslint-disable-line @gitlab/require-i18n-strings
     }
-    return data;
+    return mockReturnDataWithDelay(data);
   } catch (e) {
     return reportErrorAndThrow(e);
   }
@@ -260,12 +503,559 @@ async function fetchTracesAnalytics(tracingAnalyticsUrl, { filters = {}, abortCo
   const params = tracingFilterObjToQueryParams(filters);

   try {
-    const { data } = await axios.get(tracingAnalyticsUrl, {
-      withCredentials: true,
-      params,
-      signal: abortController?.signal,
-    });
-    return data.results ?? [];
+    return [
+      {
+        interval: 1706456580,
+        count: 272,
+        p90_duration_nano: 79431434,
+        p95_duration_nano: 172512624,
+        p75_duration_nano: 33666014,
+        p50_duration_nano: 13540992,
+        trace_rate: 4.533333333333333,
+      },
+      {
+        interval: 1706456640,
+        count: 322,
+        p90_duration_nano: 245701137,
+        p95_duration_nano: 410402110,
+        p75_duration_nano: 126097516,
+        p50_duration_nano: 26955796,
+        trace_rate: 5.366666666666666,
+      },
+      {
+        interval: 1706456700,
+        count: 317,
+        p90_duration_nano: 57725645,
+        p95_duration_nano: 108238301,
+        p75_duration_nano: 22083152,
+        p50_duration_nano: 9805219,
+        trace_rate: 5.283333333333333,
+      },
+      {
+        interval: 1706456760,
+        count: 305,
+        p90_duration_nano: 41273392,
+        p95_duration_nano: 59172159,
+        p75_duration_nano: 13839742,
+        p50_duration_nano: 7781631,
+        trace_rate: 5.083333333333333,
+      },
+      {
+        interval: 1706456820,
+        count: 265,
+        p90_duration_nano: 22710314,
+        p95_duration_nano: 48594102,
+        p75_duration_nano: 12042993,
+        p50_duration_nano: 7631276,
+        trace_rate: 4.416666666666667,
+      },
+      {
+        interval: 1706456880,
+        count: 325,
+        p90_duration_nano: 36954214,
+        p95_duration_nano: 68456357,
+        p75_duration_nano: 15495574,
+        p50_duration_nano: 8469740,
+        trace_rate: 5.416666666666667,
+      },
+      {
+        interval: 1706456940,
+        count: 318,
+        p90_duration_nano: 44410888,
+        p95_duration_nano: 65699400,
+        p75_duration_nano: 16393502,
+        p50_duration_nano: 7961675,
+        trace_rate: 5.3,
+      },
+      {
+        interval: 1706457000,
+        count: 337,
+        p90_duration_nano: 34717561,
+        p95_duration_nano: 59336335,
+        p75_duration_nano: 13571795,
+        p50_duration_nano: 7733784,
+        trace_rate: 5.616666666666666,
+      },
+      {
+        interval: 1706457060,
+        count: 387,
+        p90_duration_nano: 32907588,
+        p95_duration_nano: 60445860,
+        p75_duration_nano: 13641362,
+        p50_duration_nano: 7798726,
+        trace_rate: 6.45,
+      },
+      {
+        interval: 1706457120,
+        count: 301,
+        p90_duration_nano: 27987584,
+        p95_duration_nano: 67325297,
+        p75_duration_nano: 12790384,
+        p50_duration_nano: 7757298,
+        trace_rate: 5.016666666666667,
+      },
+      {
+        interval: 1706457180,
+        count: 333,
+        p90_duration_nano: 31476253,
+        p95_duration_nano: 55323485,
+        p75_duration_nano: 13947276,
+        p50_duration_nano: 8006820,
+        trace_rate: 5.55,
+      },
+      {
+        interval: 1706457240,
+        count: 352,
+        p90_duration_nano: 21262407,
+        p95_duration_nano: 54958789,
+        p75_duration_nano: 11896249,
+        p50_duration_nano: 7312890,
+        trace_rate: 5.866666666666666,
+      },
+      {
+        interval: 1706457300,
+        count: 281,
+        p90_duration_nano: 21512699,
+        p95_duration_nano: 29312319,
+        p75_duration_nano: 12753142,
+        p50_duration_nano: 7513485,
+        trace_rate: 4.683333333333334,
+      },
+      {
+        interval: 1706457360,
+        count: 376,
+        p90_duration_nano: 27093433,
+        p95_duration_nano: 56742286,
+        p75_duration_nano: 14058002,
+        p50_duration_nano: 8110594,
+        trace_rate: 6.266666666666667,
+      },
+      {
+        interval: 1706457420,
+        count: 332,
+        p90_duration_nano: 21081844,
+        p95_duration_nano: 55775376,
+        p75_duration_nano: 12217809,
+        p50_duration_nano: 7679078,
+        trace_rate: 5.533333333333333,
+      },
+      {
+        interval: 1706457480,
+        count: 304,
+        p90_duration_nano: 39703897,
+        p95_duration_nano: 53297967,
+        p75_duration_nano: 13717898,
+        p50_duration_nano: 7994348,
+        trace_rate: 5.066666666666666,
+      },
+      {
+        interval: 1706457540,
+        count: 254,
+        p90_duration_nano: 23036019,
+        p95_duration_nano: 40939144,
+        p75_duration_nano: 15023150,
+        p50_duration_nano: 8124892,
+        trace_rate: 4.233333333333333,
+      },
+      {
+        interval: 1706457600,
+        count: 253,
+        p90_duration_nano: 27045480,
+        p95_duration_nano: 48833417,
+        p75_duration_nano: 13829965,
+        p50_duration_nano: 7333832,
+        trace_rate: 4.216666666666667,
+      },
+      {
+        interval: 1706457660,
+        count: 289,
+        p90_duration_nano: 23766179,
+        p95_duration_nano: 52720179,
+        p75_duration_nano: 13620996,
+        p50_duration_nano: 7135943,
+        trace_rate: 4.816666666666666,
+      },
+      {
+        interval: 1706457720,
+        count: 315,
+        p90_duration_nano: 38767674,
+        p95_duration_nano: 60896167,
+        p75_duration_nano: 13728748,
+        p50_duration_nano: 8062914,
+        trace_rate: 5.25,
+      },
+      {
+        interval: 1706457780,
+        count: 375,
+        p90_duration_nano: 36013005,
+        p95_duration_nano: 58635150,
+        p75_duration_nano: 13773369,
+        p50_duration_nano: 8222391,
+        trace_rate: 6.25,
+      },
+      {
+        interval: 1706457840,
+        count: 308,
+        p90_duration_nano: 35323907,
+        p95_duration_nano: 58595063,
+        p75_duration_nano: 14814055,
+        p50_duration_nano: 8134352,
+        error_count: 1,
+        trace_rate: 5.133333333333334,
+        error_rate: 0.016666666666666666,
+      },
+      {
+        interval: 1706457900,
+        count: 333,
+        p90_duration_nano: 44315056,
+        p95_duration_nano: 72226313,
+        p75_duration_nano: 13889160,
+        p50_duration_nano: 7923700,
+        trace_rate: 5.55,
+      },
+      {
+        interval: 1706457960,
+        count: 317,
+        p90_duration_nano: 28259103,
+        p95_duration_nano: 52709872,
+        p75_duration_nano: 14465300,
+        p50_duration_nano: 8458325,
+        trace_rate: 5.283333333333333,
+      },
+      {
+        interval: 1706458020,
+        count: 295,
+        p90_duration_nano: 65575771,
+        p95_duration_nano: 105888062,
+        p75_duration_nano: 21958893,
+        p50_duration_nano: 9598912,
+        trace_rate: 4.916666666666667,
+      },
+      {
+        interval: 1706458080,
+        count: 295,
+        p90_duration_nano: 24436118,
+        p95_duration_nano: 51572675,
+        p75_duration_nano: 15173781,
+        p50_duration_nano: 8715377,
+        trace_rate: 4.916666666666667,
+      },
+      {
+        interval: 1706458140,
+        count: 306,
+        p90_duration_nano: 23505445,
+        p95_duration_nano: 43799164,
+        p75_duration_nano: 11844148,
+        p50_duration_nano: 7564427,
+        trace_rate: 5.1,
+      },
+      {
+        interval: 1706458200,
+        count: 309,
+        p90_duration_nano: 19308303,
+        p95_duration_nano: 49772529,
+        p75_duration_nano: 11456016,
+        p50_duration_nano: 7182270,
+        trace_rate: 5.15,
+      },
+      {
+        interval: 1706458260,
+        count: 300,
+        p90_duration_nano: 52210503,
+        p95_duration_nano: 88646000,
+        p75_duration_nano: 16802765,
+        p50_duration_nano: 8720694,
+        trace_rate: 5,
+      },
+      {
+        interval: 1706458320,
+        count: 302,
+        p90_duration_nano: 24741420,
+        p95_duration_nano: 70086661,
+        p75_duration_nano: 14095069,
+        p50_duration_nano: 7729995,
+        trace_rate: 5.033333333333333,
+      },
+      {
+        interval: 1706458380,
+        count: 239,
+        p90_duration_nano: 23741328,
+        p95_duration_nano: 43663022,
+        p75_duration_nano: 13789931,
+        p50_duration_nano: 7691321,
+        trace_rate: 3.9833333333333334,
+      },
+      {
+        interval: 1706458440,
+        count: 274,
+        p90_duration_nano: 43050389,
+        p95_duration_nano: 75748560,
+        p75_duration_nano: 19640043,
+        p50_duration_nano: 9362896,
+        trace_rate: 4.566666666666666,
+      },
+      {
+        interval: 1706458500,
+        count: 284,
+        p90_duration_nano: 38022093,
+        p95_duration_nano: 76537140,
+        p75_duration_nano: 17754634,
+        p50_duration_nano: 9713191,
+        trace_rate: 4.733333333333333,
+      },
+      {
+        interval: 1706458560,
+        count: 337,
+        p90_duration_nano: 52097324,
+        p95_duration_nano: 92626247,
+        p75_duration_nano: 23782307,
+        p50_duration_nano: 10728151,
+        trace_rate: 5.616666666666666,
+      },
+      {
+        interval: 1706458620,
+        count: 314,
+        p90_duration_nano: 48091564,
+        p95_duration_nano: 74307337,
+        p75_duration_nano: 16835916,
+        p50_duration_nano: 8808724,
+        trace_rate: 5.233333333333333,
+      },
+      {
+        interval: 1706458680,
+        count: 339,
+        p90_duration_nano: 41366871,
+        p95_duration_nano: 80304569,
+        p75_duration_nano: 18038716,
+        p50_duration_nano: 9224320,
+        trace_rate: 5.65,
+      },
+      {
+        interval: 1706458740,
+        count: 357,
+        p90_duration_nano: 29929149,
+        p95_duration_nano: 78307518,
+        p75_duration_nano: 14780702,
+        p50_duration_nano: 8427422,
+        trace_rate: 5.95,
+      },
+      {
+        interval: 1706458800,
+        count: 324,
+        p90_duration_nano: 31840009,
+        p95_duration_nano: 55491486,
+        p75_duration_nano: 14861251,
+        p50_duration_nano: 8223113,
+        trace_rate: 5.4,
+      },
+      {
+        interval: 1706458860,
+        count: 333,
+        p90_duration_nano: 39294045,
+        p95_duration_nano: 69730899,
+        p75_duration_nano: 15199295,
+        p50_duration_nano: 8041218,
+        trace_rate: 5.55,
+      },
+      {
+        interval: 1706458920,
+        count: 294,
+        p90_duration_nano: 48568979,
+        p95_duration_nano: 66760311,
+        p75_duration_nano: 18509137,
+        p50_duration_nano: 8499614,
+        trace_rate: 4.9,
+      },
+      {
+        interval: 1706458980,
+        count: 322,
+        p90_duration_nano: 34160095,
+        p95_duration_nano: 73983061,
+        p75_duration_nano: 16050561,
+        p50_duration_nano: 8516281,
+        trace_rate: 5.366666666666666,
+      },
+      {
+        interval: 1706459040,
+        count: 313,
+        p90_duration_nano: 32734476,
+        p95_duration_nano: 58744260,
+        p75_duration_nano: 16117332,
+        p50_duration_nano: 8559912,
+        trace_rate: 5.216666666666667,
+      },
+      {
+        interval: 1706459100,
+        count: 276,
+        p90_duration_nano: 37665643,
+        p95_duration_nano: 62453984,
+        p75_duration_nano: 17482104,
+        p50_duration_nano: 8980269,
+        trace_rate: 4.6,
+      },
+      {
+        interval: 1706459160,
+        count: 290,
+        p90_duration_nano: 28988900,
+        p95_duration_nano: 60153241,
+        p75_duration_nano: 15246382,
+        p50_duration_nano: 9369509,
+        trace_rate: 4.833333333333333,
+      },
+      {
+        interval: 1706459220,
+        count: 344,
+        p90_duration_nano: 32009664,
+        p95_duration_nano: 60140125,
+        p75_duration_nano: 13938408,
+        p50_duration_nano: 8126050,
+        trace_rate: 5.733333333333333,
+      },
+      {
+        interval: 1706459280,
+        count: 316,
+        p90_duration_nano: 52721520,
+        p95_duration_nano: 84303627,
+        p75_duration_nano: 15076925,
+        p50_duration_nano: 8778278,
+        trace_rate: 5.266666666666667,
+      },
+      {
+        interval: 1706459340,
+        count: 295,
+        p90_duration_nano: 24832023,
+        p95_duration_nano: 62248214,
+        p75_duration_nano: 15355056,
+        p50_duration_nano: 8533624,
+        trace_rate: 4.916666666666667,
+      },
+      {
+        interval: 1706459400,
+        count: 262,
+        p90_duration_nano: 27520722,
+        p95_duration_nano: 37179599,
+        p75_duration_nano: 11981362,
+        p50_duration_nano: 7617786,
+        trace_rate: 4.366666666666666,
+      },
+      {
+        interval: 1706459460,
+        count: 417,
+        p90_duration_nano: 53926059,
+        p95_duration_nano: 85566298,
+        p75_duration_nano: 21019065,
+        p50_duration_nano: 9890689,
+        trace_rate: 6.95,
+      },
+      {
+        interval: 1706459520,
+        count: 334,
+        p90_duration_nano: 34375886,
+        p95_duration_nano: 74525278,
+        p75_duration_nano: 15708046,
+        p50_duration_nano: 8980976,
+        trace_rate: 5.566666666666666,
+      },
+      {
+        interval: 1706459580,
+        count: 263,
+        p90_duration_nano: 54832011,
+        p95_duration_nano: 67796652,
+        p75_duration_nano: 21589090,
+        p50_duration_nano: 9274608,
+        trace_rate: 4.383333333333334,
+      },
+      {
+        interval: 1706459640,
+        count: 316,
+        p90_duration_nano: 46634902,
+        p95_duration_nano: 69433245,
+        p75_duration_nano: 20396987,
+        p50_duration_nano: 10372056,
+        trace_rate: 5.266666666666667,
+      },
+      {
+        interval: 1706459700,
+        count: 308,
+        p90_duration_nano: 66665032,
+        p95_duration_nano: 95091833,
+        p75_duration_nano: 28659709,
+        p50_duration_nano: 12735573,
+        trace_rate: 5.133333333333334,
+      },
+      {
+        interval: 1706459760,
+        count: 326,
+        p90_duration_nano: 96225070,
+        p95_duration_nano: 209633183,
+        p75_duration_nano: 27851595,
+        p50_duration_nano: 12716064,
+        trace_rate: 5.433333333333334,
+      },
+      {
+        interval: 1706459820,
+        count: 310,
+        p90_duration_nano: 84154378,
+        p95_duration_nano: 117682796,
+        p75_duration_nano: 34703061,
+        p50_duration_nano: 13423725,
+        trace_rate: 5.166666666666667,
+      },
+      {
+        interval: 1706459880,
+        count: 353,
+        p90_duration_nano: 47483129,
+        p95_duration_nano: 74255470,
+        p75_duration_nano: 19082901,
+        p50_duration_nano: 9235607,
+        trace_rate: 5.883333333333334,
+      },
+      {
+        interval: 1706459940,
+        count: 297,
+        p90_duration_nano: 107179972,
+        p95_duration_nano: 208361541,
+        p75_duration_nano: 38709056,
+        p50_duration_nano: 13218117,
+        trace_rate: 4.95,
+      },
+      {
+        interval: 1706460000,
+        count: 300,
+        p90_duration_nano: 38830199,
+        p95_duration_nano: 68655804,
+        p75_duration_nano: 18297327,
+        p50_duration_nano: 9839759,
+        trace_rate: 5,
+      },
+      {
+        interval: 1706460060,
+        count: 336,
+        p90_duration_nano: 55658849,
+        p95_duration_nano: 83612862,
+        p75_duration_nano: 22518070,
+        p50_duration_nano: 10190903,
+        trace_rate: 5.6,
+      },
+      {
+        interval: 1706460120,
+        count: 278,
+        p90_duration_nano: 41078106,
+        p95_duration_nano: 69527419,
+        p75_duration_nano: 17581239,
+        p50_duration_nano: 9156243,
+        trace_rate: 4.633333333333334,
+      },
+      {
+        interval: 1706460180,
+        count: 156,
+        p90_duration_nano: 273579241,
+        p95_duration_nano: 420841263,
+        p75_duration_nano: 108696560,
+        p50_duration_nano: 32458663,
+        trace_rate: 2.6,
+      },
+    ];
   } catch (e) {
     return reportErrorAndThrow(e);
   }
@@ -273,15 +1063,17 @@ async function fetchTracesAnalytics(tracingAnalyticsUrl, { filters = {}, abortCo

 async function fetchServices(servicesUrl) {
   try {
-    const { data } = await axios.get(servicesUrl, {
-      withCredentials: true,
-    });
+    console.log(`[DEBUG] Fetching services from ${servicesUrl}`);
+    const uniqueServices = new Set(
+      MOCK_TRACES.traces.map((t) => t.spans.map((s) => s.service_name)).flat(),
+    );
+    const data = { services: Array.from(uniqueServices).map((s) => ({ name: s })) };

     if (!Array.isArray(data.services)) {
       throw new Error('failed to fetch services. invalid response'); // eslint-disable-line @gitlab/require-i18n-strings
     }

-    return data.services;
+    return mockReturnDataWithDelay(data.services);
   } catch (e) {
     return reportErrorAndThrow(e);
   }
@@ -296,15 +1088,21 @@ async function fetchOperations(operationsUrl, serviceName) {
       throw new Error('fetchOperations() - operationsUrl must contain $SERVICE_NAME$');
     }
     const url = operationsUrl.replace('$SERVICE_NAME$', serviceName);
-    const { data } = await axios.get(url, {
-      withCredentials: true,
-    });
+
+    console.log('[DEBUG] fetching operations suggestions from', url); // eslint-disable-line @gitlab/require-i18n-strings
+    const uniqOps = new Set(
+      MOCK_TRACES.traces
+        .map((t) => t.spans.filter((s) => s.service_name === serviceName))
+        .flat()
+        .map((s) => s.operation),
+    );
+    const data = { operations: Array.from(uniqOps).map((s) => ({ name: s })) };

     if (!Array.isArray(data.operations)) {
       throw new Error('failed to fetch operations. invalid response'); // eslint-disable-line @gitlab/require-i18n-strings
     }

-    return data.operations;
+    return mockReturnDataWithDelay(data.operations);
   } catch (e) {
     return reportErrorAndThrow(e);
   }
diff --git a/app/assets/javascripts/observability/components/observability_container.vue b/app/assets/javascripts/observability/components/observability_container.vue
index b89c2624f81c..f6cbf7ee771f 100644
--- a/app/assets/javascripts/observability/components/observability_container.vue
+++ b/app/assets/javascripts/observability/components/observability_container.vue
@@ -27,12 +27,12 @@ export default {

     // TODO: Improve local GDK dev experience with tracing https://gitlab.com/gitlab-org/opstrace/opstrace/-/issues/2308
     // Uncomment the lines below to to test this locally
-    // setTimeout(() => {
-    //   this.messageHandler({
-    //     data: { type: 'AUTH_COMPLETION', status: 'success' },
-    //     origin: new URL(this.oauthUrl).origin,
-    //   });
-    // }, 2000);
+    setTimeout(() => {
+      this.messageHandler({
+        data: { type: 'AUTH_COMPLETION', status: 'success' },
+        origin: new URL(this.apiConfig.oauthUrl).origin,
+      });
+    }, 2000);
   },
   destroyed() {
     window.removeEventListener('message', this.messageHandler);
Edited by Daniele Rossetti

Merge request reports

Loading