91bf98f1a2
v027 plan Task 7. zustand store 의 showSettings 를 사용하는 첫 컴포넌트. 4 섹션 (AI 제공자/자동 실행/백업·복원/정보) placeholder 와 헤더 + 돌아가기 버튼만. 실 콘텐츠는 후속 Task 8-11 에서 채움. 테스트 인프라 동시 추가 (v027 의 첫 React 컴포넌트 테스트): - @testing-library/react + @testing-library/jest-dom + jsdom devDep 추가 - vitest.config: plugin-react 적용, include 에 .test.tsx 포함 - 환경 분리는 per-file `// @vitest-environment jsdom` directive 로 처리 (vitest 4.x 에서 environmentMatchGlobs 미지원 — 기존 .ts 단위 테스트는 node env 유지)
38 lines
1.5 KiB
TypeScript
38 lines
1.5 KiB
TypeScript
// @vitest-environment jsdom
|
|
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
|
import '@testing-library/jest-dom/vitest';
|
|
import { render, screen, fireEvent, cleanup } from '@testing-library/react';
|
|
|
|
// inboxApi 는 window.inkling.inbox 를 참조하므로 jsdom 환경에서 import 자체가 throw.
|
|
// 다른 inbox store 단위 테스트와 동일한 패턴으로 빈 mock 을 주입한다.
|
|
vi.mock('../../src/renderer/inbox/api.js', () => ({ inboxApi: {} }));
|
|
|
|
import { SettingsPage } from '../../src/renderer/inbox/components/SettingsPage';
|
|
import { useInbox } from '../../src/renderer/inbox/store';
|
|
|
|
describe('SettingsPage', () => {
|
|
beforeEach(() => {
|
|
cleanup();
|
|
useInbox.setState({ showSettings: true });
|
|
});
|
|
|
|
it('renders header with "← 돌아가기" button', () => {
|
|
render(<SettingsPage />);
|
|
expect(screen.getByRole('button', { name: /돌아가기/ })).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders 4 section headings', () => {
|
|
render(<SettingsPage />);
|
|
expect(screen.getByText('AI 제공자')).toBeInTheDocument();
|
|
expect(screen.getByText('자동 실행')).toBeInTheDocument();
|
|
expect(screen.getByText('백업 / 복원')).toBeInTheDocument();
|
|
expect(screen.getByText('정보')).toBeInTheDocument();
|
|
});
|
|
|
|
it('clicking "← 돌아가기" sets showSettings to false', () => {
|
|
render(<SettingsPage />);
|
|
fireEvent.click(screen.getByRole('button', { name: /돌아가기/ }));
|
|
expect(useInbox.getState().showSettings).toBe(false);
|
|
});
|
|
});
|