[WIP] Use ES modules internally

package.json

@@ -108,9 +108,40 @@
     "version-check": "node ./scripts/tasks/version-check.js"
   },
   "jest": {
-    "projects": [
-      "<rootDir>/scripts/jest/stack.config.json",
-      "<rootDir>/scripts/jest/fiber.config.json"
-    ]
+    "modulePathIgnorePatterns": [
+      "/.module-cache/",
+      "<rootDir>/build/",
+      "<rootDir>/scripts/rollup/shims/",
+      "<rootDir>/scripts/bench/"
+    ],
+    "transform": {
+      ".*": "./scripts/jest/preprocessor.js"
+    },
+    "setupFiles": [
+      "./scripts/jest/setup.js",
+      "./scripts/jest/environment.js"
+    ],
+    "setupTestFrameworkScriptFile": "./scripts/jest/test-framework-setup.js",
+    "testRegex": "/__tests__/.*(\\.js|coffee|ts)$",
+    "moduleFileExtensions": [
+      "js",
+      "json",
+      "node",
+      "coffee",
+      "ts"
+    ],
+    "roots": [
+      "<rootDir>/eslint-rules",
+      "<rootDir>/mocks",
+      "<rootDir>/scripts",
+      "<rootDir>/src",
+      "node_modules/fbjs"
+    ],
+    "collectCoverageFrom": [
+      "src/**/*.js",
+      "!src/__mocks__/vendor/third_party/*.js",
+      "!src/test/*.js"
+    ],
+    "timers": "fake"
   }
 }

scripts/babel/transform-object-assign-require.js

@@ -13,16 +13,12 @@ module.exports = function autoImporter(babel) {
   const t = babel.types;
 
   function getAssignIdent(path, file, state) {
-    if (!state.id) {
-      state.id = path.scope.generateUidIdentifier('assign');
-      path.scope.getProgramParent().push({
-        id: state.id,
-        init: t.callExpression(t.identifier('require'), [
-          t.stringLiteral('object-assign'),
-        ]),
-      });
+    if (state.id) {
+      return state.id;
     }
-    return state.id;
+    const id = file.addImport('object-assign', 'default', 'assign');
+    state.id = id;
+    return id;
   }
 
   return {

scripts/error-codes/replace-invariant-error-codes.js

@@ -20,19 +20,17 @@ module.exports = function(babel) {
   var SEEN_SYMBOL = Symbol('replace-invariant-error-codes.seen');
 
   // Generate a hygienic identifier
-  function getProdInvariantIdentifier(path, localState) {
-    if (!localState.prodInvariantIdentifier) {
-      localState.prodInvariantIdentifier = path.scope.generateUidIdentifier(
-        'prodInvariant'
-      );
-      path.scope.getProgramParent().push({
-        id: localState.prodInvariantIdentifier,
-        init: t.callExpression(t.identifier('require'), [
-          t.stringLiteral('reactProdInvariant'),
-        ]),
-      });
+  function getProdInvariantIdentifier(path, file, localState) {
+    if (localState.prodInvariantIdentifier) {
+      return localState.prodInvariantIdentifier;
     }
-    return localState.prodInvariantIdentifier;
+    const id = file.addImport(
+      'reactProdInvariant',
+      'default',
+      'reactProdInvariant'
+    );
+    localState.prodInvariantIdentifier = id;
+    return id;
   }
 
   var DEV_EXPRESSION = t.identifier('__DEV__');
@@ -44,7 +42,7 @@ module.exports = function(babel) {
 
     visitor: {
       CallExpression: {
-        exit: function(path) {
+        exit: function(path, file) {
           var node = path.node;
           // Ignore if it's already been processed
           if (node[SEEN_SYMBOL]) {
@@ -59,7 +57,7 @@ module.exports = function(babel) {
             path.get('arguments')[0].isStringLiteral({value: 'invariant'})
           ) {
             node[SEEN_SYMBOL] = true;
-            getProdInvariantIdentifier(path, this);
+            getProdInvariantIdentifier(path, file, this);
           } else if (path.get('callee').isIdentifier({name: 'invariant'})) {
             // Turns this code:
             //
@@ -110,7 +108,7 @@ module.exports = function(babel) {
 
             devInvariant[SEEN_SYMBOL] = true;
 
-            var localInvariantId = getProdInvariantIdentifier(path, this);
+            var localInvariantId = getProdInvariantIdentifier(path, file, this);
             var prodInvariant = t.callExpression(
               localInvariantId,
               [t.stringLiteral(prodErrorId)].concat(node.arguments.slice(2))

scripts/jest/preprocessor.js

@@ -48,6 +48,8 @@ var babelOptions = {
         }),
       },
     ],
+    // TODO: is this enough?
+    require.resolve('babel-plugin-transform-es2015-modules-commonjs'),
     // Keep stacks detailed in tests.
     // Don't put this in .babelrc so that we don't embed filenames
     // into ReactART builds that include JSX.

scripts/jest/fiber.setup.js → scripts/jest/setup.js

@@ -2,12 +2,6 @@
 
 // We want to globally mock this but jest doesn't let us do that by default
 // for a file that already exists. So we have to explicitly mock it.
-jest.mock('ReactDOMFeatureFlags', () => {
-  const flags = require.requireActual('ReactDOMFeatureFlags');
-  return Object.assign({}, flags, {
-    useFiber: true,
-  });
-});
 jest.mock('ReactFeatureFlags', () => {
   const flags = require.requireActual('ReactFeatureFlags');
   return Object.assign({}, flags, {

scripts/rollup/modules.js

@@ -46,10 +46,7 @@ const fbjsModules = [
 ];
 
 const devOnlyFilesToStubOut = [
-  "'ReactDebugCurrentFrame'",
-  "'ReactComponentTreeHook'",
-  "'ReactPerf'",
-  "'ReactTestUtils'",
+  // TODO: figure out the ESM strategy
 ];
 
 const legacyModules = [

scripts/rollup/packaging.js

@@ -25,7 +25,7 @@ const facebookWWWSrcDependencies = [
 // these files need to be copied to the react-native build
 const reactNativeSrcDependencies = [
   // TODO: copy this to RN repository and delete from React
-  'src/renderers/shared/stack/PooledClass.js',
+  'src/renderers/native/PooledClass.js',
   'src/renderers/shared/fiber/isomorphic/ReactTypes.js',
   'src/renderers/native/ReactNativeTypes.js',
 ];