diff --git a/package.json b/package.json index d2e1bf42..0ce262b6 100644 --- a/package.json +++ b/package.json @@ -51,6 +51,7 @@ "@typescript-eslint/eslint-plugin": "^4.28.0", "@typescript-eslint/parser": "^4.28.0", "@vitejs/plugin-vue": "^3.1.0", + "@vitest/coverage-c8": "^0.23.4", "c8": "^7.11.3", "chalk": "^4.1.0", "commitizen": "^4.2.4", diff --git a/packages/editor/tests/unit/Editor.spec.ts b/packages/editor/tests/unit/Editor.spec.ts deleted file mode 100644 index 883867c1..00000000 --- a/packages/editor/tests/unit/Editor.spec.ts +++ /dev/null @@ -1,68 +0,0 @@ -/* - * Tencent is pleased to support the open source community by making TMagicEditor available. - * - * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { describe, expect, test, vi } from 'vitest'; -import { mount } from '@vue/test-utils'; -import ElementPlus from 'element-plus'; - -import MagicForm from '@tmagic/form'; -import { NodeType } from '@tmagic/schema'; - -import Editor from '@editor/Editor.vue'; - -vi.mock('@editor/utils/logger', () => ({ - log: vi.fn(), - info: vi.fn(), - warn: vi.fn(), - debug: vi.fn(), - error: vi.fn(), -})); - -globalThis.ResizeObserver = - globalThis.ResizeObserver || - vi.fn().mockImplementation(() => ({ - disconnect: vi.fn(), - observe: vi.fn(), - unobserve: vi.fn(), - })); - -describe.skip('编辑器', () => { - test('初始化', () => { - const wrapper = mount(Editor as any, { - global: { - plugins: [ElementPlus as any, MagicForm as any], - }, - props: { - modelValue: { - type: NodeType.ROOT, - id: 1, - name: 'app', - items: [ - { - type: NodeType.PAGE, - id: 2, - name: NodeType.PAGE, - items: [], - }, - ], - }, - runtimeUrl: 'https://m.film.qq.com/magic-ui/production/1/1625056093304/magic/magic-ui.umd.min.js', - }, - }); - expect(wrapper.exists()).toBe(true); - }); -}); diff --git a/packages/editor/tests/unit/components/ToolButton.spec.ts b/packages/editor/tests/unit/components/ToolButton.spec.ts index 26746e03..1eda8472 100644 --- a/packages/editor/tests/unit/components/ToolButton.spec.ts +++ b/packages/editor/tests/unit/components/ToolButton.spec.ts @@ -17,6 +17,7 @@ */ import { describe, expect, test, vi } from 'vitest'; +import { nextTick } from 'vue'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElDropdown } from 'element-plus'; @@ -71,51 +72,7 @@ const getWrapper = ( }, }); -describe.skip('ToolButton', () => { - test('删除', async () => { - const wrapper = getWrapper(); - const icon = wrapper.find('.el-button'); - await icon.trigger('click'); - expect(editorService.remove.mock.calls[0][0]).toBe('node'); - }); - - test('后退', async () => { - const wrapper = getWrapper({ data: 'undo' }); - - const icon = wrapper.find('.el-button'); - await icon.trigger('click'); - expect(editorService.undo).toBeCalled(); - }); - - test('前进', async () => { - const wrapper = getWrapper({ data: 'redo' }); - - const icon = wrapper.find('.el-button'); - await icon.trigger('click'); - expect(editorService.redo).toBeCalled(); - }); - - test('放大', async () => { - uiService.set('zoom', 1); - const wrapper = getWrapper({ data: 'zoom-in' }); - - const icon = wrapper.find('.el-button'); - await icon.trigger('click'); - expect(uiService.get('zoom')).toBe(1.1); - }); - - test('缩小', (done) => { - uiService.set('zoom', 1); - const wrapper = getWrapper({ data: 'zoom-out' }); - - setTimeout(async () => { - const icon = wrapper.find('.el-button'); - await icon.trigger('click'); - expect(uiService.get('zoom')).toBe(0.9); - done(); - }, 0); - }); - +describe('ToolButton', () => { test('data无匹配值', () => { getWrapper({ data: 'default' }); }); @@ -128,25 +85,24 @@ describe.skip('ToolButton', () => { expect(display).toBeCalled(); }); - test('点击下拉菜单项', (done) => { + test('点击下拉菜单项', async () => { const wrapper = getWrapper({ data: { type: 'dropdown', }, }); - setTimeout(async () => { - const dropDown = wrapper.findComponent(ElDropdown); - const handler = vi.fn(); - dropDown.vm.$emit('command', { - item: { handler }, - }); - expect(handler).toBeCalled(); - done(); - }, 0); + await nextTick(); + + const dropDown = wrapper.findComponent(ElDropdown); + const handler = vi.fn(); + dropDown.vm.$emit('command', { + item: { handler }, + }); + expect(handler).toBeCalled(); }); - test('按钮不可用', (done) => { + test('按钮不可用', async () => { const wrapper = getWrapper({ data: { icon: 'disabled-icon', @@ -155,12 +111,11 @@ describe.skip('ToolButton', () => { }, }); - setTimeout(async () => { - // disabled 后会有 is-disabled class - const iconBtn = wrapper.find('.el-button.is-text.is-disabled'); - await iconBtn.trigger('click'); - done(); - }, 0); + await nextTick(); + + // disabled 后会有 is-disabled class + const iconBtn = wrapper.find('.el-button.is-text.is-disabled'); + expect(iconBtn).toBeDefined(); }); test('菜单项handler未定义', () => { diff --git a/packages/editor/tests/unit/layouts/workspace/PageBar.spec.ts b/packages/editor/tests/unit/layouts/workspace/PageBar.spec.ts deleted file mode 100644 index 5cc8493c..00000000 --- a/packages/editor/tests/unit/layouts/workspace/PageBar.spec.ts +++ /dev/null @@ -1,77 +0,0 @@ -/* - * Tencent is pleased to support the open source community by making TMagicEditor available. - * - * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import { describe, expect, test, vi } from 'vitest'; -import { mount } from '@vue/test-utils'; -import ElementPlus from 'element-plus'; - -import { NodeType } from '@tmagic/schema'; - -import PageBar from '@editor/layouts/workspace/PageBar.vue'; - -globalThis.ResizeObserver = - globalThis.ResizeObserver || - vi.fn().mockImplementation(() => ({ - disconnect: vi.fn(), - observe: vi.fn(), - unobserve: vi.fn(), - })); - -const editorState: Record = { - root: { - items: [{ key: 0, id: 1, name: 'testName', type: NodeType.PAGE }], - }, - page: { id: 1, type: NodeType.PAGE }, -}; - -const editorService = { - get: vi.fn((key: string) => editorState[key]), - add: vi.fn(), - set: vi.fn(), - select: vi.fn(), -}; - -const getWrapper = () => - mount(PageBar as any, { - global: { - plugins: [ElementPlus as any], - provide: { - services: { - editorService, - }, - }, - }, - }); - -describe.skip('PageBar', () => { - test('新增page', async () => { - const wrapper = getWrapper(); - await wrapper.find('#m-editor-page-bar-add-icon').trigger('click'); - - expect(editorService.add.mock.calls[0][0]).toEqual({ - type: NodeType.PAGE, - name: 'page_1', - }); - }); - - test('切换page', async () => { - const wrapper = getWrapper(); - await wrapper.find('div[class="m-editor-page-bar-item active"]').trigger('click'); - - expect(editorService.set.mock.calls).toEqual([]); - }); -}); diff --git a/packages/editor/tests/unit/services/editor.spec.ts b/packages/editor/tests/unit/services/editor.spec.ts index 9ee8a4d0..44190be3 100644 --- a/packages/editor/tests/unit/services/editor.spec.ts +++ b/packages/editor/tests/unit/services/editor.spec.ts @@ -19,7 +19,7 @@ import { beforeAll, describe, expect, test } from 'vitest'; import { cloneDeep } from 'lodash-es'; -import type { MApp, MContainer, MNode, MPage } from '@tmagic/schema'; +import type { MApp, MContainer, MNode } from '@tmagic/schema'; import { NodeType } from '@tmagic/schema'; import editorService from '@editor/services/editor'; @@ -365,40 +365,6 @@ describe('copy', () => { }); }); -describe('paste', () => { - beforeAll(() => editorService.set('root', cloneDeep(root))); - test.skip('正常', async () => { - editorService.set('root', cloneDeep(root)); - // 设置当前编辑的页面 - await editorService.select(NodeId.PAGE_ID); - const page = editorService.get('page'); - expect(page.items).toHaveLength(2); - const newNodes = (await editorService.paste({ left: 0, top: 0 })) as MNode[]; - expect(newNodes[0]?.id === NodeId.NODE_ID2).toBeFalsy(); - expect(page.items).toHaveLength(3); - }); - - test('空', async () => { - await storageService.clear(); - const newNode = await editorService.paste({ left: 0, top: 0 }); - expect(newNode).toBeUndefined(); - }); -}); - -describe('alignCenter', () => { - beforeAll(() => editorService.set('root', cloneDeep(root))); - - test.skip('正常', async () => { - // 设置当前编辑的页面 - await editorService.select(NodeId.PAGE_ID); - await editorService.update({ id: NodeId.PAGE_ID, isAbsoluteLayout: true, type: NodeType.PAGE }); - await editorService.select(NodeId.NODE_ID); - const node = editorService.get('node'); - await editorService.alignCenter(node); - expect(node.style?.left).toBeGreaterThan(0); - }); -}); - describe('moveLayer', () => { beforeAll(() => editorService.set('root', cloneDeep(root))); @@ -430,15 +396,3 @@ describe('undo redo', () => { expect(redoNode?.id).toBeUndefined(); }); }); - -describe('use', () => { - beforeAll(() => editorService.set('root', cloneDeep(root))); - - test.skip('before', () => { - editorService.usePlugin({ - beforeRemove: () => new Error('不能删除'), - }); - - expect(() => editorService.remove({ id: NodeId.NODE_ID, type: 'text' })).toThrow(); - }); -}); diff --git a/packages/editor/tests/unit/services/props.spec.ts b/packages/editor/tests/unit/services/props.spec.ts index 8d083f72..9cdc93a8 100644 --- a/packages/editor/tests/unit/services/props.spec.ts +++ b/packages/editor/tests/unit/services/props.spec.ts @@ -7,8 +7,6 @@ import props from '@editor/services/props'; test('createId', async () => { const id = await props.createId('text'); - console.log(id); - expect(id.startsWith('text')).toBeTruthy(); }); diff --git a/packages/form/tests/unit/Form.spec.ts b/packages/form/tests/unit/Form.spec.ts index 95ed4ccc..0633b7e9 100644 --- a/packages/form/tests/unit/Form.spec.ts +++ b/packages/form/tests/unit/Form.spec.ts @@ -16,13 +16,13 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm } from '../../src'; - describe('表单', () => { - test('初始化', (done) => { + test('初始化', async () => { const initValues = {}; const config = [ { @@ -41,9 +41,8 @@ describe('表单', () => { }, }); - setTimeout(() => { - expect(wrapper.text()).toBe('text'); - done(); - }); + await nextTick(); + + expect(wrapper.text()).toBe('text'); }); }); diff --git a/packages/form/tests/unit/containers/Tabs.spec.ts b/packages/form/tests/unit/containers/Tabs.spec.ts index ff68ce81..e2c8645b 100644 --- a/packages/form/tests/unit/containers/Tabs.spec.ts +++ b/packages/form/tests/unit/containers/Tabs.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { FormConfig, MForm, MTabs } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { FormConfig, MForm, MTabs } from '../../../src'; - const getWrapper = ( config: FormConfig = [ { @@ -53,15 +53,14 @@ const getWrapper = ( }); describe('Tabs', () => { - test('基础', () => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async (done) => { - const tabs = wrapper.findComponent(MTabs); - expect(tabs.exists()).toBe(true); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe('text'); - done(); - }, 0); + await nextTick(); + + const tabs = wrapper.findComponent(MTabs); + expect(tabs.exists()).toBe(true); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe('text'); }); }); diff --git a/packages/form/tests/unit/fields/Checkbox.spec.ts b/packages/form/tests/unit/fields/Checkbox.spec.ts index 15ddaaaf..f9482e38 100644 --- a/packages/form/tests/unit/fields/Checkbox.spec.ts +++ b/packages/form/tests/unit/fields/Checkbox.spec.ts @@ -17,11 +17,11 @@ */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MCheckbox, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MCheckbox, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -43,16 +43,15 @@ const getWrapper = ( }); describe('Checkbox', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const checkbox = wrapper.findComponent(MCheckbox); - expect(checkbox.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.checkbox).toBe(false); - done(); - }, 0); + const checkbox = wrapper.findComponent(MCheckbox); + expect(checkbox.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.checkbox).toBe(false); }); }); diff --git a/packages/form/tests/unit/fields/CheckboxGroup.spec.ts b/packages/form/tests/unit/fields/CheckboxGroup.spec.ts index 53899c6b..cb633930 100644 --- a/packages/form/tests/unit/fields/CheckboxGroup.spec.ts +++ b/packages/form/tests/unit/fields/CheckboxGroup.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MCheckboxGroup, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MCheckboxGroup, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -52,20 +52,19 @@ const getWrapper = ( }); describe('CheckboxGroup', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const checkboxGroup = wrapper.findComponent(MCheckboxGroup); - expect(checkboxGroup.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.checkboxGroup).toEqual([]); - done(); - }, 0); + const checkboxGroup = wrapper.findComponent(MCheckboxGroup); + expect(checkboxGroup.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.checkboxGroup).toEqual([]); }); - test('默认选中', (done) => { + test('默认选中', async () => { const wrapper = getWrapper( [ { @@ -89,10 +88,9 @@ describe('CheckboxGroup', () => { }, ); - setTimeout(async () => { - const value = await (wrapper.vm as any).submitForm(); - expect(value.checkboxGroup).toEqual([1]); - done(); - }, 0); + await nextTick(); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.checkboxGroup).toEqual([1]); }); }); diff --git a/packages/form/tests/unit/fields/ColorPicker.spec.ts b/packages/form/tests/unit/fields/ColorPicker.spec.ts index dcc4844f..5bb4cfd2 100644 --- a/packages/form/tests/unit/fields/ColorPicker.spec.ts +++ b/packages/form/tests/unit/fields/ColorPicker.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MColorPicker, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElColorPicker } from 'element-plus'; -import MagicForm, { MColorPicker, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -42,20 +42,19 @@ const getWrapper = ( }); describe('ColorPicker', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const picker = wrapper.findComponent(MColorPicker); - expect(picker.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.picker).toMatch(''); - done(); - }, 0); + const picker = wrapper.findComponent(MColorPicker); + expect(picker.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.picker).toMatch(''); }); - test('选择颜色', (done) => { + test('选择颜色', async () => { const wrapper = getWrapper([ { type: 'color-picker', @@ -65,18 +64,17 @@ describe('ColorPicker', () => { }, ]); - setTimeout(async () => { - const value = await (wrapper.vm as any).submitForm(); - expect(value.picker).toMatch('rgba(255, 255, 255, 1)'); + await nextTick(); - const picker = wrapper.findComponent(ElColorPicker); - expect(picker.exists()).toBe(true); - await picker.setValue('rgba(0, 255, 255, 1)'); - picker.vm.$emit('change', 'rgba(0, 255, 255, 1)'); + const value = await (wrapper.vm as any).submitForm(); + expect(value.picker).toMatch('rgba(255, 255, 255, 1)'); - const value2 = await (wrapper.vm as any).submitForm(); - expect(value2.picker).toMatch('rgba(0, 255, 255, 1)'); - done(); - }, 0); + const picker = wrapper.findComponent(ElColorPicker); + expect(picker.exists()).toBe(true); + await picker.setValue('rgba(0, 255, 255, 1)'); + picker.vm.$emit('change', 'rgba(0, 255, 255, 1)'); + + const value2 = await (wrapper.vm as any).submitForm(); + expect(value2.picker).toMatch('rgba(0, 255, 255, 1)'); }); }); diff --git a/packages/form/tests/unit/fields/Date.spec.ts b/packages/form/tests/unit/fields/Date.spec.ts index 6a127bb4..3644bb8d 100644 --- a/packages/form/tests/unit/fields/Date.spec.ts +++ b/packages/form/tests/unit/fields/Date.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MDate, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElInput } from 'element-plus'; -import MagicForm, { MDate, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,48 +44,45 @@ const getWrapper = ( }); describe('Date', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const date = wrapper.findComponent(MDate); - expect(date.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.date).toMatch('2021-01-01 00:00:00'); - done(); - }, 0); + const date = wrapper.findComponent(MDate); + expect(date.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.date).toMatch('2021-01-01 00:00:00'); }); - test('输入', (done) => { + test('输入', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const input = wrapper.find('input'); + await nextTick(); - await input.setValue('2021/07/28'); - await input.trigger('blur'); + const input = wrapper.find('input'); - const value = await (wrapper.vm as any).submitForm(); - expect(input.element.value).toMatch('2021-07-28'); - expect(value.date).toMatch('2021-07-28'); - done(); - }, 0); + await input.setValue('2021/07/28'); + await input.trigger('blur'); + + const value = await (wrapper.vm as any).submitForm(); + expect(input.element.value).toMatch('2021-07-28'); + expect(value.date).toMatch('2021-07-28'); }); - test('清空', (done) => { + test('清空', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const elInput = wrapper.findComponent(ElInput); - await elInput.trigger('mouseenter'); + await nextTick(); - const clear = wrapper.find('.clear-icon'); + const elInput = wrapper.findComponent(ElInput); + await elInput.trigger('mouseenter'); - expect(clear.exists()).toBe(true); - await clear.trigger('click'); - expect((wrapper.vm as any).values.date).toBeNull(); - done(); - }, 0); + const clear = wrapper.find('.clear-icon'); + + expect(clear.exists()).toBe(true); + await clear.trigger('click'); + expect((wrapper.vm as any).values.date).toBeNull(); }); }); diff --git a/packages/form/tests/unit/fields/DateTime.spec.ts b/packages/form/tests/unit/fields/DateTime.spec.ts index 34a3ae07..375a6838 100644 --- a/packages/form/tests/unit/fields/DateTime.spec.ts +++ b/packages/form/tests/unit/fields/DateTime.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MDateTime, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElInput } from 'element-plus'; -import MagicForm, { MDateTime, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,20 +44,19 @@ const getWrapper = ( }); describe('DateTime', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const datetime = wrapper.findComponent(MDateTime); - expect(datetime.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.datetime).toMatch('2021-01-01 12:00:00'); - done(); - }, 0); + const datetime = wrapper.findComponent(MDateTime); + expect(datetime.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.datetime).toMatch('2021-01-01 12:00:00'); }); - test('错误类型初始化初始化', (done) => { + test('错误类型初始化初始化', async () => { const wrapper = getWrapper( [ { @@ -69,17 +68,16 @@ describe('DateTime', () => { { datetime: 123 }, ); - setTimeout(async () => { - const datetime = wrapper.findComponent(MDateTime); - expect(datetime.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.datetime).toMatch(''); - done(); - }, 0); + const datetime = wrapper.findComponent(MDateTime); + expect(datetime.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.datetime).toMatch(''); }); - test('无效值初始化', (done) => { + test('无效值初始化', async () => { const wrapper = getWrapper( [ { @@ -91,41 +89,38 @@ describe('DateTime', () => { { datetime: 'Invalid Date' }, ); - setTimeout(async () => { - const datetime = wrapper.findComponent(MDateTime); - expect(datetime.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.datetime).toMatch(''); - done(); - }, 0); + const datetime = wrapper.findComponent(MDateTime); + expect(datetime.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.datetime).toMatch(''); }); - test('输入日期', (done) => { + test('输入日期', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const input = wrapper.find('input'); - await input.setValue('2021/07/28 00:00:00'); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.datetime).toMatch('2021-07-28 00:00:00'); - done(); - }); + const input = wrapper.find('input'); + await input.setValue('2021/07/28 00:00:00'); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.datetime).toMatch('2021-07-28 00:00:00'); }); - test('清空', (done) => { + test('清空', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const elInput = wrapper.findComponent(ElInput); - await elInput.trigger('mouseenter'); + await nextTick(); - const clear = wrapper.find('.clear-icon'); + const elInput = wrapper.findComponent(ElInput); + await elInput.trigger('mouseenter'); - expect(clear.exists()).toBe(true); - await clear.trigger('click'); - expect((wrapper.vm as any).values.datetime).toBeNull(); - done(); - }, 0); + const clear = wrapper.find('.clear-icon'); + + expect(clear.exists()).toBe(true); + await clear.trigger('click'); + expect((wrapper.vm as any).values.datetime).toBeNull(); }); }); diff --git a/packages/form/tests/unit/fields/Daterange.spec.ts b/packages/form/tests/unit/fields/Daterange.spec.ts index 3778d5e2..6ca54e62 100644 --- a/packages/form/tests/unit/fields/Daterange.spec.ts +++ b/packages/form/tests/unit/fields/Daterange.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MDaterange, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MDaterange, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -42,30 +42,27 @@ const getWrapper = ( }); describe('Daterange', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const daterange = wrapper.findComponent(MDaterange); - expect(daterange.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.start).toMatch(''); - expect(value.end).toMatch(''); - done(); - }); + const daterange = wrapper.findComponent(MDaterange); + expect(daterange.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.start).toMatch(''); + expect(value.end).toMatch(''); }); - test('基础初始化', (done) => { + test('基础初始化', async () => { const wrapper = getWrapper([{ type: 'daterange', text: 'daterange' }], { daterange: [new Date('2021-7-30 00:00:00'), new Date('2021-7-30 12:00:00')], }); - setTimeout(async () => { - const daterange = wrapper.findComponent(MDaterange); - expect(daterange.exists()).toBe(true); + await nextTick(); - done(); - }, 0); + const daterange = wrapper.findComponent(MDaterange); + expect(daterange.exists()).toBe(true); }); }); diff --git a/packages/form/tests/unit/fields/Display.spec.ts b/packages/form/tests/unit/fields/Display.spec.ts index f643e06a..06a53fe6 100644 --- a/packages/form/tests/unit/fields/Display.spec.ts +++ b/packages/form/tests/unit/fields/Display.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MDisplay, MForm } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MDisplay, MForm } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,20 +44,19 @@ const getWrapper = ( }); describe('Display', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const display = wrapper.findComponent(MDisplay); - expect(display.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.display).toMatch('hello'); - done(); - }, 0); + const display = wrapper.findComponent(MDisplay); + expect(display.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.display).toMatch('hello'); }); - test('初始化', (done) => { + test('初始化', async () => { const wrapper = getWrapper( [ { @@ -72,13 +71,12 @@ describe('Display', () => { }, ); - setTimeout(async () => { - const display = wrapper.findComponent(MDisplay); - expect(display.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.display).toMatch('test'); - done(); - }, 0); + const display = wrapper.findComponent(MDisplay); + expect(display.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.display).toMatch('test'); }); }); diff --git a/packages/form/tests/unit/fields/Hidden.spec.ts b/packages/form/tests/unit/fields/Hidden.spec.ts index ef6a181c..aa557a55 100644 --- a/packages/form/tests/unit/fields/Hidden.spec.ts +++ b/packages/form/tests/unit/fields/Hidden.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MHidden } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MHidden } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,20 +44,19 @@ const getWrapper = ( }); describe('Hidden', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const hidden = wrapper.findComponent(MHidden); - expect(hidden.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.hidden).toMatch('hidden'); - done(); - }, 0); + const hidden = wrapper.findComponent(MHidden); + expect(hidden.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.hidden).toMatch('hidden'); }); - test('未设置name', (done) => { + test('未设置name', async () => { const wrapper = getWrapper([ { type: 'hidden', @@ -66,13 +65,12 @@ describe('Hidden', () => { }, ]); - setTimeout(async () => { - const hidden = wrapper.findComponent(MHidden); - expect(hidden.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.hidden).toBeUndefined(); - done(); - }, 0); + const hidden = wrapper.findComponent(MHidden); + expect(hidden.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.hidden).toBeUndefined(); }); }); diff --git a/packages/form/tests/unit/fields/Link.spec.ts b/packages/form/tests/unit/fields/Link.spec.ts index f8631b67..b1b971a6 100644 --- a/packages/form/tests/unit/fields/Link.spec.ts +++ b/packages/form/tests/unit/fields/Link.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { FormState, MForm, MFormDialog, MLink } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElButton } from 'element-plus'; -import MagicForm, { FormState, MForm, MFormDialog, MLink } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -46,24 +46,23 @@ const getWrapper = ( }); describe('Link', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(() => { - const link = wrapper.findComponent(MLink); - expect(link.exists()).toBe(true); - // displayText 字段配置 - expect(link.text()).toContain('链接'); + await nextTick(); - const a = wrapper.find('a'); - expect(a.exists()).toBe(true); - // href 字段配置 - expect(a.element.href).toMatch('www.google.com'); - done(); - }, 0); + const link = wrapper.findComponent(MLink); + expect(link.exists()).toBe(true); + // displayText 字段配置 + expect(link.text()).toContain('链接'); + + const a = wrapper.find('a'); + expect(a.exists()).toBe(true); + // href 字段配置 + expect(a.element.href).toMatch('www.google.com'); }); - test('默认文字', (done) => { + test('默认文字', async () => { const wrapper = getWrapper( [ { @@ -78,21 +77,20 @@ describe('Link', () => { }, ); - setTimeout(() => { - const link = wrapper.findComponent(MLink); - expect(link.exists()).toBe(true); - // 默认displayText - expect(link.text()).toContain('跳转'); + await nextTick(); - const a = wrapper.find('a'); - expect(a.exists()).toBe(true); - // 渲染出来的 a 元素的 href 属性 - expect(a.element.href).toMatch('www.baidu.com'); - done(); - }, 0); + const link = wrapper.findComponent(MLink); + expect(link.exists()).toBe(true); + // 默认displayText + expect(link.text()).toContain('跳转'); + + const a = wrapper.find('a'); + expect(a.exists()).toBe(true); + // 渲染出来的 a 元素的 href 属性 + expect(a.element.href).toMatch('www.baidu.com'); }); - test('displayText为函数', (done) => { + test('displayText为函数', async () => { const wrapper = getWrapper([ { type: 'link', @@ -118,19 +116,18 @@ describe('Link', () => { }, ]); - setTimeout(() => { - const link = wrapper.findComponent(MLink); - expect(link.exists()).toBe(true); - expect(link.text()).toContain('谷歌'); + await nextTick(); - const a = wrapper.find('a'); - expect(a.exists()).toBe(true); - expect(a.element.href).toMatch('www.google.com'); - done(); - }, 0); + const link = wrapper.findComponent(MLink); + expect(link.exists()).toBe(true); + expect(link.text()).toContain('谷歌'); + + const a = wrapper.find('a'); + expect(a.exists()).toBe(true); + expect(a.element.href).toMatch('www.google.com'); }); - test('不可编辑', (done) => { + test('不可编辑', async () => { const wrapper = getWrapper( [ { @@ -146,16 +143,15 @@ describe('Link', () => { }, ); - setTimeout(() => { - const link = wrapper.findComponent(MLink); - expect((link.vm as any).disabled).toBe(true); - const span = wrapper.find('span'); - expect(span.exists()).toBe(true); - done(); - }, 0); + await nextTick(); + + const link = wrapper.findComponent(MLink); + expect((link.vm as any).disabled).toBe(true); + const span = wrapper.find('span'); + expect(span.exists()).toBe(true); }); - test('编辑链接', (done) => { + test('编辑链接', async () => { const wrapper = getWrapper([ { type: 'link', @@ -166,15 +162,14 @@ describe('Link', () => { }, ]); - setTimeout(async () => { - const button = wrapper.findComponent(ElButton); - expect(button.exists()).toBe(true); - await button.trigger('click'); + await nextTick(); - const dialog = wrapper.findComponent(MFormDialog); - expect(dialog.exists()).toBe(true); - dialog.vm.$emit('submit'); - done(); - }, 0); + const button = wrapper.findComponent(ElButton); + expect(button.exists()).toBe(true); + await button.trigger('click'); + + const dialog = wrapper.findComponent(MFormDialog); + expect(dialog.exists()).toBe(true); + dialog.vm.$emit('submit'); }); }); diff --git a/packages/form/tests/unit/fields/Number.spec.ts b/packages/form/tests/unit/fields/Number.spec.ts index 2bc06229..58bcd891 100644 --- a/packages/form/tests/unit/fields/Number.spec.ts +++ b/packages/form/tests/unit/fields/Number.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MNumber } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MNumber } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,18 +44,18 @@ const getWrapper = ( }); describe('Number', () => { - test('基础功能', (done) => { + test('基础功能', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const num = wrapper.findComponent(MNumber); - expect(num.exists()).toBe(true); - const value = await (wrapper.vm as any).submitForm(); - expect(value.number).toBe(0); - done(); - }, 0); + + await nextTick(); + + const num = wrapper.findComponent(MNumber); + expect(num.exists()).toBe(true); + const value = await (wrapper.vm as any).submitForm(); + expect(value.number).toBe(0); }); - test('默认值', (done) => { + test('默认值', async () => { const wrapper = getWrapper([ { text: 'number', @@ -65,14 +65,13 @@ describe('Number', () => { }, ]); - setTimeout(async () => { - const value = await (wrapper.vm as any).submitForm(); - expect(value.number).toBe(5); - done(); - }, 0); + await nextTick(); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.number).toBe(5); }); - test('增加减少', (done) => { + test('增加减少', async () => { const wrapper = getWrapper([ { text: 'number', @@ -82,28 +81,27 @@ describe('Number', () => { }, ]); - setTimeout(async () => { - const increase = wrapper.find('.el-input-number__increase'); - const decrease = wrapper.find('.el-input-number__decrease'); - expect(increase.exists()).toBe(true); - expect(decrease.exists()).toBe(true); + await nextTick(); - await increase.trigger('keydown', { - key: 'enter', - }); + const increase = wrapper.find('.el-input-number__increase'); + const decrease = wrapper.find('.el-input-number__decrease'); + expect(increase.exists()).toBe(true); + expect(decrease.exists()).toBe(true); - expect((wrapper.vm as any).values.number).toBe(2); - - await decrease.trigger('keydown', { - key: 'enter', - }); - - expect((wrapper.vm as any).values.number).toBe(0); - done(); + await increase.trigger('keydown', { + key: 'enter', }); + + expect((wrapper.vm as any).values.number).toBe(2); + + await decrease.trigger('keydown', { + key: 'enter', + }); + + expect((wrapper.vm as any).values.number).toBe(0); }); - test('最大最小值', (done) => { + test('最大最小值', async () => { const wrapper = getWrapper([ { text: 'number', @@ -114,14 +112,13 @@ describe('Number', () => { }, ]); - setTimeout(async () => { - const num = wrapper.findComponent(MNumber); - const input = num.find('input'); - await input.setValue(100); - expect((wrapper.vm as any).values.number).toBe(10); - await input.setValue(-10); - expect((wrapper.vm as any).values.number).toBe(0); - done(); - }, 0); + await nextTick(); + + const num = wrapper.findComponent(MNumber); + const input = num.find('input'); + await input.setValue(100); + expect((wrapper.vm as any).values.number).toBe(10); + await input.setValue(-10); + expect((wrapper.vm as any).values.number).toBe(0); }); }); diff --git a/packages/form/tests/unit/fields/RadioGroup.spec.ts b/packages/form/tests/unit/fields/RadioGroup.spec.ts index 37c445cf..f250354c 100644 --- a/packages/form/tests/unit/fields/RadioGroup.spec.ts +++ b/packages/form/tests/unit/fields/RadioGroup.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MRadioGroup } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MRadioGroup } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -52,20 +52,19 @@ const getWrapper = ( }); describe('RadioGroup', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const radioGroup = wrapper.findComponent(MRadioGroup); - expect(radioGroup.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.radioGroup).toMatch(''); - done(); - }, 0); + const radioGroup = wrapper.findComponent(MRadioGroup); + expect(radioGroup.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.radioGroup).toMatch(''); }); - test('默认选中', (done) => { + test('默认选中', async () => { const wrapper = getWrapper( [ { @@ -89,10 +88,9 @@ describe('RadioGroup', () => { }, ); - setTimeout(async () => { - const value = await (wrapper.vm as any).submitForm(); - expect(value.radioGroup).toEqual(1); - done(); - }, 0); + await nextTick(); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.radioGroup).toEqual(1); }); }); diff --git a/packages/form/tests/unit/fields/Switch.spec.ts b/packages/form/tests/unit/fields/Switch.spec.ts index c641c1f3..4f35e2b1 100644 --- a/packages/form/tests/unit/fields/Switch.spec.ts +++ b/packages/form/tests/unit/fields/Switch.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MSwitch } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MSwitch } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,20 +44,19 @@ const getWrapper = ( }); describe('Switch', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const sw = wrapper.findComponent(MSwitch); - expect(sw.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.switch).toBe(false); - done(); - }, 0); + const sw = wrapper.findComponent(MSwitch); + expect(sw.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.switch).toBe(false); }); - test('数字默认值', (done) => { + test('数字默认值', async () => { const wrapper = getWrapper([ { type: 'switch', @@ -67,17 +66,16 @@ describe('Switch', () => { }, ]); - setTimeout(async () => { - const sw = wrapper.findComponent(MSwitch); - expect(sw.exists()).toBe(true); + await nextTick(); - const value = await (wrapper.vm as any).submitForm(); - expect(value.switch).toBe(0); - done(); - }, 0); + const sw = wrapper.findComponent(MSwitch); + expect(sw.exists()).toBe(true); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.switch).toBe(0); }); - test('点击开关', (done) => { + test('点击开关', async () => { const wrapper = getWrapper([ { type: 'switch', @@ -88,17 +86,16 @@ describe('Switch', () => { }, ]); - setTimeout(async () => { - const value = await (wrapper.vm as any).submitForm(); - expect(value.switch).toMatch('inactive'); + await nextTick(); - const input = wrapper.find('input'); - expect(input.exists()).toBe(true); - await input.trigger('click'); + const value = await (wrapper.vm as any).submitForm(); + expect(value.switch).toMatch('inactive'); - const value2 = await (wrapper.vm as any).submitForm(); - expect(value2.switch).toMatch('active'); - done(); - }, 0); + const input = wrapper.find('input'); + expect(input.exists()).toBe(true); + await input.trigger('click'); + + const value2 = await (wrapper.vm as any).submitForm(); + expect(value2.switch).toMatch('active'); }); }); diff --git a/packages/form/tests/unit/fields/Text.spec.ts b/packages/form/tests/unit/fields/Text.spec.ts index 4fd9294c..d2fd428c 100644 --- a/packages/form/tests/unit/fields/Text.spec.ts +++ b/packages/form/tests/unit/fields/Text.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MText } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus, { ElButton } from 'element-plus'; -import MagicForm, { MForm, MText } from '../../../src'; - /** * 获取mock的Text实例 * @param config 配置 @@ -50,20 +50,19 @@ const getWrapper = ( }); describe('Text', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const text = wrapper.findComponent(MText); - expect(text.exists()).toBe(true); - const value = await (wrapper.vm as any).submitForm(); - // 默认值 - expect(value.text).toBe('text'); - done(); - }, 0); + await nextTick(); + + const text = wrapper.findComponent(MText); + expect(text.exists()).toBe(true); + const value = await (wrapper.vm as any).submitForm(); + // 默认值 + expect(value.text).toBe('text'); }); - test('append string', (done) => { + test('append string', async () => { const wrapper = getWrapper([ { text: 'text', @@ -73,13 +72,12 @@ describe('Text', () => { }, ]); - setTimeout(async () => { - expect(wrapper.text()).toContain('appendText'); - done(); - }, 0); + await nextTick(); + + expect(wrapper.text()).toContain('appendText'); }); - test('append button', (done) => { + test('append button', async () => { // 用来标识append按钮是否有点击 let clickFlag = false; const wrapper = getWrapper([ @@ -95,17 +93,16 @@ describe('Text', () => { }, ]); - setTimeout(async () => { - expect(wrapper.text()).toContain('appendText'); - const button = wrapper.findComponent(ElButton); - expect(clickFlag).toBe(false); - await button.trigger('click'); - expect(clickFlag).toBe(true); - done(); - }, 0); + await nextTick(); + + expect(wrapper.text()).toContain('appendText'); + const button = wrapper.findComponent(ElButton); + expect(clickFlag).toBe(false); + await button.trigger('click'); + expect(clickFlag).toBe(true); }); - test('key ArrowUp', (done) => { + test('key ArrowUp', async () => { const wrapper = getWrapper( [ { @@ -120,18 +117,17 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘上键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowUp', - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(1); - done(); - }, 0); + await nextTick(); + + // 点击键盘上键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowUp', + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(1); }); - test('key ArrowDown', (done) => { + test('key ArrowDown', async () => { const wrapper = getWrapper( [ { @@ -146,18 +142,17 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘下键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowDown', - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(-1); - done(); - }, 0); + await nextTick(); + + // 点击键盘下键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowDown', + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(-1); }); - test('key ctrlKey ArrowUp', (done) => { + test('key ctrlKey ArrowUp', async () => { const wrapper = getWrapper( [ { @@ -172,19 +167,18 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘ctrl + 上键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowUp', - ctrlKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(100); - done(); - }, 0); + await nextTick(); + + // 点击键盘ctrl + 上键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowUp', + ctrlKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(100); }); - test('key ctrlKey ArrowDown', (done) => { + test('key ctrlKey ArrowDown', async () => { const wrapper = getWrapper( [ { @@ -199,19 +193,18 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘ctrl + 下键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowDown', - ctrlKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(-100); - done(); - }, 0); + await nextTick(); + + // 点击键盘ctrl + 下键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowDown', + ctrlKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(-100); }); - test('key shiftKey ArrowUp', (done) => { + test('key shiftKey ArrowUp', async () => { const wrapper = getWrapper( [ { @@ -226,19 +219,18 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘shift + 上键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowUp', - shiftKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(10); - done(); - }, 0); + await nextTick(); + + // 点击键盘shift + 上键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowUp', + shiftKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(10); }); - test('key shiftKey ArrowDown', (done) => { + test('key shiftKey ArrowDown', async () => { const wrapper = getWrapper( [ { @@ -253,19 +245,18 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘shift + 下键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowDown', - shiftKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(-10); - done(); - }, 0); + await nextTick(); + + // 点击键盘shift + 下键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowDown', + shiftKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(-10); }); - test('key altKey ArrowUp', (done) => { + test('key altKey ArrowUp', async () => { const wrapper = getWrapper( [ { @@ -280,19 +271,18 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘alt + 上键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowUp', - altKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(0.1); - done(); - }, 0); + await nextTick(); + + // 点击键盘alt + 上键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowUp', + altKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(0.1); }); - test('key altKey ArrowDown', (done) => { + test('key altKey ArrowDown', async () => { const wrapper = getWrapper( [ { @@ -307,15 +297,14 @@ describe('Text', () => { }, ); - setTimeout(async () => { - // 点击键盘alt + 下键 - await wrapper.find('input').trigger('keyup', { - key: 'ArrowDown', - altKey: true, - }); - const value = await (wrapper.vm as any).submitForm(); - expect(value.text).toBe(-0.1); - done(); - }, 0); + await nextTick(); + + // 点击键盘alt + 下键 + await wrapper.find('input').trigger('keyup', { + key: 'ArrowDown', + altKey: true, + }); + const value = await (wrapper.vm as any).submitForm(); + expect(value.text).toBe(-0.1); }); }); diff --git a/packages/form/tests/unit/fields/Textarea.spec.ts b/packages/form/tests/unit/fields/Textarea.spec.ts index a2e42b50..e163b539 100644 --- a/packages/form/tests/unit/fields/Textarea.spec.ts +++ b/packages/form/tests/unit/fields/Textarea.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MTextarea } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MTextarea } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,22 +44,21 @@ const getWrapper = ( }); describe('Textarea', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const textarea = wrapper.findComponent(MTextarea); - expect(textarea.exists()).toBe(true); + await nextTick(); - const input = wrapper.find('textarea'); - await input.setValue('hello'); + const textarea = wrapper.findComponent(MTextarea); + expect(textarea.exists()).toBe(true); - await textarea.trigger('input'); - await textarea.trigger('change'); + const input = wrapper.find('textarea'); + await input.setValue('hello'); - const value = await (wrapper.vm as any).submitForm(); - expect(value.textarea).toMatch('hello'); - done(); - }, 0); + await textarea.trigger('input'); + await textarea.trigger('change'); + + const value = await (wrapper.vm as any).submitForm(); + expect(value.textarea).toMatch('hello'); }); }); diff --git a/packages/form/tests/unit/fields/Time.spec.ts b/packages/form/tests/unit/fields/Time.spec.ts index ebe20fe5..761425b6 100644 --- a/packages/form/tests/unit/fields/Time.spec.ts +++ b/packages/form/tests/unit/fields/Time.spec.ts @@ -16,11 +16,11 @@ * limitations under the License. */ import { describe, expect, test } from 'vitest'; +import { nextTick } from 'vue'; +import MagicForm, { MForm, MTime } from '@form/index'; import { mount } from '@vue/test-utils'; import ElementPlus from 'element-plus'; -import MagicForm, { MForm, MTime } from '../../../src'; - const getWrapper = ( config: any = [ { @@ -44,21 +44,20 @@ const getWrapper = ( }); describe('Time', () => { - test('基础', (done) => { + test('基础', async () => { const wrapper = getWrapper(); - setTimeout(async () => { - const time = wrapper.findComponent(MTime); - expect(time.exists()).toBe(true); + await nextTick(); - const input = wrapper.find('input'); - expect(input.exists()).toBe(true); - await input.setValue('12:00:00'); + const time = wrapper.findComponent(MTime); + expect(time.exists()).toBe(true); - time.vm.$emit('change', new Date('12:00:00')); - const value = await (wrapper.vm as any).submitForm(); - expect(value.time).toMatch('12:00:00'); - done(); - }, 0); + const input = wrapper.find('input'); + expect(input.exists()).toBe(true); + await input.setValue('12:00:00'); + + const value = await (wrapper.vm as any).submitForm(); + console.log(value.time); + expect(value.time).toMatch('12:00:00'); }); }); diff --git a/packages/form/tests/unit/utils/config.spec.ts b/packages/form/tests/unit/utils/config.spec.ts index 6bef49f8..8ce7a411 100644 --- a/packages/form/tests/unit/utils/config.spec.ts +++ b/packages/form/tests/unit/utils/config.spec.ts @@ -16,13 +16,12 @@ * limitations under the License. */ import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'; +import { getConfig, setConfig } from '@form/utils/config'; describe('config.ts', () => { - let mockModule: any; - beforeEach(() => { // 重置后重新获取模块 - mockModule = require('../../../src/utils/config'); + setConfig({}); }); // 在测试后都重置mock模块 @@ -31,24 +30,24 @@ describe('config.ts', () => { }); test('设置获取属性', () => { - mockModule.setConfig({ text: 'form', model: { config: { text: 'test' } } }); - expect(mockModule.getConfig('model')).toEqual({ config: { text: 'test' } }); + setConfig({ text: 'form', model: { config: { text: 'test' } } }); + expect(getConfig('model')).toEqual({ config: { text: 'test' } }); }); test('获取不存在的属性', () => { - expect(mockModule.getConfig('model')).toBeUndefined(); - mockModule.setConfig({ text: 'form', model: { config: { text: 'test' } } }); - expect(mockModule.getConfig('config')).toBeUndefined(); + expect(getConfig('model')).toBeUndefined(); + setConfig({ text: 'form', model: { config: { text: 'test' } } }); + expect(getConfig('config')).toBeUndefined(); }); test('修改已经存在的form', () => { - mockModule.setConfig({ text: 'form', model: { config: { text: 'test' } } }); - expect(mockModule.getConfig('text')).toMatch('form'); - mockModule.setConfig({ text: 'new-form', model: { config: { text: 'test' } } }); - expect(mockModule.getConfig('text')).toMatch('new-form'); + setConfig({ text: 'form', model: { config: { text: 'test' } } }); + expect(getConfig('text')).toMatch('form'); + setConfig({ text: 'new-form', model: { config: { text: 'test' } } }); + expect(getConfig('text')).toMatch('new-form'); }); test('在未设置时获取Config', () => { - expect(mockModule.getConfig('model')).toBeUndefined(); + expect(getConfig('model')).toBeUndefined(); }); }); diff --git a/packages/form/tests/unit/utils/form.spec.ts b/packages/form/tests/unit/utils/form.spec.ts index f4571264..40d1a751 100644 --- a/packages/form/tests/unit/utils/form.spec.ts +++ b/packages/form/tests/unit/utils/form.spec.ts @@ -17,10 +17,8 @@ */ import { describe, expect, test } from 'vitest'; - -import { FormState } from '@tmagic/form'; - -import { display, filterFunction, getRules, initValue } from '../../../src/utils/form'; +import { FormState } from '@form/index'; +import { display, filterFunction, getRules, initValue } from '@form/utils/form'; // form state mock 数据 const mForm: FormState = { @@ -65,7 +63,9 @@ describe('getRules', () => { const rules: any = { validator: () => 1, }; - const props = {}; + const props = { + config: {}, + }; const newRules: any = getRules(mForm, rules, props); expect(newRules[0].validator({} as any, {} as any, {})).toBe(1); }); diff --git a/packages/utils/tests/unit/index.spec.ts b/packages/utils/tests/unit/index.spec.ts index e37f7c48..0740c76b 100644 --- a/packages/utils/tests/unit/index.spec.ts +++ b/packages/utils/tests/unit/index.spec.ts @@ -16,7 +16,7 @@ * limitations under the License. */ -import { describe, expect, test, vi } from 'vitest'; +import { describe, expect, test } from 'vitest'; import * as util from '../../src'; @@ -51,25 +51,6 @@ describe('datetimeFormatter', () => { }); }); -describe('util', () => { - vi.useFakeTimers(); - - test.skip('sleep', (done) => { - const callback = vi.fn(); - - util - .sleep(500) - .then(callback) - .then(() => { - expect(callback).toBeCalled(); - done(); - }); - - // 快进500毫秒，callback应该已执行 - vi.advanceTimersByTime(500); - }); -}); - describe('asyncLoadJs', () => { const url = 'https://m.film.qq.com/magic-ui/production/1/1625056093304/magic/magic-ui.umd.min.js'; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 41e9d21b..9bbc1c54 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,7 @@ importers: '@typescript-eslint/eslint-plugin': ^4.28.0 '@typescript-eslint/parser': ^4.28.0 '@vitejs/plugin-vue': ^3.1.0 + '@vitest/coverage-c8': ^0.23.4 c8: ^7.11.3 chalk: ^4.1.0 commitizen: ^4.2.4 @@ -45,6 +46,7 @@ importers: '@typescript-eslint/eslint-plugin': 4.33.0_3ekaj7j3owlolnuhj3ykrb7u7i '@typescript-eslint/parser': 4.33.0_hxadhbs2xogijvk7vq4t2azzbu '@vitejs/plugin-vue': 3.1.0_vite@3.1.3+vue@3.2.37 + '@vitest/coverage-c8': 0.23.4_jsdom@19.0.0 c8: 7.11.3 chalk: 4.1.2 commitizen: 4.2.4 @@ -1838,6 +1840,24 @@ packages: vue: 2.7.4 dev: true + /@vitest/coverage-c8/0.23.4_jsdom@19.0.0: + resolution: {integrity: sha512-jmD00a5DQH9gu9K+YdvVhcMuv2CzHvU4gCnySS40Ec5hKlXtlCzRfNHl00VnhfuBeaQUmaQYe60BLT413HyDdg==} + dependencies: + c8: 7.12.0 + vitest: 0.23.4_jsdom@19.0.0 + transitivePeerDependencies: + - '@edge-runtime/vm' + - '@vitest/browser' + - '@vitest/ui' + - happy-dom + - jsdom + - less + - sass + - stylus + - supports-color + - terser + dev: true + /@volar/code-gen/0.39.4: resolution: {integrity: sha512-2RoDdktnN5ovhJoL1NgxKwKhfgP2TzcKVWp8+1Lb67sZ+hvWRL5GjHGkvlPkS91cElpwuURUHnbNNDT+uEqXuA==} dependencies: @@ -2637,6 +2657,25 @@ packages: yargs-parser: 20.2.9 dev: true + /c8/7.12.0: + resolution: {integrity: sha512-CtgQrHOkyxr5koX1wEUmN/5cfDa2ckbHRA4Gy5LAL0zaCFtVWJS5++n+w4/sr2GWGerBxgTjpKeDclk/Qk6W/A==} + engines: {node: '>=10.12.0'} + hasBin: true + dependencies: + '@bcoe/v8-coverage': 0.2.3 + '@istanbuljs/schema': 0.1.3 + find-up: 5.0.0 + foreground-child: 2.0.0 + istanbul-lib-coverage: 3.2.0 + istanbul-lib-report: 3.0.0 + istanbul-reports: 3.1.4 + rimraf: 3.0.2 + test-exclude: 6.0.0 + v8-to-istanbul: 9.0.0 + yargs: 16.2.0 + yargs-parser: 20.2.9 + dev: true + /cac/6.7.12: resolution: {integrity: sha512-rM7E2ygtMkJqD9c7WnFU6fruFcN3xe4FM5yUmgxhZzIKJk4uHl9U/fhwdajGFQbQuv43FAUo1Fe8gX/oIKDeSA==} engines: {node: '>=8'} diff --git a/tsconfig.json b/tsconfig.json index 83bff6f0..0051e894 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -20,6 +20,7 @@ // 内部模块都指向 src/index.ts, 会有更好的代码跳转体验. "@tmagic/*": ["packages/*/src"], "@editor/*": ["packages/editor/src/*"], + "@form/*": ["packages/form/src/*"], }, "types": [ "node", diff --git a/vitest.config.ts b/vitest.config.ts index 7f1c21f8..328145e8 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -17,8 +17,8 @@ export default defineConfig({ 'magic-admin/**', ], include: [ - './packages/editor/tests/unit/utils/**', - './packages/editor/tests/unit/services/**', + './packages/editor/tests/**', + './packages/form/tests/**', './packages/stage/tests/**', './packages/utils/tests/**', ],