import { render } from '@testing-library/react'
import { NextIntlClientProvider } from 'next-intl'
import { expect, test } from 'vitest'
import { axe, toHaveNoViolations } from 'jest-axe'
import FormBuilderPanel from './FormBuilderPanel'
import { createFormStore } from '@/lib/state/formStore'

expect.extend(toHaveNoViolations)
import messages from '../messages/en.json'

function Wrapper({ children }: { children: React.ReactNode }) {
  return (
    <NextIntlClientProvider messages={messages} locale="en">
      {children}
    </NextIntlClientProvider>
  )
}

test('FormBuilderPanel has no obvious a11y violations', async () => {
  const store = createFormStore()
  const { container } = render(
    <Wrapper>
      <FormBuilderPanel store={store} />
    </Wrapper>
  )
  const results = await axe(container)
  expect(results).toHaveNoViolations()
})