import { describe, it, vi } from 'vitest'
import { elementUpdated, fixture } from '@open-wc/testing-helpers'

import { redispatchEvent } from './redispatchEvent'

describe('redispatchEvent()', () => {
  it('should return true when event and value is new or changed', async () => {
    const element = await fixture('<input placeholder="Type text">')
    const event = new CustomEvent('input', {
      bubbles: true,
      composed: true,
      detail: { myProp: true },
    })
    const result = redispatchEvent(element, event)

    expect(result).toBeTruthy()
  })

  it('should be called', async () => {
    const element = await fixture('<input placeholder="Type text">')
    const event = new CustomEvent('input', {
      bubbles: true,
      composed: true,
      detail: { myProp: true },
    })
    const testRedispatchEvent = vi.fn(() => {
      redispatchEvent(element, event)
    })
    const wrapper = {
      runRedispatch() {
        testRedispatchEvent()
      },
    }

    wrapper.runRedispatch()

    expect(testRedispatchEvent).toHaveBeenCalled()
  })

  it('should return true when update value in select tag', async () => {
    const newValue = 'value3'
    const element = await fixture(`
        <select name="select">
            <option value="value1">value</option>
            <option value="value2" selected>value</option>
            <option value="value3">value</option>
        </select>`)
    const event = new CustomEvent('change', {
      bubbles: true,
      composed: true,
      detail: newValue,
    })
    element.value = newValue

    await elementUpdated(element)

    const result = redispatchEvent(element, event)

    expect(element.value).toBe(newValue)
    expect(result).toBeTruthy()
  })

  it('should be called twice when user click on button', async () => {
    const element = await fixture('<button></button>')
    const event = new CustomEvent('testEvent', {
      bubbles: true,
      composed: true,
    })
    const testRedispatchEvent = vi.fn(() => {
      redispatchEvent(element, event)
    })
    const wrapper = {
      runRedispatch() {
        testRedispatchEvent()
      },
    }
    const countOfCalls = 2

    element.addEventListener('click', () => {
      wrapper.runRedispatch()
    })
    for (let i = 0; i < countOfCalls; i++)
      element.click()

    expect(testRedispatchEvent).toHaveBeenCalledTimes(2)
  })
})