Atlas Zeng
6ee1ba11d0
* feat(editor): merged explorer mode — path input, docked file tree, global name search
New editorExplorer pref (default on, editor card gear): the editor tab gains
a path-input header and a toggleable right-docked tree panel (per-tab state
in tab.meta.treeOpen; file tabs default closed, the seeded path-less home
tab defaults open). Fresh sessions seed that empty editor tab instead of
the explorer tab when merged mode is on; the standalone explorer tab stays
in the + menu unchanged.
- Extract FileTree.tsx from ExplorerView (shared by both hosts)
- Host fs.search route: recursive case-insensitive name search rooted at
the session cwd, budget-capped (200 matches / 100k visited), skips .git,
never descends symlink dirs
- EditorHost reads the pref reactively (boolean snapshot) and keeps the
pre-merge layout verbatim when off
* feat(settings): select row type for declarative settings; editorExplorer as iconed select
- SidebarSettingToggle gains type 'select' with options {value,title,desc,icon}
and multi (default false; stores the picked values as an array in options
order). Any option carrying an icon renders big-icon option cards in the
dropdown and the icon in the closed anchor; icon-less rows are one-line text.
- SelectRow in SideCardSection rides the primitives Menu (portal); single-pick
commits and closes, multi toggles and stays open. Wired for both host-prefs
toggles and plugin-owned pluginToggles via the new onSelectValue seam.
- The editorExplorer merged-mode pref is now an iconed select (merged vs
separate) instead of a switch; the stored value stays boolean.
- Advertise the capability as 'settingSelect' in SIDEBAR_FEATURES.
* feat(editor): unify explorer into the editor surface, resizable tree dock, hoisted toolbar
- One tree implementation, two presentations: the shared TreePanel (global
name search + refresh + FileTree) docks as the editor tab's right panel
and — in merged mode — fills the explorer tab's window; the pref-off
explorer keeps its legacy header shell.
- The docked panel drag-resizes from its left edge (160-480px clamp),
persisted as tab.meta.treeWidth alongside treeOpen.
- The text editor's preview/edit/save toolbar moves into the path-input
header row: FileViewerProps gains internal toolbar fields ('host' mode
skips the viewer's own row, reports EditorToolbarState and registers
EditorToolbarControls); non-merged mode is byte-identical to before.
* feat(editor): single files window with in-place switching; explorer descriptor removed
- editor tab replaces explorer on the + menu (order 10, Files); persisted
explorer tabs migrate to the editor home tab via sanitizeState
- editorExplorer now only controls open behavior: merged = in-place
updateTab, independent = openSidebarFile; both modes share the merged
chrome (path input + hoisted preview/edit/save toolbar + tree toggle)
- file tree context menu gains 'open in new tab' / 'open to the side'
(mintTabId avoids the id safety net; insertLeafAt splits right)
- tree dock resize uses pointer capture (touch-action none, 6px handle)
- defaults: openByDefault off, sidebar width 35%
- file tree clips horizontal overflow (no sideways scroll)
- e2e: mount lane arms the editor-chunk wait before goto and clicks the
tree row's left edge (hover @-reference button sits mid-row); drag lane
expands the panel first (collapsed push writes 0px), waits for the
slide-in to settle, and picks the leftmost col-resize strip; 'Files'
title assertions require draggable to skip the bottom panel's welcome
cards
* feat(editor): split mode turns the path-less window into the standalone explorer
In independent (split) mode a path-less files window renders ONLY the
tree panel (search + FileTree, full-window form) — no path input, no
hoisted toolbar, no tree toggle. File clicks open per-path editor tabs
(full chrome, tree docked closed by default) through openSidebarFile,
unchanged. Merged mode is untouched (chrome + docked tree, in-place
switching). TreePanel's previously reserved 'full' prop now has its
consumer.
298 lines
17 KiB
TypeScript
298 lines
17 KiB
TypeScript
import { describe, expect, it } from 'vitest'
|
||
import { loadPrefs, type SidebarSettingsClient } from '../src/client/prefs.ts'
|
||
import { allLeaves, createSidebarStore, defaultWidthFor, makeDefaultState } from '../src/client/state.ts'
|
||
import { SIDEBAR_PREFS_DEFAULTS } from '../src/prefs-shared.ts'
|
||
|
||
describe('side card preferences', () => {
|
||
/** A fake settings wire face whose settingsGet resolves to one raw value. */
|
||
const wire = (value: unknown): SidebarSettingsClient => ({
|
||
settingsGet: async () => ({ value, revision: 1 }),
|
||
settingsUpdate: async () => ({ value, revision: 2 }),
|
||
})
|
||
|
||
const rejecting = (): SidebarSettingsClient => ({
|
||
settingsGet: async () => { throw new Error('route rejected') },
|
||
settingsUpdate: async () => { throw new Error('route rejected') },
|
||
})
|
||
|
||
it('falls back to the defaults when the settings route rejects', async () => {
|
||
expect(await loadPrefs(rejecting())).toEqual(SIDEBAR_PREFS_DEFAULTS)
|
||
})
|
||
|
||
it('falls back to the defaults when the value is absent or malformed', async () => {
|
||
expect(await loadPrefs(wire(undefined))).toEqual(SIDEBAR_PREFS_DEFAULTS)
|
||
expect(await loadPrefs(wire('garbage'))).toEqual(SIDEBAR_PREFS_DEFAULTS)
|
||
})
|
||
|
||
it('parses a valid value and clamps the percent into the contract range', async () => {
|
||
expect(await loadPrefs(wire({ openByDefault: false, defaultWidthPercent: 80, autoOpenSubagent: false, agentTerminalTools: true })))
|
||
.toEqual({
|
||
openByDefault: false,
|
||
defaultWidthPercent: 60,
|
||
autoOpenSubagent: false,
|
||
autoOpenJobs: true,
|
||
agentTerminalTools: true,
|
||
bottomPanelAutoTerminal: true,
|
||
terminalFontFamily: '',
|
||
terminalFontSize: 13,
|
||
interceptOpenPath: true,
|
||
editorExplorer: true,
|
||
titleBarCompat: false,
|
||
titleBarStripPx: 40,
|
||
htmlViewerNoSandbox: false,
|
||
htmlViewerDefaultUnsafe: false,
|
||
browserNoSandbox: false,
|
||
browserInterceptLinks: true,
|
||
browserInterceptHttp: true,
|
||
browserInterceptHttps: false,
|
||
tabsEnabled: {},
|
||
viewersEnabled: {},
|
||
pluginSettings: {},
|
||
})
|
||
})
|
||
|
||
it('falls back per-field when a stored field is malformed', async () => {
|
||
expect(await loadPrefs(wire({ openByDefault: 'yes', defaultWidthPercent: 33, autoOpenSubagent: 'no', agentTerminalTools: 'yes' })))
|
||
.toEqual({
|
||
openByDefault: false,
|
||
defaultWidthPercent: 33,
|
||
autoOpenSubagent: true,
|
||
autoOpenJobs: true,
|
||
agentTerminalTools: false,
|
||
bottomPanelAutoTerminal: true,
|
||
terminalFontFamily: '',
|
||
terminalFontSize: 13,
|
||
interceptOpenPath: true,
|
||
editorExplorer: true,
|
||
titleBarCompat: false,
|
||
titleBarStripPx: 40,
|
||
htmlViewerNoSandbox: false,
|
||
htmlViewerDefaultUnsafe: false,
|
||
browserNoSandbox: false,
|
||
browserInterceptLinks: true,
|
||
browserInterceptHttp: true,
|
||
browserInterceptHttps: false,
|
||
tabsEnabled: {},
|
||
viewersEnabled: {},
|
||
pluginSettings: {},
|
||
})
|
||
})
|
||
|
||
it('defaults autoOpenSubagent to true and agentTerminalTools to false when the stored value is absent or malformed', async () => {
|
||
expect(await loadPrefs(wire({ openByDefault: false, defaultWidthPercent: 40 })))
|
||
.toEqual({
|
||
openByDefault: false,
|
||
defaultWidthPercent: 40,
|
||
autoOpenSubagent: true,
|
||
autoOpenJobs: true,
|
||
agentTerminalTools: false,
|
||
bottomPanelAutoTerminal: true,
|
||
terminalFontFamily: '',
|
||
terminalFontSize: 13,
|
||
interceptOpenPath: true,
|
||
editorExplorer: true,
|
||
titleBarCompat: false,
|
||
titleBarStripPx: 40,
|
||
htmlViewerNoSandbox: false,
|
||
htmlViewerDefaultUnsafe: false,
|
||
browserNoSandbox: false,
|
||
browserInterceptLinks: true,
|
||
browserInterceptHttp: true,
|
||
browserInterceptHttps: false,
|
||
tabsEnabled: {},
|
||
viewersEnabled: {},
|
||
pluginSettings: {},
|
||
})
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40, autoOpenSubagent: 1 }))).autoOpenSubagent)
|
||
.toBe(true)
|
||
// The terminal-tools feature is OFF by default; only an explicit true turns it on.
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40 }))).agentTerminalTools)
|
||
.toBe(false)
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40, agentTerminalTools: 1 }))).agentTerminalTools)
|
||
.toBe(false)
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40, agentTerminalTools: true }))).agentTerminalTools)
|
||
.toBe(true)
|
||
// The job auto-open is ON by default; only an explicit false turns it off.
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40, autoOpenJobs: 1 }))).autoOpenJobs)
|
||
.toBe(true)
|
||
expect((await loadPrefs(wire({ openByDefault: true, defaultWidthPercent: 40, autoOpenJobs: false }))).autoOpenJobs)
|
||
.toBe(false)
|
||
})
|
||
|
||
it('defaults interceptOpenPath to true; only an explicit false turns the takeover off', async () => {
|
||
// Absent or malformed → on (the takeover is the safe default).
|
||
expect((await loadPrefs(wire({}))).interceptOpenPath).toBe(true)
|
||
expect((await loadPrefs(wire({ interceptOpenPath: 'yes' }))).interceptOpenPath).toBe(true)
|
||
expect((await loadPrefs(wire({ interceptOpenPath: 0 }))).interceptOpenPath).toBe(true)
|
||
// Explicit booleans survive verbatim.
|
||
expect((await loadPrefs(wire({ interceptOpenPath: false }))).interceptOpenPath).toBe(false)
|
||
expect((await loadPrefs(wire({ interceptOpenPath: true }))).interceptOpenPath).toBe(true)
|
||
})
|
||
|
||
it('defaults editorExplorer to true; only an explicit false restores the plain editor', async () => {
|
||
// Absent or malformed → on (the merged editor-explorer is the default).
|
||
expect((await loadPrefs(wire({}))).editorExplorer).toBe(true)
|
||
expect((await loadPrefs(wire({ editorExplorer: 'yes' }))).editorExplorer).toBe(true)
|
||
expect((await loadPrefs(wire({ editorExplorer: 0 }))).editorExplorer).toBe(true)
|
||
// Explicit booleans survive verbatim.
|
||
expect((await loadPrefs(wire({ editorExplorer: false }))).editorExplorer).toBe(false)
|
||
expect((await loadPrefs(wire({ editorExplorer: true }))).editorExplorer).toBe(true)
|
||
})
|
||
|
||
it('defaults titleBarCompat to false; only an explicit true turns the position-compat mode on', async () => {
|
||
// Absent or malformed → off (the normal layout is the default).
|
||
expect((await loadPrefs(wire({}))).titleBarCompat).toBe(false)
|
||
expect((await loadPrefs(wire({ titleBarCompat: 'yes' }))).titleBarCompat).toBe(false)
|
||
expect((await loadPrefs(wire({ titleBarCompat: 1 }))).titleBarCompat).toBe(false)
|
||
// Explicit booleans survive verbatim.
|
||
expect((await loadPrefs(wire({ titleBarCompat: false }))).titleBarCompat).toBe(false)
|
||
expect((await loadPrefs(wire({ titleBarCompat: true }))).titleBarCompat).toBe(true)
|
||
})
|
||
|
||
it('defaults titleBarStripPx to 40 and clamps stored values into the contract range', async () => {
|
||
// Absent or malformed → 40 (the strip default).
|
||
expect((await loadPrefs(wire({}))).titleBarStripPx).toBe(40)
|
||
expect((await loadPrefs(wire({ titleBarStripPx: 'yes' }))).titleBarStripPx).toBe(40)
|
||
// Out-of-range numbers clamp into 0–120.
|
||
expect((await loadPrefs(wire({ titleBarStripPx: -5 }))).titleBarStripPx).toBe(0)
|
||
expect((await loadPrefs(wire({ titleBarStripPx: 200 }))).titleBarStripPx).toBe(120)
|
||
expect((await loadPrefs(wire({ titleBarStripPx: 47.6 }))).titleBarStripPx).toBe(48)
|
||
// In-range values survive verbatim.
|
||
expect((await loadPrefs(wire({ titleBarStripPx: 0 }))).titleBarStripPx).toBe(0)
|
||
expect((await loadPrefs(wire({ titleBarStripPx: 64 }))).titleBarStripPx).toBe(64)
|
||
})
|
||
|
||
it('defaults the link-takeover protocol flags: http on, https off, master on', async () => {
|
||
// Absent or malformed → the per-protocol defaults.
|
||
expect((await loadPrefs(wire({}))).browserInterceptLinks).toBe(true)
|
||
expect((await loadPrefs(wire({}))).browserInterceptHttp).toBe(true)
|
||
expect((await loadPrefs(wire({}))).browserInterceptHttps).toBe(false)
|
||
expect((await loadPrefs(wire({ browserInterceptHttp: 'yes' }))).browserInterceptHttp).toBe(true)
|
||
expect((await loadPrefs(wire({ browserInterceptHttps: 0 }))).browserInterceptHttps).toBe(false)
|
||
// Explicit booleans survive verbatim.
|
||
expect((await loadPrefs(wire({ browserInterceptHttp: false }))).browserInterceptHttp).toBe(false)
|
||
expect((await loadPrefs(wire({ browserInterceptHttps: true }))).browserInterceptHttps).toBe(true)
|
||
// The master is independent of the protocol flags (an explicit master
|
||
// false stays "never take over" regardless of the flags).
|
||
expect((await loadPrefs(wire({ browserInterceptLinks: false, browserInterceptHttp: true, browserInterceptHttps: true }))))
|
||
.toMatchObject({ browserInterceptLinks: false, browserInterceptHttp: true, browserInterceptHttps: true })
|
||
})
|
||
|
||
it('resolves the terminal font prefs (family passthrough, size clamp)', async () => {
|
||
// Absent → theme default (empty family) + default size.
|
||
expect((await loadPrefs(wire({}))).terminalFontFamily).toBe('')
|
||
expect((await loadPrefs(wire({}))).terminalFontSize).toBe(13)
|
||
// A custom family survives verbatim; a malformed one falls back.
|
||
expect((await loadPrefs(wire({ terminalFontFamily: '"JetBrains Mono", monospace' }))).terminalFontFamily)
|
||
.toBe('"JetBrains Mono", monospace')
|
||
expect((await loadPrefs(wire({ terminalFontFamily: 42 }))).terminalFontFamily).toBe('')
|
||
// The size clamps into 9–32 (rounded); non-numbers fall back.
|
||
expect((await loadPrefs(wire({ terminalFontSize: 5 }))).terminalFontSize).toBe(9)
|
||
expect((await loadPrefs(wire({ terminalFontSize: 40 }))).terminalFontSize).toBe(32)
|
||
expect((await loadPrefs(wire({ terminalFontSize: 15.6 }))).terminalFontSize).toBe(16)
|
||
expect((await loadPrefs(wire({ terminalFontSize: 'big' }))).terminalFontSize).toBe(13)
|
||
expect((await loadPrefs(wire({ terminalFontSize: 18 }))).terminalFontSize).toBe(18)
|
||
})
|
||
|
||
it('validates the per-tab / per-viewer enable maps (absent keys mean enabled)', async () => {
|
||
// A non-object map falls back to {} (everything enabled).
|
||
expect((await loadPrefs(wire({ tabsEnabled: 'nope' }))).tabsEnabled).toEqual({})
|
||
expect((await loadPrefs(wire({ viewersEnabled: [1, 2] }))).viewersEnabled).toEqual({})
|
||
// Non-boolean entries are dropped; boolean entries survive verbatim.
|
||
const parsed = await loadPrefs(wire({
|
||
tabsEnabled: { git: false, explorer: true, bad: 'yes' },
|
||
viewersEnabled: { image: false, code: 1 },
|
||
}))
|
||
expect(parsed.tabsEnabled).toEqual({ git: false, explorer: true })
|
||
expect(parsed.viewersEnabled).toEqual({ image: false })
|
||
})
|
||
|
||
it('seeds new-session defaults from the store prefs (open flag + width)', () => {
|
||
const store = createSidebarStore()
|
||
// Node environment: no window → the width falls back to PANEL_DEFAULT,
|
||
// while the open flag still follows the preference.
|
||
store.setPrefs({ openByDefault: false, defaultWidthPercent: 45, autoOpenSubagent: true, autoOpenJobs: true, agentTerminalTools: false, bottomPanelAutoTerminal: true, terminalFontFamily: '', terminalFontSize: 13, interceptOpenPath: true, editorExplorer: true, titleBarCompat: false, titleBarStripPx: 40, htmlViewerNoSandbox: false, htmlViewerDefaultUnsafe: false, browserNoSandbox: false, browserInterceptLinks: true, browserInterceptHttp: true, browserInterceptHttps: false, tabsEnabled: {}, viewersEnabled: {}, pluginSettings: {} })
|
||
store.setSession('fresh-session')
|
||
expect(store.getPrefs()).toEqual({ openByDefault: false, defaultWidthPercent: 45, autoOpenSubagent: true, autoOpenJobs: true, agentTerminalTools: false, bottomPanelAutoTerminal: true, terminalFontFamily: '', terminalFontSize: 13, interceptOpenPath: true, editorExplorer: true, titleBarCompat: false, titleBarStripPx: 40, htmlViewerNoSandbox: false, htmlViewerDefaultUnsafe: false, browserNoSandbox: false, browserInterceptLinks: true, browserInterceptHttp: true, browserInterceptHttps: false, tabsEnabled: {}, viewersEnabled: {}, pluginSettings: {} })
|
||
const snapshot = store.getSnapshot()
|
||
expect(snapshot.sessionId).toBe('fresh-session')
|
||
expect(snapshot.state?.panelOpen).toBe(false)
|
||
expect(snapshot.state?.width).toBe(400)
|
||
// The default prefs keep the panel closed (openByDefault defaults off).
|
||
const openStore = createSidebarStore()
|
||
openStore.setSession('another-fresh')
|
||
expect(openStore.getSnapshot().state?.panelOpen).toBe(false)
|
||
})
|
||
|
||
it('seeds a brand-new session COLLAPSED on narrow viewports (the panel is a full-screen drawer there)', () => {
|
||
// Stub a narrow window (the file otherwise runs without one): only
|
||
// innerWidth is read while seeding a fresh session.
|
||
const original = (globalThis as Record<string, unknown>).window
|
||
;(globalThis as Record<string, unknown>).window = {
|
||
innerWidth: 390,
|
||
clearTimeout: () => {},
|
||
setTimeout: (_fn: () => void) => 0,
|
||
}
|
||
try {
|
||
const store = createSidebarStore()
|
||
// The narrow viewport keeps a fresh session collapsed for the FIRST
|
||
// seeding only (a later user expansion persists).
|
||
store.setSession('narrow-fresh')
|
||
expect(store.getSnapshot().state?.panelOpen).toBe(false)
|
||
// The width seeding still follows the window (clamped to the floor).
|
||
expect(store.getSnapshot().state?.width).toBe(280)
|
||
} finally {
|
||
if (original === undefined) delete (globalThis as Record<string, unknown>).window
|
||
else (globalThis as Record<string, unknown>).window = original
|
||
}
|
||
})
|
||
|
||
it('skips the default seed tab when the editor (files window) type is disabled', () => {
|
||
const store = createSidebarStore()
|
||
store.setPrefs({ openByDefault: true, defaultWidthPercent: 30, autoOpenSubagent: true, autoOpenJobs: true, agentTerminalTools: false, bottomPanelAutoTerminal: true, terminalFontFamily: '', terminalFontSize: 13, interceptOpenPath: true, editorExplorer: true, titleBarCompat: false, titleBarStripPx: 40, htmlViewerNoSandbox: false, htmlViewerDefaultUnsafe: false, browserNoSandbox: false, browserInterceptLinks: true, browserInterceptHttp: true, browserInterceptHttps: false, tabsEnabled: { editor: false }, viewersEnabled: {}, pluginSettings: {} })
|
||
store.setSession('no-editor')
|
||
const state = store.getSnapshot().state!
|
||
const tabs = allLeaves(state.splits).flatMap(leaf => leaf.tabs)
|
||
expect(tabs).toHaveLength(0)
|
||
expect(state.splits.kind).toBe('leaf')
|
||
// Re-enabling seeds the files window (editor home tab) again — in BOTH
|
||
// editorExplorer modes.
|
||
for (const editorExplorer of [true, false]) {
|
||
const openStore = createSidebarStore()
|
||
openStore.setPrefs({ openByDefault: true, defaultWidthPercent: 30, autoOpenSubagent: true, autoOpenJobs: true, agentTerminalTools: false, bottomPanelAutoTerminal: true, terminalFontFamily: '', terminalFontSize: 13, interceptOpenPath: true, editorExplorer, titleBarCompat: false, titleBarStripPx: 40, htmlViewerNoSandbox: false, htmlViewerDefaultUnsafe: false, browserNoSandbox: false, browserInterceptLinks: true, browserInterceptHttp: true, browserInterceptHttps: false, tabsEnabled: {}, viewersEnabled: {}, pluginSettings: {} })
|
||
openStore.setSession(`with-editor-${editorExplorer}`)
|
||
const openTabs = allLeaves(openStore.getSnapshot().state!.splits).flatMap(leaf => leaf.tabs)
|
||
expect(openTabs.map(tab => tab.type)).toEqual(['editor'])
|
||
}
|
||
})
|
||
|
||
it('seeds the empty editor home tab (files window) in both editorExplorer modes', () => {
|
||
for (const editorExplorer of [true, false]) {
|
||
const store = createSidebarStore()
|
||
store.setPrefs({ openByDefault: true, defaultWidthPercent: 30, autoOpenSubagent: true, autoOpenJobs: true, agentTerminalTools: false, bottomPanelAutoTerminal: true, terminalFontFamily: '', terminalFontSize: 13, interceptOpenPath: true, editorExplorer, titleBarCompat: false, titleBarStripPx: 40, htmlViewerNoSandbox: false, htmlViewerDefaultUnsafe: false, browserNoSandbox: false, browserInterceptLinks: true, browserInterceptHttp: true, browserInterceptHttps: false, tabsEnabled: {}, viewersEnabled: {}, pluginSettings: {} })
|
||
store.setSession(`fresh-${editorExplorer}`)
|
||
const tabs = allLeaves(store.getSnapshot().state!.splits).flatMap(leaf => leaf.tabs)
|
||
expect(tabs).toHaveLength(1)
|
||
expect(tabs[0]!.type).toBe('editor')
|
||
expect(tabs[0]!.title).toBe('Files')
|
||
expect(tabs[0]!.path).toBeUndefined()
|
||
expect(tabs[0]!.meta).toEqual({ treeOpen: true })
|
||
}
|
||
})
|
||
|
||
it('derives the default width from the window percent with clamps', () => {
|
||
expect(defaultWidthFor(1440, 30)).toBe(432)
|
||
expect(defaultWidthFor(800, 30)).toBe(280) // the panel floor
|
||
expect(defaultWidthFor(1440, 100)).toBe(1440) // the viewport cap
|
||
})
|
||
|
||
it('makeDefaultState honors the open flag', () => {
|
||
expect(makeDefaultState().panelOpen).toBe(true)
|
||
expect(makeDefaultState(400, false).panelOpen).toBe(false)
|
||
expect(makeDefaultState(400, false).width).toBe(400)
|
||
// The 'none' seed starts with an empty pane (no default tab).
|
||
expect(makeDefaultState(400, true, 'none').splits.kind).toBe('leaf')
|
||
expect((makeDefaultState(400, true, 'none').splits as { tabs: unknown[] }).tabs).toHaveLength(0)
|
||
})
|
||
})
|