Feature: Introduce a standalone package for Vitest + Angular support

brandonroberts commented 5 months ago

Which scope/s are relevant/related to the feature request?

Don't know / other

Information

This would be a standalone package for Vitest and Angular with minimal external dependencies. We currently have the Vitest integration installed with @analogjs/platform and a schematic/generator for the initial setup. This would add a @analogjs/vitest-angular package to the repository which consists of:

Support for ng add as a standalone package
A dependency on the @analogjs/vite-plugin-angular package
A schematic for adding Vitest to a project manually without a hard dependency on Nx
A builder for running unit tests with Vitest without a hard dependency on Nx

Other considerations

Nx would still be supported in both scenarios, just not as a hard dependency
Potentially migrating existing usage of @analogjs/platform:vitest to the new standalone builder

Describe any alternatives/workarounds you're currently using

No response

I would be willing to submit a PR to fix this issue

[ ] Yes
[ ] No

brandonroberts commented 5 months ago

cc: @yjaaidi @rainerhahnekamp

rainerhahnekamp commented 5 months ago

Yes, absolutely. That is the number one question: "Do I have to install the complete Analog framework for Vitest?". Having a standalone package makes it much clearer.

brandonroberts commented 3 months ago

The @analogjs/vitest-angular package has been released as part of Analog 1.4.0. It's a fully standalone Angular builder with no external dependencies.

Installation instructions https://www.npmjs.com/package/@analogjs/vitest-angular

Feedback is welcomed!

rainerhahnekamp commented 3 months ago

Thanks Brandon, will give it a try asap

NateRadebaugh commented 3 months ago

Works great, thanks!

One piece of feedback: it feels kind of odd importing from @analogjs/vite-plugin-angular since that's no longer an explicit dependency. I'm wondering if it would "feel better" to import the vite plugin from @analogjs/vitest-angular

brandonroberts commented 3 months ago

Works great, thanks!

One piece of feedback: it feels kind of odd importing from @analogjs/vite-plugin-angular since that's no longer an explicit dependency. I'm wondering if it would "feel better" to import the vite plugin from @analogjs/vitest-angular

Interesting. It's not an explicit dependency in that you are not required to use @analogjs/vite-plugin-angular. For example, @yjaaidi has a plugin also that they could use with the Vitest builder.

The plugin and the builder are still two separate packages because the plugin can be used in other environments.

NateRadebaugh commented 3 months ago

The plugin and the builder are still two separate packages because the plugin can be used in other environments.

Thanks yes I understand that. What I meant is that sometimes libraries will re-export its contents for a more ergonomic/abstracted API. Either way works.

NateRadebaugh commented 3 months ago

@brandonroberts can you confirm whether this new @analogjs/vitest-angular package is supposed to only be installable with applications targeting ng 18+ at this point?

Found: @angular/compiler-cli@17.3.10
Could not resolve dependency: peer @angular/compiler-cli@"^18.0.0" from @ngtools/webpack@18.0.1

npm ERR! While resolving: @ngtools/webpack@18.0.1 npm ERR! Found: @angular/compiler-cli@17.3.10 npm ERR! node_modules/@angular/compiler-cli npm ERR! dev @angular/compiler-cli@"^17.3.1" from the root project npm ERR! peer @angular/compiler-cli@"^17.0.0" from @angular-devkit/build-angular@17.3.8 npm ERR! node_modules/@angular-devkit/build-angular npm ERR! dev @angular-devkit/build-angular@"^17.3.7" from the root project npm ERR! peer @angular-devkit/build-angular@"^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0" from @analogjs/vite-plugin-angular@1.4.0 npm ERR! node_modules/@analogjs/vite-plugin-angular npm ERR! peer @analogjs/vite-plugin-angular@"^1.3.0" from @analogjs/vitest-angular@1.4.0 npm ERR! node_modules/@analogjs/vitest-angular npm ERR! dev @analogjs/vitest-angular@"^1.4.0" from the root project npm ERR! 2 more (@ngtools/webpack, @angular/localize) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer @angular/compiler-cli@"^18.0.0" from @ngtools/webpack@18.0.1 npm ERR! node_modules/@ngtools/webpack npm ERR! peer @ngtools/webpack@"^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0" from @analogjs/vite-plugin-angular@1.4.0 npm ERR! node_modules/@analogjs/vite-plugin-angular npm ERR! peer @analogjs/vite-plugin-angular@"^1.3.0" from @analogjs/vitest-angular@1.4.0 npm ERR! node_modules/@analogjs/vitest-angular npm ERR! dev @analogjs/vitest-angular@"^1.4.0" from the root project

brandonroberts commented 3 months ago

@NateRadebaugh no, Angular v18+ is not a requirement. Because we support multiple versions of Angular, there's a bit of a "drift" with peer dependencies. Try installing the @ngtools/webpack for v17.

npm i @ngtools/webpack@17.3 --save-dev

NateRadebaugh commented 3 months ago

@NateRadebaugh no, Angular v18+ is not a requirement. Because we support multiple versions of Angular, there's a bit of a "drift" with peer dependencies. Try installing the @ngtools/webpack for v17.
npm i @ngtools/webpack@17.3 --save-dev

Thank you, this worked for me. I appreciate the response.

yjaaidi commented 3 months ago

Amazing job @brandonroberts as usual!! Thanks! This fills a missing bridge 😉

analogjs / analog