diff --git a/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.test.tsx b/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.test.tsx
index b5e97640dfa2..62b825659f1b 100644
--- a/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.test.tsx
+++ b/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.test.tsx
@@ -167,6 +167,10 @@ describe('FloatingPanes (live DOM)', () => {
const before = card()!.style.left
const toggle = card()!.querySelector('button')!
+ const chevron = () => toggle.querySelector('i')!
+
+ // Expanded: down chevron (fold). Collapsed: up chevron (restore).
+ expect(chevron().className).toContain('codicon-chevron-down')
// The button is inside the drag handle — [data-floating-no-drag] must
// stop it starting a drag.
@@ -182,6 +186,7 @@ describe('FloatingPanes (live DOM)', () => {
expect(document.querySelector('[data-testid="hud-body"]')).toBeNull()
expect(card()!.style.height).toBe('')
+ expect(chevron().className).toContain('codicon-chevron-up')
})
it('renders one card per floating contribution', () => {
diff --git a/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.tsx b/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.tsx
index 338a2f17b9c0..404620e25116 100644
--- a/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.tsx
+++ b/apps/desktop/src/components/pane-shell/tree/renderer/floating-panes.tsx
@@ -172,7 +172,7 @@ function FloatingPane({ pane }: { pane: Contribution }) {
onClick={toggleCollapsed}
type="button"
>
-
+
diff --git a/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.test.tsx b/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.test.tsx
new file mode 100644
index 000000000000..8241ae1b50f8
--- /dev/null
+++ b/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.test.tsx
@@ -0,0 +1,76 @@
+import { act, type ReactNode } from 'react'
+import { createRoot, type Root } from 'react-dom/client'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+
+import { registry } from '@/contrib/registry'
+
+import type { GroupNode } from '../model'
+
+import { TreeGroup } from './tree-group'
+
+let root: null | Root = null
+let container: HTMLDivElement | null = null
+let disposePane: (() => void) | null = null
+
+function render(ui: ReactNode) {
+ if (!container) {
+ container = globalThis.document.createElement('div')
+ globalThis.document.body.append(container)
+ root = createRoot(container)
+ }
+
+ act(() => {
+ root!.render(ui)
+ })
+}
+
+function terminalGroup(minimized: boolean): GroupNode {
+ return {
+ active: 'terminal',
+ headerHidden: false,
+ id: 'terminal-zone',
+ minimized,
+ panes: ['terminal'],
+ type: 'group'
+ }
+}
+
+const toggle = (label: string) =>
+ globalThis.document.querySelector(
+ `[data-tree-group="terminal-zone"] button[aria-label="${label}"]`
+ )!
+
+afterEach(() => {
+ if (root) {
+ act(() => root!.unmount())
+ }
+
+ container?.remove()
+ disposePane?.()
+ root = null
+ container = null
+ disposePane = null
+ vi.unstubAllGlobals()
+})
+
+describe('TreeGroup', () => {
+ it('points the docked-zone chevron in the collapse or restore action direction', () => {
+ disposePane = registry.register({
+ area: 'panes',
+ data: { height: '12rem' },
+ id: 'terminal',
+ render: () => Terminal
,
+ title: 'Terminal'
+ })
+ // jsdom does not implement CSS.escape, which the real tab-strip effect uses.
+ vi.stubGlobal('CSS', { escape: (value: string) => value })
+
+ render()
+
+ expect(toggle('Minimize').querySelector('i')!.className).toContain('codicon-chevron-down')
+
+ render()
+
+ expect(toggle('Restore').querySelector('i')!.className).toContain('codicon-chevron-up')
+ })
+})
diff --git a/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.tsx b/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.tsx
index 8c480dbefcd0..c34c1788e7e8 100644
--- a/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.tsx
+++ b/apps/desktop/src/components/pane-shell/tree/renderer/tree-group.tsx
@@ -544,7 +544,7 @@ export function TreeGroup({
onPointerDown={e => e.stopPropagation()}
type="button"
>
-
+
)}