Jest test coverage vs watch - reactjs

I seem to get different results in the summary chart when I run
npm test -- --coverage
versus when I run
npm test -- --coverage --watch
The watched version only shows 1 test total (suites related to changed files). However it also shows all the files in the summary chart (with worse stats)
I'm wondering if the chart is cached or something? I'm not sure why there is a difference.

After you run npm test -- --coverage --watch press a to run all tests.

Related

how to get code coverage in react with react testing library

I have written unit tests using react testing library(#testing-library/react & #testing-library/dom) and jest-dom(#testing-library/jest-dom). I am able to run my tests successfully.
I am not using jest/jest-cli complete pacakge. I am using react testing library along with that jest-dom(#testing-library/jest-dom) it might be some sub pacakge or something i am not sure what to call it exactly.
How to get code coverage using react testing library?
Well, create-react-app is giving you a lot out of the box but it is also imposing some constraints...
You can't just add the flag --coverage to npm run test because that script is already running your tests in watch mode (and things like running only failed tests and other things that you can do in the interactive mode would affect your coverage report anyway).
So first thing first, run your test in single run mode.
CI=true react-scripts test --env=jsdom
And because you already have a test task in your package.json you can simplify your task as so:
CI=true npm test -- --env=jsdom
Alright, we are getting closer...
So now, on top of that add the --coverage flag and you are all set:
CI=true npm test -- --env=jsdom --coverage
To summarize your npm task could be like:
"test:coverage": "CI=true npm test -- --env=jsdom --coverage"
And you will see your report in the terminal and the coverage folder will be generated, where you can see a lot of useful info, by the way!
Since react-scripts has incorporated jest configuration, you can just type in
npm run test --coverage or yarn test --coverage, to generate coverage report.
An actual answer to this question exists: npm test -- --coverage never exits
The RTL doesn't provide testing coverage stats, but Jest does if you add the following to package.json:
"test:coverage": "react-scripts test --env=jsdom --watchAll=false --coverage"
Then you can run:
npm run test:coverage
See either the answer I link to above or Watchmaker's answer even further above for more details.

Allure report consist test cases which is not in suite any more

I am using allure with webdriverio and mocha.After generate and opening. The report consist test cases which is not in test suite any more. Tried allure generate --clean but still getting the same result. When i delete every thing from allure result then it works .
You need to clean up the allure-results directory after each test run. You can do that manually, or prepend it to whatever command you're using to run your test. For example, if you're using npm scripts, you could do something like:
"scripts": {
"pretest": "rimraf allure-results",
"test": "wdio"
}
This uses the 'rimraf' npm module: https://www.npmjs.com/package/rimraf

How to run Jest tests with Yarn without any prompts?

I am trying to run my Jest unit tests in Team City but I always end up getting the prompt as shown below.
No tests found related to files changed since last commit.
Press `a` to run all tests, or run Jest with `--watchAll`.
Watch Usage
› Press a to run all tests.
› Press f to run only failed tests.
› Press p to filter by a filename regex pattern.
› Press t to filter by a test name regex pattern.
› Press q to quit watch mode.
› Press Enter to trigger a test run.
I tried running yarn test a to run all the tests. But once the tests have completed execution, I'm still getting the same prompt. I tried yarn test a q but that doesn't work. I also tried yarn test a --forceExit and yarn test a --bail but nothing happens, I still get the prompt. How can I run all my Jest tests without getting this prompt as there will be no interaction when running through Team City? Any help would be much appreciated.
--ci
When this option is provided, Jest will assume it is running in a CI environment. This changes the behavior when a new snapshot is encountered. Instead of the regular behavior of storing a new snapshot automatically, it will fail the test and require Jest to be run with --updateSnapshot. link
Also, you can change package.json to:
"test": "CI=true react-scripts test --env=jsdom",
which works great.
Your other option is to set CI in the command like any variable:
CI=true yarn test
In TeamCity, edit the setting for your configuration, then select Parameters on the side.
Click Add a new Parameter, and in the dialog popup that appears, under Kind: select Environment variable (env.).
Set the name to env.CI and set the value to true. Click Save.
Next time you run your build, your build should auto-run the tests and move on.
For bonus points (and if you are the administrator) go to Administration then under Projects edit the <Root project>. Click Parameters on the side and set the env.CI parameter to true so you don't have to set this for future projects.
yarn test --coverage
Will run only once (with coverage) and returns 0 on success and 1 on failure.
The following command worked for me.
CI=true yarn test

Is there an option to show all test descriptions when I run jest tests?

I'm using jest and enzyme with my create-react-app project. When I run npm test, I get an output that shows the names of the test files that passed but I'd like the output to also include the names of the tests.
Example:
Button.test.js
it ('renders button', () => {
const button = shallow(<Button type="save"/>);
expect(toJson(button)).toMatchSnapshot();
});
Right now when I run npm test the output is just:
PASS src/Button.test.js"
and the number of passed and failed tests (when the tests are successful). I would like the output to include "renders button" and any other test descriptions (like how the output looks when an rspec test is run).
From Jest's command-line options docs
--verbose
Display individual test results with the test suite hierarchy.
So running
jest --verbose
Will print all the names in describe, it, test blocks.
If you're running tests with yarn, you can do
yarn test --verbose
If you're running tests with npm, you can do
npm test -- --verbose
If you want to make this default, change your test script in package.json
"test": "react-scripts test --env=jsdom --verbose",
Now both yarn test and npm test should show all test names.
Note that, instead of
jest --verbose
you can also set verbose to true in jest.config.js:
// jest.config.js
module.exports = {
...
verbose: true,
}
The --verbose flag sounds like it might do what you are looking for. According to the docs, it displays individual test results.
I was having the same issue with create-react-app (using both jest and enzyme), but was able to get the tests to appear after appending the existing test script in package.json with --verbose=true. So it now appears "test": "react-scripts test --env=jsdom --verbose=true"
after doing this configuration in package.json( "test": "react-scripts test --env=jsdom --verbose",) try running your test by npm test.
Note : with npm run test description is not reflecting for me as well.

Running CRA Jest in non-interactive mode

Update: my use case is mainly to run tests at CI, but overriding default CRA Jest parameters is something I'm generally wondering about.
I'm running tests using the Jest, config that came with Create React App. It always launches into the interactive mode:
› Press a to run all tests.
› Press o to only run tests related to changed files.
› Press p to filter by a filename regex pattern.
› Press q to quit watch mode.
› Press Enter to trigger a test run.
But I don't want it to wait for my input. I want it to run once and then terminate. I tried using the --bail or --no-watchman switches but it still launches in interactive mode.
If I globally install jest, and run it in the root of my project, it executes once and finish (just as I want). But when I run npm test which runs react-scripts test, it goes into the watch mode even when I'm not passing --watch.
Update: I've also filed an issue on CRA.
You should use Jests --watchAll=false flag.
eg:
npm test -- --watchAll=false
Note: this is for react-scripts > 3.00
For older versions:
react-scripts >= 2.1.4 < 3.00
For non-ci, eg running tests locally, you can pass a --no-watch flag:
npm test --no-watch
react-scripts <= 2.1.3
CRA looks for a CI environment variable, if its present it doesn't run in watch mode.
CI=true npm test should do what you are looking for
See the User Guide -> Running Tests -> On your own environment
In your package.json scripts:
"test": "react-scripts test --watchAll=false"
Or npm test -- --watchAll=false
Or yarn test --watchAll=false
Note: the flag used to be called --no-watch in react-scripts < 3.0: https://github.com/facebook/create-react-app/blob/3.x/CHANGELOG.md#remove---no-watch-flag
non-interactive solution:
npm test a --watchAll=false
or
yarn test a --watchAll=false

Resources