From 21683829174440beaca59f257b3c36b428e34989 Mon Sep 17 00:00:00 2001 From: neverland Date: Tue, 23 Feb 2021 20:54:28 +0800 Subject: [PATCH] test: improve test cases typing (#8202) --- src/action-sheet/test/index.spec.ts | 15 +++--- src/checkbox/test/index.spec.ts | 10 ++-- src/pull-refresh/test/index.spec.ts | 4 +- src/share-sheet/test/index.spec.ts | 4 +- ...{index.spec.js.snap => index.spec.ts.snap} | 0 .../test/{index.spec.js => index.spec.ts} | 49 ++++++++++--------- src/switch/test/index.spec.ts | 10 ++-- .../test/{index.spec.js => index.spec.ts} | 4 +- ...{lock-click.spec.js => lock-click.spec.ts} | 0 9 files changed, 50 insertions(+), 46 deletions(-) rename src/stepper/test/__snapshots__/{index.spec.js.snap => index.spec.ts.snap} (100%) rename src/stepper/test/{index.spec.js => index.spec.ts} (87%) rename src/toast/test/{index.spec.js => index.spec.ts} (87%) rename src/toast/test/{lock-click.spec.js => lock-click.spec.ts} (100%) diff --git a/src/action-sheet/test/index.spec.ts b/src/action-sheet/test/index.spec.ts index f263fbfc8..f8f6f97ae 100644 --- a/src/action-sheet/test/index.spec.ts +++ b/src/action-sheet/test/index.spec.ts @@ -1,5 +1,5 @@ import { mount } from '../../../test'; -import ActionSheet, { ActionSheetAction } from '..'; +import ActionSheet from '..'; test('should emit select event after clicking option', () => { const wrapper = mount(ActionSheet, { @@ -11,9 +11,12 @@ test('should emit select event after clicking option', () => { wrapper.find('.van-action-sheet__item').trigger('click'); expect(wrapper.emitted('select').length).toEqual(1); - expect(wrapper.emitted<[ActionSheetAction]>('select')[0][0]).toEqual({ - name: 'Option', - }); + expect(wrapper.emitted('select')[0]).toEqual([ + { + name: 'Option', + }, + 0, + ]); }); test('should call callback function after clicking option', () => { @@ -202,7 +205,7 @@ test('should close after clicking option if close-on-click-action prop is true', option.trigger('click'); expect(wrapper.emitted('update:show').length).toEqual(1); - expect(wrapper.emitted<[boolean]>('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); }); test('should emit click-overlay event and closed after clicking the overlay', () => { @@ -215,7 +218,7 @@ test('should emit click-overlay event and closed after clicking the overlay', () }); wrapper.find('.van-overlay').trigger('click'); - expect(wrapper.emitted<[boolean]>('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); expect(onClickOverlay).toHaveBeenCalledTimes(1); }); diff --git a/src/checkbox/test/index.spec.ts b/src/checkbox/test/index.spec.ts index e56ed0a12..2fa4c7adb 100644 --- a/src/checkbox/test/index.spec.ts +++ b/src/checkbox/test/index.spec.ts @@ -6,11 +6,11 @@ test('should emit "update:modelValue" event when checkbox icon is clicked', asyn const icon = wrapper.find('.van-checkbox__icon'); icon.trigger('click'); - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toEqual(true); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([true]); await wrapper.setProps({ modelValue: true }); icon.trigger('click'); - expect(wrapper.emitted<[boolean]>('update:modelValue')[1][0]).toEqual(false); + expect(wrapper.emitted('update:modelValue')[1]).toEqual([false]); }); test('should emit change event when modelValue is changed', async () => { @@ -19,11 +19,11 @@ test('should emit change event when modelValue is changed', async () => { const icon = wrapper.find('.van-checkbox__icon'); icon.trigger('click'); await wrapper.setProps({ modelValue: true }); - expect(wrapper.emitted<[boolean]>('change')[0][0]).toEqual(true); + expect(wrapper.emitted('change')[0]).toEqual([true]); icon.trigger('click'); await wrapper.setProps({ modelValue: false }); - expect(wrapper.emitted<[boolean]>('change')[1][0]).toEqual(false); + expect(wrapper.emitted('change')[1]).toEqual([false]); }); test('should not emit "update:modelValue" event when checkbox icon is disabled and clicked', () => { @@ -59,7 +59,7 @@ test('should emit "update:modelValue" event when label is clicked', () => { const icon = wrapper.find('.van-checkbox__label'); icon.trigger('click'); - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toEqual(true); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([true]); }); test('should not emit "update:modelValue" event when label is disabled and clicked', () => { diff --git a/src/pull-refresh/test/index.spec.ts b/src/pull-refresh/test/index.spec.ts index 3648cb1fb..bc9c00e04 100644 --- a/src/pull-refresh/test/index.spec.ts +++ b/src/pull-refresh/test/index.spec.ts @@ -111,7 +111,7 @@ test('should render success text correctly', async () => { await later(); // loading - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toBeTruthy(); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([true]); await wrapper.setProps({ modelValue: true }); // success @@ -133,7 +133,7 @@ test('should render success slot correctly', async () => { // loading const track = wrapper.find('.van-pull-refresh__track'); triggerDrag(track, 0, 100); - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toBeTruthy(); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([true]); await wrapper.setProps({ modelValue: true }); // success diff --git a/src/share-sheet/test/index.spec.ts b/src/share-sheet/test/index.spec.ts index 79e94cb1e..633f86aa6 100644 --- a/src/share-sheet/test/index.spec.ts +++ b/src/share-sheet/test/index.spec.ts @@ -68,7 +68,7 @@ test('should emit cancel event when the cancel button is clicked', () => { wrapper.find('.van-share-sheet__cancel').trigger('click'); - expect(wrapper.emitted<[boolean]>('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); expect(wrapper.emitted('cancel')[0]).toBeTruthy(); }); @@ -102,5 +102,5 @@ test('should emit click-overlay event when overlay is clicked', async () => { const overlay = root.querySelector('.van-overlay')!; trigger(overlay, 'click'); expect(onClickOverlay).toHaveBeenCalledTimes(1); - expect(wrapper.emitted<[boolean]>('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); }); diff --git a/src/stepper/test/__snapshots__/index.spec.js.snap b/src/stepper/test/__snapshots__/index.spec.ts.snap similarity index 100% rename from src/stepper/test/__snapshots__/index.spec.js.snap rename to src/stepper/test/__snapshots__/index.spec.ts.snap diff --git a/src/stepper/test/index.spec.js b/src/stepper/test/index.spec.ts similarity index 87% rename from src/stepper/test/index.spec.js rename to src/stepper/test/index.spec.ts index d3e0b71da..c1e64a2cf 100644 --- a/src/stepper/test/index.spec.js +++ b/src/stepper/test/index.spec.ts @@ -31,7 +31,7 @@ test('should emit minus event when clicking the minus button', async () => { expect(wrapper.emitted('overlimit')).toBeFalsy(); expect(wrapper.emitted('minus')).toBeTruthy(); expect(wrapper.emitted('change')[0]).toEqual([1, { name: '' }]); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(1); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([1]); }); test('should emit plus event when clicking the plus button', async () => { @@ -46,7 +46,7 @@ test('should emit plus event when clicking the plus button', async () => { expect(wrapper.emitted('overlimit')).toBeFalsy(); expect(wrapper.emitted('plus')).toBeTruthy(); expect(wrapper.emitted('change')[0]).toEqual([3, { name: '' }]); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(3); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([3]); }); test('should emit overlimit event when clicking disabled buttons', async () => { @@ -59,11 +59,11 @@ test('should emit overlimit event when clicking disabled buttons', async () => { const minus = wrapper.find('.van-stepper__minus'); await minus.trigger('click'); - expect(wrapper.emitted('overlimit')[0][0]).toEqual('minus'); + expect(wrapper.emitted('overlimit')[0]).toEqual(['minus']); const plus = wrapper.find('.van-stepper__plus'); await plus.trigger('click'); - expect(wrapper.emitted('overlimit')[1][0]).toEqual('plus'); + expect(wrapper.emitted('overlimit')[1]).toEqual(['plus']); }); test('should disable plus button when disable-plus prop is true', async () => { @@ -122,7 +122,7 @@ test('should update value after long pressing', async () => { await plus.trigger('touchstart'); await plus.trigger('touchend'); await plus.trigger('click'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(2); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([2]); await plus.trigger('touchstart'); await later(1000); @@ -154,19 +154,20 @@ test('should filter invalid value during user input', async () => { }); const input = wrapper.find('.van-stepper__input'); - input.element.value = ''; + const inputEl = input.element as HTMLInputElement; + inputEl.value = ''; await input.trigger('input'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(''); + expect(wrapper.emitted('update:modelValue')[0]).toEqual(['']); - input.element.value = 'a'; + inputEl.value = 'a'; await input.trigger('input'); - expect(input.element.value).toEqual(''); + expect(inputEl.value).toEqual(''); expect(wrapper.emitted('update:modelValue')[1]).toBeFalsy(); - input.element.value = '2'; + inputEl.value = '2'; await input.trigger('input'); - expect(input.element.value).toEqual('2'); - expect(wrapper.emitted('update:modelValue')[1][0]).toEqual(2); + expect(inputEl.value).toEqual('2'); + expect(wrapper.emitted('update:modelValue')[1]).toEqual([2]); }); test('shoud watch modelValue and format it', async () => { @@ -178,7 +179,7 @@ test('shoud watch modelValue and format it', async () => { }); await wrapper.setProps({ modelValue: 10 }); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(5); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([5]); }); test('should format value to integer when using integer prop', async () => { @@ -194,7 +195,7 @@ test('should format value to integer when using integer prop', async () => { await input.trigger('input'); await input.trigger('blur'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(2); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([2]); }); test('should format value to default value when input is invalid', async () => { @@ -239,10 +240,10 @@ test('should format input value when stepper blured', async () => { const input = wrapper.find('input'); input.element.value = ''; await input.trigger('input'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(''); + expect(wrapper.emitted('update:modelValue')[0]).toEqual(['']); await input.trigger('blur'); - expect(wrapper.emitted('update:modelValue')[1][0]).toEqual(3); + expect(wrapper.emitted('update:modelValue')[1]).toEqual([3]); expect(wrapper.emitted('blur')).toBeTruthy(); }); @@ -332,7 +333,7 @@ test('should limit dicimal length when using decimal-length prop', async () => { }); const plus = wrapper.find('.van-stepper__plus'); await plus.trigger('click'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual('1.20'); + expect(wrapper.emitted('update:modelValue')[0]).toEqual(['1.20']); }); test('should limit decimal-length when inputing', async () => { @@ -356,11 +357,11 @@ test('should emit change event with name when using name prop', async () => { const plus = wrapper.find('.van-stepper__plus'); await plus.trigger('click'); - expect(wrapper.emitted('change')[0][1]).toEqual({ name: '' }); + expect(wrapper.emitted('change')[0]).toEqual([2, { name: '' }]); await wrapper.setProps({ name: 'name' }); await plus.trigger('click'); - expect(wrapper.emitted('change')[1][1]).toEqual({ name: 'name' }); + expect(wrapper.emitted('change')[1]).toEqual([3, { name: 'name' }]); }); test('should watch min and max props and format modelValue', async () => { @@ -371,13 +372,13 @@ test('should watch min and max props and format modelValue', async () => { }); await wrapper.setProps({ min: 10 }); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(10); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([10]); await wrapper.setProps({ min: 3, max: 8, }); - expect(wrapper.emitted('update:modelValue')[1][0]).toEqual(8); + expect(wrapper.emitted('update:modelValue')[1]).toEqual([8]); }); test('should watch decimal-length prop and format modelValue', async () => { @@ -387,7 +388,7 @@ test('should watch decimal-length prop and format modelValue', async () => { }, }); await wrapper.setProps({ decimalLength: 1 }); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual('1.3'); + expect(wrapper.emitted('update:modelValue')[0]).toEqual(['1.3']); }); test('should watch integer prop and format modelValue', async () => { @@ -397,7 +398,7 @@ test('should watch integer prop and format modelValue', async () => { }, }); await wrapper.setProps({ integer: true }); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(1); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([1]); }); test('should render placeholder correctly', () => { @@ -424,5 +425,5 @@ test('should allow input be to empty when using allow-empty prop', async () => { await wrapper.setProps({ allowEmpty: false }); await input.trigger('blur'); - expect(wrapper.emitted('update:modelValue')[0][0]).toEqual(1); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([1]); }); diff --git a/src/switch/test/index.spec.ts b/src/switch/test/index.spec.ts index 5b1c75e6e..9f2174507 100644 --- a/src/switch/test/index.spec.ts +++ b/src/switch/test/index.spec.ts @@ -6,12 +6,12 @@ test('should emit update:modelValue event when click the switch button', async ( wrapper.trigger('click'); expect(wrapper.emitted('update:modelValue').length).toEqual(1); - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toEqual(true); + expect(wrapper.emitted('update:modelValue')[0]).toEqual([true]); await wrapper.setProps({ modelValue: true }); wrapper.trigger('click'); expect(wrapper.emitted('update:modelValue').length).toEqual(2); - expect(wrapper.emitted<[boolean]>('update:modelValue')[1][0]).toEqual(false); + expect(wrapper.emitted('update:modelValue')[1]).toEqual([false]); }); test('should emit change event when click the switch button', async () => { @@ -19,12 +19,12 @@ test('should emit change event when click the switch button', async () => { wrapper.trigger('click'); expect(wrapper.emitted('change').length).toEqual(1); - expect(wrapper.emitted<[boolean]>('change')[0][0]).toEqual(true); + expect(wrapper.emitted('change')[0]).toEqual([true]); await wrapper.setProps({ modelValue: true }); wrapper.trigger('click'); expect(wrapper.emitted('change').length).toEqual(2); - expect(wrapper.emitted<[boolean]>('change')[1][0]).toEqual(false); + expect(wrapper.emitted('change')[1]).toEqual([false]); }); test('should not emit change event or update:modelValue event if disabled', async () => { @@ -107,5 +107,5 @@ test('should allow to custom active-value and inactive-value', () => { expect(wrapper.find('.van-switch--on').exists()).toBeTruthy(); wrapper.trigger('click'); - expect(wrapper.emitted<[boolean]>('update:modelValue')[0][0]).toEqual('off'); + expect(wrapper.emitted('update:modelValue')[0]).toEqual(['off']); }); diff --git a/src/toast/test/index.spec.js b/src/toast/test/index.spec.ts similarity index 87% rename from src/toast/test/index.spec.js rename to src/toast/test/index.spec.ts index 0beff74c7..e6554b093 100644 --- a/src/toast/test/index.spec.js +++ b/src/toast/test/index.spec.ts @@ -25,7 +25,7 @@ test('should close Toast when using closeOnClick prop and clicked', () => { }); wrapper.find('.van-toast').trigger('click'); - expect(wrapper.emitted('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); }); test('should close Toast when using closeOnClickOverlay prop and overlay is clicked', () => { @@ -37,5 +37,5 @@ test('should close Toast when using closeOnClickOverlay prop and overlay is clic }); wrapper.find('.van-overlay').trigger('click'); - expect(wrapper.emitted('update:show')[0][0]).toEqual(false); + expect(wrapper.emitted('update:show')[0]).toEqual([false]); }); diff --git a/src/toast/test/lock-click.spec.js b/src/toast/test/lock-click.spec.ts similarity index 100% rename from src/toast/test/lock-click.spec.js rename to src/toast/test/lock-click.spec.ts