在本地环境和Jenkins pipline中运行时截取不同尺寸的截图结果

Question

我使用 Cypress 和 cypress-image-diff-js 进行视觉回归测试。 运行 Cypress headless 会生成与我的 cypress.config.ts 文件中配置的视口大小不同的屏幕截图。 当在我的 Jenkins 管道中运行测试时，它再次生成不同大小的屏幕截图，导致测试失败。

cypress.config.ts

{
  e2e: {
    baseUrl: "URL",
    chromeWebSecurity: false,
    supportFile: "./cypress/support/e2e-mock.ts",
    video: true,
    setupNodeEvents(on, config) {
      return getCompareSnapshotsPlugin(on, config);
    },
  },
  viewportWidth: 1300,
  viewportHeight: 800,
}

cypress-image-diff.config

const config = {
  FAILURE_THRESHOLD: 0.02,
  RETRY_OPTIONS: {
    log: true,
    limit: 3, // max number of iterations
    timeout: 20000, // time limit in ms
    delay: 500, // delay before next iteration, ms
  },
  CYPRESS_SCREENSHOT_OPTIONS: {
    capture: "viewport",
  },
};

知道如何解决这个问题吗？ 谢谢！

Answer 1

您可以尝试在运行 cypress 时将此配置添加到您的命令中：

--config viewportWidth=1280,viewportHeight=720