Merge pull request #96 from alanconway/korrel8r-trace-fixes

fix: trace fixes for troubleshooting panel

Author: openshift-merge-bot[bot]

Makefile

@@ -1,3 +1,6 @@
+.PHONY: test
+test: test-frontend
+
 .PHONY: test-frontend
 test-frontend: lint-frontend
 	cd web && npm run test:unit

web/src/__tests__/node-factory.spec.ts

@@ -35,9 +35,9 @@ const testdata = [
   },
   {
     url:
-      `observe/traces?name=platform&namespace=openshift-tracing&tenant=platform&` +
-      `q=${encodeURIComponent('{resource.service.name = "article-service"}')}`,
-    query: `trace:trace:{resource.service.name = "article-service"}`,
+      `observe/traces/1599dfd76bc896101a9811857ae3c3c9?` +
+      `namespace=openshift-tracing&name=platform&tenant=platform`,
+    query: `trace:span:{trace:id="1599dfd76bc896101a9811857ae3c3c9"}`,
   },
   {
     url: `monitoring/logs?q=${encodeURIComponent(

web/src/__tests__/trace-node.spec.ts

@@ -1,32 +1,40 @@
 import { TraceNode } from '../korrel8r/trace';
 
+const tempo = 'namespace=openshift-tracing&name=platform&tenant=platform';
+
 const roundtrip = [
   {
-    url:
-      `observe/traces?name=platform&namespace=openshift-tracing&tenant=platform&` +
-      `q=${encodeURIComponent('{resource.service.name = "article-service"}')}`,
-    query: `trace:trace:{resource.service.name = "article-service"}`,
+    url: `observe/traces?${tempo}`,
+    query: `trace:span:{}`,
+  },
+  {
+    url: `observe/traces?${tempo}&q=%7Bresource.service.name%3D%22article-service%22%7D`,
+    query: `trace:span:{resource.service.name="article-service"}`,
+  },
+  {
+    url: `observe/traces/1599dfd76bc896101a9811857ae3c3c9?${tempo}`,
+    query: `trace:span:{trace:id="1599dfd76bc896101a9811857ae3c3c9"}`,
   },
 ];
 
 describe('TraceNode.fromURL', () => {
-  it.each(roundtrip)('$url', ({ url, query }) =>
-    expect(TraceNode.fromURL(url)?.toQuery()).toEqual(query),
-  );
+  it.each([
+    ...roundtrip,
+    {
+      url: `observe/traces`,
+      query: `trace:span:{}`,
+    },
+  ])('$url', ({ url, query }) => expect(TraceNode.fromURL(url)?.toQuery()).toEqual(query));
 });
 
 describe('TraceNode.fromQuery', () => {
-  it.each(roundtrip)('$query', ({ query, url }) =>
-    expect(TraceNode.fromQuery(query)?.toURL()).toEqual(url),
-  );
-
-  it('Query => URL => Query', () => {
-    const query = 'trace:trace:{resource.service.name="shop-backend"}';
-    const expectedKorrel8rURL =
-      'observe/traces?name=platform&namespace=openshift-tracing&tenant=platform&' +
-      'q=%7Bresource.service.name%3D%22shop-backend%22%7D';
-    const actualKorrel8rURL = TraceNode.fromQuery(query)?.toURL();
-    expect(actualKorrel8rURL).toEqual(expectedKorrel8rURL);
-    expect(TraceNode.fromURL(actualKorrel8rURL)?.toQuery()).toEqual(query);
+  it.each([
+    ...roundtrip,
+    {
+      query: `trace:span:{resource.service.name="shop-backend"}`,
+      url: `observe/traces?${tempo}&q=%7Bresource.service.name%3D%22shop-backend%22%7D`,
+    },
+  ])('$query', ({ query, url }) => {
+    expect(TraceNode.fromQuery(query).toURL()).toEqual(url);
   });
 });

web/src/korrel8r/trace.ts

@@ -1,10 +1,13 @@
 import { Korrel8rNode } from './korrel8r.types';
 import { parseQuery, parseURL } from './query-url';
 
-// URL format:
-// `observe/traces?namespace=<tempoNamespace>&name=<tempoName>&tenant=<tempoTenant>&q=<traceQL>`
+// URL formats:
+// Get all spans in a single trace:
+//   observe/traces/<trace-id>
+// Search for get selected spans
+//   observe/traces/?namespace=<tempoNamespace>&name=<tempoName>&tenant=<tempoTenant>&q=<traceQL>
 
-// FIXME hard-coded tempo location, need to make this configurable between console & korrel8r.
+// TODO hard-coded tempo location, need to make this configurable between console & korrel8r.
 // Get from the console page environment (change from using URL as context?)
 const [tempoNamespace, tempoName, tempoTenant] = ['openshift-tracing', 'platform', 'platform'];
 
@@ -19,18 +22,20 @@ export class TraceNode extends Korrel8rNode {
   }
 
   static fromURL(url: string): Korrel8rNode {
-    const [, params] = parseURL('trace', 'observe/traces', url);
-    const traceQL = params.get('q');
-    // FIXME need to handle store location params also.
-    return new TraceNode(url, `trace:trace:${traceQL}`);
+    const [urlPath, params] = parseURL('trace', 'observe/traces', url);
+    const traceID = urlPath.match(/observe\/traces\/([0-9a-fA-F]{32})(\/.*)?$/)?.[1];
+    const traceQL = traceID ? `{trace:id="${traceID}"}` : params.get('q') || '{}';
+    return new TraceNode(url, `trace:span:${traceQL}`);
   }
 
   static fromQuery(query: string): Korrel8rNode {
-    const [, traceQL] = parseQuery('trace', query);
-    // FIME get variable tempo address info from query or config...
+    const traceQL = parseQuery('trace', query)?.[1] || '';
+    const traceID = traceQL.match(/\{ *trace:id *= *"([0-9a-fA-F]{32})" *\}/)?.[1] || '';
+    const q = traceID || traceQL.match(/\{ *\}/) ? '' : `&q=${encodeURIComponent(traceQL)}`;
     return new TraceNode(
-      `observe/traces?name=${tempoName}&namespace=${tempoNamespace}&tenant=${tempoTenant}&` +
-        `q=${encodeURIComponent(traceQL)}`,
+      `observe/traces${
+        traceID && `/${traceID}`
+      }?namespace=${tempoNamespace}&name=${tempoName}&tenant=${tempoTenant}${q}`,
       query,
     );
   }

web/tsconfig.json

@@ -8,7 +8,8 @@
     "allowJs": true,
     "strict": false,
     "noUnusedLocals": true,
-    "sourceMap": true
+    "sourceMap": true,
+    "plugins": [{ "name": "typescript-eslint-language-service" }]
   },
   "include": [
     "src"