@paramms/chat-widget 0.1.0 → 1.0.1

package/src/__tests__/chatlist.test.ts

@@ -1,133 +0,0 @@
-// @vitest-environment jsdom
-import { describe, it, expect, vi } from 'vitest'
-import { asUserId, asConversationId } from '../protocol/index.js'
-import { ChatStore } from '../store.js'
-import { Renderer, type ChatListEntry } from '../renderer.js'
-
-const me = 'alice'
-const cid = asConversationId('c1')
-
-function openedConv() {
-  return {
-    type: 'opened' as const,
-    conversation: {
-      id: cid, tenantId: 't' as never, profileId: 'p' as never,
-      guestId: asUserId(me), participants: [asUserId(me)],
-      state: 'open', lastSeq: 0, createdAt: 0, updatedAt: 0,
-    },
-  }
-}
-
-describe('Renderer — multi-subject chat list', () => {
-  it('does not show the chat-list button when onListChats is not provided', () => {
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn() }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-    expect(root.querySelector('.ocw-chatlist-btn')).toBeNull()
-  })
-
-  it('shows the chat-list button when onListChats is provided', () => {
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats: vi.fn() }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-    expect(root.querySelector('.ocw-chatlist-btn')).not.toBeNull()
-  })
-
-  it('opens the panel and renders one item per conversation, newest first as returned by the handler', async () => {
-    const entries: ChatListEntry[] = [
-      { id: 'c_car_a', subjectId: 'car_a', subjectTitle: '2019 Toyota Camry', state: 'open', updatedAt: Date.now() },
-      { id: 'c_car_b', subjectId: 'car_b', subjectTitle: '2021 Honda Civic', state: 'resolved', updatedAt: Date.now() - 1000 },
-    ]
-    const onListChats = vi.fn().mockResolvedValue(entries)
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-
-    const btn = root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement
-    btn.click()
-    expect(onListChats).toHaveBeenCalledTimes(1)
-    await Promise.resolve(); await Promise.resolve()  // flush the .then()
-
-    expect(root.querySelector('.ocw-chatlist-panel')?.classList.contains('open')).toBe(true)
-    const items = root.querySelectorAll('.ocw-chatlist-item')
-    expect(items.length).toBe(2)
-    expect(items[0]!.textContent).toContain('2019 Toyota Camry')
-    expect(items[1]!.textContent).toContain('2021 Honda Civic')
-  })
-
-  it('shows a general-enquiry label for an entry with no subjectTitle', async () => {
-    const entries: ChatListEntry[] = [
-      { id: 'c_general', state: 'open', updatedAt: Date.now() },
-    ]
-    const onListChats = vi.fn().mockResolvedValue(entries)
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-
-    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
-    await Promise.resolve(); await Promise.resolve()
-
-    expect(root.querySelector('.ocw-chatlist-item')?.textContent).toContain('General enquiry')
-  })
-
-  it('shows an empty state when the guest has no conversations yet', async () => {
-    const onListChats = vi.fn().mockResolvedValue([])
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-
-    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
-    await Promise.resolve(); await Promise.resolve()
-
-    expect(root.querySelector('.ocw-chatlist-empty')?.textContent).toMatch(/no conversations/i)
-  })
-
-  it('calls onSwitchChat with the clicked entry and closes the panel', async () => {
-    const entry: ChatListEntry = { id: 'c_car_a', subjectId: 'car_a', subjectTitle: '2019 Toyota Camry', state: 'open', updatedAt: Date.now() }
-    const onListChats = vi.fn().mockResolvedValue([entry])
-    const onSwitchChat = vi.fn()
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats, onSwitchChat }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-
-    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
-    await Promise.resolve(); await Promise.resolve()
-
-    ;(root.querySelector('.ocw-chatlist-item') as HTMLButtonElement).click()
-    expect(onSwitchChat).toHaveBeenCalledWith(entry)
-    expect(root.querySelector('.ocw-chatlist-panel')?.classList.contains('open')).toBe(false)
-  })
-
-  it('shows a friendly error state if the handler rejects', async () => {
-    const onListChats = vi.fn().mockRejectedValue(new Error('network down'))
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn(), onListChats }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply(openedConv())
-    r.render(store)
-
-    ;(root.querySelector('.ocw-chatlist-btn') as HTMLButtonElement).click()
-    await Promise.resolve(); await Promise.resolve()
-
-    expect(root.querySelector('.ocw-chatlist-empty')?.textContent).toMatch(/could not load/i)
-  })
-})

