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

describe('BaseToggle', () => {
  it('uses ariaLabel for the switch name without changing the visual label', () => {
    const wrapper = mount(BaseToggle, {
      props: {
        label: 'Enabled',
        ariaLabel: 'Email notifications',
      },
    })

    expect({
      accessibleName: wrapper.get('[role="switch"]').attributes('aria-label'),
      visualText: wrapper.text(),
      wrapperAriaLabel: wrapper.attributes('aria-label'),
    }).toEqual({
      accessibleName: 'Email notifications',
      visualText: 'Enabled',
      wrapperAriaLabel: undefined,
    })
  })

  it('keeps using the visual label as the default switch name', () => {
    const wrapper = mount(BaseToggle, {
      props: {
        label: 'Enabled',
      },
    })

    expect(wrapper.get('[role="switch"]').attributes('aria-label')).toBe('Enabled')
  })

  it('keeps the existing fallback name when no labels are provided', () => {
    const wrapper = mount(BaseToggle)

    expect(wrapper.get('[role="switch"]').attributes('aria-label')).toBe('Toggle')
  })

  it('should keep the knob class list state-free when switched on', () => {
    // The on position comes from the track modifier (translateX), not a knob class.
    const wrapper = mount(BaseToggle, { props: { modelValue: true } })

    expect(wrapper.get('.mint-toggle__knob').classes()).toEqual(['mint-toggle__knob', 'mint-toggle__knob--md'])
  })
})