mirror of
https://github.com/jlengrand/Maestro.git
synced 2026-03-10 08:31:19 +00:00
MAESTRO: Add unit tests for session switching with file tabs
- Created comprehensive SessionContext.test.tsx with 15 unit tests - Verifies each session maintains independent file preview tabs - Tests session switching updates visible file tabs correctly - Verifies switching back restores scroll position, search query, edit mode - Tests active file tab ID is tracked per-session - Verifies rapid session switching preserves state
This commit is contained in:
Pedram Amini
609
src/__tests__/renderer/contexts/SessionContext.test.tsx
Normal file
609
src/__tests__/renderer/contexts/SessionContext.test.tsx
Normal file
@@ -0,0 +1,609 @@
|
||||
/**
|
||||
* Tests for SessionContext - Session Switching with File Tabs
|
||||
*
|
||||
* This test suite verifies that:
|
||||
* 1. Each session maintains its own file tabs independently
|
||||
* 2. Session switching properly switches to new session's file tabs
|
||||
* 3. Switching back to a session restores its file tabs correctly
|
||||
* 4. File tab state (scroll position, search query, edit mode) is per-session
|
||||
* 5. Active file tab ID is per-session
|
||||
*/
|
||||
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { render, screen, renderHook, act } from '@testing-library/react';
|
||||
import React, { useState, useCallback } from 'react';
|
||||
import { SessionProvider, useSession } from '../../../renderer/contexts/SessionContext';
|
||||
import type { Session, AITab, FilePreviewTab, UnifiedTabRef } from '../../../renderer/types';
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Helpers
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
/** Create a minimal AITab with sensible defaults */
|
||||
const makeTab = (overrides: Partial<AITab> = {}): AITab => ({
|
||||
id: overrides.id ?? `tab-${Math.random().toString(36).slice(2, 8)}`,
|
||||
agentSessionId: null,
|
||||
name: null,
|
||||
starred: false,
|
||||
logs: [],
|
||||
inputValue: '',
|
||||
stagedImages: [],
|
||||
createdAt: Date.now(),
|
||||
state: 'idle',
|
||||
...overrides,
|
||||
});
|
||||
|
||||
/** Create a minimal FilePreviewTab for testing */
|
||||
const makeFilePreviewTab = (overrides: Partial<FilePreviewTab> = {}): FilePreviewTab => ({
|
||||
id: overrides.id ?? `file-tab-${Math.random().toString(36).slice(2, 8)}`,
|
||||
path: overrides.path ?? '/test/file.ts',
|
||||
name: overrides.name ?? 'file',
|
||||
extension: overrides.extension ?? '.ts',
|
||||
content: overrides.content ?? 'console.log("test");',
|
||||
scrollTop: overrides.scrollTop ?? 0,
|
||||
searchQuery: overrides.searchQuery ?? '',
|
||||
editMode: overrides.editMode ?? false,
|
||||
editContent: overrides.editContent ?? undefined,
|
||||
createdAt: overrides.createdAt ?? Date.now(),
|
||||
lastModified: overrides.lastModified ?? Date.now(),
|
||||
sshRemoteId: overrides.sshRemoteId,
|
||||
isLoading: overrides.isLoading,
|
||||
});
|
||||
|
||||
/** Create a minimal Session with sensible defaults */
|
||||
const makeSession = (overrides: Partial<Session> = {}): Session => {
|
||||
const defaultTab = makeTab({ id: 'default-tab' });
|
||||
return {
|
||||
id: overrides.id ?? `session-${Math.random().toString(36).slice(2, 8)}`,
|
||||
name: 'Test Session',
|
||||
toolType: 'claude-code',
|
||||
state: 'idle',
|
||||
cwd: '/test',
|
||||
fullPath: '/test',
|
||||
projectRoot: '/test',
|
||||
aiLogs: [],
|
||||
shellLogs: [],
|
||||
workLog: [],
|
||||
contextUsage: 0,
|
||||
inputMode: 'ai',
|
||||
aiPid: 0,
|
||||
terminalPid: 0,
|
||||
port: 0,
|
||||
isLive: false,
|
||||
changedFiles: [],
|
||||
isGitRepo: false,
|
||||
fileTree: [],
|
||||
fileExplorerExpanded: [],
|
||||
fileExplorerScrollPos: 0,
|
||||
executionQueue: [],
|
||||
activeTimeMs: 0,
|
||||
aiTabs: [defaultTab],
|
||||
activeTabId: defaultTab.id,
|
||||
closedTabHistory: [],
|
||||
filePreviewTabs: overrides.filePreviewTabs ?? [],
|
||||
activeFileTabId: overrides.activeFileTabId ?? null,
|
||||
unifiedTabOrder: overrides.unifiedTabOrder ?? [{ type: 'ai' as const, id: defaultTab.id }],
|
||||
unifiedClosedTabHistory: overrides.unifiedClosedTabHistory ?? [],
|
||||
...overrides,
|
||||
} as Session;
|
||||
};
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Test Wrapper Component
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
/**
|
||||
* A test component that exposes session context for testing.
|
||||
* This component simulates an app that manages multiple sessions.
|
||||
*/
|
||||
interface TestAppProps {
|
||||
initialSessions: Session[];
|
||||
initialActiveSessionId: string;
|
||||
onSessionChange?: (sessionId: string) => void;
|
||||
}
|
||||
|
||||
function TestApp({ initialSessions, initialActiveSessionId, onSessionChange }: TestAppProps) {
|
||||
const { sessions, setSessions, activeSessionId, setActiveSessionId, activeSession } = useSession();
|
||||
|
||||
// Initialize sessions on first render
|
||||
React.useEffect(() => {
|
||||
if (sessions.length === 0 && initialSessions.length > 0) {
|
||||
setSessions(initialSessions);
|
||||
setActiveSessionId(initialActiveSessionId);
|
||||
}
|
||||
}, [initialSessions, initialActiveSessionId, sessions.length, setSessions, setActiveSessionId]);
|
||||
|
||||
const handleSwitch = useCallback((id: string) => {
|
||||
setActiveSessionId(id);
|
||||
onSessionChange?.(id);
|
||||
}, [setActiveSessionId, onSessionChange]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div data-testid="active-session-id">{activeSessionId}</div>
|
||||
<div data-testid="active-session-name">{activeSession?.name ?? 'none'}</div>
|
||||
<div data-testid="file-tabs-count">{activeSession?.filePreviewTabs?.length ?? 0}</div>
|
||||
<div data-testid="active-file-tab-id">{activeSession?.activeFileTabId ?? 'none'}</div>
|
||||
{sessions.map(session => (
|
||||
<button
|
||||
key={session.id}
|
||||
data-testid={`switch-to-${session.id}`}
|
||||
onClick={() => handleSwitch(session.id)}
|
||||
>
|
||||
{session.name}
|
||||
</button>
|
||||
))}
|
||||
{activeSession?.filePreviewTabs?.map(tab => (
|
||||
<div key={tab.id} data-testid={`file-tab-${tab.id}`}>
|
||||
<span data-testid={`file-path-${tab.id}`}>{tab.path}</span>
|
||||
<span data-testid={`file-scroll-${tab.id}`}>{tab.scrollTop}</span>
|
||||
<span data-testid={`file-search-${tab.id}`}>{tab.searchQuery}</span>
|
||||
<span data-testid={`file-edit-${tab.id}`}>{tab.editMode ? 'editing' : 'viewing'}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function TestAppWrapper(props: TestAppProps) {
|
||||
return (
|
||||
<SessionProvider>
|
||||
<TestApp {...props} />
|
||||
</SessionProvider>
|
||||
);
|
||||
}
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Test Suite
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
describe('SessionContext - Session Switching with File Tabs', () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
describe('independent file tabs per session', () => {
|
||||
it('each session maintains its own file tabs', () => {
|
||||
const session1FileTab = makeFilePreviewTab({
|
||||
id: 's1-file',
|
||||
path: '/session1/app.ts',
|
||||
name: 'app',
|
||||
scrollTop: 100,
|
||||
});
|
||||
const session2FileTab = makeFilePreviewTab({
|
||||
id: 's2-file',
|
||||
path: '/session2/index.ts',
|
||||
name: 'index',
|
||||
scrollTop: 500,
|
||||
});
|
||||
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [session1FileTab],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [session2FileTab],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 is active - should see its file tabs
|
||||
expect(screen.getByTestId('active-session-id')).toHaveTextContent('session-1');
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('1');
|
||||
expect(screen.getByTestId('file-path-s1-file')).toHaveTextContent('/session1/app.ts');
|
||||
expect(screen.getByTestId('file-scroll-s1-file')).toHaveTextContent('100');
|
||||
});
|
||||
|
||||
it('session with no file tabs shows count of 0', () => {
|
||||
const session = makeSession({
|
||||
id: 'session-no-files',
|
||||
name: 'No Files Session',
|
||||
filePreviewTabs: [],
|
||||
activeFileTabId: null,
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session]} initialActiveSessionId="session-no-files" />);
|
||||
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('0');
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('none');
|
||||
});
|
||||
|
||||
it('session with multiple file tabs shows all tabs', () => {
|
||||
const tabs = [
|
||||
makeFilePreviewTab({ id: 'f1', path: '/src/a.ts' }),
|
||||
makeFilePreviewTab({ id: 'f2', path: '/src/b.ts' }),
|
||||
makeFilePreviewTab({ id: 'f3', path: '/src/c.ts' }),
|
||||
];
|
||||
|
||||
const session = makeSession({
|
||||
id: 'multi-tab-session',
|
||||
name: 'Multi Tab Session',
|
||||
filePreviewTabs: tabs,
|
||||
activeFileTabId: 'f2',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session]} initialActiveSessionId="multi-tab-session" />);
|
||||
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('3');
|
||||
expect(screen.getByTestId('file-path-f1')).toHaveTextContent('/src/a.ts');
|
||||
expect(screen.getByTestId('file-path-f2')).toHaveTextContent('/src/b.ts');
|
||||
expect(screen.getByTestId('file-path-f3')).toHaveTextContent('/src/c.ts');
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('f2');
|
||||
});
|
||||
});
|
||||
|
||||
describe('session switching updates file tabs', () => {
|
||||
it('switches to the new session file tabs when session is changed', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's1-file', path: '/s1/file.ts' })],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's2-file', path: '/s2/file.ts' })],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Verify initial state - session 1 active
|
||||
expect(screen.getByTestId('active-session-id')).toHaveTextContent('session-1');
|
||||
expect(screen.getByTestId('file-path-s1-file')).toHaveTextContent('/s1/file.ts');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
|
||||
// Verify session 2's file tabs are now showing
|
||||
expect(screen.getByTestId('active-session-id')).toHaveTextContent('session-2');
|
||||
expect(screen.queryByTestId('file-path-s1-file')).not.toBeInTheDocument();
|
||||
expect(screen.getByTestId('file-path-s2-file')).toHaveTextContent('/s2/file.ts');
|
||||
});
|
||||
|
||||
it('switching from session with files to session without files shows empty tabs', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-with-files',
|
||||
name: 'With Files',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 'f1', path: '/file.ts' })],
|
||||
activeFileTabId: 'f1',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-no-files',
|
||||
name: 'No Files',
|
||||
filePreviewTabs: [],
|
||||
activeFileTabId: null,
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-with-files" />);
|
||||
|
||||
// Session 1 has files
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('1');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-no-files').click();
|
||||
});
|
||||
|
||||
// Session 2 has no files
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('0');
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('none');
|
||||
});
|
||||
|
||||
it('switching from session without files to session with files shows files', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-no-files',
|
||||
name: 'No Files',
|
||||
filePreviewTabs: [],
|
||||
activeFileTabId: null,
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-with-files',
|
||||
name: 'With Files',
|
||||
filePreviewTabs: [
|
||||
makeFilePreviewTab({ id: 'f1', path: '/a.ts' }),
|
||||
makeFilePreviewTab({ id: 'f2', path: '/b.ts' }),
|
||||
],
|
||||
activeFileTabId: 'f1',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-no-files" />);
|
||||
|
||||
// Start with no files
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('0');
|
||||
|
||||
// Switch to session with files
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-with-files').click();
|
||||
});
|
||||
|
||||
// Now should see files
|
||||
expect(screen.getByTestId('file-tabs-count')).toHaveTextContent('2');
|
||||
expect(screen.getByTestId('file-path-f1')).toHaveTextContent('/a.ts');
|
||||
expect(screen.getByTestId('file-path-f2')).toHaveTextContent('/b.ts');
|
||||
});
|
||||
});
|
||||
|
||||
describe('switching back restores file tabs', () => {
|
||||
it('switching back to a session restores its file tabs correctly', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's1-file', path: '/s1/original.ts' })],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's2-file', path: '/s2/original.ts' })],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Start at session 1
|
||||
expect(screen.getByTestId('file-path-s1-file')).toHaveTextContent('/s1/original.ts');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
expect(screen.getByTestId('file-path-s2-file')).toHaveTextContent('/s2/original.ts');
|
||||
|
||||
// Switch back to session 1
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-1').click();
|
||||
});
|
||||
|
||||
// Session 1's file tabs are restored
|
||||
expect(screen.getByTestId('file-path-s1-file')).toHaveTextContent('/s1/original.ts');
|
||||
expect(screen.queryByTestId('file-path-s2-file')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('preserves scroll position per session when switching', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's1-file', scrollTop: 1500 })],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's2-file', scrollTop: 3000 })],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 scroll position
|
||||
expect(screen.getByTestId('file-scroll-s1-file')).toHaveTextContent('1500');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
expect(screen.getByTestId('file-scroll-s2-file')).toHaveTextContent('3000');
|
||||
|
||||
// Switch back to session 1
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-1').click();
|
||||
});
|
||||
|
||||
// Session 1's scroll position is preserved
|
||||
expect(screen.getByTestId('file-scroll-s1-file')).toHaveTextContent('1500');
|
||||
});
|
||||
|
||||
it('preserves search query per session when switching', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's1-file', searchQuery: 'handleClick' })],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's2-file', searchQuery: 'useState' })],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 search query
|
||||
expect(screen.getByTestId('file-search-s1-file')).toHaveTextContent('handleClick');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
expect(screen.getByTestId('file-search-s2-file')).toHaveTextContent('useState');
|
||||
|
||||
// Switch back to session 1
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-1').click();
|
||||
});
|
||||
|
||||
// Session 1's search query is preserved
|
||||
expect(screen.getByTestId('file-search-s1-file')).toHaveTextContent('handleClick');
|
||||
});
|
||||
|
||||
it('preserves edit mode per session when switching', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's1-file', editMode: true })],
|
||||
activeFileTabId: 's1-file',
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 's2-file', editMode: false })],
|
||||
activeFileTabId: 's2-file',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 edit mode
|
||||
expect(screen.getByTestId('file-edit-s1-file')).toHaveTextContent('editing');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
expect(screen.getByTestId('file-edit-s2-file')).toHaveTextContent('viewing');
|
||||
|
||||
// Switch back to session 1
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-1').click();
|
||||
});
|
||||
|
||||
// Session 1's edit mode is preserved
|
||||
expect(screen.getByTestId('file-edit-s1-file')).toHaveTextContent('editing');
|
||||
});
|
||||
});
|
||||
|
||||
describe('active file tab ID per session', () => {
|
||||
it('each session tracks its own active file tab', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1',
|
||||
filePreviewTabs: [
|
||||
makeFilePreviewTab({ id: 's1-f1' }),
|
||||
makeFilePreviewTab({ id: 's1-f2' }),
|
||||
],
|
||||
activeFileTabId: 's1-f2', // Second tab is active
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2',
|
||||
filePreviewTabs: [
|
||||
makeFilePreviewTab({ id: 's2-f1' }),
|
||||
makeFilePreviewTab({ id: 's2-f2' }),
|
||||
makeFilePreviewTab({ id: 's2-f3' }),
|
||||
],
|
||||
activeFileTabId: 's2-f1', // First tab is active
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 has second tab active
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('s1-f2');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
|
||||
// Session 2 has first tab active
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('s2-f1');
|
||||
|
||||
// Switch back to session 1
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-1').click();
|
||||
});
|
||||
|
||||
// Session 1 still has second tab active
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('s1-f2');
|
||||
});
|
||||
|
||||
it('session with AI tab active has null activeFileTabId', async () => {
|
||||
const session1 = makeSession({
|
||||
id: 'session-1',
|
||||
name: 'Session 1 - AI active',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 'f1' })],
|
||||
activeFileTabId: null, // AI tab is active, not file tab
|
||||
});
|
||||
const session2 = makeSession({
|
||||
id: 'session-2',
|
||||
name: 'Session 2 - File active',
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: 'f2' })],
|
||||
activeFileTabId: 'f2',
|
||||
});
|
||||
|
||||
render(<TestAppWrapper initialSessions={[session1, session2]} initialActiveSessionId="session-1" />);
|
||||
|
||||
// Session 1 has no active file tab (AI is active)
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('none');
|
||||
|
||||
// Switch to session 2
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-2').click();
|
||||
});
|
||||
|
||||
// Session 2 has file tab active
|
||||
expect(screen.getByTestId('active-file-tab-id')).toHaveTextContent('f2');
|
||||
});
|
||||
});
|
||||
|
||||
describe('rapid session switching', () => {
|
||||
it('handles rapid session switching without losing state', async () => {
|
||||
const sessions = Array.from({ length: 5 }, (_, i) =>
|
||||
makeSession({
|
||||
id: `session-${i}`,
|
||||
name: `Session ${i}`,
|
||||
filePreviewTabs: [makeFilePreviewTab({ id: `f${i}`, path: `/path/${i}.ts`, scrollTop: i * 100 })],
|
||||
activeFileTabId: `f${i}`,
|
||||
})
|
||||
);
|
||||
|
||||
render(<TestAppWrapper initialSessions={sessions} initialActiveSessionId="session-0" />);
|
||||
|
||||
// Rapid switching through all sessions
|
||||
for (let i = 1; i < 5; i++) {
|
||||
await act(async () => {
|
||||
screen.getByTestId(`switch-to-session-${i}`).click();
|
||||
});
|
||||
expect(screen.getByTestId('active-session-id')).toHaveTextContent(`session-${i}`);
|
||||
expect(screen.getByTestId(`file-scroll-f${i}`)).toHaveTextContent(String(i * 100));
|
||||
}
|
||||
|
||||
// Switch back to first session
|
||||
await act(async () => {
|
||||
screen.getByTestId('switch-to-session-0').click();
|
||||
});
|
||||
|
||||
// Original state preserved
|
||||
expect(screen.getByTestId('active-session-id')).toHaveTextContent('session-0');
|
||||
expect(screen.getByTestId('file-scroll-f0')).toHaveTextContent('0');
|
||||
});
|
||||
});
|
||||
|
||||
describe('hook usage', () => {
|
||||
it('throws error when used outside SessionProvider', () => {
|
||||
// Suppress console.error for this test
|
||||
const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
|
||||
|
||||
expect(() => {
|
||||
renderHook(() => useSession());
|
||||
}).toThrow('useSession must be used within a SessionProvider');
|
||||
|
||||
consoleSpy.mockRestore();
|
||||
});
|
||||
|
||||
it('provides stable setActiveSessionId callback', () => {
|
||||
const { result, rerender } = renderHook(() => useSession(), {
|
||||
wrapper: SessionProvider,
|
||||
});
|
||||
|
||||
const firstCallback = result.current.setActiveSessionId;
|
||||
|
||||
rerender();
|
||||
|
||||
// setActiveSessionId should be the same reference after rerender
|
||||
expect(result.current.setActiveSessionId).toBe(firstCallback);
|
||||
});
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user