昨天的成就: 完成了参数缺失、类型错误、密钥无效等异常场景的测试，验证了错误响应的正确性
遇到的困难: 需要模拟网络超时情况测试前端loading状态的鲁棒性
今天的任务: 进行前端UI的端到端测试
javascript
// app.test.js - 前端单元测试
describe('角色生成器前端测试', () => {
test('selectType 函数应该正确切换类型', () => {
// 模拟DOM
document.body.innerHTML = <div class="type-card" data-type="image"></div> <div class="type-card" data-type="video"></div> <div id="configSection"></div> <div id="imageOptions"></div> ;
// 选择图片类型
selectType('image');
expect(selectedType).toBe('image');
expect(document.querySelector('[data-type="image"]').classList.contains('active')).toBe(true);
expect(document.getElementById('configSection').style.display).toBe('block');
expect(document.getElementById('imageOptions').style.display).toBe('block');
});
test('getComposedPrompt 应该正确组合提示词', () => {
document.body.innerHTML = <input id="gameName" value="王者荣耀"> <input id="roleName" value="孙悟空"> <select id="action"><option value="站立">站立</option></select> <select id="style"><option value="中国风">中国风</option></select> <textarea id="extraDescription">手拿金箍棒</textarea> ;
selectedType = 'image';
const prompt = getComposedPrompt();
expect(prompt).toContain('王者荣耀');
expect(prompt).toContain('孙悟空');
expect(prompt).toContain('站立');
expect(prompt).toContain('中国风');
expect(prompt).toContain('手拿金箍棒');
expect(prompt).toContain('生成图片');
});
test('startGeneration 应该在未选择类型时弹出警告', () => {
selectedType = '';
// 模拟alert
window.alert = jest.fn();
startGeneration();
expect(window.alert).toHaveBeenCalledWith('请先选择生成类型！');
});
});