feat(web): mount the config plane in dsh web and pin the Models page keyless

apps/cli/cordis.yml gains settings-local, credentials-local, and the bare
dormant llm-pi-ai row (manifest deps added for the resolver contract);
llm-deepseek drops its !!js apiKey inline for per-request credential
resolution. Both adapters tag apiKeyEnv role('credential-ref') so the
form mounts the credential control. The web e2e scaffold isolates a
harness home per run — an in-process boot must never touch the
developer's real ~/.dsh — and the new models-settings scenario pins the
whole loop through the shipped app: dormant directory as add vocabulary,
schema-driven editor apply landing in settings.yaml, the route
registering live (topology frame), and a write-only key landing in the
temp .env with the configured badge converging. A hermetic test-owned
reference name keeps a developer's real provider keys from flipping the
badge. schema-form joins the platform module table (seed + externals)
so client bundles share one instance.
This commit is contained in:
Yichen Jiang
2026-07-30 09:29:40 +08:00
parent 686e40ebf6
commit 0d96676f35
19 changed files with 347 additions and 36 deletions

View File

@@ -0,0 +1,116 @@
// Web e2e scenario: the Models settings page end to end through the real
// wire — the dormant pi-ai directory renders as the add vocabulary, adding a
// provider writes the settings document and registers the route live (the
// row's 已启用 badge is the topology invalidation landing), and the key input
// stores a credential write-only into the harness home's .env. Zero model
// calls: configuration is pure settings/credentials/llm-domain traffic, so
// there is no fixture and a stray stream would fail loud on the open seam.
import { readFile } from 'node:fs/promises'
import { fileURLToPath } from 'node:url'
import { join } from 'node:path'
import type { Browser, Page } from 'playwright'
import { chromium } from 'playwright'
import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
import {
assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
} from './scaffold.ts'
import { saveFailureShot } from './support.ts'
const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/models-settings', import.meta.url))
const EMPTY_EXPECTED = join(SNAPSHOT_DIR, 'empty.expected.md')
const CONFIGURED_EXPECTED = join(SNAPSHOT_DIR, 'configured.expected.md')
const MODE = webSnapshotMode()
describe('web e2e: Models settings page configures a dormant provider', () => {
let scaffold: WebScaffold
let browser: Browser
let page: Page
let tripwire: ReturnType<typeof watchConsole>
beforeAll(async () => {
scaffold = await launchWebScaffold({})
browser = await chromium.launch()
page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
tripwire = watchConsole(page)
await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
}, 120_000)
afterAll(async () => {
await browser?.close()
await scaffold?.close()
})
it('renders the dormant directory as the add vocabulary', async () => {
onTestFailed(() => saveFailureShot(page, 'web-e2e-models-empty'))
await page.getByRole('button', { name: '设置', exact: true }).click()
const dialog = page.getByRole('dialog', { name: '设置' })
await dialog.waitFor({ timeout: 10_000 })
await dialog.getByRole('button', { name: '模型' }).click()
await dialog.getByText('填入各提供方的 API 密钥即可使用其模型。').waitFor({ timeout: 10_000 })
// The dormant pi-ai adapter contributes its whole installed catalog; no
// provider is configured yet, so the page is one add-select.
const add = dialog.getByLabel('添加提供方')
await add.waitFor({ timeout: 10_000 })
// The select renders before the directory join settles; poll until the
// dormant catalog landed.
await expect.poll(async () => add.locator('option').count(), { timeout: 10_000 }).toBeGreaterThan(30)
const options = await add.locator('option').allTextContents()
expect(options).toContain('anthropic')
expect(options).toContain('openai')
const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
await compareOrRefreshGolden(EMPTY_EXPECTED, snapshot, MODE)
}, 60_000)
it('adds a provider through the schema-driven editor and the route registers live', async () => {
onTestFailed(() => saveFailureShot(page, 'web-e2e-models-add'))
const dialog = page.getByRole('dialog', { name: '设置' })
await dialog.getByLabel('添加提供方').selectOption('anthropic')
// The editor is the real pi-ai profile schema rendered field by field;
// the credential-reference control is the role-tagged override.
const ref = dialog.getByLabel('API 密钥环境变量')
await ref.waitFor({ timeout: 10_000 })
// A test-owned reference name keeps this hermetic: a developer's real
// ANTHROPIC_API_KEY in the process environment must not flip the badge.
await ref.fill('E2E_ANTHROPIC_KEY')
await dialog.getByRole('button', { name: '保存', exact: true }).click()
// The write lands in settings.yaml, the dormant route registers, the
// topology frame invalidates the page, and the reloaded join shows the
// row live with its credential still missing.
const row = dialog.getByText('anthropic', { exact: true }).first()
await row.waitFor({ timeout: 10_000 })
await dialog.getByText('已启用').waitFor({ timeout: 10_000 })
await dialog.getByText('缺少密钥').waitFor({ timeout: 10_000 })
const document = await readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8')
expect(document).toContain('llm-pi-ai:')
expect(document).toContain('anthropic:')
expect(document).toContain('apiKeyEnv: E2E_ANTHROPIC_KEY')
}, 60_000)
it('stores the API key write-only and the badge flips configured', async () => {
onTestFailed(() => saveFailureShot(page, 'web-e2e-models-key'))
const dialog = page.getByRole('dialog', { name: '设置' })
await dialog.getByRole('button', { name: '编辑' }).click()
const key = dialog.getByLabel('API 密钥', { exact: true })
await key.waitFor({ timeout: 10_000 })
await key.fill('sk-ant-e2e-test')
await dialog.getByRole('button', { name: '保存密钥' }).click()
await dialog.getByText('已配置', { exact: true }).waitFor({ timeout: 10_000 })
// The value went to the harness home's .env — and nowhere in the DOM.
const stored = await readFile(join(scaffold.harnessHome, '.env'), 'utf8')
expect(stored).toContain('E2E_ANTHROPIC_KEY=sk-ant-e2e-test')
expect(await page.content()).not.toContain('sk-ant-e2e-test')
await dialog.getByRole('button', { name: '取消' }).click()
// The row badge converges from the credentials invalidation.
await expect.poll(async () => dialog.getByText('缺少密钥').count(), { timeout: 10_000 }).toBe(0)
const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
await compareOrRefreshGolden(CONFIGURED_EXPECTED, snapshot, MODE)
await page.keyboard.press('Escape')
expect(tripwire.pageErrors).toEqual([])
}, 60_000)
it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
await assertFixtureInventory(SNAPSHOT_DIR, ['configured.expected.md', 'empty.expected.md'])
})
})

