Revert "Rely on bubbling for submit and reset events (#13358)" (#13462)

This reverts commit 725e499cfb.
This commit is contained in:
Dan Abramov 2018-08-22 19:33:42 +01:00 committed by GitHub
parent 90c92c7007
commit a1be17140d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 55 additions and 34 deletions

View File

@ -2153,6 +2153,14 @@ dotenv@4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-4.0.0.tgz#864ef1379aced55ce6f95debecdce179f7a0cd1d"
draft-js@^0.10.5:
version "0.10.5"
resolved "https://registry.yarnpkg.com/draft-js/-/draft-js-0.10.5.tgz#bfa9beb018fe0533dbb08d6675c371a6b08fa742"
dependencies:
fbjs "^0.8.15"
immutable "~3.7.4"
object-assign "^4.1.0"
duplexer2@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.1.4.tgz#8b12dab878c0d69e3e7891051662a32fc6bddcc1"
@ -2672,7 +2680,7 @@ fbjs@^0.8.1, fbjs@^0.8.4:
setimmediate "^1.0.5"
ua-parser-js "^0.7.9"
fbjs@^0.8.16:
fbjs@^0.8.15, fbjs@^0.8.16:
version "0.8.16"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
dependencies:
@ -3302,6 +3310,10 @@ ignore@^3.3.3:
version "3.3.3"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.3.tgz#432352e57accd87ab3110e82d3fea0e47812156d"
immutable@~3.7.4:
version "3.7.6"
resolved "https://registry.yarnpkg.com/immutable/-/immutable-3.7.6.tgz#13b4d3cb12befa15482a26fe1b2ebae640071e4b"
imurmurhash@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"

View File

@ -23,41 +23,34 @@ describe('ReactDOM', () => {
ReactTestUtils = require('react-dom/test-utils');
});
// TODO: uncomment this test once we can run in phantom, which
// supports real submit events.
/*
it('should bubble onSubmit', function() {
const container = document.createElement('div');
let count = 0;
let buttonRef;
function Parent() {
return (
<div
onSubmit={event => {
event.preventDefault();
const count = 0;
const form;
const Parent = React.createClass({
handleSubmit: function() {
count++;
}}>
<Child />
</div>
);
}
function Child() {
return (
<form>
<input type="submit" ref={button => (buttonRef = button)} />
</form>
);
}
document.body.appendChild(container);
try {
ReactDOM.render(<Parent />, container);
buttonRef.click();
expect(count).toBe(1);
} finally {
document.body.removeChild(container);
return false;
},
render: function() {
return <Child />;
}
});
const Child = React.createClass({
render: function() {
return <form><input type="submit" value="Submit" /></form>;
},
componentDidMount: function() {
form = ReactDOM.findDOMNode(this);
}
});
const instance = ReactTestUtils.renderIntoDocument(<Parent />);
form.submit();
expect(count).toEqual(1);
});
*/
it('allows a DOM element to be used with a string', () => {
const element = React.createElement('div', {className: 'foo'});

View File

@ -361,6 +361,7 @@ describe('ReactDOMEventListener', () => {
<audio {...mediaEvents}>
<source {...mediaEvents} />
</audio>
<form onReset={() => {}} onSubmit={() => {}} />
</div>,
container,
);

View File

@ -25,6 +25,8 @@ import {
TOP_ERROR,
TOP_INVALID,
TOP_LOAD,
TOP_RESET,
TOP_SUBMIT,
TOP_TOGGLE,
} from '../events/DOMTopLevelEventTypes';
import {listenTo, trapBubbledEvent} from '../events/ReactBrowserEventEmitter';
@ -479,6 +481,11 @@ export function setInitialProperties(
trapBubbledEvent(TOP_LOAD, domElement);
props = rawProps;
break;
case 'form':
trapBubbledEvent(TOP_RESET, domElement);
trapBubbledEvent(TOP_SUBMIT, domElement);
props = rawProps;
break;
case 'details':
trapBubbledEvent(TOP_TOGGLE, domElement);
props = rawProps;
@ -861,6 +868,10 @@ export function diffHydratedProperties(
trapBubbledEvent(TOP_ERROR, domElement);
trapBubbledEvent(TOP_LOAD, domElement);
break;
case 'form':
trapBubbledEvent(TOP_RESET, domElement);
trapBubbledEvent(TOP_SUBMIT, domElement);
break;
case 'details':
trapBubbledEvent(TOP_TOGGLE, domElement);
break;

View File

@ -14,7 +14,9 @@ import {
TOP_CLOSE,
TOP_FOCUS,
TOP_INVALID,
TOP_RESET,
TOP_SCROLL,
TOP_SUBMIT,
getRawEventName,
mediaEventTypes,
} from './DOMTopLevelEventTypes';
@ -151,6 +153,8 @@ export function listenTo(
}
break;
case TOP_INVALID:
case TOP_SUBMIT:
case TOP_RESET:
// We listen to them on the target DOM elements.
// Some of them bubble so we don't want them to fire twice.
break;