mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[Improvement] PullRefresh: add test cases (#1189)
This commit is contained in:
parent
6f74201b29
commit
fc3f3bc7e0
77
packages/pull-refresh/test/__snapshots__/index.spec.js.snap
Normal file
77
packages/pull-refresh/test/__snapshots__/index.spec.js.snap
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
|
exports[`change head content when pulling down 1`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!----><span class="van-pull-refresh__text">下拉即可刷新...</span>
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`change head content when pulling down 2`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!---->
|
||||||
|
<!----><span class="van-pull-refresh__text">释放即可刷新...</span>
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`change head content when pulling down 3`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<div class="van-pull-refresh__loading">
|
||||||
|
<div class="van-loading van-loading--circular van-loading--black"><span class="van-loading__spinner van-loading__spinner--circular"> <svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div> <span>加载中...</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`change head content when pulling down 4`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<div class="van-pull-refresh__loading">
|
||||||
|
<div class="van-loading van-loading--circular van-loading--black"><span class="van-loading__spinner van-loading__spinner--circular"> <svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div> <span>加载中...</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`change head content when pulling down 5`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`not in page top 1`] = `
|
||||||
|
<div class="van-pull-refresh">
|
||||||
|
<div class="van-pull-refresh__track">
|
||||||
|
<div class="van-pull-refresh__head">
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
<!---->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
71
packages/pull-refresh/test/index.spec.js
Normal file
71
packages/pull-refresh/test/index.spec.js
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
import PullRefresh from '..';
|
||||||
|
import { mount } from '@vue/test-utils';
|
||||||
|
import { triggerTouch, triggerDrag } from '../../../test/touch-utils';
|
||||||
|
|
||||||
|
test('change head content when pulling down', () => {
|
||||||
|
const wrapper = mount(PullRefresh, {
|
||||||
|
propsData: {
|
||||||
|
value: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
wrapper.vm.$on('input', value => {
|
||||||
|
wrapper.vm.value = value;
|
||||||
|
});
|
||||||
|
|
||||||
|
const track = wrapper.find('.van-pull-refresh__track');
|
||||||
|
|
||||||
|
// pulling
|
||||||
|
triggerTouch(track, 'touchstart', 0, 0);
|
||||||
|
triggerTouch(track, 'touchmove', 0, 10);
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
|
||||||
|
// loosing
|
||||||
|
triggerTouch(track, 'touchmove', 0, 100);
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
|
||||||
|
// loading
|
||||||
|
triggerTouch(track, 'touchend', 0, 100);
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
|
||||||
|
// still loading
|
||||||
|
triggerDrag(track, 0, 100);
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
|
||||||
|
expect(wrapper.emitted('input')).toBeTruthy();
|
||||||
|
expect(wrapper.emitted('refresh')).toBeTruthy();
|
||||||
|
|
||||||
|
// end loading
|
||||||
|
wrapper.vm.value = false;
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('pull a short distance', () => {
|
||||||
|
const wrapper = mount(PullRefresh, {
|
||||||
|
propsData: {
|
||||||
|
value: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const track = wrapper.find('.van-pull-refresh__track');
|
||||||
|
triggerDrag(track, 0, 10);
|
||||||
|
expect(wrapper.emitted('input')).toBeFalsy();
|
||||||
|
});
|
||||||
|
|
||||||
|
test('not in page top', () => {
|
||||||
|
const wrapper = mount(PullRefresh, {
|
||||||
|
propsData: {
|
||||||
|
value: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
window.scrollTop = 100;
|
||||||
|
|
||||||
|
const track = wrapper.find('.van-pull-refresh__track');
|
||||||
|
// ignore touch event when not at page top
|
||||||
|
triggerDrag(track, 0, 100);
|
||||||
|
window.scrollTop = 0;
|
||||||
|
triggerTouch(track, 'touchmove', 0, 100);
|
||||||
|
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
});
|
Loading…
x
Reference in New Issue
Block a user