From 45df6bf9c83148c9bddfdc40cc9059b5cb22026c Mon Sep 17 00:00:00 2001
From: Enoah Netzach <f.castellarin@gmail.com>
Date: Wed, 18 Jan 2017 14:31:10 +0100
Subject: [PATCH 1/7] Local testing with docker
---
package.json | 1 +
tasks/local-test.sh | 87 +++++++++++++++++++++++++++++++++++++++++++++
2 files changed, 88 insertions(+)
create mode 100755 tasks/local-test.sh
diff --git a/package.json b/package.json
index e6bd7b0c3cf..d5c7a6c8fbd 100644
--- a/package.json
+++ b/package.json
@@ -5,6 +5,7 @@
"changelog": "lerna-changelog",
"create-react-app": "tasks/cra.sh",
"e2e": "tasks/e2e-simple.sh",
+ "e2e:docker": "tasks/local-test.sh",
"postinstall": "lerna bootstrap && cd packages/react-error-overlay/ && npm run build:prod",
"publish": "tasks/release.sh",
"start": "node packages/react-scripts/scripts/start.js",
diff --git a/tasks/local-test.sh b/tasks/local-test.sh
new file mode 100755
index 00000000000..b516e69e554
--- /dev/null
+++ b/tasks/local-test.sh
@@ -0,0 +1,87 @@
+#!/usr/bin/env bash
+
+function print_help {
+ echo "Usage: ${0} [OPTIONS]"
+ echo ""
+ echo "OPTIONS:"
+ echo " --node-version <version> the node version to use while testing [6]"
+ echo " --git-branch <branch> the git branch to checkout for testing [the current one]"
+ echo " --test-suite <suite> which test suite to use ('simple', installs', 'kitchensink', 'all') ['all']"
+ echo " --yarn if present, use yarn as the package manager"
+ echo " --help print this message and exit"
+ echo ""
+}
+
+cd $(dirname $0)
+
+node_version=6
+git_branch=`git rev-parse --abbrev-ref HEAD`
+use_yarn=no
+test_suite=all
+
+while [ "$1" != "" ]; do
+ case $1 in
+ "--node-version")
+ shift
+ node_version=$1
+ ;;
+ "--git-branch")
+ shift
+ git_branch=$1
+ ;;
+ "--yarn")
+ use_yarn=yes
+ ;;
+ "--test-suite")
+ shift
+ test_suite=$1
+ ;;
+ "--help")
+ print_help
+ exit 0
+ ;;
+ esac
+ shift
+done
+
+test_command="./tasks/e2e-simple.sh && ./tasks/e2e-kitchensink.sh && ./tasks/e2e-installs.sh"
+case ${test_suite} in
+ "all")
+ ;;
+ "simple")
+ test_command="./tasks/e2e-simple.sh"
+ ;;
+ "kitchensink")
+ test_command="./tasks/e2e-kitchensink.sh"
+ ;;
+ "installs")
+ test_command="./tasks/e2e-installs.sh"
+ ;;
+ *)
+ ;;
+esac
+
+read -r -d '' command <<- CMD
+echo "prefix=~/.npm" > ~/.npmrc
+mkdir ~/.npm
+export PATH=\$PATH:~/.npm/bin
+set -x
+git clone /var/create-react-app create-react-app --branch ${git_branch}
+cd create-react-app
+node --version
+npm --version
+npm install
+set +x
+${test_command} && echo -e "\n\e[1;32m✔ Job passed\e[0m" || echo -e "\n\e[1;31m✘ Job failes\e[0m"
+CMD
+
+docker run \
+ --env CI=true \
+ --env NPM_CONFIG_QUIET=true \
+ --env USE_YARN=${use_yarn} \
+ --tty \
+ --user node \
+ --volume ${PWD}/..:/var/create-react-app \
+ --workdir /home/node \
+ node:${node_version} \
+ bash -c "${command}"
From 33bca08d9b8efdc4112f248e095b47eba0743e18 Mon Sep 17 00:00:00 2001
From: Enoah Netzach <f.castellarin@gmail.com>
Date: Wed, 31 May 2017 20:19:03 +0200
Subject: [PATCH 2/7] Docs on e2e testing
---
CONTRIBUTING.md | 4 ++
.../fixtures/kitchensink/README.md | 54 +++++++++++++++++++
2 files changed, 58 insertions(+)
create mode 100644 packages/react-scripts/fixtures/kitchensink/README.md
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index a4e3414be66..c2a9b906774 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -90,6 +90,10 @@ and then run `npm start` or `npm run build`.
*Note: if you are using yarn, we suggest that you use `yarn install --no-lockfile` instead of the bare `yarn` or `yarn install` because we [intentionally](https://github.com/facebookincubator/create-react-app/pull/2014#issuecomment-300811661) do not ignore or add yarn.lock to our repo.*
+## Contributing to E2E (end to end) tests
+
+All information are in the dedicated [README](/packages/react-scripts/fixtures/kitchensink/README.md).
+
## Cutting a Release
1. Tag all merged pull requests that go into the release with the relevant milestone. Each merged PR should also be labeled with one of the [labels](https://github.com/facebookincubator/create-react-app/labels) named `tag: ...` to indicate what kind of change it is.
diff --git a/packages/react-scripts/fixtures/kitchensink/README.md b/packages/react-scripts/fixtures/kitchensink/README.md
new file mode 100644
index 00000000000..a1f0676b489
--- /dev/null
+++ b/packages/react-scripts/fixtures/kitchensink/README.md
@@ -0,0 +1,54 @@
+# Contributing to Create React App's E2E tests
+
+This test suite is a [kitchensink](FIXME: link needed), but has multiple usages in it.
+
+## Running the test suite
+
+Tests are automatically run by the CI tools.
+In order to run them locally, without having to manually install and configure everything, the `yarn e2e:docker` CLI command can be used.
+
+This is a simple script that runs a **Docker** container, where the node version, git branch to clone, test suite, and whether to run it with `yarn` or `npm` can be chosen.
+Simply run `yarn e2e:docker -- --help` to get additional info.
+
+N.B.: this command will clone the local repository in the docker container, so any uncommitted changes are ignored.
+
+## Writing tests
+
+Each time a new feature is added, it is advised to add at least one test covering it.
+
+Features are categorized by their scope:
+
+ - *env*, all those which deal with environment variables (e.g. `NODE_PATH`)
+
+ - *syntax*, all those which showcase a single EcmaScript syntax feature that is expected to be transpiled by **Babel**
+
+ - *webpack*, all those which make use of webpack settings, loaders or plugins
+
+### Using it as Unit Tests
+
+In it's most basic for this serve as a collection of unit tests on a single functionality.
+
+Unit tests are written in a `src/features/**/*.test.js` file located in the same folder as the feature they test, and usually consist of a simple `ReactDOM.render` call.
+
+These tests are run by **jest** and the environment is `test`, so that it resembles how a **Create React App** application is tested.
+
+### Using it as Integration Tests
+
+This suite tests how the single features as before behave while development and in production.
+A local HTTP server is started, then every single feature is loaded, one by one, to be tested.
+
+Test are written in `integration/{env|syntax|webpack}.test.js`, depending on their scope.
+
+For every test case added there is just a little chore to do:
+
+ - a `case` statement must be added in `src/App.js`, which simply perform a dynamic `import()` of the feature
+
+ - add a test case in the appropriate integration test file, which calls and awaits `initDOM` with the previous `SwitchCase` string
+
+An usual flow for the test itself is something similar to:
+
+ - add an `id` attribute in a target HTML tag in the feature itself
+
+ - since `initDOM` returns a `Document` element, the previous `id` attribute is used to target the feature's DOM and `expect` accordingly
+
+These tests are run by **mocha** (why not **jest**? See [this issue](https://github.com/facebook/jest/issues/2288)) and the environments used are both `development` and `production`.
From 09010d48b47ba1c52770baa07f773f6cbde031e9 Mon Sep 17 00:00:00 2001
From: Enoah Netzach <f.castellarin@gmail.com>
Date: Wed, 31 May 2017 20:34:47 +0200
Subject: [PATCH 3/7] `bash` callback after docker
---
tasks/local-test.sh | 7 +++++++
1 file changed, 7 insertions(+)
diff --git a/tasks/local-test.sh b/tasks/local-test.sh
index b516e69e554..116aa0cf71a 100755
--- a/tasks/local-test.sh
+++ b/tasks/local-test.sh
@@ -8,6 +8,7 @@ function print_help {
echo " --git-branch <branch> the git branch to checkout for testing [the current one]"
echo " --test-suite <suite> which test suite to use ('simple', installs', 'kitchensink', 'all') ['all']"
echo " --yarn if present, use yarn as the package manager"
+ echo " --interactive gain a bash shell after the test run"
echo " --help print this message and exit"
echo ""
}
@@ -18,6 +19,7 @@ node_version=6
git_branch=`git rev-parse --abbrev-ref HEAD`
use_yarn=no
test_suite=all
+interactive=false
while [ "$1" != "" ]; do
case $1 in
@@ -36,6 +38,9 @@ while [ "$1" != "" ]; do
shift
test_suite=$1
;;
+ "--interactive")
+ interactive=true
+ ;;
"--help")
print_help
exit 0
@@ -73,6 +78,7 @@ npm --version
npm install
set +x
${test_command} && echo -e "\n\e[1;32m✔ Job passed\e[0m" || echo -e "\n\e[1;31m✘ Job failes\e[0m"
+$([[ ${interactive} == 'true' ]] && echo 'bash')
CMD
docker run \
@@ -83,5 +89,6 @@ docker run \
--user node \
--volume ${PWD}/..:/var/create-react-app \
--workdir /home/node \
+ $([[ ${interactive} == 'true' ]] && echo '--interactive') \
node:${node_version} \
bash -c "${command}"
From d4e0baa4c71a3a5d9b542ad9b5890cbf2a5ba172 Mon Sep 17 00:00:00 2001
From: Enoah Netzach <f.castellarin@gmail.com>
Date: Thu, 1 Jun 2017 10:32:20 +0200
Subject: [PATCH 4/7] Add a TL;DR in the CONTRIBUTING section
---
CONTRIBUTING.md | 4 +++-
1 file changed, 3 insertions(+), 1 deletion(-)
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index c2a9b906774..1c93e310da3 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -92,7 +92,9 @@ and then run `npm start` or `npm run build`.
## Contributing to E2E (end to end) tests
-All information are in the dedicated [README](/packages/react-scripts/fixtures/kitchensink/README.md).
+**TL;DR** use the command yarn e2e:docker to run unit and e2e tests.
+
+More detailed information are in the dedicated [README](/packages/react-scripts/fixtures/kitchensink/README.md).
## Cutting a Release
From 69f16116123fc087268d17efbe7d8c113a1084e4 Mon Sep 17 00:00:00 2001
From: Enoah Netzach <f.castellarin@gmail.com>
Date: Thu, 1 Jun 2017 11:19:53 +0200
Subject: [PATCH 5/7] Local e2e testing with modified files
---
tasks/local-test.sh | 23 +++++++++++++++++++++--
1 file changed, 21 insertions(+), 2 deletions(-)
diff --git a/tasks/local-test.sh b/tasks/local-test.sh
index 116aa0cf71a..42d98ffcdcf 100755
--- a/tasks/local-test.sh
+++ b/tasks/local-test.sh
@@ -16,7 +16,8 @@ function print_help {
cd $(dirname $0)
node_version=6
-git_branch=`git rev-parse --abbrev-ref HEAD`
+current_git_branch=`git rev-parse --abbrev-ref HEAD`
+git_branch=${current_git_branch}
use_yarn=no
test_suite=all
interactive=false
@@ -66,6 +67,24 @@ case ${test_suite} in
;;
esac
+read -r -d '' apply_changes <<- CMD
+cd /var/create-react-app
+git config --global user.name "Create React App"
+git config --global user.email "cra@email.com"
+git stash save -u
+git stash show -p > patch
+git diff 4b825dc642cb6eb9a060e54bf8d69288fbee4904 stash^3 >> patch
+git stash pop
+cd -
+mv /var/create-react-app/patch .
+git apply patch
+rm patch
+CMD
+
+if [ ${git_branch} != ${current_git_branch} ]; then
+ apply_changes=''
+fi
+
read -r -d '' command <<- CMD
echo "prefix=~/.npm" > ~/.npmrc
mkdir ~/.npm
@@ -73,9 +92,9 @@ export PATH=\$PATH:~/.npm/bin
set -x
git clone /var/create-react-app create-react-app --branch ${git_branch}
cd create-react-app
+${apply_changes}
node --version
npm --version
-npm install
set +x
${test_command} && echo -e "\n\e[1;32m✔ Job passed\e[0m" || echo -e "\n\e[1;31m✘ Job failes\e[0m"
$([[ ${interactive} == 'true' ]] && echo 'bash')
From 63327c92885142c804f153e8b686d869cdce839d Mon Sep 17 00:00:00 2001
From: Fabrizio Castellarin <f.castellarin@gmail.com>
Date: Thu, 1 Jun 2017 22:13:28 +0200
Subject: [PATCH 6/7] Remove the N.B. from the README
---
packages/react-scripts/fixtures/kitchensink/README.md | 2 --
1 file changed, 2 deletions(-)
diff --git a/packages/react-scripts/fixtures/kitchensink/README.md b/packages/react-scripts/fixtures/kitchensink/README.md
index a1f0676b489..174046b3a05 100644
--- a/packages/react-scripts/fixtures/kitchensink/README.md
+++ b/packages/react-scripts/fixtures/kitchensink/README.md
@@ -10,8 +10,6 @@ In order to run them locally, without having to manually install and configure e
This is a simple script that runs a **Docker** container, where the node version, git branch to clone, test suite, and whether to run it with `yarn` or `npm` can be chosen.
Simply run `yarn e2e:docker -- --help` to get additional info.
-N.B.: this command will clone the local repository in the docker container, so any uncommitted changes are ignored.
-
## Writing tests
Each time a new feature is added, it is advised to add at least one test covering it.
From ef0eabcead126239d1a238318f6240543ebd5775 Mon Sep 17 00:00:00 2001
From: Fabrizio Castellarin <f.castellarin@gmail.com>
Date: Sat, 3 Jun 2017 02:01:09 +0200
Subject: [PATCH 7/7] Fixed a fixme in e2e doc
---
packages/react-scripts/fixtures/kitchensink/README.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/packages/react-scripts/fixtures/kitchensink/README.md b/packages/react-scripts/fixtures/kitchensink/README.md
index 174046b3a05..8d259d56e94 100644
--- a/packages/react-scripts/fixtures/kitchensink/README.md
+++ b/packages/react-scripts/fixtures/kitchensink/README.md
@@ -1,6 +1,6 @@
# Contributing to Create React App's E2E tests
-This test suite is a [kitchensink](FIXME: link needed), but has multiple usages in it.
+This is an end to end kitchensink test suite, but has multiple usages in it.
## Running the test suite