feat: API changes (#1497)

* feat: API changes

- Add hint parameter
- Remove eventprocessors from hub

* feat: Return event_id from capture calls

* feat: Add lastEventId

* fix: Remove keepalive from browser

Create only one instance of transport

* fix: Transports, Add additional info in hint for global errros

* feat: Rebase master with beacon transport

* fix: Remove debugger and fix rollup names...

* feat: Bring beforeBreadcrumb back

* test: Fix integration tests for breadcrumbs

* fix: Linting erros

* fix: Use object literal for data

* fix: Linting

Author: HazAT

packages/browser/rollup.config.js

@@ -58,12 +58,12 @@ export default [
   },
   Object.assign({}, bundleConfig, {
     output: Object.assign({}, bundleConfig.output, {
-      file: 'build/bundle.min.js',
+      file: 'build/bundle.js',
     }),
   }),
   Object.assign({}, bundleConfig, {
     output: Object.assign({}, bundleConfig.output, {
-      file: 'build/bundle.js',
+      file: 'build/bundle.min.js',
     }),
     // Uglify has to be at the end of compilation, BUT before the license banner
     plugins: bundleConfig.plugins

packages/browser/src/backend.ts

@@ -1,10 +1,10 @@
 import { Backend, logger, Options, SentryError } from '@sentry/core';
-import { SentryEvent, SentryResponse, Status } from '@sentry/types';
+import { SentryEvent, SentryEventHint, SentryResponse, Severity, Status, Transport } from '@sentry/types';
 import { isDOMError, isDOMException, isError, isErrorEvent, isPlainObject } from '@sentry/utils/is';
-import { supportsFetch } from '@sentry/utils/supports';
+import { supportsBeacon, supportsFetch } from '@sentry/utils/supports';
 import { eventFromPlainObject, eventFromStacktrace, prepareFramesForEvent } from './parsers';
 import { computeStackTrace } from './tracekit';
-import { FetchTransport, XHRTransport } from './transports';
+import { BeaconTransport, FetchTransport, XHRTransport } from './transports';
 
 /**
  * Configuration options for the Sentry Browser SDK.
@@ -37,6 +37,9 @@ export class BrowserBackend implements Backend {
   /** Creates a new browser backend instance. */
   public constructor(private readonly options: BrowserOptions = {}) {}
 
+  /** Cached transport used internally. */
+  private transport?: Transport;
+
   /**
    * @inheritDoc
    */
@@ -57,7 +60,7 @@ export class BrowserBackend implements Backend {
   /**
    * @inheritDoc
    */
-  public async eventFromException(exception: any, syntheticException: Error | null): Promise<SentryEvent> {
+  public async eventFromException(exception: any, hint?: SentryEventHint): Promise<SentryEvent> {
     let event;
 
     if (isErrorEvent(exception as ErrorEvent) && (exception as ErrorEvent).error) {
@@ -74,16 +77,16 @@ export class BrowserBackend implements Backend {
       const name = ex.name || (isDOMError(ex) ? 'DOMError' : 'DOMException');
       const message = ex.message ? `${name}: ${ex.message}` : name;
 
-      event = await this.eventFromMessage(message, syntheticException);
+      event = await this.eventFromMessage(message, undefined, hint);
     } else if (isError(exception as Error)) {
       // we have a real Error object, do nothing
       event = eventFromStacktrace(computeStackTrace(exception as Error));
-    } else if (isPlainObject(exception as {})) {
+    } else if (isPlainObject(exception as {}) && hint && hint.syntheticException) {
       // If it is plain Object, serialize it manually and extract options
       // This will allow us to group events based on top-level keys
       // which is much better than creating new group when any key/value change
       const ex = exception as {};
-      event = eventFromPlainObject(ex, syntheticException);
+      event = eventFromPlainObject(ex, hint.syntheticException);
     } else {
       // If none of previous checks were valid, then it means that
       // it's not a DOMError/DOMException
@@ -92,11 +95,12 @@ export class BrowserBackend implements Backend {
       // it's not an Error
       // So bail out and capture it as a simple message:
       const ex = exception as string;
-      event = await this.eventFromMessage(ex, syntheticException);
+      event = await this.eventFromMessage(ex, undefined, hint);
     }
 
     event = {
       ...event,
+      event_id: hint && hint.event_id,
       exception: {
         ...event.exception,
         mechanism: {
@@ -112,14 +116,16 @@ export class BrowserBackend implements Backend {
   /**
    * @inheritDoc
    */
-  public async eventFromMessage(message: string, syntheticException: Error | null): Promise<SentryEvent> {
+  public async eventFromMessage(message: string, level?: Severity, hint?: SentryEventHint): Promise<SentryEvent> {
     const event: SentryEvent = {
+      event_id: hint && hint.event_id,
       fingerprint: [message],
+      level,
       message,
     };
 
-    if (this.options.attachStacktrace && syntheticException) {
-      const stacktrace = computeStackTrace(syntheticException);
+    if (this.options.attachStacktrace && hint && hint.syntheticException) {
+      const stacktrace = computeStackTrace(hint.syntheticException);
       const frames = prepareFramesForEvent(stacktrace.stack);
       event.stacktrace = {
         frames,
@@ -139,15 +145,23 @@ export class BrowserBackend implements Backend {
       return { status: Status.Skipped };
     }
 
-    const transportOptions = this.options.transportOptions ? this.options.transportOptions : { dsn: this.options.dsn };
-
-    const transport = this.options.transport
-      ? new this.options.transport({ dsn: this.options.dsn })
-      : supportsFetch()
-        ? new FetchTransport(transportOptions)
-        : new XHRTransport(transportOptions);
+    if (!this.transport) {
+      const transportOptions = this.options.transportOptions
+        ? this.options.transportOptions
+        : { dsn: this.options.dsn };
+
+      if (this.options.transport) {
+        this.transport = new this.options.transport({ dsn: this.options.dsn });
+      } else if (supportsBeacon()) {
+        this.transport = new BeaconTransport(transportOptions);
+      } else if (supportsFetch()) {
+        this.transport = new FetchTransport(transportOptions);
+      } else {
+        this.transport = new XHRTransport(transportOptions);
+      }
+    }
 
-    return transport.send(event);
+    return this.transport.send(event);
   }
 
   /**

packages/browser/src/integrations/dedupe.ts

@@ -1,5 +1,5 @@
 import { logger } from '@sentry/core';
-import { getCurrentHub } from '@sentry/hub';
+import { getCurrentHub, Scope } from '@sentry/hub';
 import { Integration, SentryEvent, SentryException, StackFrame } from '@sentry/types';
 
 /** Deduplication filter */
@@ -18,17 +18,19 @@ export class Dedupe implements Integration {
    * @inheritDoc
    */
   public install(): void {
-    getCurrentHub().addEventProcessor(async (event: SentryEvent) => {
-      // Juuust in case something goes wrong
-      try {
-        if (this.shouldDropEvent(event)) {
-          return null;
+    getCurrentHub().configureScope((scope: Scope) => {
+      scope.addEventProcessor(async (event: SentryEvent) => {
+        // Juuust in case something goes wrong
+        try {
+          if (this.shouldDropEvent(event)) {
+            return null;
+          }
+        } catch (_oO) {
+          return (this.previousEvent = event);
         }
-      } catch (_oO) {
-        return (this.previousEvent = event);
-      }
 
-      return (this.previousEvent = event);
+        return (this.previousEvent = event);
+      });
     });
   }
 

packages/browser/src/integrations/globalhandlers.ts

@@ -1,5 +1,5 @@
 import { logger } from '@sentry/core';
-import { captureEvent } from '@sentry/minimal';
+import { getCurrentHub } from '@sentry/hub';
 import { Integration, SentryEvent } from '@sentry/types';
 import { eventFromStacktrace } from '../parsers';
 import {
@@ -29,7 +29,7 @@ export class GlobalHandlers implements Integration {
    * @inheritDoc
    */
   public install(): void {
-    subscribe((stack: TraceKitStackTrace) => {
+    subscribe((stack: TraceKitStackTrace, _: boolean, error: Error) => {
       // TODO: use stack.context to get a valuable information from TraceKit, eg.
       // [
       //   0: "  })"
@@ -47,7 +47,7 @@ export class GlobalHandlers implements Integration {
       if (shouldIgnoreOnError()) {
         return;
       }
-      captureEvent(this.eventFromGlobalHandler(stack));
+      getCurrentHub().captureEvent(this.eventFromGlobalHandler(stack), { originalException: error, data: { stack } });
     });
 
     if (this.options.onerror) {

packages/browser/src/integrations/helpers.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/hub';
+import { getCurrentHub, Scope } from '@sentry/hub';
 import { Mechanism, SentryEvent, SentryWrappedFunction } from '@sentry/types';
 import { isFunction } from '@sentry/utils/is';
 import { htmlTreeAsString } from '@sentry/utils/misc';
@@ -66,18 +66,20 @@ export function wrap(
       ignoreNextOnError();
 
       getCurrentHub().withScope(async () => {
-        getCurrentHub().addEventProcessor(async (event: SentryEvent) => {
-          const processedEvent = { ...event };
+        getCurrentHub().configureScope((scope: Scope) => {
+          scope.addEventProcessor(async (event: SentryEvent) => {
+            const processedEvent = { ...event };
 
-          if (options.mechanism) {
-            processedEvent.exception = processedEvent.exception || {};
-            processedEvent.exception.mechanism = options.mechanism;
-          }
+            if (options.mechanism) {
+              processedEvent.exception = processedEvent.exception || {};
+              processedEvent.exception.mechanism = options.mechanism;
+            }
 
-          return processedEvent;
+            return processedEvent;
+          });
         });
 
-        getCurrentHub().captureException(ex);
+        getCurrentHub().captureException(ex, { originalException: ex });
       });
 
       throw ex;

packages/browser/src/integrations/inboundfilters.ts

@@ -1,5 +1,5 @@
 import { logger } from '@sentry/core';
-import { getCurrentHub } from '@sentry/hub';
+import { getCurrentHub, Scope } from '@sentry/hub';
 import { Integration, SentryEvent } from '@sentry/types';
 import { isRegExp } from '@sentry/utils/is';
 import { BrowserOptions } from '../backend';
@@ -27,11 +27,13 @@ export class InboundFilters implements Integration {
   public install(options: BrowserOptions = {}): void {
     this.configureOptions(options);
 
-    getCurrentHub().addEventProcessor(async (event: SentryEvent) => {
-      if (this.shouldDropEvent(event)) {
-        return null;
-      }
-      return event;
+    getCurrentHub().configureScope((scope: Scope) => {
+      scope.addEventProcessor(async (event: SentryEvent) => {
+        if (this.shouldDropEvent(event)) {
+          return null;
+        }
+        return event;
+      });
     });
   }
 

packages/browser/src/integrations/sdkinformation.ts

@@ -1,4 +1,4 @@
-import { getCurrentHub } from '@sentry/hub';
+import { getCurrentHub, Scope } from '@sentry/hub';
 import { Integration, SentryEvent } from '@sentry/types';
 import { SDK_NAME, SDK_VERSION } from '../version';
 
@@ -13,19 +13,21 @@ export class SDKInformation implements Integration {
    * @inheritDoc
    */
   public install(): void {
-    getCurrentHub().addEventProcessor(async (event: SentryEvent) => ({
-      ...event,
-      sdk: {
-        name: SDK_NAME,
-        packages: [
-          ...((event.sdk && event.sdk.packages) || []),
-          {
-            name: 'npm:@sentry/browser',
-            version: SDK_VERSION,
-          },
-        ],
-        version: SDK_VERSION,
-      },
-    }));
+    getCurrentHub().configureScope((scope: Scope) => {
+      scope.addEventProcessor(async (event: SentryEvent) => ({
+        ...event,
+        sdk: {
+          name: SDK_NAME,
+          packages: [
+            ...((event.sdk && event.sdk.packages) || []),
+            {
+              name: 'npm:@sentry/browser',
+              version: SDK_VERSION,
+            },
+          ],
+          version: SDK_VERSION,
+        },
+      }));
+    });
   }
 }

packages/browser/src/tracekit/index.js

@@ -230,7 +230,6 @@ TraceKit.report = (function reportModuleWrapper() {
    * @memberof TraceKit.report
    */
   function traceKitWindowOnError(message, url, lineNo, columnNo, errorObj) {
-    debugger;
     var stack = null;
     // If 'errorObj' is ErrorEvent, get real Error from inside
     errorObj = isErrorEvent(errorObj) ? errorObj.error : errorObj;

packages/browser/src/transports/fetch.ts

@@ -14,7 +14,6 @@ export class FetchTransport extends BaseTransport {
   public async send(event: SentryEvent): Promise<SentryResponse> {
     const defaultOptions: RequestInit = {
       body: serialize(event),
-      keepalive: true,
       method: 'POST',
       // Despite all stars in the sky saying that Edge supports old draft syntax, aka 'never', 'always', 'origin' and 'default
       // https://caniuse.com/#feat=referrer-policy

packages/browser/test/index.test.ts

@@ -12,6 +12,7 @@ import {
   init,
   Scope,
   SentryEvent,
+  Status,
 } from '../src';
 
 const dsn = 'https://[email protected]/4291';
@@ -64,7 +65,7 @@ describe('SentryBrowser', () => {
     let s: sinon.SinonStub;
 
     beforeEach(() => {
-      s = stub(BrowserBackend.prototype, 'sendEvent').returns(Promise.resolve(200));
+      s = stub(BrowserBackend.prototype, 'sendEvent').returns(Promise.resolve({ status: Status.Success }));
     });
 
     afterEach(() => {
@@ -75,9 +76,10 @@ describe('SentryBrowser', () => {
       getCurrentHub().pushScope();
       getCurrentHub().bindClient(
         new BrowserClient({
-          afterSend: (event: SentryEvent) => {
+          beforeSend: (event: SentryEvent) => {
             expect(event.breadcrumbs!).to.have.lengthOf(2);
             done();
+            return event;
           },
           dsn,
         }),
@@ -95,7 +97,7 @@ describe('SentryBrowser', () => {
     let s: sinon.SinonStub;
 
     beforeEach(() => {
-      s = stub(BrowserBackend.prototype, 'sendEvent').returns(Promise.resolve(200));
+      s = stub(BrowserBackend.prototype, 'sendEvent').returns(Promise.resolve({ status: Status.Success }));
     });
 
     afterEach(() => {
@@ -106,13 +108,14 @@ describe('SentryBrowser', () => {
       getCurrentHub().pushScope();
       getCurrentHub().bindClient(
         new BrowserClient({
-          afterSend: (event: SentryEvent) => {
+          beforeSend: (event: SentryEvent) => {
             expect(event.exception).to.not.be.undefined;
             expect(event.exception!.values![0]).to.not.be.undefined;
             expect(event.exception!.values![0].type).to.equal('Error');
             expect(event.exception!.values![0].value).to.equal('test');
             expect(event.exception!.values![0].stacktrace).to.not.be.empty;
             done();
+            return event;
           },
           dsn,
         }),
@@ -129,10 +132,11 @@ describe('SentryBrowser', () => {
       getCurrentHub().pushScope();
       getCurrentHub().bindClient(
         new BrowserClient({
-          afterSend: (event: SentryEvent) => {
+          beforeSend: (event: SentryEvent) => {
             expect(event.message).to.equal('test');
             expect(event.exception).to.be.undefined;
             done();
+            return event;
           },
           dsn,
         }),
@@ -145,10 +149,11 @@ describe('SentryBrowser', () => {
       getCurrentHub().pushScope();
       getCurrentHub().bindClient(
         new BrowserClient({
-          afterSend: (event: SentryEvent) => {
+          beforeSend: (event: SentryEvent) => {
             expect(event.message).to.equal('event');
             expect(event.exception).to.be.undefined;
             done();
+            return event;
           },
           dsn,
         }),