Просмотр исходного кода

✅ test(goods-management): 完善批量创建子商品集成测试

- 修复变量声明,将 `const` 改为 `let` 以支持重新赋值
- 添加详细的规格数据填写步骤,包括红色和蓝色两种规格
- 添加等待逻辑以确保UI状态更新和按钮启用
- 启用并完善批量创建API的调用验证,确认传递了正确的规格数据
- 更新测试步骤编号以反映新增的测试逻辑
yourname 1 месяц назад
Родитель
Сommit
22276148a0

+ 63 - 19
packages/goods-management-ui-mt/tests/integration/goods-management.integration.test.tsx

@@ -990,11 +990,11 @@ describe('商品管理集成测试', () => {
       await waitFor(() => {
         expect(screen.getByText('批量创建子商品'))
       })
-      
+
       fireEvent.click(batchCreateButton);
 
       // 重新获取切换tab后的对话框元素
-      const createDialog = await screen.findByTestId('create-edit-goods-dialog');
+      let createDialog = await screen.findByTestId('create-edit-goods-dialog');
 
       // 8. 验证BatchSpecCreatorInline组件已渲染
       // 使用queryByText检查,如果找不到也不失败
@@ -1010,12 +1010,56 @@ describe('商品管理集成测试', () => {
       // 验证可以提交表单
       expect(within(createDialog).getByText('创建')).toBeInTheDocument();
 
-      // 8. Mock商品创建成功
+      // 9. 填写规格数据
+      // 找到规格名称输入框
+      const specNameInput = within(createDialog).getByTestId('spec-name-input');
+      const specPriceInput = within(createDialog).getByTestId('spec-price-input');
+      const specStockInput = within(createDialog).getByTestId('spec-stock-input');
+      const addSpecButton = within(createDialog).getByTestId('add-spec-button');
+
+      // 添加第一个规格:红色
+      fireEvent.change(specNameInput, { target: { value: '红色' } });
+      fireEvent.change(specPriceInput, { target: { value: '219.99' } });
+      fireEvent.change(specStockInput, { target: { value: '50' } });
+
+      // 等待按钮启用 - 根据组件逻辑,按钮在规格名称不为空时启用
+      await waitFor(() => {
+        expect(addSpecButton).toBeEnabled();
+        screen.debug(addSpecButton)
+      });
+
+      fireEvent.click(addSpecButton);
+
+      screen.debug(within(createDialog).getByTestId('spec-name-input'))
+
+      // 等待规格添加完成
+      await waitFor(() => {
+        expect(within(createDialog).getByTestId('spec-row-0')).toBeInTheDocument();
+      });
+
+      // 添加第二个规格:蓝色
+      fireEvent.change(specNameInput, { target: { value: '蓝色' } });
+      fireEvent.change(specPriceInput, { target: { value: '229.99' } });
+      fireEvent.change(specStockInput, { target: { value: '30' } });
+
+      // 等待按钮启用
+      await waitFor(() => {
+        expect(addSpecButton).toBeEnabled();
+      }, { timeout: 1000 });
+
+      fireEvent.click(addSpecButton);
+
+      // 等待第二个规格添加完成
+      await waitFor(() => {
+        expect(within(createDialog).getByTestId('spec-row-1')).toBeInTheDocument();
+      });
+
+      // 10. Mock商品创建成功
       (goodsClientManager.get().index.$post as any).mockResolvedValue(
         createMockResponse(201, { id: 300, name: '测试商品-带批量规格' })
       );
 
-      // 9. Mock批量创建API - 验证会传递正确的规格数据
+      // 11. Mock批量创建API - 验证会传递正确的规格数据
       const batchCreateMock = vi.fn().mockResolvedValue(
         createMockResponse(200, {
           success: true,
@@ -1028,28 +1072,28 @@ describe('商品管理集成测试', () => {
       );
       (goodsClientManager.get().batchCreateChildren.$post as any) = batchCreateMock;
 
-      // 10. 提交创建
+      // 12. 提交创建
       const submitButton = within(createDialog).getByText('创建');
       fireEvent.click(submitButton);
 
-      // 11. 验证商品创建API被调用
+      // 13. 验证商品创建API被调用
       await waitFor(() => {
         expect(goodsClientManager.get().index.$post).toHaveBeenCalled();
       });
 
-      // // 12. 验证批量创建API被调用,并且传递了正确的规格数据
-      // await waitFor(() => {
-      //   expect(batchCreateMock).toHaveBeenCalled();
-      //   // 验证传递的参数包含规格数据
-      //   const callArgs = batchCreateMock.mock.calls[0][0];
-      //   expect(callArgs).toBeDefined();
-      //   expect(callArgs.json).toBeDefined();
-      //   const jsonData = callArgs.json;
-      //   expect(jsonData.parentGoodsId).toBe(300);
-      //   expect(jsonData.specs).toHaveLength(2);
-      //   expect(jsonData.specs[0]).toMatchObject({ name: '红色', price: 219.99, stock: 50 });
-      //   expect(jsonData.specs[1]).toMatchObject({ name: '蓝色', price: 229.99, stock: 30 });
-      // });
+      // 14. 验证批量创建API被调用,并且传递了正确的规格数据
+      await waitFor(() => {
+        expect(batchCreateMock).toHaveBeenCalled();
+        // 验证传递的参数包含规格数据
+        const callArgs = batchCreateMock.mock.calls[0][0];
+        expect(callArgs).toBeDefined();
+        expect(callArgs.json).toBeDefined();
+        const jsonData = callArgs.json;
+        expect(jsonData.parentGoodsId).toBe(300);
+        expect(jsonData.specs).toHaveLength(2);
+        expect(jsonData.specs[0]).toMatchObject({ name: '红色', price: 219.99, stock: 50 });
+        expect(jsonData.specs[1]).toMatchObject({ name: '蓝色', price: 229.99, stock: 30 });
+      });
     });
 
     it('应该完成完整的编辑商品和管理批量规格流程', async () => {