Skip to content

fix: animate Duo modal rails without per-frame synchronization - #326

Merged
rdlabo merged 2 commits into
mainfrom
fix/modal-toolbar-sync-cost
Oct 24, 2026
Merged

rdlabo merged 2 commits into
mainfrom
fix/modal-toolbar-sync-cost

Conversation

@rdlabo

@rdlabo rdlabo commented Oct 23, 2026

Copy link
Copy Markdown
Contributor

Duo modal presentation repeatedly remeasured moving toolbar controls and republished native UI during the entry animation. Supported Ionic entry animations now send one immutable timing/geometry description to Core Animation, using the elapsed animation clock. After native acknowledgement, synchronization resumes at presentation completion with the latest DOM state. Native controls remain noninteractive during entry.

Preserve covered ion-back-button projections on their own page/modal surfaces, matching the existing button/group behavior. Covered projections retain measured positions and remain inert, including nested modals.

Compatibility: the optimization is capability-gated. Older native binaries and unsupported custom animations retain the existing synchronization path. This targets modal entry; it does not change interactive sheet dragging into a new animation protocol.

Validation:

  • 157 Native UI unit tests; TypeScript check, package/demo builds and formatting passed.
  • Chromium/WebKit: 26 modal/covered-toolbar cases passed, including a 40 ms bridge delay, no Web/native duplicate projections, one immutable animation description, old-native behavior, nested modals, disabled controls and left/right rails.
  • Additional covered-back geometry assertions passed in all 8 browser cases.
  • Native snapshot validation tests passed (2 cases).
  • iPhone Duo simulator: normal/card/sheet opening, native actions and dismissal passed; video frames checked for native motion, handoff and covered-back preservation.

No physical-device performance benchmark has been recorded; the simulator and browser checks establish behavior and synchronization structure, not a claimed FPS gain.

@github-actions

github-actions Bot commented Oct 24, 2026 •

Copy link
Copy Markdown
Contributor

Playwright test results

passed  498 passed
flaky  2 flaky

Details

stats  500 tests across 26 suites
duration  4 minutes, 12 seconds
commit  bc5593d
info  This detailed result covers Ionic 9 only. Ionic 8 runs against the same screenshots in a separate matrix job; check the workflow run for both results. To update the screenshots, comment with /update-screenshots.

Flaky tests

chromium › native-ui.spec.ts › horizontal tabs retain measured native width on Web handoff without feeding it back
chromium › native-ui.spec.ts › Duo sheet modal sends one native presentation clock instead of moving frames

@github-actions

github-actions Bot commented Oct 24, 2026 •

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report after GitHub Pages deployment completes: https://rdlabo-dev.github.io/ionic-theme-ios27/pr-326/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

@rdlabo
rdlabo merged commit f6a548c into main Oct 24, 2026
16 checks passed
@github-actions

Copy link
Copy Markdown
Contributor

npm beta published

CI passed for the merge commit f6a548cb4075. Install the immutable version with:

npm install @rdlabo/ionic-theme-ios27@2.0.2-beta.pr326.shaf6a548cb4075 @rdlabo/capacitor-native-ui@2.0.2-beta.pr326.shaf6a548cb4075

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant