import { it, describe, expect } from 'vitest'
import { shallowMount } from '@vue/test-utils'
import ImportedSection from '../../../../components/upload/ImportedSection.vue'
import i18n from '../../config'

describe('Template', () => {
  describe('Props', () => {
    it('should have default props', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        }
      })
      expect(wrapper.vm.index).toBe(0)
      expect(wrapper.vm.sequence).toStrictEqual({})
      expect(wrapper.vm.picturesCount).toBe(null)
      expect(wrapper.vm.uploadErrors).toStrictEqual([])
      expect(wrapper.vm.uploadPictures).toStrictEqual([])
    })
  })
  describe('When the index is 0', () => {
    it('should have a specific class and wordings', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        },
        props: {
          index: 0
        }
      })
      expect(wrapper.html()).contains(
        'class="information-section first-sequence"'
      )
      expect(wrapper.html()).contains('Dernier impor')
    })
  })
  describe('When the sequence have pictures', () => {
    it('should have a title', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        },
        props: {
          sequence: {
            id: 'id132435',
            title: 'my title',
            pictureCount: 3,
            pictures: [{ id: 'id' }]
          }
        }
      })
      expect(wrapper.html()).contains('class="uploaded-title"')
      expect(wrapper.html()).contains('Imports my title - 1/3')
    })
    it('should have a Link', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        },
        props: {
          sequence: {
            id: 'id132435',
            title: 'my title',
            pictureCount: 3,
            pictures: [{ id: 'id' }]
          }
        }
      })
      expect(wrapper.html()).contains('<link-stub')
      expect(wrapper.html()).contains('text="Voir la sequence"')
    })
  })
  describe('When there are uploaded pictures', () => {
    it('should have a list of pictures', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        },
        props: {
          uploadPictures: [{ name: 'my name1' }, { name: 'my name2' }]
        }
      })
      expect(wrapper.html()).contains('name="my name1"')
      expect(wrapper.html()).contains('name="my name2"')
      expect(wrapper.html()).contains('text=" Image téléchargée"')
      expect(wrapper.html()).contains('look="success"')
      expect(wrapper.html()).contains('<picture-item-stub')
    })
  })
  describe('When there are uploaded errors', () => {
    it('should have a list of errors', () => {
      const wrapper = shallowMount(ImportedSection, {
        global: {
          plugins: [i18n]
        },
        props: {
          uploadErrors: [
            { name: 'my name1', message: 'my message1' },
            { name: 'my name2', message: 'my message2' }
          ]
        }
      })
      expect(wrapper.html()).contains('name="my name1"')
      expect(wrapper.html()).contains('name="my name2"')
      expect(wrapper.html()).contains('text="my message1"')
      expect(wrapper.html()).contains('text="my message2"')
      expect(wrapper.html()).contains('look="error"')
      expect(wrapper.html()).contains('<picture-item-stub')
    })
  })
})
