-
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
ViewTransitions breaking Radix/Shadcn ui Dropdown Functionality in Astro App #10863
Comments
Please provide a minimal reproduction such as through https://astro.new/latest, not a link to your production website. |
Hello @desiboli. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with |
@matthewp I added a minimal reproduction (StackBlitz), sorry for the inconvenience! |
Hi @desiboli, I'm a bit lost. When I run you example with |
Hi @martrapp are you testing this on an iPhone with the safari or chrome browser ? |
Ah, I'm obviously too tired. Thank you for reading your issue to me. IPhone. Now I know what I am doing wrong. Thank you ;-) |
Hi @desiboli, can confirm the issue now. While I'm able to reproduce it, I'm not able to debug it for lack of the necessary equipment. To me it looks like the UI library looses its touch handlers. After view transitions handlers have to be reestablished as the DOM is changed by the view transition and the former elements from the previous page are gone. Normally, Astro's hydration takes care of this. What puzzles me is the fact that the issue only surfaces on mobile. I'll try to find someone who can help debugging this. |
@martrapp It gets even worse 😄 I connected to my iPhone with a debugger and confirmed that I will investigate this in more detail after the weekend. |
Hi @V3RON thank you so much for stepping in to debug! 💜 |
Astro Info
If this issue only occurs in one browser, which browser is a problem?
📱 IPhone -> chrome & safari
Describe the Bug
After trying to figure out for a long time what could possibly be causing the bug I found out that after removing ViewTransitions from my head the Shadcn/ui dropdown-menu started to work as expected. When using ViewTransitions the dropdown-menu initially work but after navigating in my app (after a view transition) menu dropdown-menu is no longer clickable. Tried this only with the dropdown-menu component so far, but guessing this would effect other kinda similar components making Viewtransitions useless in the app.
What's the expected result?
The dropdown menu should maintain its full functionality and appearance regardless of ViewTransitions implementation.
Link to Minimal Reproducible Example
https://stackblitz.com/edit/github-yi4ckh
Participation
The text was updated successfully, but these errors were encountered: