github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

test: update modal snap

Browse Source
pull/2682/head
tanjinzhou 4 years ago
parent 9e4b2f4655
commit 1425de31b7
4 changed files with 81 additions and 41 deletions
Show Stats Download Patch File Download Diff File

6
components/modal/__tests__/Modal.test.js
Unescape View File

@ -12,10 +12,8 @@ const ModalTester = {
},
render() {
const modalProps = {
props: {
...this.$props,
getContainer: this.getContainer,
},
...this.$props,
getContainer: this.getContainer,
};
return (
<div>

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

@ -5,22 +5,27 @@ exports[`Modal render correctly 1`] = `
<div>
<div>
<div class="ant-modal-root">
<div class="ant-modal-mask"></div>
<div tabindex="-1" role="dialog" class="ant-modal-wrap ">
<div role="document" class="ant-modal" style="width: 520px;">
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<div class="ant-modal-mask fade-enter"></div>
<div tabindex="-1" class="ant-modal-wrap" role="dialog">
<div role="document" style="width: 520px;" class="ant-modal zoom-enter">
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<!---->
<div class="ant-modal-body">Here is content of Modal</div>
<div class="ant-modal-footer">
<div><button type="button" class="ant-btn"><span>Cancel</span></button><button type="button" class="ant-btn ant-btn-primary"><span>OK</span></button></div>
<div><button class="ant-btn" type="button">
<!----><span>Cancel</span></button><button class="ant-btn ant-btn-primary" type="button">
<!----><span>OK</span></button></div>
</div>
</div>
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
</div>
</div>
</div>
</div>
</div>
<!--teleport start-->
<!--teleport end-->
</div>
`;
@ -29,22 +34,27 @@ exports[`Modal render correctly 2`] = `
<div>
<div>
<div class="ant-modal-root">
<div class="ant-modal-mask"></div>
<div tabindex="-1" role="dialog" class="ant-modal-wrap ">
<div role="document" class="ant-modal" style="width: 520px;">
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<div class="ant-modal-mask fade-enter"></div>
<div tabindex="-1" class="ant-modal-wrap" role="dialog">
<div role="document" style="width: 520px;" class="ant-modal zoom-enter">
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<!---->
<div class="ant-modal-body">Here is content of Modal</div>
<div class="ant-modal-footer">
<div><button type="button" class="ant-btn"><span>Cancel</span></button><button type="button" class="ant-btn ant-btn-primary"><span>OK</span></button></div>
<div><button class="ant-btn" type="button">
<!----><span>Cancel</span></button><button class="ant-btn ant-btn-primary" type="button">
<!----><span>OK</span></button></div>
</div>
</div>
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
</div>
</div>
</div>
</div>
</div>
<!--teleport start-->
<!--teleport end-->
</div>
`;
@ -53,18 +63,22 @@ exports[`Modal render without footer 1`] = `
<div>
<div>
<div class="ant-modal-root">
<div class="ant-modal-mask"></div>
<div tabindex="-1" role="dialog" class="ant-modal-wrap ">
<div role="document" class="ant-modal" style="width: 520px;">
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<div class="ant-modal-mask fade-enter"></div>
<div tabindex="-1" class="ant-modal-wrap" role="dialog">
<div role="document" style="width: 520px;" class="ant-modal zoom-enter">
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
<div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
<!---->
<div class="ant-modal-body">Here is content of Modal</div>
<!---->
</div>
<div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
<div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
</div>
</div>
</div>
</div>
</div>
<!--teleport start-->
<!--teleport end-->
</div>
`;

54
components/modal/__tests__/__snapshots__/demo.test.js.snap
Unescape View File

@ -1,47 +1,75 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./antdv-demo/docs/modal/demo/async.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with async logic</span></button>
<div><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Open Modal with async logic</span></button>
<!---->
</div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/basic.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal</span></button>
<div><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Open Modal</span></button>
<!---->
</div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/button-props.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with customized button props</span></button>
<div><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Open Modal with customized button props</span></button>
<!---->
</div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm.md correctly 1`] = `<div><button type="button" class="ant-btn"><span>Confirm</span></button> <button type="button" class="ant-btn ant-btn-dashed"><span>Delete</span></button> <button type="button" class="ant-btn ant-btn-dashed"><span>With extra props</span></button></div>`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm.md correctly 1`] = `
<div><button class="ant-btn" type="button">
<!----><span>Confirm</span></button><button class="ant-btn ant-btn-dashed" type="button">
<!----><span>Delete</span></button><button class="ant-btn ant-btn-dashed" type="button">
<!----><span>With extra props</span></button></div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm-promise.md correctly 1`] = `<button type="button" class="ant-btn"><span>Confirm</span></button>`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm-promise.md correctly 1`] = `
<button class="ant-btn" type="button">
<!----><span>Confirm</span></button>
`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm-router.md correctly 1`] = `<button type="button" class="ant-btn"><span>Confirm</span></button>`;
exports[`renders ./antdv-demo/docs/modal/demo/confirm-router.md correctly 1`] = `
<button class="ant-btn" type="button">
<!----><span>Confirm</span></button>
`;
exports[`renders ./antdv-demo/docs/modal/demo/footer.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with customized footer</span></button>
<div><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Open Modal with customized footer</span></button>
<!---->
</div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/info.md correctly 1`] = `<div><button type="button" class="ant-btn"><span>Info</span></button> <button type="button" class="ant-btn"><span>Success</span></button> <button type="button" class="ant-btn"><span>Error</span></button> <button type="button" class="ant-btn"><span>Warning</span></button></div>`;
exports[`renders ./antdv-demo/docs/modal/demo/info.md correctly 1`] = `
<div><button class="ant-btn" type="button">
<!----><span>Info</span></button><button class="ant-btn" type="button">
<!----><span>Success</span></button><button class="ant-btn" type="button">
<!----><span>Error</span></button><button class="ant-btn" type="button">
<!----><span>Warning</span></button></div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/locale.md correctly 1`] = `
<div><button type="button" class="ant-btn ant-btn-primary"><span>Modal</span></button>
<!----> <br> <br> <button type="button" class="ant-btn"><span>Confirm</span></button></div>
<div><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Modal</span></button>
<!----><br><br><button class="ant-btn" type="button">
<!----><span>Confirm</span></button></div>
`;
exports[`renders ./antdv-demo/docs/modal/demo/manual.md correctly 1`] = `<button type="button" class="ant-btn"><span>Open modal to close in 5s</span></button>`;
exports[`renders ./antdv-demo/docs/modal/demo/manual.md correctly 1`] = `
<button class="ant-btn" type="button">
<!----><span>Open modal to close in 5s</span></button>
`;
exports[`renders ./antdv-demo/docs/modal/demo/position.md correctly 1`] = `
<div id="components-modal-demo-position"><button type="button" class="ant-btn ant-btn-primary"><span>Display a modal dialog at 20px to Top</span></button>
<!----> <br><br> <button type="button" class="ant-btn ant-btn-primary"><span>Vertically centered modal dialog</span></button>
<div id="components-modal-demo-position"><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Display a modal dialog at 20px to Top</span></button>
<!----><br><br><button class="ant-btn ant-btn-primary" type="button">
<!----><span>Vertically centered modal dialog</span></button>
<!---->
</div>
`;

