为何Cypress测试第二次执行才成功？排查与疑问

可能导致第一次失败、第二次成功的原因 #

• 异步数据创建未等待完成：如果before块中的数据创建是异步操作（比如调用后端API写入数据），但没有让Cypress等待操作完成，it块会提前执行，此时数据还未就绪导致失败；第二次运行时，之前的异步操作已经完成，数据存在所以测试通过。

  • 解决：确保所有异步操作都纳入Cypress命令队列，比如用cy.request代替原生fetch/axios，或者用cy.wrap()包裹Promise让Cypress等待：

    before(() => {
      // 用cy.request链式处理，确保Cypress等待操作完成
      cy.request('POST', '/api/create-data', { payload: ... })
        .then(response => {
          Cypress.env('dataId', response.body.id); // 保存数据ID供it块使用
        });
    
      // 或者包裹Promise让Cypress等待
      cy.wrap(fetch('/api/create-data', { method: 'POST', body: ... }))
        .then(res => res.json())
        .then(data => {
          Cypress.env('dataId', data.id);
        });
    });
    

• 数据同步延迟：数据写入数据库后，应用可能需要短暂时间完成缓存刷新、索引同步等操作，第一次测试执行时数据还未在应用侧可用，第二次运行时同步完成。

  • 解决：在before块末尾添加等待或断言，确保应用已能获取到数据：

    before(() => {
      cy.request('POST', '/api/create-data', { payload: ... })
        .then(res => Cypress.env('dataId', res.body.id));
      // 轮询直到应用中能查到目标数据
      cy.get(`[data-testid="data-item-${Cypress.env('dataId')}"]`)
        .should('be.visible');
    });
    

• 测试环境状态残留：如果第一次测试失败后数据未被清理，第二次运行时before块的创建逻辑可能复用了已存在的数据（比如判断数据已存在则跳过创建），导致测试通过。需检查数据创建逻辑的幂等性。

Cypress相关错误处理机制 #

• 命令自动重试：Cypress的核心命令（如cy.get、cy.contains）自带重试机制，会自动重试直到断言通过或超时（默认4秒）。注意：before块中的命令不会在测试重试时重新执行（改用beforeEach可实现每个测试前重新运行），且仅针对断言失败的命令重试。

• 自定义错误捕获：可以通过cy.on('fail')在测试或全局层面捕获错误，实现自定义处理（比如重试数据创建）：

  before(() => {
    cy.on('fail', (err, runnable) => {
      // 判断是否为数据创建失败，按需添加重试逻辑
      if (err.message.includes('数据创建失败')) {
        return cy.request('POST', '/api/create-data', { payload: ... });
      }
      // 其他错误继续抛出
      throw err;
    });
    cy.request('POST', '/api/create-data', { payload: ... });
  });
  

• 测试重试配置：可在cypress.config.js中配置测试重试次数，让失败的测试自动重试，但这是临时 workaround，建议优先解决根本问题：

  module.exports = {
    retries: {
      runMode: 1, // 命令行运行时重试1次
      openMode: 0, // 交互式运行时不重试
    },
  };
  

排查建议 #

1. 用Cypress交互式模式（cypress open）慢动作回放第一次测试，观察before块数据创建是否完成，it块执行时数据是否存在。
2. 在before和it块中添加cy.log()打印关键数据（如创建的数据ID），验证数据是否正确传递。
3. 用cy.intercept监控数据创建和查询的API，检查响应状态和数据是否符合预期，确认时序是否正确。

内容的提问来源于stack exchange，提问作者sebilet