fix(vite-plugin-angular): remove check for Vitest command in watch mo…

…de (#1606)
analogjs · Feb 10, 2025 · 744ed1f · 744ed1f
1 parent 16e6ba9
commit 744ed1f
Show file tree

Hide file tree

Showing 19 changed files with 108 additions and 122 deletions.
diff --git a/.prettierignore b/.prettierignore
@@ -10,3 +10,4 @@ pnpm-lock.yaml
 *.analog
 /.nx/workspace-data
 /packages/create-analog/template-*
+.vite-inspect
diff --git a/.prettierrc b/.prettierrc
@@ -1,5 +1,6 @@
 {
   "singleQuote": true,
+  "trailingComma": "all",
   "overrides": [
     {
       "files": "*.md",

diff --git a/apps/analog-app/index.html b/apps/analog-app/index.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />

diff --git a/apps/analog-app/src/app/pages/newsletter.page.ts b/apps/analog-app/src/app/pages/newsletter.page.ts
@@ -16,25 +16,24 @@ type FormErrors =
     <h3>Newsletter Signup</h3>
 
     @if (!signedUp()) {
-      <form
-        method="post"
-        (onSuccess)="onSuccess()"
-        (onError)="onError($any($event))"
-        (onStateChange)="errors.set(undefined)"
-      >
-        <div>
-          <label for="email"> Email </label>
-          <input type="email" name="email" />
-        </div>
-
-        <button class="button" type="submit">Submit</button>
-      </form>
-
-      @if (errors()?.email) {
-        <p>{{ errors()?.email }}</p>
-      }
-    } @else {
-      <div>Thanks for signing up!</div>
+    <form
+      method="post"
+      (onSuccess)="onSuccess()"
+      (onError)="onError($any($event))"
+      (onStateChange)="errors.set(undefined)"
+    >
+      <div>
+        <label for="email"> Email </label>
+        <input type="email" name="email" />
+      </div>
+
+      <button class="button" type="submit">Submit</button>
+    </form>
+
+    @if (errors()?.email) {
+    <p>{{ errors()?.email }}</p>
+    } } @else {
+    <div>Thanks for signing up!</div>
     }
   `,
 })

diff --git a/apps/analog-app/src/app/pages/search.page.ts b/apps/analog-app/src/app/pages/search.page.ts
@@ -20,7 +20,7 @@ import type { load } from './search.server';
     </form>
 
     @if (searchTerm()) {
-      <p>Search Term: {{ searchTerm() }}</p>
+    <p>Search Term: {{ searchTerm() }}</p>
     }
   `,
 })

diff --git a/apps/blog-app/index.html b/apps/blog-app/index.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />

diff --git a/apps/docs-app/docs/guides/forms.md b/apps/docs-app/docs/guides/forms.md
@@ -44,25 +44,24 @@ type FormErrors =
     <h3>Newsletter Signup</h3>
 
     @if (!signedUp()) {
-      <form
-        method="post"
-        (onSuccess)="onSuccess()"
-        (onError)="onError($any($event))"
-        (onStateChange)="errors.set(undefined)"
-      >
-        <div>
-          <label for="email"> Email </label>
-          <input type="email" name="email" />
-        </div>
-
-        <button class="button" type="submit">Submit</button>
-      </form>
-
-      @if (errors()?.email) {
-        <p>{{ errors()?.email }}</p>
-      }
-    } @else {
-      <div>Thanks for signing up!</div>
+    <form
+      method="post"
+      (onSuccess)="onSuccess()"
+      (onError)="onError($any($event))"
+      (onStateChange)="errors.set(undefined)"
+    >
+      <div>
+        <label for="email"> Email </label>
+        <input type="email" name="email" />
+      </div>
+
+      <button class="button" type="submit">Submit</button>
+    </form>
+
+    @if (errors()?.email) {
+    <p>{{ errors()?.email }}</p>
+    } } @else {
+    <div>Thanks for signing up!</div>
     }
   `,
 })
@@ -179,7 +178,7 @@ import type { load } from './search.server';
     </form>
 
     @if (searchTerm()) {
-      <p>Search Term: {{ searchTerm() }}</p>
+    <p>Search Term: {{ searchTerm() }}</p>
     }
   `,
 })

diff --git a/apps/ng-app/index.html b/apps/ng-app/index.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />

diff --git a/apps/trpc-app/index.html b/apps/trpc-app/index.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html class="dark h-full" lang="en">
   <head>
     <meta charset="utf-8" />

diff --git a/libs/card/src/lib/autocomplete/autocomplete.component.html b/libs/card/src/lib/autocomplete/autocomplete.component.html
@@ -10,7 +10,7 @@
   />
   <mat-autocomplete #autocomplete="matAutocomplete" autoActiveFirstOption>
     @for (option of filteredOptions(); track option) {
-      <mat-option [value]="option.value">{{ option.label }}</mat-option>
+    <mat-option [value]="option.value">{{ option.label }}</mat-option>
     }
   </mat-autocomplete>
 </mat-form-field>
