import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'
import OffensiveApproach from '~/components/Decisions/OffensiveApproach.vue'

// TODO: Fix form interaction and text rendering issues
describe.skip('OffensiveApproach', () => {
  const defaultProps = {
    gameId: 'test-game-123',
    isActive: true,
  }

  describe('Rendering', () => {
    it('renders all approach options', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      expect(wrapper.text()).toContain('Normal')
      expect(wrapper.text()).toContain('Contact')
      expect(wrapper.text()).toContain('Power')
      expect(wrapper.text()).toContain('Patient')
    })

    it('renders special tactics section', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      expect(wrapper.text()).toContain('Hit and Run')
      expect(wrapper.text()).toContain('Bunt Attempt')
    })
  })

  describe('Approach Selection', () => {
    it('selects normal approach by default', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      expect(wrapper.vm.localDecision.approach).toBe('normal')
    })

    it('uses provided currentDecision approach', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'power',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      expect(wrapper.vm.localDecision.approach).toBe('power')
    })

    it('changes approach when button clicked', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      wrapper.vm.selectApproach('contact')
      await wrapper.vm.$nextTick()

      expect(wrapper.vm.localDecision.approach).toBe('contact')
    })

    it('does not change approach when not active', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          isActive: false,
        },
      })

      const originalApproach = wrapper.vm.localDecision.approach
      wrapper.vm.selectApproach('power')

      expect(wrapper.vm.localDecision.approach).toBe(originalApproach)
    })
  })

  describe('Hit and Run', () => {
    it('is disabled when no runners on base', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          hasRunnersOnBase: false,
        },
      })

      expect(wrapper.vm.canUseHitAndRun).toBe(false)
    })

    it('is enabled when runners on base', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          hasRunnersOnBase: true,
        },
      })

      expect(wrapper.vm.canUseHitAndRun).toBe(true)
    })

    it('clears hit and run when runners removed', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          hasRunnersOnBase: true,
        },
      })

      wrapper.vm.localDecision.hit_and_run = true
      await wrapper.vm.$nextTick()

      await wrapper.setProps({ hasRunnersOnBase: false })

      expect(wrapper.vm.localDecision.hit_and_run).toBe(false)
    })
  })

  describe('Change Detection', () => {
    it('detects approach changes', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'normal',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      expect(wrapper.vm.hasChanges).toBe(false)

      wrapper.vm.localDecision.approach = 'power'
      expect(wrapper.vm.hasChanges).toBe(true)
    })

    it('detects hit and run changes', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'normal',
            hit_and_run: false,
            bunt_attempt: false,
          },
          hasRunnersOnBase: true,
        },
      })

      expect(wrapper.vm.hasChanges).toBe(false)

      wrapper.vm.localDecision.hit_and_run = true
      expect(wrapper.vm.hasChanges).toBe(true)
    })

    it('detects bunt attempt changes', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'normal',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      expect(wrapper.vm.hasChanges).toBe(false)

      wrapper.vm.localDecision.bunt_attempt = true
      expect(wrapper.vm.hasChanges).toBe(true)
    })
  })

  describe('Form Submission', () => {
    it('emits submit with decision', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      wrapper.vm.localDecision = {
        approach: 'power',
        hit_and_run: false,
        bunt_attempt: true,
      }

      await wrapper.find('form').trigger('submit.prevent')

      expect(wrapper.emitted('submit')).toBeTruthy()
      const emitted = wrapper.emitted('submit')![0][0]
      expect(emitted).toEqual({
        approach: 'power',
        hit_and_run: false,
        bunt_attempt: true,
      })
    })

    it('does not submit when not active', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          isActive: false,
        },
      })

      await wrapper.find('form').trigger('submit.prevent')
      expect(wrapper.emitted('submit')).toBeFalsy()
    })

    it('does not submit when no changes', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'normal',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      await wrapper.find('form').trigger('submit.prevent')
      expect(wrapper.emitted('submit')).toBeFalsy()
    })
  })

  describe('Display Text', () => {
    it('shows current approach label', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'contact',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      expect(wrapper.vm.currentApproachLabel).toBe('Contact')
    })

    it('shows active tactics', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      wrapper.vm.localDecision.hit_and_run = true
      wrapper.vm.localDecision.bunt_attempt = true

      expect(wrapper.vm.activeTactics).toBe('Hit & Run, Bunt')
    })

    it('shows None when no tactics active', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      expect(wrapper.vm.activeTactics).toBe('None')
    })
  })

  describe('Submit Button Text', () => {
    it('shows wait message when not active', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          isActive: false,
        },
      })

      expect(wrapper.vm.submitButtonText).toBe('Wait for Your Turn')
    })

    it('shows no changes message', () => {
      const wrapper = mount(OffensiveApproach, {
        props: {
          ...defaultProps,
          currentDecision: {
            approach: 'normal',
            hit_and_run: false,
            bunt_attempt: false,
          },
        },
      })

      expect(wrapper.vm.submitButtonText).toBe('No Changes')
    })

    it('shows submit message when active with changes', () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      wrapper.vm.localDecision.approach = 'power'
      expect(wrapper.vm.submitButtonText).toBe('Submit Offensive Strategy')
    })
  })

  describe('Prop Updates', () => {
    it('updates local state when currentDecision changes', async () => {
      const wrapper = mount(OffensiveApproach, {
        props: defaultProps,
      })

      await wrapper.setProps({
        currentDecision: {
          approach: 'patient',
          hit_and_run: true,
          bunt_attempt: true,
        },
      })

      expect(wrapper.vm.localDecision.approach).toBe('patient')
      expect(wrapper.vm.localDecision.hit_and_run).toBe(true)
      expect(wrapper.vm.localDecision.bunt_attempt).toBe(true)
    })
  })
})