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

describe('components/Stepper', () => {
    it('未传 initial 时渲染默认值 0', () => {
        const wrapper = mount(Stepper)

        expect(wrapper.get('[data-cy="decrement"]').exists()).toBe(true)
        expect(wrapper.get('[data-cy="increment"]').exists()).toBe(true)
        expect(wrapper.get('[data-cy="counter"]').text()).toBe('0')
    })

    it('传入 initial 后渲染对应初始值', () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: 5
            }
        })

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('5')
    })

    it('initial 为 0 时保持显式初始值 0', () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: 0
            }
        })

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('0')
    })

    it('支持负数初始值并继续递减', async () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: -2
            }
        })

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('-2')

        await wrapper.get('[data-cy="decrement"]').trigger('click')

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('-3')
        expect(wrapper.emitted('change')).toEqual([[-3]])
    })

    it('点击加号后递增并触发 change 事件', async () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: 0
            }
        })

        await wrapper.get('[data-cy="increment"]').trigger('click')

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('1')
        expect(wrapper.emitted('change')).toEqual([[1]])
    })

    it('点击减号后递减并触发 change 事件', async () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: 0
            }
        })

        await wrapper.get('[data-cy="decrement"]').trigger('click')

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('-1')
        expect(wrapper.emitted('change')).toEqual([[-1]])
    })

    it('连续交互时保持最新计数并按顺序派发 change 值', async () => {
        const wrapper = mount(Stepper, {
            props: {
                initial: 1
            }
        })

        await wrapper.get('[data-cy="increment"]').trigger('click')
        await wrapper.get('[data-cy="increment"]').trigger('click')
        await wrapper.get('[data-cy="decrement"]').trigger('click')

        expect(wrapper.get('[data-cy="counter"]').text()).toBe('2')
        expect(wrapper.emitted('change')).toEqual([[2], [3], [2]])
    })
})