@apollo/client-ai-apps 0.5.4 → 0.6.1

package/src/vite/__tests__/apolloClientAiApps.test.ts

@@ -1,4 +1,5 @@
 import { beforeEach, describe, expect, test, vi } from "vitest";
+import { spyOnConsole, wait } from "../../testing/internal/index.js";
 import fs from "node:fs";
 import { gql, type DocumentNode } from "@apollo/client";
 import { getMainDefinition, print } from "@apollo/client/utilities";
@@ -6,13 +7,11 @@ import { getOperationName } from "@apollo/client/utilities/internal";
 import { vol } from "memfs";
 import { apolloClientAiApps } from "../apolloClientAiApps.js";
 import { buildApp, setupServer } from "./utilities/build.js";
-import type {
-  ApplicationManifest,
-  ManifestWidgetSettings,
-} from "../../types/application-manifest.js";
+import type { ApplicationManifest } from "../../types/application-manifest.js";
 import { explorer } from "../utilities/config.js";
 import { invariant } from "@apollo/client/utilities/invariant";
 import { Kind } from "graphql";
+import type { ApolloClientAiAppsConfig } from "../../config/types.js";
 
 beforeEach(() => {
   explorer.clearCaches();
@@ -29,12 +28,19 @@ describe("operations", () => {
               invoked: "Tested global!",
             },
           },
+          csp: {
+            baseUriDomains: ["https://base.example.com"],
+            connectDomains: ["https://connect.example.com"],
+            frameDomains: ["https://frame.example.com"],
+            redirectDomains: ["https://redirect.example.com"],
+            resourceDomains: ["https://resource.example.com"],
+          },
           widgetSettings: {
             description: "Test",
             domain: "https://example.com",
             prefersBorder: true,
-          } satisfies ManifestWidgetSettings,
-        },
+          },
+        } satisfies ApolloClientAiAppsConfig.Config,
       }),
       "src/my-component.tsx": declareOperation(gql`
         query HelloWorldQuery($name: string!)
@@ -61,7 +67,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -70,10 +78,21 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
-          "connectDomains": [],
-          "frameDomains": [],
-          "redirectDomains": [],
-          "resourceDomains": [],
+          "baseUriDomains": [
+            "https://base.example.com",
+          ],
+          "connectDomains": [
+            "https://connect.example.com",
+          ],
+          "frameDomains": [
+            "https://frame.example.com",
+          ],
+          "redirectDomains": [
+            "https://redirect.example.com",
+          ],
+          "resourceDomains": [
+            "https://resource.example.com",
+          ],
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
@@ -81,6 +100,7 @@ describe("operations", () => {
           "toolInvocation/invoked": "Tested global!",
           "toolInvocation/invoking": "Testing global...",
         },
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery($name: string!) {
@@ -145,7 +165,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -154,6 +176,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -161,6 +184,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery {
@@ -229,7 +253,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -238,6 +264,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -245,6 +272,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery {
@@ -303,7 +331,9 @@ describe("operations", () => {
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -320,7 +350,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -329,6 +361,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -336,6 +369,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [],
         "resource": "http://localhost:3333",
         "version": "1",
@@ -354,7 +388,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -363,6 +399,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -370,6 +407,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery {
@@ -401,7 +439,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -410,6 +450,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -417,6 +458,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "mutation HelloWorldQuery {
@@ -454,7 +496,9 @@ describe("operations", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -482,7 +526,9 @@ describe("operations", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -491,6 +537,7 @@ describe("operations", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -498,6 +545,7 @@ describe("operations", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery {
@@ -557,7 +605,9 @@ describe("@prefetch", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -566,6 +616,7 @@ describe("@prefetch", () => {
       {
         "appVersion": "1.0.0",
         "csp": {
+          "baseUriDomains": [],
           "connectDomains": [],
           "frameDomains": [],
           "redirectDomains": [],
@@ -573,6 +624,7 @@ describe("@prefetch", () => {
         },
         "format": "apollo-ai-app-manifest",
         "hash": "abc",
+        "name": "my-app",
         "operations": [
           {
             "body": "query HelloWorldQuery {
@@ -612,7 +664,9 @@ describe("@prefetch", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -622,11 +676,11 @@ describe("@prefetch", () => {
 });
 
 describe("@tool validation", () => {
-  test("errors when tool name is not provided", async () => {
+  test("errors when tool name is not provided on anonymous operation", async () => {
     vol.fromJSON({
       "package.json": mockPackageJson(),
       "src/my-component.tsx": declareOperation(gql`
-        query HelloWorldQuery @tool {
+        query @tool {
           helloWorld
         }
       `),
@@ -634,15 +688,17 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: 'name' argument must be supplied for @tool]`
+      `[Error: Anonymous operations cannot use @tool without providing a 'name' argument]`
     );
   });
 
