You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ant-design-vue/components/badge/__tests__/index.test.js

89 lines
2.5 KiB

import { mount } from '@vue/test-utils'
import Badge from '../index'
import { asyncExpect } from '@/tests/utils'
describe('Badge', () => {
it('badge dot not scaling count > 9', () => {
const badge = mount({
render () {
return <Badge count={10} dot />
},
})
expect(badge.findAll('.ant-card-multiple-words').length).toBe(0)
})
it('badge dot not showing count == 0', () => {
const badge = mount({
render () {
return <Badge count={0} dot />
},
})
expect(badge.findAll('.ant-badge-dot').length).toBe(0)
})
it('should have an overriden title attribute', () => {
const badge = mount({
render () {
return <Badge count={10} title='Custom title' />
},
})
expect(badge.find('.ant-scroll-number').element.attributes.getNamedItem('title').value).toEqual('Custom title')
})
// https://github.com/ant-design/ant-design/issues/10626
// it('should be composable with Tooltip', async () => {
// const wrapper = mount({
// render () {
// return <Tooltip ref='tooltip' title='Fix the error'>
// <Badge status='error' />
// </Tooltip>
// },
// }, { sync: false })
// await asyncExpect(() => {
// wrapper.find({ name: 'ABadge' }).trigger('mouseenter')
// }, 0)
// expect(wrapper.vm.$refs.tooltip.sVisible).toBe(true)
// })
it('should render when count is changed', async () => {
const wrapper = mount(Badge, {
propsData: {
count: 9,
},
sync: false,
})
await asyncExpect(() => {
wrapper.setProps({ count: 10 })
}, 100)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
wrapper.setProps({ count: 11 })
}, 100)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
wrapper.setProps({ count: 11 })
}, 100)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
wrapper.setProps({ count: 10 })
}, 100)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
wrapper.setProps({ count: 9 })
}, 100)
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot()
}, 100)
})
it('should be compatible with borderColor style', () => {
const wrapper = mount({
render () {
return <Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />
},
})
expect(wrapper.html()).toMatchSnapshot()
})
})