diff --git a/packages/router/src/lib/debug/debug.page.ts b/packages/router/src/lib/debug/debug.page.ts
@@ -22,19 +22,17 @@ type CollectedRoute = {
         <div class="header-cell">Type</div>
       </div>
       <div class="table-body">
-        @for (
-          collectedRoute of collectedRoutes;
-          track collectedRoute.filename
+        @for ( collectedRoute of collectedRoutes; track collectedRoute.filename
         ) {
-          <div class="table-row">
-            <div class="table-cell">{{ collectedRoute.path }}</div>
-            <div class="table-cell" [title]="collectedRoute.filename">
-              {{ collectedRoute.file }}
-            </div>
-            <div class="table-cell">
-              {{ collectedRoute.isLayout ? 'Layout' : 'Page' }}
-            </div>
+        <div class="table-row">
+          <div class="table-cell">{{ collectedRoute.path }}</div>
+          <div class="table-cell" [title]="collectedRoute.filename">
+            {{ collectedRoute.file }}
           </div>
+          <div class="table-cell">
+            {{ collectedRoute.isLayout ? 'Layout' : 'Page' }}
+          </div>
+        </div>
         }
       </div>
     </div>

diff --git a/packages/router/src/lib/server.component.ts b/packages/router/src/lib/server.component.ts
@@ -98,7 +98,7 @@ export class ServerOnly {
                 };
               }
               return throwError(
-                () => ({}) as { html: string; outputs: ServerOutputs },
+                () => ({} as { html: string; outputs: ServerOutputs }),
               );
             }),
             catchError((error: unknown) => {

diff --git a/packages/trpc/src/lib/client/shared-internal.ts b/packages/trpc/src/lib/client/shared-internal.ts
@@ -90,25 +90,25 @@ export type CreateTRPCClientBaseOptions<TRouter extends AnyRouter> =
         transformer?: 'You must set a transformer on the backend router';
       }
     : TRouter['_def']['_config']['transformer'] extends DataTransformerOptions
-      ? {
-          /**
-           * Data transformer
-           *
-           * You must use the same transformer on the backend and frontend
-           * @link https://trpc.io/docs/data-transformers
-           **/
-          transformer: TRouter['_def']['_config']['transformer'] extends CombinedDataTransformer
-            ? DataTransformerOptions
-            : TRouter['_def']['_config']['transformer'];
-        }
-      : {
-          /**
-           * Data transformer
-           *
-           * You must use the same transformer on the backend and frontend
-           * @link https://trpc.io/docs/data-transformers
-           **/
-          transformer?:
-            | /** @deprecated **/ ClientDataTransformerOptions
-            | CombinedDataTransformer;
-        };
+    ? {
+        /**
+         * Data transformer
+         *
+         * You must use the same transformer on the backend and frontend
+         * @link https://trpc.io/docs/data-transformers
+         **/
+        transformer: TRouter['_def']['_config']['transformer'] extends CombinedDataTransformer
+          ? DataTransformerOptions
+          : TRouter['_def']['_config']['transformer'];
+      }
+    : {
+        /**
+         * Data transformer
+         *
+         * You must use the same transformer on the backend and frontend
+         * @link https://trpc.io/docs/data-transformers
+         **/
+        transformer?:
+          | /** @deprecated **/ ClientDataTransformerOptions
+          | CombinedDataTransformer;
+      };
diff --git a/packages/trpc/src/lib/client/trpc-rxjs-proxy.ts b/packages/trpc/src/lib/client/trpc-rxjs-proxy.ts
@@ -50,10 +50,10 @@ type DecorateProcedure<
       query: Resolver<TProcedure>;
     }
   : TProcedure extends AnyMutationProcedure
-    ? {
-        mutate: Resolver<TProcedure>;
-      }
-    : never;
+  ? {
+      mutate: Resolver<TProcedure>;
+    }
+  : never;
 
 // Removed subscription and using new type
 type DecoratedProcedureRecord<
@@ -66,8 +66,8 @@ type DecoratedProcedureRecord<
         TProcedures[TKey]
       >
     : TProcedures[TKey] extends AnyProcedure
-      ? DecorateProcedure<TProcedures[TKey], TRouter>
-      : never;
+    ? DecorateProcedure<TProcedures[TKey], TRouter>
+    : never;
 };
 
 // Removed subscription and using new type