package/src/__tests__/connection.test.ts

@@ -1,163 +0,0 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { encodeFrame, decodeFrame, type ClientFrame, type ServerFrame, asConversationId } from '../protocol/index.js'
-import { ConnectionManager, type SocketLike } from '../connection.js'
-
-class FakeSocket implements SocketLike {
-  binaryType = 'blob'
-  sent: ClientFrame[] = []
-  onopen: (() => void) | null = null
-  onclose: (() => void) | null = null
-  onerror: (() => void) | null = null
-  onmessage: ((ev: { data: ArrayBuffer }) => void) | null = null
-  closed = false
-  send(data: Uint8Array): void { this.sent.push(decodeFrame(data) as ClientFrame) }
-  close(): void { this.closed = true; this.onclose?.() }
-  // test helpers
-  open(): void { this.onopen?.() }
-  deliver(frame: ServerFrame): void {
-    const u8 = encodeFrame(frame)
-    this.onmessage?.({ data: u8.buffer.slice(u8.byteOffset, u8.byteOffset + u8.byteLength) })
-  }
-}
-
-const open = { type: 'open', profileId: 'p1' as never, subjectId: 's1' as never } as Extract<ClientFrame, { type: 'open' }>
-
-function setup(cursor = 0) {
-  const sockets: FakeSocket[] = []
-  const received: ServerFrame[] = []
-  const cm = new ConnectionManager({
-    url: 'ws://x', token: 'guest-alice', open,
-    onFrame: (f) => received.push(f),
-    getCursor: () => cursor,
-    socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
-    backoffBaseMs: 10, backoffMaxMs: 20,
-  })
-  return { cm, sockets, received }
-}
-
-describe('ConnectionManager', () => {
-  beforeEach(() => vi.useFakeTimers())
-  afterEach(() => vi.useRealTimers())
-
-  it('authenticates first, then opens and flushes the outbox after authed', () => {
-    const { cm, sockets } = setup()
-    cm.connect()
-    const s = sockets[0]!
-    // queue a send before auth completes — it must be buffered, not sent
-    cm.send({ type: 'send', conversationId: asConversationId('c1'), clientMsgId: 'm1', content: { kind: 'text', text: 'hi' } })
-    s.open()
-    expect(s.sent[0]).toMatchObject({ type: 'auth' })
-    expect(s.sent.some(f => f.type === 'send')).toBe(false)  // not before authed
-
-    s.deliver({ type: 'authed', userId: 'alice' as never, connectionId: 'c' as never })
-    const types = s.sent.map(f => f.type)
-    expect(types).toContain('open')         // open sent on authed
-    expect(types).toContain('send')         // outbox flushed after
-    expect(types.indexOf('open')).toBeLessThan(types.indexOf('send'))
-  })
-
-  it('syncs from the cursor when a conversation is opened', () => {
-    const { cm, sockets } = setup(5)
-    cm.connect()
-    const s = sockets[0]!
-    s.open()
-    s.deliver({ type: 'authed', userId: 'alice' as never, connectionId: 'c' as never })
-    s.deliver({ type: 'opened', conversation: { id: asConversationId('c9'), tenantId: 't' as never, profileId: 'p1' as never, guestId: 'alice' as never, participants: [], state: 'open', lastSeq: 5, createdAt: 0, updatedAt: 0 } })
-    const sync = s.sent.find(f => f.type === 'sync')
-    expect(sync).toMatchObject({ type: 'sync', conversationId: 'c9', sinceSeq: 5 })
-  })
-
-  it('reconnects with backoff after an unexpected close', () => {
-    const { cm, sockets } = setup()
-    cm.connect()
-    sockets[0]!.open()
-    sockets[0]!.deliver({ type: 'authed', userId: 'a' as never, connectionId: 'c' as never })
-    sockets[0]!.onclose?.()                 // drop
-    expect(sockets).toHaveLength(1)
-    vi.advanceTimersByTime(50)              // past backoff
-    expect(sockets.length).toBe(2)          // reconnected with a new socket
-    sockets[1]!.open()
-    expect(sockets[1]!.sent[0]).toMatchObject({ type: 'auth' })
-  })
-
-  it('bounds the outbox so a long outage cannot grow memory unbounded', () => {
-    const sockets: FakeSocket[] = []
-    const cm = new ConnectionManager({
-      url: 'ws://x', token: 't', open,
-      onFrame: () => {}, getCursor: () => 0,
-      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
-      maxOutbox: 2,
-    })
-    cm.connect()
-    const s = sockets[0]!
-    for (let i = 0; i < 5; i++) cm.send({ type: 'send', conversationId: asConversationId('c1'), clientMsgId: `m${i}`, content: { kind: 'text', text: 'x' } })
-    s.open()
-    s.deliver({ type: 'authed', userId: 'a' as never, connectionId: 'c' as never })
-    const sends = s.sent.filter(f => f.type === 'send')
-    expect(sends).toHaveLength(2)                                  // capped
-    expect((sends[1] as { clientMsgId: string }).clientMsgId).toBe('m4')  // newest kept
-  })
-
-  it('does not reconnect after an explicit close', () => {
-    const { cm, sockets } = setup()
-    cm.connect()
-    sockets[0]!.open()
-    cm.close()
-    vi.advanceTimersByTime(100)
-    expect(sockets).toHaveLength(1)
-  })
-})
-
-describe('ConnectionManager — status callbacks', () => {
-  beforeEach(() => { vi.useFakeTimers() })
-  afterEach(() => { vi.useRealTimers() })
-
-  it('emits "connecting" on first connect', () => {
-    const statuses: string[] = []
-    const sockets: FakeSocket[] = []
-    const cm = new ConnectionManager({
-      url: 'ws://x', token: 't', open,
-      getCursor: () => 0,
-      onFrame: () => {},
-      onStatusChange: (s) => statuses.push(s),
-      socketFactory: (url) => { const s = new FakeSocket(); sockets.push(s); return s },
-    })
-    cm.connect()
-    expect(statuses).toContain('connecting')
-  })
-
-  it('emits "open" after successful auth', () => {
-    const statuses: string[] = []
-    const sockets: FakeSocket[] = []
-    const cm = new ConnectionManager({
-      url: 'ws://x', token: 't', open,
-      getCursor: () => 0,
-      onFrame: () => {},
-      onStatusChange: (s) => statuses.push(s),
-      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
-    })
-    cm.connect()
-    sockets[0]!.open()
-    sockets[0]!.deliver({ type: 'authed', userId: 'u1' as never })
-    expect(statuses).toContain('open')
-  })
-
-  it('emits "reconnecting" on second+ attempt', () => {
-    const statuses: string[] = []
-    const sockets: FakeSocket[] = []
-    const cm = new ConnectionManager({
-      url: 'ws://x', token: 't', open,
-      getCursor: () => 0,
-      onFrame: () => {},
-      onStatusChange: (s) => statuses.push(s),
-      backoffBaseMs: 10,
-      socketFactory: () => { const s = new FakeSocket(); sockets.push(s); return s },
-    })
-    cm.connect()
-    sockets[0]!.open()
-    sockets[0]!.deliver({ type: 'authed', userId: 'u1' as never })
-    sockets[0]!.close()        // triggers reconnect
-    vi.advanceTimersByTime(100)
-    expect(statuses).toContain('reconnecting')
-  })
-})

