Skip to content

Commit

Permalink
Revert "Revert facebook#1536"
Browse files Browse the repository at this point in the history
Formerly "Attach empty onclick listener to each node". This reverts commit 431155d.
  • Loading branch information
sophiebits committed Feb 23, 2015
1 parent 95206fe commit 090e4bb
Show file tree
Hide file tree
Showing 6 changed files with 67 additions and 61 deletions.
3 changes: 1 addition & 2 deletions src/browser/eventPlugins/DefaultEventPluginOrder.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,7 @@ var DefaultEventPluginOrder = [
keyOf({ChangeEventPlugin: null}),
keyOf({SelectEventPlugin: null}),
keyOf({BeforeInputEventPlugin: null}),
keyOf({AnalyticsEventPlugin: null}),
keyOf({MobileSafariClickEventPlugin: null})
keyOf({AnalyticsEventPlugin: null})
];

module.exports = DefaultEventPluginOrder;
56 changes: 0 additions & 56 deletions src/browser/eventPlugins/MobileSafariClickEventPlugin.js

This file was deleted.

24 changes: 23 additions & 1 deletion src/browser/eventPlugins/SimpleEventPlugin.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,10 @@
'use strict';

var EventConstants = require('EventConstants');
var EventListener = require('EventListener');
var EventPluginUtils = require('EventPluginUtils');
var EventPropagators = require('EventPropagators');
var ReactMount = require('ReactMount');
var SyntheticClipboardEvent = require('SyntheticClipboardEvent');
var SyntheticEvent = require('SyntheticEvent');
var SyntheticFocusEvent = require('SyntheticFocusEvent');
Expand All @@ -24,8 +26,8 @@ var SyntheticTouchEvent = require('SyntheticTouchEvent');
var SyntheticUIEvent = require('SyntheticUIEvent');
var SyntheticWheelEvent = require('SyntheticWheelEvent');

var emptyFunction = require('emptyFunction');
var getEventCharCode = require('getEventCharCode');

var invariant = require('invariant');
var keyOf = require('keyOf');
var warning = require('warning');
Expand Down Expand Up @@ -289,6 +291,9 @@ for (var type in topLevelEventsToDispatchConfig) {
topLevelEventsToDispatchConfig[type].dependencies = [type];
}

var ON_CLICK_KEY = keyOf({onClick: null});
var onClickListeners = {};

var SimpleEventPlugin = {

eventTypes: eventTypes,
Expand Down Expand Up @@ -417,6 +422,23 @@ var SimpleEventPlugin = {
);
EventPropagators.accumulateTwoPhaseDispatches(event);
return event;
},

didPutListener: function(id, registrationName, listener) {
// Mobile Safari does not fire properly bubble click events on
// non-interactive elements, which means delegated click listeners do not
// fire. The workaround for this bug involves attaching an empty click
// listener on the target node.
if (registrationName === ON_CLICK_KEY) {
var node = ReactMount.getNode(id);
onClickListeners[id] = EventListener.listen(node, 'click', emptyFunction);
}
},

willDeleteListener: function(id, registrationName) {
if (registrationName === ON_CLICK_KEY) {
onClickListeners[id].remove();
}
}

};
Expand Down
2 changes: 0 additions & 2 deletions src/browser/ui/ReactDefaultInjection.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ var DefaultEventPluginOrder = require('DefaultEventPluginOrder');
var EnterLeaveEventPlugin = require('EnterLeaveEventPlugin');
var ExecutionEnvironment = require('ExecutionEnvironment');
var HTMLDOMPropertyConfig = require('HTMLDOMPropertyConfig');
var MobileSafariClickEventPlugin = require('MobileSafariClickEventPlugin');
var ReactBrowserComponentMixin = require('ReactBrowserComponentMixin');
var ReactClass = require('ReactClass');
var ReactComponentBrowserEnvironment =
Expand Down Expand Up @@ -84,7 +83,6 @@ function inject() {
SimpleEventPlugin: SimpleEventPlugin,
EnterLeaveEventPlugin: EnterLeaveEventPlugin,
ChangeEventPlugin: ChangeEventPlugin,
MobileSafariClickEventPlugin: MobileSafariClickEventPlugin,
SelectEventPlugin: SelectEventPlugin,
BeforeInputEventPlugin: BeforeInputEventPlugin
});
Expand Down
20 changes: 20 additions & 0 deletions src/browser/ui/__tests__/ReactDOMComponent-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -385,6 +385,26 @@ describe('ReactDOMComponent', function() {
'style={{marginRight: spacing + \'em\'}} when using JSX.'
);
});

it("should execute custom event plugin listening behavior", function() {
var React = require('React');
var SimpleEventPlugin = require('SimpleEventPlugin');

SimpleEventPlugin.didPutListener = mocks.getMockFunction();
SimpleEventPlugin.willDeleteListener = mocks.getMockFunction();

var container = document.createElement('div');
React.render(
<div onClick={() => true} />,
container
);

expect(SimpleEventPlugin.didPutListener.mock.calls.length).toBe(1);

React.unmountComponentAtNode(container);

expect(SimpleEventPlugin.willDeleteListener.mock.calls.length).toBe(1);
});
});

describe('updateComponent', function() {
Expand Down
23 changes: 23 additions & 0 deletions src/event/EventPluginHub.js
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,12 @@ var EventPluginHub = {
var bankForRegistrationName =
listenerBank[registrationName] || (listenerBank[registrationName] = {});
bankForRegistrationName[id] = listener;

var PluginModule =
EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.didPutListener) {
PluginModule.didPutListener(id, registrationName, listener);
}
},

/**
Expand All @@ -174,7 +180,14 @@ var EventPluginHub = {
* @param {string} registrationName Name of listener (e.g. `onClick`).
*/
deleteListener: function(id, registrationName) {
var PluginModule =
EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.willDeleteListener) {
PluginModule.willDeleteListener(id, registrationName);
}

var bankForRegistrationName = listenerBank[registrationName];
// TODO: This should never be null -- when is it?
if (bankForRegistrationName) {
delete bankForRegistrationName[id];
}
Expand All @@ -187,6 +200,16 @@ var EventPluginHub = {
*/
deleteAllListeners: function(id) {
for (var registrationName in listenerBank) {
if (!listenerBank[registrationName][id]) {
continue;
}

var PluginModule =
EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.willDeleteListener) {
PluginModule.willDeleteListener(id, registrationName);
}

delete listenerBank[registrationName][id];
}
},
Expand Down

0 comments on commit 090e4bb

Please sign in to comment.