@ai-sdk/vue 3.0.47 → 3.0.49

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @ai-sdk/vue
 
+## 3.0.49
+
+### Patch Changes
+
+- Updated dependencies [ded661b]
+  - ai@6.0.49
+
+## 3.0.48
+
+### Patch Changes
+
+- 4de5a1d: chore: excluded tests from src folder in npm package
+- Updated dependencies [4de5a1d]
+  - ai@6.0.48
+  - @ai-sdk/provider-utils@4.0.9
+
 ## 3.0.47
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-sdk/vue",
-  "version": "3.0.47",
+  "version": "3.0.49",
   "license": "Apache-2.0",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -17,13 +17,18 @@
   "files": [
     "dist/**/*",
     "src",
+    "!src/**/*.test.ts",
+    "!src/**/*.test.tsx",
+    "!src/**/*.test-d.ts",
+    "!src/**/__snapshots__",
+    "!src/**/__fixtures__",
     "CHANGELOG.md",
     "README.md"
   ],
   "dependencies": {
     "swrv": "^1.0.4",
-    "@ai-sdk/provider-utils": "4.0.8",
-    "ai": "6.0.47"
+    "@ai-sdk/provider-utils": "4.0.9",
+    "ai": "6.0.49"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",
@@ -38,7 +43,7 @@
     "typescript": "5.8.3",
     "vitest": "2.1.4",
     "zod": "3.25.76",
-    "@ai-sdk/test-server": "1.0.2",
+    "@ai-sdk/test-server": "1.0.3",
     "@vercel/ai-tsconfig": "0.0.0",
     "eslint-config-vercel-ai": "0.0.0"
   },

package/src/chat.vue.ui.test.tsx