-  test("errors when tool description is not provided", async () => {
+  test("errors when tool description is not provided and operation has no description", async () => {
     vol.fromJSON({
       "package.json": mockPackageJson(),
       "src/my-component.tsx": declareOperation(gql`
@@ -654,14 +710,106 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: 'description' argument must be supplied for @tool]`
+      `[Error: Operations using @tool without a 'description' argument must have a description on the operation definition]`
     );
   });
 
+  test("uses operation name as tool name when name is omitted from @tool", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery @tool(description: "A greeting tool") {
+          helloWorld
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    const manifest = readManifestFile();
+    expect(manifest.operations[0].tools).toMatchInlineSnapshot(`
+      [
+        {
+          "description": "A greeting tool",
+          "name": "HelloWorldQuery",
+        },
+      ]
+    `);
+  });
+
+  test("uses operation description as tool description when description is omitted from @tool", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        """
+        A greeting tool
+        """
+        query HelloWorldQuery @tool(name: "hello-world") {
+          helloWorld
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    const manifest = readManifestFile();
+    expect(manifest.operations[0].tools).toMatchInlineSnapshot(`
+      [
+        {
+          "description": "A greeting tool",
+          "name": "hello-world",
+        },
+      ]
+    `);
+  });
+
+  test("uses operation name and description when both are omitted from @tool", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        """
+        A greeting tool
+        """
+        query HelloWorldQuery @tool {
+          helloWorld
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    const manifest = readManifestFile();
+    expect(manifest.operations[0].tools).toMatchInlineSnapshot(`
+      [
+        {
+          "description": "A greeting tool",
+          "name": "HelloWorldQuery",
+        },
+      ]
+    `);
+  });
+
   test("errors when tool name contains spaces", async () => {
     vol.fromJSON({
       "package.json": mockPackageJson(),
@@ -675,7 +823,9 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -698,7 +848,9 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -718,7 +870,9 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -739,7 +893,9 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -764,13 +920,63 @@ describe("@tool validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
       `[Error: Error when parsing directive values: unexpected type 'FloatValue']`
     );
   });
+
+  test("errors when multiple @tool directives are used and one is missing a name", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "tool-a", description: "Tool A")
+        @tool(description: "Tool B") {
+          helloWorld
+        }
+      `),
+    });
+
+    await expect(async () => {
+      await using server = await setupServer({
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
+      });
+      await server.listen();
+    }).rejects.toThrowErrorMatchingInlineSnapshot(
+      `[Error: Operations with multiple @tool directives must provide a 'name' argument on each @tool]`
+    );
+  });
+
+  test("errors when multiple @tool directives are used and one is missing a description", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "tool-a", description: "Tool A")
+        @tool(name: "tool-b") {
+          helloWorld
+        }
+      `),
+    });
+
+    await expect(async () => {
+      await using server = await setupServer({
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
+      });
+      await server.listen();
+    }).rejects.toThrowErrorMatchingInlineSnapshot(
+      `[Error: Operations with multiple @tool directives must provide a 'description' argument on each @tool]`
+    );
+  });
 });
 
 describe("config validation", () => {
@@ -792,7 +998,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -821,7 +1029,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -850,7 +1060,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -874,7 +1086,9 @@ describe("config validation", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -902,7 +1116,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -930,7 +1146,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -961,7 +1179,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -989,7 +1209,9 @@ describe("config validation", () => {
 
     await expect(async () => {
       await using server = await setupServer({
-        plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+        ],
       });
       await server.listen();
     }).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -1012,7 +1234,9 @@ describe("config validation", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -1041,7 +1265,9 @@ describe("entry points", () => {
 
     await using server = await setupServer({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -1070,7 +1296,13 @@ describe("entry points", () => {
 
     await using server = await setupServer({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp"], devTarget: "mcp" })],
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          devTarget: "mcp",
+          appsOutDir: "dist/apps",
+        }),
+      ],
     });
     await server.listen();
 
@@ -1091,7 +1323,9 @@ describe("entry points", () => {
 
     await using server = await setupServer({
       server: { https: {}, port: 5678 },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -1112,7 +1346,9 @@ describe("entry points", () => {
 
     await using server = await setupServer({
       server: { port: 5678, host: "0.0.0.0" },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -1139,7 +1375,9 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1168,7 +1406,12 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp", "openai"] })],
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp", "openai"],
+          appsOutDir: "dist/apps",
+        }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1197,7 +1440,12 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp", "openai"] })],
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp", "openai"],
+          appsOutDir: "dist/apps",
+        }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1228,7 +1476,9 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "staging",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1250,7 +1500,9 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1270,7 +1522,12 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp", "openai"] })],
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp", "openai"],
+          appsOutDir: "dist/apps",
+        }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1295,7 +1552,9 @@ describe("entry points", () => {
       async () =>
         await buildApp({
           mode: "staging",
-          plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+          plugins: [
+            apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+          ],
         })
     ).rejects.toThrowError(
       `[@apollo/client-ai-apps/vite] No entry point found for mode "staging". Entry points other than "development" and "production" must be defined in package.json file.`
@@ -1315,11 +1574,15 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     expect(vol.existsSync(".application-manifest.json")).toBe(true);
-    expect(vol.existsSync("dist/.application-manifest.json")).toBe(true);
+    expect(vol.existsSync("dist/apps/my-app/.application-manifest.json")).toBe(
+      true
+    );
   });
 
   test("writes to both locations when running in build mode with multiple targets", async () => {
@@ -1335,11 +1598,155 @@ describe("entry points", () => {
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp", "openai"] })],
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp", "openai"],
+          appsOutDir: "dist/apps",
+        }),
+      ],
     });
 
     expect(vol.existsSync(".application-manifest.json")).toBe(true);
-    expect(vol.existsSync("dist/.application-manifest.json")).toBe(true);
+    expect(vol.existsSync("dist/apps/my-app/.application-manifest.json")).toBe(
+      true
+    );
+  });
+
+  test("generates .application-manifest.d.json.ts at root in build mode", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "hello-world", description: "This is an awesome tool!") {
+          helloWorld
+        }
+      `),
+    });
+
+    await buildApp({
+      mode: "production",
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+
+    expect(vol.existsSync(".application-manifest.d.json.ts")).toBe(true);
+  });
+
+  test("generates .application-manifest.d.json.ts at root in serve mode", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "hello-world", description: "This is an awesome tool!") {
+          helloWorld
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    expect(vol.existsSync(".application-manifest.d.json.ts")).toBe(true);
+  });
+
+  test("does not write .application-manifest.json.d.ts to appsOutDir", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "hello-world", description: "This is an awesome tool!") {
+          helloWorld
+        }
+      `),
+    });
+
+    await buildApp({
+      mode: "production",
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+
+    expect(
+      vol.existsSync("dist/apps/my-app/.application-manifest.json.d.ts")
+    ).toBe(false);
+  });
+});
+
+describe("appsOutDir", () => {
+  test("errors when last segment is not `apps`", () => {
+    expect(() =>
+      apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/output" })
+    ).toThrowError(
+      "`appsOutDir` must end with `apps` as the final path segment (e.g. `path/to/apps`)."
+    );
+  });
+
+  test("accepts trailing slash", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+    });
+
+    await expect(
+      buildApp({
+        mode: "production",
+        build: { write: false },
+        plugins: [
+          apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps/" }),
+        ],
+      })
+    ).resolves.not.toThrowError();
+  });
+
+  test("warns when `build.outDir` is set", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+    });
+
+    using _ = spyOnConsole("warn");
+
+    await buildApp({
+      mode: "production",
+      build: { outDir: "custom-out", write: false },
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+
+    expect(console.warn).toHaveBeenCalledWith(
+      expect.stringContaining(
+        "`build.outDir` is set in your Vite config but will be ignored"
+      )
+    );
+  });
+
+  test("places output under `appsOutDir`", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query HelloWorldQuery
+        @tool(name: "hello-world", description: "This is an awesome tool!") {
+          helloWorld
+        }
+      `),
+    });
+
+    await buildApp({
+      mode: "production",
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+
+    expect(vol.existsSync("dist/apps/my-app/.application-manifest.json")).toBe(
+      true
+    );
+    expect(vol.existsSync(".application-manifest.json")).toBe(true);
   });
 });
 
@@ -1387,7 +1794,9 @@ export default config;
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1423,7 +1832,9 @@ export default config;
 
     await buildApp({
       mode: "production",
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const manifest = readManifestFile();
@@ -1457,7 +1868,9 @@ describe("file watching", () => {
     });
 
     await using server = await setupServer({
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
     await server.listen();
 
@@ -1485,6 +1898,541 @@ describe("file watching", () => {
   });
 });
 
+describe("tool input types", () => {
+  const schema = `
+    type Query {
+      todo(id: ID!): Todo
+    }
+
+    type Mutation {
+      createTodo(title: String!, description: String): Todo
+      deleteTodo(id: ID!): Boolean
+    }
+
+    type Todo {
+      id: ID!
+      title: String!
+      description: String
+    }
+  `;
+
+  test("generates operation-types.d.ts with variable types when schema is provided", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!, $description: String)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title, description: $description) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/operation-types.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// Auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      export type Maybe<T> = T | null;
+
+      export type InputMaybe<T> = Maybe<T>;
+
+      export type Exact<T extends {
+        [key: string]: unknown;
+      }> = {
+        [K in keyof T]: T[K];
+      };
+
+      /** All built-in and custom scalars, mapped to their actual values */
+      export type Scalars = {
+        ID: {
+          input: string;
+          output: string;
+        };
+        String: {
+          input: string;
+          output: string;
+        };
+        Boolean: {
+          input: boolean;
+          output: boolean;
+        };
+        Int: {
+          input: number;
+          output: number;
+        };
+        Float: {
+          input: number;
+          output: number;
+        };
+      };
+
+      export type CreateTodoMutationVariables = Exact<{
+        title: Scalars["String"]["input"];
+        description?: InputMaybe<Scalars["String"]["input"]>;
+      }>;"
+    `);
+  });
+
+  test("generates register.d.ts with toolInputs when schema is provided", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!, $description: String)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title, description: $description) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      import type { CreateTodoMutationVariables } from "./operation-types.js";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "CreateTodo";
+          toolInputs: {
+            CreateTodo: CreateTodoMutationVariables;
+          };
+        }
+      }"
+    `);
+  });
+
+  test("generates register.d.ts with operations that contain fragments", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!, $description: String)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title, description: $description) {
+            id
+            ...TodoFragment
+          }
+        }
+      `),
+      "src/todo-fragment.tsx": declareFragment(gql`
+        fragment TodoFragment on Todo {
+          title
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    expect(
+      fs.readFileSync(".apollo-client-ai-apps/types/register.d.ts", "utf-8")
+    ).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      import type { CreateTodoMutationVariables } from "./operation-types.js";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "CreateTodo";
+          toolInputs: {
+            CreateTodo: CreateTodoMutationVariables;
+          };
+        }
+      }"
+    `);
+    expect(
+      fs.readFileSync(
+        ".apollo-client-ai-apps/types/operation-types.d.ts",
+        "utf-8"
+      )
+    ).toMatchInlineSnapshot(`
+      "// Auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      export type Maybe<T> = T | null;
+
+      export type InputMaybe<T> = Maybe<T>;
+
+      export type Exact<T extends {
+        [key: string]: unknown;
+      }> = {
+        [K in keyof T]: T[K];
+      };
+
+      /** All built-in and custom scalars, mapped to their actual values */
+      export type Scalars = {
+        ID: {
+          input: string;
+          output: string;
+        };
+        String: {
+          input: string;
+          output: string;
+        };
+        Boolean: {
+          input: boolean;
+          output: boolean;
+        };
+        Int: {
+          input: number;
+          output: number;
+        };
+        Float: {
+          input: number;
+          output: number;
+        };
+      };
+
+      export type CreateTodoMutationVariables = Exact<{
+        title: Scalars["String"]["input"];
+        description?: InputMaybe<Scalars["String"]["input"]>;
+      }>;"
+    `);
+  });
+
+  test("tool with no extraInputs uses only the Variables type", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation DeleteTodo($id: ID!)
+        @tool(name: "DeleteTodo", description: "Deletes a todo") {
+          deleteTodo(id: $id)
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      import type { DeleteTodoMutationVariables } from "./operation-types.js";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "DeleteTodo";
+          toolInputs: {
+            DeleteTodo: DeleteTodoMutationVariables;
+          };
+        }
+      }"
+    `);
+  });
+
+  test("tool with extraInputs adds properties to tool input type", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!)
+        @tool(
+          name: "CreateTodo"
+          description: "Creates a todo"
+          extraInputs: [
+            { name: "priority", type: "string", description: "Priority" }
+            { name: "urgent", type: "boolean", description: "Is urgent?" }
+            {
+              name: "odd-name"
+              type: "boolean"
+              description: "Test of odd name"
+            }
+          ]
+        ) {
+          createTodo(title: $title) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      import type { CreateTodoMutationVariables } from "./operation-types.js";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "CreateTodo";
+          toolInputs: {
+            CreateTodo: CreateTodoMutationVariables & {
+              priority?: string;
+              urgent?: boolean;
+              "odd-name"?: boolean;
+            };
+          };
+        }
+      }"
+    `);
+  });
+
+  test("multiple @tool directives on an operation each get their own toolInputs entry", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!)
+        @tool(name: "CreateTodo", description: "Creates a todo")
+        @tool(name: "AddTask", description: "Adds a task") {
+          createTodo(title: $title) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      import type { CreateTodoMutationVariables } from "./operation-types.js";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "CreateTodo" | "AddTask";
+          toolInputs: {
+            CreateTodo: CreateTodoMutationVariables;
+            AddTask: CreateTodoMutationVariables;
+          };
+        }
+      }"
+    `);
+  });
+
+  test("operation-types.d.ts is not rewritten when operation content has not changed", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/operation-types.d.ts",
+      "utf-8"
+    );
+    const mtime = fs.statSync(
+      ".apollo-client-ai-apps/types/operation-types.d.ts"
+    ).mtimeMs;
+
+    // Trigger another manifest generation (simulating a file change to an unrelated file)
+    server.watcher.emit("change", "package.json");
+    await wait(100);
+
+    expect(
+      fs.readFileSync(
+        ".apollo-client-ai-apps/types/operation-types.d.ts",
+        "utf-8"
+      )
+    ).toBe(content);
+
+    expect(
+      fs.statSync(".apollo-client-ai-apps/types/operation-types.d.ts").mtimeMs
+    ).toBe(mtime);
+  });
+
+  test("does not generate operation-types.d.ts when schema is not provided", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    expect(
+      fs.existsSync(".apollo-client-ai-apps/types/operation-types.d.ts")
+    ).toBe(false);
+  });
+
+  test("generates register.d.ts with error message when schema build fails in dev mode", async () => {
+    using _ = spyOnConsole("error");
+
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        query GetNonExistent
+        @tool(name: "GetNonExistent", description: "A tool") {
+          nonExistentField
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({
+          targets: ["mcp"],
+          appsOutDir: "dist/apps",
+          schema,
+        }),
+      ],
+    });
+    await server.listen();
+
+    expect(console.error).toHaveBeenCalledOnce();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "[@apollo/client-ai-apps/vite]: There was an error building generated types. See the vite build output for more details.\\n\\nGraphQL Document Validation failed with 1 errors;\\n  Error 0: Cannot query field \\"nonExistentField\\" on type \\"Query\\".\\n    at 116185304.graphql:2:3";
+          toolInputs: {
+            "[@apollo/client-ai-apps/vite]: There was an error building generated types. See the vite build output for more details.\\n\\nGraphQL Document Validation failed with 1 errors;\\n  Error 0: Cannot query field \\"nonExistentField\\" on type \\"Query\\".\\n    at 116185304.graphql:2:3": "[@apollo/client-ai-apps/vite]: There was an error building generated types. See the vite build output for more details.\\n\\nGraphQL Document Validation failed with 1 errors;\\n  Error 0: Cannot query field \\"nonExistentField\\" on type \\"Query\\".\\n    at 116185304.graphql:2:3";
+          };
+        }
+      }"
+    `);
+  });
+
+  test("generates register.d.ts without toolInputs when schema is not provided", async () => {
+    vol.fromJSON({
+      "package.json": mockPackageJson(),
+      "src/my-component.tsx": declareOperation(gql`
+        mutation CreateTodo($title: String!)
+        @tool(name: "CreateTodo", description: "Creates a todo") {
+          createTodo(title: $title) {
+            id
+          }
+        }
+      `),
+    });
+
+    await using server = await setupServer({
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
+    });
+    await server.listen();
+
+    const content = fs.readFileSync(
+      ".apollo-client-ai-apps/types/register.d.ts",
+      "utf-8"
+    );
+    expect(content).toMatchInlineSnapshot(`
+      "// This file is auto-generated by @apollo/client-ai-apps. Do not edit manually.
+      import "@apollo/client-ai-apps";
+
+      declare module "@apollo/client-ai-apps" {
+        interface Register {
+          toolName: "CreateTodo";
+        }
+      }"
+    `);
+  });
+});
+
 describe("html transforms", () => {
   test("replaces root relative scripts with full url when origin is provided", async () => {
     vol.fromJSON({
@@ -1495,7 +2443,9 @@ describe("html transforms", () => {
       server: {
         origin: "http://localhost:3000",
       },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const html = `<html><head><script type="module" src="/@vite/client"></script></head><body><script module src="/assets/main.ts?t=12345"></script></body></html>`;
@@ -1519,7 +2469,9 @@ describe("html transforms", () => {
       server: {
         port: 3000,
       },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     await server.listen();
@@ -1547,7 +2499,9 @@ window.$RefreshSig$ = () => (type) => type;</script></head></html>`;
       server: {
         origin: "http://localhost:3000",
       },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     const html = `<html><head>    <script type="module">import { injectIntoGlobalHook } from "/@react-refresh";
@@ -1573,7 +2527,9 @@ window.$RefreshSig$ = () => (type) => type;</script></head></html>`;
       server: {
         port: 3000,
       },
-      plugins: [apolloClientAiApps({ targets: ["mcp"] })],
+      plugins: [
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
+      ],
     });
 
     await server.listen();
@@ -1604,7 +2560,7 @@ window.$RefreshSig$ = () => (type) => type;</script></head></html>`;
         origin: "http://localhost:3000",
       },
       plugins: [
-        apolloClientAiApps({ targets: ["mcp"] }),
+        apolloClientAiApps({ targets: ["mcp"], appsOutDir: "dist/apps" }),
         {
           name: "capture-html",
           transformIndexHtml: {
@@ -1643,7 +2599,7 @@ function declareFragment(fragment: DocumentNode) {
 }
 
 function mockPackageJson(config?: Record<string, unknown>) {
-  return JSON.stringify({ version: "1.0.0", ...config });
+  return JSON.stringify({ version: "1.0.0", name: "my-app", ...config });
 }
 
 function readManifestFile(