test: Port onerror tests to playwright (#11666)

This ports `packages/browser/test/integration/suites/onerror.js` to
playwright. Because I couldn't throw top level errors without generating
script errors, I elected to simulate `window.onerror` being called.

Co-authored-by: Lukas Stracke <[email protected]>

Author: AbhiPrasad

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/init.js

@@ -0,0 +1,7 @@
+import * as Sentry from '@sentry/browser';
+
+window.Sentry = Sentry;
+
+Sentry.init({
+  dsn: 'https://[email protected]/1337',
+});

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/non-string-arg/subject.js

@@ -0,0 +1,8 @@
+function run() {
+  window.onerror({
+    type: 'error',
+    otherKey: 'hi',
+  });
+}
+
+run();

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/non-string-arg/test.ts

@@ -0,0 +1,27 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
+
+sentryTest(
+  'should catch onerror calls with non-string first argument gracefully',
+  async ({ getLocalTestPath, page }) => {
+    const url = await getLocalTestPath({ testDir: __dirname });
+
+    const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+    expect(eventData.exception?.values).toHaveLength(1);
+    expect(eventData.exception?.values?.[0]).toMatchObject({
+      type: 'Error',
+      value: 'Object captured as exception with keys: otherKey, type',
+      mechanism: {
+        type: 'onerror',
+        handled: false,
+      },
+      stacktrace: {
+        frames: expect.any(Array),
+      },
+    });
+  },
+);

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/rethrown/subject.js

@@ -0,0 +1,17 @@
+function run() {
+  try {
+    try {
+      foo();
+    } catch (e) {
+      Sentry.captureException(e);
+      throw e; // intentionally re-throw
+    }
+  } catch (e) {
+    // simulate window.onerror without generating a Script error
+    window.onerror('error', 'file.js', 1, 1, e);
+  }
+}
+
+run();
+
+Sentry.captureException(new Error('error 2'));

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/rethrown/test.ts

@@ -0,0 +1,42 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getMultipleSentryEnvelopeRequests } from '../../../../../utils/helpers';
+
+sentryTest(
+  'should NOT catch an exception already caught [but rethrown] via Sentry.captureException',
+  async ({ getLocalTestPath, page }) => {
+    const url = await getLocalTestPath({ testDir: __dirname });
+
+    const events = await getMultipleSentryEnvelopeRequests<Event>(page, 2, { url });
+
+    expect(events[0].exception?.values).toHaveLength(1);
+    expect(events[0].exception?.values?.[0]).toMatchObject({
+      type: 'ReferenceError',
+      // this exact error message varies between browsers, but they should all reference 'foo'
+      value: expect.stringContaining('foo'),
+      mechanism: {
+        type: 'generic',
+        handled: true,
+      },
+      stacktrace: {
+        frames: expect.any(Array),
+      },
+    });
+
+    // This is not a refernece error, but another generic error
+    expect(events[1].exception?.values).toHaveLength(1);
+    expect(events[1].exception?.values?.[0]).toMatchObject({
+      type: 'Error',
+      value: 'error 2',
+      mechanism: {
+        type: 'generic',
+        handled: true,
+      },
+      stacktrace: {
+        frames: expect.any(Array),
+      },
+    });
+  },
+);

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/syntax-errors/subject.js

@@ -0,0 +1,10 @@
+function run() {
+  try {
+    eval('foo{};');
+  } catch (e) {
+    // simulate window.onerror without generating a Script error
+    window.onerror('error', 'file.js', 1, 1, e);
+  }
+}
+
+run();

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/syntax-errors/test.ts

@@ -0,0 +1,24 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
+
+sentryTest('should catch syntax errors', async ({ getLocalTestPath, page }) => {
+  const url = await getLocalTestPath({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  expect(eventData.exception?.values).toHaveLength(1);
+  expect(eventData.exception?.values?.[0]).toMatchObject({
+    type: 'SyntaxError',
+    value: "Unexpected token '{'",
+    mechanism: {
+      type: 'onerror',
+      handled: false,
+    },
+    stacktrace: {
+      frames: expect.any(Array),
+    },
+  });
+});

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-errors/subject.js

@@ -0,0 +1,10 @@
+function run() {
+  try {
+    throw new Error('realError');
+  } catch (e) {
+    // simulate window.onerror without generating a Script error
+    window.onerror('error', 'file.js', 1, 1, e);
+  }
+}
+
+run();

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-errors/test.ts

@@ -0,0 +1,24 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
+
+sentryTest('should catch thrown errors', async ({ getLocalTestPath, page }) => {
+  const url = await getLocalTestPath({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  expect(eventData.exception?.values).toHaveLength(1);
+  expect(eventData.exception?.values?.[0]).toMatchObject({
+    type: 'Error',
+    value: 'realError',
+    mechanism: {
+      type: 'onerror',
+      handled: false,
+    },
+    stacktrace: {
+      frames: expect.any(Array),
+    },
+  });
+});

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-objects/subject.js

@@ -0,0 +1,10 @@
+function run() {
+  try {
+    throw { error: 'stuff is broken', somekey: 'ok' };
+  } catch (e) {
+    // simulate window.onerror without generating a Script error
+    window.onerror('error', 'file.js', 1, 1, e);
+  }
+}
+
+run();

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-objects/test.ts

@@ -0,0 +1,24 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
+
+sentryTest('should catch thrown objects', async ({ getLocalTestPath, page }) => {
+  const url = await getLocalTestPath({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  expect(eventData.exception?.values).toHaveLength(1);
+  expect(eventData.exception?.values?.[0]).toMatchObject({
+    type: 'Error',
+    value: 'Object captured as exception with keys: error, somekey',
+    mechanism: {
+      type: 'onerror',
+      handled: false,
+    },
+    stacktrace: {
+      frames: expect.any(Array),
+    },
+  });
+});

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-strings/subject.js

@@ -0,0 +1,10 @@
+function run() {
+  try {
+    throw 'stringError';
+  } catch (e) {
+    // simulate window.onerror without generating a Script error
+    window.onerror('error', 'file.js', 1, 1, e);
+  }
+}
+
+run();

dev-packages/browser-integration-tests/suites/public-api/instrumentation/onError/thrown-strings/test.ts

@@ -0,0 +1,26 @@
+import { expect } from '@playwright/test';
+import type { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../../utils/helpers';
+
+sentryTest('should catch thrown strings', async ({ getLocalTestPath, page }) => {
+  const url = await getLocalTestPath({ testDir: __dirname });
+
+  const eventData = await getFirstSentryEnvelopeRequest<Event>(page, url);
+
+  expect(eventData.exception?.values).toHaveLength(1);
+  expect(eventData.exception?.values?.[0]).toMatchObject({
+    type: 'Error',
+    value: 'stringError',
+    mechanism: {
+      type: 'onerror',
+      handled: false,
+    },
+    stacktrace: {
+      frames: expect.any(Array),
+    },
+  });
+
+  expect(eventData.exception?.values?.[0].stacktrace?.frames).toHaveLength(1);
+});