@@ -1,954 +0,0 @@
-import {
-  createTestServer,
-  TestResponseController,
-} from '@ai-sdk/test-server/with-vitest';
-import '@testing-library/jest-dom/vitest';
-import userEvent from '@testing-library/user-event';
-import { screen, waitFor } from '@testing-library/vue';
-import { UIMessageChunk } from 'ai';
-import { setupTestComponent } from './setup-test-component';
-import TestChatAppendAttachmentsComponent from './TestChatAppendAttachmentsComponent.vue';
-import TestChatAttachmentsComponent from './TestChatAttachmentsComponent.vue';
-import TestChatComponent from './TestChatComponent.vue';
-import TestChatInitMessages from './TestChatInitMessages.vue';
-import TestChatPrepareRequestBodyComponent from './TestChatPrepareRequestBodyComponent.vue';
-import TestChatReloadComponent from './TestChatReloadComponent.vue';
-import TestChatTextStreamComponent from './TestChatTextStreamComponent.vue';
-import TestChatToolInvocationsComponent from './TestChatToolInvocationsComponent.vue';
-import TestChatUrlAttachmentsComponent from './TestChatUrlAttachmentsComponent.vue';
-import { describe, it, expect } from 'vitest';
-
-function formatChunk(part: UIMessageChunk) {
-  return `data: ${JSON.stringify(part)}\n\n`;
-}
-
-const server = createTestServer({
-  '/api/chat': {},
-});
-
-describe('prepareSubmitMessagesRequest', () => {
-  setupTestComponent(TestChatPrepareRequestBodyComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({ type: 'text-start', id: '0' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ',' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ' world' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: '.' }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await waitFor(() => {
-      const element = screen.getByTestId('on-options');
-      expect(element.textContent?.trim() ?? '').not.toBe('');
-    });
-
-    const value = JSON.parse(
-      screen.getByTestId('on-options').textContent ?? '',
-    );
-
-    expect(screen.getByTestId('message-0')).toHaveTextContent('User: hi');
-
-    expect(value).toStrictEqual({
-      id: expect.any(String),
-      api: '/api/chat',
-      trigger: 'submit-message',
-      body: { 'request-body-key': 'request-body-value' },
-      headers: { 'request-header-key': 'request-header-value' },
-      requestMetadata: { 'request-metadata-key': 'request-metadata-value' },
-      messages: [
-        {
-          role: 'user',
-          id: expect.any(String),
-          parts: [{ type: 'text', text: 'hi' }],
-        },
-      ],
-    });
-
-    expect(await server.calls[0].requestBodyJson).toStrictEqual({
-      'body-key': 'body-value',
-    });
-    expect(server.calls[0].requestHeaders).toStrictEqual({
-      'content-type': 'application/json',
-      'header-key': 'header-value',
-    });
-
-    await screen.findByTestId('message-1');
-    expect(screen.getByTestId('message-1')).toHaveTextContent(
-      'AI: Hello, world.',
-    );
-  });
-});
-
-describe('data protocol stream', () => {
-  setupTestComponent(TestChatComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({ type: 'text-start', id: '0' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ',' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ' world' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: '.' }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await screen.findByTestId('message-0');
-    expect(screen.getByTestId('message-0')).toHaveTextContent('User: hi');
-
-    await screen.findByTestId('message-1');
-    expect(screen.getByTestId('message-1')).toHaveTextContent(
-      'AI: Hello, world.',
-    );
-  });
-
-  it('should show error response', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'error',
-      status: 404,
-      body: 'Not found',
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    // TODO bug? the user message does not show up
-    // await screen.findByTestId('message-0');
-    // expect(screen.getByTestId('message-0')).toHaveTextContent('User: hi');
-
-    await screen.findByTestId('error');
-    expect(screen.getByTestId('error')).toHaveTextContent('Error: Not found');
-  });
-
-  describe('status', () => {
-    it('should show status', async () => {
-      const controller = new TestResponseController();
-      server.urls['/api/chat'].response = {
-        type: 'controlled-stream',
-        controller,
-      };
-
-      await userEvent.click(screen.getByTestId('do-append'));
-
-      await waitFor(() => {
-        expect(screen.getByTestId('status')).toHaveTextContent('submitted');
-      });
-
-      controller.write(formatChunk({ type: 'text-start', id: '0' }));
-      controller.write(
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-      );
-      controller.write(formatChunk({ type: 'text-end', id: '0' }));
-
-      await waitFor(() => {
-        expect(screen.getByTestId('status')).toHaveTextContent('streaming');
-      });
-
-      controller.close();
-
-      await waitFor(() => {
-        expect(screen.getByTestId('status')).toHaveTextContent('ready');
-      });
-    });
-
-    it('should update status when the tab is hidden', async () => {
-      const controller = new TestResponseController();
-      server.urls['/api/chat'].response = {
-        type: 'controlled-stream',
-        controller,
-      };
-
-      const originalVisibilityState = document.visibilityState;
-
-      try {
-        await userEvent.click(screen.getByTestId('do-append'));
-        await waitFor(() =>
-          expect(screen.getByTestId('status')).toHaveTextContent('submitted'),
-        );
-
-        controller.write(formatChunk({ type: 'text-start', id: '0' }));
-        controller.write(
-          formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        );
-
-        await waitFor(() =>
-          expect(screen.getByTestId('status')).toHaveTextContent('streaming'),
-        );
-
-        Object.defineProperty(document, 'visibilityState', {
-          configurable: true,
-          get: () => 'hidden',
-        });
-        document.dispatchEvent(new Event('visibilitychange'));
-
-        controller.write(
-          formatChunk({ type: 'text-delta', id: '0', delta: ' world.' }),
-        );
-        controller.write(formatChunk({ type: 'text-end', id: '0' }));
-        controller.close();
-
-        await waitFor(() =>
-          expect(screen.getByTestId('status')).toHaveTextContent('ready'),
-        );
-      } finally {
-        Object.defineProperty(document, 'visibilityState', {
-          configurable: true,
-          get: () => originalVisibilityState,
-        });
-        document.dispatchEvent(new Event('visibilitychange'));
-      }
-    });
-
-    it('should set status to error when there is a server error', async () => {
-      server.urls['/api/chat'].response = {
-        type: 'error',
-        status: 404,
-        body: 'Not found',
-      };
-
-      await userEvent.click(screen.getByTestId('do-append'));
-
-      await waitFor(() => {
-        expect(screen.getByTestId('status')).toHaveTextContent('error');
-      });
-    });
-  });
-
-  it('should invoke onFinish when the stream finishes', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({ type: 'text-start', id: '0' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ',' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ' world' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: '.' }),
-        formatChunk({ type: 'text-end', id: '0' }),
-        formatChunk({ type: 'finish' }),
-      ],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await waitFor(() => {
-      const element = screen.getByTestId('on-finish-calls');
-      expect(element.textContent?.trim() ?? '').not.toBe('');
-    });
-
-    const value = JSON.parse(
-      screen.getByTestId('on-finish-calls').textContent ?? '',
-    );
-
-    expect(value).toStrictEqual([
-      {
-        isAbort: false,
-        isDisconnect: false,
-        isError: false,
-        message: {
-          id: expect.any(String),
-          role: 'assistant',
-          parts: [{ text: 'Hello, world.', type: 'text', state: 'done' }],
-        },
-        messages: [
-          {
-            id: expect.any(String),
-            role: 'user',
-            parts: [{ text: 'hi', type: 'text' }],
-          },
-          {
-            id: expect.any(String),
-            role: 'assistant',
-            parts: [{ text: 'Hello, world.', type: 'text', state: 'done' }],
-          },
-        ],
-      },
-    ]);
-  });
-});
-
-describe('text stream', () => {
-  setupTestComponent(TestChatTextStreamComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: ['Hello', ',', ' world', '.'],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await screen.findByTestId('message-0');
-    expect(screen.getByTestId('message-0')).toHaveTextContent('User: hi');
-
-    await screen.findByTestId('message-1');
-    expect(screen.getByTestId('message-1')).toHaveTextContent(
-      'AI: Hello, world.',
-    );
-  });
-
-  it('should invoke onFinish when the stream finishes', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: ['Hello', ',', ' world', '.'],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await waitFor(() => {
-      const element = screen.getByTestId('on-finish-calls');
-      expect(element.textContent?.trim() ?? '').not.toBe('');
-    });
-
-    const value = JSON.parse(
-      screen.getByTestId('on-finish-calls').textContent ?? '',
-    );
-
-    expect(value).toStrictEqual([
-      {
-        isAbort: false,
-        isDisconnect: false,
-        isError: false,
-        message: {
-          id: expect.any(String),
-          role: 'assistant',
-          parts: [
-            { type: 'step-start' },
-            { text: 'Hello, world.', type: 'text', state: 'done' },
-          ],
-        },
-        messages: [
-          {
-            id: expect.any(String),
-            role: 'user',
-            parts: [{ text: 'hi', type: 'text' }],
-          },
-          {
-            id: expect.any(String),
-            role: 'assistant',
-            parts: [
-              { type: 'step-start' },
-              { text: 'Hello, world.', type: 'text', state: 'done' },
-            ],
-          },
-        ],
-      },
-    ]);
-  });
-});
-
-describe('regenerate', () => {
-  setupTestComponent(TestChatReloadComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/chat'].response = [
-      {
-        type: 'stream-chunks',
-        chunks: [
-          formatChunk({ type: 'text-start', id: '0' }),
-          formatChunk({
-            type: 'text-delta',
-            id: '0',
-            delta: 'first response',
-          }),
-          formatChunk({ type: 'text-end', id: '0' }),
-        ],
-      },
-      {
-        type: 'stream-chunks',
-        chunks: [
-          formatChunk({ type: 'text-start', id: '0' }),
-          formatChunk({
-            type: 'text-delta',
-            id: '0',
-            delta: 'second response',
-          }),
-          formatChunk({ type: 'text-end', id: '0' }),
-        ],
-      },
-    ];
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await screen.findByTestId('message-0');
-    expect(screen.getByTestId('message-0')).toHaveTextContent('User: hi');
-
-    await screen.findByTestId('message-1');
-
-    // setup done, click reload:
-    await userEvent.click(screen.getByTestId('do-regenerate'));
-
-    expect(await server.calls[1].requestBodyJson).toStrictEqual({
-      id: expect.any(String),
-      messages: [
-        {
-          id: 'id-0',
-          parts: [
-            {
-              text: 'hi',
-              type: 'text',
-            },
-          ],
-          role: 'user',
-        },
-      ],
-      'request-body-key': 'request-body-value',
-      trigger: 'regenerate-message',
-    });
-
-    expect(server.calls[1].requestHeaders).toStrictEqual({
-      'content-type': 'application/json',
-      'header-key': 'header-value',
-    });
-
-    await screen.findByTestId('message-1');
-    expect(screen.getByTestId('message-1')).toHaveTextContent(
-      'AI: second response',
-    );
-  });
-});
-
-describe('tool invocations', () => {
-  setupTestComponent(TestChatToolInvocationsComponent);
-
-  it('should display partial tool call, tool call, and tool result', async () => {
-    const controller = new TestResponseController();
-    server.urls['/api/chat'].response = [
-      { type: 'controlled-stream', controller },
-    ];
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    controller.write(
-      formatChunk({
-        type: 'tool-input-start',
-        toolCallId: 'tool-call-0',
-        toolName: 'test-tool',
-      }),
-    );
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent(
-        '{"type":"tool-test-tool","toolCallId":"tool-call-0","state":"input-streaming"}',
-      );
-    });
-
-    controller.write(
-      formatChunk({
-        type: 'tool-input-delta',
-        toolCallId: 'tool-call-0',
-        inputTextDelta: '{"testArg":"t',
-      }),
-    );
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent(
-        '{"type":"tool-test-tool","toolCallId":"tool-call-0","state":"input-streaming","input":{"testArg":"t"}}',
-      );
-    });
-
-    controller.write(
-      formatChunk({
-        type: 'tool-input-delta',
-        toolCallId: 'tool-call-0',
-        inputTextDelta: 'est-value"}}',
-      }),
-    );
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent(
-        '{"type":"tool-test-tool","toolCallId":"tool-call-0","state":"input-streaming","input":{"testArg":"test-value"}}',
-      );
-    });
-
-    controller.write(
-      formatChunk({
-        type: 'tool-input-available',
-        toolCallId: 'tool-call-0',
-        toolName: 'test-tool',
-        input: { testArg: 'test-value' },
-      }),
-    );
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('message-1').textContent ?? ''),
-      ).toStrictEqual({
-        state: 'input-available',
-        input: { testArg: 'test-value' },
-        toolCallId: 'tool-call-0',
-        type: 'tool-test-tool',
-      });
-    });
-
-    controller.write(
-      formatChunk({
-        type: 'tool-output-available',
-        toolCallId: 'tool-call-0',
-        output: 'test-result',
-      }),
-    );
-    controller.close();
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('message-1').textContent ?? ''),
-      ).toStrictEqual({
-        state: 'output-available',
-        input: { testArg: 'test-value' },
-        toolCallId: 'tool-call-0',
-        type: 'tool-test-tool',
-        output: 'test-result',
-      });
-    });
-  });
-
-  it('should display tool call and tool result (when there is no tool call streaming)', async () => {
-    const controller = new TestResponseController();
-    server.urls['/api/chat'].response = [
-      {
-        type: 'controlled-stream',
-        controller,
-      },
-    ];
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    controller.write(
-      formatChunk({
-        type: 'tool-input-available',
-        toolCallId: 'tool-call-0',
-        toolName: 'test-tool',
-        input: { testArg: 'test-value' },
-      }),
-    );
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('message-1').textContent ?? ''),
-      ).toStrictEqual({
-        state: 'input-available',
-        input: { testArg: 'test-value' },
-        toolCallId: 'tool-call-0',
-        type: 'tool-test-tool',
-      });
-    });
-
-    controller.write(
-      formatChunk({
-        type: 'tool-output-available',
-        toolCallId: 'tool-call-0',
-        output: 'test-result',
-      }),
-    );
-    controller.close();
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent('test-result');
-    });
-  });
-
-  it('should update tool call to result when addToolOutput is called', async () => {
-    const controller = new TestResponseController();
-    server.urls['/api/chat'].response = [
-      {
-        type: 'controlled-stream',
-        controller,
-      },
-    ];
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    controller.write(formatChunk({ type: 'start' }));
-    controller.write(formatChunk({ type: 'start-step' }));
-    controller.write(
-      formatChunk({
-        type: 'tool-input-available',
-        toolCallId: 'tool-call-0',
-        toolName: 'test-tool',
-        input: { testArg: 'test-value' },
-      }),
-    );
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent(
-        '{"type":"tool-test-tool","toolCallId":"tool-call-0","state":"input-available","input":{"testArg":"test-value"}}',
-      );
-    });
-
-    await userEvent.click(screen.getByTestId('add-result-0'));
-
-    await waitFor(() => {
-      expect(screen.getByTestId('message-1')).toHaveTextContent(
-        '{"type":"tool-test-tool","toolCallId":"tool-call-0","state":"output-available","input":{"testArg":"test-value"},"output":"test-result"}',
-      );
-    });
-
-    controller.write(formatChunk({ type: 'text-start', id: '0' }));
-    controller.write(
-      formatChunk({
-        type: 'text-delta',
-        id: '0',
-        delta: 'more text',
-      }),
-    );
-    controller.write(formatChunk({ type: 'text-end', id: '0' }));
-    controller.close();
-  });
-});
-
-describe('file attachments with data url', () => {
-  setupTestComponent(TestChatAttachmentsComponent);
-
-  it('should handle text file attachment and submission', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({
-          type: 'text-start',
-          id: '0',
-        }),
-        formatChunk({
-          type: 'text-delta',
-          id: '0',
-          delta: 'Response to message with text attachment',
-        }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    const file = new File(['test file content'], 'test.txt', {
-      type: 'text/plain',
-    });
-
-    const fileInput = screen.getByTestId('file-input');
-    await userEvent.upload(fileInput, file);
-
-    const messageInput = screen.getByTestId('message-input');
-    await userEvent.type(messageInput, 'Message with text attachment');
-
-    const submitButton = screen.getByTestId('submit-button');
-    await userEvent.click(submitButton);
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('messages').textContent ?? ''),
-      ).toStrictEqual([
-        {
-          id: 'id-0',
-          role: 'user',
-          parts: [
-            {
-              type: 'file',
-              mediaType: 'text/plain',
-              filename: 'test.txt',
-              url: 'data:text/plain;base64,dGVzdCBmaWxlIGNvbnRlbnQ=',
-            },
-            {
-              type: 'text',
-              text: 'Message with text attachment',
-            },
-          ],
-        },
-        {
-          id: 'id-1',
-          parts: [
-            {
-              text: 'Response to message with text attachment',
-              type: 'text',
-              state: 'done',
-            },
-          ],
-          role: 'assistant',
-        },
-      ]);
-    });
-  });
-
-  it('should handle image file attachment and submission', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({
-          type: 'text-start',
-          id: '0',
-        }),
-        formatChunk({
-          type: 'text-delta',
-          id: '0',
-          delta: 'Response to message with image attachment',
-        }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    const file = new File(['test image content'], 'test.png', {
-      type: 'image/png',
-    });
-
-    const fileInput = screen.getByTestId('file-input');
-    await userEvent.upload(fileInput, file);
-
-    const messageInput = screen.getByTestId('message-input');
-    await userEvent.type(messageInput, 'Message with image attachment');
-
-    const submitButton = screen.getByTestId('submit-button');
-    await userEvent.click(submitButton);
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('messages').textContent ?? ''),
-      ).toStrictEqual([
-        {
-          role: 'user',
-          id: 'id-0',
-          parts: [
-            {
-              type: 'file',
-              mediaType: 'image/png',
-              filename: 'test.png',
-              url: 'data:image/png;base64,dGVzdCBpbWFnZSBjb250ZW50',
-            },
-            {
-              type: 'text',
-              text: 'Message with image attachment',
-            },
-          ],
-        },
-        {
-          role: 'assistant',
-          id: 'id-1',
-          parts: [
-            {
-              type: 'text',
-              text: 'Response to message with image attachment',
-              state: 'done',
-            },
-          ],
-        },
-      ]);
-    });
-  });
-});
-
-describe('file attachments with url', () => {
-  setupTestComponent(TestChatUrlAttachmentsComponent);
-
-  it('should handle image file attachment and submission', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({
-          type: 'text-start',
-          id: '0',
-        }),
-        formatChunk({
-          type: 'text-delta',
-          id: '0',
-          delta: 'Response to message with image attachment',
-        }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    const messageInput = screen.getByTestId('message-input');
-    await userEvent.type(messageInput, 'Message with image attachment');
-
-    const submitButton = screen.getByTestId('submit-button');
-    await userEvent.click(submitButton);
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('messages').textContent ?? ''),
-      ).toStrictEqual([
-        {
-          role: 'user',
-          id: 'id-0',
-          parts: [
-            {
-              type: 'file',
-              mediaType: 'image/png',
-              url: 'https://example.com/image.png',
-            },
-            {
-              type: 'text',
-              text: 'Message with image attachment',
-            },
-          ],
-        },
-        {
-          role: 'assistant',
-          id: 'id-1',
-          parts: [
-            {
-              type: 'text',
-              text: 'Response to message with image attachment',
-              state: 'done',
-            },
-          ],
-        },
-      ]);
-    });
-  });
-});
-
-describe('attachments with empty submit', () => {
-  setupTestComponent(TestChatAttachmentsComponent);
-
-  it('should handle image file attachment and empty submission', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({
-          type: 'text-start',
-          id: '0',
-        }),
-        formatChunk({
-          type: 'text-delta',
-          id: '0',
-          delta: 'Response to empty message with attachment',
-        }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    const file = new File(['test image content'], 'test.png', {
-      type: 'image/png',
-    });
-
-    const fileInput = screen.getByTestId('file-input');
-    await userEvent.upload(fileInput, file);
-
-    const submitButton = screen.getByTestId('submit-button');
-    await userEvent.click(submitButton);
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('messages').textContent ?? ''),
-      ).toStrictEqual([
-        {
-          id: 'id-0',
-          role: 'user',
-          parts: [
-            {
-              type: 'file',
-              mediaType: 'image/png',
-              filename: 'test.png',
-              url: 'data:image/png;base64,dGVzdCBpbWFnZSBjb250ZW50',
-            },
-            {
-              type: 'text',
-              text: '',
-            },
-          ],
-        },
-        {
-          id: 'id-1',
-          role: 'assistant',
-          parts: [
-            {
-              type: 'text',
-              text: 'Response to empty message with attachment',
-              state: 'done',
-            },
-          ],
-        },
-      ]);
-    });
-  });
-});
-
-describe('should append message with attachments', () => {
-  setupTestComponent(TestChatAppendAttachmentsComponent);
-
-  it('should handle image file attachment with append', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({
-          type: 'text-start',
-          id: '0',
-        }),
-        formatChunk({
-          type: 'text-delta',
-          id: '0',
-          delta: 'Response to message with image attachment',
-        }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    const appendButton = screen.getByTestId('do-append');
-    await userEvent.click(appendButton);
-
-    await waitFor(() => {
-      expect(
-        JSON.parse(screen.getByTestId('messages').textContent ?? ''),
-      ).toStrictEqual([
-        {
-          id: 'id-0',
-          parts: [
-            {
-              mediaType: 'image/png',
-              type: 'file',
-              url: 'https://example.com/image.png',
-            },
-            {
-              text: 'Message with image attachment',
-              type: 'text',
-            },
-          ],
-          role: 'user',
-        },
-        {
-          id: 'id-1',
-          parts: [
-            {
-              text: 'Response to message with image attachment',
-              type: 'text',
-              state: 'done',
-            },
-          ],
-          role: 'assistant',
-        },
-      ]);
-    });
-  });
-});
-
-describe('init messages', () => {
-  setupTestComponent(TestChatInitMessages);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/chat'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({ type: 'text-start', id: '0' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ',' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ' world' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: '.' }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    await userEvent.click(screen.getByTestId('do-append'));
-
-    await screen.findByTestId('message-2');
-    expect(screen.getByTestId('message-2')).toHaveTextContent('User: Hi.');
-
-    await screen.findByTestId('message-3');
-    expect(screen.getByTestId('message-3')).toHaveTextContent(
-      'AI: Hello, world.',
-    );
-  });
-});

