mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
breaking change: event name become camelCase
This commit is contained in:
parent
c9c312c4ba
commit
8ca9741845
@ -102,11 +102,11 @@ export default defineComponent({
|
||||
'save',
|
||||
'focus',
|
||||
'delete',
|
||||
'click-area',
|
||||
'change-area',
|
||||
'change-detail',
|
||||
'select-search',
|
||||
'change-default',
|
||||
'clickArea',
|
||||
'changeArea',
|
||||
'changeDetail',
|
||||
'selectSearch',
|
||||
'changeDefault',
|
||||
],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
@ -188,7 +188,7 @@ export default defineComponent({
|
||||
|
||||
const onChangeDetail = (val: string) => {
|
||||
data.addressDetail = val;
|
||||
emit('change-detail', val);
|
||||
emit('changeDetail', val);
|
||||
};
|
||||
|
||||
const onAreaConfirm = (values: AreaColumnOption[]) => {
|
||||
@ -199,7 +199,7 @@ export default defineComponent({
|
||||
} else {
|
||||
showAreaPopup.value = false;
|
||||
assignAreaValues();
|
||||
emit('change-area', values);
|
||||
emit('changeArea', values);
|
||||
}
|
||||
};
|
||||
|
||||
@ -235,7 +235,7 @@ export default defineComponent({
|
||||
<Switch
|
||||
v-model={data.isDefault}
|
||||
size="24"
|
||||
onChange={(event) => emit('change-default', event)}
|
||||
onChange={(event) => emit('changeDefault', event)}
|
||||
/>
|
||||
),
|
||||
};
|
||||
@ -309,7 +309,7 @@ export default defineComponent({
|
||||
placeholder={props.areaPlaceholder || t('area')}
|
||||
onFocus={() => onFocus('areaCode')}
|
||||
onClick={() => {
|
||||
emit('click-area');
|
||||
emit('clickArea');
|
||||
showAreaPopup.value = !disableArea;
|
||||
}}
|
||||
/>
|
||||
@ -325,7 +325,7 @@ export default defineComponent({
|
||||
onBlur={onDetailBlur}
|
||||
onFocus={() => onFocus('addressDetail')}
|
||||
onInput={onChangeDetail}
|
||||
onSelect-search={(event: Event) => emit('select-search', event)}
|
||||
onSelectSearch={(event: Event) => emit('selectSearch', event)}
|
||||
/>
|
||||
{props.showPostal && (
|
||||
<Field
|
||||
|
@ -28,7 +28,7 @@ export default defineComponent({
|
||||
showSearchResult: Boolean,
|
||||
},
|
||||
|
||||
emits: ['blur', 'focus', 'input', 'select-search'],
|
||||
emits: ['blur', 'focus', 'input', 'selectSearch'],
|
||||
|
||||
setup(props, { emit }) {
|
||||
const field = ref<FieldInstance>();
|
||||
@ -37,7 +37,7 @@ export default defineComponent({
|
||||
props.focused && props.searchResult && props.showSearchResult;
|
||||
|
||||
const onSelect = (express: AddressEditSearchItem) => {
|
||||
emit('select-search', express);
|
||||
emit('selectSearch', express);
|
||||
emit('input', `${express.address || ''} ${express.name || ''}`.trim());
|
||||
};
|
||||
|
||||
|
@ -112,13 +112,13 @@ test('should valid postal code and render error message correctly', async () =>
|
||||
expect(fields[4].html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should emit change-detail event after changing address detail', () => {
|
||||
test('should emit changeDetail event after changing address detail', () => {
|
||||
const wrapper = mount(AddressEdit);
|
||||
const field = wrapper.findAll('.van-field__control')[3];
|
||||
|
||||
field.element.value = '123';
|
||||
field.trigger('input');
|
||||
expect(wrapper.emitted('change-detail')[0][0]).toEqual('123');
|
||||
expect(wrapper.emitted('changeDetail')[0][0]).toEqual('123');
|
||||
});
|
||||
|
||||
test('should return current areas after calling getArea method', () => {
|
||||
@ -204,7 +204,7 @@ test('should update address detail after calling the setAddressDetail method', a
|
||||
expect(textarea.element.value).toEqual('test');
|
||||
});
|
||||
|
||||
test('should emit click-area event after clicking the area field', () => {
|
||||
test('should emit clickArea event after clicking the area field', () => {
|
||||
const wrapper = mount(AddressEdit, {
|
||||
props: {
|
||||
disableArea: true,
|
||||
@ -213,7 +213,7 @@ test('should emit click-area event after clicking the area field', () => {
|
||||
|
||||
const field = wrapper.findAll('.van-field')[2];
|
||||
field.trigger('click');
|
||||
expect(wrapper.emitted('click-area')[0]).toBeTruthy();
|
||||
expect(wrapper.emitted('clickArea')[0]).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should limit tel maxlength when using tel-maxlength prop', () => {
|
||||
|
@ -36,9 +36,9 @@ export default defineComponent({
|
||||
'add',
|
||||
'edit',
|
||||
'select',
|
||||
'click-item',
|
||||
'edit-disabled',
|
||||
'select-disabled',
|
||||
'clickItem',
|
||||
'editDisabled',
|
||||
'selectDisabled',
|
||||
'update:modelValue',
|
||||
],
|
||||
|
||||
@ -49,12 +49,12 @@ export default defineComponent({
|
||||
disabled?: boolean
|
||||
) => {
|
||||
const onEdit = () =>
|
||||
emit(disabled ? 'edit-disabled' : 'edit', item, index);
|
||||
emit(disabled ? 'editDisabled' : 'edit', item, index);
|
||||
|
||||
const onClick = () => emit('click-item', item, index);
|
||||
const onClick = () => emit('clickItem', item, index);
|
||||
|
||||
const onSelect = () => {
|
||||
emit(disabled ? 'select-disabled' : 'select', item, index);
|
||||
emit(disabled ? 'selectDisabled' : 'select', item, index);
|
||||
|
||||
if (!disabled) {
|
||||
emit('update:modelValue', item.id);
|
||||
|
@ -39,7 +39,7 @@ test('should emit select event after clicking radio icon', () => {
|
||||
expect(wrapper.emitted('select')![0]).toEqual([list[0], 0]);
|
||||
});
|
||||
|
||||
test('should emit click-item event when item is clicked', () => {
|
||||
test('should emit clickItem event when item is clicked', () => {
|
||||
const wrapper = mount(AddressList, {
|
||||
props: {
|
||||
list,
|
||||
@ -48,7 +48,7 @@ test('should emit click-item event when item is clicked', () => {
|
||||
|
||||
wrapper.find('.van-address-item').trigger('click');
|
||||
|
||||
expect(wrapper.emitted('click-item')![0]).toEqual([list[0], 0]);
|
||||
expect(wrapper.emitted('clickItem')![0]).toEqual([list[0], 0]);
|
||||
});
|
||||
|
||||
test('should render tag slot correctly', () => {
|
||||
|
@ -111,10 +111,10 @@ export default defineComponent({
|
||||
'select',
|
||||
'confirm',
|
||||
'unselect',
|
||||
'month-show',
|
||||
'over-range',
|
||||
'monthShow',
|
||||
'overRange',
|
||||
'update:show',
|
||||
'click-subtitle',
|
||||
'clickSubtitle',
|
||||
],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
@ -243,7 +243,7 @@ export default defineComponent({
|
||||
|
||||
if (!monthRefs.value[i].showed) {
|
||||
monthRefs.value[i].showed = true;
|
||||
emit('month-show', {
|
||||
emit('monthShow', {
|
||||
date: month.date,
|
||||
title: month.getTitle(),
|
||||
});
|
||||
@ -323,7 +323,7 @@ export default defineComponent({
|
||||
if (showRangePrompt) {
|
||||
Toast(rangePrompt || t('rangePrompt', maxRange));
|
||||
}
|
||||
emit('over-range');
|
||||
emit('overRange');
|
||||
return false;
|
||||
}
|
||||
|
||||
@ -522,9 +522,7 @@ export default defineComponent({
|
||||
showTitle={props.showTitle}
|
||||
showSubtitle={props.showSubtitle}
|
||||
firstDayOfWeek={dayOffset.value}
|
||||
onClick-subtitle={(event: MouseEvent) =>
|
||||
emit('click-subtitle', event)
|
||||
}
|
||||
onClickSubtitle={(event: MouseEvent) => emit('clickSubtitle', event)}
|
||||
/>
|
||||
<div ref={bodyRef} class={bem('body')} onScroll={onScroll}>
|
||||
{months.value.map(renderMonth)}
|
||||
|
@ -15,7 +15,7 @@ export default defineComponent({
|
||||
firstDayOfWeek: Number,
|
||||
},
|
||||
|
||||
emits: ['click-subtitle'],
|
||||
emits: ['clickSubtitle'],
|
||||
|
||||
setup(props, { slots, emit }) {
|
||||
const renderTitle = () => {
|
||||
@ -26,8 +26,7 @@ export default defineComponent({
|
||||
}
|
||||
};
|
||||
|
||||
const onClickSubtitle = (event: MouseEvent) =>
|
||||
emit('click-subtitle', event);
|
||||
const onClickSubtitle = (event: MouseEvent) => emit('clickSubtitle', event);
|
||||
|
||||
const renderSubtitle = () => {
|
||||
if (props.showSubtitle) {
|
||||
|
@ -62,7 +62,7 @@ export default defineComponent({
|
||||
|
||||
props: calendarMonthProps,
|
||||
|
||||
emits: ['click', 'update-height'],
|
||||
emits: ['click'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const [visible, setVisible] = useToggle();
|
||||
|
@ -555,7 +555,7 @@ test('should render top-info and bottom-info slot correctly', async () => {
|
||||
expect(wrapper.find('.van-calendar__day').html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should emit click-subtitle event when clicking the subtitle', async () => {
|
||||
test('should emit clickSubtitle event when clicking the subtitle', async () => {
|
||||
const wrapper = mount(Calendar, {
|
||||
props: {
|
||||
minDate,
|
||||
@ -567,7 +567,7 @@ test('should emit click-subtitle event when clicking the subtitle', async () =>
|
||||
|
||||
await later();
|
||||
wrapper.find('.van-calendar__header-subtitle').trigger('click');
|
||||
expect(wrapper.emitted('click-subtitle')).toBeTruthy();
|
||||
expect(wrapper.emitted('clickSubtitle')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should render confirm-text slot correctly', async () => {
|
||||
|
@ -167,7 +167,7 @@ test('lazy-render prop', () => {
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('month-show event', async () => {
|
||||
test('monthShow event', async () => {
|
||||
const wrapper = mount(Calendar, {
|
||||
props: {
|
||||
show: true,
|
||||
@ -175,7 +175,7 @@ test('month-show event', async () => {
|
||||
});
|
||||
await later(200);
|
||||
|
||||
expect(wrapper.emitted('month-show')).toBeTruthy();
|
||||
expect(wrapper.emitted('monthShow')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('first day of week', async () => {
|
||||
@ -248,7 +248,7 @@ test('should disabled prompt when using show-range-prompt prop', async () => {
|
||||
expect(document.querySelector('.van-toast')).toBeFalsy();
|
||||
});
|
||||
|
||||
test('should emit over-range when exceeded max range', async () => {
|
||||
test('should emit overRange when exceeded max range', async () => {
|
||||
const onOverRange = jest.fn();
|
||||
const wrapper = mount(Calendar, {
|
||||
props: {
|
||||
|
@ -30,7 +30,7 @@ export default defineComponent({
|
||||
|
||||
props: cardProps,
|
||||
|
||||
emits: ['click-thumb'],
|
||||
emits: ['clickThumb'],
|
||||
|
||||
setup(props, { slots, emit }) {
|
||||
const renderTitle = () => {
|
||||
@ -85,7 +85,7 @@ export default defineComponent({
|
||||
<a
|
||||
href={props.thumbLink}
|
||||
class={bem('thumb')}
|
||||
onClick={(event: MouseEvent) => emit('click-thumb', event)}
|
||||
onClick={(event: MouseEvent) => emit('clickThumb', event)}
|
||||
>
|
||||
{renderThumbImage()}
|
||||
{renderThumbTag()}
|
||||
|
@ -12,7 +12,7 @@ test('should emit click event after clicked', () => {
|
||||
expect(onClick).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
test('should emit click-thumb event after clicking thumb', () => {
|
||||
test('should emit clickThumb event after clicking thumb', () => {
|
||||
const wrapper = mount(Card, {
|
||||
props: {
|
||||
thumb: 'xx',
|
||||
@ -20,7 +20,7 @@ test('should emit click-thumb event after clicking thumb', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-card__thumb').trigger('click');
|
||||
expect(wrapper.emitted('click-thumb')!).toHaveLength(1);
|
||||
expect(wrapper.emitted('clickThumb')!).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('should render price and num slot correctly', () => {
|
||||
|
@ -47,7 +47,7 @@ export default defineComponent({
|
||||
|
||||
props: cascaderProps,
|
||||
|
||||
emits: ['close', 'change', 'finish', 'click-tab', 'update:modelValue'],
|
||||
emits: ['close', 'change', 'finish', 'clickTab', 'update:modelValue'],
|
||||
|
||||
setup(props, { slots, emit }) {
|
||||
const tabs = ref<CascaderTab[]>([]);
|
||||
@ -184,7 +184,7 @@ export default defineComponent({
|
||||
const onClose = () => emit('close');
|
||||
|
||||
const onClickTab = ({ name, title }: TabsClickTabEventParams) =>
|
||||
emit('click-tab', name, title);
|
||||
emit('clickTab', name, title);
|
||||
|
||||
const renderHeader = () =>
|
||||
props.showHeader ? (
|
||||
@ -276,7 +276,7 @@ export default defineComponent({
|
||||
class={bem('tabs')}
|
||||
color={props.activeColor}
|
||||
swipeable={props.swipeable}
|
||||
onClick-tab={onClickTab}
|
||||
onClickTab={onClickTab}
|
||||
>
|
||||
{tabs.value.map(renderTab)}
|
||||
</Tabs>
|
||||
|
@ -190,7 +190,7 @@ test('should allow to custom field names', async () => {
|
||||
]);
|
||||
});
|
||||
|
||||
test('should emit click-tab event when a tab is clicked', async () => {
|
||||
test('should emit clickTab event when a tab is clicked', async () => {
|
||||
const wrapper = mount(Cascader, {
|
||||
props: {
|
||||
options,
|
||||
@ -209,10 +209,10 @@ test('should emit click-tab event when a tab is clicked', async () => {
|
||||
const tabs = wrapper.findAll('.van-tab');
|
||||
|
||||
tabs[0].trigger('click');
|
||||
expect(wrapper.emitted('click-tab')![0]).toEqual([0, options[0].text]);
|
||||
expect(wrapper.emitted('clickTab')![0]).toEqual([0, options[0].text]);
|
||||
|
||||
tabs[1].trigger('click');
|
||||
expect(wrapper.emitted('click-tab')![1]).toEqual([
|
||||
expect(wrapper.emitted('clickTab')![1]).toEqual([
|
||||
1,
|
||||
options[0].children[0].text,
|
||||
]);
|
||||
|
@ -52,7 +52,7 @@ export default defineComponent({
|
||||
|
||||
props: contactEditProps,
|
||||
|
||||
emits: ['save', 'delete', 'change-default'],
|
||||
emits: ['save', 'delete', 'changeDefault'],
|
||||
|
||||
setup(props, { emit }) {
|
||||
const contact = reactive(extend({}, DEFAULT_CONTACT, props.contactInfo));
|
||||
@ -93,7 +93,7 @@ export default defineComponent({
|
||||
<Switch
|
||||
v-model={contact.isDefault}
|
||||
size={24}
|
||||
onChange={(checked: boolean) => emit('change-default', checked)}
|
||||
onChange={(checked: boolean) => emit('changeDefault', checked)}
|
||||
/>
|
||||
);
|
||||
|
||||
|
@ -124,9 +124,9 @@ export default defineComponent({
|
||||
'focus',
|
||||
'clear',
|
||||
'keypress',
|
||||
'click-input',
|
||||
'click-left-icon',
|
||||
'click-right-icon',
|
||||
'clickInput',
|
||||
'clickLeftIcon',
|
||||
'clickRightIcon',
|
||||
'update:modelValue',
|
||||
],
|
||||
|
||||
@ -332,13 +332,12 @@ export default defineComponent({
|
||||
resetScroll();
|
||||
};
|
||||
|
||||
const onClickInput = (event: MouseEvent) => emit('click-input', event);
|
||||
const onClickInput = (event: MouseEvent) => emit('clickInput', event);
|
||||
|
||||
const onClickLeftIcon = (event: MouseEvent) =>
|
||||
emit('click-left-icon', event);
|
||||
const onClickLeftIcon = (event: MouseEvent) => emit('clickLeftIcon', event);
|
||||
|
||||
const onClickRightIcon = (event: MouseEvent) =>
|
||||
emit('click-right-icon', event);
|
||||
emit('clickRightIcon', event);
|
||||
|
||||
const onClear = (event: MouseEvent) => {
|
||||
preventDefault(event);
|
||||
|
@ -10,13 +10,13 @@ test('should emit "update:modelValue" event when after inputting', () => {
|
||||
expect(wrapper.emitted('update:modelValue')[0][0]).toEqual('1');
|
||||
});
|
||||
|
||||
test('should emit click-input event when input is clicked', () => {
|
||||
test('should emit clickInput event when input is clicked', () => {
|
||||
const wrapper = mount(Field);
|
||||
wrapper.find('input').trigger('click');
|
||||
expect(wrapper.emitted('click-input')[0][0]).toBeTruthy();
|
||||
expect(wrapper.emitted('clickInput')[0][0]).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should emit click-input event when using input slot', () => {
|
||||
test('should emit clickInput event when using input slot', () => {
|
||||
const wrapper = mount(Field, {
|
||||
slots: {
|
||||
input: () => 'Custom Input',
|
||||
@ -24,10 +24,10 @@ test('should emit click-input event when using input slot', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__control').trigger('click');
|
||||
expect(wrapper.emitted('click-input')[0][0]).toBeTruthy();
|
||||
expect(wrapper.emitted('clickInput')[0][0]).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should emit click-left-icon event when left icon is clicked', () => {
|
||||
test('should emit clickLeftIcon event when left icon is clicked', () => {
|
||||
const wrapper = mount(Field, {
|
||||
props: {
|
||||
leftIcon: 'contact',
|
||||
@ -35,10 +35,10 @@ test('should emit click-left-icon event when left icon is clicked', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__left-icon').trigger('click');
|
||||
expect(wrapper.emitted('click-left-icon')[0][0]).toBeTruthy();
|
||||
expect(wrapper.emitted('clickLeftIcon')[0][0]).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should emit click-right-icon event when right icon is clicked', () => {
|
||||
test('should emit clickRightIcon event when right icon is clicked', () => {
|
||||
const wrapper = mount(Field, {
|
||||
props: {
|
||||
rightIcon: 'search',
|
||||
@ -46,7 +46,7 @@ test('should emit click-right-icon event when right icon is clicked', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-field__right-icon').trigger('click');
|
||||
expect(wrapper.emitted('click-right-icon')[0][0]).toBeTruthy();
|
||||
expect(wrapper.emitted('clickRightIcon')[0][0]).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should format input value when type is number', () => {
|
||||
|
@ -42,14 +42,14 @@ export default defineComponent({
|
||||
|
||||
props: navBarProps,
|
||||
|
||||
emits: ['click-left', 'click-right'],
|
||||
emits: ['clickLeft', 'clickRight'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const navBarRef = ref<HTMLElement>();
|
||||
const renderPlaceholder = usePlaceholder(navBarRef, bem);
|
||||
|
||||
const onClickLeft = (event: MouseEvent) => emit('click-left', event);
|
||||
const onClickRight = (event: MouseEvent) => emit('click-right', event);
|
||||
const onClickLeft = (event: MouseEvent) => emit('clickLeft', event);
|
||||
const onClickRight = (event: MouseEvent) => emit('clickRight', event);
|
||||
|
||||
const renderLeft = () => {
|
||||
if (slots.left) {
|
||||
|
@ -45,7 +45,7 @@ test('should render placeholder element when using placeholder prop', async () =
|
||||
restore();
|
||||
});
|
||||
|
||||
test('should emit click-left event when clicking left text', () => {
|
||||
test('should emit clickLeft event when clicking left text', () => {
|
||||
const wrapper = mount(NavBar, {
|
||||
props: {
|
||||
leftText: 'left',
|
||||
@ -53,10 +53,10 @@ test('should emit click-left event when clicking left text', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-nav-bar__left').trigger('click');
|
||||
expect(wrapper.emitted('click-left')).toBeTruthy();
|
||||
expect(wrapper.emitted('clickLeft')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should emit click-right event when clicking right text', () => {
|
||||
test('should emit clickRight event when clicking right text', () => {
|
||||
const wrapper = mount(NavBar, {
|
||||
props: {
|
||||
rightText: 'right',
|
||||
@ -64,7 +64,7 @@ test('should emit click-right event when clicking right text', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-nav-bar__right').trigger('click');
|
||||
expect(wrapper.emitted('click-right')).toBeTruthy();
|
||||
expect(wrapper.emitted('clickRight')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should have safe-area-inset-top class when using safe-area-inset-top prop', () => {
|
||||
|
@ -147,7 +147,7 @@ test('should close popover when touch outside content', async () => {
|
||||
expect(wrapper.emitted('update:show')![0]).toEqual([false]);
|
||||
});
|
||||
|
||||
test('should emit click-overlay event when overlay is clicked', () => {
|
||||
test('should emit clickOverlay event when overlay is clicked', () => {
|
||||
const onClickOverlay = jest.fn();
|
||||
const wrapper = mount(Popover, {
|
||||
props: {
|
||||
|
@ -69,8 +69,8 @@ export default defineComponent({
|
||||
'opened',
|
||||
'closed',
|
||||
'update:show',
|
||||
'click-overlay',
|
||||
'click-close-icon',
|
||||
'clickOverlay',
|
||||
'clickCloseIcon',
|
||||
],
|
||||
|
||||
setup(props, { emit, attrs, slots }) {
|
||||
@ -124,7 +124,7 @@ export default defineComponent({
|
||||
};
|
||||
|
||||
const onClickOverlay = (event: MouseEvent) => {
|
||||
emit('click-overlay', event);
|
||||
emit('clickOverlay', event);
|
||||
|
||||
if (props.closeOnClickOverlay) {
|
||||
close();
|
||||
@ -148,7 +148,7 @@ export default defineComponent({
|
||||
};
|
||||
|
||||
const onClickCloseIcon = (event: MouseEvent) => {
|
||||
emit('click-close-icon', event);
|
||||
emit('clickCloseIcon', event);
|
||||
close();
|
||||
};
|
||||
|
||||
|
@ -93,7 +93,7 @@ test('should not render overlay when overlay prop is false', () => {
|
||||
expect(wrapper.find('.van-overlay').exists()).toBeFalsy();
|
||||
});
|
||||
|
||||
test('should emit click-overlay event when overlay is clicked', async () => {
|
||||
test('should emit clickOverlay event when overlay is clicked', async () => {
|
||||
wrapper = mount(Popup, {
|
||||
props: {
|
||||
show: true,
|
||||
@ -101,7 +101,7 @@ test('should emit click-overlay event when overlay is clicked', async () => {
|
||||
});
|
||||
const overlay = wrapper.find('.van-overlay');
|
||||
overlay.trigger('click');
|
||||
expect(wrapper.emitted('click-overlay')).toHaveLength(1);
|
||||
expect(wrapper.emitted('clickOverlay')).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('should emit open event when show prop is set to true', async () => {
|
||||
@ -182,7 +182,7 @@ test('should render close icon when using closeable prop', () => {
|
||||
expect(wrapper.emitted('update:show')[0][0]).toEqual(false);
|
||||
});
|
||||
|
||||
test('should emit click-close-icon event when close icon is clicked', () => {
|
||||
test('should emit clickCloseIcon event when close icon is clicked', () => {
|
||||
wrapper = mount(Popup, {
|
||||
propsData: {
|
||||
show: true,
|
||||
@ -191,7 +191,7 @@ test('should emit click-close-icon event when close icon is clicked', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-popup__close-icon').trigger('click');
|
||||
expect(wrapper.emitted('click-close-icon')).toHaveLength(1);
|
||||
expect(wrapper.emitted('clickCloseIcon')).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('should render correct close icon when using close-icon prop', () => {
|
||||
|
@ -46,9 +46,9 @@ export default defineComponent({
|
||||
'clear',
|
||||
'search',
|
||||
'cancel',
|
||||
'click-input',
|
||||
'click-left-icon',
|
||||
'click-right-icon',
|
||||
'clickInput',
|
||||
'clickLeftIcon',
|
||||
'clickRightIcon',
|
||||
'update:modelValue',
|
||||
],
|
||||
|
||||
@ -104,11 +104,10 @@ export default defineComponent({
|
||||
const onBlur = (event: Event) => emit('blur', event);
|
||||
const onFocus = (event: Event) => emit('focus', event);
|
||||
const onClear = (event: MouseEvent) => emit('clear', event);
|
||||
const onClickInput = (event: MouseEvent) => emit('click-input', event);
|
||||
const onClickLeftIcon = (event: MouseEvent) =>
|
||||
emit('click-left-icon', event);
|
||||
const onClickInput = (event: MouseEvent) => emit('clickInput', event);
|
||||
const onClickLeftIcon = (event: MouseEvent) => emit('clickLeftIcon', event);
|
||||
const onClickRightIcon = (event: MouseEvent) =>
|
||||
emit('click-right-icon', event);
|
||||
emit('clickRightIcon', event);
|
||||
|
||||
const fieldPropNames = Object.keys(fieldSharedProps) as Array<
|
||||
keyof typeof fieldSharedProps
|
||||
@ -132,9 +131,9 @@ export default defineComponent({
|
||||
onFocus={onFocus}
|
||||
onClear={onClear}
|
||||
onKeypress={onKeypress}
|
||||
onClick-input={onClickInput}
|
||||
onClick-left-icon={onClickLeftIcon}
|
||||
onClick-right-icon={onClickRightIcon}
|
||||
onClickInput={onClickInput}
|
||||
onClickLeftIcon={onClickLeftIcon}
|
||||
onClickRightIcon={onClickRightIcon}
|
||||
onUpdate:modelValue={onInput}
|
||||
{...fieldAttrs}
|
||||
/>
|
||||
|
@ -171,7 +171,7 @@ test('should render input name when using name prop', () => {
|
||||
expect(wrapper.find('input').element.getAttribute('name')).toEqual('foo');
|
||||
});
|
||||
|
||||
test('should emit click-left-icon event after clicking the left icon', async () => {
|
||||
test('should emit clickLeftIcon event after clicking the left icon', async () => {
|
||||
const wrapper = mount(Search, {
|
||||
props: {
|
||||
leftIcon: 'foo',
|
||||
@ -179,10 +179,10 @@ test('should emit click-left-icon event after clicking the left icon', async ()
|
||||
});
|
||||
|
||||
await wrapper.find('.van-field__left-icon').trigger('click');
|
||||
expect(wrapper.emitted('click-left-icon')).toHaveLength(1);
|
||||
expect(wrapper.emitted('clickLeftIcon')).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('should emit click-right-icon event after clicking the right icon', async () => {
|
||||
test('should emit clickRightIcon event after clicking the right icon', async () => {
|
||||
const wrapper = mount(Search, {
|
||||
props: {
|
||||
rightIcon: 'foo',
|
||||
@ -190,5 +190,5 @@ test('should emit click-right-icon event after clicking the right icon', async (
|
||||
});
|
||||
|
||||
await wrapper.find('.van-field__right-icon').trigger('click');
|
||||
expect(wrapper.emitted('click-right-icon')).toHaveLength(1);
|
||||
expect(wrapper.emitted('clickRightIcon')).toHaveLength(1);
|
||||
});
|
||||
|
@ -86,7 +86,7 @@ test('should render title and description slot correctly', () => {
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should emit click-overlay event when overlay is clicked', async () => {
|
||||
test('should emit clickOverlay event when overlay is clicked', async () => {
|
||||
const root = document.createElement('div');
|
||||
const onClickOverlay = jest.fn();
|
||||
const wrapper = mount(ShareSheet, {
|
||||
|
@ -56,7 +56,7 @@ export default defineComponent({
|
||||
|
||||
props: sliderProps,
|
||||
|
||||
emits: ['change', 'drag-end', 'drag-start', 'update:modelValue'],
|
||||
emits: ['change', 'dragEnd', 'dragStart', 'update:modelValue'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
let buttonIndex: 0 | 1;
|
||||
@ -221,7 +221,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
if (dragStatus.value === 'start') {
|
||||
emit('drag-start', event);
|
||||
emit('dragStart', event);
|
||||
}
|
||||
|
||||
preventDefault(event, true);
|
||||
@ -253,7 +253,7 @@ export default defineComponent({
|
||||
|
||||
if (dragStatus.value === 'dragging') {
|
||||
updateValue(current, true);
|
||||
emit('drag-end', event);
|
||||
emit('dragEnd', event);
|
||||
}
|
||||
|
||||
dragStatus.value = '';
|
||||
|
@ -39,7 +39,7 @@ test('should emit "update:modelValue" event after clicking slider', () => {
|
||||
expect(wrapper.emitted('update:modelValue')!.pop()).toEqual([100]);
|
||||
});
|
||||
|
||||
test('should emit drag-start event when start dragging', () => {
|
||||
test('should emit dragStart event when start dragging', () => {
|
||||
const wrapper = mount(Slider, {
|
||||
props: {
|
||||
modelValue: 50,
|
||||
@ -49,10 +49,10 @@ test('should emit drag-start event when start dragging', () => {
|
||||
const button = wrapper.find('.van-slider__button');
|
||||
trigger(button, 'touchstart');
|
||||
trigger(button, 'touchmove');
|
||||
expect(wrapper.emitted('drag-start')).toBeTruthy();
|
||||
expect(wrapper.emitted('dragStart')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should emit drag-end event when end dragging', () => {
|
||||
test('should emit dragEnd event when end dragging', () => {
|
||||
const wrapper = mount(Slider, {
|
||||
props: {
|
||||
modelValue: 50,
|
||||
@ -62,9 +62,9 @@ test('should emit drag-end event when end dragging', () => {
|
||||
const button = wrapper.find('.van-slider__button');
|
||||
trigger(button, 'touchstart');
|
||||
trigger(button, 'touchmove');
|
||||
expect(wrapper.emitted('drag-end')).toBeFalsy();
|
||||
expect(wrapper.emitted('dragEnd')).toBeFalsy();
|
||||
trigger(button, 'touchend');
|
||||
expect(wrapper.emitted('drag-end')).toBeTruthy();
|
||||
expect(wrapper.emitted('dragEnd')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('should not allow to drag slider when disabled', async () => {
|
||||
|
@ -31,12 +31,12 @@ export default defineComponent({
|
||||
|
||||
props: stepsProps,
|
||||
|
||||
emits: ['click-step'],
|
||||
emits: ['clickStep'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const { linkChildren } = useChildren(STEPS_KEY);
|
||||
|
||||
const onClickStep = (index: number) => emit('click-step', index);
|
||||
const onClickStep = (index: number) => emit('clickStep', index);
|
||||
|
||||
linkChildren({
|
||||
props,
|
||||
|
@ -18,12 +18,12 @@ test('should render icon slot correctly', () => {
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should emit click-step event when step is clicked', () => {
|
||||
test('should emit clickStep event when step is clicked', () => {
|
||||
const onClickStep = jest.fn();
|
||||
const wrapper = mount({
|
||||
setup() {
|
||||
return () => (
|
||||
<Steps active={1} onClick-step={onClickStep}>
|
||||
<Steps active={1} onClickStep={onClickStep}>
|
||||
<Step>A</Step>
|
||||
<Step>B</Step>
|
||||
<Step>C</Step>
|
||||
|
@ -3,13 +3,13 @@ import { mount, later, triggerDrag, mockScrollTop } from '../../../test';
|
||||
import { Tab } from '..';
|
||||
import { Tabs, TabsInstance } from '../../tabs';
|
||||
|
||||
test('should emit click-tab event when tab is clicked', async () => {
|
||||
test('should emit clickTab event when tab is clicked', async () => {
|
||||
const onClickTab = jest.fn();
|
||||
|
||||
const wrapper = mount({
|
||||
render() {
|
||||
return (
|
||||
<Tabs onClick-tab={onClickTab}>
|
||||
<Tabs onClickTab={onClickTab}>
|
||||
<Tab title="title1">1</Tab>
|
||||
<Tab title="title2">2</Tab>
|
||||
</Tabs>
|
||||
@ -299,7 +299,7 @@ test('should allow to set name prop', async () => {
|
||||
<Tabs
|
||||
v-model:active={this.active}
|
||||
onChange={onChange}
|
||||
onClick-tab={onClickTab}
|
||||
onClickTab={onClickTab}
|
||||
>
|
||||
<Tab title="title1" name="a">
|
||||
Text
|
||||
@ -336,7 +336,7 @@ test('should allow name prop to be zero', async () => {
|
||||
const wrapper = mount({
|
||||
render() {
|
||||
return (
|
||||
<Tabs onClick-tab={onClickTab}>
|
||||
<Tabs onClickTab={onClickTab}>
|
||||
<Tab title="title1" name={1}>
|
||||
Text
|
||||
</Tab>
|
||||
|
@ -91,7 +91,7 @@ export default defineComponent({
|
||||
|
||||
props: tabsProps,
|
||||
|
||||
emits: ['change', 'scroll', 'rendered', 'click-tab', 'update:active'],
|
||||
emits: ['change', 'scroll', 'rendered', 'clickTab', 'update:active'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
let tabHeight: number;
|
||||
@ -289,7 +289,7 @@ export default defineComponent({
|
||||
route(item as ComponentPublicInstance<RouteProps>);
|
||||
}
|
||||
|
||||
emit('click-tab', {
|
||||
emit('clickTab', {
|
||||
name,
|
||||
title,
|
||||
event,
|
||||
|
@ -52,12 +52,7 @@ export default defineComponent({
|
||||
|
||||
props: treeSelectProps,
|
||||
|
||||
emits: [
|
||||
'click-nav',
|
||||
'click-item',
|
||||
'update:activeId',
|
||||
'update:mainActiveIndex',
|
||||
],
|
||||
emits: ['clickNav', 'clickItem', 'update:activeId', 'update:mainActiveIndex'],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const isActiveItem = (id: number | string) =>
|
||||
@ -87,7 +82,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
emit('update:activeId', activeId);
|
||||
emit('click-item', item);
|
||||
emit('clickItem', item);
|
||||
};
|
||||
|
||||
return (
|
||||
@ -114,7 +109,7 @@ export default defineComponent({
|
||||
emit('update:mainActiveIndex', index);
|
||||
};
|
||||
|
||||
const onClickSidebarItem = (index: number) => emit('click-nav', index);
|
||||
const onClickSidebarItem = (index: number) => emit('clickNav', index);
|
||||
|
||||
const renderSidebar = () => {
|
||||
const Items = props.items.map((item) => (
|
||||
|
@ -42,7 +42,7 @@ test('should emit update:mainActiveIndex event when mainActiveIndex is changed',
|
||||
expect(wrapper.emitted('update:mainActiveIndex')?.[0]).toEqual([1]);
|
||||
});
|
||||
|
||||
test('should emit click-nav event when nav item is clicked', async () => {
|
||||
test('should emit clickNav event when nav item is clicked', async () => {
|
||||
const wrapper = mount(TreeSelect, {
|
||||
props: {
|
||||
items: mockItems,
|
||||
@ -51,12 +51,12 @@ test('should emit click-nav event when nav item is clicked', async () => {
|
||||
|
||||
const navItems = wrapper.findAll('.van-tree-select__nav-item');
|
||||
await navItems[0].trigger('click');
|
||||
expect(wrapper.emitted('click-nav')?.[0]).toEqual([0]);
|
||||
expect(wrapper.emitted('clickNav')?.[0]).toEqual([0]);
|
||||
await navItems[0].trigger('click');
|
||||
expect(wrapper.emitted('click-nav')?.[1]).toEqual([0]);
|
||||
expect(wrapper.emitted('clickNav')?.[1]).toEqual([0]);
|
||||
});
|
||||
|
||||
test('should emit click-item event when item is clicked', () => {
|
||||
test('should emit clickItem event when item is clicked', () => {
|
||||
const wrapper = mount(TreeSelect, {
|
||||
props: {
|
||||
items: mockItems,
|
||||
@ -66,10 +66,10 @@ test('should emit click-item event when item is clicked', () => {
|
||||
const items = wrapper.findAll('.van-tree-select__item');
|
||||
items[0].trigger('click');
|
||||
expect(wrapper.emitted('update:activeId')?.[0]).toEqual([mockItem.id]);
|
||||
expect(wrapper.emitted('click-item')?.[0]).toEqual([mockItem]);
|
||||
expect(wrapper.emitted('clickItem')?.[0]).toEqual([mockItem]);
|
||||
});
|
||||
|
||||
test('should not emit click-nav event when disabled nav item is clicked', () => {
|
||||
test('should not emit clickNav event when disabled nav item is clicked', () => {
|
||||
const wrapper = mount(TreeSelect, {
|
||||
props: {
|
||||
items: [
|
||||
@ -84,10 +84,10 @@ test('should not emit click-nav event when disabled nav item is clicked', () =>
|
||||
|
||||
const items = wrapper.findAll('.van-tree-select__nav-item');
|
||||
items[0].trigger('click');
|
||||
expect(wrapper.emitted('click-nav')).toBeFalsy();
|
||||
expect(wrapper.emitted('clickNav')).toBeFalsy();
|
||||
});
|
||||
|
||||
test('should not emit click-item event when disabled item is clicked', () => {
|
||||
test('should not emit clickItem event when disabled item is clicked', () => {
|
||||
const wrapper = mount(TreeSelect, {
|
||||
props: {
|
||||
items: [
|
||||
@ -106,7 +106,7 @@ test('should not emit click-item event when disabled item is clicked', () => {
|
||||
|
||||
const items = wrapper.findAll('.van-tree-select__item');
|
||||
items[0].trigger('click');
|
||||
expect(wrapper.emitted('click-item')).toBeFalsy();
|
||||
expect(wrapper.emitted('clickItem')).toBeFalsy();
|
||||
});
|
||||
|
||||
test('should render content slot correctly', () => {
|
||||
|
@ -90,9 +90,9 @@ export default defineComponent({
|
||||
emits: [
|
||||
'delete',
|
||||
'oversize',
|
||||
'click-upload',
|
||||
'close-preview',
|
||||
'click-preview',
|
||||
'clickUpload',
|
||||
'closePreview',
|
||||
'clickPreview',
|
||||
'update:modelValue',
|
||||
],
|
||||
|
||||
@ -221,7 +221,7 @@ export default defineComponent({
|
||||
|
||||
let imagePreview: ComponentInstance | undefined;
|
||||
|
||||
const onClosePreview = () => emit('close-preview');
|
||||
const onClosePreview = () => emit('closePreview');
|
||||
|
||||
const previewImage = (item: UploaderFileListItem) => {
|
||||
if (props.previewFullImage) {
|
||||
@ -281,7 +281,7 @@ export default defineComponent({
|
||||
v-slots={{ 'preview-cover': slots['preview-cover'] }}
|
||||
item={item}
|
||||
index={index}
|
||||
onClick={() => emit('click-preview', item, getDetail(index))}
|
||||
onClick={() => emit('clickPreview', item, getDetail(index))}
|
||||
onDelete={() => deleteFile(item, index)}
|
||||
onPreview={() => previewImage(item)}
|
||||
{...pick(props, ['name', 'lazyLoad'])}
|
||||
@ -296,7 +296,7 @@ export default defineComponent({
|
||||
}
|
||||
};
|
||||
|
||||
const onClickUpload = (event: MouseEvent) => emit('click-upload', event);
|
||||
const onClickUpload = (event: MouseEvent) => emit('clickUpload', event);
|
||||
|
||||
const renderUpload = () => {
|
||||
if (props.modelValue.length >= props.maxCount || !props.showUpload) {
|
||||
|
@ -504,14 +504,14 @@ test('closeImagePreview method', async () => {
|
||||
|
||||
await nextTick();
|
||||
await (wrapper.vm as Record<string, any>).closeImagePreview();
|
||||
expect(wrapper.emitted('close-preview')).toBeFalsy();
|
||||
expect(wrapper.emitted('closePreview')).toBeFalsy();
|
||||
|
||||
wrapper.find('.van-image').trigger('click');
|
||||
await (wrapper.vm as Record<string, any>).closeImagePreview();
|
||||
expect(wrapper.emitted('close-preview')).toBeTruthy();
|
||||
expect(wrapper.emitted('closePreview')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('click-preview event', () => {
|
||||
test('clickPreview event', () => {
|
||||
const wrapper = mount(Uploader, {
|
||||
props: {
|
||||
previewFullImage: false,
|
||||
@ -520,12 +520,12 @@ test('click-preview event', () => {
|
||||
});
|
||||
|
||||
wrapper.find('.van-image').trigger('click');
|
||||
expect(wrapper.emitted<[File]>('click-preview')![0][0]).toEqual({
|
||||
expect(wrapper.emitted<[File]>('clickPreview')![0][0]).toEqual({
|
||||
url: IMAGE,
|
||||
});
|
||||
expect(
|
||||
wrapper.emitted<[File, { name: string; index: number }]>(
|
||||
'click-preview'
|
||||
'clickPreview'
|
||||
)![0][1]
|
||||
).toEqual({
|
||||
name: '',
|
||||
@ -533,7 +533,7 @@ test('click-preview event', () => {
|
||||
});
|
||||
});
|
||||
|
||||
test('close-preview event', async () => {
|
||||
test('closePreview event', async () => {
|
||||
const wrapper = mount(Uploader, {
|
||||
props: {
|
||||
modelValue: [{ url: IMAGE }],
|
||||
@ -550,7 +550,7 @@ test('close-preview event', async () => {
|
||||
triggerDrag(swipe, 0, 0);
|
||||
|
||||
await later(300);
|
||||
expect(wrapper.emitted('close-preview')).toBeTruthy();
|
||||
expect(wrapper.emitted('closePreview')).toBeTruthy();
|
||||
});
|
||||
|
||||
test('show-upload prop', async () => {
|
||||
@ -626,8 +626,8 @@ test('should not render upload input when using readonly prop', async () => {
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('should emit click-upload event when upload area is clicked', async () => {
|
||||
test('should emit clickUpload event when upload area is clicked', async () => {
|
||||
const wrapper = mount(Uploader);
|
||||
wrapper.find('.van-uploader__upload').trigger('click');
|
||||
expect(wrapper.emitted('click-upload')).toBeTruthy();
|
||||
expect(wrapper.emitted('clickUpload')).toBeTruthy();
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user