package/src/__tests__/crypto.test.ts

@@ -1,28 +0,0 @@
-import { describe, it, expect } from 'vitest'
-import { generateKeyPair, exportPublicKey, deriveSharedKey, encrypt, decrypt } from '../crypto.js'
-
-describe('E2E crypto (ECDH + AES-GCM)', () => {
-  it('two parties derive the same key and round-trip a message', async () => {
-    const guest = await generateKeyPair()
-    const agent = await generateKeyPair()
-    const guestPub = await exportPublicKey(guest.publicKey)
-    const agentPub = await exportPublicKey(agent.publicKey)
-
-    // Guest encrypts to the agent; agent decrypts. Shared secret is symmetric.
-    const kGuest = await deriveSharedKey(guest.privateKey, agentPub)
-    const kAgent = await deriveSharedKey(agent.privateKey, guestPub)
-
-    const { ct, iv } = await encrypt(kGuest, 'is the price negotiable?')
-    expect(ct).not.toContain('negotiable')                 // actually encrypted
-    const plain = await decrypt(kAgent, ct, iv)
-    expect(plain).toBe('is the price negotiable?')
-  })
-
-  it('a wrong key cannot decrypt', async () => {
-    const a = await generateKeyPair(); const b = await generateKeyPair(); const c = await generateKeyPair()
-    const kAB = await deriveSharedKey(a.privateKey, await exportPublicKey(b.publicKey))
-    const kAC = await deriveSharedKey(a.privateKey, await exportPublicKey(c.publicKey))
-    const { ct, iv } = await encrypt(kAB, 'secret')
-    await expect(decrypt(kAC, ct, iv)).rejects.toBeTruthy()
-  })
-})

