Merge branch 'master' into use-offline-version-when-it-is-possible

Author: gaearon

appveyor.yml

@@ -0,0 +1,40 @@
+environment:
+  matrix:
+    - nodejs_version: 6
+      test_suite: "simple"
+    - nodejs_version: 6
+      test_suite: "installs"
+    - nodejs_version: 6
+      test_suite: "kitchensink"
+    - nodejs_version: 4
+      test_suite: "simple"
+    - nodejs_version: 4
+      test_suite: "installs"
+    - nodejs_version: 4
+      test_suite: "kitchensink"
+
+cache:
+  - node_modules
+  - packages\react-scripts\node_modules
+
+clone_depth: 50
+
+branches:
+  only:
+  - master
+
+matrix:
+  fast_finish: true
+
+platform:
+  - x64
+
+install:
+  - ps: Install-Product node $env:nodejs_version $env:platform
+
+build: off
+
+test_script:
+  - node --version
+  - npm --version
+  - sh tasks/e2e-%test_suite%.sh

packages/create-react-app/index.js

@@ -39,6 +39,7 @@
 'use strict';
 
 var chalk = require('chalk');
+var validateProjectName = require("validate-npm-package-name");
 
 var currentNodeVersion = process.versions.node;
 if (currentNodeVersion.split('.')[0] < 4) {
@@ -98,6 +99,14 @@ if (typeof projectName === 'undefined') {
   process.exit(1);
 }
 
+function printValidationResults(results) {
+  if (typeof results !== 'undefined') {
+    results.forEach(function (error) {
+      console.error(chalk.red('  * ' + error));
+    });
+  }
+}
+
 var hiddenProgram = new commander.Command()
   .option('--internal-testing-template <path-to-template>', '(internal usage only, DO NOT RELY ON THIS) ' +
     'use a non-standard application template')
@@ -201,8 +210,9 @@ function run(root, appName, version, verbose, originalDirectory, template) {
     checkNodeVersion(packageName);
 
     // Since react-scripts has been installed with --save
-    // We need to move it into devDependencies and rewrite package.json
-    moveReactScriptsToDev(packageName);
+    // we need to move it into devDependencies and rewrite package.json
+    // also ensure react dependencies have caret version range
+    fixDependencies(packageName);
 
     var scriptsPath = path.resolve(
       process.cwd(),
@@ -234,6 +244,7 @@ function run(root, appName, version, verbose, originalDirectory, template) {
     if (!remainingFiles.length) {
       // Delete target folder if empty
       console.log('Deleting', chalk.cyan(appName + '/'), 'from', chalk.cyan(path.resolve(root, '..')));
+      process.chdir(path.resolve(root, '..'));
       fs.removeSync(path.join(root));
     }
     console.log('Done.');
@@ -317,11 +328,18 @@ function checkNodeVersion(packageName) {
 }
 
 function checkAppName(appName) {
+  var validationResult = validateProjectName(appName);
+  if (!validationResult.validForNewPackages) {
+    console.error('Could not create a project called ' + chalk.red('"' + appName + '"') + ' because of npm naming restrictions:');
+    printValidationResults(validationResult.errors);
+    printValidationResults(validationResult.warnings);
+    process.exit(1);
+  }
+  
   // TODO: there should be a single place that holds the dependencies
   var dependencies = ['react', 'react-dom'];
   var devDependencies = ['react-scripts'];
   var allDependencies = dependencies.concat(devDependencies).sort();
-
   if (allDependencies.indexOf(appName) >= 0) {
     console.error(
       chalk.red(
@@ -339,7 +357,29 @@ function checkAppName(appName) {
   }
 }
 
-function moveReactScriptsToDev(packageName) {
+function makeCaretRange(dependencies, name) {
+  var version = dependencies[name];
+
+  if (typeof version === 'undefined') {
+    console.error(
+      chalk.red('Missing ' + name + ' dependency in package.json')
+    );
+    process.exit(1);
+  }
+
+  var patchedVersion = '^' + version;
+
+  if (!semver.validRange(patchedVersion)) {
+    console.error(
+      'Unable to patch ' + name + ' dependency version because version ' + chalk.red(version) + ' will become invalid ' + chalk.red(patchedVersion)
+    );
+    patchedVersion = version;
+  }
+
+  dependencies[name] = patchedVersion;
+}
+
+function fixDependencies(packageName) {
   var packagePath = path.join(process.cwd(), 'package.json');
   var packageJson = require(packagePath);
 
@@ -363,6 +403,9 @@ function moveReactScriptsToDev(packageName) {
   packageJson.devDependencies[packageName] = packageVersion;
   delete packageJson.dependencies[packageName];
 
+  makeCaretRange(packageJson.dependencies, 'react');
+  makeCaretRange(packageJson.dependencies, 'react-dom');
+
   fs.writeFileSync(packagePath, JSON.stringify(packageJson, null, 2));
 }
 

packages/create-react-app/package.json

@@ -24,6 +24,7 @@
     "commander": "^2.9.0",
     "cross-spawn": "^4.0.0",
     "fs-extra": "^1.0.0",
-    "semver": "^5.0.3"
+    "semver": "^5.0.3",
+    "validate-npm-package-name": "^3.0.0"
   }
 }

packages/react-scripts/config/webpack.config.dev.js

@@ -114,14 +114,13 @@ module.exports = {
         test: /\.(js|jsx)$/,
         enforce: 'pre',
         use: [{
+          // @remove-on-eject-begin
+          // Point ESLint to our predefined config.
           options: {
-            // @remove-on-eject-begin
-            // Point ESLint to our predefined config.
             configFile: path.join(__dirname, '../.eslintrc'),
-            useEslintrc: false,
-            // @remove-on-eject-end
-            cache: true
+            useEslintrc: false
           },
+          // @remove-on-eject-end
           loader: 'eslint-loader'
         }],
         include: paths.appSrc

packages/react-scripts/scripts/start.js

@@ -220,7 +220,8 @@ function addMiddleware(devServer) {
       onError: onProxyError(proxy),
       secure: false,
       changeOrigin: true,
-      ws: true
+      ws: true,
+      xfwd: true
     });
     devServer.use(mayProxy, hpm);
 

packages/react-scripts/template/README.md

@@ -269,7 +269,7 @@ Then add the block below to your `launch.json` file and put it inside the `.vsco
     "request": "launch",
     "url": "http://localhost:3000",
     "webRoot": "${workspaceRoot}/src",
-    "userDataDir": "${workspaceRoot}/.chrome",
+    "userDataDir": "${workspaceRoot}/.vscode/chrome",
     "sourceMapPathOverrides": {
       "webpack:///src/*": "${webRoot}/*"
     }

tasks/e2e-installs.sh

@@ -127,7 +127,7 @@ cd $temp_app_path
 # we will install a non-existing package to simulate a failed installataion.
 create_react_app --scripts-version=`date +%s` test-app-should-not-exist || true
 # confirm that the project folder was deleted
-test ! -d test-app-should-not-exist
+# test ! -d test-app-should-not-exist
 
 # ******************************************************************************
 # Test project folder is not deleted when creating app over existing folder

tasks/e2e-kitchensink.sh

@@ -21,8 +21,10 @@ temp_app_path=`mktemp -d 2>/dev/null || mktemp -d -t 'temp_app_path'`
 
 function cleanup {
   echo 'Cleaning up.'
+  ps -ef | grep 'react-scripts' | grep -v grep | awk '{print $2}' | xargs kill -s 9
   cd $root_path
-  rm -rf $temp_cli_path $temp_app_path
+  # TODO: fix "Device or resource busy" and remove ``|| $CI`
+  rm -rf $temp_cli_path $temp_app_path || $CI
 }
 
 # Error messages are redirected to stderr
@@ -143,12 +145,19 @@ PORT=3001 \
   REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \
   NODE_PATH=src \
   nohup npm start &>$tmp_server_log &
-grep -q 'The app is running at:' <(tail -f $tmp_server_log)
+while true
+do
+  if grep -q 'The app is running at:' $tmp_server_log; then
+    break
+  else
+    sleep 1
+  fi
+done
 E2E_URL="http://localhost:3001" \
   REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \
   CI=true NODE_PATH=src \
   NODE_ENV=development \
-  node node_modules/.bin/mocha --require babel-register --require babel-polyfill integration/*.test.js
+  node_modules/.bin/mocha --require babel-register --require babel-polyfill integration/*.test.js
 
 # Test "production" environment
 E2E_FILE=./build/index.html \
@@ -197,7 +206,14 @@ PORT=3002 \
   REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \
   NODE_PATH=src \
   nohup npm start &>$tmp_server_log &
-grep -q 'The app is running at:' <(tail -f $tmp_server_log)
+while true
+do
+  if grep -q 'The app is running at:' $tmp_server_log; then
+    break
+  else
+    sleep 1
+  fi
+done
 E2E_URL="http://localhost:3002" \
   REACT_APP_SHELL_ENV_MESSAGE=fromtheshell \
   CI=true NODE_PATH=src \

tasks/e2e-simple.sh

@@ -65,6 +65,17 @@ set -x
 cd ..
 root_path=$PWD
 
+# Prevent lerna bootstrap, we only want top-level dependencies
+cp package.json package.json.bak
+grep -v "lerna bootstrap" package.json > temp && mv temp package.json
+npm install
+mv package.json.bak package.json
+
+# We need to install create-react-app deps to test it
+cd "$root_path"/packages/create-react-app
+npm install
+cd "$root_path"
+
 # If the node version is < 4, the script should just give an error.
 if [[ `node --version | sed -e 's/^v//' -e 's/\..*//g'` -lt 4 ]]
 then
@@ -73,6 +84,9 @@ then
   [[ $err_output =~ You\ are\ running\ Node ]] && exit 0 || exit 1
 fi
 
+# Still use npm install instead of directly calling lerna bootstrap to test
+# postinstall script functionality (one npm install should result in a working
+# project)
 npm install
 
 if [ "$USE_YARN" = "yes" ]