Files
opsxshell/test/components/AppOverlay.test.tsx
T

38 lines
1.2 KiB
TypeScript

import { describe, expect, it } from 'vitest'
import { render, screen } from '@testing-library/react'
import AppOverlay from '../../src/components/common/AppOverlay'
describe('AppOverlay', () => {
it('does not leave a full-window layer in the DOM when closed', () => {
const { rerender } = render(
<AppOverlay open={false}>
<div>blocked</div>
</AppOverlay>
)
expect(document.querySelector('[data-app-overlay]')).toBeNull()
rerender(
<AppOverlay open className="z-[100]">
<div>panel</div>
</AppOverlay>
)
const overlay = document.querySelector('[data-app-overlay]')
expect(overlay).toBeTruthy()
expect(overlay).toHaveClass('app-overlay')
expect(screen.getByText('panel')).toBeVisible()
})
it('portals onto document.body so layout overflow cannot trap it', () => {
render(
<div id="trap" className="overflow-hidden">
<AppOverlay open>
<span>layer</span>
</AppOverlay>
</div>
)
const overlay = document.querySelector('[data-app-overlay]')
expect(overlay?.parentElement).toBe(document.body)
expect(document.getElementById('trap')?.contains(overlay)).toBe(false)
})
})