What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
To migrate an existing Angular project from Karma and Jasmine to Vitest, first confirm that it uses Angular’s application build system, then install Vitest and a DOM emulator, switch the test target in angular.json, review test-specific build options and custom Karma behavior, and only then refactor tests. Angular describes this migration as experimental. Karma remains supported, so migrating is optional.
Should you migrate from Karma to Vitest?
For new Angular projects, the CLI uses Vitest as its default unit test runner. The Angular roadmap says Vitest became the primary runner after its stable release in Angular v21, but the tool for moving existing Karma/Jasmine projects remains experimental. Angular’s testing guide continues to support Karma; the cited guidance sets no general deadline or requirement to switch.
As an Amazon Associate I earn from qualifying purchases.
Migration is a reasonable option if your project meets the build-system prerequisite and you are prepared to review custom runner behavior and test changes. The choice depends on your project’s needs:
Free tools Windows power users keep installed
One-click scans. No signup required.
- Execution environment: Do tests need a real browser, or is a DOM emulator in Node sufficient?
- Custom Karma behavior: How much do your tests depend on custom reporters, plugins, or browser launchers?
- Test utilities: Do tests rely heavily on Zone.js utilities such as
fakeAsyncandflush? - Build configuration: Is the project already using Angular’s application build system, and do its test-only build options differ from development?
- Refactoring effort: Are there complex spies, mocks, or Jasmine patterns that will need careful manual conversion?
Angular’s migration guide summarizes the status plainly: “IMPORTANT: Migrating an existing project to Vitest is considered experimental.” Read Angular’s migration guide.
#1 Best Overall
Check the prerequisite before changing configuration
The migration guide requires the Angular application build system. Check the project’s build configuration before following the steps below. The guide does not establish which build system or Angular version a particular workspace uses; verify your repository and the compatibility of its Angular and Node versions with the packages you plan to install.
If the project does not use the application build system, address that prerequisite first rather than assuming the Vitest migration steps will apply unchanged.
Move the Angular CLI test target to Vitest
Keep the runner setup separate from Jasmine-to-Vitest source changes. The CLI builder and build options determine how Angular runs tests; the refactoring schematic changes test code. Configure the builder first, then convert and review the tests.
1. Install Vitest and a DOM emulator
Angular’s example installs vitest and jsdom. The CLI also detects happy-dom when it is installed; otherwise, it falls back to jsdom. Choose the emulator that fits the project, and verify package compatibility with your Angular and Node versions before installing.
2. Change the test builder in angular.json
In the project’s angular.json, set its test target builder to @angular/build:unit-test. The builder defaults to tsconfig.spec.json and the ::development build target. Set those explicitly if your workspace needs different values. See Angular’s unit-test builder migration guidance.
3. Review options that used to belong directly to the Karma test target
The old Karma builder allowed test-target options such as polyfills, assets, and styles. The unit-test builder does not accept those options directly in the same way. If their test values differ from the development build configuration, move them into a dedicated build target configuration. If they already match, Angular says no change is needed.
Rank #3
Account for custom Karma configuration
Before deleting karma.conf.js, inspect it for behavior your team still needs. A builder switch does not automatically replace custom runner behavior.
- Reporters: Find Vitest-compatible replacements for any custom or non-default reporters.
- Plugins: Check whether each plugin has an equivalent that works with your new setup.
- Browser launchers: Replace custom launchers with the Vitest
browsersoption and a suitable browser provider, if real-browser testing is needed. - Coverage: Angular CLI provides coverage through
ng test --coverage. - Other Vitest settings: You can put custom settings in
vitest.config.tsand connect that file withrunnerConfig.
Angular does not directly support the contents of custom runner configuration or third-party plugins, and it may override test.projects and test.include. Confirm that the behavior your workspace depends on is represented in the new configuration before removing the old one. Angular documents these configuration boundaries.
Choose Node DOM emulation or real-browser execution
The default setup runs tests in Node with a DOM emulator, so it does not launch a browser. Choose a real-browser provider if your tests need actual browser execution. Angular’s examples include the following options:
| Provider example | Browsers listed in Angular’s guide |
|---|---|
| Playwright | Chromium, Firefox, and WebKit |
| WebdriverIO | Chrome, Firefox, Safari, and Edge |
| Preview provider | WebContainer environments |
For browser execution, install a provider and configure browsers in the test target. Angular CLI enables headless mode when the CI environment variable is set or a browser name includes “Headless”; otherwise, it runs headed. Check provider support and compatibility with your project before choosing one. See the Angular browser-testing examples.
Convert Jasmine tests with the experimental schematic
After configuring the Vitest builder, run Angular’s experimental schematic for common Jasmine-to-Vitest changes:
Recommended Free Tools
ng g @schematics/angular:refactor-jasmine-vitest
The schematic can transform patterns including:
fitandfdescribeinto.onlyformsxitandxdescribeinto.skipformsspyOnintovi.spyOn- Selected Jasmine matchers and spy factories into Vitest equivalents
- Lifecycle hooks and
fail()intovi.fail()
Options include --project, --include, --file-suffix, --add-imports, --verbose, and --browser-mode. Use the options that fit the scope and style of your workspace.
What the schematic does not do
The schematic is a source refactoring aid, not a complete migration. It does not install dependencies, change angular.json, migrate build options, or remove karma.conf.js or test.ts. It adds TODOs for patterns it cannot convert, and it does not fully handle complex or nested spy scenarios. Review every change, especially spies and mocks, and resolve remaining TODOs manually. See Angular’s schematic details.
Handle Zone.js test utilities deliberately
If existing tests use fakeAsync, flush, or waitForAsync, Angular documents adding zone.js/plugins/vitest-patch to the test target’s polyfills as a compatibility bridge.
Angular nevertheless recommends planning a move toward native async patterns and Vitest fake timers. Treat the patch as documented support for using these utilities, not as a guarantee that every aspect of Zone.js test behavior is identical under Vitest. Read Angular’s Zone.js guidance.
Remove Karma setup only after checking dependencies
Angular’s guide lists karma.conf.js and src/test.ts for deletion and recommends removing Karma/Jasmine packages. Before doing so, check whether workspace scripts, other projects, or custom configuration still use them. The package-removal command in the guide is an example based on a newly generated CLI project, not a universal list of packages to uninstall.
Run the suite and resolve failures
- Run
ng testafter the builder and source changes. - Review failures against your test-specific build settings, runner behavior, and any TODOs left by the schematic.
- Manually fix tests the schematic could not convert, with particular attention to complex spies and mocks.
- Check interactive and CI execution separately: interactive runs use watch mode by default, while CI behavior differs.
Angular recommends running the suite and reviewing complex tests; the schematic does not guarantee that all tests will pass without manual fixes. The documented migration guidance does not provide a quantified success rate or establish a performance improvement.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
