// @vitest-environment jsdom
//
// Root layout — renders a language switcher in the header, then its children
// (no /
/, which the framework shell owns). We assert the
// children render, the is present, and no document element is
// introduced. The layout uses + useLocale/useT, so we wrap the
// render in the real (the framework auto-wires it in the app).
import { afterEach, describe, expect, test } from 'vitest'
import { act, createElement, type ReactNode } from 'react'
import { createRoot, type Root } from 'react-dom/client'
import { I18nProvider } from '@voltro/i18n'
import enCatalog from '../locales/en'
import Layout from './layout'
;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true
let container: HTMLDivElement
let root: Root
const render = (node: ReactNode): void => {
container = document.createElement('div')
document.body.appendChild(container)
act(() => {
root = createRoot(container)
root.render(
createElement(I18nProvider, { locale: 'en', messages: enCatalog, defaultLocale: 'en', children: node }),
)
})
}
afterEach(() => {
if (root) act(() => root.unmount())
container?.remove()
document.body.innerHTML = ''
})
describe('layout — render', () => {
test('renders its children and the language switcher', () => {
render(
createElement(Layout, { children: createElement('span', { 'data-testid': 'child' }, 'hi') }),
)
const child = container.querySelector('[data-testid="child"]')
expect(child).toBeTruthy()
expect(child!.textContent).toBe('hi')
expect(container.querySelector('select[aria-label]')).toBeTruthy()
})
test('does not introduce a document element (html/head/body)', () => {
render(createElement(Layout, { children: createElement('p', {}, 'body content') }))
expect(container.querySelector('html, head, body')).toBeNull()
})
})