SVG2Icon • 技术指南

版本 v1.1.0

svg2icon-技术-v1.1.0

端到端(E2E)UI 测试 —— 路线图

本路线图引入 Cypress(及兼容工具)的 E2E UI 覆盖,确保核心用户路径在 CI 中持续通过并设为合并门禁。

测试类型

  • 标签:端到端(E2E)UI 测试。Cypress 也支持组件测试,但此处聚焦完整 UI 流程。

目标

  • 锁定关键流程(启动应用、创建/编辑/删除项目、下载)并保持稳定快速
  • 在 GitHub Actions 中作为 PR 与 main 的必过门禁
  • 保持确定性:使用夹具、测试 ID 与鲁棒选择器

工具

  • 主用:Cypress(E2E 模式)
  • 可选:Playwright(并行、自动等待)用于对比或未来迁移
  • 加分项:视觉回归插件(Percy/Applitools/Chromatic)以监测 UI 漂移

首批目标流程

  • 应用启动 + 侧栏可见
  • 项目:创建 → 编辑 → 删除 持久化到 svg2icon.json
  • 下载:web/mobile/desktop/all 生成预期目录/文件
  • 设置:主题切换可持久

里程碑

  1. 引入 Cypress,添加基础工程与 CI 任务
  2. 在 UI 中按需加入稳定测试 ID
  3. 合入侧栏 + 项目 CRUD 的冒烟用例
  4. 添加下载断言(ZIP 命名/文件存在)
  5. 并行/用例拆分提速;加入反脆弱机制

Electron 说明

  • 渲染端 UI 可在浏览器上下文跑;针对 Electron 专属行为,可使用薄 IPC 垫片,或每个用例起一个最小 Electron 启动器
  • 测试期间使用临时 userData 目录,避免污染开发/生产数据

优先高信噪比的 E2E 用例,贴近真实使用。保持少、快、稳;将细节逻辑下放到单测/集成测试。

Skip to main content