mirror of
https://github.com/zhigang1992/react.git
synced 2026-05-26 15:06:25 +08:00
d4a1e02430
* feat(scaleable): add scaleable props to each component * chore(scaleable): update the exported type * feat: apply scaleable to components chore: remove with-default test: improve testcase for scaleable chore: resolve test warning ci: upgrade nodejs to latest lts docs: fix type error in document site * docs: update documents to be compatible with scaleable chore: fix build errors * chore: remove all size-related attributes docs: improve guide document * docs: add scaleable documentation test: update snapshots chore: remove unused * feat: add scaleable to grid components * docs: improve docs * test: update snapshots * fix(grid): fix basic component props
76 lines
2.4 KiB
TypeScript
76 lines
2.4 KiB
TypeScript
import React from 'react'
|
|
import { mount } from 'enzyme'
|
|
import CssTransition from '../css-transition'
|
|
import { updateWrapper } from 'tests/utils'
|
|
|
|
describe('CssTransition', () => {
|
|
it('should render correctly', () => {
|
|
const wrapper = mount(
|
|
<CssTransition visible>
|
|
<span>test</span>
|
|
</CssTransition>,
|
|
)
|
|
expect(wrapper.text()).toContain('test')
|
|
expect(wrapper.html()).toMatchSnapshot()
|
|
expect(() => wrapper.unmount()).not.toThrow()
|
|
})
|
|
|
|
it('should work correctly with time props', async () => {
|
|
const wrapper = mount(
|
|
<CssTransition enterTime={300} leaveTime={300}>
|
|
<span id="test">test</span>
|
|
</CssTransition>,
|
|
)
|
|
expect(wrapper.find('.transition-enter-active').length).toBe(0)
|
|
|
|
wrapper.setProps({ visible: true })
|
|
await updateWrapper(wrapper, 310)
|
|
expect(wrapper.find('.transition-enter-active').length).not.toBe(0)
|
|
|
|
wrapper.setProps({ visible: false })
|
|
await updateWrapper(wrapper, 310)
|
|
expect(wrapper.find('.transition-leave-active').length).not.toBe(0)
|
|
})
|
|
|
|
it('should clear css-transition classes after hidden', async () => {
|
|
const wrapper = mount(
|
|
<CssTransition visible>
|
|
<span>test</span>
|
|
</CssTransition>,
|
|
)
|
|
// don't remove classes after shown
|
|
await updateWrapper(wrapper, 60)
|
|
expect(wrapper.find('.transition-enter-active').length).not.toBe(0)
|
|
|
|
await updateWrapper(wrapper, 150)
|
|
expect(wrapper.find('.transition-enter-active').length).not.toBe(0)
|
|
|
|
// remove classes after hidden
|
|
wrapper.setProps({ visible: false })
|
|
await updateWrapper(wrapper, 60)
|
|
expect(wrapper.find('.transition-leave-active').length).not.toBe(0)
|
|
|
|
await updateWrapper(wrapper, 150)
|
|
expect(wrapper.find('.transition-leave-active').length).toBe(0)
|
|
expect(wrapper.find('.transition-enter-active').length).toBe(0)
|
|
})
|
|
|
|
it('custom class names should be rendered', async () => {
|
|
const wrapper = mount(
|
|
<CssTransition name="test">
|
|
<span id="test">test</span>
|
|
</CssTransition>,
|
|
)
|
|
|
|
expect(wrapper.find('.test-enter-active').length).toBe(0)
|
|
|
|
wrapper.setProps({ visible: true })
|
|
await updateWrapper(wrapper, 60)
|
|
expect(wrapper.find('.test-enter-active').length).not.toBe(0)
|
|
|
|
wrapper.setProps({ visible: false })
|
|
await updateWrapper(wrapper, 60)
|
|
expect(wrapper.find('.test-leave-active').length).not.toBe(0)
|
|
})
|
|
})
|