Cypress.io是否支持函数导入导出？跨测试集成如何复用函数？

当然支持啦！Cypress完全兼容ES模块的import/export语法，这正是解决你代码复用需求的绝佳方案——我平时做Cypress测试的时候也经常这么用，再也不用在各个测试文件里重复复制粘贴相同的函数了～

具体实现步骤 #

1. 封装可复用的工具函数

首先，在你的Cypress项目里新建一个专门存放通用函数的文件，比如cypress/support/utils.js（路径可以根据你的项目结构调整，比如放在cypress/utils/目录下也没问题），然后在里面导出需要复用的函数：

// cypress/support/utils.js
// 封装登录操作
export const loginToApp = (username, password) => {
  cy.get('#username').type(username);
  cy.get('#password').type(password);
  cy.get('#submit-btn').click();
};

// 封装提示框校验
export const validateToastMessage = (message) => {
  cy.get('.toast').should('be.visible').and('contain', message);
};

2. 在测试文件中导入使用

接下来，在任何需要用到这些函数的测试文件（比如cypress/e2e/login.spec.js）里，直接导入就能调用了：

// cypress/e2e/login.spec.js
import { loginToApp, validateToastMessage } from '../support/utils';

describe('登录功能测试集', () => {
  it('使用正确凭证登录成功', () => {
    cy.visit('/login');
    loginToApp('test_user', 'test_pass');
    validateToastMessage('登录成功');
  });

  it('使用错误凭证登录失败', () => {
    cy.visit('/login');
    loginToApp('wrong_user', 'wrong_pass');
    validateToastMessage('用户名或密码错误');
  });
});

额外实用小技巧 #

• 如果某些函数是所有测试都需要用到的（比如全局前置操作），你可以把它们导入到cypress/support/e2e.js（旧版本是support/index.js）中，这样所有测试文件都会自动加载这些函数，无需每次手动导入。
• 除了普通函数，你也可以导出对象、类或者常量，用法和标准ES模块完全一致。
• 要是你想要更贴近Cypress原生风格的复用方式，也可以试试自定义命令（Cypress.Commands.add()），但对于纯逻辑函数的复用来说，import/export的方式更灵活，也更符合JavaScript的模块化编程习惯。

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