9021d3f5e1
In #37957, parts of the testing guide were broken out into separate guides. As part of that work, the `<live-example>` tags were also copied to the new guides. These `<live-example>` tags did not specify the targeted example project via the `name` attribute, thus they were implicitly targeting the example with the same name as the guide they were in. See the [Docs style guide][1] for more info. However, there is only one example project (`testing/`) and all `<live-example>` tags were supposed to target that. This worked fine on the `testing.md` guide, but it broke on other guides (which tried to target non-existing example projects based on their names). This commit fixes it by explicitly specifying which example is targeted by the `<live-example>` tags. It also removes the `embedded-style` attribute that has no effect. [1]: https://angular.io/guide/docs-style-guide#live-examples Fixes #38036 PR Close #38038
58 lines
1.9 KiB
Markdown
58 lines
1.9 KiB
Markdown
{@a code-coverage}
|
|
|
|
# Find out how much code you're testing
|
|
|
|
The CLI can run unit tests and create code coverage reports.
|
|
Code coverage reports show you any parts of your code base that may not be properly tested by your unit tests.
|
|
|
|
<div class="alert is-helpful">
|
|
|
|
For the sample app that the testing guides describe, see the <live-example name="testing" embedded-style noDownload>sample app</live-example>.
|
|
|
|
For the tests features in the testing guides, see <live-example name="testing" stackblitz="specs" noDownload>tests</live-example>.
|
|
|
|
</div>
|
|
|
|
|
|
To generate a coverage report run the following command in the root of your project.
|
|
|
|
<code-example language="sh" class="code-shell">
|
|
ng test --no-watch --code-coverage
|
|
</code-example>
|
|
|
|
When the tests are complete, the command creates a new `/coverage` folder in the project. Open the `index.html` file to see a report with your source code and code coverage values.
|
|
|
|
If you want to create code-coverage reports every time you test, you can set the following option in the CLI configuration file, `angular.json`:
|
|
|
|
```
|
|
"test": {
|
|
"options": {
|
|
"codeCoverage": true
|
|
}
|
|
}
|
|
```
|
|
|
|
## Code coverage enforcement
|
|
|
|
The code coverage percentages let you estimate how much of your code is tested.
|
|
If your team decides on a set minimum amount to be unit tested, you can enforce this minimum with the Angular CLI.
|
|
|
|
For example, suppose you want the code base to have a minimum of 80% code coverage.
|
|
To enable this, open the [Karma](https://karma-runner.github.io) test platform configuration file, `karma.conf.js`, and add the following in the `coverageIstanbulReporter:` key.
|
|
|
|
```
|
|
coverageIstanbulReporter: {
|
|
reports: [ 'html', 'lcovonly' ],
|
|
fixWebpackSourcePaths: true,
|
|
thresholds: {
|
|
statements: 80,
|
|
lines: 80,
|
|
branches: 80,
|
|
functions: 80
|
|
}
|
|
}
|
|
```
|
|
|
|
The `thresholds` property causes the tool to enforce a minimum of 80% code coverage when the unit tests are run in the project.
|
|
|