nextjs - 💡(How to fix) Fix `ViewTransition` exit animations do not fire when using `router.back()` [1 comments, 2 participants]

TL;DR

The issue with the exit view transition animation not triggering when using router.back() in a Next.js application with the new <ViewTransition> element from React can be addressed by investigating the animation configuration and the router.back() implementation.

Guidance

• Review the router.back() implementation to ensure it properly handles the exit animation trigger.
• Verify that the animation configuration for the exit transition is correctly set up in the <ViewTransition> element.
• Check the Next.js and React documentation for any known issues or limitations related to using router.back() with the <ViewTransition> element.
• Test the application with different animation configurations to isolate the issue.

Example

No specific code snippet can be provided without further information about the implementation details.

Notes

The issue might be related to the specific configuration of the <ViewTransition> element or the router.back() implementation. Further investigation is needed to determine the root cause.

Recommendation

Apply workaround: Investigate alternative methods for triggering the exit animation, such as using a custom animation handler or modifying the router.back() implementation to properly handle the exit animation trigger. This approach allows for a more targeted solution without relying on potential fixes in future versions.