如何在Cypress中读取文件并转为数组？遇readFileSync未定义报错

错误原因 #

Cypress测试代码运行在浏览器上下文中，而Node.js的fs.readFileSync属于Node环境专属API，无法直接在浏览器环境执行——这就是你报错“readFileSync is not a function”的核心原因，即便导入了fs模块，浏览器端也不支持该同步方法。

解决方案 #

方案1：使用Cypress内置的cy.readFile（推荐，符合Cypress异步链式风格） #

Cypress提供了适配自身运行环境的文件读取命令cy.readFile，可直接处理异步操作并转换内容：

cy.readFile('fruits.txt').then(fileContent => {
  // 处理内容：去除首尾空白→按换行分割→修正banana为bananas
  const fruitArray = fileContent
    .trim()
    .split('\n')
    .map(fruit => fruit === 'banana' ? 'bananas' : fruit);
  
  // 验证转换结果示例
  expect(fruitArray).to.deep.equal(['bananas', 'apples', 'oranges']);
  
  // 后续可直接使用fruitArray开展测试操作
});

方案2：通过Cypress Task在Node环境执行同步读取 #

若必须依赖同步读取逻辑，可借助Cypress的task机制（task运行在Node环境）实现：

1. 在cypress.config.js中配置自定义task：

const { defineConfig } = require('cypress');
const fs = require('fs');

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      on('task', {
        readFruitsToArray: (filePath) => {
          const content = fs.readFileSync(filePath, 'utf8');
          return content
            .trim()
            .split('\n')
            .map(fruit => fruit === 'banana' ? 'bananas' : fruit);
        }
      });
    },
  },
});

2. 在测试代码中调用该task：

cy.task('readFruitsToArray', 'fruits.txt').then(fruitArray => {
  expect(fruitArray).to.deep.equal(['bananas', 'apples', 'oranges']);
});

注意事项 #

• 文件路径：Cypress默认以项目根目录为基准，若文件在子目录中，需传入相对路径（如'./data/fruits.txt'）。
• 换行符兼容：若文件使用Windows格式的\r\n换行，可将split('\n')改为split(/\r?\n/)适配不同系统。

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