React Click events not firing on mobile

I have the same issue, where I need to double click to get any click event to fire. It's not limited to Safari. I was able to overcome this by using onMouseDown and onMouseUp instead - which works on both mobile and desktop - but this is not always convenient. I would like to know why this is happening and how to solve it in a better way.

There are a few issues in React's Github project which might be helpful.

• onClick on mobile not fired
• MobileSafariClickEventPlugin requires touch events to be initialized

Looks like, you need to add a CSS cursor:'pointer' so that mobile phones (iOS devices specifically) fire native click event on the element.

I had the same issue when using Chrome browser, but when I used Firefox the onClick handler was working fine and thus the issue was in Chrome because chrome made some breaking changes for handling touches and because I was preventing default and handling it myself it wasn't working. Try running in Firefox it will work.