mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-06 05:09:00 +08:00
bbd16a08e9
* refactor(hooks): remove use-css-var * refactor(hooks): remove use-events * refactor(hooks): remove use-migrating * refactor(hooks): remove use-transition * refactor(hooks): named export useAttrs * refactor(hooks): named export useFocus * refactor(hooks): refactor useFormItem * refactor(hooks): refactor useGlobalConfig * refactor(hooks): refactor useLocale * refactor(hooks): refactor useLockscreen * refactor(hooks): refactor useModal * refactor(hooks): refactor useModelToggle * refactor(hooks): refactor usePreventGlobal * refactor(hooks): refactor useRestoreActive * refactor(hooks): refactor useTeleport * refactor(hooks): refactor useThrottleRender * refactor(hooks): refactor useTimeout * refactor(hooks): refactor useTransitionFallthrogh
86 lines
1.8 KiB
TypeScript
86 lines
1.8 KiB
TypeScript
import { ref, nextTick, h } from 'vue'
|
|
import { mount } from '@vue/test-utils'
|
|
|
|
import { useTeleport } from '../use-teleport'
|
|
|
|
const AXIOM = 'Rem is the best girl'
|
|
|
|
const Comp = {
|
|
setup() {
|
|
const appendToBody = ref(true)
|
|
const { showTeleport, hideTeleport, renderTeleport } = useTeleport(
|
|
() => h('div', AXIOM),
|
|
appendToBody
|
|
)
|
|
|
|
return () => {
|
|
return [
|
|
h(
|
|
'button',
|
|
{
|
|
class: 'show',
|
|
onClick: showTeleport,
|
|
},
|
|
'show'
|
|
),
|
|
h(
|
|
'button',
|
|
{
|
|
class: 'hide',
|
|
onClick: hideTeleport,
|
|
},
|
|
'hide'
|
|
),
|
|
h('button', {
|
|
class: 'toggle',
|
|
onClick: () => {
|
|
// toggle append to body.
|
|
appendToBody.value = !appendToBody.value
|
|
},
|
|
}),
|
|
renderTeleport(),
|
|
]
|
|
}
|
|
},
|
|
}
|
|
|
|
describe('useModal', () => {
|
|
let wrapper: ReturnType<typeof mount>
|
|
|
|
beforeEach(() => {
|
|
wrapper = mount(Comp)
|
|
})
|
|
|
|
afterEach(() => {
|
|
wrapper.unmount()
|
|
})
|
|
|
|
it('should render correctly', async () => {
|
|
await nextTick()
|
|
expect(wrapper.text()).not.toContain(AXIOM)
|
|
})
|
|
|
|
it('should render teleport to the DOM', async () => {
|
|
await nextTick()
|
|
expect(wrapper.text()).not.toContain(AXIOM)
|
|
|
|
await wrapper.find('.show').trigger('click')
|
|
|
|
expect(document.body.innerHTML).toContain(AXIOM)
|
|
|
|
await wrapper.find('.hide').trigger('click')
|
|
|
|
expect(document.body.innerHTML).not.toContain(AXIOM)
|
|
})
|
|
|
|
it('should render to the current wrapper instead of document.body', async () => {
|
|
await nextTick()
|
|
|
|
expect(wrapper.text()).not.toContain(AXIOM)
|
|
|
|
await wrapper.find('.toggle').trigger('click')
|
|
|
|
expect(wrapper.text()).toContain(AXIOM)
|
|
})
|
|
})
|