feat: support Vitest as configured by Angular 21#13122
feat: support Vitest as configured by Angular 21#13122lherman-vd wants to merge 1 commit intohelp-me-mom:mainfrom
Conversation
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #13122 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 228 228
Lines 4168 4169 +1
Branches 1187 1188 +1
=========================================
+ Hits 4168 4169 +1 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
|
|
||
| import { MockBuilder, MockRender, ngMocks } from 'ng-mocks'; | ||
|
|
||
| import { createMock } from '../../tests/mock-helpers'; |
There was a problem hiding this comment.
in examples, that doesn't work because each file here is a complete solution and shouldn't have local dependencies.
I know that typeof jest is ugly, but unfortunately, that what we should keep for now.
Please simply expand the condition to include the logic to create a right mock in case if vitest.
There was a problem hiding this comment.
Can I keep the utils for tests/ ?
I understand the reasoning for examples and did think it might raise issues.
What was particularly annoying with vitest is that since it is not present in earlier versions of angular it requires checking global which is accessed in various ways, but I should be able to find a way to do it. If you have a specific way in mind I'd be glad to use it.
There was a problem hiding this comment.
ah, I see your point.
okay. good. ignore my comment.
I'll find out a way how to automatically remove this code for docs generation.
thank you for the PR, and my apologies, it will take a while for me to review. I'll try to do that asap.
There was a problem hiding this comment.
I've managed to find a way in the meantime, just checking that all the tests still run but it should be good to keep the examples self-contained. I've also simplified the other test helpers I've made in relation to vitest with my findings.
| it('asserts behavior of AppComponent', () => { | ||
| const logoClickSpy = | ||
| typeof jest === 'undefined' ? jasmine.createSpy() : jest.fn(); | ||
| const logoClickSpy = createMock(); |
There was a problem hiding this comment.
this is where we should have now 3 branches for each framework.
lherman-vd
force-pushed
the
chore/ng21
branch
2 times, most recently
from
d78c5d0 to
7343d63
Compare
lherman-vd
changed the title
This commit adds support for Vitest in ngMocks.autoSpy and updates the testing infrastructure to support running tests under Vitest, by factoring common mock creation methods. Configuration-wise, AOT compilation does not work and has to be disabled, which is how it works with the previous Karma builder. This is due to NGCC not interpreting non-litterals in component decorators, meaning all components became non-standalone which broke all module-based tests. Angular dropped support for fakeAsync utilities handled by Zone.js when using the Vitest runner, meaning these tests have to be migrated to async-await, which has been done in a way that still allows to verify the legacy behavior under test runners which support it.
|
@satanTime Looks like you've done the same changes for Angular 21 as was done in this PR. I've thus rebased my PR and kept only the changes required for the native Vitest integration for Angular 21 and 22. This PR should resolve #7802. |
|
Hi @lherman-vd, thank you for the PR. I still need to find time to review it properly, please bear with me. |
|
Thanks for taking care of adding Vitest support! @satanTime Is there any update on this? |
3 participants
Hello,
Following the progress on #12557 and #12594, I thought I could take a look at making a minimal set of changes necessary to have basic support for Angular 21 & Vitest.
On the basic support of Angular 21, I've found that most failures stemmed from Angular having removed automatic Zone change detection as reported in angular/angular-cli#32047. I've also adjusted the remaining tests to be compatible with the new recommendations about HttpClient and its providers, because angular/angular#56212 has made it be provided in
rootmeaningng-mocksrightfully mocks it by default now.For Vitest, there are many test changes but most are due to having to adapt the mock creation methods, to simplify the changes I've taken the liberty of creating a set of helper methods for common use cases. This allows to run all the tests under each test runner and keeps the existing behavior. There are a few tests that had to be fundamentally changed, i.e. the ones containing
fakeAsyncbecause Angular has made it clear that it and other Zone-based test utilities were not included when running tests with Vitest. For these tests, provided it made sense to still validate the behavior, I've adjusted the declaration to support usingfakeAsyncwhere it was still possible and useasync-awaitfor Vitest.