Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

test: Unflake slow click test #13252

Merged
merged 5 commits into from
Aug 6, 2024
Merged

test: Unflake slow click test #13252

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
42c00de
test: Unflake slow click test
lforst Aug 6, 2024
921ada7
.
lforst Aug 6, 2024
d3b3605
upload test results
lforst Aug 6, 2024
a3a594f
even more unflaking
lforst Aug 6, 2024
1144075
pls
lforst Aug 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .github/workflows/flaky-test-detector.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,10 +68,10 @@ jobs:
CHANGED_TEST_PATHS: ${{ steps.changed.outputs.browser_integration_files }}
TEST_RUN_COUNT: 'AUTO'

- name: Artifacts upload
- name: Upload Playwright Traces
uses: actions/upload-artifact@v4
if: failure() && steps.test.outcome == 'failure'
with:
name: playwright-test-results
path: test-results
path: dev-packages/browser-integration-tests/test-results
retention-days: 5
114 changes: 65 additions & 49 deletions dev-packages/browser-integration-tests/suites/replay/slowClick/mutation/test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,20 +18,24 @@ sentryTest('mutation after threshold results in slow click', async ({ forceFlush

const url = await getLocalTestUrl({ testDir: __dirname });

await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
await forceFlushReplay();
const replayRequestPromise = waitForReplayRequest(page, 0);

const [req1] = await Promise.all([
waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);
const segmentReqWithSlowClickBreadcrumbPromise = waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');
}),
return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');
});

page.locator('#mutationButton').click(),
]);
await page.goto(url);
await replayRequestPromise;

await forceFlushReplay();

await page.locator('#mutationButton').click();

const segmentReqWithSlowClick = await segmentReqWithSlowClickBreadcrumbPromise;

const { breadcrumbs } = getCustomRecordingEvents(req1);
const { breadcrumbs } = getCustomRecordingEvents(segmentReqWithSlowClick);

const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');

Expand Down Expand Up @@ -60,7 +64,7 @@ sentryTest('mutation after threshold results in slow click', async ({ forceFlush
]);

expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeGreaterThan(3000);
expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeLessThan(3500);
expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeLessThan(3501);
});

sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => {
Expand All @@ -78,18 +82,21 @@ sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => {

const url = await getLocalTestUrl({ testDir: __dirname });

await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
const replayRequestPromise = waitForReplayRequest(page, 0);
const segmentReqWithSlowClickBreadcrumbPromise = waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');
});

const [req1] = await Promise.all([
waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);
await page.goto(url);
await replayRequestPromise;

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');
}),
page.locator('#mutationButton').click({ clickCount: 4 }),
]);
await page.locator('#mutationButton').click({ clickCount: 4 });

const { breadcrumbs } = getCustomRecordingEvents(req1);
const segmentReqWithSlowClick = await segmentReqWithSlowClickBreadcrumbPromise;

const { breadcrumbs } = getCustomRecordingEvents(segmentReqWithSlowClick);

const slowClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.slowClickDetected');
const multiClickBreadcrumbs = breadcrumbs.filter(breadcrumb => breadcrumb.category === 'ui.multiClick');
Expand All @@ -99,7 +106,7 @@ sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => {
category: 'ui.slowClickDetected',
type: 'default',
data: {
endReason: 'mutation',
endReason: expect.stringMatching(/^(mutation|timeout)$/),
clickCount: 4,
node: {
attributes: {
Expand All @@ -120,7 +127,7 @@ sentryTest('multiple clicks are counted', async ({ getLocalTestUrl, page }) => {
expect(multiClickBreadcrumbs.length).toEqual(0);

expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeGreaterThan(3000);
expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeLessThan(3500);
expect(slowClickBreadcrumbs[0]?.data?.timeAfterClickMs).toBeLessThan(3501);
});

sentryTest('immediate mutation does not trigger slow click', async ({ forceFlushReplay, getLocalTestUrl, page }) => {
Expand All @@ -138,7 +145,15 @@ sentryTest('immediate mutation does not trigger slow click', async ({ forceFlush

const url = await getLocalTestUrl({ testDir: __dirname });

await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
const replayRequestPromise = waitForReplayRequest(page, 0);
const segmentReqWithClickBreadcrumbPromise = waitForReplayRequest(page, (_event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click');
});

await page.goto(url);
await replayRequestPromise;
await forceFlushReplay();

let slowClickCount = 0;
Expand All @@ -150,16 +165,11 @@ sentryTest('immediate mutation does not trigger slow click', async ({ forceFlush
slowClickCount += slowClicks.length;
});

const [req1] = await Promise.all([
waitForReplayRequest(page, (_event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);
await page.locator('#mutationButtonImmediately').click();

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click');
}),
page.locator('#mutationButtonImmediately').click(),
]);
const segmentReqWithSlowClick = await segmentReqWithClickBreadcrumbPromise;

const { breadcrumbs } = getCustomRecordingEvents(req1);
const { breadcrumbs } = getCustomRecordingEvents(segmentReqWithSlowClick);

expect(breadcrumbs).toEqual([
{
Expand Down Expand Up @@ -204,19 +214,23 @@ sentryTest('inline click handler does not trigger slow click', async ({ forceFlu

const url = await getLocalTestUrl({ testDir: __dirname });

await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
const replayRequestPromise = waitForReplayRequest(page, 0);
const segmentReqWithClickBreadcrumbPromise = waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click');
});

await page.goto(url);
await replayRequestPromise;

await forceFlushReplay();

const [req1] = await Promise.all([
waitForReplayRequest(page, (event, res) => {
const { breadcrumbs } = getCustomRecordingEvents(res);
await page.locator('#mutationButtonInline').click();

return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click');
}),
page.locator('#mutationButtonInline').click(),
]);
const segmentReqWithClick = await segmentReqWithClickBreadcrumbPromise;

const { breadcrumbs } = getCustomRecordingEvents(req1);
const { breadcrumbs } = getCustomRecordingEvents(segmentReqWithClick);

expect(breadcrumbs).toEqual([
{
Expand Down Expand Up @@ -254,18 +268,20 @@ sentryTest('mouseDown events are considered', async ({ getLocalTestUrl, page })

const url = await getLocalTestUrl({ testDir: __dirname });

await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
const replayRequestPromise = waitForReplayRequest(page, 0);
const segmentReqWithClickBreadcrumbPromise = 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');
}),
page.locator('#mouseDownButton').click(),
]);
await page.goto(url);
await replayRequestPromise;

await page.locator('#mouseDownButton').click();
const segmentReqWithClick = await segmentReqWithClickBreadcrumbPromise;

const { breadcrumbs } = getCustomRecordingEvents(req1);
const { breadcrumbs } = getCustomRecordingEvents(segmentReqWithClick);

expect(breadcrumbs).toEqual([
{
Expand Down
Loading