package/src/__tests__/history.test.ts

@@ -1,91 +0,0 @@
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
-import { asUserId, asConversationId, asMessageId } from '../protocol/index.js'
-import { ChatStore } from '../store.js'
-import { httpBaseFromWsUrl, restoreHistory } from '../history.js'
-
-describe('httpBaseFromWsUrl', () => {
-  it('strips /ws and converts wss to https', () => {
-    expect(httpBaseFromWsUrl('wss://api.paramms.com/ws')).toBe('https://api.paramms.com')
-  })
-  it('strips /ws and converts ws to http', () => {
-    expect(httpBaseFromWsUrl('ws://localhost:3000/ws')).toBe('http://localhost:3000')
-  })
-  it('handles a trailing slash after /ws', () => {
-    expect(httpBaseFromWsUrl('wss://api.paramms.com/ws/')).toBe('https://api.paramms.com')
-  })
-  it('is a no-op when there is no /ws suffix', () => {
-    expect(httpBaseFromWsUrl('wss://api.paramms.com')).toBe('https://api.paramms.com')
-  })
-})
-
-describe('restoreHistory', () => {
-  const me = asUserId('g_test')
-  const cid = asConversationId('c1')
-  let fetchMock: ReturnType<typeof vi.fn>
-
-  beforeEach(() => {
-    fetchMock = vi.fn()
-    vi.stubGlobal('fetch', fetchMock)
-  })
-  afterEach(() => { vi.unstubAllGlobals() })
-
-  function fakeRenderer() {
-    return { render: vi.fn() } as unknown as import('../renderer.js').Renderer
-  }
-
-  it('fetches the right URL with the auth header and applies messages to the store', async () => {
-    fetchMock.mockResolvedValue({
-      ok: true,
-      json: async () => ({
-        messages: [
-          { id: asMessageId('m1'), conversationId: cid, seq: 1, senderId: me, senderRole: 'guest', content: { kind: 'text', text: 'hi' }, ts: 1 },
-        ],
-      }),
-    })
-    const store = new ChatStore(me)
-    const renderer = fakeRenderer()
-
-    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
-
-    expect(fetchMock).toHaveBeenCalledWith(
-      'https://api.paramms.com/conversations/c1/history',
-      { headers: { authorization: 'Bearer g_test' } },
-    )
-    expect(store.messages()).toHaveLength(1)
-    expect(store.messages()[0]!.content).toEqual({ kind: 'text', text: 'hi' })
-    expect(renderer.render).toHaveBeenCalledWith(store)
-  })
-
-  it('does nothing (no render) when the response has no messages', async () => {
-    fetchMock.mockResolvedValue({ ok: true, json: async () => ({ messages: [] }) })
-    const store = new ChatStore(me)
-    const renderer = fakeRenderer()
-    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
-    expect(store.messages()).toHaveLength(0)
-    expect(renderer.render).not.toHaveBeenCalled()
-  })
-
-  it('does nothing when the response is not ok (e.g. 403)', async () => {
-    fetchMock.mockResolvedValue({ ok: false, status: 403, json: async () => ({ error: 'not a participant' }) })
-    const store = new ChatStore(me)
-    const renderer = fakeRenderer()
-    await restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)
-    expect(store.messages()).toHaveLength(0)
-    expect(renderer.render).not.toHaveBeenCalled()
-  })
-
-  it('swallows network errors without throwing', async () => {
-    fetchMock.mockRejectedValue(new Error('network down'))
-    const store = new ChatStore(me)
-    const renderer = fakeRenderer()
-    await expect(restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)).resolves.toBeUndefined()
-    expect(renderer.render).not.toHaveBeenCalled()
-  })
-
-  it('swallows a malformed JSON response without throwing', async () => {
-    fetchMock.mockResolvedValue({ ok: true, json: async () => { throw new Error('bad json') } })
-    const store = new ChatStore(me)
-    const renderer = fakeRenderer()
-    await expect(restoreHistory('wss://api.paramms.com/ws', 'g_test', cid, store, renderer)).resolves.toBeUndefined()
-  })
-})

package/src/__tests__/ime.test.ts

@@ -1,93 +0,0 @@
-// @vitest-environment jsdom
-import { describe, it, expect, vi } from 'vitest'
-import { asUserId, asConversationId } from '../protocol/index.js'
-import { ChatStore } from '../store.js'
-import { Renderer } from '../renderer.js'
-
-const me = 'alice'
-const cid = asConversationId('c1')
-
-function openedConv() {
-  return {
-    type: 'opened' as const,
-    conversation: {
-      id: cid, tenantId: 't' as never, profileId: 'p' as never,
-      guestId: asUserId(me), participants: [asUserId(me)],
-      state: 'open', lastSeq: 0, createdAt: 0, updatedAt: 0,
-    },
-  }
-}
-
-function setup() {
-  const root = document.createElement('div')
-  const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn() }
-  const store = new ChatStore(asUserId(me))
-  const r = new Renderer(root, me, h)
-  store.apply(openedConv())
-  r.render(store)
-  const textarea = root.querySelector('textarea') as HTMLTextAreaElement
-  return { root, h, textarea }
-}
-
-describe('Renderer — IME composition guard (CJK input)', () => {
-  it('does NOT send when Enter confirms an IME composition candidate', () => {
-    const { h, textarea } = setup()
-    textarea.value = '음식'
-    // Simulates the keydown fired by the IME when the user presses Enter to
-    // CONFIRM a composed Korean/Japanese/Chinese candidate — not to submit
-    // the message. isComposing: true is how browsers signal this.
-    const ev = new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true })
-    Object.defineProperty(ev, 'isComposing', { value: true })
-    textarea.dispatchEvent(ev)
-    expect(h.onSend).not.toHaveBeenCalled()
-  })
-
-  it('falls back to keyCode 229 for IMEs that do not set isComposing', () => {
-    const { h, textarea } = setup()
-    textarea.value = '음식'
-    const ev = new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true })
-    Object.defineProperty(ev, 'isComposing', { value: false })
-    Object.defineProperty(ev, 'keyCode', { value: 229 })
-    textarea.dispatchEvent(ev)
-    expect(h.onSend).not.toHaveBeenCalled()
-  })
-
-  it('still sends normally on a real (non-IME) Enter press', () => {
-    const { h, textarea } = setup()
-    textarea.value = 'hello'
-    const ev = new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true })
-    Object.defineProperty(ev, 'isComposing', { value: false })
-    textarea.dispatchEvent(ev)
-    expect(h.onSend).toHaveBeenCalledTimes(1)
-    expect(h.onSend).toHaveBeenCalledWith('hello')
-  })
-
-  it('does not produce a second send for the real Enter that follows an IME-confirm Enter', () => {
-    // Reproduces the exact reported bug: typing "음식" via IME, where Enter
-    // fires once to confirm the composition and again to submit — only the
-    // second, real Enter should trigger a send, and with the FULL text.
-    const { h, textarea } = setup()
-
-    textarea.value = '음식'
-    const composingEnter = new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true })
-    Object.defineProperty(composingEnter, 'isComposing', { value: true })
-    textarea.dispatchEvent(composingEnter)
-
-    // Real submit keystroke, composition has ended.
-    const realEnter = new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true })
-    Object.defineProperty(realEnter, 'isComposing', { value: false })
-    textarea.dispatchEvent(realEnter)
-
-    expect(h.onSend).toHaveBeenCalledTimes(1)
-    expect(h.onSend).toHaveBeenCalledWith('음식')
-  })
-
-  it('shift+Enter still inserts a newline (not a send) regardless of composition state', () => {
-    const { h, textarea } = setup()
-    textarea.value = 'line one'
-    const ev = new KeyboardEvent('keydown', { key: 'Enter', shiftKey: true, bubbles: true, cancelable: true })
-    Object.defineProperty(ev, 'isComposing', { value: false })
-    textarea.dispatchEvent(ev)
-    expect(h.onSend).not.toHaveBeenCalled()
-  })
-})

