61 lines
2.6 KiB
JavaScript
61 lines
2.6 KiB
JavaScript
import Vue from 'vue'
|
|
import { mount } from '@vue/test-utils'
|
|
import flushPromises from 'flush-promises'
|
|
import Formulate from '@/Formulate.js'
|
|
import FileUpload from '@/FileUpload.js'
|
|
import FormulateInput from '@/FormulateInput.vue'
|
|
import FormulateInputFile from '@/inputs/FormulateInputFile.vue'
|
|
|
|
Vue.use(Formulate)
|
|
|
|
describe('FormulateInputFile', () => {
|
|
|
|
it('type "file" renders a file element', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'file' } })
|
|
expect(wrapper.findComponent(FormulateInputFile).exists()).toBe(true)
|
|
})
|
|
|
|
it('type "image" renders a file element', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image' } })
|
|
expect(wrapper.findComponent(FormulateInputFile).exists()).toBe(true)
|
|
})
|
|
|
|
it('forces an error-behavior live mode when upload-behavior is live and it has content', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image', validation: 'mime:image/jpeg', value: [{ url: 'img.jpg' }] } })
|
|
expect(wrapper.vm.showValidationErrors).toBe(true)
|
|
})
|
|
|
|
it('wont show errors when upload-behavior is live and it is required but empty', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image', validation: 'required|mime:image/jpeg' } })
|
|
expect(wrapper.vm.showValidationErrors).toBe(false)
|
|
})
|
|
|
|
it('contains a data-has-preview attribute when showing a preview', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image', value: [ { url: 'https://www.example.com/image.png' } ], validation: 'required|mime:image/jpeg' } })
|
|
const file = wrapper.find('[data-has-preview]')
|
|
expect(file.exists()).toBe(true)
|
|
expect(file.attributes('data-has-preview')).toBe('true')
|
|
})
|
|
|
|
it('passes an explicitly given name prop through to the root element', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image', name: 'foo' } })
|
|
expect(wrapper.find('input[name="foo"]').exists()).toBe(true)
|
|
})
|
|
|
|
it('additional context does not bleed through to file input attributes', () => {
|
|
const wrapper = mount(FormulateInput, { propsData: { type: 'image' } } )
|
|
expect(Object.keys(wrapper.find('input[type="file"]').attributes())).toEqual(["type", "id"])
|
|
})
|
|
|
|
/**
|
|
* ===========================================================================
|
|
* Currently there appears to be no way to properly mock upload data in
|
|
* vue-test-utils because JSDom doesn't implement DataTransfer:
|
|
*
|
|
* https://stackoverflow.com/questions/48993134/how-to-test-input-file-with-jest-and-vue-test-utils
|
|
*/
|
|
// it('type "image" renders a file element', async () => {
|
|
|
|
// })
|
|
})
|