north basin
When clicking the text content of this link component with a glitch effect is disappearing.
The more interesting thing is that the effect works on desktop just fine, and on mobile in horizontal mode.
The dropdown menu, on mobile is where the problem is. Although its the same component.
still slateBOT
Hi @north basin. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
Hmm, I don't know enough to give you a confident answer yet. The knowledge sources provided do not contain specific information about a link component with a glitch effect disappearing on click, especially in relation to mobile dropdown menus.
However, there are some known issues with certain components not working as expected in some scenarios on mobile devices, especially on iOS Safari, as discussed in this Github issue (https://github.com/withastro/astro/issues/9747).
It's also worth noting that Astro emphasizes minimized JavaScript usage and optimized loading times, which could potentially affect how certain effects and components behave, especially on mobile devices.
north basin
@still slate do you have any information about some js not working in ios safari but working on desktop
still slateBOT
Let me check the knowledge base for you. One moment! :books:
Yes, there are several instances where JavaScript doesn't work as expected on iOS Safari, even though it works fine on desktop browsers. Here are some examples from the knowledge sources:
In a Discord support thread (https://discord.com/channels/830184174198718474/1214267368289861672), a community member reported that an external JavaScript script was not working on iOS Safari when using view transitions, even though it worked fine on other platforms.
A Github issue (https://github.com/withastro/astro/issues/4859) was reported where a script using innerHTML was not working on Safari, both on iOS and macOS. The issue was related to the use of let variable in define:vars, which is not supported in Safari.
Another Github issue (https://github.com/withastro/astro/issues/4471) reported that optional chaining in Astro islands TypeScript was breaking Safari 12. The issue was related to optional chaining not being supported in that version of Safari.
A Github issue (https://github.com/withastro/astro/issues/9747) reported that a React component using client:load didn't work in some scenarios on iOS Safari. The issue seemed to be related to a specific library (radix-ui/shadcn) and its compatibility with iOS.