ant-design/components/form/__tests__/label.test.js

77 lines
2.7 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import React from 'react';
import { mount } from 'enzyme';
import Form from '..';
describe('Form', () => {
it('should remove duplicated user input colon', () => {
const wrapper = mount(
<Form>
<Form.Item label="label:">input</Form.Item>
<Form.Item label="label">input</Form.Item>
</Form>
);
expect(wrapper.find('.ant-form-item-label label').at(0).text()).not.toContain(':');
expect(wrapper.find('.ant-form-item-label label').at(1).text()).not.toContain('');
});
it('should not remove duplicated user input colon when props colon is false', () => {
const wrapper = mount(
<Form>
<Form.Item label="label:" colon={false}>input</Form.Item>
<Form.Item label="label" colon={false}>input</Form.Item>
</Form>
);
expect(wrapper.find('.ant-form-item-label label').at(0).text()).toContain(':');
expect(wrapper.find('.ant-form-item-label label').at(1).text()).toContain('');
});
it('should not remove duplicated user input colon when layout is vertical', () => {
const wrapper = mount(
<Form layout="vertical">
<Form.Item label="label:">input</Form.Item>
<Form.Item label="label">input</Form.Item>
</Form>
);
expect(wrapper.find('.ant-form-item-label label').at(0).text()).toContain(':');
expect(wrapper.find('.ant-form-item-label label').at(1).text()).toContain('');
});
it('should has dom with .ant-form-item-control-wrapper', () => {
const formItemLayout = {
labelCol: { span: 6 },
wrapperCol: { span: 14 },
};
const wrapper = mount(
<Form>
<Form.Item {...formItemLayout}>input</Form.Item>
<Form.Item>input</Form.Item>
</Form>
);
expect(wrapper.find('.ant-form-item-control-wrapper').length).toBe(2);
expect(wrapper.find('.ant-form-item-control-wrapper.ant-col-14').length).toBe(1);
});
// https://github.com/ant-design/ant-design/issues/7351
it('focus correct input when click label', () => {
const Form1 = Form.create()(({ form }) => (
<Form>
<Form.Item label="label 1">
{form.getFieldDecorator('test')(<input />)}
</Form.Item>
</Form>
));
const Form2 = Form.create()(({ form }) => (
<Form>
<Form.Item label="label 2">
{form.getFieldDecorator('test2')(<input />)}
</Form.Item>
</Form>
));
const wrapper = mount(<div><Form1 /><Form2 /></div>);
wrapper.find('Form label').at(0).simulate('click');
expect(wrapper.find('Form input').at(0).node).toBe(document.activeElement);
wrapper.find('Form label').at(1).simulate('click');
expect(wrapper.find('Form input').at(1).node).toBe(document.activeElement);
});
});