View File

@@ -86,6 +86,8 @@ export interface WebScaffold {
workspaceCwd: string
/** Temp persistence root (seeded sessions land here through the real API). */
persistenceRoot: string
/** Isolated harness home the settings/credentials rows write ($DSH_HOME double). */
harnessHome: string
/** Await a settled turn end: in-process turn/end, then the agent's idle flip (which follows the persistence flush). */
whenTurnSettled(timeoutMs?: number): Promise<SessionId>
/** Tear everything down; asserts the replay fixture was fully consumed first (replay/refresh). */
@@ -150,6 +152,10 @@ export async function launchWebScaffold(options: LaunchOptions = {}): Promise<We
}
}
const workspaceCwd = await realpath(await mkdtemp(join(tmpdir(), 'dsh-web-e2e-ws-')))
// Isolated harness home: the settings/credentials rows resolve $DSH_HOME
// paths at load, and an in-process boot must NEVER touch the developer's
// real ~/.dsh document or credential file.
const harnessHome = join(workspaceCwd, '.dsh-home')
let persistenceRoot: string
try {
persistenceRoot = await mkdtemp(join(tmpdir(), 'dsh-web-e2e-sessions-'))
@@ -175,6 +181,8 @@ export async function launchWebScaffold(options: LaunchOptions = {}): Promise<We
{ id: 'workspace-context', disabled: true },
{ id: 'session-title-llm', disabled: true },
{ id: 'webserver', config: { host: '127.0.0.1', port: 0, distIndex: DIST_INDEX } },
{ id: 'settings', config: { dshHome: harnessHome } },
{ id: 'credentials', config: { dshHome: harnessHome } },
...options.toolsMode === undefined ? [] : [{ id: 'tools', config: { mode: options.toolsMode } }],
...options.cordisTools === true
? [{ insert: [{ id: 'tool-cordis', name: 'cordis:tool-cordis' }] }]
@@ -232,6 +240,7 @@ export async function launchWebScaffold(options: LaunchOptions = {}): Promise<We
}
return {
harnessHome,
mode,
baseUrl: `http://127.0.0.1:${port}`,
ctx,

View File

@@ -58,7 +58,7 @@ describe('web e2e: settings modal, appearance gesture, language switch', () => {
// Golden of the freshly opened dialog (default zh, General active).
const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
await compareOrRefreshGolden(DIALOG_EXPECTED, snapshot, MODE)
// Section switch: aria-current moves; Models is deliberately empty.
// Section switch: aria-current moves (the Models page itself has its own scenario file).
await dialog.getByRole('button', { name: '模型' }).click()
await expect.poll(() => dialog.getByRole('button', { name: '模型' }).getAttribute('aria-current'), { timeout: 5_000 }).toBe('true')
expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBeNull()

View File

@@ -0,0 +1,57 @@
- dialog "设置":
- navigation:
- text: 设置
- button "通用设置":
- img
- text: 通用设置
- button "模型":
- img
- text: 模型
- button "关闭":
- img
- text: 关闭
- heading "模型" [level=2]
- paragraph: 填入各提供方的 API 密钥即可使用其模型。
- list:
- listitem:
- text: anthropic 已启用
- button "编辑"
- button "删除"
- combobox "添加提供方":
- option "+ 添加提供方" [selected]
- option "amazon-bedrock"
- option "ant-ling"
- option "azure-openai-responses"
- option "cerebras"
- option "cloudflare-ai-gateway"
- option "cloudflare-workers-ai"
- option "deepseek"
- option "fireworks"
- option "github-copilot"
- option "google"
- option "google-vertex"
- option "groq"
- option "huggingface"
- option "kimi-coding"
- option "minimax"
- option "minimax-cn"
- option "mistral"
- option "moonshotai"
- option "moonshotai-cn"
- option "nvidia"
- option "openai"
- option "openai-codex"
- option "opencode"
- option "opencode-go"
- option "openrouter"
- option "qwen-token-plan"
- option "qwen-token-plan-cn"
- option "together"
- option "vercel-ai-gateway"
- option "xai"
- option "xiaomi"
- option "xiaomi-token-plan-ams"
- option "xiaomi-token-plan-cn"
- option "xiaomi-token-plan-sgp"
- option "zai"
- option "zai-coding-cn"

View File

@@ -0,0 +1,54 @@
- dialog "设置":
- navigation:
- text: 设置
- button "通用设置":
- img
- text: 通用设置
- button "模型":
- img
- text: 模型
- button "关闭":
- img
- text: 关闭
- heading "模型" [level=2]
- paragraph: 填入各提供方的 API 密钥即可使用其模型。
- list
- combobox "添加提供方":
- option "+ 添加提供方" [selected]
- option "amazon-bedrock"
- option "ant-ling"
- option "anthropic"
- option "azure-openai-responses"
- option "cerebras"
- option "cloudflare-ai-gateway"
- option "cloudflare-workers-ai"
- option "deepseek"
- option "fireworks"
- option "github-copilot"
- option "google"
- option "google-vertex"
- option "groq"
- option "huggingface"
- option "kimi-coding"
- option "minimax"
- option "minimax-cn"
- option "mistral"
- option "moonshotai"
- option "moonshotai-cn"
- option "nvidia"
- option "openai"
- option "openai-codex"
- option "opencode"
- option "opencode-go"
- option "openrouter"
- option "qwen-token-plan"
- option "qwen-token-plan-cn"
- option "together"
- option "vercel-ai-gateway"
- option "xai"
- option "xiaomi"
- option "xiaomi-token-plan-ams"
- option "xiaomi-token-plan-cn"
- option "xiaomi-token-plan-sgp"
- option "zai"
- option "zai-coding-cn"