test: prefer using classes

This commit is contained in:
chenjiahan 2021-01-02 21:00:11 +08:00
parent c261bcc4a7
commit 866d9c0381
4 changed files with 22 additions and 21 deletions

View File

@ -47,9 +47,7 @@ test('should render "van-checkbox--label-disabled" class when using label-disabl
},
});
expect(
wrapper.element.classList.contains('van-checkbox--label-disabled')
).toBeTruthy();
expect(wrapper.classes()).toContain('van-checkbox--label-disabled');
});
test('should emit "update:modelValue" event when label is clicked', () => {

View File

@ -21,8 +21,8 @@ test('should allow to custom class name with class-name prop', () => {
},
});
const overlay = wrapper.find('.van-overlay').element;
expect(overlay.classList.contains('foo')).toBeTruthy();
const overlay = wrapper.find('.van-overlay');
expect(overlay.classes()).toContain('foo');
});
test('should allow to custom style with custom-style prop', () => {

View File

@ -68,10 +68,12 @@ test('should emit overlimit event when clicking disabled buttons', async () => {
test('should disable plus button when disable-plus prop is true', async () => {
const wrapper = mount(Stepper);
const plus = wrapper.find('.van-stepper__plus').element;
expect(plus.classList.contains('van-stepper__plus--disabled')).toBeFalsy();
const plus = wrapper.find('.van-stepper__plus');
expect(plus.classes()).not.toContain('van-stepper__plus--disabled');
await wrapper.setProps({ disablePlus: true });
expect(plus.classList.contains('van-stepper__plus--disabled')).toBeTruthy();
expect(plus.classes()).toContain('van-stepper__plus--disabled');
});
test('should disable minus button when disable-minus prop is true', async () => {
@ -80,10 +82,12 @@ test('should disable minus button when disable-minus prop is true', async () =>
modelValue: 2,
},
});
const minus = wrapper.find('.van-stepper__minus').element;
expect(minus.classList.contains('van-stepper__minus--disabled')).toBeFalsy();
const minus = wrapper.find('.van-stepper__minus');
expect(minus.classes()).not.toContain('van-stepper__minus--disabled');
await wrapper.setProps({ disableMinus: true });
expect(minus.classList.contains('van-stepper__minus--disabled')).toBeTruthy();
expect(minus.classes()).toContain('van-stepper__minus--disabled');
});
test('should limit max value when using max prop', async () => {

View File

@ -1,5 +1,6 @@
import { nextTick, reactive, ref } from 'vue';
import { mount, later, mockGetBoundingClientRect } from '../../../test';
import { BORDER_TOP_BOTTOM } from '../../utils/constant';
import Tabbar from '..';
import TabbarItem from '../../tabbar-item';
@ -56,16 +57,16 @@ test('should match active tab by route path in route mode', async () => {
const items = wrapper.findAll('.van-tabbar-item');
expect(items[0].element.classList.contains(activeClass)).toBeTruthy();
expect(items[0].classes()).toContain(activeClass);
await items[1].trigger('click');
expect(items[1].element.classList.contains(activeClass)).toBeTruthy();
expect(items[1].classes()).toContain(activeClass);
await items[2].trigger('click');
expect(items[2].element.classList.contains(activeClass)).toBeTruthy();
expect(items[2].classes()).toContain(activeClass);
await items[3].trigger('click');
expect(items[2].element.classList.contains(activeClass)).toBeTruthy();
expect(items[3].classes()).not.toContain(activeClass);
});
test('should match active tab by route name in route mode', async () => {
@ -88,10 +89,10 @@ test('should match active tab by route name in route mode', async () => {
const items = wrapper.findAll('.van-tabbar-item');
await items[0].trigger('click');
expect(items[0].element.classList.contains(activeClass)).toBeTruthy();
expect(items[0].classes()).toContain(activeClass);
await items[1].trigger('click');
expect(items[1].element.classList.contains(activeClass)).toBeTruthy();
expect(items[1].classes()).toContain(activeClass);
});
test('should watch model-value and update active tab', async () => {
@ -119,7 +120,7 @@ test('should watch model-value and update active tab', async () => {
wrapper.vm.updateActive();
await nextTick();
const items = wrapper.findAll('.van-tabbar-item');
expect(items[1].element.classList.contains(activeClass)).toBeTruthy();
expect(items[1].classes()).toContain(activeClass);
});
test('should match active tab by name when using name prop', () => {
@ -152,9 +153,7 @@ test('should not render border when border prop is false', () => {
},
});
expect(
wrapper.element.classList.contains('van-hairline--top-bottom')
).toBeFalsy();
expect(wrapper.classes()).not.toContain(BORDER_TOP_BOTTOM);
});
test('should render placeholder element when using placeholder prop', async () => {