Files
landing-builder/components/BuilderClientPage.inspector.faqList.test.tsx
T

45 lines
1.8 KiB
TypeScript

import { describe, it, expect } from 'vitest'
import { render, screen, fireEvent } from '@testing-library/react'
import React from 'react'
import { NextIntlClientProvider } from 'next-intl'
import enMessages from '@/messages/en.json'
import BuilderClientPage from '@/components/BuilderClientPage'
const messages: Record<string, string> = enMessages as Record<string, string>
describe('BuilderClientPage - Inspector FAQ List UI', () => {
it('FAQ 항목을 추가/편집/삭제할 수 있다', () => {
render(
<NextIntlClientProvider locale="en" messages={messages}>
<BuilderClientPage />
</NextIntlClientProvider>
)
// FAQ 섹션 추가 및 선택
fireEvent.click(screen.getByTestId('btn-add-faq'))
fireEvent.click(screen.getByLabelText('Select 0'))
// Add FAQ Item 버튼 클릭 → 첫 항목 생성
fireEvent.click(screen.getByRole('button', { name: 'Add FAQ Item' }))
const q0 = screen.getByLabelText('FAQ Q 0') as HTMLInputElement
const a0 = screen.getByLabelText('FAQ A 0') as HTMLInputElement
fireEvent.change(q0, { target: { value: 'What is it?' } })
fireEvent.change(a0, { target: { value: 'A landing builder' } })
expect((screen.getByLabelText('FAQ Q 0') as HTMLInputElement).value).toBe('What is it?')
expect((screen.getByLabelText('FAQ A 0') as HTMLInputElement).value).toBe('A landing builder')
// 두 번째 항목 추가 후 삭제
fireEvent.click(screen.getByRole('button', { name: 'Add FAQ Item' }))
const q1 = screen.getByLabelText('FAQ Q 1') as HTMLInputElement
fireEvent.change(q1, { target: { value: 'How to export?' } })
fireEvent.click(screen.getByLabelText('Remove FAQ 1'))
// 삭제 후 첫 항목만 남음
expect(screen.queryByLabelText('FAQ Q 1')).toBeNull()
expect(screen.getByLabelText('FAQ Q 0')).toBeInTheDocument()
})
})