import {mount} from "@vue/test-utils"
import {describe,expect,test} from "vitest"
import Avatar from "../avatar.vue"

const SRC="https://picsum.photos/id/64/300"

import { h } from 'vue'

describe("Avatar.vue",()=>{
  test("render test",()=>{
    const wrapper=mount(Avatar)

    expect(wrapper.find(".haloe-avatar").exists()).toBe(true)
  })

  test("size is number",()=>{
    const wrapper=mount(Avatar,{
      props:{
        size:100
      }
    })

    expect(wrapper.attributes("style")).toContain("width: 100px")
  })

  test("size is string",()=>{
    const wrapper=mount(Avatar,{
      props:{
        size:'large'
      }
    })
    expect(wrapper.classes()).toContain("haloe-avatar-large")
  })

  test("shape ",()=>{
    const wrapper=mount(Avatar,{
      props:{
        shape:"square"
      }
    })

    expect(wrapper.classes()).toContain("haloe-avatar-square")
  })

  test("icon",()=>{
    const wrapper=mount(Avatar,{
      props:{
        icon:"usergroup"
      }
    })

    expect(wrapper.classes()).toContain("haloe-avatar-icon")
  })

  test("src",()=>{
    const wrapper=mount(Avatar,{
      props:{
        src:SRC
      }
    })
    expect(wrapper.find("img").attributes("src")).toBe(SRC)
    // console.log(wrapper.find("img").attributes('src'))
  })

  test("error callback",async ()=>{
    const wrapper=mount(Avatar,{
      props:{
        src:"xxxx"
      }
    })
    const img=wrapper.find('img')
    expect(img.exists()).toBe(true)
    await img.trigger('error')
    expect(wrapper.emitted("on-error")).toBeDefined()
  })

  test("default slot",()=>{
    const wrapper=mount(()=>{
      return h(Avatar,"default slot")
    })

    expect(wrapper.find(".haloe-avatar-string").text()).toEqual("default slot")
  })
})