import { mount } from '@vue/test-utils'
import Previewer from '@/components/common/Previewer'
import * as emitter from '@/js/event'
import * as mockedSkinview3d from '../../__mocks__/skinview3d'

test('initialize skinview3d', () => {
  const stub = jest.fn()
  emitter.on('skinViewerMounted', stub)

  const wrapper = mount(Previewer)
  expect(wrapper.vm.viewer).toBeInstanceOf(mockedSkinview3d.SkinViewer)
  expect(wrapper.vm.viewer.camera.position.z).toBe(70)
  expect(stub).toBeCalledWith(expect.any(HTMLElement))
})
test('dispose viewer before destroy', () => {
  const wrapper = mount(Previewer)
  wrapper.destroy()
  expect(wrapper.vm.viewer.disposed).toBeTrue()
})
test('skin URL should be updated', () => {
  const wrapper = mount(Previewer)
  wrapper.setProps({ skin: 'abc' })
  expect(wrapper.vm.viewer.skinUrl).toBe('abc')
})
test('cape URL should be updated', () => {
  const wrapper = mount(Previewer)
  wrapper.setProps({ cape: 'abc' })
  expect(wrapper.vm.viewer.capeUrl).toBe('abc')
})
test('`footer` slot', () => {
  const wrapper = mount(Previewer, {
    slots: {
      footer: '<div id="footer" />',
    },
  })
  expect(wrapper.find('#footer').exists()).toBeTrue()
})
test('disable closet mode', () => {
  const wrapper = mount(Previewer)
  expect(wrapper.find('.badge').text()).toBe('')
})
test('enable closet mode', () => {
  const wrapper = mount(Previewer, {
    propsData: {
      closetMode: true,
    },
  })
  expect(wrapper.find('.badge').text()).toBe('')

  wrapper.setProps({ skin: 'abc' })
  expect(wrapper.find('.badge').text()).toBe('general.skin')

  wrapper.setProps({ cape: 'abc', skin: '' })
  expect(wrapper.find('.badge').text()).toBe('general.cape')

  wrapper.setProps({ skin: 'abc', cape: 'abc' })
  expect(wrapper.find('.badge').text()).toBe('general.skin & general.cape')
})
test('toggle pause', () => {
  const wrapper = mount(Previewer)
  const pauseButton = wrapper.find('.fa-pause')
  expect(pauseButton.exists()).toBeTrue()
  pauseButton.trigger('click')
  expect(wrapper.find('.fa-play').exists()).toBeTrue()
  expect(wrapper.find('.fa-pause').exists()).toBeFalse()
})
test('toggle run', () => {
  const wrapper = mount(Previewer)
  wrapper.find('.fa-forward').trigger('click')
  expect(wrapper.vm.handles.run.paused).toBeFalse()
  expect(wrapper.vm.handles.walk.paused).toBeTrue()
})
test('toggle rotate', () => {
  const wrapper = mount(Previewer)
  wrapper.find('.fa-redo-alt').trigger('click')
  expect(wrapper.vm.handles.rotate.paused).toBeTrue()
})
test('reset', () => {
  mockedSkinview3d.SkinViewer.prototype.dispose = jest.fn(function () {
    this.disposed = true
  }.bind(mockedSkinview3d.SkinViewer))
  const wrapper = mount(Previewer)
  wrapper.find('.fa-stop').trigger('click')
  expect(mockedSkinview3d.SkinViewer.prototype.dispose).toBeCalled()
})
test('custom title', () => {
  const wrapper = mount(Previewer, { propsData: { title: 'custom-title' } })
  expect(wrapper.text()).toContain('custom-title')
})