refactor: 更新测试用例和组件结构

- 在背景测试中更新菜单项标题,移除图标
- 在 StorageCleaner 页面中更新初始化加载状态的中文文案
- 在 QrCode 组件中修正导入路径
- 在 DecodeResultPaper 中使用 Label 组件替换原生 label 元素
- 移除不再使用的 formatFileSize 函数
This commit is contained in:
雨霖铃
2026-06-14 09:40:05 +08:00
parent 24c83de56d
commit 618f3c36f2
11 changed files with 36 additions and 29 deletions
+2 -2
View File
@@ -36,7 +36,7 @@ describe('background 菜单注册与分流', () => {
expect(chrome.contextMenus.create).toHaveBeenCalledWith(
expect.objectContaining({
id: 'jwt',
title: '🔑 解析 JWT',
title: '解析 JWT',
parentId: 'testing-tools-parent',
}),
);
@@ -48,7 +48,7 @@ describe('background 菜单注册与分流', () => {
expect(chrome.contextMenus.create).toHaveBeenCalledWith(
expect.objectContaining({
id: 'qrCode-page',
title: '🔗 网页链接转二维码',
title: '网页链接转二维码',
contexts: ['page'],
}),
);
@@ -10,6 +10,7 @@
import { Download } from 'lucide-react';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { formatBytes } from '@/utils/format';
import { useI18n } from '@/utils/chromeI18n';
@@ -61,9 +62,9 @@ export default function DecodeResultPaper({
{/* 文件名输入 */}
<div className="mb-3">
<label className="block text-xs font-medium text-muted-foreground mb-1">
<Label className="block text-xs font-medium text-muted-foreground mb-1">
{t('decodedFileName')}
</label>
</Label>
<Input value={fileName} onChange={(e) => onFileNameChange(e.target.value)} />
</div>
+3 -3
View File
@@ -3,9 +3,9 @@ import { describe, it, expect } from 'vitest';
import Index from '../index';
describe('JsonTools 页面', () => {
it('应该渲染页面标题', () => {
it('应该渲染模式切换按钮', () => {
render(<Index />);
// 基本渲染测试
expect(screen.getByRole('button')).toBeInTheDocument();
// 基本渲染测试:页面含多个模式切换按钮,应至少渲染一个
expect(screen.getAllByRole('button').length).toBeGreaterThan(0);
});
});
+2 -2
View File
@@ -26,11 +26,11 @@ vi.mock('@/config/features', async (importOriginal) => {
};
});
vi.mock('@/components/QrCodePreview', () => ({
vi.mock('../components/QrCodePreview', () => ({
default: () => <div data-testid="qr-code-preview">QrCodePreview</div>,
}));
vi.mock('@/components/ImageUploader', () => ({
vi.mock('../components/ImageUploader', () => ({
default: () => <div data-testid="image-uploader">ImageUploader</div>,
}));
@@ -113,7 +113,7 @@ const ImageUploader = ({
? 'border-green-600 bg-green-50'
: selectedFile
? 'border-green-600 bg-green-50/50'
: 'border-input bg-muted hover:border-green-600 hover:bg-green-500/10/50'
: 'border-input bg-muted hover:border-green-600 hover:bg-green-500/10'
}`}
onDragOver={handleDragOver}
onDragLeave={handleDragLeave}
@@ -25,7 +25,8 @@ vi.mock('@/utils/storageCleaner', () => ({
describe('StorageCleaner 页面', () => {
it('应该渲染初始化加载状态', () => {
// storageCleaner:initializing 的中文文案为「正在读取站点数据...」
render(<Index />);
expect(screen.getByText(/initializing/i)).toBeInTheDocument();
expect(screen.getByText(/正在读取站点数据/)).toBeInTheDocument();
});
});
@@ -39,17 +39,20 @@ export function StorageCleanerConfirm({
'w-[90%] max-w-[340px] p-6 gap-0 rounded-2xl overflow-hidden shadow-xl border border-border bg-card text-card-foreground',
)}
>
{/* 头部标题区域 */}
<DialogHeader className="pt-1">
<DialogTitle className="text-center text-lg font-bold tracking-tight text-foreground">
{t('storageCleaner:confirmTitle')}
</DialogTitle>
</DialogHeader>
{/* 内容主体:限制最大宽度,防止内部元素在大分辨率下被横向拉得太松散 */}
<div className="text-center py-4 flex flex-col items-center w-full max-w-[280px] mx-auto">
<DialogDescription className="mb-4 text-xs font-medium text-muted-foreground/90 leading-relaxed">
{t('storageCleaner:confirmDesc')}
</DialogDescription>
{/* 待清理项目徽章群 */}
<div className="flex flex-wrap gap-1.5 justify-center mb-5 w-full">
{selectedOptions.map((label) => (
<Badge
@@ -62,6 +65,7 @@ export function StorageCleanerConfirm({
))}
</div>
{/* 风险警告横幅 */}
<div className="inline-flex items-center justify-center gap-1.5 px-3.5 py-2 rounded-lg bg-destructive/5 border border-dashed border-destructive/20 w-full max-w-[240px]">
<AlertTriangle className="h-3.5 w-3.5 text-destructive shrink-0" />
<span className="text-[11px] font-bold text-destructive leading-none tracking-tight">
+3 -3
View File
@@ -3,9 +3,9 @@ import { describe, it, expect } from 'vitest';
import Index from '../index';
describe('Timestamp 页面', () => {
it('应该渲染页面标题', () => {
it('应该渲染模式切换按钮', () => {
render(<Index />);
// 基本渲染测试
expect(screen.getByRole('button')).toBeInTheDocument();
// 基本渲染测试:页面含多个模式切换按钮,应至少渲染一个
expect(screen.getAllByRole('button').length).toBeGreaterThan(0);
});
});
+2 -2
View File
@@ -50,7 +50,7 @@ describe('contextMenu', () => {
);
expect(imageMenus).toHaveLength(1);
expect(imageMenus[0].id).toBe('qrCode-image');
expect(imageMenus[0].title).toBe('🖼️ 解析图片二维码');
expect(imageMenus[0].title).toBe('解析图片二维码');
});
});
@@ -73,7 +73,7 @@ describe('contextMenu', () => {
expect(chrome.contextMenus.create).toHaveBeenCalledWith({
id: 'jwt',
title: '🔑 解析 JWT',
title: '解析 JWT',
contexts: ['selection'],
parentId: 'testing-tools-parent',
});
-13
View File
@@ -2,8 +2,6 @@
* Base64 转换器工具函数
*/
import { formatBytes } from './format';
/** 最大文件大小限制(10 MB) */
export const MAX_FILE_SIZE = 10 * 1024 * 1024;
@@ -212,17 +210,6 @@ export function extractMimeTypeFromDataUri(dataUri: string): string {
return match ? match[1] : 'application/octet-stream';
}
/**
* 格式化文件大小显示
*
* @deprecated 直接使用 {@link formatBytes} 代替
* @param bytes 字节数
* @returns 格式化后的字符串
*/
export function formatFileSize(bytes: number): string {
return formatBytes(bytes);
}
/**
* Base64 解码为二进制后的产物
*/