8
components/modal/__tests__/confirm.test.js
Unescape View File

@ -79,8 +79,8 @@ describe('Modal.confirm triggers callbacks correctly', () => {
it('allows extra props on buttons', async () => {
open({
okButtonProps: { props: { disabled: true } },
cancelButtonProps: { attrs: { 'data-test': 'baz' } },
okButtonProps: { disabled: true },
cancelButtonProps: { 'data-test': 'baz' },
});
await sleep();
expect($$('.ant-btn')).toHaveLength(2);
@ -88,7 +88,7 @@ describe('Modal.confirm triggers callbacks correctly', () => {
expect($$('.ant-btn')[1].disabled).toBe(true);
});
fit('trigger onCancel once when click on cancel button', async () => {
it('trigger onCancel once when click on cancel button', async () => {
const arr = ['info', 'success', 'warning', 'error'];
for (let type of arr) {
Modal[type]({
@ -98,7 +98,7 @@ describe('Modal.confirm triggers callbacks correctly', () => {
await sleep();
expect($$(`.ant-modal-confirm-${type}`)).toHaveLength(1);
$$('.ant-btn')[0].click();
await sleep();
await sleep(500);
expect($$(`.ant-modal-confirm-${type}`)).toHaveLength(0);
}
});

Write Preview
Loading…
Cancel
Save