import { describe, it, expect, vi } from 'vitest'
import { mount } from '@vue/test-utils'
import EntityEditForm from '../EntityEditForm.vue'

vi.mock('vue-router', () => ({
  useRouter: vi.fn(() => ({
    push: vi.fn(),
    back: vi.fn(),
  })),
}))

describe('EntityEditForm', () => {
  it('keeps Create disabled when required number field is empty', async () => {
    const wrapper = mount(EntityEditForm, {
      props: {
        entityLabel: 'Child',
        fields: [
          { name: 'name', label: 'Name', type: 'text', required: true },
          { name: 'age', label: 'Age', type: 'number', required: true, min: 0, max: 120 },
        ],
        initialData: {
          name: '',
          age: null,
        },
        isEdit: false,
        loading: false,
        requireDirty: false,
      },
    })

    const nameInput = wrapper.find('#name')
    const ageInput = wrapper.find('#age')

    await nameInput.setValue('Sam')
    await ageInput.setValue('')

    const submitButton = wrapper.find('button[type="submit"]')
    expect(submitButton.text()).toBe('Create')
    expect((submitButton.element as HTMLButtonElement).disabled).toBe(true)
  })

  it('enables Create when required Name and Age are both valid', async () => {
    const wrapper = mount(EntityEditForm, {
      props: {
        entityLabel: 'Child',
        fields: [
          { name: 'name', label: 'Name', type: 'text', required: true },
          { name: 'age', label: 'Age', type: 'number', required: true, min: 0, max: 120 },
        ],
        initialData: {
          name: '',
          age: null,
        },
        isEdit: false,
        loading: false,
        requireDirty: false,
      },
    })

    const nameInput = wrapper.find('#name')
    const ageInput = wrapper.find('#age')

    await nameInput.setValue('Sam')
    await ageInput.setValue('8')

    const submitButton = wrapper.find('button[type="submit"]')
    expect(submitButton.text()).toBe('Create')
    expect((submitButton.element as HTMLButtonElement).disabled).toBe(false)
  })
})
