Files
inkling/tests/unit/NotebookList.test.tsx
th-kim0823 7b3450d0d5 feat(ui): Sidebar + NotebookList + NotebookCreateModal stub
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-15 10:47:07 +09:00

45 lines
2.0 KiB
TypeScript

// @vitest-environment jsdom
import { describe, it, expect, vi, beforeEach } from 'vitest';
import '@testing-library/jest-dom/vitest';
import { render, screen, fireEvent, cleanup } from '@testing-library/react';
import { NotebookList } from '../../src/renderer/inbox/components/NotebookList';
const notebooks = [
{ id: 'nb-1', name: '기본', color: null, createdAt: 't', updatedAt: 't', noteCount: 3 },
{ id: 'nb-2', name: '회사', color: '#0a4b80', createdAt: 't', updatedAt: 't', noteCount: 7 }
];
describe('NotebookList', () => {
beforeEach(cleanup);
it('노트북 이름 + count 렌더링', () => {
render(<NotebookList notebooks={notebooks} selectedId="nb-1" onSelect={() => {}} onCreate={() => {}} />);
expect(screen.getByText('기본')).toBeInTheDocument();
expect(screen.getByText('3')).toBeInTheDocument();
expect(screen.getByText('회사')).toBeInTheDocument();
expect(screen.getByText('7')).toBeInTheDocument();
});
it('클릭 시 onSelect 호출', () => {
const onSelect = vi.fn();
render(<NotebookList notebooks={notebooks} selectedId="nb-1" onSelect={onSelect} onCreate={() => {}} />);
fireEvent.click(screen.getByText('회사'));
expect(onSelect).toHaveBeenCalledWith('nb-2');
});
it('+ 새 노트북 클릭 시 onCreate 호출', () => {
const onCreate = vi.fn();
render(<NotebookList notebooks={notebooks} selectedId="nb-1" onSelect={() => {}} onCreate={onCreate} />);
fireEvent.click(screen.getByRole('button', { name: /새 노트북/ }));
expect(onCreate).toHaveBeenCalled();
});
it('selected notebook 의 background 가 다름', () => {
render(<NotebookList notebooks={notebooks} selectedId="nb-1" onSelect={() => {}} onCreate={() => {}} />);
const btn1 = screen.getByText('기본').closest('button')!;
const btn2 = screen.getByText('회사').closest('button')!;
expect(btn1.style.background).not.toBe('transparent');
expect(btn2.style.background).toBe('transparent');
});
});