Better browser support (#3421)

* Add support for building es2015 versions of packages

* Build ES2015 versions of relevant packages

* Ensure no untranspiled code by linting build-es5 folders

.eslintignore

@@ -4,6 +4,7 @@ bin/
 docs/
 flow-typed/**
 packages/*/build/**
+packages/*/build-es5/**
 types/**
 website/build
 website/node_modules

.gitignore

@@ -12,6 +12,7 @@
 /node_modules
 
 /packages/*/build/
+/packages/*/build-es5/
 /packages/*/coverage/
 /packages/*/node_modules/
 /website/build

package.json

@@ -49,19 +49,20 @@
     "typescript": "^2.2.2"
   },
   "scripts": {
-    "build-clean": "rm -rf ./packages/*/build",
+    "build-clean": "rm -rf ./packages/*/build ./packages/*/build-es5",
     "build": "node ./scripts/build.js",
     "clean-all": "rm -rf ./node_modules && rm -rf ./packages/*/node_modules && rm -rf ./integration_tests/*/*/node_modules && yarn run build-clean",
     "danger": "node ./danger/node_modules/.bin/danger",
     "jest": "node ./packages/jest-cli/bin/jest.js",
     "jest-coverage": "yarn run jest --silent -- --coverage",
     "lint": "yarn run lint-prettier --silent && eslint . --cache && yarn run lint-docs --silent",
     "lint-docs": "eslint --config ./.eslintrc-docs.json --no-ignore --ext md ./docs/*.md",
+    "lint-es5-build": "eslint --no-eslintrc --no-ignore --env=browser packages/*/build-es5",
     "lint-prettier": "node scripts/prettier.js lint",
     "prettier": "node scripts/prettier.js write",
     "postinstall": "node ./scripts/postinstall.js && yarn run build --silent && (cd packages/eslint-plugin-jest && yarn link --silent) && yarn link eslint-plugin-jest --silent",
     "publish": "yarn run build-clean --silent && yarn run build --silent && lerna publish --silent",
-    "test-ci": "yarn run typecheck --silent && yarn run lint --silent && yarn run jest-coverage --silent -- -i && yarn run test-examples --silent && node scripts/mapCoverage.js && codecov",
+    "test-ci": "yarn run typecheck --silent && yarn run lint --silent && yarn run lint-es5-build && yarn run jest-coverage --silent -- -i && yarn run test-examples --silent && node scripts/mapCoverage.js && codecov",
     "test-ci-partial": "yarn run jest --silent -- -i && yarn run test-examples --silent",
     "test-examples": "node scripts/test_examples.js",
     "test-pretty-format-perf": "node packages/pretty-format/perf/test.js",
@@ -73,6 +74,7 @@
     "modulePathIgnorePatterns": [
       "examples/.*",
       "packages/.*/build",
+      "packages/.*/build-es5",
       "packages/jest-runtime/src/__tests__/test_root.*",
       "website/.*",
       "integration_tests/runtime-internal-module-registry/__mocks__"
@@ -104,7 +106,8 @@
       "/examples/",
       "/integration_tests/.*/__tests__",
       "\\.snap$",
-      "/packages/.*/build"
+      "/packages/.*/build",
+      "/packages/.*/build-es5"
     ],
     "testMatch": [
       "**/*-test.js"

packages/jest-diff/package.json

@@ -7,6 +7,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "chalk": "^1.1.3",
     "diff": "^3.2.0",

packages/jest-matcher-utils/package.json

@@ -8,6 +8,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "chalk": "^1.1.3",
     "pretty-format": "^19.0.0"

packages/jest-matchers/package.json

@@ -7,6 +7,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "jest-diff": "^19.0.0",
     "jest-matcher-utils": "^19.0.0",

packages/jest-message-util/package.json

@@ -7,6 +7,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "chalk": "^1.1.3",
     "micromatch": "^2.3.11",

packages/jest-mock/package.json

@@ -6,5 +6,6 @@
     "url": "https://github.com/facebook/jest.git"
   },
   "license": "BSD-3-Clause",
-  "main": "build/index.js"
+  "main": "build/index.js",
+  "browser": "build-es5/index.js"
 }

packages/jest-regex-util/package.json

@@ -6,5 +6,6 @@
     "url": "https://github.com/facebook/jest.git"
   },
   "license": "BSD-3-Clause",
-  "main": "build/index.js"
+  "main": "build/index.js",
+  "browser": "build-es5/index.js"
 }

packages/jest-util/package.json