package/src/use-completion.ui.test.ts

@@ -1,97 +0,0 @@
-import {
-  createTestServer,
-  TestResponseController,
-} from '@ai-sdk/test-server/with-vitest';
-import '@testing-library/jest-dom/vitest';
-import userEvent from '@testing-library/user-event';
-import { findByText, screen } from '@testing-library/vue';
-import { UIMessageChunk } from 'ai';
-import TestCompletionComponent from './TestCompletionComponent.vue';
-import TestCompletionTextStreamComponent from './TestCompletionTextStreamComponent.vue';
-import { setupTestComponent } from './setup-test-component';
-import { describe, it, expect } from 'vitest';
-
-function formatChunk(part: UIMessageChunk) {
-  return `data: ${JSON.stringify(part)}\n\n`;
-}
-
-const server = createTestServer({
-  '/api/completion': {},
-});
-
-describe('stream data stream', () => {
-  setupTestComponent(TestCompletionComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/completion'].response = {
-      type: 'stream-chunks',
-      chunks: [
-        formatChunk({ type: 'text-start', id: '0' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ',' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: ' world' }),
-        formatChunk({ type: 'text-delta', id: '0', delta: '.' }),
-        formatChunk({ type: 'text-end', id: '0' }),
-      ],
-    };
-
-    await userEvent.type(screen.getByTestId('input'), 'hi{enter}');
-
-    await screen.findByTestId('completion');
-    expect(screen.getByTestId('completion')).toHaveTextContent('Hello, world.');
-  });
-
-  describe('loading state', () => {
-    it('should show loading state', async () => {
-      const controller = new TestResponseController();
-      server.urls['/api/completion'].response = {
-        type: 'controlled-stream',
-        controller,
-      };
-
-      await userEvent.type(screen.getByTestId('input'), 'hi{enter}');
-
-      await screen.findByTestId('loading');
-      expect(screen.getByTestId('loading')).toHaveTextContent('true');
-
-      controller.write(formatChunk({ type: 'text-start', id: '0' }));
-      controller.write(
-        formatChunk({ type: 'text-delta', id: '0', delta: 'Hello' }),
-      );
-      controller.write(formatChunk({ type: 'text-end', id: '0' }));
-      controller.close();
-
-      await findByText(await screen.findByTestId('loading'), 'false');
-      expect(screen.getByTestId('loading')).toHaveTextContent('false');
-    });
-
-    it('should reset loading state on error', async () => {
-      server.urls['/api/completion'].response = {
-        type: 'error',
-        status: 404,
-        body: 'Not found',
-      };
-
-      await userEvent.type(screen.getByTestId('input'), 'hi{enter}');
-
-      await screen.findByTestId('loading');
-      expect(screen.getByTestId('loading')).toHaveTextContent('false');
-    });
-  });
-});
-
-describe('stream data stream', () => {
-  setupTestComponent(TestCompletionTextStreamComponent);
-
-  it('should show streamed response', async () => {
-    server.urls['/api/completion'].response = {
-      type: 'stream-chunks',
-      chunks: ['Hello', ',', ' world', '.'],
-    };
-
-    await userEvent.type(screen.getByTestId('input'), 'hi{enter}');
-
-    await screen.findByTestId('completion');
-    expect(screen.getByTestId('completion')).toHaveTextContent('Hello, world.');
-  });
-});

