Skip to content

Commit d30c19e

Browse files
committed
docs: add initial experimental vitest testing guide
An initial guide to use the experimental unit testing system with the vitest runner has been added. This includes setup instructions for switching from the karma/jasmine based system. Additional content for configuration and potential migration of existing projects may be added in future changes.
1 parent b77042a commit d30c19e

File tree

1 file changed

+64
-0
lines changed

1 file changed

+64
-0
lines changed
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
# Experimental unit testing system
2+
3+
The Angular CLI also provides an experimental unit test system that can use [Vitest](https://vitest.dev/) as a test runner.
4+
5+
IMPORTANT: This experimental unit testing system requires the use of the `application` build system.
6+
This build system is the default for all newly created projects.
7+
8+
## Set up testing
9+
10+
The Angular CLI includes the test system within a new project but must be configured before it can be used.
11+
12+
The project you create with the CLI is setup to use the `karma` test system by default.
13+
To change to the experimental unit test system, the `test` target should be updated:
14+
15+
<docs-code language="json">
16+
"test": {
17+
"builder": "@angular/build:unit-test",
18+
"options": {
19+
"tsConfig": "tsconfig.spec.json",
20+
"runner": "vitest",
21+
"buildTarget": "::development",
22+
}
23+
}
24+
</docs-code>
25+
26+
The `buildTarget` operates similarly to the option available to the development server.
27+
Build options for the tests are configured within the `build` target itself.
28+
If the `development` build configuration does not exist for a project or different options are needed for testing, a `testing` or similarly named build configuration can be created and used instead.
29+
30+
To execute the application's testing, just run the [`ng test`](cli/test) CLI command as before:
31+
32+
<docs-code language="shell">
33+
34+
ng test
35+
36+
</docs-code>
37+
38+
The `ng test` command builds the application in *watch mode*, and launches the configured runner.
39+
40+
The console output looks like below:
41+
42+
<docs-code language="shell">
43+
✓ spec-app-app.spec.js (2 tests) 31ms
44+
✓ App > should create the app 22ms
45+
✓ App > should render title 8ms
46+
47+
Test Files 1 passed (1)
48+
Tests 2 passed (2)
49+
Start at 14:24:15
50+
Duration 1.16s (transform 628ms, setup 703ms, collect 64ms, tests 31ms, environment 188ms, prepare 33ms)
51+
</docs-code>
52+
53+
Watch mode is enabled by default when using an interactive terminal and not running on CI.
54+
55+
## Configuration
56+
57+
The Angular CLI takes care of the Vitest configuration for you. It constructs the full configuration in memory, based on options specified in the `angular.json` file.
58+
Directly customizing the underlying test runner configuration is currently not supported.
59+
60+
## Bug reports
61+
62+
Report issues and feature requests on [GitHub](https://github.com/angular/angular-cli/issues).
63+
64+
Please provide a minimal reproduction where possible to aid the team in addressing issues.

0 commit comments

Comments
 (0)