test: update button test
tangjinzhou
parent
fe8351e288
commit
524cfe7e01
|
|
@ -0,0 +1,21 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Button fixbug renders {0} , 0 and {false} 1`] = `<button type="button" class="ant-btn ant-btn-default"><span>0</span></button>`;
|
||||
|
||||
exports[`Button fixbug renders {0} , 0 and {false} 2`] = `<button type="button" class="ant-btn ant-btn-default"><span>0</span></button>`;
|
||||
|
||||
exports[`Button fixbug renders {0} , 0 and {false} 3`] = `<button type="button" class="ant-btn ant-btn-default"></button>`;
|
||||
|
||||
exports[`Button renders Chinese characters correctly 1`] = `
|
||||
<button type="button" class="ant-btn ant-btn-default">
|
||||
<i class="anticon anticon-search"></i><span>按钮</span></button>
|
||||
`;
|
||||
|
||||
exports[`Button renders Chinese characters correctly 2`] = `
|
||||
<button type="button" class="ant-btn ant-btn-default">
|
||||
<i class="anticon anticon-search"></i>按钮</button>
|
||||
`;
|
||||
|
||||
exports[`Button renders correctly 1`] = `<button type="button" class="ant-btn ant-btn-default"><span>Follow</span></button>`;
|
||||
|
||||
exports[`Button should support link button 1`] = `<button target="_blank" href="http://ant.design" type="button" class="ant-btn ant-btn-default"><span>link button</span></button>`;
|
||||
|
|
@ -1,9 +1,19 @@
|
|||
import Button from '../index'
|
||||
import Icon from '../../icon'
|
||||
import { mount } from '@vue/test-utils'
|
||||
import { renderToString } from '@vue/server-test-utils'
|
||||
import Vue from 'vue'
|
||||
|
||||
describe('Button', () => {
|
||||
it('renders correctly', () => {
|
||||
const wrapper = renderToString({
|
||||
render () {
|
||||
return <Button>Follow</Button>
|
||||
},
|
||||
})
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('create primary button', () => {
|
||||
const wrapper = mount({
|
||||
render (h) {
|
||||
|
|
@ -12,124 +22,125 @@ describe('Button', () => {
|
|||
})
|
||||
expect(wrapper.contains('.ant-btn-primary')).toBe(true)
|
||||
})
|
||||
// it('renders Chinese characters correctly', (done) => {
|
||||
// const wrapper = mount(
|
||||
// {
|
||||
// render (h) {
|
||||
// return <Button>按钮</Button>
|
||||
// },
|
||||
// }
|
||||
// )
|
||||
// expect(wrapper.text()).to.equal('按 钮')
|
||||
|
||||
// const wrapper1 = mount(
|
||||
// {
|
||||
// render (h) {
|
||||
// return <Button icon='search'>按钮</Button>
|
||||
// },
|
||||
// }
|
||||
// )
|
||||
// expect(wrapper1.text()).to.equal('按钮')
|
||||
it('renders Chinese characters correctly', (done) => {
|
||||
const wrapper = mount(
|
||||
{
|
||||
render (h) {
|
||||
return <Button>按钮</Button>
|
||||
},
|
||||
}
|
||||
)
|
||||
expect(wrapper.text()).toBe('按 钮')
|
||||
|
||||
// const wrapper2 = mount(
|
||||
// {
|
||||
// render (h) {
|
||||
// return <Button><Icon type="search" />按钮</Button>
|
||||
// },
|
||||
// }
|
||||
// )
|
||||
// expect(wrapper2.text()).to.equal('按钮')
|
||||
const wrapper1 = renderToString(
|
||||
{
|
||||
render (h) {
|
||||
return <Button icon='search'>按钮</Button>
|
||||
},
|
||||
}
|
||||
)
|
||||
expect(wrapper1).toMatchSnapshot()
|
||||
|
||||
// const wrapper3 = mount(
|
||||
// {
|
||||
// render (h) {
|
||||
// return <Button><span>按钮</span></Button>
|
||||
// },
|
||||
// }
|
||||
// )
|
||||
// Vue.nextTick(() => {
|
||||
// expect(wrapper3.find('.ant-btn')[0].hasClass('ant-btn-two-chinese-chars')).to.equal(true);
|
||||
// done()
|
||||
// })
|
||||
// })
|
||||
// it('should change loading state instantly by default', () => {
|
||||
// const DefaultButton = {
|
||||
// data(){
|
||||
// return {
|
||||
// loading: false,
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// enterLoading () {
|
||||
// this.loading = true
|
||||
// }
|
||||
// },
|
||||
const wrapper2 = renderToString(
|
||||
{
|
||||
render (h) {
|
||||
return <Button><Icon type='search' />按钮</Button>
|
||||
},
|
||||
}
|
||||
)
|
||||
expect(wrapper2).toMatchSnapshot()
|
||||
|
||||
// render() {
|
||||
// return <Button loading={this.loading} onClick={this.enterLoading}>Button</Button>;
|
||||
// }
|
||||
// }
|
||||
// const wrapper = mount(DefaultButton)
|
||||
// wrapper.trigger('click');
|
||||
// Vue.nextTick(() => {
|
||||
// expect(wrapper.find('.ant-btn-loading').length).to.equal(1);
|
||||
// })
|
||||
// });
|
||||
const wrapper3 = mount(
|
||||
{
|
||||
render (h) {
|
||||
return <Button><span>按钮</span></Button>
|
||||
},
|
||||
}
|
||||
)
|
||||
Vue.nextTick(() => {
|
||||
expect(wrapper3.find('.ant-btn').contains('.ant-btn-two-chinese-chars')).toBe(true)
|
||||
done()
|
||||
})
|
||||
})
|
||||
it('should change loading state instantly by default', () => {
|
||||
const DefaultButton = {
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
enterLoading () {
|
||||
this.loading = true
|
||||
},
|
||||
},
|
||||
|
||||
// it('should change loading state with delay', () => {
|
||||
// const DefaultButton = {
|
||||
// data(){
|
||||
// return {
|
||||
// loading: false,
|
||||
// }
|
||||
// },
|
||||
// methods: {
|
||||
// enterLoading () {
|
||||
// this.loading = { delay: 1000 }
|
||||
// }
|
||||
// },
|
||||
render () {
|
||||
return <Button loading={this.loading} onClick={this.enterLoading}>Button</Button>
|
||||
},
|
||||
}
|
||||
const wrapper = mount(DefaultButton)
|
||||
wrapper.trigger('click')
|
||||
Vue.nextTick(() => {
|
||||
expect(wrapper.findAll('.ant-btn-loading').length).toBe(1)
|
||||
})
|
||||
})
|
||||
|
||||
// render() {
|
||||
// return <Button loading={this.loading} onClick={this.enterLoading}>Button</Button>;
|
||||
// }
|
||||
// }
|
||||
// const wrapper = mount(DefaultButton)
|
||||
// wrapper.trigger('click');
|
||||
// Vue.nextTick(() => {
|
||||
// expect(wrapper.hasClass('ant-btn-loading').length).to.equal(false);
|
||||
// })
|
||||
// });
|
||||
it('should change loading state with delay', (done) => {
|
||||
const DefaultButton = {
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
enterLoading () {
|
||||
this.loading = { delay: 1000 }
|
||||
},
|
||||
},
|
||||
|
||||
// it('should support link button', () => {
|
||||
// const wrapper = mount({
|
||||
// render (h) {
|
||||
// return <Button target="_blank" href="http://ant.design">link button</Button>
|
||||
// },
|
||||
// })
|
||||
// expect(wrapper.html()).to.matchSnapshot();
|
||||
// })
|
||||
render () {
|
||||
return <Button loading={this.loading} onClick={this.enterLoading}>Button</Button>
|
||||
},
|
||||
}
|
||||
const wrapper = mount(DefaultButton)
|
||||
wrapper.trigger('click')
|
||||
Vue.nextTick(() => {
|
||||
expect(wrapper.contains('.ant-btn-loading')).toBe(false)
|
||||
done()
|
||||
})
|
||||
})
|
||||
|
||||
// it('fixbug renders {0} , 0 and {false}', () => {
|
||||
// const wrapper = mount({
|
||||
// render (h) {
|
||||
// return <Button>{0}</Button>
|
||||
// },
|
||||
// })
|
||||
// expect(wrapper.html()).to.matchSnapshot();
|
||||
it('should support link button', () => {
|
||||
const wrapper = mount({
|
||||
render (h) {
|
||||
return <Button target='_blank' href='http://ant.design'>link button</Button>
|
||||
},
|
||||
})
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
// const wrapper1 = mount({
|
||||
// render (h) {
|
||||
// return <Button>0</Button>
|
||||
// },
|
||||
// })
|
||||
// expect(wrapper1.html()).to.matchSnapshot();
|
||||
it('fixbug renders {0} , 0 and {false}', () => {
|
||||
const wrapper = mount({
|
||||
render (h) {
|
||||
return <Button>{0}</Button>
|
||||
},
|
||||
})
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
|
||||
// const wrapper2 = mount({
|
||||
// render (h) {
|
||||
// return <Button>{false}</Button>
|
||||
// },
|
||||
// })
|
||||
// expect(wrapper2.html()).to.matchSnapshot();
|
||||
const wrapper1 = mount({
|
||||
render (h) {
|
||||
return <Button>0</Button>
|
||||
},
|
||||
})
|
||||
expect(wrapper1.html()).toMatchSnapshot()
|
||||
|
||||
// })
|
||||
const wrapper2 = mount({
|
||||
render (h) {
|
||||
return <Button>{false}</Button>
|
||||
},
|
||||
})
|
||||
expect(wrapper2.html()).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/* @remove-on-es-build-begin */
|
||||
// this file is not used if use https://github.com/ant-design/babel-plugin-import
|
||||
const ENV = process.env.NODE_ENV
|
||||
if (ENV !== 'production' &&
|
||||
if (ENV !== 'production' && ENV !== 'test' &&
|
||||
typeof console !== 'undefined' &&
|
||||
console.warn &&
|
||||
typeof window !== 'undefined') {
|
||||
|
|
|
|||
|
|
@ -116,12 +116,10 @@
|
|||
"merge2": "^1.2.1",
|
||||
"minimist": "^1.2.0",
|
||||
"mkdirp": "^0.5.1",
|
||||
"mocha": "^3.5.3",
|
||||
"mockdate": "^2.0.2",
|
||||
"postcss": "^6.0.20",
|
||||
"postcss-loader": "^2.1.2",
|
||||
"pre-commit": "^1.2.2",
|
||||
"puppeteer": "^1.3.0",
|
||||
"querystring": "^0.2.0",
|
||||
"raw-loader": "^1.0.0-beta.0",
|
||||
"reqwest": "^2.0.5",
|
||||
|
|
@ -129,8 +127,6 @@
|
|||
"rucksack-css": "^1.0.2",
|
||||
"selenium-server": "^3.0.1",
|
||||
"semver": "^5.3.0",
|
||||
"sinon": "^4.0.2",
|
||||
"sinon-chai": "^2.8.0",
|
||||
"style-loader": "^0.18.2",
|
||||
"stylelint": "^8.1.1",
|
||||
"stylelint-config-standard": "^17.0.0",
|
||||
|
|
|
|||
Loading…
Reference in New Issue