From d0281356522d54c7c7ac843de19dade1da9e5c20 Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Mon, 4 Nov 2019 15:12:02 +0100 Subject: [PATCH 1/8] feat(traceparent): setting parent span from server --- examples/tracer-web/index.html | 9 ++ .../src/documentLoad.ts | 14 ++- .../src/types.ts | 7 ++ .../src/utils.ts | 42 +++++++ .../test/documentLoad.test.ts | 33 ++++++ .../test/utils.test.ts | 112 ++++++++++++++++++ 6 files changed, 214 insertions(+), 3 deletions(-) create mode 100644 packages/opentelemetry-plugin-document-load/test/utils.test.ts diff --git a/examples/tracer-web/index.html b/examples/tracer-web/index.html index 08bab8e1b0..91a5053f2b 100644 --- a/examples/tracer-web/index.html +++ b/examples/tracer-web/index.html @@ -10,6 +10,15 @@ + Example of using Web Tracer with document load plugin and console exporter diff --git a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts index e556ad207a..89e6c09307 100644 --- a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts +++ b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts @@ -18,8 +18,12 @@ import { BasePlugin, otperformance } from '@opentelemetry/core'; import { PluginConfig, Span, SpanOptions } from '@opentelemetry/types'; import { AttributeNames } from './enums/AttributeNames'; import { PerformanceTimingNames as PTN } from './enums/PerformanceTimingNames'; -import { PerformanceEntries, PerformanceLegacy } from './types'; -import { hasKey } from './utils'; +import { + PerformanceEntries, + PerformanceLegacy, + WindowWithTrace, +} from './types'; +import { hasKey, extractServerContext } from './utils'; /** * This class represents a document load plugin @@ -76,12 +80,16 @@ export class DocumentLoad extends BasePlugin { * Collects information about performance and creates appropriate spans */ private _collectPerformance() { + const windowWithTrace: WindowWithTrace = (window as unknown) as WindowWithTrace; + const serverContext = extractServerContext(windowWithTrace.traceparent); + const entries = this._getEntries(); const rootSpan = this._startSpan( AttributeNames.DOCUMENT_LOAD, PTN.FETCH_START, - entries + entries, + { parent: serverContext } ); if (!rootSpan) { return; diff --git a/packages/opentelemetry-plugin-document-load/src/types.ts b/packages/opentelemetry-plugin-document-load/src/types.ts index cd99cb6e9c..afafe7fc00 100644 --- a/packages/opentelemetry-plugin-document-load/src/types.ts +++ b/packages/opentelemetry-plugin-document-load/src/types.ts @@ -48,3 +48,10 @@ export type PerformanceEntries = { export interface PerformanceLegacy { timing?: PerformanceEntries; } + +/** + * A window object with traceparent information from server + */ +export interface WindowWithTrace { + traceparent?: string; +} diff --git a/packages/opentelemetry-plugin-document-load/src/utils.ts b/packages/opentelemetry-plugin-document-load/src/utils.ts index cb585de753..ad3b574fe9 100644 --- a/packages/opentelemetry-plugin-document-load/src/utils.ts +++ b/packages/opentelemetry-plugin-document-load/src/utils.ts @@ -14,6 +14,9 @@ * limitations under the License. */ +import * as types from '@opentelemetry/types'; +import { TraceFlags } from '@opentelemetry/types'; + /** * Helper function to be able to use enum as typed key in type and in interface when using forEach * @param obj @@ -22,3 +25,42 @@ export function hasKey(obj: O, key: keyof any): key is keyof O { return key in obj; } + +// '{version}-{traceId}-{spanId}-{TraceFlags}'; +const TRACE_PARENT_REGEX = /^[\da-f]{2}-([\da-f]{32})-([\da-f]{16})-([\da-f]{2})$/; + +/** + * Extracts information from [traceParent] window property and converts it into {@link types.SpanContext} + * @param traceParent - A window property that comes from server. + * It should be dynamically generated server side to have the server's request trace Id, + * a parent span Id that was set on the server's request span, + * and the trace flags to indicate the server's sampling decision + * (01 = sampled, 00 = not sampled). + * for example: '{version}-{traceId}-{spanId}-{sampleDecision}' + * For more information see {@link https://www.w3.org/TR/trace-context/} + */ +export function extractServerContext( + traceParent: string = '' +): types.SpanContext | undefined { + const match = + typeof traceParent === 'string' && traceParent.match(TRACE_PARENT_REGEX); + if (!match) { + return; + } + const traceId = match[1]; + const spanId = match[2]; + let traceFlags; + + if (match[3] === '00') { + traceFlags = TraceFlags.UNSAMPLED; + } else if (match[3] === '01') { + traceFlags = TraceFlags.SAMPLED; + } + + let spanContext: types.SpanContext | undefined; + if (traceId && spanId && typeof traceFlags !== 'undefined') { + spanContext = { traceId, spanId, traceFlags }; + } + + return spanContext; +} diff --git a/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts b/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts index 090a34340a..30b9c3370c 100644 --- a/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts +++ b/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts @@ -33,6 +33,7 @@ import { Logger, PluginConfig } from '@opentelemetry/types'; import { ExportResult } from '../../opentelemetry-base/build/src'; import { DocumentLoad } from '../src'; import { PerformanceTimingNames as PTN } from '../src/enums/PerformanceTimingNames'; +import { WindowWithTrace } from '../src/types'; export class DummyExporter implements SpanExporter { export( @@ -238,6 +239,38 @@ describe('DocumentLoad Plugin', () => { }); }); + describe('AND window has information about server root span', () => { + beforeEach(() => { + ((window as unknown) as WindowWithTrace).traceparent = + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01'; + }); + it('should create a root span with server context traceId', done => { + const spyOnEnd = sinon.spy(dummyExporter, 'export'); + plugin.enable(moduleExports, tracer, logger, config); + setTimeout(() => { + const rootSpan = spyOnEnd.args[0][0][0] as ReadableSpan; + const fetchSpan = spyOnEnd.args[1][0][0] as ReadableSpan; + assert.strictEqual(rootSpan.name, 'documentFetch'); + assert.strictEqual(fetchSpan.name, 'documentLoad'); + + assert.strictEqual( + rootSpan.spanContext.traceId, + 'ab42124a3c573678d4d8b21ba52df3bf' + ); + assert.strictEqual( + fetchSpan.spanContext.traceId, + 'ab42124a3c573678d4d8b21ba52df3bf' + ); + + assert.strictEqual(spyOnEnd.callCount, 2); + done(); + }, 1); + }); + afterEach(() => { + delete ((window as unknown) as WindowWithTrace).traceparent; + }); + }); + afterEach(() => { spyExport.restore(); }); diff --git a/packages/opentelemetry-plugin-document-load/test/utils.test.ts b/packages/opentelemetry-plugin-document-load/test/utils.test.ts new file mode 100644 index 0000000000..d08dd58d93 --- /dev/null +++ b/packages/opentelemetry-plugin-document-load/test/utils.test.ts @@ -0,0 +1,112 @@ +/*! + * Copyright 2019, OpenTelemetry Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * https://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License 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. + */ + +import * as assert from 'assert'; + +import * as types from '@opentelemetry/types'; +import * as utils from '../src/utils'; + +const traceParentSampled = + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01'; +const traceParentUnSampled = + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00'; +const traceParentBadTraceFlags = + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-02'; +const traceParentBadSpanId = + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5ab-00'; +const traceParentBadTraceId = + '00-ab42124a3c573678d4d8b21ba52df3b-d21f7bc17caa5aba-00'; + +describe('utils', () => { + describe('extractServerContext', () => { + describe('when traceParent is correct', () => { + it('should create context span with traceId', () => { + const spanContext = utils.extractServerContext(traceParentSampled); + assert.strictEqual( + spanContext && spanContext.traceId, + 'ab42124a3c573678d4d8b21ba52df3bf', + 'Trace Id is correct' + ); + }); + it('should create context span with spanId', () => { + const spanContext = utils.extractServerContext(traceParentSampled); + assert.strictEqual( + spanContext && spanContext.spanId, + 'd21f7bc17caa5aba', + 'Span Id is correct' + ); + }); + it('should create context span with traceFlags SAMPLED', () => { + const spanContext = utils.extractServerContext(traceParentSampled); + assert.strictEqual( + spanContext && spanContext.traceFlags, + types.TraceFlags.SAMPLED, + 'Trace Flag is SAMPLED' + ); + }); + it('should create context span with traceFlags UNSAMPLED', () => { + const spanContext = utils.extractServerContext(traceParentUnSampled); + assert.strictEqual( + spanContext && spanContext.traceFlags, + types.TraceFlags.UNSAMPLED, + 'Trace Flag is UNSAMPLED' + ); + }); + }); + describe('when traceParent has incorrect traceFlags', () => { + it('should NOT create context span', () => { + const spanContext = utils.extractServerContext( + traceParentBadTraceFlags + ); + assert.strictEqual(spanContext, undefined); + }); + }); + describe('when traceParent has incorrect spanId', () => { + it('should NOT create context span', () => { + const spanContext = utils.extractServerContext(traceParentBadSpanId); + assert.strictEqual(spanContext, undefined); + }); + }); + describe('when traceParent has incorrect traceId', () => { + it('should NOT create context span', () => { + const spanContext = utils.extractServerContext(traceParentBadTraceId); + assert.strictEqual(spanContext, undefined); + }); + }); + describe('when traceParent has incorrect structure', () => { + it('should NOT create context span', () => { + assert.strictEqual( + utils.extractServerContext( + 'ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00' + ), + undefined + ); + assert.strictEqual( + utils.extractServerContext( + '0-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00' + ), + undefined + ); + assert.strictEqual( + utils.extractServerContext( + '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01-foo' + ), + undefined + ); + }); + }); + }); +}); From 20735e2892e1ae6be7c7e8843982b0433b363d2a Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Mon, 4 Nov 2019 18:31:57 +0100 Subject: [PATCH 2/8] chore: exposing the parse functionality --- .../src/context/propagation/HttpTraceContext.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts index f964f2273e..435a9258e6 100644 --- a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts +++ b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts @@ -25,7 +25,7 @@ const VALID_SPANID_REGEX = /^[0-9a-f]{16}$/i; const INVALID_ID_REGEX = /^0+$/i; const VERSION = '00'; -function parse(traceParent: string): SpanContext | null { +export function parseTraceParent(traceParent: string): SpanContext | null { const match = traceParent.match(VALID_TRACE_PARENT_REGEX); if (!match) return null; const parts = traceParent.split('-'); @@ -87,7 +87,7 @@ export class HttpTraceContext implements HttpTextFormat { const traceParent = Array.isArray(traceParentHeader) ? traceParentHeader[0] : traceParentHeader; - const spanContext = parse(traceParent); + const spanContext = parseTraceParent(traceParent); if (!spanContext) return null; spanContext.isRemote = true; From d7c31949d5ad3d3cd3f7648bbef692a28c1d1acc Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Mon, 4 Nov 2019 18:32:20 +0100 Subject: [PATCH 3/8] chore: refactored to use existing functionality --- .../src/documentLoad.ts | 11 +- .../src/utils.ts | 42 ------- .../test/utils.test.ts | 112 ------------------ 3 files changed, 8 insertions(+), 157 deletions(-) delete mode 100644 packages/opentelemetry-plugin-document-load/test/utils.test.ts diff --git a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts index 89e6c09307..08ccc90f55 100644 --- a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts +++ b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts @@ -14,7 +14,11 @@ * limitations under the License. */ -import { BasePlugin, otperformance } from '@opentelemetry/core'; +import { + BasePlugin, + otperformance, + parseTraceParent, +} from '@opentelemetry/core'; import { PluginConfig, Span, SpanOptions } from '@opentelemetry/types'; import { AttributeNames } from './enums/AttributeNames'; import { PerformanceTimingNames as PTN } from './enums/PerformanceTimingNames'; @@ -23,7 +27,7 @@ import { PerformanceLegacy, WindowWithTrace, } from './types'; -import { hasKey, extractServerContext } from './utils'; +import { hasKey } from './utils'; /** * This class represents a document load plugin @@ -81,7 +85,8 @@ export class DocumentLoad extends BasePlugin { */ private _collectPerformance() { const windowWithTrace: WindowWithTrace = (window as unknown) as WindowWithTrace; - const serverContext = extractServerContext(windowWithTrace.traceparent); + const serverContext = + parseTraceParent(windowWithTrace.traceparent || '') || undefined; const entries = this._getEntries(); diff --git a/packages/opentelemetry-plugin-document-load/src/utils.ts b/packages/opentelemetry-plugin-document-load/src/utils.ts index ad3b574fe9..cb585de753 100644 --- a/packages/opentelemetry-plugin-document-load/src/utils.ts +++ b/packages/opentelemetry-plugin-document-load/src/utils.ts @@ -14,9 +14,6 @@ * limitations under the License. */ -import * as types from '@opentelemetry/types'; -import { TraceFlags } from '@opentelemetry/types'; - /** * Helper function to be able to use enum as typed key in type and in interface when using forEach * @param obj @@ -25,42 +22,3 @@ import { TraceFlags } from '@opentelemetry/types'; export function hasKey(obj: O, key: keyof any): key is keyof O { return key in obj; } - -// '{version}-{traceId}-{spanId}-{TraceFlags}'; -const TRACE_PARENT_REGEX = /^[\da-f]{2}-([\da-f]{32})-([\da-f]{16})-([\da-f]{2})$/; - -/** - * Extracts information from [traceParent] window property and converts it into {@link types.SpanContext} - * @param traceParent - A window property that comes from server. - * It should be dynamically generated server side to have the server's request trace Id, - * a parent span Id that was set on the server's request span, - * and the trace flags to indicate the server's sampling decision - * (01 = sampled, 00 = not sampled). - * for example: '{version}-{traceId}-{spanId}-{sampleDecision}' - * For more information see {@link https://www.w3.org/TR/trace-context/} - */ -export function extractServerContext( - traceParent: string = '' -): types.SpanContext | undefined { - const match = - typeof traceParent === 'string' && traceParent.match(TRACE_PARENT_REGEX); - if (!match) { - return; - } - const traceId = match[1]; - const spanId = match[2]; - let traceFlags; - - if (match[3] === '00') { - traceFlags = TraceFlags.UNSAMPLED; - } else if (match[3] === '01') { - traceFlags = TraceFlags.SAMPLED; - } - - let spanContext: types.SpanContext | undefined; - if (traceId && spanId && typeof traceFlags !== 'undefined') { - spanContext = { traceId, spanId, traceFlags }; - } - - return spanContext; -} diff --git a/packages/opentelemetry-plugin-document-load/test/utils.test.ts b/packages/opentelemetry-plugin-document-load/test/utils.test.ts deleted file mode 100644 index d08dd58d93..0000000000 --- a/packages/opentelemetry-plugin-document-load/test/utils.test.ts +++ /dev/null @@ -1,112 +0,0 @@ -/*! - * Copyright 2019, OpenTelemetry Authors - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * https://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License 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. - */ - -import * as assert from 'assert'; - -import * as types from '@opentelemetry/types'; -import * as utils from '../src/utils'; - -const traceParentSampled = - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01'; -const traceParentUnSampled = - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00'; -const traceParentBadTraceFlags = - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-02'; -const traceParentBadSpanId = - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5ab-00'; -const traceParentBadTraceId = - '00-ab42124a3c573678d4d8b21ba52df3b-d21f7bc17caa5aba-00'; - -describe('utils', () => { - describe('extractServerContext', () => { - describe('when traceParent is correct', () => { - it('should create context span with traceId', () => { - const spanContext = utils.extractServerContext(traceParentSampled); - assert.strictEqual( - spanContext && spanContext.traceId, - 'ab42124a3c573678d4d8b21ba52df3bf', - 'Trace Id is correct' - ); - }); - it('should create context span with spanId', () => { - const spanContext = utils.extractServerContext(traceParentSampled); - assert.strictEqual( - spanContext && spanContext.spanId, - 'd21f7bc17caa5aba', - 'Span Id is correct' - ); - }); - it('should create context span with traceFlags SAMPLED', () => { - const spanContext = utils.extractServerContext(traceParentSampled); - assert.strictEqual( - spanContext && spanContext.traceFlags, - types.TraceFlags.SAMPLED, - 'Trace Flag is SAMPLED' - ); - }); - it('should create context span with traceFlags UNSAMPLED', () => { - const spanContext = utils.extractServerContext(traceParentUnSampled); - assert.strictEqual( - spanContext && spanContext.traceFlags, - types.TraceFlags.UNSAMPLED, - 'Trace Flag is UNSAMPLED' - ); - }); - }); - describe('when traceParent has incorrect traceFlags', () => { - it('should NOT create context span', () => { - const spanContext = utils.extractServerContext( - traceParentBadTraceFlags - ); - assert.strictEqual(spanContext, undefined); - }); - }); - describe('when traceParent has incorrect spanId', () => { - it('should NOT create context span', () => { - const spanContext = utils.extractServerContext(traceParentBadSpanId); - assert.strictEqual(spanContext, undefined); - }); - }); - describe('when traceParent has incorrect traceId', () => { - it('should NOT create context span', () => { - const spanContext = utils.extractServerContext(traceParentBadTraceId); - assert.strictEqual(spanContext, undefined); - }); - }); - describe('when traceParent has incorrect structure', () => { - it('should NOT create context span', () => { - assert.strictEqual( - utils.extractServerContext( - 'ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00' - ), - undefined - ); - assert.strictEqual( - utils.extractServerContext( - '0-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-00' - ), - undefined - ); - assert.strictEqual( - utils.extractServerContext( - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01-foo' - ), - undefined - ); - }); - }); - }); -}); From 865c50a37d9d078bc42ad01876ceca9d6325f320 Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Mon, 4 Nov 2019 18:37:33 +0100 Subject: [PATCH 4/8] chore: adding jsdoc to exported function --- .../src/context/propagation/HttpTraceContext.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts index 435a9258e6..1d2bd356ea 100644 --- a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts +++ b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts @@ -25,6 +25,16 @@ const VALID_SPANID_REGEX = /^[0-9a-f]{16}$/i; const INVALID_ID_REGEX = /^0+$/i; const VERSION = '00'; +/** + * Parses information from [traceParent] window property and converts it into {@link SpanContext} + * @param traceParent - A window property that comes from server. + * It should be dynamically generated server side to have the server's request trace Id, + * a parent span Id that was set on the server's request span, + * and the trace flags to indicate the server's sampling decision + * (01 = sampled, 00 = not sampled). + * for example: '{version}-{traceId}-{spanId}-{sampleDecision}' + * For more information see {@link https://www.w3.org/TR/trace-context/} + */ export function parseTraceParent(traceParent: string): SpanContext | null { const match = traceParent.match(VALID_TRACE_PARENT_REGEX); if (!match) return null; From 5393ac7f029e1857624349032a172619ed10f845 Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Mon, 4 Nov 2019 19:18:53 +0100 Subject: [PATCH 5/8] chore: updating readme with example for traceparent --- .../README.md | 23 +++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/packages/opentelemetry-plugin-document-load/README.md b/packages/opentelemetry-plugin-document-load/README.md index cfc8346618..823b6bf4b2 100644 --- a/packages/opentelemetry-plugin-document-load/README.md +++ b/packages/opentelemetry-plugin-document-load/README.md @@ -29,6 +29,28 @@ const webTracer = new WebTracer({ webTracer.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter())); ``` +## Optional: Send a trace parent from your server +This plugin supports connecting the server side spans for the initial HTML load with the client side span for the load from the browser's timing API. This works by having the server send its parent trace context (trace ID, span ID and trace sampling decision) to the client. + +Because the browser does not send a trace context header for the initial page navigation, the server needs to fake a trace context header in a middleware and then send that trace context header back to the client as a global *traceparent* variable. The *traceparent* variable should be in the [trace context W3C draft format][trace-context-url] . For example: + +```html + ... + + +``` + ## Useful links - For more information on OpenTelemetry, visit: - For more about OpenTelemetry JavaScript: @@ -48,3 +70,4 @@ Apache 2.0 - See [LICENSE][license-url] for more information. [devDependencies-url]: https://david-dm.org/open-telemetry/opentelemetry-js?path=packages%2Fopentelemetry-plugin-document-load&type=dev [npm-url]: https://www.npmjs.com/package/@opentelemetry/plugin-document-load [npm-img]: https://badge.fury.io/js/%40opentelemetry%2Fplugin-document-load.svg +[trace-context-url]: https://www.w3.org/TR/trace-context From f8dc8e1d32da95b46bccc0c549a3c2c616b5cb05 Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Wed, 6 Nov 2019 23:48:31 +0100 Subject: [PATCH 6/8] chore: moving the traceparent to meta instead of window --- examples/tracer-web/index.html | 20 +++++++++------- .../README.md | 24 ++++++++++++------- .../src/documentLoad.ts | 13 +++++----- .../src/types.ts | 7 ------ .../test/documentLoad.test.ts | 23 ++++++++++++++---- 5 files changed, 50 insertions(+), 37 deletions(-) diff --git a/examples/tracer-web/index.html b/examples/tracer-web/index.html index 91a5053f2b..4e9afa7bd6 100644 --- a/examples/tracer-web/index.html +++ b/examples/tracer-web/index.html @@ -6,19 +6,21 @@ Web Tracer Example + + + - Example of using Web Tracer with document load plugin and console exporter diff --git a/packages/opentelemetry-plugin-document-load/README.md b/packages/opentelemetry-plugin-document-load/README.md index 823b6bf4b2..a3a8d30533 100644 --- a/packages/opentelemetry-plugin-document-load/README.md +++ b/packages/opentelemetry-plugin-document-load/README.md @@ -32,19 +32,25 @@ webTracer.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter())); ## Optional: Send a trace parent from your server This plugin supports connecting the server side spans for the initial HTML load with the client side span for the load from the browser's timing API. This works by having the server send its parent trace context (trace ID, span ID and trace sampling decision) to the client. -Because the browser does not send a trace context header for the initial page navigation, the server needs to fake a trace context header in a middleware and then send that trace context header back to the client as a global *traceparent* variable. The *traceparent* variable should be in the [trace context W3C draft format][trace-context-url] . For example: +Because the browser does not send a trace context header for the initial page navigation, the server needs to fake a trace context header in a middleware and then send that trace context header back to the client as a meta tag *traceparent* . The *traceparent* meta tag should be in the [trace context W3C draft format][trace-context-url] . For example: ```html ... + + + + + + ... diff --git a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts index 08ccc90f55..cb90b1d3c1 100644 --- a/packages/opentelemetry-plugin-document-load/src/documentLoad.ts +++ b/packages/opentelemetry-plugin-document-load/src/documentLoad.ts @@ -18,15 +18,12 @@ import { BasePlugin, otperformance, parseTraceParent, + TRACE_PARENT_HEADER, } from '@opentelemetry/core'; import { PluginConfig, Span, SpanOptions } from '@opentelemetry/types'; import { AttributeNames } from './enums/AttributeNames'; import { PerformanceTimingNames as PTN } from './enums/PerformanceTimingNames'; -import { - PerformanceEntries, - PerformanceLegacy, - WindowWithTrace, -} from './types'; +import { PerformanceEntries, PerformanceLegacy } from './types'; import { hasKey } from './utils'; /** @@ -84,9 +81,11 @@ export class DocumentLoad extends BasePlugin { * Collects information about performance and creates appropriate spans */ private _collectPerformance() { - const windowWithTrace: WindowWithTrace = (window as unknown) as WindowWithTrace; + const metaElement = [...document.getElementsByTagName('meta')].find( + e => e.getAttribute('name') === TRACE_PARENT_HEADER + ); const serverContext = - parseTraceParent(windowWithTrace.traceparent || '') || undefined; + parseTraceParent((metaElement && metaElement.content) || '') || undefined; const entries = this._getEntries(); diff --git a/packages/opentelemetry-plugin-document-load/src/types.ts b/packages/opentelemetry-plugin-document-load/src/types.ts index afafe7fc00..cd99cb6e9c 100644 --- a/packages/opentelemetry-plugin-document-load/src/types.ts +++ b/packages/opentelemetry-plugin-document-load/src/types.ts @@ -48,10 +48,3 @@ export type PerformanceEntries = { export interface PerformanceLegacy { timing?: PerformanceEntries; } - -/** - * A window object with traceparent information from server - */ -export interface WindowWithTrace { - traceparent?: string; -} diff --git a/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts b/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts index 30b9c3370c..94d75d5a7f 100644 --- a/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts +++ b/packages/opentelemetry-plugin-document-load/test/documentLoad.test.ts @@ -21,7 +21,7 @@ import * as assert from 'assert'; import * as sinon from 'sinon'; -import { ConsoleLogger } from '@opentelemetry/core'; +import { ConsoleLogger, TRACE_PARENT_HEADER } from '@opentelemetry/core'; import { BasicTracer, ReadableSpan, @@ -33,7 +33,6 @@ import { Logger, PluginConfig } from '@opentelemetry/types'; import { ExportResult } from '../../opentelemetry-base/build/src'; import { DocumentLoad } from '../src'; import { PerformanceTimingNames as PTN } from '../src/enums/PerformanceTimingNames'; -import { WindowWithTrace } from '../src/types'; export class DummyExporter implements SpanExporter { export( @@ -240,9 +239,23 @@ describe('DocumentLoad Plugin', () => { }); describe('AND window has information about server root span', () => { + let spyGetElementsByTagName: any; beforeEach(() => { - ((window as unknown) as WindowWithTrace).traceparent = - '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01'; + const element = { + content: '00-ab42124a3c573678d4d8b21ba52df3bf-d21f7bc17caa5aba-01', + getAttribute: (value: string) => { + if (value === 'name') { + return TRACE_PARENT_HEADER; + } + return undefined; + }, + }; + + spyGetElementsByTagName = sinon.stub( + window.document, + 'getElementsByTagName' + ); + spyGetElementsByTagName.withArgs('meta').returns([element]); }); it('should create a root span with server context traceId', done => { const spyOnEnd = sinon.spy(dummyExporter, 'export'); @@ -267,7 +280,7 @@ describe('DocumentLoad Plugin', () => { }, 1); }); afterEach(() => { - delete ((window as unknown) as WindowWithTrace).traceparent; + spyGetElementsByTagName.restore(); }); }); From feb44986374b965711d4c88341a636355c910c8f Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Thu, 7 Nov 2019 00:04:57 +0100 Subject: [PATCH 7/8] chore: updating the jsdoc --- .../src/context/propagation/HttpTraceContext.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts index 1d2bd356ea..39f4fc12f1 100644 --- a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts +++ b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts @@ -27,7 +27,7 @@ const VERSION = '00'; /** * Parses information from [traceParent] window property and converts it into {@link SpanContext} - * @param traceParent - A window property that comes from server. + * @param traceParent - A meta property that comes from server. * It should be dynamically generated server side to have the server's request trace Id, * a parent span Id that was set on the server's request span, * and the trace flags to indicate the server's sampling decision From 0a19860dae56421713c44840f37f83950cd1c635 Mon Sep 17 00:00:00 2001 From: Bartlomiej Obecny Date: Fri, 8 Nov 2019 18:29:57 +0100 Subject: [PATCH 8/8] chore: updating the copy as suggested --- .../src/context/propagation/HttpTraceContext.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts index 39f4fc12f1..b003572f2b 100644 --- a/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts +++ b/packages/opentelemetry-core/src/context/propagation/HttpTraceContext.ts @@ -26,7 +26,7 @@ const INVALID_ID_REGEX = /^0+$/i; const VERSION = '00'; /** - * Parses information from [traceParent] window property and converts it into {@link SpanContext} + * Parses information from the [traceparent] span tag and converts it into {@link SpanContext} * @param traceParent - A meta property that comes from server. * It should be dynamically generated server side to have the server's request trace Id, * a parent span Id that was set on the server's request span,