Skip to content

test(react-router): Fix flaky E2E tests - #20630

Merged
mydea merged 1 commit into
developfrom
fn/fix-flaky-react-router-test
May 4, 2026
Merged

test(react-router): Fix flaky E2E tests#20630
mydea merged 1 commit into
developfrom
fn/fix-flaky-react-router-test

Conversation

@mydea

@mydeamydea commented May 4, 2026

Copy link
Copy Markdown
Member

Fixes#20532

This hopefully makes react-router framework E2E tests a bit less flaky.

AI Summary of the problem

That app uses client-only hydration (hydrateRoot + HydratedRouter). The pageload transaction and React Router’s instrumentHydratedRouter updates can land in a race with page.goto finishing: sometimes CI loses that race, so the test times out or assertions fail.

This matches how other E2E apps avoid the same class of bug—for example the SvelteKit helpers wait for hydration / UI together with the pageload transaction so routing and tracing line up.

What we changed

After each page.goto for the performance routes, the tests now wait for the route’s <h1> before awaiting waitForTransaction:

/performance → Performance Page
/performance/with/sentry → Dynamic Parameter Page
So the HydratedRouter has rendered the matched route before the test blocks on the envelope, which stabilizes timing relative to router instrumentation.

@mydeamydea self-assigned this May 4, 2026
@github-actions

github-actionsBot commented May 4, 2026

Copy link
Copy Markdown
Contributor

size-limit report 📦

⚠️Warning: Base artifact is not the latest one, because the latest workflow run is not done yet. This may lead to incorrect results. Try to re-run all tests to get up to date results.

PathSize% ChangeChange
@sentry/browser26.31 kB--
@sentry/browser - with treeshaking flags24.8 kB--
@sentry/browser (incl. Tracing)44.19 kB--
@sentry/browser (incl. Tracing + Span Streaming)46.41 kB--
@sentry/browser (incl. Tracing, Profiling)49.16 kB--
@sentry/browser (incl. Tracing, Replay)83.57 kB--
@sentry/browser (incl. Tracing, Replay) - with treeshaking flags73.04 kB--
@sentry/browser (incl. Tracing, Replay with Canvas)88.25 kB--
@sentry/browser (incl. Tracing, Replay, Feedback)100.86 kB--
@sentry/browser (incl. Feedback)43.46 kB--
@sentry/browser (incl. sendFeedback)31.12 kB--
@sentry/browser (incl. FeedbackAsync)36.2 kB--
@sentry/browser (incl. Metrics)27.62 kB--
@sentry/browser (incl. Logs)27.74 kB--
@sentry/browser (incl. Metrics & Logs)28.44 kB--
@sentry/react28.05 kB--
@sentry/react (incl. Tracing)46.42 kB--
@sentry/vue31.18 kB--
@sentry/vue (incl. Tracing)46.03 kB--
@sentry/svelte26.33 kB--
CDN Bundle28.91 kB--
CDN Bundle (incl. Tracing)46.95 kB--
CDN Bundle (incl. Logs, Metrics)30.34 kB--
CDN Bundle (incl. Tracing, Logs, Metrics)48.06 kB--
CDN Bundle (incl. Replay, Logs, Metrics)69.4 kB--
CDN Bundle (incl. Tracing, Replay)84.1 kB--
CDN Bundle (incl. Tracing, Replay, Logs, Metrics)85.16 kB--
CDN Bundle (incl. Tracing, Replay, Feedback)89.9 kB--
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics)91.01 kB--
CDN Bundle - uncompressed84.71 kB--
CDN Bundle (incl. Tracing) - uncompressed140.29 kB--
CDN Bundle (incl. Logs, Metrics) - uncompressed88.9 kB--
CDN Bundle (incl. Tracing, Logs, Metrics) - uncompressed143.75 kB--
CDN Bundle (incl. Replay, Logs, Metrics) - uncompressed212.85 kB--
CDN Bundle (incl. Tracing, Replay) - uncompressed258.1 kB--
CDN Bundle (incl. Tracing, Replay, Logs, Metrics) - uncompressed261.54 kB--
CDN Bundle (incl. Tracing, Replay, Feedback) - uncompressed271.79 kB--
CDN Bundle (incl. Tracing, Replay, Feedback, Logs, Metrics) - uncompressed275.23 kB--
@sentry/nextjs (client)48.92 kB--
@sentry/sveltekit (client)44.67 kB--
@sentry/node-core59.13 kB+0.02%+11 B 🔺
@sentry/node170.42 kB+0.01%+12 B 🔺
@sentry/node - without tracing97 kB+0.01%+9 B 🔺
@sentry/aws-serverless113.85 kB+0.03%+32 B 🔺
@sentry/cloudflare (withSentry) - minified165.18 kB--
@sentry/cloudflare (withSentry)417.67 kB--

View base workflow run

@mydea
mydea marked this pull request as ready for review May 4, 2026 09:15
@mydea
mydea requested a review from a team as a code ownerMay 4, 2026 09:15

@s1gr1ds1gr1d left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, this makes sense

What was going wrong
Issue #20532 is about a flaky Playwright test: should send pageload transaction in the react-router-7-framework-spa app.
That app uses client-only hydration (hydrateRoot + HydratedRouter). The pageload transaction and React Router’s instrumentHydratedRouter updates (route name, sentry.origin, etc.) can land in a race with page.goto finishing: sometimes CI loses that race, so the test times out or assertions fail.
This matches how other E2E apps avoid the same class of bug—for example the SvelteKit helpers wait for hydration / UI together with the pageload transaction so routing and tracing line up.
What we changed
After each page.goto for the performance routes, the tests now wait for the route’s <h1> before awaiting waitForTransaction:
/performance → Performance Page
/performance/with/sentry → Dynamic Parameter Page
So the HydratedRouter has rendered the matched route before the test blocks on the envelope, which stabilizes timing relative to router instrumentation.
@mydea
mydeaforce-pushed the fn/fix-flaky-react-router-test branch from 522d9a9 to 5e98474CompareMay 4, 2026 09:49
@mydea
mydea enabled auto-merge (squash) May 4, 2026 09:49
@mydea
mydea merged commit 23ab0f1 into developMay 4, 2026
219 of 221 checks passed
@mydea
mydea deleted the fn/fix-flaky-react-router-test branch May 4, 2026 10:49
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

2 participants

@mydea@s1gr1d