Skip to content

bug: react, pressing back button after replacing with custom animation does not use custom animation #28673

Description

@liamdebeasi

Prerequisites

Ionic Framework Version

v7.x

Current Behavior

Calling a replace operation with a custom animation causes the animation to be run. However, pressing the ion-back-button on the resulting page never uses the custom animation.

Calling push operation with a custom animation causes the animation to be run. Pressing the ion-back-button on the resulting page does use the custom animation.

Expected Behavior

I expect the custom animation to be used when pressing the ion-back-button after a replace operation.

Steps to Reproduce

  1. Clone repo, install dependencies, and serve application
  2. Click "Message 1".
  3. Click "Message 2 (Replace)". Observe that "Animation used" is logged indicating the custom animation is used.
  4. Press the IonBackButton in the resulting page. Observe that the same message is not logged again indicating that the animation is not used.
  5. Click "Message 1".
  6. Press "Message 2 (Push)". Observe that "Animation used" is logged indicating the custom animation is used.
  7. Press the IonBackButton in the resulting page. Observe that "Animation used" is logged indicating the custom animation is used.

Code Reproduction URL

https://github.com/liamdebeasi/react-back-repro

Ionic Info

Ionic:

   Ionic CLI       : 7.1.5 (/Users/liamdebeasi/.nvm/versions/node/v20.9.0/lib/node_modules/@ionic/cli)
   Ionic Framework : @ionic/react 7.6.0

Capacitor:

   Capacitor CLI      : 5.5.1
   @capacitor/android : not installed
   @capacitor/core    : 5.5.1
   @capacitor/ios     : not installed

Utility:

   cordova-res                          : not installed globally
   native-run (update available: 2.0.0) : 1.7.4

System:

   NodeJS : v20.9.0 (/Users/liamdebeasi/.nvm/versions/node/v20.9.0/bin/node)
   npm    : 10.1.0
   OS     : macOS Unknown

Additional Information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions