Files
landing-builder/components/BuilderClientPage.previewViewport.test.tsx
T
2025-11-14 16:40:45 +09:00

34 lines
1.0 KiB
TypeScript

import { render, screen, fireEvent } from '@testing-library/react'
import { NextIntlClientProvider } from 'next-intl'
import { describe, expect, test } from 'vitest'
import BuilderClientPage from './BuilderClientPage'
import messages from '../messages/en.json'
function Wrapper({ children }: { children: React.ReactNode }) {
return (
<NextIntlClientProvider messages={messages} locale="en">
{children}
</NextIntlClientProvider>
)
}
describe('BuilderClientPage - preview viewport toggle', () => {
test('toggles preview width between mobile and desktop', () => {
render(
<Wrapper>
<BuilderClientPage />
</Wrapper>
)
const container = screen.getByTestId('preview-container')
// default is desktop
expect(container).toHaveClass('w-[768px]')
fireEvent.click(screen.getByRole('button', { name: /Mobile/i }))
expect(container).toHaveClass('w-[375px]')
fireEvent.click(screen.getByRole('button', { name: /Desktop/i }))
expect(container).toHaveClass('w-[768px]')
})
})