Set headers from options in XHR/fetch transport (#2363)

* Set request headers to ones provided in transportOpts in XHR transport

* Rename variable in transport header object.

Co-Authored-By: Sijawusz Pur Rahnama <sija@sija.pl>

* Lint fixes

* Add headers to fetch transport with unit tests.

Co-authored-by: Sijawusz Pur Rahnama <sija@sija.pl>

Author: 2 people

packages/apm/test/span.test.ts

@@ -198,7 +198,9 @@ describe('Span', () => {
       spanOne.initFinishedSpans();
       const childSpanOne = spanOne.child();
       childSpanOne.finish();
-      hub.configureScope((scope) => { scope.setSpan(spanOne) })
+      hub.configureScope(scope => {
+        scope.setSpan(spanOne);
+      });
 
       const spanTwo = new Span({ transaction: 'testTwo', sampled: false }, hub);
       spanTwo.initFinishedSpans();

packages/browser/src/transports/fetch.ts

@@ -32,6 +32,10 @@ export class FetchTransport extends BaseTransport {
       referrerPolicy: (supportsReferrerPolicy() ? 'origin' : '') as ReferrerPolicy,
     };
 
+    if (this.options.headers !== undefined) {
+      defaultOptions.headers = this.options.headers;
+    }
+
     return this._buffer.add(
       new SyncPromise<Response>((resolve, reject) => {
         global

packages/browser/src/transports/xhr.ts

@@ -46,6 +46,11 @@ export class XHRTransport extends BaseTransport {
         };
 
         request.open('POST', this.url);
+        for (const header in this.options.headers) {
+          if (this.options.headers.hasOwnProperty(header)) {
+            request.setRequestHeader(header, this.options.headers[header]);
+          }
+        }
         request.send(JSON.stringify(event));
       }),
     );

packages/browser/test/unit/transports/fetch.test.ts

@@ -129,5 +129,31 @@ describe('FetchTransport', () => {
 
       dateStub.restore();
     });
+
+    it('passes in headers', async () => {
+      transport = new Transports.FetchTransport({
+        dsn: testDsn,
+        headers: {
+          Authorization: 'Basic GVzdDp0ZXN0Cg==',
+        },
+      });
+      const response = { status: 200 };
+
+      fetch.returns(Promise.resolve(response));
+
+      const res = await transport.sendEvent(payload);
+
+      expect(res.status).equal(Status.Success);
+      expect(
+        fetch.calledWith(transportUrl, {
+          body: JSON.stringify(payload),
+          headers: {
+            Authorization: 'Basic GVzdDp0ZXN0Cg==',
+          },
+          method: 'POST',
+          referrerPolicy: 'origin',
+        }),
+      ).equal(true);
+    });
   });
 });

packages/browser/test/unit/transports/xhr.test.ts

@@ -102,5 +102,23 @@ describe('XHRTransport', () => {
 
       dateStub.restore();
     });
+
+    it('passes in headers', async () => {
+      transport = new Transports.XHRTransport({
+        dsn: testDsn,
+        headers: {
+          Authorization: 'Basic GVzdDp0ZXN0Cg==',
+        },
+      });
+
+      server.respondWith('POST', transportUrl, [200, {}, '']);
+      const res = await transport.sendEvent(payload);
+      const request = server.requests[0];
+
+      expect(res.status).equal(Status.Success);
+      const requestHeaders: { [key: string]: string } = request.requestHeaders as { [key: string]: string };
+      const authHeaderLabel: string = 'Authorization';
+      expect(requestHeaders[authHeaderLabel]).equal('Basic GVzdDp0ZXN0Cg==');
+    });
   });
 });

packages/types/src/transport.ts

@@ -27,7 +27,7 @@ export interface TransportOptions {
   /** Sentry DSN */
   dsn: DsnLike;
   /** Define custom headers */
-  headers?: object;
+  headers?: { [key: string]: string };
   /** Set a HTTP proxy that should be used for outbound requests. */
   httpProxy?: string;
   /** Set a HTTPS proxy that should be used for outbound requests. */