diff --git a/packages/browser-integration-tests/suites/replay/bufferMode/test.ts b/packages/browser-integration-tests/suites/replay/bufferMode/test.ts index f049267a51c1..c4da79faa1d9 100644 --- a/packages/browser-integration-tests/suites/replay/bufferMode/test.ts +++ b/packages/browser-integration-tests/suites/replay/bufferMode/test.ts @@ -84,12 +84,13 @@ sentryTest( await reqErrorPromise; expect(callsToSentry).toEqual(2); - await page.evaluate(async () => { - const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay; - await replayIntegration.flush(); - }); - - const req0 = await reqPromise0; + const [req0] = await Promise.all([ + reqPromise0, + page.evaluate(async () => { + const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay; + await replayIntegration.flush(); + }), + ]); // 2 errors, 1 flush await reqErrorPromise; @@ -226,12 +227,13 @@ sentryTest( await reqErrorPromise; expect(callsToSentry).toEqual(2); - await page.evaluate(async () => { - const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay; - await replayIntegration.flush({ continueRecording: false }); - }); - - const req0 = await reqPromise0; + const [req0] = await Promise.all([ + reqPromise0, + page.evaluate(async () => { + const replayIntegration = (window as unknown as Window & { Replay: Replay }).Replay; + await replayIntegration.flush({ continueRecording: false }); + }), + ]); // 2 errors, 1 flush await reqErrorPromise; @@ -346,9 +348,12 @@ sentryTest( // Error sample rate is now at 1.0, this error should create a replay const reqErrorPromise1 = waitForErrorRequest(page); - await page.click('#error2'); - // 1 unsampled error, 1 sampled error -> 1 flush - const req0 = await reqPromise0; + const [req0] = await Promise.all([ + // 1 unsampled error, 1 sampled error -> 1 flush + reqPromise0, + page.click('#error2'), + ]); + const reqError1 = await reqErrorPromise1; const errorEvent1 = envelopeRequestParser(reqError1); expect(callsToSentry).toEqual(3); diff --git a/packages/browser-integration-tests/suites/replay/captureConsoleLog/test.ts b/packages/browser-integration-tests/suites/replay/captureConsoleLog/test.ts index c0ceed092995..13353bf1fb6c 100644 --- a/packages/browser-integration-tests/suites/replay/captureConsoleLog/test.ts +++ b/packages/browser-integration-tests/suites/replay/captureConsoleLog/test.ts @@ -10,8 +10,6 @@ sentryTest('should capture console messages in replay', async ({ getLocalTestPat sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,10 +18,11 @@ sentryTest('should capture console messages in replay', async ({ getLocalTestPat }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([page.goto(url), reqPromise0]); const reqPromise1 = waitForReplayRequest( page, @@ -38,11 +37,10 @@ sentryTest('should capture console messages in replay', async ({ getLocalTestPat await page.click('[data-log]'); // Sometimes this doesn't seem to trigger, so we trigger it twice to be sure... - await page.click('[data-log]'); - + const [req1] = await Promise.all([reqPromise1, page.click('[data-log]')]); await forceFlushReplay(); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs.filter(breadcrumb => breadcrumb.category === 'console')).toEqual( expect.arrayContaining([ @@ -65,8 +63,6 @@ sentryTest('should capture very large console logs', async ({ getLocalTestPath, sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -75,10 +71,11 @@ sentryTest('should capture very large console logs', async ({ getLocalTestPath, }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([page.goto(url), reqPromise0]); const reqPromise1 = waitForReplayRequest( page, @@ -90,14 +87,10 @@ sentryTest('should capture very large console logs', async ({ getLocalTestPath, 5_000, ); - await page.click('[data-log-large]'); - - // Sometimes this doesn't seem to trigger, so we trigger it twice to be sure... - await page.click('[data-log-large]'); - + const [req1] = await Promise.all([reqPromise1, page.click('[data-log-large]')]); await forceFlushReplay(); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs.filter(breadcrumb => breadcrumb.category === 'console')).toEqual( expect.arrayContaining([ diff --git a/packages/browser-integration-tests/suites/replay/errors/errorMode/test.ts b/packages/browser-integration-tests/suites/replay/errors/errorMode/test.ts index 15e9ab60dc3c..4bb4c45ae978 100644 --- a/packages/browser-integration-tests/suites/replay/errors/errorMode/test.ts +++ b/packages/browser-integration-tests/suites/replay/errors/errorMode/test.ts @@ -50,26 +50,25 @@ sentryTest( const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - await page.click('#go-background'); - await new Promise(resolve => setTimeout(resolve, 1000)); + await Promise.all([ + page.goto(url), + page.click('#go-background'), + new Promise(resolve => setTimeout(resolve, 1000)), + ]); expect(callsToSentry).toEqual(0); - await page.click('#error'); - const req0 = await reqPromise0; + const [req0] = await Promise.all([reqPromise0, page.click('#error')]); expect(callsToSentry).toEqual(2); // 1 error, 1 replay event - await page.click('#go-background'); - const req1 = await reqPromise1; - await reqErrorPromise; + const [req1] = await Promise.all([reqPromise1, page.click('#go-background'), reqErrorPromise]); expect(callsToSentry).toEqual(3); // 1 error, 2 replay events await page.click('#log'); - await page.click('#go-background'); - const req2 = await reqPromise2; + + const [req2] = await Promise.all([reqPromise2, page.click('#go-background')]); const event0 = getReplayEvent(req0); const content0 = getReplayRecordingContent(req0); diff --git a/packages/browser-integration-tests/suites/replay/largeMutations/defaultOptions/test.ts b/packages/browser-integration-tests/suites/replay/largeMutations/defaultOptions/test.ts index b7d0e558b844..efbd3384ec20 100644 --- a/packages/browser-integration-tests/suites/replay/largeMutations/defaultOptions/test.ts +++ b/packages/browser-integration-tests/suites/replay/largeMutations/defaultOptions/test.ts @@ -10,8 +10,6 @@ sentryTest( sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -22,26 +20,17 @@ sentryTest( const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - const res0 = await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page); - - void page.click('#button-add'); + const [res0] = await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); await forceFlushReplay(); - const res1 = await reqPromise1; - const reqPromise2 = waitForReplayRequest(page); - - void page.click('#button-modify'); + const [res1] = await Promise.all([waitForReplayRequest(page), page.click('#button-add')]); await forceFlushReplay(); - const res2 = await reqPromise2; - const reqPromise3 = waitForReplayRequest(page); + const [res2] = await Promise.all([waitForReplayRequest(page), page.click('#button-modify')]); + await forceFlushReplay(); - void page.click('#button-remove'); + const [res3] = await Promise.all([waitForReplayRequest(page), page.click('#button-remove')]); await forceFlushReplay(); - const res3 = await reqPromise3; const replayData0 = getReplayRecordingContent(res0); const replayData1 = getReplayRecordingContent(res1); diff --git a/packages/browser-integration-tests/suites/replay/largeMutations/mutationLimit/test.ts b/packages/browser-integration-tests/suites/replay/largeMutations/mutationLimit/test.ts index eb144fa012ef..4c10e9db0436 100644 --- a/packages/browser-integration-tests/suites/replay/largeMutations/mutationLimit/test.ts +++ b/packages/browser-integration-tests/suites/replay/largeMutations/mutationLimit/test.ts @@ -15,8 +15,6 @@ sentryTest( sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -25,23 +23,24 @@ sentryTest( }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - const res0 = await reqPromise0; + const [res0] = await Promise.all([reqPromise0, page.goto(url)]); + await forceFlushReplay(); const reqPromise1 = waitForReplayRequest(page); - void page.click('#button-add'); + const [res1] = await Promise.all([reqPromise1, page.click('#button-add')]); await forceFlushReplay(); - const res1 = await reqPromise1; // replay should be stopped due to mutation limit let replay = await getReplaySnapshot(page); expect(replay.session).toBe(undefined); expect(replay._isEnabled).toBe(false); - void page.click('#button-modify'); + await page.click('#button-modify'); await forceFlushReplay(); await page.click('#button-remove'); diff --git a/packages/browser-integration-tests/suites/replay/maxReplayDuration/test.ts b/packages/browser-integration-tests/suites/replay/maxReplayDuration/test.ts index a40387159bfc..2890f58691b5 100644 --- a/packages/browser-integration-tests/suites/replay/maxReplayDuration/test.ts +++ b/packages/browser-integration-tests/suites/replay/maxReplayDuration/test.ts @@ -11,9 +11,6 @@ sentryTest('keeps track of max duration across reloads', async ({ getLocalTestPa sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - const reqPromise1 = waitForReplayRequest(page, 1); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -22,33 +19,42 @@ sentryTest('keeps track of max duration across reloads', async ({ getLocalTestPa }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const reqPromise1 = waitForReplayRequest(page, 1); + const url = await getLocalTestPath({ testDir: __dirname }); await page.goto(url); await new Promise(resolve => setTimeout(resolve, MAX_REPLAY_DURATION / 2)); - await page.reload(); - await page.click('#button1'); + await Promise.all([page.reload(), page.click('#button1')]); // After the second reload, we should have a new session (because we exceeded max age) const reqPromise3 = waitForReplayRequest(page, 0); await new Promise(resolve => setTimeout(resolve, MAX_REPLAY_DURATION / 2 + 100)); - void page.click('#button1'); - await page.evaluate(`Object.defineProperty(document, 'visibilityState', { + const [req0, req1] = await Promise.all([ + reqPromise0, + reqPromise1, + page.click('#button1'), + page.evaluate( + `Object.defineProperty(document, 'visibilityState', { configurable: true, get: function () { return 'hidden'; }, }); - document.dispatchEvent(new Event('visibilitychange'));`); - const replayEvent0 = getReplayEvent(await reqPromise0); + document.dispatchEvent(new Event('visibilitychange'));`, + ), + ]); + + const replayEvent0 = getReplayEvent(req0); expect(replayEvent0).toEqual(getExpectedReplayEvent({})); - const replayEvent1 = getReplayEvent(await reqPromise1); + const replayEvent1 = getReplayEvent(req1); expect(replayEvent1).toEqual( getExpectedReplayEvent({ segment_id: 1, diff --git a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts index 956397c84a49..4b04a61995a4 100644 --- a/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts +++ b/packages/browser-integration-tests/suites/replay/multiple-pages/test.ts @@ -56,8 +56,7 @@ sentryTest( const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - const req0 = await reqPromise0; + const [req0] = await Promise.all([reqPromise0, page.goto(url)]); const replayEvent0 = getReplayEvent(req0); const recording0 = getReplayRecordingContent(req0); @@ -65,9 +64,8 @@ sentryTest( expect(normalize(recording0.fullSnapshots)).toMatchSnapshot('seg-0-snap-full'); expect(recording0.incrementalSnapshots.length).toEqual(0); - await page.click('#go-background'); + const [req1] = await Promise.all([reqPromise1, page.click('#go-background')]); - const req1 = await reqPromise1; const replayEvent1 = getReplayEvent(req1); const recording1 = getReplayRecordingContent(req1); @@ -97,9 +95,8 @@ sentryTest( // ----------------------------------------------------------------------------------------- // Test page reload - await page.reload(); + const [req2] = await Promise.all([reqPromise2, page.reload()]); - const req2 = await reqPromise2; const replayEvent2 = getReplayEvent(req2); const recording2 = getReplayRecordingContent(req2); @@ -107,9 +104,8 @@ sentryTest( expect(normalize(recording2.fullSnapshots)).toMatchSnapshot('seg-2-snap-full'); expect(recording2.incrementalSnapshots.length).toEqual(0); - await page.click('#go-background'); + const [req3] = await Promise.all([reqPromise3, page.click('#go-background')]); - const req3 = await reqPromise3; const replayEvent3 = getReplayEvent(req3); const recording3 = getReplayRecordingContent(req3); @@ -137,9 +133,8 @@ sentryTest( // ----------------------------------------------------------------------------------------- // Test subsequent link navigation to another page - await page.click('a'); + const [req4] = await Promise.all([reqPromise4, page.click('a')]); - const req4 = await reqPromise4; const replayEvent4 = getReplayEvent(req4); const recording4 = getReplayRecordingContent(req4); @@ -161,9 +156,8 @@ sentryTest( expect(normalize(recording4.fullSnapshots)).toMatchSnapshot('seg-4-snap-full'); expect(recording4.incrementalSnapshots.length).toEqual(0); - await page.click('#go-background'); + const [req5] = await Promise.all([reqPromise5, page.click('#go-background')]); - const req5 = await reqPromise5; const replayEvent5 = getReplayEvent(req5); const recording5 = getReplayRecordingContent(req5); @@ -207,9 +201,8 @@ sentryTest( // ----------------------------------------------------------------------------------------- // Test subsequent navigation without a page reload (i.e. SPA navigation) - await page.click('#spa-navigation'); + const [req6] = await Promise.all([reqPromise6, page.click('#spa-navigation')]); - const req6 = await reqPromise6; const replayEvent6 = getReplayEvent(req6); const recording6 = getReplayRecordingContent(req6); @@ -231,9 +224,8 @@ sentryTest( expect(recording6.fullSnapshots.length).toEqual(0); expect(normalize(recording6.incrementalSnapshots)).toMatchSnapshot('seg-6-snap-incremental'); - await page.click('#go-background'); + const [req7] = await Promise.all([reqPromise7, page.click('#go-background')]); - const req7 = await reqPromise7; const replayEvent7 = getReplayEvent(req7); const recording7 = getReplayRecordingContent(req7); @@ -279,9 +271,8 @@ sentryTest( // // ----------------------------------------------------------------------------------------- // // And just to finish this off, let's go back to the index page - await page.click('a'); + const [req8] = await Promise.all([reqPromise8, page.click('a')]); - const req8 = await reqPromise8; const replayEvent8 = getReplayEvent(req8); const recording8 = getReplayRecordingContent(req8); @@ -293,9 +284,8 @@ sentryTest( expect(normalize(recording8.fullSnapshots)).toMatchSnapshot('seg-8-snap-full'); expect(recording8.incrementalSnapshots.length).toEqual(0); - await page.click('#go-background'); + const [req9] = await Promise.all([reqPromise9, page.click('#go-background')]); - const req9 = await reqPromise9; const replayEvent9 = getReplayEvent(req9); const recording9 = getReplayRecordingContent(req9); diff --git a/packages/browser-integration-tests/suites/replay/requests/test.ts b/packages/browser-integration-tests/suites/replay/requests/test.ts index ba1d6ec5d0a2..52d78a144787 100644 --- a/packages/browser-integration-tests/suites/replay/requests/test.ts +++ b/packages/browser-integration-tests/suites/replay/requests/test.ts @@ -10,9 +10,6 @@ sentryTest('replay recording should contain fetch request span', async ({ getLoc sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - const reqPromise1 = waitForReplayRequest(page, 1); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -29,15 +26,16 @@ sentryTest('replay recording should contain fetch request span', async ({ getLoc }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const reqPromise1 = waitForReplayRequest(page, 1); + const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - await page.click('#go-background'); - const { performanceSpans: spans0 } = getReplayRecordingContent(await reqPromise0); + const [req0] = await Promise.all([reqPromise0, page.goto(url), page.click('#go-background')]); + + const { performanceSpans: spans0 } = getReplayRecordingContent(req0); - const receivedResponse = page.waitForResponse('https://example.com'); - await page.click('#fetch'); - await receivedResponse; + await Promise.all([page.waitForResponse('https://example.com'), page.click('#fetch')]); const { performanceSpans: spans1 } = getReplayRecordingContent(await reqPromise1); @@ -50,9 +48,6 @@ sentryTest('replay recording should contain XHR request span', async ({ getLocal sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - const reqPromise1 = waitForReplayRequest(page, 1); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -69,15 +64,16 @@ sentryTest('replay recording should contain XHR request span', async ({ getLocal }); }); + const reqPromise0 = waitForReplayRequest(page, 0); + const reqPromise1 = waitForReplayRequest(page, 1); + const url = await getLocalTestPath({ testDir: __dirname }); - await page.goto(url); - await page.click('#go-background'); - const { performanceSpans: spans0 } = getReplayRecordingContent(await reqPromise0); + const [req0] = await Promise.all([reqPromise0, page.goto(url), page.click('#go-background')]); + + const { performanceSpans: spans0 } = getReplayRecordingContent(req0); - const receivedResponse = page.waitForResponse('https://example.com'); - await page.click('#xhr'); - await receivedResponse; + await Promise.all([page.waitForResponse('https://example.com'), page.click('#xhr')]); const { performanceSpans: spans1 } = getReplayRecordingContent(await reqPromise1); diff --git a/packages/browser-integration-tests/suites/replay/slowClick/clickTargets/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/clickTargets/test.ts index 59bfb2ea26e8..8074f34a40fb 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/clickTargets/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/clickTargets/test.ts @@ -35,8 +35,6 @@ import { getCustomRecordingEvents, shouldSkipReplayTest, waitForReplayRequest } sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -47,18 +45,19 @@ import { getCustomRecordingEvents, shouldSkipReplayTest, waitForReplayRequest } const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), - await page.click(`#${id}`); + page.click(`#${id}`), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); @@ -92,8 +91,6 @@ import { getCustomRecordingEvents, shouldSkipReplayTest, waitForReplayRequest } sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -104,18 +101,18 @@ import { getCustomRecordingEvents, shouldSkipReplayTest, waitForReplayRequest } const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); - - await page.click(`#${id}`); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click(`#${id}`), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { diff --git a/packages/browser-integration-tests/suites/replay/slowClick/disable/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/disable/test.ts index 1a88d992714e..aef218a63cae 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/disable/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/disable/test.ts @@ -8,8 +8,6 @@ sentryTest('does not capture slow click when slowClickTimeout === 0', async ({ g sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,18 +18,18 @@ sentryTest('does not capture slow click when slowClickTimeout === 0', async ({ g const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationButton'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#mutationButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { diff --git a/packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts index 15e891b22e52..f80789d46a78 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts @@ -8,8 +8,6 @@ sentryTest('click is ignored on ignoreSelectors', async ({ getLocalTestUrl, page sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,18 +18,18 @@ sentryTest('click is ignored on ignoreSelectors', async ({ getLocalTestUrl, page const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationIgnoreButton'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#mutationIgnoreButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { @@ -60,8 +58,6 @@ sentryTest('click is ignored on div', async ({ getLocalTestUrl, page }) => { sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -72,18 +68,19 @@ sentryTest('click is ignored on div', async ({ getLocalTestUrl, page }) => { const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), - await page.click('#mutationDiv'); + await page.click('#mutationDiv'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { diff --git a/packages/browser-integration-tests/suites/replay/slowClick/multiClick/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/multiClick/test.ts index cdb099d82a18..a21327058a81 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/multiClick/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/multiClick/test.ts @@ -13,8 +13,6 @@ sentryTest('captures multi click when not detecting slow click', async ({ getLoc sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -25,18 +23,18 @@ sentryTest('captures multi click when not detecting slow click', async ({ getLoc const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.multiClick'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationButtonImmediately', { clickCount: 4 }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.multiClick'); + }), + page.click('#mutationButtonImmediately', { clickCount: 4 }), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.multiClick'); @@ -65,15 +63,16 @@ sentryTest('captures multi click when not detecting slow click', async ({ getLoc // When this has been flushed, the timeout has exceeded - so add a new click now, which should trigger another multi click - const reqPromise2 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); - - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.multiClick'); - }); + const [req2] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationButtonImmediately', { clickCount: 3 }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.multiClick'); + }), + page.click('#mutationButtonImmediately', { clickCount: 3 }), + ]); - const { breadcrumbs: breadcrumbb2 } = getCustomRecordingEvents(await reqPromise2); + const { breadcrumbs: breadcrumbb2 } = getCustomRecordingEvents(req2); const slowClickBreadcrumbs2 = breadcrumbb2.filter(breadcrumb => breadcrumb.category === 'ui.multiClick'); @@ -106,8 +105,6 @@ sentryTest('captures multiple multi clicks', async ({ getLocalTestUrl, page, for sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -118,8 +115,7 @@ sentryTest('captures multiple multi clicks', async ({ getLocalTestUrl, page, for const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); let multiClickBreadcrumbCount = 0; diff --git a/packages/browser-integration-tests/suites/replay/slowClick/mutation/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/mutation/test.ts index cb5b9160d13b..196719783229 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/mutation/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/mutation/test.ts @@ -8,8 +8,6 @@ sentryTest('mutation after threshold results in slow click', async ({ forceFlush sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,19 +18,20 @@ sentryTest('mutation after threshold results in slow click', async ({ forceFlush const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); await forceFlushReplay(); - await reqPromise0; - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), - await page.click('#mutationButton'); + page.click('#mutationButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); @@ -69,8 +68,6 @@ sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => { sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -81,18 +78,18 @@ sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => { const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - void page.click('#mutationButton', { clickCount: 4 }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), + page.click('#mutationButton', { clickCount: 4 }), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); const multiClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.multiClick'); @@ -131,8 +128,6 @@ sentryTest('immediate mutation does not trigger slow click', async ({ forceFlush sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -143,19 +138,19 @@ sentryTest('immediate mutation does not trigger slow click', async ({ forceFlush const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); await forceFlushReplay(); - await reqPromise0; - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); - - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationButtonImmediately'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#mutationButtonImmediately'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { @@ -183,8 +178,6 @@ sentryTest('inline click handler does not trigger slow click', async ({ forceFlu sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -195,19 +188,19 @@ sentryTest('inline click handler does not trigger slow click', async ({ forceFlu const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); await forceFlushReplay(); - await reqPromise0; - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); - - await page.click('#mutationButtonInline'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#mutationButtonInline'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { @@ -235,8 +228,6 @@ sentryTest('mouseDown events are considered', async ({ getLocalTestUrl, page }) sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -247,18 +238,18 @@ sentryTest('mouseDown events are considered', async ({ getLocalTestUrl, page }) const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mouseDownButton'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#mouseDownButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { diff --git a/packages/browser-integration-tests/suites/replay/slowClick/scroll/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/scroll/test.ts index a8e59752fc4a..1f5b672ff659 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/scroll/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/scroll/test.ts @@ -8,8 +8,6 @@ sentryTest('immediate scroll does not trigger slow click', async ({ getLocalTest sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,18 +18,18 @@ sentryTest('immediate scroll does not trigger slow click', async ({ getLocalTest const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#scrollButton'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click'); + }), + page.click('#scrollButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); expect(breadcrumbs).toEqual([ { @@ -59,8 +57,6 @@ sentryTest('late scroll triggers slow click', async ({ getLocalTestUrl, page }) sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -71,18 +67,18 @@ sentryTest('late scroll triggers slow click', async ({ getLocalTestUrl, page }) const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#scrollLateButton'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), + page.click('#scrollLateButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); diff --git a/packages/browser-integration-tests/suites/replay/slowClick/timeout/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/timeout/test.ts index ed53bc2d5fb4..6e6a1f13e3b6 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/timeout/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/timeout/test.ts @@ -8,8 +8,6 @@ sentryTest('mutation after timeout results in slow click', async ({ getLocalTest sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,18 +18,18 @@ sentryTest('mutation after timeout results in slow click', async ({ getLocalTest const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; - - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - await page.click('#mutationButtonLate'); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), + page.click('#mutationButtonLate'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); @@ -65,8 +63,6 @@ sentryTest('console.log results in slow click', async ({ getLocalTestUrl, page } sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -77,18 +73,19 @@ sentryTest('console.log results in slow click', async ({ getLocalTestUrl, page } const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); - const reqPromise1 = waitForReplayRequest(page, (event, res) => { - const { breadcrumbs } = getCustomRecordingEvents(res); + const [req1] = await Promise.all([ + waitForReplayRequest(page, (event, res) => { + const { breadcrumbs } = getCustomRecordingEvents(res); - return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); - }); + return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); + }), - await page.click('#consoleLogButton'); + page.click('#consoleLogButton'), + ]); - const { breadcrumbs } = getCustomRecordingEvents(await reqPromise1); + const { breadcrumbs } = getCustomRecordingEvents(req1); const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected'); diff --git a/packages/browser-integration-tests/suites/replay/slowClick/windowOpen/test.ts b/packages/browser-integration-tests/suites/replay/slowClick/windowOpen/test.ts index 4c9401234ea2..98ca0cc4c2a0 100644 --- a/packages/browser-integration-tests/suites/replay/slowClick/windowOpen/test.ts +++ b/packages/browser-integration-tests/suites/replay/slowClick/windowOpen/test.ts @@ -8,8 +8,6 @@ sentryTest('window.open() is considered for slow click', async ({ getLocalTestUr sentryTest.skip(); } - const reqPromise0 = waitForReplayRequest(page, 0); - await page.route('https://dsn.ingest.sentry.io/**/*', route => { return route.fulfill({ status: 200, @@ -20,8 +18,7 @@ sentryTest('window.open() is considered for slow click', async ({ getLocalTestUr const url = await getLocalTestUrl({ testDir: __dirname }); - await page.goto(url); - await reqPromise0; + await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]); const reqPromise1 = waitForReplayRequest(page, (event, res) => { const { breadcrumbs } = getCustomRecordingEvents(res);