/** Models section registration: slot declaration injection, the locale-following label thunk, and HMR recovery. */ import { Context } from 'cordis' import { describe, expect, it, vi } from 'vitest' import { resolveSlotLabel } from '@deepseek-ai/dsh-client-ui-slots' import { SlotsService } from '@deepseek-ai/dsh-client-runtime/client' import { LocaleService } from '@deepseek-ai/dsh-client-locale/client' import { usePinnedBrowserLanguages } from '@deepseek-ai/dsh-client-test-runtime' import { apply, inject, refreshIfLoaded } from '@deepseek-ai/dsh-client-ui-models/client' import { ModelsSection } from '../src/client/ModelsSection.tsx' import { DeepSeekOnboardingDialog } from '../src/client/DeepSeekOnboardingDialog.tsx' // The service reads its initial locale from the browser; these specs assert // the shipped Chinese copy, so they state the browser they assume. usePinnedBrowserLanguages('zh-CN') async function bench() { const ctx = new Context() await ctx.plugin(SlotsService).await() const locale = new LocaleService(ctx) ctx.provide('locale', locale) // The apply path only captures the wire face; no call leaves this fake // until a section actually loads. ctx.provide('connection', { api: {} } as never) return { ctx, slots: ctx.get('slots') as SlotsService, locale } } function declare(slots: SlotsService): () => void { return slots.register( { name: 'root', children: { 'settings.section': { kind: 'list', scope: 'root' }, 'settings.onboarding': { kind: 'list', scope: 'root' }, }, } as never, () => null, ) } describe('ui-models apply', () => { it('declares the services it uses', () => { expect(inject).toEqual(['slots', 'locale', 'connection']) }) it('registers the models nav entry for declarations before or after apply', async () => { const before = await bench() declare(before.slots) await before.ctx.plugin({ inject: [...inject], apply }).await() const entry = before.slots.entries('settings.section')[0]! expect(entry.component).toBe(ModelsSection) expect(entry.options).toMatchObject({ id: 'models', order: 10 }) // The nav label is a locale-following thunk; owners resolve at read time. expect(resolveSlotLabel(entry.options.label)).toBe('模型') const injected = (entry.inject as unknown as () => import('../src/client/ModelsSection.tsx').ModelsSectionInjected)() expect(injected.t('nav')).toBe('模型') expect(injected.t('deleteTitle')).toBe('删除模型提供方?') expect(typeof injected.controller.load).toBe('function') expect(typeof injected.useSnapshot).toBe('function') expect(injected.api).toBeDefined() const onboarding = before.slots.entries('settings.onboarding')[0]! expect(onboarding.component).toBe(DeepSeekOnboardingDialog) expect(onboarding.options).toMatchObject({ id: 'deepseek-official', order: 0 }) const after = await bench() await after.ctx.plugin({ inject: [...inject], apply }).await() expect(after.slots.entries('settings.section')).toHaveLength(0) expect(after.slots.entries('settings.onboarding')).toHaveLength(0) declare(after.slots) await Promise.resolve() expect(after.slots.entries('settings.section')[0]!.component).toBe(ModelsSection) expect(after.slots.entries('settings.onboarding')[0]!.component).toBe(DeepSeekOnboardingDialog) // The self-inflicted ledger notifications hit the duplicate guard. expect(after.slots.entries('settings.section')).toHaveLength(1) }) it('the label thunk follows the active locale without re-registration', async () => { const b = await bench() declare(b.slots) await b.ctx.plugin({ inject: [...inject], apply }).await() b.locale.setLocale('en') expect(resolveSlotLabel(b.slots.entries('settings.section')[0]!.options.label)).toBe('Models') const injected = b.slots.entries('settings.section')[0]!.inject as unknown as () => import('../src/client/ModelsSection.tsx').ModelsSectionInjected expect(injected().t('deleteTitle')).toBe('Delete model provider?') b.locale.setLocale('zh') expect(resolveSlotLabel(b.slots.entries('settings.section')[0]!.options.label)).toBe('模型') expect(injected().t('deleteTitle')).toBe('删除模型提供方?') }) it('locale change while the slot is undeclared stays a no-op', async () => { const b = await bench() await b.ctx.plugin({ inject: [...inject], apply }).await() b.locale.setLocale('en') expect(b.slots.entries('settings.section')).toHaveLength(0) b.locale.setLocale('zh') }) it('re-registers after an HMR collapse re-declares the slot (stale disposer must not block)', async () => { const b = await bench() const redeclare = declare(b.slots) await b.ctx.plugin({ inject: [...inject], apply }).await() expect(b.slots.entries('settings.section')).toHaveLength(1) // Declarer unload: the cascade removes our entry while our local // disposer variable goes stale. redeclare() expect(b.slots.entries('settings.section')).toHaveLength(0) expect(b.slots.entries('settings.onboarding')).toHaveLength(0) declare(b.slots) await Promise.resolve() expect(b.slots.entries('settings.section')[0]!.component).toBe(ModelsSection) expect(b.slots.entries('settings.onboarding')[0]!.component).toBe(DeepSeekOnboardingDialog) // The locale path also recovers through the same ledger re-check. b.locale.setLocale('en') expect(resolveSlotLabel(b.slots.entries('settings.section')[0]!.options.label)).toBe('Models') b.locale.setLocale('zh') }) it('registers the zh/en nav dictionaries and disposes everything with the fiber', async () => { const b = await bench() declare(b.slots) const fiber = b.ctx.plugin({ inject: [...inject], apply }) await fiber.await() expect(b.locale.bind('settings.models')('nav')).toBe('模型') await fiber.dispose() expect(b.slots.entries('settings.section')).toHaveLength(0) expect(b.slots.entries('settings.onboarding')).toHaveLength(0) // The (ns, locale) seats are free again — the dictionary disposers ran. expect(() => b.locale.register('settings.models', 'zh', {})).not.toThrow() expect(() => b.locale.register('settings.models', 'en', {})).not.toThrow() }) }) describe('pushed invalidations', () => { it('ignores invalidations before the page ever loaded', async () => { const b = await bench() declare(b.slots) await b.ctx.plugin({ inject: [...inject], apply }).await() // The fake wire face has no methods: a fetch attempt would throw. b.ctx.emit('settings/changed', 'llm-pi-ai') b.ctx.emit('credentials/changed', 'OPENAI_API_KEY') b.ctx.emit('models/changed') b.ctx.emit('connection/reset') }) it('refreshes a loaded page and skips an idle one', () => { const loads: number[] = [] const controller = { store: { getSnapshot: () => ({ status: 'ready' }) }, load: () => { loads.push(1); return Promise.resolve() }, } refreshIfLoaded(controller as unknown as import('../src/client/store.ts').ModelsSettingsStore) expect(loads).toHaveLength(1) const idle = { store: { getSnapshot: () => ({ status: 'idle' }) }, load: () => { loads.push(2); return Promise.resolve() }, } refreshIfLoaded(idle as unknown as import('../src/client/store.ts').ModelsSettingsStore) expect(loads).toHaveLength(1) }) it('routes pushed credential invalidation into the shared onboarding join', async () => { const b = await bench() declare(b.slots) await b.ctx.plugin({ inject: [...inject], apply }).await() const injected = ( b.slots.entries('settings.onboarding')[0]!.inject as unknown as () => import('../src/client/DeepSeekOnboardingDialog.tsx').DeepSeekOnboardingInjected )() injected.controller.store.update((state) => { state.status = 'ready' }) const load = vi.spyOn(injected.controller, 'load').mockResolvedValue() b.ctx.emit('credentials/changed', 'DEEPSEEK_API_KEY') expect(load).toHaveBeenCalledTimes(1) }) })