diff --git a/docs/contributing/how-to-contribute.md b/docs/contributing/how-to-contribute.md index 3403ca379e..82591008e2 100644 --- a/docs/contributing/how-to-contribute.md +++ b/docs/contributing/how-to-contribute.md @@ -83,7 +83,7 @@ The core team is monitoring for pull requests. We will review your pull request 5. Make sure your code lints (`npm run lint`). 6. Format your code with [prettier](https://github.com/prettier/prettier) (`npm run prettier`). 7. Run the [Flow](https://flowtype.org/) typechecks (`npm run flow`). -8. If you added or removed any tests, run `./scripts/fiber/record-tests` before submitting the pull request, and commit the resulting changes. +8. If you added or removed any tests, run `./scripts/fiber/record-tests` before submitting the pull request, and commit the resulting changes. You can see the full output of fiber tests with `REACT_DOM_JEST_USE_FIBER=1 npm test`. 9. If you haven't already, complete the CLA. ### Contributor License Agreement (CLA) diff --git a/scripts/rollup/results.json b/scripts/rollup/results.json index f2fc8d6c74..a7d6f88cb6 100644 --- a/scripts/rollup/results.json +++ b/scripts/rollup/results.json @@ -9,28 +9,28 @@ "gzip": 5824 }, "react-dom.development.js (UMD_DEV)": { - "size": 591916, - "gzip": 136500 + "size": 592317, + "gzip": 136560 }, "react-dom.production.min.js (UMD_PROD)": { - "size": 122172, - "gzip": 38559 + "size": 121979, + "gzip": 38564 }, "react-dom-server.development.js (UMD_DEV)": { - "size": 499074, - "gzip": 120705 + "size": 498439, + "gzip": 120624 }, "react-dom-server.production.min.js (UMD_PROD)": { - "size": 107593, - "gzip": 33517 + "size": 107169, + "gzip": 33472 }, "react-art.development.js (UMD_DEV)": { - "size": 348302, - "gzip": 77888 + "size": 349177, + "gzip": 77902 }, "react-art.production.min.js (UMD_PROD)": { - "size": 96034, - "gzip": 29269 + "size": 96267, + "gzip": 29310 }, "react.development.js (NODE_DEV)": { "size": 70293, @@ -49,44 +49,44 @@ "gzip": 9216 }, "ReactDOMStack-dev.js (FB_DEV)": { - "size": 494710, - "gzip": 117992 + "size": 494069, + "gzip": 117876 }, "ReactDOMStack-prod.js (FB_PROD)": { - "size": 353169, - "gzip": 84692 + "size": 352489, + "gzip": 84575 }, "react-dom.development.js (NODE_DEV)": { - "size": 549492, - "gzip": 126720 + "size": 549893, + "gzip": 126464 }, "react-dom.production.min.js (NODE_PROD)": { - "size": 118381, - "gzip": 37204 + "size": 118192, + "gzip": 37224 }, "ReactDOMFiber-dev.js (FB_DEV)": { - "size": 550414, - "gzip": 127232 + "size": 550815, + "gzip": 126958 }, "ReactDOMFiber-prod.js (FB_PROD)": { - "size": 410323, - "gzip": 94077 + "size": 410570, + "gzip": 94005 }, "react-dom-server.development.js (NODE_DEV)": { - "size": 447685, - "gzip": 108152 + "size": 447050, + "gzip": 108025 }, "react-dom-server.production.min.js (NODE_PROD)": { - "size": 101966, - "gzip": 31470 + "size": 101542, + "gzip": 31424 }, "ReactDOMServerStack-dev.js (FB_DEV)": { - "size": 446371, - "gzip": 108003 + "size": 445736, + "gzip": 107878 }, "ReactDOMServerStack-prod.js (FB_PROD)": { - "size": 334124, - "gzip": 80394 + "size": 333450, + "gzip": 80260 }, "ReactARTStack-dev.js (FB_DEV)": { "size": 143166, @@ -97,20 +97,20 @@ "gzip": 23039 }, "react-art.development.js (NODE_DEV)": { - "size": 269626, - "gzip": 57755 + "size": 270501, + "gzip": 57767 }, "react-art.production.min.js (NODE_PROD)": { - "size": 57419, - "gzip": 17338 + "size": 57652, + "gzip": 17386 }, "ReactARTFiber-dev.js (FB_DEV)": { - "size": 268884, - "gzip": 57586 + "size": 269759, + "gzip": 57590 }, "ReactARTFiber-prod.js (FB_PROD)": { - "size": 207113, - "gzip": 43453 + "size": 208039, + "gzip": 43486 }, "ReactNativeStack.js (RN)": { "size": 233993, @@ -121,28 +121,28 @@ "gzip": 84001 }, "ReactTestRendererFiber-dev.js (FB_DEV)": { - "size": 266386, - "gzip": 56454 + "size": 267261, + "gzip": 56462 }, "ReactTestRendererStack-dev.js (FB_DEV)": { "size": 151770, "gzip": 34846 }, "react-noop-renderer.development.js (NODE_DEV)": { - "size": 258303, - "gzip": 54417 + "size": 259178, + "gzip": 54431 }, "react-test-renderer.development.js (NODE_DEV)": { - "size": 267137, - "gzip": 56637 + "size": 268012, + "gzip": 56651 }, "react-dom-test-utils.development.js (NODE_DEV)": { - "size": 52820, - "gzip": 13580 + "size": 52792, + "gzip": 13569 }, "ReactTestUtils-dev.js (FB_DEV)": { - "size": 52753, - "gzip": 13576 + "size": 52725, + "gzip": 13564 }, "react-test-renderer-stack.development.js (NODE_DEV)": { "size": 152686, diff --git a/src/renderers/dom/ReactDOM.js b/src/renderers/dom/ReactDOM.js index be14ffb1a8..a6cdc8b5ab 100644 --- a/src/renderers/dom/ReactDOM.js +++ b/src/renderers/dom/ReactDOM.js @@ -48,7 +48,7 @@ var ReactDOM = { EventPropagators: require('EventPropagators'), ReactControlledComponent: require('ReactControlledComponent'), ReactDOMComponentTree, - ReactBrowserEventEmitter: require('ReactBrowserEventEmitter'), + ReactDOMEventListener: require('ReactDOMEventListener'), ReactUpdates: ReactUpdates, }, }; diff --git a/src/renderers/dom/fiber/ReactDOMFiber.js b/src/renderers/dom/fiber/ReactDOMFiber.js index f142d0554f..f7856a4b13 100644 --- a/src/renderers/dom/fiber/ReactDOMFiber.js +++ b/src/renderers/dom/fiber/ReactDOMFiber.js @@ -554,7 +554,7 @@ var ReactDOM = { EventPropagators: require('EventPropagators'), ReactControlledComponent, ReactDOMComponentTree, - ReactBrowserEventEmitter, + ReactDOMEventListener: require('ReactDOMEventListener'), }, }; diff --git a/src/renderers/dom/shared/ReactBrowserEventEmitter.js b/src/renderers/dom/shared/ReactBrowserEventEmitter.js index 060584cdd2..1c2661b57f 100644 --- a/src/renderers/dom/shared/ReactBrowserEventEmitter.js +++ b/src/renderers/dom/shared/ReactBrowserEventEmitter.js @@ -12,6 +12,7 @@ 'use strict'; var EventPluginRegistry = require('EventPluginRegistry'); +var ReactDOMEventListener = require('ReactDOMEventListener'); var ReactEventEmitterMixin = require('ReactEventEmitterMixin'); var isEventSupported = require('isEventSupported'); @@ -92,31 +93,14 @@ function getListeningForDocument(mountAt) { } var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { - /** - * Injectable event backend - */ - ReactDOMEventListener: null, - - injection: { - /** - * @param {object} ReactDOMEventListener - */ - injectReactDOMEventListener: function(ReactDOMEventListener) { - ReactDOMEventListener.setHandleTopLevel( - ReactBrowserEventEmitter.handleTopLevel, - ); - ReactBrowserEventEmitter.ReactDOMEventListener = ReactDOMEventListener; - }, - }, - /** * Sets whether or not any created callbacks should be enabled. * * @param {boolean} enabled True if callbacks should be enabled. */ setEnabled: function(enabled) { - if (ReactBrowserEventEmitter.ReactDOMEventListener) { - ReactBrowserEventEmitter.ReactDOMEventListener.setEnabled(enabled); + if (ReactDOMEventListener) { + ReactDOMEventListener.setEnabled(enabled); } }, @@ -124,8 +108,7 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { * @return {boolean} True if callbacks are enabled. */ isEnabled: function() { - return !!(ReactBrowserEventEmitter.ReactDOMEventListener && - ReactBrowserEventEmitter.ReactDOMEventListener.isEnabled()); + return !!(ReactDOMEventListener && ReactDOMEventListener.isEnabled()); }, /** @@ -162,13 +145,13 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { ) { if (dependency === 'topWheel') { if (isEventSupported('wheel')) { - ReactBrowserEventEmitter.ReactDOMEventListener.trapBubbledEvent( + ReactDOMEventListener.trapBubbledEvent( 'topWheel', 'wheel', mountAt, ); } else if (isEventSupported('mousewheel')) { - ReactBrowserEventEmitter.ReactDOMEventListener.trapBubbledEvent( + ReactDOMEventListener.trapBubbledEvent( 'topWheel', 'mousewheel', mountAt, @@ -176,36 +159,28 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { } else { // Firefox needs to capture a different mouse scroll event. // @see http://www.quirksmode.org/dom/events/tests/scroll.html - ReactBrowserEventEmitter.ReactDOMEventListener.trapBubbledEvent( + ReactDOMEventListener.trapBubbledEvent( 'topWheel', 'DOMMouseScroll', mountAt, ); } } else if (dependency === 'topScroll') { - ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( + ReactDOMEventListener.trapCapturedEvent( 'topScroll', 'scroll', mountAt, ); } else if (dependency === 'topFocus' || dependency === 'topBlur') { - ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( - 'topFocus', - 'focus', - mountAt, - ); - ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( - 'topBlur', - 'blur', - mountAt, - ); + ReactDOMEventListener.trapCapturedEvent('topFocus', 'focus', mountAt); + ReactDOMEventListener.trapCapturedEvent('topBlur', 'blur', mountAt); // to make sure blur and focus event listeners are only attached once isListening.topBlur = true; isListening.topFocus = true; } else if (dependency === 'topCancel') { if (isEventSupported('cancel', true)) { - ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( + ReactDOMEventListener.trapCapturedEvent( 'topCancel', 'cancel', mountAt, @@ -214,7 +189,7 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { isListening.topCancel = true; } else if (dependency === 'topClose') { if (isEventSupported('close', true)) { - ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( + ReactDOMEventListener.trapCapturedEvent( 'topClose', 'close', mountAt, @@ -222,7 +197,7 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { } isListening.topClose = true; } else if (topLevelTypes.hasOwnProperty(dependency)) { - ReactBrowserEventEmitter.ReactDOMEventListener.trapBubbledEvent( + ReactDOMEventListener.trapBubbledEvent( dependency, topLevelTypes[dependency], mountAt, @@ -250,7 +225,7 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { }, trapBubbledEvent: function(topLevelType, handlerBaseName, handle) { - return ReactBrowserEventEmitter.ReactDOMEventListener.trapBubbledEvent( + return ReactDOMEventListener.trapBubbledEvent( topLevelType, handlerBaseName, handle, @@ -258,7 +233,7 @@ var ReactBrowserEventEmitter = Object.assign({}, ReactEventEmitterMixin, { }, trapCapturedEvent: function(topLevelType, handlerBaseName, handle) { - return ReactBrowserEventEmitter.ReactDOMEventListener.trapCapturedEvent( + return ReactDOMEventListener.trapCapturedEvent( topLevelType, handlerBaseName, handle, diff --git a/src/renderers/dom/shared/ReactDOMInjection.js b/src/renderers/dom/shared/ReactDOMInjection.js index e3cad3e1b7..a66582de4d 100644 --- a/src/renderers/dom/shared/ReactDOMInjection.js +++ b/src/renderers/dom/shared/ReactDOMInjection.js @@ -38,8 +38,8 @@ function inject() { } alreadyInjected = true; - ReactBrowserEventEmitter.injection.injectReactDOMEventListener( - ReactDOMEventListener, + ReactDOMEventListener.setHandleTopLevel( + ReactBrowserEventEmitter.handleTopLevel, ); /** diff --git a/src/renderers/dom/test/ReactTestUtils.js b/src/renderers/dom/test/ReactTestUtils.js index 9437d6b91c..787dceec6c 100644 --- a/src/renderers/dom/test/ReactTestUtils.js +++ b/src/renderers/dom/test/ReactTestUtils.js @@ -28,9 +28,9 @@ var { EventPluginHub, EventPluginRegistry, EventPropagators, - ReactBrowserEventEmitter, ReactControlledComponent, ReactDOMComponentTree, + ReactDOMEventListener, } = ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; var topLevelTypes = BrowserEventConstants.topLevelTypes; @@ -395,10 +395,7 @@ var ReactTestUtils = { */ simulateNativeEventOnNode: function(topLevelType, node, fakeNativeEvent) { fakeNativeEvent.target = node; - ReactBrowserEventEmitter.ReactDOMEventListener.dispatchEvent( - topLevelType, - fakeNativeEvent, - ); + ReactDOMEventListener.dispatchEvent(topLevelType, fakeNativeEvent); }, /**