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

🐛 fix(disability-person-management-ui): 修复PhotoUploadField单元测试

- 修复"应该支持自定义最大照片数量"测试逻辑,验证按钮禁用状态
- 修复"应该移除照片"测试,为删除按钮添加data-testid
- 所有PhotoUploadField测试现在全部通过

🤖 Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
yourname 1 неделя назад
Родитель
Сommit
33a9d55673

+ 1 - 0
allin-packages/disability-person-management-ui/src/components/PhotoUploadField.tsx

@@ -131,6 +131,7 @@ export const PhotoUploadField: React.FC<PhotoUploadFieldProps> = ({
                     size="sm"
                     onClick={() => handleRemovePhoto(index)}
                     className="text-red-500 hover:text-red-700 hover:bg-red-50"
+                    data-testid={`remove-photo-button-${index}`}
                   >
                     <Trash2 className="h-4 w-4" />
                   </Button>

+ 13 - 14
allin-packages/disability-person-management-ui/tests/unit/PhotoUploadField.test.tsx

@@ -81,7 +81,7 @@ describe('PhotoUploadField', () => {
     expect(defaultProps.onChange).toHaveBeenCalledTimes(6);
   });
 
-  it('应该支持自定义最大照片数量', () => {
+  it('应该支持自定义最大照片数量', async () => {
     render(<PhotoUploadField {...defaultProps} maxPhotos={3} />);
 
     const addButton = screen.getByTestId('add-photo-button');
@@ -91,10 +91,14 @@ describe('PhotoUploadField', () => {
       fireEvent.click(addButton);
     }
 
-    // 尝试添加第4张照片应该显示警告
+    // 第3张照片添加后,按钮应该被禁用
+    expect(addButton).toBeDisabled();
+
+    // 尝试添加第4张照片(按钮被禁用,不会触发事件)
     fireEvent.click(addButton);
 
-    expect(toast.warning).toHaveBeenCalledWith('最多只能上传 3 张照片');
+    // toast.warning不应该被调用,因为按钮被禁用
+    expect(toast.warning).not.toHaveBeenCalled();
   });
 
   it('应该移除照片', () => {
@@ -115,15 +119,9 @@ describe('PhotoUploadField', () => {
 
     render(<PhotoUploadField {...defaultProps} value={initialValue} />);
 
-    // 找到并点击删除按钮
-    const deleteButtons = screen.getAllByRole('button', { name: '' });
-    const firstDeleteButton = deleteButtons.find(button =>
-      button.innerHTML.includes('Trash2')
-    );
-
-    if (firstDeleteButton) {
-      fireEvent.click(firstDeleteButton);
-    }
+    // 找到并点击第一个删除按钮
+    const firstDeleteButton = screen.getByTestId('remove-photo-button-0');
+    fireEvent.click(firstDeleteButton);
 
     expect(defaultProps.onChange).toHaveBeenCalledWith([
       expect.objectContaining({
@@ -216,8 +214,9 @@ describe('PhotoUploadField', () => {
   it('应该显示正确的文件格式和大小限制提示', () => {
     render(<PhotoUploadField {...defaultProps} />);
 
-    expect(screen.getByText('支持的照片格式:JPG、JPEG、PNG、GIF、BMP、WebP等常见图片格式')).toBeInTheDocument();
-    expect(screen.getByText('文件大小限制:无限制(建议不超过500MB)')).toBeInTheDocument();
+    // 检查文本是否存在,使用包含匹配
+    expect(screen.getByText(/支持的照片格式:JPG、JPEG、PNG、GIF、BMP、WebP等常见图片格式/)).toBeInTheDocument();
+    expect(screen.getByText(/文件大小限制:无限制(建议不超过500MB)/)).toBeInTheDocument();
   });
 
   it('应该使用正确的文件选择器配置', () => {