4teamwork/cypress

cypress Docker镜像

镜像概述和主要用途

本镜像以https://hub.docker.com/r/cypress/included%E4%B8%BA%E5%9F%BA%E7%A1%80%E6%9E%84%E5%BB%BA%EF%BC%8C%E9%A2%9D%E5%A4%96%E9%A2%84%E8%A3%85%E4%BA%86%E5%A4%9A%E7%A7%8D%E5%B8%B8%E7%94%A8%E6%B5%8B%E8%AF%95%E5%BA%93%EF%BC%8C%E9%80%82%E7%94%A8%E4%BA%8E%E5%89%8D%E7%AB%AF%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%9C%BA%E6%99%AF%E3%80%82%E9%95%9C%E5%83%8F%E9%BB%98%E8%AE%A4%E8%AE%BE%E7%BD%AE%E7%8E%AF%E5%A2%83%E5%8F%98%E9%87%8F%60CYPRESS_CI=1%60%EF%BC%8C%E5%B9%B6%E5%B0%86%E5%85%A5%E5%8F%A3%E7%82%B9%E9%85%8D%E7%BD%AE%E4%B8%BA%60cypress run -q`，以减少CI环境中的输出冗余，提升测试效率。

核心功能和特性

• 基础镜像：基于官方cypress/included镜像，确保Cypress核心功能可用
• 预装测试库：
  • @4tw/cypress-drag-drop：支持拖拽操作测试
  • @testing-library/cypress：提供更友好的DOM测试工具
  • cypress-file-upload：支持文件上传测试
  • cypress-network-idle：网络状态检测工具
  • axios：HTTP请求库
  • luxon：日期时间处理库
• 环境变量：默认设置CYPRESS_CI=1，标识CI环境
• 优化入口点：使用cypress run -q作为入口点，-q参数减少输出冗余，适合CI环境

使用场景和适用范围

适用于CI/CD流水线中的前端自动化测试，特别适合需要以下功能的测试场景：

• 包含拖拽交互的UI测试
• 文件上传功能测试
• 需要网络状态检测的异步操作测试
• 需处理日期时间的测试用例
• 需要HTTP请求模拟的测试场景

使用方法和配置说明

Docker Run 基本示例

bash
docker run -v $(pwd):/app/test 4teamwork/cypress

该命令将当前目录挂载到容器内的/app/test目录，执行默认的cypress run -q命令。

Docker Compose 配置示例（Cypress Dashboard）

以下配置示例用于将测试结果记录到Cypress Dashboard：

yaml
services:
  cypress:
    image: 4teamwork/cypress
    environment:
      - CYPRESS_baseUrl=http://external-frontend:80  # 测试目标应用URL
      - NO_COLOR=1  # 禁用颜色输出
      - TERM=dumb  # 简化终端输出
      - CYPRESS_RECORD_KEY=XXXX  # Cypress Dashboard记录密钥
      - CYPRESS_PROJECT_ID=XXXX  # Cypress项目ID
      - CYPRESS_VIDEO=true  # 启用测试视频录制
      - COMMIT_INFO_MESSAGE  # 提交信息（通常从CI环境变量获取）
      - COMMIT_INFO_REMOTE  # 远程仓库信息
      - COMMIT_INFO_BRANCH  # 分支信息
      - COMMIT_INFO_SHA  # 提交SHA
      - COMMIT_INFO_AUTHOR  # 提交作者
      - COMMIT_INFO_EMAIL  # 作者邮箱
    volumes:
      - ./:/app/test  # 挂载本地测试代码到容器

关键环境变量说明

特殊说明

当CYPRESS_RECORD_KEY环境变量非空时，镜像会自动在cypress run命令后添加--record选项，将测试结果上传至Cypress Dashboard。