113 lines
3.9 KiB
TypeScript
113 lines
3.9 KiB
TypeScript
/* @vitest-environment jsdom */
|
|
|
|
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
|
|
import { beforeEach, expect, test, vi } from 'vitest';
|
|
|
|
import { PlatformFeedbackView } from './PlatformFeedbackView';
|
|
|
|
class MockFileReader {
|
|
result: string | ArrayBuffer | null = null;
|
|
onload: null | (() => void) = null;
|
|
onerror: null | (() => void) = null;
|
|
|
|
readAsDataURL(file: File) {
|
|
this.result = `data:${file.type};base64,ZmVlZGJhY2s=`;
|
|
this.onload?.();
|
|
}
|
|
}
|
|
|
|
beforeEach(() => {
|
|
vi.stubGlobal('FileReader', MockFileReader);
|
|
});
|
|
|
|
test('PlatformFeedbackView renders reference feedback fields', () => {
|
|
render(<PlatformFeedbackView onBack={vi.fn()} />);
|
|
|
|
expect(screen.getByText('帮助与反馈')).toBeTruthy();
|
|
expect(screen.getByText('反馈问题')).toBeTruthy();
|
|
expect(screen.getByLabelText('问题描述')).toBeTruthy();
|
|
expect(screen.getByText('0/200')).toBeTruthy();
|
|
expect(screen.getByText('上传凭证(提供问题截图)')).toBeTruthy();
|
|
expect(screen.getByText('上传凭证')).toBeTruthy();
|
|
expect(screen.getByLabelText('联系电话')).toBeTruthy();
|
|
expect(screen.getByRole('button', { name: '提交' })).toBeTruthy();
|
|
expect(screen.getByRole('button', { name: '查看反馈与投诉记录' })).toBeTruthy();
|
|
});
|
|
|
|
test('PlatformFeedbackView validates minimum description length before submit', () => {
|
|
const onSubmit = vi.fn();
|
|
render(<PlatformFeedbackView onBack={vi.fn()} onSubmit={onSubmit} />);
|
|
|
|
fireEvent.change(screen.getByLabelText('问题描述'), {
|
|
target: { value: '太短' },
|
|
});
|
|
fireEvent.click(screen.getByRole('button', { name: '提交' }));
|
|
|
|
expect(screen.getByText('请填写10个字以上的问题描述')).toBeTruthy();
|
|
expect(onSubmit).not.toHaveBeenCalled();
|
|
});
|
|
|
|
test('PlatformFeedbackView submits trimmed payload', async () => {
|
|
const onSubmit = vi.fn();
|
|
render(<PlatformFeedbackView onBack={vi.fn()} onSubmit={onSubmit} />);
|
|
|
|
fireEvent.change(screen.getByLabelText('问题描述'), {
|
|
target: { value: ' 这个反馈页面无法正常上传图片 ' },
|
|
});
|
|
fireEvent.change(screen.getByLabelText('联系电话'), {
|
|
target: { value: ' 13800000000 ' },
|
|
});
|
|
fireEvent.click(screen.getByRole('button', { name: '提交' }));
|
|
|
|
await waitFor(() => expect(onSubmit).toHaveBeenCalledTimes(1));
|
|
expect(onSubmit).toHaveBeenCalledWith({
|
|
description: '这个反馈页面无法正常上传图片',
|
|
contactPhone: '13800000000',
|
|
evidenceItems: [],
|
|
});
|
|
await waitFor(() => expect(screen.getByText('反馈已提交')).toBeTruthy());
|
|
});
|
|
|
|
test('PlatformFeedbackView previews image data urls and submits evidence items', async () => {
|
|
const onSubmit = vi.fn();
|
|
render(<PlatformFeedbackView onBack={vi.fn()} onSubmit={onSubmit} />);
|
|
|
|
const file = new File(['feedback'], 'preview.png', { type: 'image/png' });
|
|
fireEvent.change(document.querySelector('input[type="file"]') as HTMLInputElement, {
|
|
target: { files: [file] },
|
|
});
|
|
|
|
const preview = await screen.findByAltText('反馈凭证预览');
|
|
expect(preview.getAttribute('src')).toBe(
|
|
'data:image/png;base64,ZmVlZGJhY2s=',
|
|
);
|
|
|
|
fireEvent.change(screen.getByLabelText('问题描述'), {
|
|
target: { value: '图片上传后现在应该展示预览' },
|
|
});
|
|
fireEvent.click(screen.getByRole('button', { name: '提交' }));
|
|
|
|
await waitFor(() => expect(onSubmit).toHaveBeenCalledTimes(1));
|
|
expect(onSubmit).toHaveBeenCalledWith({
|
|
description: '图片上传后现在应该展示预览',
|
|
contactPhone: null,
|
|
evidenceItems: [
|
|
{
|
|
fileName: 'preview.png',
|
|
contentType: 'image/png',
|
|
sizeBytes: file.size,
|
|
dataUrl: 'data:image/png;base64,ZmVlZGJhY2s=',
|
|
},
|
|
],
|
|
});
|
|
});
|
|
|
|
test('PlatformFeedbackView calls back from header home button', () => {
|
|
const onBack = vi.fn();
|
|
render(<PlatformFeedbackView onBack={onBack} />);
|
|
|
|
fireEvent.click(screen.getByRole('button', { name: '返回我的页签' }));
|
|
|
|
expect(onBack).toHaveBeenCalledTimes(1);
|
|
});
|