Skip to content

fix(react-router): skip page clone when nothing will animate - #31387

Merged
ShaneK merged 1 commit into
mainfrom
fix/react-flaky-test
Aug 20, 2026
Merged

fix(react-router): skip page clone when nothing will animate#31387
ShaneK merged 1 commit into
mainfrom
fix/react-flaky-test

Conversation

@ShaneK

@ShaneK ShaneK commented Aug 20, 2026

Copy link
Copy Markdown
Member

Issue number: internal


What is the current behavior?

StackManager.transitionPage() clones the leaving page on same-view transitions (/user/1 to /user/2) so commit() gets a leaving element distinct from the entering one. It clones even when nothing will animate, which duplicates the page in the DOM for the length of the commit. Playwright locators then resolve to two elements and fail on a strict mode violation, which randomly fails CI and appears as a flake.

What is the new behavior?

The clone is gated on whether commit() will actually animate, mirroring the check ion-router-outlet makes. When it won't, commit() gets undefined for the leaving element, which it already handles, and no duplicate reaches the DOM. Two regression tests record the peak number of matching pages across a navigation so a reappearing duplicate fails directly instead of surfacing as a flake.

Does this introduce a breaking change?

  • Yes
  • No

Other information

The duplicate was never visible on screen. With animations off the clone is attached for about 5ms without crossing a frame boundary, and with animations on it carries ion-page-invisible (opacity 0) until afterTransition, which runs just before it's removed. This is a DOM-level fix, not a rendering one.

@ShaneK
ShaneK requested a review from a team as a code owner August 20, 2026 15:31
@ShaneK
ShaneK requested a review from brandyscarney August 20, 2026 15:31
@vercel

vercel Bot commented Aug 20, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ionic-framework Ready Ready Preview Aug 20, 2026 3:33pm

Request Review

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

@ShaneK
ShaneK added this pull request to the merge queue Aug 20, 2026
Merged via the queue into main with commit 898001c Aug 20, 2026
54 checks passed
@ShaneK
ShaneK deleted the fix/react-flaky-test branch August 20, 2026 17:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: react @ionic/react package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants