Files
deepseek-harness/packages/client/ui-sidebar/tests/sidebar-root.spec.tsx
Yif ae76ed2874 fix(web-ui): workspace chip placeholder, logo new-session shortcut, hero foot padding
- The hero workspace chip is a selector: no-live-selection states (cold
  start, workspace deleted from the sidebar after the list is ready) now
  render a "Choose workspace" placeholder (closed-folder icon) instead of
  resurrecting the deleted folder name via the session cwd; the cwd-derived
  name still bridges the initial list load. Stale pending picks clear when
  their workspace leaves a ready list.
- The expanded sidebar wordmark starts a new session (visuals unchanged,
  pointer cursor only); the collapsed rail logo keeps its expand toggle.
- The centered hero composer stack gains a 32px foot for visual balance.
2026-07-28 04:56:14 +08:00

98 lines
3.8 KiB
TypeScript

// @vitest-environment jsdom
import { afterEach, describe, expect, it, vi } from 'vitest'
import { cleanup, fireEvent, render, screen } from '@testing-library/react'
import type { SidebarRootComponentProps, SidebarSectionOwnerProps, SidebarSettingsOwnerProps } from '../src/client/contract/slots.ts'
import { SidebarRoot } from '../src/client/SidebarRoot.tsx'
afterEach(() => {
cleanup()
vi.useRealTimers()
})
// The shell never reads the global hooks itself, but they ride the standard
// props share; stub them as never-called functions.
const neverHook = (() => { throw new Error('shell must not read global hooks') }) as never
function mountShell({ collapsed = false, width = 300 }: { collapsed?: boolean; width?: number } = {}) {
const startSession = vi.fn()
const toggleSidebar = vi.fn()
let regionOwner: SidebarSectionOwnerProps | undefined
let settingsOwner: SidebarSettingsOwnerProps | undefined
let current = { collapsed, width }
const root = () => (
<SidebarRoot
collapsed={current.collapsed} width={current.width}
useSessions={neverHook} useWorkspaces={neverHook}
startSession={startSession} toggleSidebar={toggleSidebar}
renderSlot={((key: string, owner: SidebarSectionOwnerProps | SidebarSettingsOwnerProps) => {
if (key === 'sidebar.settings') {
settingsOwner = owner
return <div data-testid="settings-seat" data-wide={owner.wide} />
}
regionOwner = owner as SidebarSectionOwnerProps
return <div data-testid="region" data-wide={owner.wide} />
}) as SidebarRootComponentProps['renderSlot']}
/>
)
const view = render(root())
return {
startSession,
toggleSidebar,
regionOwner: () => {
if (regionOwner === undefined) throw new Error('region owner not rendered')
return regionOwner
},
settingsOwner: () => {
if (settingsOwner === undefined) throw new Error('settings owner not rendered')
return settingsOwner
},
rerender(next: Partial<typeof current>) {
current = { ...current, ...next }
view.rerender(root())
},
}
}
describe('SidebarRoot shell', () => {
it('routes New Session (capsule + wordmark) and the column toggle', () => {
const b = mountShell()
// Expanded, both the wordmark and the capsule start a session.
const starters = screen.getAllByRole('button', { name: 'New session' })
expect(starters).toHaveLength(2)
for (const button of starters) fireEvent.click(button)
expect(b.startSession).toHaveBeenCalledTimes(2)
fireEvent.click(screen.getByRole('button', { name: 'Collapse sidebar' }))
expect(b.toggleSidebar).toHaveBeenCalledOnce()
})
it('hands the region its wide flag and clamps expandSidebar to the collapsed state', () => {
const b = mountShell()
expect(b.regionOwner().wide).toBe(true)
// The settings seat rides the same wide flag (ui-settings renders the row).
expect(b.settingsOwner().wide).toBe(true)
// Expanded: the request is a no-op (no accidental collapse).
b.regionOwner().expandSidebar()
expect(b.toggleSidebar).not.toHaveBeenCalled()
})
it('keeps the region mounted through collapse and expands on its request', () => {
vi.useFakeTimers()
const b = mountShell()
b.rerender({ collapsed: true })
// Wide content survives the crossfade window, then settles into the rail.
expect(b.regionOwner().wide).toBe(true)
vi.advanceTimersByTime(200)
b.rerender({})
expect(b.regionOwner().wide).toBe(false)
expect(screen.getByTestId('region')).toBeTruthy()
b.regionOwner().expandSidebar()
expect(b.toggleSidebar).toHaveBeenCalledOnce()
})
it('renders statically collapsed on a cold start (no crossfade classes)', () => {
const b = mountShell({ collapsed: true })
expect(b.regionOwner().wide).toBe(false)
expect(screen.getByRole('button', { name: 'Open sidebar' })).toBeTruthy()
})
})