test: update modal snap
tanjinzhou
parent
9e4b2f4655
commit
1425de31b7
|
|
@ -12,10 +12,8 @@ const ModalTester = {
|
|||
},
|
||||
render() {
|
||||
const modalProps = {
|
||||
props: {
|
||||
...this.$props,
|
||||
getContainer: this.getContainer,
|
||||
},
|
||||
...this.$props,
|
||||
getContainer: this.getContainer,
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue