client-bundle.spec.ts 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. // @vitest-environment jsdom
  2. /**
  3. * Real tsdown artifact shape: lib/client.js hands off through
  4. * window.__ModuleLoader__.load, resolves externals through the injected
  5. * require, returns the export surface (apply + inject), and a mounted apply
  6. * registers both view tabs into a real SlotsService ring. Skips when dist/ is
  7. * not built (`pnpm --filter @deepseek-ai/dsh-client-ui-trajectory bundle`).
  8. */
  9. import { readFileSync } from 'node:fs'
  10. import { resolve } from 'node:path'
  11. import { Context } from 'cordis'
  12. import { afterEach, describe, expect, it } from 'vitest'
  13. import { SlotsService } from '@deepseek-ai/dsh-client-runtime/client'
  14. const PLUGIN_ID = '@deepseek-ai/dsh-client-ui-trajectory'
  15. interface Handoff { id: string; factory: (require: (spec: string) => unknown) => Record<string, unknown> }
  16. type Win = { __ModuleLoader__?: { load(h: Handoff): void } }
  17. function readBundle(): string | undefined {
  18. try {
  19. // import.meta.url is http-scheme in the jsdom pool; vitest runs from the
  20. // repo root, so resolve the artifact repo-relatively instead.
  21. return readFileSync(resolve('packages/client/ui-trajectory/lib/client.js'), 'utf8')
  22. } catch {
  23. return undefined
  24. }
  25. }
  26. afterEach(() => {
  27. delete (window as Win).__ModuleLoader__
  28. for (const el of document.querySelectorAll('style')) el.remove()
  29. })
  30. describe('tsdown client artifact', () => {
  31. const code = readBundle()
  32. async function loadArtifact() {
  33. let handoff: Handoff | undefined
  34. ;(window as Win).__ModuleLoader__ = { load: (h) => { handoff = h } }
  35. // Same execution form the loader uses (inline script eval, window scope) —
  36. // the implied-eval ban targets accidental string execution, not this
  37. // deliberate bundle-execution fixture.
  38. // eslint-disable-next-line @typescript-eslint/no-implied-eval, @typescript-eslint/no-unsafe-call
  39. new Function(code!)()
  40. expect(handoff).toBeDefined()
  41. const modules = new Map<string, unknown>([
  42. ['react', await import('react')],
  43. ['react/jsx-runtime', await import('react/jsx-runtime')],
  44. ])
  45. const surface = handoff!.factory((spec) => {
  46. if (!modules.has(spec)) throw new Error(`unexpected require: ${spec}`)
  47. return modules.get(spec)
  48. })
  49. return { handoff: handoff!, surface }
  50. }
  51. it.skipIf(code === undefined)('hands off with the manifest id and a DI-require factory', async () => {
  52. const { handoff, surface } = await loadArtifact()
  53. expect(handoff.id).toBe(PLUGIN_ID)
  54. expect(surface.apply).toBeTypeOf('function')
  55. expect(surface.inject).toEqual(['slots', 'conversation'])
  56. })
  57. it.skipIf(code === undefined)('mounted as an object plugin, apply registers both view tabs on the real ring', async () => {
  58. const { surface } = await loadArtifact()
  59. const ctx = new Context()
  60. const slots = new SlotsService(ctx)
  61. // The conversation entry's role: the ring must be declared before riders land.
  62. slots.register({
  63. name: 'root',
  64. children: { 'conversation.view': { kind: 'list', scope: 'session' } },
  65. }, (_p: { renderSlot?: unknown }) => null)
  66. // The plugin injects 'conversation' as an ordering edge (the declaring
  67. // plugin provides it after declaring the ring); the bench declares the
  68. // ring itself, so a stub satisfies the wait.
  69. ctx.provide('conversation', {})
  70. const fiber = ctx.plugin(surface as { apply: (ctx: Context) => void })
  71. await fiber.await()
  72. expect(slots.entries('conversation.view').map(e => e.options.id)).toEqual(['trajectory', 'waterfall'])
  73. await fiber.dispose()
  74. expect(slots.entries('conversation.view')).toHaveLength(0)
  75. })
  76. it.skipIf(code === undefined)('injects plugin-tagged module CSS during factory execution', async () => {
  77. await loadArtifact()
  78. const tags = document.querySelectorAll(`style[data-plugin=${JSON.stringify(PLUGIN_ID)}]`)
  79. expect(tags.length).toBeGreaterThan(0)
  80. })
  81. })