@@ -7,6 +7,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "chalk": "^1.1.3",
     "graceful-fs": "^4.1.11",

packages/jest-validate/package.json

@@ -7,6 +7,7 @@
   },
   "license": "BSD-3-Clause",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "dependencies": {
     "chalk": "^1.1.3",
     "jest-matcher-utils": "^19.0.0",

packages/pretty-format/package.json

@@ -8,6 +8,7 @@
   "license": "BSD-3-Clause",
   "description": "Stringify any JavaScript value.",
   "main": "build/index.js",
+  "browser": "build-es5/index.js",
   "author": "James Kyle <me@thejameskyle.com>",
   "dependencies": {
     "ansi-styles": "^3.0.0"

scripts/build.js

@@ -19,24 +19,29 @@
  *  node ./scripts/build.js /users/123/jest/packages/jest-111/src/111.js
  */
 
-const babel = require('babel-core');
-const chalk = require('chalk');
 const fs = require('fs');
-const getPackages = require('./_getPackages');
 const glob = require('glob');
-const micromatch = require('micromatch');
 const mkdirp = require('mkdirp');
 const path = require('path');
 
+const babel = require('babel-core');
+const chalk = require('chalk');
+const micromatch = require('micromatch');
+
+const getPackages = require('./_getPackages');
+
 const SRC_DIR = 'src';
+const BUILD_DIR = 'build';
+const BUILD_ES5_DIR = 'build-es5';
 const JS_FILES_PATTERN = '**/*.js';
 const IGNORE_PATTERN = '**/__tests__/**';
 const PACKAGES_DIR = path.resolve(__dirname, '../packages');
 
-const babelOptions = JSON.parse(
+const babelNodeOptions = JSON.parse(
   fs.readFileSync(path.resolve(__dirname, '..', '.babelrc'), 'utf8')
 );
-babelOptions.babelrc = false;
+babelNodeOptions.babelrc = false;
+const babelEs5Options = Object.assign({}, babelNodeOptions, {presets: 'env'});
 
 const fixedWidth = str => {
   const WIDTH = 80;
@@ -48,6 +53,18 @@ const fixedWidth = str => {
   return strs.slice(0, -1).concat(lastString).join('\n');
 };
 
+function getPackageName(file) {
+  return path.relative(PACKAGES_DIR, file).split(path.sep)[0];
+}
+
+function getBuildPath(file, buildFolder) {
+  const pkgName = getPackageName(file);
+  const pkgSrcPath = path.resolve(PACKAGES_DIR, pkgName, SRC_DIR);
+  const pkgBuildPath = path.resolve(PACKAGES_DIR, pkgName, buildFolder);
+  const relativeToSrcPath = path.relative(pkgSrcPath, file);
+  return path.resolve(pkgBuildPath, relativeToSrcPath);
+}
+
 function buildPackage(p) {
   const srcDir = path.resolve(p, SRC_DIR);
   const pattern = path.resolve(srcDir, '**/*');
@@ -60,11 +77,28 @@ function buildPackage(p) {
 }
 
 function buildFile(file, silent) {
-  const packageName = path.relative(PACKAGES_DIR, file).split(path.sep)[0];
-  const packageSrcPath = path.resolve(PACKAGES_DIR, packageName, 'src');
-  const packageBuildPath = path.resolve(PACKAGES_DIR, packageName, 'build');
-  const relativeToSrcPath = path.relative(packageSrcPath, file);
-  const destPath = path.resolve(packageBuildPath, relativeToSrcPath);
+  buildFileFor(file, silent, 'node');
+
+  const pkgJsonPath = path.resolve(
+    PACKAGES_DIR,
+    getPackageName(file),
+    'package.json'
+  );
+  const {browser} = require(pkgJsonPath);
+  if (browser) {
+    if (browser.indexOf(BUILD_ES5_DIR) !== 0) {
+      throw new Error(
+        `browser field for ${pkgJsonPath} should start with "${BUILD_ES5_DIR}"`
+      );
+    }
+    buildFileFor(file, silent, 'es5');
+  }
+}
+
+function buildFileFor(file, silent, env) {
+  const buildDir = env === 'es5' ? BUILD_ES5_DIR : BUILD_DIR;
+  const destPath = getBuildPath(file, buildDir);
+  const babelOptions = env === 'es5' ? babelEs5Options : babelNodeOptions;
 
   mkdirp.sync(path.dirname(destPath));
   if (micromatch.isMatch(file, IGNORE_PATTERN)) {