package/src/__tests__/render.test.ts

@@ -1,58 +0,0 @@
-// @vitest-environment jsdom
-import { describe, it, expect, vi } from 'vitest'
-import { asUserId, asConversationId, asMessageId, asActionId } from '../protocol/index.js'
-import { ChatStore } from '../store.js'
-import { Renderer } from '../renderer.js'
-
-const me = 'alice'
-const cid = asConversationId('c1')
-
-describe('Renderer (jsdom)', () => {
-  it('renders messages and actions, and wires send/invoke', () => {
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn() }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-
-    store.apply({ type: 'opened', conversation: { id: cid, tenantId: 't' as never, profileId: 'p' as never, guestId: asUserId(me), participants: [asUserId(me)], state: 'open', lastSeq: 0, createdAt: 0, updatedAt: 0 } })
-    store.apply({ type: 'message', message: { id: asMessageId('s1'), conversationId: cid, seq: 1, senderId: asUserId('bob'), senderRole: 'agent', content: { kind: 'text', text: 'Welcome!' }, ts: 1 } })
-    store.apply({ type: 'manifest', conversationId: cid, version: 1, actions: [{ id: asActionId('ai'), label: 'Ask AI', audience: 'guest', surface: 'toolbar' }] })
-    r.render(store)
-
-    expect(root.querySelector('.ocw-scroll')!.textContent).toContain('Welcome!')
-    const actionBtn = root.querySelector('.ocw-chip') as HTMLButtonElement
-    expect(actionBtn.textContent).toBe('Ask AI')
-
-    actionBtn.click()
-    expect(h.onInvoke).toHaveBeenCalledWith('ai')
-
-    // read receipt fired for the other party's message
-    expect(h.onReadUpTo).toHaveBeenCalledWith(1)
-
-    const input = root.querySelector('.ocw-input textarea') as HTMLTextAreaElement
-    input.value = 'hello there'
-    input.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter' }))
-    expect(h.onSend).toHaveBeenCalledWith('hello there')
-  })
-
-  it('form action opens an inline form with typed inputs and invokes with values', () => {
-    const root = document.createElement('div')
-    const h = { onSend: vi.fn(), onInvoke: vi.fn(), onTyping: vi.fn(), onReadUpTo: vi.fn() }
-    const store = new ChatStore(asUserId(me))
-    const r = new Renderer(root, me, h)
-    store.apply({ type: 'opened', conversation: { id: cid, tenantId: 't' as never, profileId: 'p' as never, guestId: asUserId(me), participants: [asUserId(me)], state: 'open', lastSeq: 0, createdAt: 0, updatedAt: 0 } })
-    store.apply({ type: 'manifest', conversationId: cid, version: 1, actions: [
-      { id: asActionId('appointment'), label: 'Schedule', audience: 'guest', surface: 'toolbar',
-        input: [{ name: 'time', label: 'Time', type: 'date', required: true }] },
-    ] })
-    r.render(store)
-
-    ;(root.querySelector('.ocw-chip') as HTMLButtonElement).click()
-    const dateInput = root.querySelector('.ocw-form-input') as HTMLInputElement
-    expect(dateInput.type).toBe('datetime-local')               // real date+time picker, not a prompt
-    dateInput.value = '2026-06-10T14:30'
-    ;(root.querySelector('.ocw-form-submit') as HTMLButtonElement).click()
-    expect(h.onInvoke).toHaveBeenCalledWith('appointment', { time: '2026-06-10T14:30' })
-    expect(root.querySelector('.ocw-form')).toBeNull()           // form closes after submit
-  })
-})