Skip to content
This repository has been archived by the owner on Feb 12, 2022. It is now read-only.

Make React tests fast #2187

Closed
wants to merge 22 commits into from
Closed
Show file tree
Hide file tree
Changes from 20 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 9 additions & 23 deletions fb-www/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -81,46 +81,32 @@ To enter a watching mode, run `yarn test-react --watch`. This will re-run them o

If you’re debugging a specific test case, the easiest way to focus on it is to:

* Open `scripts/test-react.js`.
* Open `test/react/SomeTestFileName-test.js`.
* Find the test in the code by searching for its filename.

For example, you may find something like:

```js
it("fb-www 5", async () => {
await runTest(directory, "fb5.js");
it("fb-www 5", () => {
runTest(directory, "fb5.js");
});
```

* Change `it` to `fit` to “focus” on a specific test and skip all other tests.

```diff
- it("fb-www 5", async () => {
+ fit("fb-www 5", async () => {
await runTest(directory, "fb5.js");
- it("fb-www 5", () => {
+ fit("fb-www 5", () => {
runTest(directory, "fb5.js");
});
```
* Run the watch mode: `yarn test-react --watch`
* Run the watch mode: `yarn test-react --watch SomeTestFileName`

Now only this test alone will re-run on every change which should help debug problems faster.

By default, tests run in four different input/output configurations. If too many runs are confusing when debugging a problem, you can comment out all modes except one [at the very bottom of the test file](https://github.com/facebook/prepack/blob/30876d5becade1dad7319682a075b6df252341a2/scripts/test-react.js#L748-L753).
By default, tests run in four different input/output configurations. If too many runs are confusing when debugging a problem, you can run a subset with `yarn test-react-fast --watch SomeFileName`. Unlike `yarn test-react`, `yarn test-react-fast` skips checking that JSX syntax works. This mode is much faster but you will see some annoying messages about obsolete snapshots (which you should ignore in this mode).

For example:

```diff
// pre non-transpiled
runTestSuite(true, false);
-runTestSuite(false, false);
+// runTestSuite(false, false);
// pre transpiled
-runTestSuite(true, true);
+ // runTestSuite(true, true);
-runTestSuite(false, true);
+ // runTestSuite(false, true);
```

Finally, sometimes it’s helpful to see the code Prepack is emitting. Search for a [variable called `transformedSource`](https://github.com/facebook/prepack/blob/30876d5becade1dad7319682a075b6df252341a2/scripts/test-react.js#L115) in the test file.
Finally, sometimes it’s helpful to see the code Prepack is emitting. Search for a variable called `transformedSource` a file called `setupReactTests.js`.
If you add `console.log(transformedSource)` you will see the Prepack output during test runs.

Don’t forget to revert any such changes before committing!
Expand Down
11 changes: 8 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,8 @@
"test-error-handler-with-coverage": "./node_modules/.bin/istanbul cover ./lib/test-error-handler.js --dir coverage.error && ./node_modules/.bin/remap-istanbul -i coverage.error/coverage.json -o coverage-sourcemapped.error -t html",
"test-node-cli-mode": "bash < scripts/test-node-cli-mode.sh",
"test-std-in": "bash < scripts/test-std-in.sh",
"test-react": "jest scripts/test-react",
"test-react": "jest",
"test-react-fast": "SKIP_REACT_JSX_TESTS=true jest",
"test": "yarn test-residual && yarn test-serializer && yarn test-sourcemaps && yarn test-error-handler && yarn test-std-in && yarn test-test262 && yarn test-internal && yarn test-internal-react && yarn test-react",
"test-coverage-most": "./node_modules/.bin/istanbul --stack_size=10000 --max_old_space_size=16384 cover ./lib/multi-runner.js --dir coverage.most && ./node_modules/.bin/remap-istanbul -i coverage.most/coverage.json -o coverage-sourcemapped -t html",
"test-all-coverage": "./node_modules/.bin/istanbul --stack_size=10000 --max_old_space_size=16384 cover ./lib/multi-runner.js --dir coverage.most && ./node_modules/.bin/istanbul --stack_size=10000 --max_old_space_size=16384 cover ./lib/test262-runner.js --timeout 50 --singleThreaded && ./node_modules/.bin/remap-istanbul -i coverage/coverage.json -i coverage.most/coverage.json -o coverage-sourcemapped -t html",
Expand Down Expand Up @@ -97,7 +98,7 @@
"graceful-fs": "^4.1.11",
"invariant": "^2.2.0",
"istanbul": "^0.4.5",
"jest": "^22.2.1",
"jest": "^23.2.0",
"js-yaml": "^3.6.1",
"jsdom": "^9.2.1",
"madge": "^1.6.0",
Expand Down Expand Up @@ -126,8 +127,12 @@
"license": "BSD-3-Clause",
"author": "Facebook",
"jest": {
"roots": [
"<rootDir>/lib/",
"<rootDir>/test/react/"
],
"testMatch": [
"**/scripts/test-react.js"
"**/test/react/*-test.js"
]
}
}
Loading