React 13.3 with browserify: onTouchTap still not firing

[super-cache-money]

I'd love to use this in my isomorphic app, but I'm failing to integrate this.

When I specify onTouchTap handlers to my components, they simply don't fire. So, for example, to use material-ui, I've had to replace all onTouchTap's with onClick's.

I'll give some info about the context in which I'm trying to inject this - maybe some of it will be useful:

I'm using server side rendering, and bundling all of the components for use in the browser using browserify. So that I can use a cdn and to reduce the size of my bundle, I don't just bundle in the server version of react from node_modules. I use browserify-shim to achieve this. It essentially substitutes all require('react')'s with window.React in the browser bundle.

What could be the issue here?

[agereaude]

Same thing here with Webpack. Also trying to use material-ui (but not isomorphic).
Firefox's inspector doesn't show any events bound to the DOM elements.

[maddie927]

Same here. I was on React 0.13.2 and react-tap-event-plugin 0.1.6 and it was working fine. Updating to 0.13.3 and 0.1.7 broke all onTouchTaps. No errors or warnings. I'm also using a cdn for React, webpack for the rest of the browser bundle, in case that's relevant.

[wildseansy]

Same as @spicydonuts here. Love the onTouchTap feature, but seems broken in 0.1.7 + React 0.13.3. Looking at the source, I think this is really boils down to just a bug in React 13.3.

[dmitry]

Is there are any alternatives?

[kellyrmilligan]

It's working fine for me with webpack, react 13.3, and 1.7

[brucedonovan]

Hi all, newbie here - so apologise if this is off topic, not related to this bug or something stupidly simple that everyone has already done.
I had this issue. I was using react 13.3, plugin 0.1.7 and a 'copy-pasted' gulpfile. Turns out my dev version wasn't integrating the plugin properly because it was using external resources in the development build. It all worked swimmingly after commenting out the line from gulpfile.js:

(options.development ? dependencies : []).forEach(function (dep) {
appBundler.external(dep);
});

This may or may not be related to this bug, but hopefully it will help some other newbie who also stumbles upon this page.

[ianli-sc]

Same as @spicydonuts here. Any workaround solution?

update
ok, I found the reason. as @brucedonovan said, this plugin require some script from react.

1. If you built your project with gulp & browserify, and didn't use var React = require('react/addons'); or var React = require('react'); in the main file (the require of bundle) for build, instead, just use <script> label to import react.js in the page（for me，I just want my self-defined components bean build separated from react.js it self）. this compile of browserify will give no error & warning, but the onTouchTap not firing. The right way of using this plugin is define the dependencies of react & react-tap-event-plugin in your file of package.json and write var React = require('react'); and var injectTapEventPlugin = require("./components/base/InjectTapEventPlugin"); injectTapEventPlugin(); in your main file.
2. DO NOT forget the var before var injectTapEventPlugin = require("./components/base/InjectTapEventPlugin");......

[christopherL91]

Any updates?

[guirong]

if u use webpack and set react as a external lib like this, u may run into this issue.

 externals:{
       'react': 'React'
 }

a solution is use webpack build react and InjectTapEventPlugin.

this problem may be caused by the requires like require('react/lib/EventPluginHub') in InjectTapEventPlugin 。
when u set react as a external lib, webpack won't build react into the bundle. but as InjectTapEventPlugin require some react sub files, webpack don't know these files are external，as a result it build these files into the bundle. so when InjectTapEventPlugin run and register tap event to react, it register into a standalone react env and tap event can't fire

[s0meone]

I have no experience with webpack, but maybe you can use the latest version of the plugin. It now supports React 0.14. I've also included a demo project which explains how to build a version of React with the tap event plugin included. Maybe you could build a version of React using the demo instructions and include that file in your webpack config?