test: add input test

This commit is contained in:
tjz 2018-06-10 10:26:24 +08:00
parent 7879279123
commit 08018525b8
2 changed files with 117 additions and 0 deletions

View File

@ -0,0 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Input should support maxLength 1`] = `<input type="text" maxlength="3" class="ant-input">`;
exports[`Input.Search should support suffix 1`] = `<span class="ant-input-search ant-input-affix-wrapper ant-input-search"><input type="text" class="ant-input ant-input-search"><span class="ant-input-suffix">suffix<i class="anticon anticon-search ant-input-search-icon"></i></span></span>`;
exports[`TextArea should support disabled 1`] = `<textarea disabled="disabled" class="ant-input ant-input-disabled"></textarea>`;
exports[`TextArea should support maxLength 1`] = `<textarea maxlength="10" class="ant-input"></textarea>`;

View File

@ -0,0 +1,108 @@
import { mount } from '@vue/test-utils'
import { asyncExpect } from '@/tests/utils'
import Input from '..'
import Form from '../../form'
import focusTest from '../../../tests/shared/focusTest'
const { TextArea } = Input
describe('Input', () => {
focusTest(Input)
it('should support maxLength', async () => {
const wrapper = mount(Input, { attrs: { maxLength: 3 }, sync: false })
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
}, 0)
})
})
focusTest(TextArea)
describe('TextArea', () => {
it('should auto calculate height according to content length', async () => {
const wrapper = mount(TextArea, { propsData: { value: '', readOnly: true, autosize: true }, sync: false })
const mockFunc = jest.spyOn(wrapper.vm, 'resizeTextarea')
await asyncExpect(() => {
wrapper.setProps({ value: '1111\n2222\n3333' })
})
await asyncExpect(() => {
expect(mockFunc).toHaveBeenCalledTimes(1)
})
await asyncExpect(() => {
wrapper.setProps({ value: '1111' })
})
await asyncExpect(() => {
expect(mockFunc).toHaveBeenCalledTimes(2)
}, 0)
})
it('should support disabled', async () => {
const wrapper = mount(TextArea, { propsData: { disabled: true }, sync: false })
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
})
})
it('should support maxLength', async () => {
const wrapper = mount(TextArea, { attrs: { maxLength: 10 }, sync: false })
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
})
})
})
describe('As Form Control', () => {
it('should be reset when wrapped in form.getFieldDecorator without initialValue', async () => {
const Demo = {
methods: {
reset () {
this.form.resetFields()
},
},
render () {
const { getFieldDecorator } = this.form
return (
<Form>
<Form.Item>
{getFieldDecorator('input')(<Input />)}
</Form.Item>
<Form.Item>
{getFieldDecorator('textarea')(<Input.TextArea />)}
</Form.Item>
<button onClick={this.reset}>reset</button>
</Form>
)
},
}
const DemoForm = Form.create()(Demo)
const wrapper = mount(DemoForm, { sync: false })
await asyncExpect(() => {
wrapper.find('input').element.value = '111'
wrapper.find('input').trigger('change')
wrapper.find('textarea').element.value = '222'
wrapper.find('textarea').trigger('change')
})
await asyncExpect(() => {
expect(wrapper.find('input').element.value).toBe('111')
expect(wrapper.find('textarea').element.value).toBe('222')
wrapper.find('button').trigger('click')
})
await asyncExpect(() => {
expect(wrapper.find('input').element.value).toBe('')
expect(wrapper.find('textarea').element.value).toBe('')
})
})
})
describe('Input.Search', () => {
it('should support suffix', async () => {
const wrapper = mount(Input.Search, { propsData: { suffix: 'suffix' }, sync: false })
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
})
})
})