From 18457f57b9940ae0be9cd66a2b0d8b3fa90a7553 Mon Sep 17 00:00:00 2001
From: Pine <wwork.wss@icloud.com>
Date: Fri, 14 Aug 2026 13:34:28 +0800
Subject: [PATCH] test(ui): render the image-recognition card's endpoint, key,
 and model controls

Unit-render the card after expanding its disclosure header, asserting the
three configurable controls appear (getByLabelText throws when absent).

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../image-recognition-card.client.spec.tsx    | 55 +++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 packages/client/ui-settings-plugins/tests/image-recognition-card.client.spec.tsx

diff --git a/packages/client/ui-settings-plugins/tests/image-recognition-card.client.spec.tsx b/packages/client/ui-settings-plugins/tests/image-recognition-card.client.spec.tsx
new file mode 100644
index 0000000000..516e394423
--- /dev/null
+++ b/packages/client/ui-settings-plugins/tests/image-recognition-card.client.spec.tsx
@@ -0,0 +1,55 @@
+// @vitest-environment jsdom
+/**
+ * The image-recognition card renders its endpoint, key, and model controls once
+ * expanded, mirroring the web-search card. Catches any render-time throw that
+ * registration alone would not surface.
+ */
+
+import { cleanup, fireEvent, render, screen } from '@testing-library/react'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { stubSettingsScope } from '@deepseek-ai/dsh-client-test-runtime'
+import { ImageRecognitionCard } from '../src/client/ImageRecognitionCard.tsx'
+import { ImageRecognitionCardController, type ImageRecognitionSettings } from '../src/client/image-recognition-card-controller.ts'
+
+afterEach(cleanup)
+
+const t = (key: string): string => key
+
+function renderCard() {
+  const host = stubSettingsScope<ImageRecognitionSettings>()
+  const credentials = {
+    describe: vi.fn(() => Promise.resolve({
+      rpcId: 'c' as never,
+      result: { ok: true as const, value: { credentials: { DEEPSEEK_API_KEY: { configured: false, writable: true } } } },
+    })),
+    set: vi.fn(),
+  }
+  const controller = new ImageRecognitionCardController(host.scope, credentials as never)
+  host.publish({ status: 'ready', writable: true, value: {}, user: {} })
+  const face = controller.inject()
+  render(
+    <ImageRecognitionCard
+      t={t as never}
+      useImageRecognitionCard={selector => selector(face.hooks.imageRecognitionCard.getSnapshot())}
+      save={face.save}
+      discard={face.discard}
+      edit={face.edit}
+      resetField={face.resetField}
+      useSessions={() => [] as never}
+      useWorkspaces={() => [] as never}
+    />,
+  )
+  // The card's controls sit behind its disclosure header.
+  fireEvent.click(screen.getByRole('button', { name: /expand: imageRecognitionTitle/ }))
+  return { host, controller, credentials }
+}
+
+describe('ImageRecognitionCard', () => {
+  it('renders the endpoint, key, and model controls once expanded', () => {
+    renderCard()
+    // Each getByLabelText throws when its control is absent.
+    expect(screen.getByLabelText('imageRecognitionApiKey')).toBeTruthy()
+    expect(screen.getByLabelText('imageRecognitionBaseUrl')).toBeTruthy()
+    expect(screen.getByLabelText('imageRecognitionModel')).toBeTruthy()
+  })
+})