import { mount } from '@vue/test-utils'
import { describe, it, expect } from 'vitest'
import { h } from 'vue'
import { VApp } from 'vuetify/components'

import VikeBtn from '#components/VikeBtn.vue'

import LogoAvatar from './LogoAvatar.vue'
import TopMenu from './TopMenu.vue'

describe('FooterMenu', () => {
  const wrapper = mount(VApp, {
    slots: {
      default: h(TopMenu),
    },
  })

  it('renders three columns', () => {
    expect(wrapper.find('.v-row').exists()).toBeTruthy()
    expect(wrapper.findAll('.v-row > div')).toHaveLength(3)
  })

  it('first column contains logo', () => {
    expect(wrapper.findAll('.v-row > div')[0].findComponent(LogoAvatar)).toBeTruthy()
  })

  it('second column contains 3 children -> AnchorLink', () => {
    expect(wrapper.findAll('.v-row > div')[1].findAllComponents(VikeBtn)).toHaveLength(3)
  })

  it('third column is placeholdre', () => {
    expect(wrapper.findAll('.v-row > div')[2].findAll('div')).toHaveLength(0)
  })
})