test: add popconfirm test
parent
d9c6c76429
commit
abbfb50f56
|
@ -0,0 +1,19 @@
|
||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`Popconfirm should show overlay when trigger is clicked 1`] = `
|
||||||
|
<div class="ant-popover-content">
|
||||||
|
<div class="ant-popover-arrow"></div>
|
||||||
|
<div class="ant-popover-inner">
|
||||||
|
<div class="ant-popover-inner-content">
|
||||||
|
<div class="ant-popover-message">
|
||||||
|
<i class="anticon anticon-exclamation-circle"></i>
|
||||||
|
<div class="ant-popover-message-title">code</div>
|
||||||
|
</div>
|
||||||
|
<div class="ant-popover-buttons">
|
||||||
|
<button type="button" class="ant-btn ant-btn-default ant-btn-sm"><span>Cancel</span></button>
|
||||||
|
<button type="button" class="ant-btn ant-btn-primary ant-btn-sm"><span>OK</span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
|
@ -0,0 +1,62 @@
|
||||||
|
import { mount } from '@vue/test-utils'
|
||||||
|
import { asyncExpect } from '@/tests/utils'
|
||||||
|
import Popconfirm from '..'
|
||||||
|
function $$ (className) {
|
||||||
|
return document.body.querySelectorAll(className)
|
||||||
|
}
|
||||||
|
describe('Popconfirm', () => {
|
||||||
|
it('should popup Popconfirm dialog', async () => {
|
||||||
|
const onVisibleChange = jest.fn()
|
||||||
|
|
||||||
|
const wrapper = mount(
|
||||||
|
{
|
||||||
|
render () {
|
||||||
|
return <Popconfirm
|
||||||
|
title={<span class='popconfirm-test'>Are you sure delete this task?</span>}
|
||||||
|
okText='Yes'
|
||||||
|
cancelText='No'
|
||||||
|
mouseEnterDelay={0}
|
||||||
|
mouseLeaveDelay={0}
|
||||||
|
onVisibleChange={onVisibleChange}
|
||||||
|
>
|
||||||
|
<span>Delete</span>
|
||||||
|
</Popconfirm>
|
||||||
|
},
|
||||||
|
}, { sync: false, attachToDocument: true })
|
||||||
|
let triggerNode = null
|
||||||
|
await asyncExpect(() => {
|
||||||
|
triggerNode = wrapper.findAll('span').at(0)
|
||||||
|
triggerNode.trigger('click')
|
||||||
|
})
|
||||||
|
await asyncExpect(() => {
|
||||||
|
expect(onVisibleChange).toBeCalledWith(true)
|
||||||
|
expect($$('.popconfirm-test').length).toBe(1)
|
||||||
|
triggerNode.trigger('click')
|
||||||
|
}, 1000)
|
||||||
|
await asyncExpect(() => {
|
||||||
|
expect(onVisibleChange).toBeCalledWith(false)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should show overlay when trigger is clicked', async () => {
|
||||||
|
const popconfirm = mount({
|
||||||
|
render () {
|
||||||
|
return <Popconfirm ref='popconfirm' title='code'>
|
||||||
|
<span>show me your code</span>
|
||||||
|
</Popconfirm>
|
||||||
|
},
|
||||||
|
}, { sync: false })
|
||||||
|
|
||||||
|
await asyncExpect(() => {
|
||||||
|
expect(popconfirm.vm.$refs.popconfirm.getPopupDomNode()).toBe(null)
|
||||||
|
|
||||||
|
popconfirm.find('span').trigger('click')
|
||||||
|
}, 1000)
|
||||||
|
await asyncExpect(() => {
|
||||||
|
const popup = popconfirm.vm.$refs.popconfirm.getPopupDomNode()
|
||||||
|
expect(popup).not.toBe(null)
|
||||||
|
expect(popup.className).toContain('ant-popover-placement-top')
|
||||||
|
expect(popup.innerHTML).toMatchSnapshot()
|
||||||
|
}, 1000)
|
||||||
|
})
|
||||||
|
})
|
Loading…
Reference in New Issue