Double-click required to open RecordTable cell on iOS

[Devessier]

Clicking twice on RecordTable cells is required to open them on iOS.

According to my research, there are a few things that can make it necessary to click twice on an element to open it on iOS:

• The element might have a :hover pseudo-selector; iOS chooses to display the hover state on the first click, then trigger the actual onClick listener on the second click
• The element might have mouse event listeners, like onMouseStart; in that case, the onClick listener will be called on the second click

Some references:

• https://aamnah.com/notes/javascript/events-clicks-taps-mobile-browsers-ios/
• https://css-tricks.com/annoying-mobile-double-tap-link-issue/
• https://stackoverflow.com/questions/19736454/click-and-mousemove-for-iphone
• Click events not being triggered with ios touch devices facebook/react#7635

We must examine every use case and ensure that Twenty's website is usable on mobile devices.

I think the bug for RecordTable cells is not caused by a hover state but by the mouse event listeners. I couldn't find any hover state, and things worked when I removed the listeners, as shown below:

ScreenFlow.mp4

That said, I don't know what the best fix would be. I may have missed another reason during my research.

We could disable mouse listeners where appropriate when the user's device doesn't support hovering. This article explains the media queries we could use: https://www.smashingmagazine.com/2022/03/guide-hover-pointer-media-queries/.

[Devessier]

As seen with @charlesBochet, this issue is not a priority right now. We'll postpone it.

[Bonapara]

Can you add labels @Devessier? 🙏

[Devessier]

The problem remains but is low priority. Closing for now.