import { describe, it, expect, vi, beforeEach } from 'vitest'
import { mount } from '@vue/test-utils'
import UserAvatar from '../UserAvatar.vue'

const useGravatarUrlMock = vi.fn(() => 'https://gravatar.example/avatar')
vi.stubGlobal('useGravatarUrl', useGravatarUrlMock)

describe('UserAvatar', () => {
  beforeEach(() => {
    useGravatarUrlMock.mockReturnValue('https://gravatar.example/avatar')
  })

  it('renders fallback initial when no email', () => {
    const wrapper = mount(UserAvatar, {
      props: { username: 'alice' },
      global: {
        stubs: { useGravatarUrl: false },
      },
    })
    const fallback = wrapper.find('.bg-primary')
    expect(fallback.exists()).toBe(true)
    expect(fallback.text()).toBe('A')
  })

  it('renders fallback initial for username', () => {
    const wrapper = mount(UserAvatar, {
      props: { username: 'bob' },
    })
    expect(wrapper.find('.bg-primary').text()).toBe('B')
  })

  it('uses size for style', () => {
    const wrapper = mount(UserAvatar, {
      props: { username: 'x', size: 40 },
    })
    const div = wrapper.find('.rounded-full')
    expect(div.attributes('style')).toContain('width: 40px')
    expect(div.attributes('style')).toContain('height: 40px')
  })
})