MobileSafariClickEventPlugin requires touch events to be initialized

[Simek]

Event do not trigger when node do not have "cursor: pointer" style on it.

Here you have an example:
http://jsfiddle.net/kb3gN/1345/

[syranide]

There is no reference to pointer (not even cursor) in the React codebase, so I'm assuming this is some weird iOS bug, React might be able to work around it though.

[MattKunze]

My guess is that is an issue that has been around for quite a while (interesting timing that I ran into the same thing for a different context this morning):

http://www.quirksmode.org/blog/archives/2010/10/click_event_del_1.html
http://stackoverflow.com/questions/7358781/tapping-on-label-in-mobile-safari

You'll see a bunch of workarounds that add empty handlers when the page loads to address this ($('label').click(function() {});)

Doesn't seem like React's problem to fix - either add 'cursor: pointer' or empty event handlers where it causes an issue.

[syranide]

@MattKunze We do try to fix things that can be fixed and it wouldn't surprise me if you can temporarily add a click-handler on touch and solve it like that.

[sophiebits]

Yes, we have https://github.com/facebook/react/blob/master/src/browser/eventPlugins/MobileSafariClickEventPlugin.js to fix this exact problem but it sounds like perhaps it's not working.

[MattKunze]

Is that plug-in registered automatically, or do you have to do something to enable it?

I can confirm that the original jsfiddle posted above isn't working for me on iOS

[Simek]

Digging through repository I found event plugin which seems to be related to similar bug:
https://github.com/facebook/react/blob/master/src/browser/eventPlugins/MobileSafariClickEventPlugin.js

But problem seems to be little wider because Chrome on iOS is also affected so this is an mobile webkit issue.

[MattKunze]

Adding

    componentDidMount: function() {
      this.getDOMNode().onclick = function() {}
    }

to the component is a workaround. It seems like the plugin is not working at the moment

[mietek]

This is still not working in 0.10.0, and is actually a duplicate of #134.

Adding cursor: pointer to elements which are intended to be clickable is still the least-offensive workaround.

[sophiebits]

Ever since on-demand event listening was added, MobileSafariClickEventPlugin has been broken because touchstart isn't always listened to. cursor: pointer; is an okay workaround but we'll have to fix this for real somehow, probably by having onclick handlers turn into onclick="" markup.