Server side rendering support (#2010)

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

Author: ryhinchey

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

@@ -32,7 +32,17 @@ import { VERSION } from './version';
 // hard to say how long it should really wait, seems like 300ms is
 // safe enough
 const OBSERVER_WAIT_TIME_MS = 300;
-const urlNormalizingA = document.createElement('a');
+
+// Used to normalize relative URLs
+let a: HTMLAnchorElement | undefined;
+const getUrlNormalizingAnchor = () => {
+  if (!a) {
+    a = document.createElement('a');
+  }
+
+  return a;
+};
+
 /**
  * FetchPlugin Config
  */
@@ -359,11 +369,12 @@ export class FetchInstrumentation extends InstrumentationBase<
 
     const observer: PerformanceObserver = new PerformanceObserver(list => {
       const perfObsEntries = list.getEntries() as PerformanceResourceTiming[];
-      urlNormalizingA.href = spanUrl;
+      const urlNormalizingAnchor = getUrlNormalizingAnchor();
+      urlNormalizingAnchor.href = spanUrl;
       perfObsEntries.forEach(entry => {
         if (
           entry.initiatorType === 'fetch' &&
-          entry.name === urlNormalizingA.href
+          entry.name === urlNormalizingAnchor.href
         ) {
           entries.push(entry);
         }

packages/opentelemetry-web/src/utils.ts

@@ -29,7 +29,14 @@ import {
 import { HttpAttribute } from '@opentelemetry/semantic-conventions';
 
 // Used to normalize relative URLs
-const urlNormalizingA = document.createElement('a');
+let a: HTMLAnchorElement | undefined;
+const getUrlNormalizingAnchor = () => {
+  if (!a) {
+    a = document.createElement('a');
+  }
+
+  return a;
+};
 
 /**
  * Helper function to be able to use enum as typed key in type and in interface when using forEach
@@ -125,8 +132,9 @@ export function getResource(
   initiatorType?: string
 ): PerformanceResourceTimingInfo {
   // de-relativize the URL before usage (does no harm to absolute URLs)
-  urlNormalizingA.href = spanUrl;
-  spanUrl = urlNormalizingA.href;
+  const urlNormalizingAnchor = getUrlNormalizingAnchor();
+  urlNormalizingAnchor.href = spanUrl;
+  spanUrl = urlNormalizingAnchor.href;
 
   const filteredResources = filterResourcesForSpan(
     spanUrl,