63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
|
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
||
|
|
import { render, screen } from '@testing-library/react'
|
||
|
|
import { SidebarNav } from './SidebarNav'
|
||
|
|
import type { NavItem } from '../model/types'
|
||
|
|
|
||
|
|
const ITEMS: NavItem[] = [
|
||
|
|
{ id: 'bio', label: 'Bio', number: '01' },
|
||
|
|
{ id: 'work', label: 'Work', number: '02' },
|
||
|
|
]
|
||
|
|
|
||
|
|
beforeEach(() => {
|
||
|
|
global.IntersectionObserver = vi.fn(function () {
|
||
|
|
return {
|
||
|
|
observe: vi.fn(),
|
||
|
|
disconnect: vi.fn(),
|
||
|
|
unobserve: vi.fn(),
|
||
|
|
}
|
||
|
|
}) as unknown as typeof IntersectionObserver
|
||
|
|
})
|
||
|
|
|
||
|
|
describe('SidebarNav', () => {
|
||
|
|
describe('rendering', () => {
|
||
|
|
it('renders a nav element', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByRole('navigation')).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders "Index" heading', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByText('Index')).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders "Digital Monograph" subtitle', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByText('Digital Monograph')).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders each item label and number', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByText('Bio')).toBeInTheDocument()
|
||
|
|
expect(screen.getByText('01')).toBeInTheDocument()
|
||
|
|
expect(screen.getByText('Work')).toBeInTheDocument()
|
||
|
|
expect(screen.getByText('02')).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders "Quick Links" section', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByText('Quick Links')).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders Email quick link', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
expect(screen.getByRole('link', { name: 'Email' })).toBeInTheDocument()
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders a button for each item', () => {
|
||
|
|
render(<SidebarNav items={ITEMS} />)
|
||
|
|
const buttons = screen.getAllByRole('button')
|
||
|
|
expect(buttons.length).toBeGreaterThanOrEqual(ITEMS.length)
|
||
|
|
})
|
||
|
|
})
|
||
|
|
})
|