Merge pull request #8086 from sebmarkbage/fiberdom

[Fiber] Reorganize files for DOM renderer to make overlap between fiber/stack clearer

src/renderers/dom/ReactDOM.js

@@ -14,7 +14,8 @@
 'use strict';
 
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
-var ReactDefaultInjection = require('ReactDefaultInjection');
+var ReactDOMInjection = require('ReactDOMInjection');
+var ReactDOMStackInjection = require('ReactDOMStackInjection');
 var ReactMount = require('ReactMount');
 var ReactReconciler = require('ReactReconciler');
 var ReactUpdates = require('ReactUpdates');
@@ -25,7 +26,8 @@ var getHostComponentFromComposite = require('getHostComponentFromComposite');
 var renderSubtreeIntoContainer = require('renderSubtreeIntoContainer');
 var warning = require('warning');
 
-ReactDefaultInjection.inject();
+ReactDOMInjection.inject();
+ReactDOMStackInjection.inject();
 
 var ReactDOM = {
   findDOMNode: findDOMNode,

src/renderers/dom/ReactDOMServer.js

@@ -11,11 +11,13 @@
 
 'use strict';
 
-var ReactDefaultInjection = require('ReactDefaultInjection');
+var ReactDOMInjection = require('ReactDOMInjection');
+var ReactDOMStackInjection = require('ReactDOMStackInjection');
 var ReactServerRendering = require('ReactServerRendering');
 var ReactVersion = require('ReactVersion');
 
-ReactDefaultInjection.inject();
+ReactDOMInjection.inject();
+ReactDOMStackInjection.inject();
 
 var ReactDOMServer = {
   renderToString: ReactServerRendering.renderToString,

src/renderers/dom/shared/ReactDefaultInjection.js → src/renderers/dom/shared/ReactDOMInjection.js

@@ -6,28 +6,24 @@
  * LICENSE file in the root directory of this source tree. An additional grant
  * of patent rights can be found in the PATENTS file in the same directory.
  *
- * @providesModule ReactDefaultInjection
+ * @providesModule ReactDOMInjection
  */
 
 'use strict';
 
 var ARIADOMPropertyConfig = require('ARIADOMPropertyConfig');
 var BeforeInputEventPlugin = require('BeforeInputEventPlugin');
+var DOMProperty = require('DOMProperty');
 var ChangeEventPlugin = require('ChangeEventPlugin');
-var DefaultEventPluginOrder = require('DefaultEventPluginOrder');
+var DOMEventPluginOrder = require('DOMEventPluginOrder');
 var EnterLeaveEventPlugin = require('EnterLeaveEventPlugin');
+var EventPluginHub = require('EventPluginHub');
+var EventPluginUtils = require('EventPluginUtils');
 var HTMLDOMPropertyConfig = require('HTMLDOMPropertyConfig');
-var ReactComponentBrowserEnvironment =
-  require('ReactComponentBrowserEnvironment');
-var ReactDOMComponent = require('ReactDOMComponent');
+var ReactBrowserEventEmitter = require('ReactBrowserEventEmitter');
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
-var ReactDOMEmptyComponent = require('ReactDOMEmptyComponent');
 var ReactDOMTreeTraversal = require('ReactDOMTreeTraversal');
-var ReactDOMTextComponent = require('ReactDOMTextComponent');
-var ReactDefaultBatchingStrategy = require('ReactDefaultBatchingStrategy');
 var ReactEventListener = require('ReactEventListener');
-var ReactInjection = require('ReactInjection');
-var ReactReconcileTransaction = require('ReactReconcileTransaction');
 var SVGDOMPropertyConfig = require('SVGDOMPropertyConfig');
 var SelectEventPlugin = require('SelectEventPlugin');
 var SimpleEventPlugin = require('SimpleEventPlugin');
@@ -43,55 +39,32 @@ function inject() {
   }
   alreadyInjected = true;
 
-  ReactInjection.EventEmitter.injectReactEventListener(
+  ReactBrowserEventEmitter.injection.injectReactEventListener(
     ReactEventListener
   );
 
   /**
    * Inject modules for resolving DOM hierarchy and plugin ordering.
    */
-  ReactInjection.EventPluginHub.injectEventPluginOrder(DefaultEventPluginOrder);
-  ReactInjection.EventPluginUtils.injectComponentTree(ReactDOMComponentTree);
-  ReactInjection.EventPluginUtils.injectTreeTraversal(ReactDOMTreeTraversal);
+  EventPluginHub.injection.injectEventPluginOrder(DOMEventPluginOrder);
+  EventPluginUtils.injection.injectComponentTree(ReactDOMComponentTree);
+  EventPluginUtils.injection.injectTreeTraversal(ReactDOMTreeTraversal);
 
   /**
    * Some important event plugins included by default (without having to require
    * them).
    */
-  ReactInjection.EventPluginHub.injectEventPluginsByName({
+  EventPluginHub.injection.injectEventPluginsByName({
     SimpleEventPlugin: SimpleEventPlugin,
     EnterLeaveEventPlugin: EnterLeaveEventPlugin,
     ChangeEventPlugin: ChangeEventPlugin,
     SelectEventPlugin: SelectEventPlugin,
     BeforeInputEventPlugin: BeforeInputEventPlugin,
   });
 
-  ReactInjection.HostComponent.injectGenericComponentClass(
-    ReactDOMComponent
-  );
-
-  ReactInjection.HostComponent.injectTextComponentClass(
-    ReactDOMTextComponent
-  );
-
-  ReactInjection.DOMProperty.injectDOMPropertyConfig(ARIADOMPropertyConfig);
-  ReactInjection.DOMProperty.injectDOMPropertyConfig(HTMLDOMPropertyConfig);
-  ReactInjection.DOMProperty.injectDOMPropertyConfig(SVGDOMPropertyConfig);
-
-  ReactInjection.EmptyComponent.injectEmptyComponentFactory(
-    function(instantiate) {
-      return new ReactDOMEmptyComponent(instantiate);
-    }
-  );
-
-  ReactInjection.Updates.injectReconcileTransaction(
-    ReactReconcileTransaction
-  );
-  ReactInjection.Updates.injectBatchingStrategy(
-    ReactDefaultBatchingStrategy
-  );
-
-  ReactInjection.Component.injectEnvironment(ReactComponentBrowserEnvironment);
+  DOMProperty.injection.injectDOMPropertyConfig(ARIADOMPropertyConfig);
+  DOMProperty.injection.injectDOMPropertyConfig(HTMLDOMPropertyConfig);
+  DOMProperty.injection.injectDOMPropertyConfig(SVGDOMPropertyConfig);
 }
 
 module.exports = {

src/renderers/dom/shared/__tests__/DOMPropertyOperations-test.js

@@ -18,8 +18,8 @@ describe('DOMPropertyOperations', () => {
 
   beforeEach(() => {
     jest.resetModuleRegistry();
-    var ReactDefaultInjection = require('ReactDefaultInjection');
-    ReactDefaultInjection.inject();
+    var ReactDOMInjection = require('ReactDOMInjection');
+    ReactDOMInjection.inject();
 
     DOMPropertyOperations = require('DOMPropertyOperations');
     DOMProperty = require('DOMProperty');

src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js

@@ -626,8 +626,10 @@ describe('ReactDOMComponent', () => {
     }
 
     beforeEach(() => {
-      var ReactDefaultInjection = require('ReactDefaultInjection');
-      ReactDefaultInjection.inject();
+      var ReactDOMInjection = require('ReactDOMInjection');
+      ReactDOMInjection.inject();
+      var ReactDOMStackInjection = require('ReactDOMStackInjection');
+      ReactDOMStackInjection.inject();
 
       var ReactDOMComponent = require('ReactDOMComponent');
       var ReactReconcileTransaction = require('ReactReconcileTransaction');

src/renderers/dom/client/eventPlugins/DefaultEventPluginOrder.js → src/renderers/dom/shared/eventPlugins/DOMEventPluginOrder.js

@@ -6,7 +6,7 @@
  * LICENSE file in the root directory of this source tree. An additional grant
  * of patent rights can be found in the PATENTS file in the same directory.
  *
- * @providesModule DefaultEventPluginOrder
+ * @providesModule DOMEventPluginOrder
  */
 
 'use strict';
@@ -20,7 +20,7 @@
  * `ResponderEventPlugin` must occur before `SimpleEventPlugin` so that
  * preventing default on events is convenient in `SimpleEventPlugin` handlers.
  */
-var DefaultEventPluginOrder = [
+var DOMEventPluginOrder = [
   'ResponderEventPlugin',
   'SimpleEventPlugin',
   'TapEventPlugin',
@@ -30,4 +30,4 @@ var DefaultEventPluginOrder = [
   'BeforeInputEventPlugin',
 ];
 
-module.exports = DefaultEventPluginOrder;
+module.exports = DOMEventPluginOrder;

src/renderers/dom/stack/client/ReactDOMStackInjection.js

@@ -0,0 +1,63 @@
+/**
+ * Copyright 2013-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactDOMStackInjection
+ */
+
+'use strict';
+
+var ReactComponentEnvironment = require('ReactComponentEnvironment');
+var ReactComponentBrowserEnvironment =
+  require('ReactComponentBrowserEnvironment');
+var ReactDOMComponent = require('ReactDOMComponent');
+var ReactDOMEmptyComponent = require('ReactDOMEmptyComponent');
+var ReactDOMTextComponent = require('ReactDOMTextComponent');
+var ReactDefaultBatchingStrategy = require('ReactDefaultBatchingStrategy');
+var ReactEmptyComponent = require('ReactEmptyComponent');
+var ReactHostComponent = require('ReactHostComponent');
+var ReactReconcileTransaction = require('ReactReconcileTransaction');
+var ReactUpdates = require('ReactUpdates');
+
+var alreadyInjected = false;
+
+function inject() {
+  if (alreadyInjected) {
+    // TODO: This is currently true because these injections are shared between
+    // the client and the server package. They should be built independently
+    // and not share any injection state. Then this problem will be solved.
+    return;
+  }
+  alreadyInjected = true;
+
+  ReactHostComponent.injection.injectGenericComponentClass(
+    ReactDOMComponent
+  );
+
+  ReactHostComponent.injection.injectTextComponentClass(
+    ReactDOMTextComponent
+  );
+
+  ReactEmptyComponent.injection.injectEmptyComponentFactory(
+    function(instantiate) {
+      return new ReactDOMEmptyComponent(instantiate);
+    }
+  );
+
+  ReactUpdates.injection.injectReconcileTransaction(
+    ReactReconcileTransaction
+  );
+  ReactUpdates.injection.injectBatchingStrategy(
+    ReactDefaultBatchingStrategy
+  );
+
+  ReactComponentEnvironment.injection.injectEnvironment(ReactComponentBrowserEnvironment);
+}
+
+module.exports = {
+  inject: inject,
+};

src/renderers/native/ReactNative.js

@@ -14,14 +14,16 @@
 // Require ReactNativeDefaultInjection first for its side effects of setting up
 // the JS environment
 var ReactNativeComponentTree = require('ReactNativeComponentTree');
-var ReactNativeDefaultInjection = require('ReactNativeDefaultInjection');
+var ReactNativeInjection = require('ReactNativeInjection');
+var ReactNativeStackInjection = require('ReactNativeStackInjection');
 
 var ReactNativeMount = require('ReactNativeMount');
 var ReactUpdates = require('ReactUpdates');
 
 var findNodeHandle = require('findNodeHandle');
 
-ReactNativeDefaultInjection.inject();
+ReactNativeInjection.inject();
+ReactNativeStackInjection.inject();
 
 var render = function(
   element: ReactElement<any>,

src/renderers/native/ReactNativeInjection.js

@@ -0,0 +1,62 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactNativeInjection
+ * @flow
+ */
+'use strict';
+
+/**
+ * Make sure essential globals are available and are patched correctly. Please don't remove this
+ * line. Bundles created by react-packager `require` it before executing any application code. This
+ * ensures it exists in the dependency graph and can be `require`d.
+ * TODO: require this in packager, not in React #10932517
+ */
+require('InitializeJavaScriptAppEngine');
+
+var EventPluginHub = require('EventPluginHub');
+var EventPluginUtils = require('EventPluginUtils');
+var RCTEventEmitter = require('RCTEventEmitter');
+var ReactNativeBridgeEventPlugin = require('ReactNativeBridgeEventPlugin');
+var ReactNativeComponentTree = require('ReactNativeComponentTree');
+var ReactNativeEventEmitter = require('ReactNativeEventEmitter');
+var ReactNativeEventPluginOrder = require('ReactNativeEventPluginOrder');
+var ReactNativeGlobalResponderHandler = require('ReactNativeGlobalResponderHandler');
+var ReactNativeTreeTraversal = require('ReactNativeTreeTraversal');
+var ResponderEventPlugin = require('ResponderEventPlugin');
+
+function inject() {
+  /**
+   * Register the event emitter with the native bridge
+   */
+  RCTEventEmitter.register(ReactNativeEventEmitter);
+
+  /**
+   * Inject module for resolving DOM hierarchy and plugin ordering.
+   */
+  EventPluginHub.injection.injectEventPluginOrder(ReactNativeEventPluginOrder);
+  EventPluginUtils.injection.injectComponentTree(ReactNativeComponentTree);
+  EventPluginUtils.injection.injectTreeTraversal(ReactNativeTreeTraversal);
+
+  ResponderEventPlugin.injection.injectGlobalResponderHandler(
+    ReactNativeGlobalResponderHandler
+  );
+
+  /**
+   * Some important event plugins included by default (without having to require
+   * them).
+   */
+  EventPluginHub.injection.injectEventPluginsByName({
+    'ResponderEventPlugin': ResponderEventPlugin,
+    'ReactNativeBridgeEventPlugin': ReactNativeBridgeEventPlugin,
+  });
+}
+
+module.exports = {
+  inject: inject,
+};