雨霖铃
aa23a263fe
- 移除 react-i18next、i18next 及相关依赖
- 删除旧的 i18n/ 目录和 useLazyTranslation 工具
- 新增 utils/chromeI18n.ts 类型安全 wrapper（useI18n Hook + getMessage）
- 生成 public/_locales/{zh,en}/messages.json（298 个翻译 key）
- 批量更新 39+ 组件文件的导入和翻译调用
- 转换翻译键格式：namespace:key → namespace_key
- 修复 ErrorBoundary/PageErrorBoundary 从 withTranslation HOC 改为直接调用 getMessage
- 更新 vitest.setup.ts mock 加载实际翻译文本
- 修复 11 个测试文件的断言以匹配中文翻译
- TypeScript、ESLint、547 项测试全部通过
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
84 lines
2.9 KiB
TypeScript
84 lines
2.9 KiB
TypeScript
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
|
import { fireEvent, render, screen } from '@testing-library/react';
|
|
import DecodeResultPaper from '@/components/DecodeResultPaper';
|
|
|
|
describe('DecodeResultPaper 组件', () => {
|
|
const defaultProps = {
|
|
title: 'decodedFileOutput',
|
|
mimeType: 'image/png',
|
|
blobSize: 1024,
|
|
fileName: 'decoded.png',
|
|
onFileNameChange: vi.fn(),
|
|
onDownload: vi.fn(),
|
|
};
|
|
|
|
beforeEach(() => {
|
|
vi.clearAllMocks();
|
|
});
|
|
|
|
describe('渲染测试', () => {
|
|
it('应渲染标题', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
expect(screen.getByText('decodedFileOutput')).toBeInTheDocument();
|
|
});
|
|
|
|
it('应渲染 MIME 类型信息', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
expect(screen.getByText(/image\/png/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('应通过 formatFileSize 渲染文件大小', () => {
|
|
render(<DecodeResultPaper {...{ ...defaultProps, blobSize: 1536 }} />);
|
|
expect(screen.getByText(/1\.5 KB/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('应渲染文件名输入框', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
const input = screen.getByDisplayValue('decoded.png');
|
|
expect(input).toBeInTheDocument();
|
|
});
|
|
|
|
it('应渲染下载按钮', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
expect(screen.getByRole('button', { name: '下载' })).toBeInTheDocument();
|
|
});
|
|
|
|
it('应渲染 children 内容', () => {
|
|
render(
|
|
<DecodeResultPaper {...defaultProps}>
|
|
<div data-testid="preview">预览内容</div>
|
|
</DecodeResultPaper>,
|
|
);
|
|
expect(screen.getByTestId('preview')).toBeInTheDocument();
|
|
expect(screen.getByText('预览内容')).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('交互测试', () => {
|
|
it('修改文件名时应调用 onFileNameChange', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
const input = screen.getByDisplayValue('decoded.png');
|
|
fireEvent.change(input, { target: { value: 'new-name.png' } });
|
|
expect(defaultProps.onFileNameChange).toHaveBeenCalledWith('new-name.png');
|
|
});
|
|
|
|
it('点击下载按钮时应调用 onDownload', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
fireEvent.click(screen.getByRole('button', { name: '下载' }));
|
|
expect(defaultProps.onDownload).toHaveBeenCalledTimes(1);
|
|
});
|
|
});
|
|
|
|
describe('按钮状态', () => {
|
|
it('文件名为空时下载按钮应禁用', () => {
|
|
render(<DecodeResultPaper {...{ ...defaultProps, fileName: '' }} />);
|
|
expect(screen.getByRole('button', { name: '下载' })).toBeDisabled();
|
|
});
|
|
|
|
it('文件名不为空时下载按钮应启用', () => {
|
|
render(<DecodeResultPaper {...defaultProps} />);
|
|
expect(screen.getByRole('button', { name: '下载' })).toBeEnabled();
|
|
});
|
|
});
|
|
});
|