The project now has exactly one UI library. Every naive-ui component in
packages/client/src is replaced by its Arco equivalent across 24 views and
roughly 80 components, and naive-ui is dropped from package.json along with
its transitive vueuc / @css-render / vdirs / seemly dependencies.
The migration is rendering-layer only. No store logic, no API contract, and
no /chat-run payload was touched.
Three classes of leftover were invisible to `grep naive-ui` and are now
covered by tests/client/no-naive-ui.test.ts, which asserts all three:
- dead .n-* class names in style blocks
- dead --n-* custom properties
- naive-ui in package.json
Notable behavioural traps handled along the way, recorded in
docs/arco-migration-rules.md:
- a-input-password defaults to masked; passing default-visibility="false"
would have exposed API keys in clear text
- a-upload fires a real XHR unless auto-upload is false
- nested Trigger components fight over the first element child, so the
group-chat settings dropdown was flattened
- Arco renders tooltip default-slot text inline, which was silently
collapsing the chat and group-chat toolbars
43 lines
1.8 KiB
TypeScript
43 lines
1.8 KiB
TypeScript
import { expect, test } from '@playwright/test'
|
|
import { authenticate, mockHermesApi, TEST_ACCESS_KEY } from './fixtures'
|
|
|
|
test('fetches custom provider models through the backend proxy', async ({ page }) => {
|
|
await authenticate(page, TEST_ACCESS_KEY)
|
|
const api = await mockHermesApi(page)
|
|
|
|
const thirdPartyRequests: string[] = []
|
|
page.on('request', (request) => {
|
|
const url = request.url()
|
|
if (url.startsWith('https://provider.example.test')) {
|
|
thirdPartyRequests.push(url)
|
|
}
|
|
})
|
|
|
|
await page.goto('/#/hermes/models')
|
|
|
|
await page.getByRole('button', { name: 'Add Provider' }).click()
|
|
await page.getByRole('button', { name: 'Custom' }).click()
|
|
await page.getByPlaceholder('e.g. https://api.example.com/v1').fill('https://provider.example.test/v1')
|
|
await page.getByPlaceholder('sk-...').fill('test-provider-key')
|
|
await page.getByRole('button', { name: 'Fetch' }).click()
|
|
|
|
await expect(page.getByText('Found 2 models')).toBeVisible()
|
|
// Scope to the dropdown options: Arco renders both the select's current value
|
|
// and the option list, so a bare text match resolves to two nodes. The option
|
|
// list is collapsed by this point, so assert presence rather than visibility.
|
|
await expect(
|
|
page.locator('.arco-select-option-content', { hasText: 'proxy-model-a' }),
|
|
).toHaveCount(1)
|
|
|
|
const proxyRequest = api.requests.find((request) => request.pathname === '/api/hermes/provider-models')
|
|
expect(proxyRequest).toBeTruthy()
|
|
expect(proxyRequest?.method).toBe('POST')
|
|
expect(proxyRequest?.headers.authorization).toBe(`Bearer ${TEST_ACCESS_KEY}`)
|
|
expect(JSON.parse(proxyRequest?.postData || '{}')).toMatchObject({
|
|
base_url: 'https://provider.example.test/v1',
|
|
api_key: 'test-provider-key',
|
|
})
|
|
expect(thirdPartyRequests).toEqual([])
|
|
expect(api.unexpectedRequests).toEqual([])
|
|
})
|