test(editor): 使用 vi.waitFor 稳定 CompareForm 与 ViewForm 单测

packages/editor/tests/unit/components/CompareForm.spec.ts

@@ -5,7 +5,7 @@
  */
 import { beforeEach, describe, expect, test, vi } from 'vitest';
 import { defineComponent, h, nextTick, ref } from 'vue';
-import { mount } from '@vue/test-utils';
+import { mount, type VueWrapper } from '@vue/test-utils';
 
 import { HookType } from '@tmagic/core';
 
@@ -63,6 +63,12 @@ beforeEach(() => {
   capturedFormProps = {};
 });
 
+const waitForFormReady = async (wrapper: VueWrapper) => {
+  await vi.waitFor(() => {
+    expect(wrapper.find('.fake-mform').exists()).toBe(true);
+  });
+};
+
 describe('CompareForm.vue', () => {
   test('node 类别按 type 加载 props 配置并展示 MForm', async () => {
     const wrapper = mount(CompareForm, {
@@ -79,8 +85,7 @@ describe('CompareForm.vue', () => {
         },
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
 
     expect(propsService.getPropsConfig).toHaveBeenCalledWith('text', { node: { id: 'n1', name: 'new' } });
     expect(wrapper.find('.fake-mform').exists()).toBe(true);
@@ -167,7 +172,7 @@ describe('CompareForm.vue', () => {
   });
 
   test('showDiff 对 code-select 的空形态视为相等', async () => {
-    mount(CompareForm, {
+    const wrapper = mount(CompareForm, {
       props: {
         category: 'node',
         type: 'text',
@@ -175,8 +180,7 @@ describe('CompareForm.vue', () => {
         services,
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
     expect(capturedShowDiff).toBeTypeOf('function');
     expect(
       capturedShowDiff!({

packages/editor/tests/unit/components/ViewForm.spec.ts

@@ -5,7 +5,7 @@
  */
 import { beforeEach, describe, expect, test, vi } from 'vitest';
 import { defineComponent, h, nextTick } from 'vue';
-import { mount } from '@vue/test-utils';
+import { mount, type VueWrapper } from '@vue/test-utils';
 
 import ViewForm from '@editor/components/ViewForm.vue';
 
@@ -52,6 +52,12 @@ beforeEach(() => {
   capturedFormProps = {};
 });
 
+const waitForFormReady = async (wrapper: VueWrapper) => {
+  await vi.waitFor(() => {
+    expect(wrapper.find('.fake-mform').exists()).toBe(true);
+  });
+};
+
 describe('ViewForm.vue', () => {
   test('node 类别按 type 加载配置并渲染 MForm', async () => {
     const wrapper = mount(ViewForm, {
@@ -62,15 +68,14 @@ describe('ViewForm.vue', () => {
         services,
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
     expect(propsService.getPropsConfig).toHaveBeenCalledWith('text', { node: { id: 'n1', name: 'a' } });
     expect(wrapper.find('.fake-mform').exists()).toBe(true);
     expect(capturedFormProps.initValues).toEqual({ id: 'n1', name: 'a' });
   });
 
   test('默认 disabled 为 true', async () => {
-    mount(ViewForm, {
+    const wrapper = mount(ViewForm, {
       props: {
         category: 'node',
         type: 'text',
@@ -78,13 +83,12 @@ describe('ViewForm.vue', () => {
         services,
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
     expect(capturedFormProps.disabled).toBe(true);
   });
 
   test('可通过 disabled=false 覆盖为可编辑', async () => {
-    mount(ViewForm, {
+    const wrapper = mount(ViewForm, {
       props: {
         category: 'node',
         type: 'text',
@@ -93,13 +97,12 @@ describe('ViewForm.vue', () => {
         services,
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
     expect(capturedFormProps.disabled).toBe(false);
   });
 
   test('size 透传给 MForm', async () => {
-    mount(ViewForm, {
+    const wrapper = mount(ViewForm, {
       props: {
         category: 'node',
         type: 'text',
@@ -108,8 +111,7 @@ describe('ViewForm.vue', () => {
         services,
       },
     });
-    await nextTick();
+    await waitForFormReady(wrapper);
-    await nextTick();
     expect(capturedFormProps.size).toBe('small');
   });