blessing-skin-server/resources/assets/tests/components/skinlib/Upload.test.js

/* eslint-disable accessor-pairs */
/* eslint-disable no-invalid-this */
import Vue from 'vue'
import { mount } from '@vue/test-utils'
import Upload from '@/components/skinlib/Upload'
import { flushPromises } from '../../utils'
import toastr from 'toastr'
import { swal } from '@/js/notify'

jest.mock('toastr')
jest.mock('@/js/notify')

window.blessing.extra = {
  textureNameRule: 'rule',
  privacyNotice: 'privacyNotice',
  scorePrivate: 10,
  scorePublic: 1,
}

const csrf = document.createElement('meta')
csrf.name = 'csrf-token'
csrf.content = 'token'
document.head.appendChild(csrf)

test('display drap and drop notice', () => {
  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })
  expect(wrapper.text()).toContain('skinlib.upload.dropZone')
  wrapper.setData({ files: [{}] })
  expect(wrapper.contains('img')).toBeTrue()
})
test('button for removing texture', () => {
  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })
  wrapper.vm.$refs = {
    upload: {
      clear: jest.fn(),
    },
  }
  const button = wrapper.find('.btn-default')
  expect(button.isVisible()).toBeFalse()
  wrapper.setData({ files: [{}] })
  expect(button.isVisible()).toBeTrue()
  button.trigger('click')
  expect(wrapper.vm.texture).toBe('')
})
test('notice should be display if texture is private', () => {
  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })
  expect(wrapper.contains('.callout')).toBeFalse()
  wrapper.find('[type=checkbox]').setChecked()
  expect(wrapper.find('.callout').text()).toBe('privacyNotice')
})
test('display score cost', () => {
  const origin = Vue.prototype.$t
  Vue.prototype.$t = (key, args) => `${key}${JSON.stringify(args)}`

  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })
  wrapper.find('[type=checkbox]').setChecked()
  wrapper.setData({ files: [{ size: 1024 }] })
  expect(wrapper.text()).toContain(JSON.stringify({ score: 10 }))

  Vue.prototype.$t = origin
})
test('process input file', () => {
  window.URL.createObjectURL = jest.fn().mockReturnValue('file-url')
  jest.spyOn(window, 'Image')
    .mockImplementationOnce(function () {
      this.src = ''
      this.onload = null
      Object.defineProperty(this, 'onload', {
        set: fn => fn(),
      })
    })
    .mockImplementationOnce(function () {
      this.src = ''
      this.width = 500
      this.onload = null
      Object.defineProperty(this, 'onload', {
        set: fn => fn(),
      })
    })
  const blob = new Blob()
  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })

  wrapper.vm.inputFile()
  expect(wrapper.vm.name).toBe('')

  wrapper.vm.inputFile({ file: blob, name: '123.png' })
  expect(wrapper.vm.name).toBe('123')

  wrapper.vm.inputFile({ file: blob, name: '456.png' })
  expect(wrapper.vm.name).toBe('123')

  wrapper.setData({ name: '' })
  wrapper.vm.inputFile({ file: blob, name: '789' })
  expect(wrapper.vm.name).toBe('789')

  expect(wrapper.vm.texture).toBe('file-url')

  window.Image.mockRestore()
})
test('upload file', async () => {
  window.Request = jest.fn()
  Vue.prototype.$http.post
    .mockResolvedValueOnce({ errno: 1, msg: '1' })
    .mockResolvedValueOnce({
      errno: 0, msg: '0', tid: 1,
    })
  jest.spyOn(toastr, 'info')
  swal.mockReturnValue()

  const wrapper = mount(Upload, {
    stubs: ['file-upload'],
  })
  const button = wrapper.find('.box-footer > button')

  button.trigger('click')
  expect(Vue.prototype.$http.post).not.toBeCalled()
  expect(toastr.info).toBeCalledWith('skinlib.emptyUploadFile')

  wrapper.setData({
    files: [{
      file: {}, name: 't', type: 'image/jpeg',
    }],
  })
  button.trigger('click')
  expect(Vue.prototype.$http.post).not.toBeCalled()
  expect(toastr.info).toBeCalledWith('skinlib.emptyTextureName')

  wrapper.find('[type=text]').setValue('t')
  button.trigger('click')
  expect(Vue.prototype.$http.post).not.toBeCalled()
  expect(toastr.info).toBeCalledWith('skinlib.fileExtError')

  wrapper.setData({
    files: [{
      file: new Blob(), name: 't.png', type: 'image/png',
    }],
  })
  button.trigger('click')
  await flushPromises()
  expect(Vue.prototype.$http.post).toBeCalledWith('/skinlib/upload', expect.any(FormData))
  expect(swal).toBeCalledWith({ type: 'warning', text: '1' })

  button.trigger('click')
  await flushPromises()
  jest.runAllTimers()
  expect(swal).toBeCalledWith({ type: 'success', text: '0' })
  expect(toastr.info).toBeCalledWith('skinlib.redirecting')
})