Improve tests

Author: Luca Forstner

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

@@ -1,21 +1,21 @@
 // Simple function event listener
-const eventListener1 = () => {
-  testCallback1();
+const functionListener = () => {
+  functionListenerCallback();
 };
 
 // Attach event listener twice
-window.addEventListener('click', eventListener1);
-window.addEventListener('click', eventListener1);
+window.addEventListener('click', functionListener);
+window.addEventListener('click', functionListener);
 
 // Event listener that has handleEvent() method: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#listener
 class EventHandlerClass {
   handleEvent() {
-    testCallback2();
+    objectListenerCallback();
   }
 }
 
-const eventListener2 = new EventHandlerClass();
+const objectListener = new EventHandlerClass();
 
 // Attach event listener twice
-window.addEventListener('click', eventListener2);
-window.addEventListener('click', eventListener2);
+window.addEventListener('click', objectListener);
+window.addEventListener('click', objectListener);

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

@@ -2,24 +2,27 @@ 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);
+sentryTest(
+  'Event listener instrumentation should attach the same event listener only once',
+  async ({ getLocalTestPath, page }) => {
+    const url = await getLocalTestPath({ testDir: __dirname });
+    await page.goto(url);
 
-  let testCallback1Calls = 0;
-  await page.exposeFunction('testCallback1', () => {
-    testCallback1Calls = testCallback1Calls + 1;
-  });
+    let functionListenerCalls = 0;
+    await page.exposeFunction('functionListenerCallback', () => {
+      functionListenerCalls = functionListenerCalls + 1;
+    });
 
-  let testCallback2Calls = 0;
-  await page.exposeFunction('testCallback2', () => {
-    testCallback2Calls = testCallback2Calls + 1;
-  });
+    let objectListenerCalls = 0;
+    await page.exposeFunction('objectListenerCallback', () => {
+      objectListenerCalls = objectListenerCalls + 1;
+    });
 
-  // Trigger event listeners twice
-  await page.evaluate('document.body.click()');
-  await page.evaluate('document.body.click()');
+    // Trigger event listeners twice
+    await page.evaluate('document.body.click()');
+    await page.evaluate('document.body.click()');
 
-  expect(testCallback1Calls).toBe(2);
-  expect(testCallback2Calls).toBe(2);
-});
+    expect(functionListenerCalls).toBe(2);
+    expect(objectListenerCalls).toBe(2);
+  },
+);

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

@@ -0,0 +1,18 @@
+// Simple function event listener
+const functionListener = () => {
+  reportFunctionListenerStackHeight(new Error().stack.split('\n').length);
+};
+
+// Event listener that has handleEvent() method: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#listener
+class EventHandlerClass {
+  handleEvent() {
+    reportObjectListenerStackHeight(new Error().stack.split('\n').length);
+  }
+}
+
+const objectListener = new EventHandlerClass();
+
+window.attachListeners = function () {
+  window.addEventListener('click', functionListener);
+  window.addEventListener('click', objectListener);
+};

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

@@ -0,0 +1,38 @@
+import { expect } from '@playwright/test';
+
+import { sentryTest } from '../../../../utils/fixtures';
+
+sentryTest(
+  'Event listener instrumentation should not wrap event listeners multiple times',
+  async ({ getLocalTestPath, page }) => {
+    const url = await getLocalTestPath({ testDir: __dirname });
+    await page.goto(url);
+
+    const functionListenerStackHeights: number[] = [];
+    const objectListenerStackHeights: number[] = [];
+
+    await page.exposeFunction('reportFunctionListenerStackHeight', (height: number) => {
+      functionListenerStackHeights.push(height);
+    });
+
+    await page.exposeFunction('reportObjectListenerStackHeight', (height: number) => {
+      objectListenerStackHeights.push(height);
+    });
+
+    // Attach initial listeners
+    await page.evaluate('window.attachListeners()');
+    await page.evaluate('document.body.click()');
+
+    await page.evaluate('window.attachListeners()');
+    await page.evaluate('window.attachListeners()');
+    await page.evaluate('window.attachListeners()');
+    await page.evaluate('document.body.click()');
+
+    expect(functionListenerStackHeights).toHaveLength(2);
+    expect(objectListenerStackHeights).toHaveLength(2);
+
+    // check if all error stack traces are the same height
+    expect(functionListenerStackHeights.every((val, _i, arr) => val === arr[0])).toBeTruthy();
+    expect(objectListenerStackHeights.every((val, _i, arr) => val === arr[0])).toBeTruthy();
+  },
+);

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

@@ -4,21 +4,24 @@ 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 });
+sentryTest(
+  'Event listener instrumentation 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);
+    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),
-    },
-  });
-});
+    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),
+      },
+    });
+  },
+);