DEV Community

Cover image for Ng-News 25/43: Vitest - Angular's New Testing Framework
ng-news for This is Angular

Posted on

Ng-News 25/43: Vitest - Angular's New Testing Framework

Angular 21 goes with Vitest. A clear decision after years of uncertainty - and new discussions emerge around content projection.

⚡️ Angular Chooses Vitest

The decision about the future testing framework has finally been made: it’s going to be Vitest.

Starting with Angular 21, Vitest becomes the default testing framework.

So when you run ng new, Vitest will be selected by default – not Jasmine.

The best thing about this decision is not Vitest itself.

For more than two years, we didn’t really know which testing framework we should use – especially for new projects.

There was the official Jasmine/Karma combination.

But it was always said that Jasmine would be supported, while Karma would not. For Karma, a potential replacement was the Modern Web Test Runner.

As a second supported framework, it used to be Jest at the beginning.

But over time, we also saw Vitest becoming a potential candidate.

So as a developer, what should you do? Stay with Jasmine? Or use one of the modern ones?
Jest and Vitest were both available through community contributions. But you didn’t want to bet on Jest when Vitest might make it. Not the best situation.

And that’s why just having a decision – regardless of which testing framework – is a big relief for most of us.

feat(@schematics/angular): configure Vitest for new projects and libraries by clydin · Pull Request #31578 · angular/angular-cli | Matthieu Riegler | 12 comments

#Angular chooses #Vitest as it's new default testing framework starting in v21. While still experimental for now, It starts with new project coming with vitest set-up out of the box ! https://lnkd.in/d-VYDHiB | 12 comments on LinkedIn

favicon linkedin.com

🧪 Why Vitest Makes Sense

Vitest was the right decision.

From the Angular team’s perspective, it makes perfect sense.

They want to provide the best compatibility for migrations from Jasmine/Karma, which run in the browser.

Jest runs on Node.js, while Vitest provides a browser mode that executes tests exactly like Jasmine and Karma.

And Vitest’s browser mode just became stable last week with Vitest 4.

That was probably the deciding factor.

Apart from that, Vitest has a huge community. It’s used in almost all other frontend frameworks. It has no issues with ESM (unlike Jest), and it’s built with TypeScript as a first-class citizen.

It also brings Angular closer to the broader JavaScript ecosystem, where Vite has become the standard – and Vitest, as the name suggests, runs on top of Vite.

Vitest | Next Generation testing framework

Next generation testing framework powered by Vite

favicon vitest.dev

🧩 Content Projection Discussions

Alex Rickabaugh, tech lead of the Angular framework, published an issue listing current problems with content projection, especially in relation to Angular’s design.

At the moment, it’s still just a collection of links to related issues and explanations, not concrete solutions.

But it might indicate that we can expect progress in this area soon.

Canonical: Content Projection #64504

This canonical issue tracks all of the symptoms, problems, struggles, and weirdness which result from design choices made in Angular's content projection functionality. The issues deduplicated here may at first glance seem like problems in their own right, but actually are consequences of the way content projection works today. Rather than apply bandaid fixes which might make the system even more complicated, we want to address these problems at their source, by improving the content projection design.

Top comments (0)