import { beforeEach, describe, expect, it } from 'vitest'
import { elementUpdated, fixture, html } from '@open-wc/testing-helpers'
import './UsAlert'
import type { UsAlert } from './UsAlert'

describe('UsAlert', () => {
  let usAlert: UsAlert

  const alertWrapper = () => {
    const wrapper = usAlert.shadowRoot?.querySelector('.alert-wrapper')
    return wrapper
  }

  beforeEach(async () => {
    usAlert = await fixture(html`<us-alert></us-alert>`)
  })

  it('should be defined', async () => {
    expect(usAlert).toBeDefined()
    expect(usAlert.tagName).toBe('US-ALERT')
  })

  it('should be correct initial properties', () => {
    expect(usAlert.variant).toBe('info')
    expect(usAlert.description).toBe('')
    expect(usAlert.link).toBe('')
    expect(usAlert.linkTitle).toBe('')
    expect(usAlert.linkIsDisabled).toBeFalsy()
    expect(usAlert.show).toBeFalsy()
  })

  it('should be certain class "info" depending on the data passed', async () => {
    usAlert.variant = 'info'
    usAlert.show = true

    await elementUpdated(usAlert)

    expect(alertWrapper().className).toContain(usAlert.variant)
  })

  it('should be certain class "success" depending on the data passed', async () => {
    usAlert.variant = 'success'
    usAlert.show = true

    await elementUpdated(usAlert)

    expect(alertWrapper().className).toContain(usAlert.variant)
  })

  it('should be certain class "warning" depending on the data passed', async () => {
    usAlert.variant = 'warning'
    usAlert.show = true

    await elementUpdated(usAlert)

    expect(alertWrapper().className).toContain(usAlert.variant)
  })

  it('should be certain class "danger" depending on the data passed', async () => {
    usAlert.variant = 'danger'
    usAlert.show = true

    await elementUpdated(usAlert)

    expect(alertWrapper().className).toContain(usAlert.variant)
  })

  it('should be change property "show" after change', async () => {
    usAlert.show = true

    await elementUpdated(usAlert)

    expect(usAlert.show).toBeTruthy()
  })
})