mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 02:59:58 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

refator: update rc-dialog to remove rc-animate (#26940)

Browse Source 
* chore: bump rc-dialog

* fix 1 test case

* test case

* more test

* fix confirm test case

* clean up

* fix snapshot

* update local-provider snapshot

* update Modal snapshot

* fix test of dialog hook

* fix lint
This commit is contained in:
二货机器人 2020-09-29 19:33:37 +08:00 committed by GitHub
parent 01d757b660
commit 442c146e3c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 280 additions and 222 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/config-provider/__tests__/__snapshots__/components.test.js.snap
View File

@ -16275,12 +16275,12 @@ exports[`ConfigProvider components Modal configProvider 1`] = `
class="config-modal-mask"
/>
<div
class="config-modal-wrap "
class="config-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="config-modal "
class="config-modal"
role="document"
style="width:520px"
>
@ -16368,12 +16368,12 @@ exports[`ConfigProvider components Modal configProvider componentSize large 1`]
class="config-modal-mask"
/>
<div
class="config-modal-wrap "
class="config-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="config-modal "
class="config-modal"
role="document"
style="width:520px"
>
@ -16461,12 +16461,12 @@ exports[`ConfigProvider components Modal configProvider componentSize middle 1`]
class="config-modal-mask"
/>
<div
class="config-modal-wrap "
class="config-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="config-modal "
class="config-modal"
role="document"
style="width:520px"
>
@ -16554,12 +16554,12 @@ exports[`ConfigProvider components Modal configProvider virtual and dropdownMatc
class="ant-modal-mask"
/>
<div
class="ant-modal-wrap "
class="ant-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="ant-modal "
class="ant-modal"
role="document"
style="width:520px"
>
@ -16647,12 +16647,12 @@ exports[`ConfigProvider components Modal normal 1`] = `
class="ant-modal-mask"
/>
<div
class="ant-modal-wrap "
class="ant-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="ant-modal "
class="ant-modal"
role="document"
style="width:520px"
>
@ -16740,12 +16740,12 @@ exports[`ConfigProvider components Modal prefixCls 1`] = `
class="prefix-Modal-mask"
/>
<div
class="prefix-Modal-wrap "
class="prefix-Modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="prefix-Modal "
class="prefix-Modal"
role="document"
style="width:520px"
>

342
components/locale-provider/__tests__/__snapshots__/index.test.js.snap
View File

File diff suppressed because it is too large Load Diff

18
components/modal/__tests__/__snapshots__/Modal.test.js.snap
View File

@ -8,15 +8,15 @@ exports[`Modal render correctly 1`] = `
class="ant-modal-root"
>
<div
class="ant-modal-mask fade-appear"
class="ant-modal-mask fade-appear fade-appear-start fade"
/>
<div
class="ant-modal-wrap "
class="ant-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="ant-modal zoom-appear"
class="ant-modal zoom-appear zoom-appear-prepare zoom"
role="document"
style="width: 520px;"
>
@ -105,15 +105,15 @@ exports[`Modal render without footer 1`] = `
class="ant-modal-root"
>
<div
class="ant-modal-mask fade-appear"
class="ant-modal-mask fade-appear fade-appear-start fade"
/>
<div
class="ant-modal-wrap "
class="ant-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="ant-modal zoom-appear"
class="ant-modal zoom-appear zoom-appear-prepare zoom"
role="document"
style="width: 520px;"
>
@ -181,15 +181,15 @@ exports[`Modal support closeIcon 1`] = `
class="ant-modal-root"
>
<div
class="ant-modal-mask fade-appear"
class="ant-modal-mask fade-appear fade-appear-start fade"
/>
<div
class="ant-modal-wrap "
class="ant-modal-wrap"
role="dialog"
tabindex="-1"
>
<div
class="ant-modal zoom-appear"
class="ant-modal zoom-appear zoom-appear-prepare zoom"
role="document"
style="width: 520px;"
>

101
components/modal/__tests__/confirm.test.js
View File

@ -1,12 +1,45 @@
import TestUtils from 'react-dom/test-utils';
import TestUtils, { act } from 'react-dom/test-utils';
import CSSMotion from 'rc-motion';
import { genCSSMotion } from 'rc-motion/lib/CSSMotion';
import KeyCode from 'rc-util/lib/KeyCode';
import Modal from '..';
import { destroyFns } from '../Modal';
import { sleep } from '../../../tests/utils';
const { confirm } = Modal;
jest.mock('rc-motion');
describe('Modal.confirm triggers callbacks correctly', () => {
// Inject CSSMotion to replace with No transition support
const MockCSSMotion = genCSSMotion(false);
Object.keys(MockCSSMotion).forEach(key => {
CSSMotion[key] = MockCSSMotion[key];
});
// Mock for rc-util raf
window.requestAnimationFrame = callback => {
return window.setTimeout(callback, 16);
};
window.cancelAnimationFrame = id => {
window.clearTimeout(id);
};
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
/* eslint-disable no-console */
// Hack error to remove act warning
const originError = console.error;
console.error = (...args) => {
const errorStr = String(args[0]);
if (errorStr.includes('was not wrapped in act(...)')) {
return;
}
originError(...args);
};
/* eslint-enable */
afterEach(() => {
errorSpy.mockReset();
document.body.innerHTML = '';
@ -68,20 +101,39 @@ describe('Modal.confirm triggers callbacks correctly', () => {
expect(onOk.mock.calls.length).toBe(1);
});
it('should allow Modal.comfirm without onCancel been set', () => {
it('should allow Modal.confirm without onCancel been set', () => {
open();
// Third Modal
$$('.ant-btn')[0].click();
expect(errorSpy).not.toHaveBeenCalled();
});
it('should allow Modal.comfirm without onOk been set', () => {
it('should allow Modal.confirm without onOk been set', () => {
open();
// Fourth Modal
$$('.ant-btn-primary')[0].click();
expect(errorSpy).not.toHaveBeenCalled();
});
it('should close confirm modal when press ESC', () => {
jest.useFakeTimers();
const onCancel = jest.fn();
Modal.confirm({
title: 'title',
content: 'content',
onCancel,
});
jest.runAllTimers();
expect($$(`.ant-modal-confirm-confirm`)).toHaveLength(1);
TestUtils.Simulate.keyDown($$('.ant-modal')[0], {
keyCode: KeyCode.ESC,
});
jest.runAllTimers();
expect($$(`.ant-modal-confirm-confirm`)).toHaveLength(0);
expect(onCancel).toHaveBeenCalledTimes(1);
jest.useRealTimers();
});
it('should not hide confirm when onOk return Promise.resolve', () => {
open({
onOk: () => Promise.resolve(''),
@ -90,23 +142,27 @@ describe('Modal.confirm triggers callbacks correctly', () => {
expect($$('.ant-modal-confirm')).toHaveLength(1);
});
it('should emit error when onOk return Promise.reject', () => {
it('should emit error when onOk return Promise.reject', async () => {
const error = new Error('something wrong');
open({
onOk: () => Promise.reject(error),
onOk: () => {
return Promise.reject(error);
},
});
$$('.ant-btn-primary')[0].click();
// wait promise
return Promise.resolve().then(() => {
await sleep();
expect(errorSpy).toHaveBeenCalledWith(error);
});
});
it('shows animation when close', () => {
open();
jest.useFakeTimers();
expect($$('.ant-modal-confirm')).toHaveLength(1);
$$('.ant-btn')[0].click();
jest.runAllTimers();
expect($$('.ant-modal-confirm')).toHaveLength(0);
jest.useRealTimers();
@ -158,25 +214,6 @@ describe('Modal.confirm triggers callbacks correctly', () => {
jest.useRealTimers();
});
it('should close confirm modal when press ESC', () => {
jest.useFakeTimers();
const onCancel = jest.fn();
Modal.confirm({
title: 'title',
content: 'content',
onCancel,
});
jest.runAllTimers();
expect($$(`.ant-modal-confirm-confirm`)).toHaveLength(1);
TestUtils.Simulate.keyDown($$('.ant-modal')[0], {
keyCode: 27,
});
jest.runAllTimers();
expect($$(`.ant-modal-confirm-confirm`)).toHaveLength(0);
expect(onCancel).toHaveBeenCalledTimes(1);
jest.useRealTimers();
});
it('should not close modals when click confirm button when onOk has argument', () => {
jest.useFakeTimers();
['info', 'success', 'warning', 'error'].forEach(type => {
@ -268,23 +305,35 @@ describe('Modal.confirm triggers callbacks correctly', () => {
it('destroyFns should reduce when instance.destroy', () => {
jest.useFakeTimers();
Modal.destroyAll(); // clear destroyFns
jest.runAllTimers();
const instances = [];
['info', 'success', 'warning', 'error'].forEach(type => {
const instance = Modal[type]({
title: 'title',
content: 'content',
});
// Render modal
act(() => {
jest.runAllTimers();
});
instances.push(instance);
});
const { length } = instances;
instances.forEach((instance, index) => {
expect(destroyFns.length).toBe(length - index);
act(() => {
instance.destroy();
jest.runAllTimers();
});
expect(destroyFns.length).toBe(length - index - 1);
});
jest.useRealTimers();
});

9
components/modal/__tests__/hook.test.js
View File

@ -1,11 +1,20 @@
import React from 'react';
import CSSMotion from 'rc-motion';
import { genCSSMotion } from 'rc-motion/lib/CSSMotion';
import { mount } from 'enzyme';
import Modal from '..';
import Button from '../../button';
jest.mock('rc-util/lib/Portal');
jest.mock('rc-motion');
describe('Modal.hook', () => {
// Inject CSSMotion to replace with No transition support
const MockCSSMotion = genCSSMotion(false);
Object.keys(MockCSSMotion).forEach(key => {
CSSMotion[key] = MockCSSMotion[key];
});
it('hooks support context', () => {
jest.useFakeTimers();
const Context = React.createContext('light');

2
package.json
View File

@ -121,7 +121,7 @@
"rc-cascader": "~1.4.0",
"rc-checkbox": "~2.3.0",
"rc-collapse": "~2.0.0",
"rc-dialog": "~8.3.0",
"rc-dialog": "~8.4.0",
"rc-drawer": "~4.1.0",
"rc-dropdown": "~3.2.0",
"rc-field-form": "~1.12.0",