如何在 Cypress 中实现跨测试用例的状态传递（不推荐:但可选方案）

Cypress 默认禁止跨测试用例共享状态以保障测试隔离性；本文详解为何应避免状态传递、推荐使用 API 辅助的测试数据准备方式，并提供禁用隔离与合并测试等替代方案。

cypress 默认禁止跨测试用例共享状态以保障测试隔离性；本文详解为何应避免状态传递、推荐使用 api 辅助的测试数据准备方式，并提供禁用隔离与合并测试等替代方案。

在 Cypress 测试实践中，一个核心设计原则是：每个 it() 测试用例必须独立、可重复、可任意顺序执行。这意味着：你不能依赖前一个测试创建的 UI 状态（如已添加的员工）来运行下一个测试——Cypress 会在每个 it() 开始前自动重置浏览器上下文（包括页面状态、LocalStorage、Cookies 等），从而强制实现测试隔离。

❌ 为什么“携带状态”不是好主意？

• 级联失败风险：若 it('adds staff') 因 UI 变更或网络异常失败，后续所有依赖该员工的测试（如搜索、编辑、删除）将全部失败，掩盖真实问题。
• 调试困难：失败原因难以定位——是创建逻辑出错？还是搜索功能失效？还是状态未正确传递？
• 并行/重试失效：Cypress 的 --parallel 模式和 retries 机制要求测试完全自治，状态耦合会导致不可预测行为。
• 违背测试金字塔原则：UI 层测试应聚焦交互验证，而非承担数据准备职责。

✅ 推荐方案：通过 API 创建测试数据（最佳实践）

为保障隔离性与稳定性，应绕过 UI，直接调用后端 API 创建所需数据。Cypress 提供 cy.request() 完美支持此模式：

// cypress/support/commands.jsCypress.Commands.add('createStaffMember', (staffData = {}) => {  const payload = {    name: 'Test Staff',    email: `test-${Date.now()}@example.com`,    role: 'admin',    ...staffData  };  cy.request({    method: 'POST',    url: '/api/staff',    body: payload,    headers: {      'Authorization': `Bearer ${Cypress.env('API_TOKEN')}`    }  }).then((response) => {    expect(response.status).to.eq(201);    cy.wrap(response.body.id).as('createdStaffId'); // 可选：供当前测试内后续使用  });});

在测试中直接复用：

describe('Staff Management', () => {  beforeEach(() => {    cy.visit('/staff/list');  });  it('adds a staff member via UI and validates success', () => {    cy.get('[data-testid="add-staff-btn"]').click();    cy.get('[data-testid="name-input"]').type('Test Staff');    cy.get('[data-testid="email-input"]').type(`test-${Date.now()}@example.com`);    cy.get('[data-testid="submit-form"]').click();    cy.get('[data-testid="success-toast"]').should('be.visible');  });  it('displays newly created staff in list (via API setup)', () => {    // ✅ 独立创建：不依赖上一个测试的 UI 操作    cy.createStaffMember({ name: 'API-Created Staff' });    // 刷新页面或触发列表加载    cy.visit('/staff/list');    cy.get('[data-testid="staff-row"]').contains('API-Created Staff').should('be.visible');  });});

? 提示：将 cy.createStaffMember() 封装为自定义命令，并在 support/commands.js 中注册，即可在所有测试中全局调用。

⚠️ 替代方案（仅限特殊场景）

若因技术限制（如无可用 API、权限受限）必须复用 UI 状态，请谨慎选择以下方案之一：

方案 1：合并为单个测试（推荐度 ★★★☆☆）

将“创建 + 验证”封装在一个 it() 中，保持逻辑连贯且可控：

it('creates staff and verifies it appears in search', () => {  // Step 1: Create via UI  cy.get('[data-testid="add-staff-btn"]').click();  cy.get('[data-testid="name-input"]').type('Searchable Staff');  cy.get('[data-testid="submit-form"]').click();  cy.get('[data-testid="success-toast"]').should('be.visible');  // Step 2: Search immediately  cy.get('[data-testid="search-input"]').type('Searchable Staff');  cy.get('[data-testid="staff-row"]').should('have.length', 1);});

方案 2：禁用测试隔离（不推荐，仅作最后手段）

通过 testIsolation: false 关闭隔离（需 Cypress ≥ 12.15.0），并在 cypress.config.js 中配置：

const { defineConfig } = require('cypress')module.exports = defineConfig({  e2e: {    testIsolation: false, // ⚠️ 全局禁用隔离！  },})

⚠️ 严重警告：此举将导致所有测试共享同一浏览器上下文，可能引发内存泄漏、状态污染、随机失败等问题，仅应在极短期验证或遗留系统中临时启用，切勿用于 CI 环境。

总结

方案	可维护性	调试性	CI 友好度	推荐指数
✅ API 创建数据	★★★★★	★★★★★	★★★★★	⭐⭐⭐⭐⭐
✅ 合并测试逻辑	★★★★☆	★★★★☆	★★★★☆	⭐⭐⭐⭐☆
⚠️ 禁用测试隔离	★★☆☆☆	★★☆☆☆	★☆☆☆☆	⚠️（避免）

始终优先采用API 驱动的数据准备——它更快、更稳定、更贴近真实集成场景，也真正践行了 Cypress “测试应反映用户真实行为，而非模拟脆弱路径”的设计哲学。