iOS mousedown event triggering issue

iOS has issues with the mousedown handler not functioning correctly in certain versions; however, on other devices (like Android, etc.), mousedown works perfectly fine.

The solution is to avoid using the mousedown handler on mobile devices and instead use touchstart. But will this affect the trigger order? In the original click event, blur is triggered first (if it exists), followed by the click event. To bypass this, mousedown was used as a replacement.

Here’s a simple experiment conducted on CodePen:

See the Pen touchstart-test by 愷開 (@kjj6198) on CodePen.

It turns out the trigger order is touchstart > mousedown > blur. It seems that when both touchstart and mousedown events are added, and both are supported, the events occur in the order of touchstart > mousedown.

After doing some research online, I found that the mousedown event is not triggered on iOS versions prior to 13; it works normally on iOS 13 and later. Additionally, for iPads, it appears that you can distinguish whether the touch is coming from a finger or an Apple Pencil.

Conclusion

• Be cautious when binding mousedown events on iOS; it’s best to use touch-related events instead.
• iOS 13 serves as a dividing line; additional testing is necessary for versions below 13.

I’ll document this here for now and will add detailed behaviors later.