mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 09:26:06 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

fix: Form.Item with help should display error style when validate failed (#25582)

Browse Source 
* fix: Form.Item does not display validation message when set help

* fix: Form.Item does not display validation message when set help

* update: code style
This commit is contained in:
zhangchen 2020-07-13 12:02:15 +08:00 committed by GitHub
parent 5792b6e7c1
commit fb869021aa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/form/FormItem.tsx
View File

@ -161,11 +161,11 @@ function FormItem(props: FormItemProps): React.ReactElement {
let mergedValidateStatus: ValidateStatus = '';
if (validateStatus !== undefined) {
mergedValidateStatus = validateStatus;
} else if (meta && meta.validating) {
} else if (meta?.validating) {
mergedValidateStatus = 'validating';
} else if (!help && mergedErrors.length) {
} else if (meta?.errors?.length) {
mergedValidateStatus = 'error';
} else if (meta && meta.touched) {
} else if (meta?.touched) {
mergedValidateStatus = 'success';
}

14
components/form/__tests__/index.test.js
View File

@ -354,6 +354,20 @@ describe('Form', () => {
expect(wrapper.find('.ant-form-item-explain').length).toBeTruthy();
});
it('Form.Item with `help` should display error style when validate failed', async () => {
const wrapper = mount(
<Form>
<Form.Item name="test" help="help" rules={[{ required: true, message: 'message' }]}>
<Input />
</Form.Item>
</Form>,
);
await change(wrapper, 0, '');
expect(wrapper.find('.ant-form-item').first().hasClass('ant-form-item-has-error')).toBeTruthy();
expect(wrapper.find('.ant-form-item-explain').text()).toEqual('help');
});
// https://github.com/ant-design/ant-design/issues/21167
it('`require` without `name`', () => {
const wrapper = mount(