fix(plugin-fetch): check if PerformanceObserver exists (#1662)

Co-authored-by: Daniel Dyla <[email protected]>
Co-authored-by: Valentin Marchaud <[email protected]>

Author: 3 people

packages/opentelemetry-instrumentation-fetch/src/fetch.ts

@@ -198,6 +198,9 @@ export class FetchInstrumentation extends InstrumentationBase<
   ): void {
     let resources: PerformanceResourceTiming[] = resourcesObserver.entries;
     if (!resources.length) {
+      if (!performance.getEntriesByType) {
+        return;
+      }
       // fallback - either Observer is not available or it took longer
       // then OBSERVER_WAIT_TIME_MS and observer didn't collect enough
       // information
@@ -249,7 +252,8 @@ export class FetchInstrumentation extends InstrumentationBase<
     response: FetchResponse
   ) {
     const endTime = core.hrTime();
-    spanData.observer.disconnect();
+    spanData.observer?.disconnect();
+
     this._addFinalSpanAttributes(span, response);
 
     setTimeout(() => {
@@ -348,6 +352,11 @@ export class FetchInstrumentation extends InstrumentationBase<
   private _prepareSpanData(spanUrl: string): SpanData {
     const startTime = core.hrTime();
     const entries: PerformanceResourceTiming[] = [];
+
+    if (typeof window.PerformanceObserver === 'undefined') {
+      return { entries, startTime, spanUrl };
+    }
+
     const observer: PerformanceObserver = new PerformanceObserver(list => {
       const entries = list.getEntries() as PerformanceResourceTiming[];
       entries.forEach(entry => {

packages/opentelemetry-instrumentation-fetch/src/types.ts

@@ -39,7 +39,7 @@ export interface FetchError {
  */
 export interface SpanData {
   entries: PerformanceResourceTiming[];
-  observer: PerformanceObserver;
+  observer?: PerformanceObserver;
   spanUrl: string;
   startTime: api.HrTime;
 }

packages/opentelemetry-instrumentation-fetch/test/fetch.test.ts

@@ -121,7 +121,9 @@ describe('fetch', () => {
     done: any,
     fileUrl: string,
     config: FetchInstrumentationConfig,
-    method?: string
+    method?: string,
+    disablePerfObserver?: boolean,
+    disableGetEntries?: boolean
   ) => {
     sandbox = sinon.createSandbox();
     sandbox.useFakeTimers();
@@ -165,8 +167,16 @@ describe('fetch', () => {
       })
     );
 
-    const spyEntries = sandbox.stub(performance, 'getEntriesByType');
-    spyEntries.withArgs('resource').returns(resources);
+    if (disablePerfObserver) {
+      sandbox.stub(window, 'PerformanceObserver').value(undefined);
+    }
+    if (disableGetEntries) {
+      sandbox.stub(performance, 'getEntriesByType').value(undefined);
+    } else {
+      const spyEntries = sandbox.stub(performance, 'getEntriesByType');
+      spyEntries.withArgs('resource').returns(resources);
+    }
+
     fetchInstrumentation = new FetchInstrumentation(config);
     webTracerProviderWithZone = new WebTracerProvider({
       logLevel: core.LogLevel.ERROR,
@@ -586,4 +596,43 @@ describe('fetch', () => {
       );
     });
   });
+
+  describe('when PerformanceObserver is undefined', () => {
+    beforeEach(done => {
+      prepareData(done, url, {}, undefined, true, false);
+    });
+
+    afterEach(() => {
+      clearData();
+    });
+
+    it('should still create spans', () => {
+      assert.strictEqual(
+        exportSpy.args.length,
+        2,
+        `Wrong number of spans: ${exportSpy.args.length}`
+      );
+    });
+  });
+
+  describe('when PerformanceObserver and performance.getEntriesByType are undefined', () => {
+    beforeEach(done => {
+      prepareData(done, url, {}, undefined, true, true);
+    });
+    afterEach(() => {
+      clearData();
+    });
+    it('should capture fetch without preflight', () => {
+      assert.strictEqual(
+        exportSpy.args.length,
+        1,
+        `Wrong number of spans: ${exportSpy.args.length}`
+      );
+      assert.strictEqual(
+        exportSpy.args[0][0][0].name,
+        'HTTP GET',
+        'wrong span captured'
+      );
+    });
+  });
 });