Karma and Jasmine remain supported for Angular testing, but they are no longer the default for newly generated Angular CLI projects: Angular now defaults to Vitest. Karma is a practical choice when you are maintaining an existing Karma suite, need a browser-based runner, or deliberately want the established Karma/Jasmine setup. This guide covers project setup, local and CI runs, coverage configuration, and the Angular testing APIs you will use alongside Jasmine.
When Karma and Jasmine make sense for Angular
Angular’s Karma and Jasmine guide describes Karma as supported and widely used, while the current testing overview identifies Vitest as the default runner for new projects. The key distinction is that Jasmine is the testing framework, where you write suites and expectations, while Karma launches tests in a browser and reports their results.
As an Amazon Associate I earn from qualifying purchases.
Keeping Karma is often the lower-friction option for an existing project with working Karma configuration, browser-specific test needs, or established CI. For a new project, select Karma intentionally rather than assuming it will be generated by default. Angular describes Vitest’s default setup as running in Node.js with jsdom, avoiding the need to launch a browser; Karma’s workflow launches a browser. That is a difference in execution environment, not evidence that one is universally faster or more suitable.
Quick wins for a faster PC:
Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Repair Windows errors before they cause bigger problemsFix Now →Set up a new Angular project with Karma
To scaffold a new project using the documented Karma setup, run:
ng new my-karma-app --test-runner=karmaThe Angular CLI generates the project and its Karma/Jasmine configuration. This explicit option is important because newly created projects otherwise use the current default runner, Vitest.
Add Karma and Jasmine to an existing project
For an existing Angular workspace, Angular lists these development dependencies: karma, karma-chrome-launcher, karma-coverage, karma-jasmine, karma-jasmine-html-reporter, jasmine-core, and @types/jasmine. Install them with the package manager used by your project:
npm install --save-dev karma karma-chrome-launcher karma-coverage karma-jasmine karma-jasmine-html-reporter jasmine-core @types/jasmineyarn add --dev karma karma-chrome-launcher karma-coverage karma-jasmine karma-jasmine-html-reporter jasmine-core @types/jasminepnpm add --save-dev karma karma-chrome-launcher karma-coverage karma-jasmine karma-jasmine-html-reporter jasmine-core @types/jasminebun add --dev karma karma-chrome-launcher karma-coverage karma-jasmine karma-jasmine-html-reporter jasmine-core @types/jasmineSelect Karma in the workspace test target
In angular.json, set runner to karma in the relevant project’s test target. The exact surrounding layout depends on the workspace, so make this change in the existing test target rather than replacing unrelated project configuration.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
Make Jasmine globals available to TypeScript
If TypeScript reports that Jasmine functions such as describe and it are unknown, add jasmine to the types array in tsconfig.spec.json. This lets the spec TypeScript configuration recognize Jasmine’s global test functions.
Customize Karma only when needed
The Angular CLI assembles Karma’s configuration from the workspace options. If you need custom Karma settings, generate a configuration file with:
ng generate config karmaUse the generated karma.conf.js for settings that need to be expressed directly in Karma configuration, such as coverage reporters and thresholds.
Run tests locally and in CI
Local watch workflow
Run:
ng testIn the documented Karma workflow, Angular builds in watch mode and launches Karma. Results appear in the browser through the Jasmine HTML reporter, and saving a source change triggers another test run.
Do these 3 things before closing this tab:
1Repair Windows errors before they cause bigger problems2Scan for outdated or missing drivers - takes under a minute3Clear out junk files and repair common Windows errorsSingle-run CI workflow
Angular’s documented Karma command for a non-interactive CI run is:
ng test --no-watch --no-progress --browsers=ChromeHeadless--no-watch ends the run after the tests instead of waiting for file changes, and --no-progress disables the interactive progress display. ChromeHeadless asks Karma to use Chrome without a visible window. Before adopting the command, confirm that Chrome and the corresponding Karma launcher are available in the CI environment and that the project’s test configuration accepts the browser name.
Rank #4
Debug a failing browser test
- Make the Karma browser visible using the browser option or configuration appropriate to your project.
- Select DEBUG in the Karma page to open a test tab.
- Open the test file in the browser’s developer tools, set a breakpoint, and refresh the test tab.
This browser-based workflow is useful when a failure depends on browser behavior or you need to inspect execution at a specific line.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Configure test coverage thresholds
Angular’s Karma example configures coverage output in karma.conf.js and uses a check threshold of 80 for statements, branches, functions, and lines. These are illustrative settings in the Angular coverage guide, not required values or a universal quality benchmark.
coverageReporter: {
check: {
global: {
statements: 80,
branches: 80,
functions: 80,
lines: 80
}
}
}Set thresholds to match the project’s policy and existing coverage. A threshold makes the configured metrics enforceable; it does not by itself show whether tests cover the most important behavior.
Best Value
Use Angular testing APIs with Jasmine
Jasmine provides test structure and expectations, but Angular components and services often also need Angular’s testing utilities. TestBed configures a testing environment, and ComponentFixture gives a test a way to create and interact with a component. These APIs are useful independently of whether your specs use Karma/Jasmine or another runner.
Angular’s testing utility documentation notes that the page is being updated for Vitest and that some explanations and examples remain in a Karma/Jasmine context. Treat individual examples in light of the runner and setup they show.
Keep Karma or plan a migration?
Keeping a stable Karma suite and migrating to Vitest are separate decisions. Consider the project’s needs before changing runners:
Quick Recap
- Existing configuration: If Karma tests and CI are reliable, keeping them avoids migration work that may not solve a current problem.
- Execution environment: Karma launches a browser; Angular’s default Vitest setup uses Node.js and jsdom. Choose based on the behavior your tests need to exercise.
- Compatibility: Existing tests, custom configuration, and browser-specific assumptions may affect the effort involved in switching.
- CI setup: Karma’s headless workflow depends on an available browser and compatible launcher configuration. Account for that in your CI environment.
- Migration readiness: Angular’s migration guide describes migration from Karma/Jasmine to Vitest as experimental and says it requires the application build system. That is not a recommendation that every Karma project should migrate.
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.
