File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import { fireEvent, render, screen } from '@testing-library/react'
import { describe, expect, it, vi } from 'vitest'
import Sidebar from './Sidebar'
describe('Sidebar', () => {
it('메뉴를 순서대로 보여준다', () => {
render(<Sidebar />)
const labels = [
'Dashboard',
'기관관리',
'채널생성',
'사업관리',
'권리확인',
'권리처리',
'자료실',
'Mattermost',
'시스템관리',
]
const items = screen.getAllByRole('listitem').map((li) => li.textContent)
expect(items).toEqual(labels)
})
it('activeKey에 해당하는 메뉴가 현재 페이지로 표시된다', () => {
render(<Sidebar activeKey="channels" />)
expect(screen.getByRole('link', { name: '채널생성' }))
.toHaveAttribute('aria-current', 'page')
expect(screen.getByRole('link', { name: '기관관리' }))
.not.toHaveAttribute('aria-current')
})
it('활성 메뉴를 누르면 onSelect가 호출된다', () => {
const onSelect = vi.fn()
render(<Sidebar activeKey="orgs" onSelect={onSelect} />)
fireEvent.click(screen.getByRole('link', { name: '채널생성' }))
expect(onSelect).toHaveBeenCalledWith('channels')
})
it('미구현 메뉴는 비활성으로 표시되고 링크가 아니다', () => {
render(<Sidebar />)
const dashboard = screen.getByText('Dashboard')
expect(dashboard).toHaveAttribute('aria-disabled', 'true')
expect(dashboard).toHaveAttribute('title', '준비 중')
expect(screen.queryByRole('link', { name: 'Dashboard' })).toBeNull()
})
it('브랜드 영역을 보여준다', () => {
render(<Sidebar />)
expect(screen.getByText('ITN-HUB')).toBeTruthy()
expect(screen.getByText('사업관리시스템')).toBeTruthy()
})
it('접힌 상태에서는 라벨이 사라지고 툴팁으로 남는다', () => {
render(<Sidebar collapsed onToggle={() => {}} />)
expect(screen.queryByText('기관관리')).toBeNull()
expect(screen.queryByText('ITN-HUB')).toBeNull()
expect(screen.getByText('IH')).toBeTruthy()
expect(screen.getByRole('link', { name: '기관관리' })).toHaveAttribute('title', '기관관리')
expect(screen.getByTitle('Dashboard (준비 중)')).toBeTruthy()
})
it('접기 버튼을 누르면 onToggle이 호출된다', () => {
const onToggle = vi.fn()
render(<Sidebar onToggle={onToggle} />)
fireEvent.click(screen.getByRole('button', { name: '메뉴 접기' }))
expect(onToggle).toHaveBeenCalled()
})
})