test: add e2e test for Vitest browser configuration with Vitest v4

This commits adds a test to validate vitest version 4.

Author: alan-agius4

tests/e2e/tests/vitest/browser-custom-config-vitest-v4.ts

@@ -0,0 +1,67 @@
+import assert from 'node:assert/strict';
+import { applyVitestBuilder } from '../../utils/vitest';
+import { ng } from '../../utils/process';
+import { writeFile } from '../../utils/fs';
+import { installWorkspacePackages } from '../../utils/packages';
+import { updateJsonFile } from '../../utils/project';
+
+export default async function (): Promise<void> {
+  await applyVitestBuilder({
+    skipInstall: true,
+  });
+
+  await updateJsonFile('package.json', (json) => {
+    json.devDependencies = {
+      ...json.devDependencies,
+      '@vitest/browser-playwright': '^4',
+      'vitest': '^4',
+      'playwright': '^1',
+    };
+  });
+
+  await installWorkspacePackages();
+
+  await ng('generate', 'component', 'my-comp');
+
+  // Create vitest-base.config.mts
+  await writeFile(
+    'vitest-base.config.mts',
+    `
+      import { defineConfig } from 'vitest/config';
+      import { playwright } from '@vitest/browser-playwright';
+
+      export default defineConfig({
+        test: {
+          browser: {
+            enabled: true,
+            provider: playwright({launchOptions: {executablePath: process.env['CHROME_BIN']}}),
+            instances: [
+              { browser: 'chromium' },
+            ],
+            headless: true,
+          },
+        },
+      });
+    `,
+  );
+
+  // Create a spec file that asserts browser environment
+  await writeFile(
+    'src/browser.spec.ts',
+    `
+      describe('Browser Environment Check', () => {
+        it('should be running in Chromium', () => {
+          const ua = navigator.userAgent;
+          // Fail the test if it's not Chrome/Chromium
+          if (!ua.includes('Chrome') && !ua.includes('Chromium')) {
+            throw new Error('Expected to be running in Chrome/Chromium, but User Agent is: ' + ua);
+          }
+        });
+      });
+    `,
+  );
+
+  const { stdout } = await ng('test', '--no-watch', '--runner-config');
+
+  assert.match(stdout, /3 passed/, 'Expected 3 tests to pass.');
+}

tests/e2e/utils/vitest.ts

@@ -10,8 +10,9 @@ export async function applyVitestBuilder(options?: {
   coverageIstanbul?: boolean;
   playwright?: boolean;
   webdriver?: boolean;
+  skipInstall?: boolean;
 }): Promise<void> {
-  const { coverageV8, coverageIstanbul, playwright, webdriver } = options ?? {};
+  const { coverageV8, coverageIstanbul, playwright, webdriver, skipInstall } = options ?? {};
 
   const schematicsAngular = createRequire(process.cwd() + '/').resolve(
     '@schematics/angular/package.json',
@@ -47,7 +48,9 @@ export async function applyVitestBuilder(options?: {
     }
   });
 
-  await installWorkspacePackages();
+  if (!skipInstall) {
+    await installWorkspacePackages();
+  }
 
   await updateJsonFile('angular.json', (json) => {
     const projects = Object.values(json['projects']);