Add integration tests for multiple event listener attachments

Author: Luca Forstner

packages/integration-tests/suites/public-api/instrumentation/eventListener-instrumentation-behaviour/subject.js

@@ -0,0 +1,23 @@
+// Simple function event listener
+const eventListener1 = () => {
+  // Trigger something that puppeteer can listen to - like console.log
+  console.log('eventListener1');
+};
+
+// Attach event listener twice
+window.addEventListener('click', eventListener1);
+window.addEventListener('click', eventListener1);
+
+// Event listener that has handleEvent() method: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#listener
+class EventHandlerClass {
+  handleEvent() {
+    // Trigger something that puppeteer can listen to - like console.log
+    console.log('eventListener2');
+  }
+}
+
+const eventListener2 = new EventHandlerClass();
+
+// Attach event listener twice
+window.addEventListener('click', eventListener2, { passive: true, capture: false });
+window.addEventListener('click', eventListener2, { passive: true, capture: false });

packages/integration-tests/suites/public-api/instrumentation/eventListener-instrumentation-behaviour/test.ts

@@ -0,0 +1,34 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+
+sentryTest('should attach the same event listener only once', async ({ getLocalTestPath, page }) => {
+  const url = await getLocalTestPath({ testDir: __dirname });
+  await page.goto(url);
+
+  const testCompletionPromise = new Promise<void>(resolve => {
+    let eventListener1Calls = 0;
+    let eventListener2Calls = 0;
+
+    page.on('console', async msg => {
+      const msgText = msg.text();
+
+      if (msgText === 'eventListener1') {
+        eventListener1Calls = eventListener1Calls + 1;
+      } else if (msgText === 'eventListener2') {
+        eventListener2Calls = eventListener2Calls + 1;
+      } else if (msgText === 'done') {
+        expect(eventListener1Calls).toBe(2);
+        expect(eventListener2Calls).toBe(2);
+        resolve();
+      }
+    });
+  });
+
+  // Trigger event listeners twice and signal completion afterwards
+  await page.evaluate('document.body.click()');
+  await page.evaluate('document.body.click()');
+  await page.evaluate('console.log("done")');
+
+  return testCompletionPromise;
+});

packages/integration-tests/suites/public-api/instrumentation/eventListener/subject.js

@@ -0,0 +1,5 @@
+window.addEventListener('click', () => {
+  throw new Error('event_listener_error');
+});
+
+document.body.click();

packages/integration-tests/suites/public-api/instrumentation/eventListener/test.ts

@@ -0,0 +1,24 @@
+import { expect } from '@playwright/test';
+import { Event } from '@sentry/types';
+
+import { sentryTest } from '../../../../utils/fixtures';
+import { getFirstSentryEnvelopeRequest } from '../../../../utils/helpers';
+
+sentryTest('should capture an error thrown in an event handler', 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: 'event_listener_error',
+    mechanism: {
+      type: 'instrument',
+      handled: true,
+    },
+    stacktrace: {
+      frames: expect.any(Array),
+    },
+  });
+});

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

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

packages/integration-tests/suites/tracing/baggage/test.ts

@@ -1,5 +1,5 @@
 import { expect } from '@playwright/test';
-import { Event, EventEnvelopeHeaders } from '@sentry/types';
+import { EventEnvelopeHeaders } from '@sentry/types';
 
 import { sentryTest } from '../../../utils/fixtures';
 import { envelopeHeaderRequestParser, getFirstSentryEnvelopeRequest } from '../../../utils/helpers';