diff --git a/packages/vite-plugin-angular/src/lib/angular-vite-plugin.spec.ts b/packages/vite-plugin-angular/src/lib/angular-vite-plugin.spec.ts
@@ -8,50 +8,44 @@ describe('angularVitePlugin', () => {
 });
 
 describe('isTestWatchMode', () => {
-  it('should return false if vitest command not included in the command', () => {
-    const result = isTestWatchMode('vite');
-
-    expect(result).toBeFalsy();
-  });
-
   it('should return false for vitest --run', () => {
-    const result = isTestWatchMode('vitest', ['--run']);
+    const result = isTestWatchMode(['--run']);
 
     expect(result).toBeFalsy();
   });
 
   it('should return true for vitest --no-run', () => {
-    const result = isTestWatchMode('vitest', ['--no-run']);
+    const result = isTestWatchMode(['--no-run']);
 
     expect(result).toBeTruthy();
   });
 
   it('should return true for vitest --watch', () => {
-    const result = isTestWatchMode('vitest', ['--watch']);
+    const result = isTestWatchMode(['--watch']);
 
     expect(result).toBeTruthy();
   });
 
   it('should return true for vitest watch', () => {
-    const result = isTestWatchMode('vitest', ['watch']);
+    const result = isTestWatchMode(['watch']);
 
     expect(result).toBeTruthy();
   });
 
   it('should return false for vitest --no-watch', () => {
-    const result = isTestWatchMode('vitest', ['--no-watch']);
+    const result = isTestWatchMode(['--no-watch']);
 
     expect(result).toBeFalsy();
   });
 
   it('should return false for vitest --watch=false', () => {
-    const result = isTestWatchMode('vitest', ['--watch=false']);
+    const result = isTestWatchMode(['--watch=false']);
 
     expect(result).toBeFalsy();
   });
 
   it('should return false for vitest --watch false', () => {
-    const result = isTestWatchMode('vitest', ['--watch', 'false']);
+    const result = isTestWatchMode(['--watch', 'false']);
 
     expect(result).toBeFalsy();
   });

diff --git a/packages/vite-plugin-angular/src/lib/angular-vite-plugin.ts b/packages/vite-plugin-angular/src/lib/angular-vite-plugin.ts
@@ -237,15 +237,17 @@ export function angular(options?: PluginOptions): Plugin[] {
       configResolved(config) {
         resolvedConfig = config;
 
-        // set test watch mode
-        // - vite override from vitest-angular
-        // - @nx/vite executor set server.watch explicitly to undefined (watch)/null (watch=false)
-        // - vite config for test.watch variable
-        // - vitest watch mode detected from the command line
-        testWatchMode =
-          !(config.server.watch === null) ||
-          config.test?.watch === true ||
-          testWatchMode;
+        if (isTest) {
+          // set test watch mode
+          // - vite override from vitest-angular
+          // - @nx/vite executor set server.watch explicitly to undefined (watch)/null (watch=false)
+          // - vite config for test.watch variable
+          // - vitest watch mode detected from the command line
+          testWatchMode =
+            !(config.server.watch === null) ||
+            config.test?.watch === true ||
+            testWatchMode;
+        }
       },
       configureServer(server) {
         viteServer = server;
@@ -1046,17 +1048,7 @@ function getFilenameFromPath(id: string): string {
  * Checks for vitest run from the command line
  * @returns boolean
  */
-export function isTestWatchMode(
-  command = process.env['_'],
-  args = process.argv,
-) {
-  const isVitestCommand = command?.includes('vitest');
-
-  // vitest command was not used
-  if (!isVitestCommand) {
-    return false;
-  }
-
+export function isTestWatchMode(args = process.argv) {
   // vitest --run
   const hasRun = args.find((arg) => arg.includes('--run'));
   if (hasRun) {

diff --git a/packages/vite-plugin-angular/src/lib/authoring/analog.ts b/packages/vite-plugin-angular/src/lib/authoring/analog.ts
@@ -504,8 +504,8 @@ function processAnalogScript(
         scope: hasExportKeyword
           ? Scope.Protected
           : isVirtual
-            ? Scope.Private
-            : undefined,
+          ? Scope.Private
+          : undefined,
       });
       if (name !== ROUTE_META && !isVirtual) {
         targetConstructor.addStatements((writer) => {

diff --git a/packages/vite-plugin-angular/src/lib/component-resolvers.ts b/packages/vite-plugin-angular/src/lib/component-resolvers.ts
@@ -102,7 +102,9 @@ export class TemplateUrlsResolver {
 
     const templateUrlPaths = getTemplateUrls(code).map(
       (url) =>
-        `${url}|${normalizePath(resolve(dirname(id), url).replace(/\\/g, '/'))}`,
+        `${url}|${normalizePath(
+          resolve(dirname(id), url).replace(/\\/g, '/'),
+        )}`,
     );
 
     this.templateUrlsCache.set(id, { code, templateUrlPaths });

diff --git a/packages/vite-plugin-nitro/README.md b/packages/vite-plugin-nitro/README.md
@@ -52,7 +52,7 @@ export default async function render(_url: string, document: string) {
   const html = ReactDOMServer.renderToString(
     <React.StrictMode>
       <App />
-    </React.StrictMode>
+    </React.StrictMode>,
   );
   return document.replace('<!--app-html-->', html);
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -20,7 +20,7 @@ import type { load } from './search.server'; @@
         </form>
         @if (searchTerm()) {
-          <p>Search Term: {{ searchTerm() }}</p>
+        <p>Search Term: {{ searchTerm() }}</p>
         }
       `,
     })
@@ Expand Down @@