import { html } from 'lit'
import { fixture, expect } from '@open-wc/testing'
import { OxPropertyPanel } from '../src/ox-property-panel.js'
import '../src/ox-property-panel.js'

describe('OxPropertyPanel', () => {
  it('has a default header "Hey there" and counter 5', async () => {
    const el = await fixture<OxPropertyPanel>(html`<ox-property-panel></ox-property-panel>`)

    // expect(el.header).to.equal('Hey there')
    // expect(el.counter).to.equal(5)
  })

  it('increases the counter on button click', async () => {
    const el = await fixture<OxPropertyPanel>(html`<ox-property-panel></ox-property-panel>`)
    el.shadowRoot!.querySelector('button')!.click()

    // expect(el.counter).to.equal(6)
  })

  it('can override the header via attribute', async () => {
    const el = await fixture<OxPropertyPanel>(html`<ox-property-panel header="attribute header"></ox-property-panel>`)

    // expect(el.header).to.equal('attribute header')
  })

  it('passes the a11y audit', async () => {
    const el = await fixture<OxPropertyPanel>(html`<ox-property-panel></ox-property-panel>`)

    await expect(el).shadowDom.to.be.accessible()
  })
})