package/src/use-object.ui.test.tsx

@@ -1,250 +0,0 @@
-import {
-  createTestServer,
-  TestResponseController,
-} from '@ai-sdk/test-server/with-vitest';
-import '@testing-library/jest-dom/vitest';
-import { cleanup, screen, waitFor } from '@testing-library/vue';
-import userEvent from '@testing-library/user-event';
-import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
-import { setupTestComponent } from './setup-test-component';
-import TestUseObjectComponent from './TestUseObjectComponent.vue';
-import TestUseObjectCustomTransportComponent from './TestUseObjectCustomTransportComponent.vue';
-
-const server = createTestServer({
-  '/api/use-object': {},
-});
-
-describe('text stream', () => {
-  afterEach(() => {
-    vi.restoreAllMocks();
-    cleanup();
-  });
-
-  describe('basic component', () => {
-    setupTestComponent(TestUseObjectComponent);
-
-    describe("when the API returns 'Hello, world!'", () => {
-      beforeEach(async () => {
-        server.urls['/api/use-object'].response = {
-          type: 'stream-chunks',
-          chunks: ['{ ', '"content": "Hello, ', 'world', '!"'],
-        };
-        await userEvent.click(screen.getByTestId('submit-button'));
-      });
-
-      it('should render stream', async () => {
-        await screen.findByTestId('object');
-        expect(screen.getByTestId('object')).toHaveTextContent(
-          JSON.stringify({ content: 'Hello, world!' }),
-        );
-      });
-
-      it("should send 'test' to the API", async () => {
-        expect(await server.calls[0].requestBodyJson).toBe('test-input');
-      });
-
-      it('should not have an error', async () => {
-        await screen.findByTestId('error');
-        expect(screen.getByTestId('error')).toBeEmptyDOMElement();
-        expect(screen.getByTestId('on-error-result')).toBeEmptyDOMElement();
-      });
-    });
-
-    describe('isLoading', () => {
-      it('should be true while loading', async () => {
-        const controller = new TestResponseController();
-        server.urls['/api/use-object'].response = {
-          type: 'controlled-stream',
-          controller,
-        };
-
-        controller.write('{"content": ');
-        await userEvent.click(screen.getByTestId('submit-button'));
-
-        // wait for element "loading" to have text content "true":
-        await waitFor(() => {
-          expect(screen.getByTestId('loading')).toHaveTextContent('true');
-        });
-
-        controller.write('"Hello, world!"}');
-        controller.close();
-
-        // wait for element "loading" to have text content "false":
-        await waitFor(() => {
-          expect(screen.getByTestId('loading')).toHaveTextContent('false');
-        });
-      });
-    });
-
-    it('should abort the stream and not consume any more data', async () => {
-      const controller = new TestResponseController();
-      server.urls['/api/use-object'].response = {
-        type: 'controlled-stream',
-        controller,
-      };
-
-      controller.write('{"content": "h');
-      await userEvent.click(screen.getByTestId('submit-button'));
-
-      // wait for element "loading" and "object" to have text content:
-      await waitFor(() => {
-        expect(screen.getByTestId('loading')).toHaveTextContent('true');
-      });
-      await waitFor(() => {
-        expect(screen.getByTestId('object')).toHaveTextContent(
-          '{"content":"h"}',
-        );
-      });
-
-      // click stop button:
-      await userEvent.click(screen.getByTestId('stop-button'));
-
-      // wait for element "loading" to have text content "false":
-      await waitFor(() => {
-        expect(screen.getByTestId('loading')).toHaveTextContent('false');
-      });
-
-      // this should not be consumed any more:
-      await expect(controller.write('ello, world!"}')).rejects.toThrow();
-      await expect(controller.close()).rejects.toThrow();
-
-      // should only show start of object:
-      await waitFor(() => {
-        expect(screen.getByTestId('object')).toHaveTextContent(
-          '{"content":"h"}',
-        );
-      });
-    });
-
-    it('should stop and clear the object state after a call to submit then clear', async () => {
-      const controller = new TestResponseController();
-      server.urls['/api/use-object'].response = {
-        type: 'controlled-stream',
-        controller,
-      };
-
-      controller.write('{"content": "h');
-      await userEvent.click(screen.getByTestId('submit-button'));
-
-      await waitFor(() => {
-        expect(screen.getByTestId('loading')).toHaveTextContent('true');
-      });
-      await waitFor(() => {
-        expect(screen.getByTestId('object')).toHaveTextContent(
-          '{"content":"h"}',
-        );
-      });
-
-      await userEvent.click(screen.getByTestId('clear-button'));
-
-      await expect(controller.write('ello, world!"}')).rejects.toThrow();
-      await expect(controller.close()).rejects.toThrow();
-
-      await waitFor(() => {
-        expect(screen.getByTestId('loading')).toHaveTextContent('false');
-        expect(screen.getByTestId('error')).toBeEmptyDOMElement();
-        expect(screen.getByTestId('object')).toBeEmptyDOMElement();
-      });
-    });
-
-    describe('when the API returns a 404', () => {
-      it('should render error', async () => {
-        server.urls['/api/use-object'].response = {
-          type: 'error',
-          status: 404,
-          body: 'Not found',
-        };
-
-        await userEvent.click(screen.getByTestId('submit-button'));
-
-        await screen.findByTestId('error');
-        expect(screen.getByTestId('error')).toHaveTextContent('Not found');
-        expect(screen.getByTestId('on-error-result')).toHaveTextContent(
-          'Not found',
-        );
-        expect(screen.getByTestId('loading')).toHaveTextContent('false');
-      });
-    });
-
-    describe('onFinish', () => {
-      it('should be called with an object when the stream finishes and the object matches the schema', async () => {
-        server.urls['/api/use-object'].response = {
-          type: 'stream-chunks',
-          chunks: ['{ ', '"content": "Hello, ', 'world', '!"', '}'],
-        };
-
-        await userEvent.click(screen.getByTestId('submit-button'));
-
-        expect(screen.getByTestId('on-finish-calls')).toHaveTextContent(
-          JSON.stringify([
-            { object: { content: 'Hello, world!' }, error: undefined },
-          ]),
-        );
-      });
-
-      it('should be called with an error when the stream finishes and the object does not match the schema', async () => {
-        server.urls['/api/use-object'].response = {
-          type: 'stream-chunks',
-          chunks: ['{ ', '"content-wrong": "Hello, ', 'world', '!"', '}'],
-        };
-
-        await userEvent.click(screen.getByTestId('submit-button'));
-
-        expect(screen.getByTestId('on-finish-calls')).toHaveTextContent(
-          'ZodError',
-        );
-      });
-    });
-
-    it('should clear the object state after a call to clear', async () => {
-      server.urls['/api/use-object'].response = {
-        type: 'stream-chunks',
-        chunks: ['{ ', '"content": "Hello, ', 'world', '!"', '}'],
-      };
-
-      await userEvent.click(screen.getByTestId('submit-button'));
-
-      await screen.findByTestId('object');
-      expect(screen.getByTestId('object')).toHaveTextContent(
-        JSON.stringify({ content: 'Hello, world!' }),
-      );
-
-      await userEvent.click(screen.getByTestId('clear-button'));
-
-      await waitFor(() => {
-        expect(screen.getByTestId('object')).toBeEmptyDOMElement();
-        expect(screen.getByTestId('error')).toBeEmptyDOMElement();
-        expect(screen.getByTestId('loading')).toHaveTextContent('false');
-      });
-    });
-  });
-
-  describe('custom transport', () => {
-    setupTestComponent(TestUseObjectCustomTransportComponent);
-
-    it('should send custom headers', async () => {
-      server.urls['/api/use-object'].response = {
-        type: 'stream-chunks',
-        chunks: ['{ ', '"content": "Hello, ', 'world', '!"', '}'],
-      };
-
-      await userEvent.click(screen.getByTestId('submit-button'));
-
-      expect(server.calls[0].requestHeaders).toStrictEqual({
-        'content-type': 'application/json',
-        authorization: 'Bearer TEST_TOKEN',
-        'x-custom-header': 'CustomValue',
-      });
-    });
-
-    it('should send custom credentials', async () => {
-      server.urls['/api/use-object'].response = {
-        type: 'stream-chunks',
-        chunks: ['{ ', '"content": "Authenticated ', 'content', '!"', '}'],
-      };
-
-      await userEvent.click(screen.getByTestId('submit-button'));
-      expect(server.calls[0].requestCredentials).toBe('include');
-    });
-  });
-});