React Click events not firing on mobile

Question

I've been working with react for a couple of months now, but have just run into something a little weird.

Click events aren't being fired at all on mobile devices:

http://jsbin.com/morarewelu/1/edit?html,js,output

http://jsbin.com/morarewelu/1/ - Check on your device

You can see that the click is never fired. Testing on iphone here.

Is this expected behaviour, or simply a bug?

Answer 1

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.

Answer 2

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.