mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-11-12 23:31:02 +00:00
elmocito
30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
import { fireEvent, render, screen } from '@testing-library/react'
|
|
import { describe, expect, it, vi } from 'vitest'
|
|
import DetailShell from './DetailShell'
|
|
|
|
describe('DetailShell', () => {
|
|
it('centers between planner panels and owns header, scrolling, footer and close behavior', () => {
|
|
const onClose = vi.fn()
|
|
const { container } = render(
|
|
<DetailShell
|
|
header={<h2>Detail title</h2>}
|
|
footer={<button type="button">Action</button>}
|
|
onClose={onClose}
|
|
closeLabel="Close"
|
|
leftWidth={240}
|
|
rightWidth={320}
|
|
testId="detail-scroll"
|
|
>
|
|
<p>Detail content</p>
|
|
</DetailShell>,
|
|
)
|
|
|
|
const shell = container.firstElementChild as HTMLElement
|
|
expect(shell.style.left).toBe('calc(240px + 0.5 * (100% - 240px - 320px))')
|
|
expect(screen.getByTestId('detail-scroll')).toHaveTextContent('Detail content')
|
|
expect(screen.getByRole('button', { name: 'Action' })).toBeInTheDocument()
|
|
fireEvent.click(screen.getByRole('button', { name: 'Close' }))
|
|
expect(onClose).toHaveBeenCalledOnce()
|
|
})
|
|
})
|