feat(angular): generate vitest unit test runner by default and use angular builder

Author: leosvelperez

e2e/angular/src/config.test.ts

@@ -14,7 +14,7 @@ describe('angular.json v1 config', () => {
   beforeAll(() => {
     newProject({ packages: ['@nx/angular'] });
     runCLI(
-      `generate @nx/angular:app ${app1} --bundler=webpack --no-interactive`
+      `generate @nx/angular:app ${app1} --bundler=webpack --unit-test-runner=jest --no-interactive`
     );
     // reset workspace to use v1 config
     updateFile(`angular.json`, angularV1Json(app1));

e2e/angular/src/misc.test.ts

@@ -20,7 +20,9 @@ describe('Move Angular Project', () => {
     app1 = uniq('app1');
     app2 = uniq('app2');
     newPath = `subfolder/${app2}`;
-    runCLI(`generate @nx/angular:app ${app1} --no-interactive`);
+    runCLI(
+      `generate @nx/angular:app ${app1} --unit-test-runner=jest --no-interactive`
+    );
   });
 
   afterAll(() => cleanupProject());

packages/angular/src/generators/application/__snapshots__/application.spec.ts.snap

@@ -625,7 +625,71 @@ exports[`app --strict should enable strict type checking: e2e tsconfig.json 1`]
 }
 `;
 
-exports[`app --unit-test-runner vitest should add tsconfig.spec.json 1`] = `
+exports[`app angular compat support should generate components with the "component" type for versions lower than v20 1`] = `
+"import { Component } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { NxWelcomeComponent } from './nx-welcome.component';
+
+@Component({
+  imports: [NxWelcomeComponent, RouterModule],
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrl: './app.component.css',
+})
+export class AppComponent {
+  title = 'myapp';
+}
+"
+`;
+
+exports[`app angular compat support should generate components with the "component" type for versions lower than v20 2`] = `
+"<app-nx-welcome></app-nx-welcome>
+<router-outlet></router-outlet>
+"
+`;
+
+exports[`app angular compat support should generate components with the "component" type for versions lower than v20 3`] = `
+"import { TestBed } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { NxWelcomeComponent } from './nx-welcome.component';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [AppComponent, NxWelcomeComponent],
+    }).compileComponents();
+  });
+
+  it('should render title', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain(
+      'Welcome myapp'
+    );
+  });
+
+  it(\`should have as title 'myapp'\`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('myapp');
+  });
+});
+"
+`;
+
+exports[`app angular compat support should generate components with the "component" type for versions lower than v20 4`] = `
+"import { bootstrapApplication } from '@angular/platform-browser';
+import { appConfig } from './app/app.config';
+import { AppComponent } from './app/app.component';
+
+bootstrapApplication(AppComponent, appConfig).catch((err) =>
+  console.error(err)
+);
+"
+`;
+
+exports[`app angular compat support vitest & angular < 21 should add tsconfig.spec.json 1`] = `
 "{
   "extends": "./tsconfig.json",
   "compilerOptions": {
@@ -658,7 +722,7 @@ exports[`app --unit-test-runner vitest should add tsconfig.spec.json 1`] = `
 "
 `;
 
-exports[`app --unit-test-runner vitest should generate src/test-setup.ts 1`] = `
+exports[`app angular compat support vitest & angular < 21 should generate src/test-setup.ts 1`] = `
 "import '@angular/compiler';
 import '@analogjs/vitest-angular/setup-zone';
 
@@ -675,7 +739,7 @@ getTestBed().initTestEnvironment(
 "
 `;
 
-exports[`app --unit-test-runner vitest should generate vite.config.mts 1`] = `
+exports[`app angular compat support vitest & angular < 21 should generate vite.config.mts 1`] = `
 "/// <reference types='vitest' />
 import { defineConfig } from 'vite';
 import angular from '@analogjs/vite-plugin-angular';
@@ -707,70 +771,6 @@ export default defineConfig(() => ({
 "
 `;
 
-exports[`app angular compat support should generate components with the "component" type for versions lower than v20 1`] = `
-"import { Component } from '@angular/core';
-import { RouterModule } from '@angular/router';
-import { NxWelcomeComponent } from './nx-welcome.component';
-
-@Component({
-  imports: [NxWelcomeComponent, RouterModule],
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrl: './app.component.css',
-})
-export class AppComponent {
-  title = 'myapp';
-}
-"
-`;
-
-exports[`app angular compat support should generate components with the "component" type for versions lower than v20 2`] = `
-"<app-nx-welcome></app-nx-welcome>
-<router-outlet></router-outlet>
-"
-`;
-
-exports[`app angular compat support should generate components with the "component" type for versions lower than v20 3`] = `
-"import { TestBed } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-import { NxWelcomeComponent } from './nx-welcome.component';
-
-describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [AppComponent, NxWelcomeComponent],
-    }).compileComponents();
-  });
-
-  it('should render title', () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.querySelector('h1')?.textContent).toContain(
-      'Welcome myapp'
-    );
-  });
-
-  it(\`should have as title 'myapp'\`, () => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.componentInstance;
-    expect(app.title).toEqual('myapp');
-  });
-});
-"
-`;
-
-exports[`app angular compat support should generate components with the "component" type for versions lower than v20 4`] = `
-"import { bootstrapApplication } from '@angular/platform-browser';
-import { appConfig } from './app/app.config';
-import { AppComponent } from './app/app.component';
-
-bootstrapApplication(AppComponent, appConfig).catch((err) =>
-  console.error(err)
-);
-"
-`;
-
 exports[`app at the root should accept numbers in the path 1`] = `"src/9-websites/my-app"`;
 
 exports[`app format files should format files 1`] = `
@@ -1091,11 +1091,11 @@ exports[`app not nested should generate files: tsconfig.app.json 1`] = `
     "types": [],
   },
   "exclude": [
-    "jest.config.ts",
-    "src/test-setup.ts",
-    "src/**/*.test.ts",
     "src/**/*.spec.ts",
+    "src/**/*.test.ts",
+    "jest.config.ts",
     "jest.config.cts",
+    "src/test-setup.ts",
   ],
   "extends": "./tsconfig.json",
   "include": [