Angular 9测试中如何将测试资源加载至File实例？

作为有Java背景的开发者，习惯用测试资源文件覆盖边缘场景完全能理解！不过Angular默认的Karma测试运行在浏览器上下文里，Node的fs模块在这里是不可用的，所以才会报找不到模块的错误。下面给你几个适合浏览器环境的解决方案，帮你构造File实例传入测试服务：

方案1：直接在测试代码中构造File实例 #

这是最直接的方式，把测试用的文本内容直接写在测试代码里，通过浏览器原生的File API创建实例，覆盖各种边缘场景（空文件、特殊字符、大内容等）。

示例代码：

import { TestBed } from '@angular/core/testing';
import { ParseService } from './parse.service';

describe('ParseService', () => {
  let service: ParseService;

  beforeEach(() => {
    TestBed.configureTestingModule({});
    service = TestBed.inject(ParseService);
  });

  // 测试空文件场景
  it('should handle empty file correctly', () => {
    const emptyFile = new File([''], 'empty.txt', { type: 'text/plain' });
    const result = service.parse(emptyFile);
    expect(result).toEqual(/* 你的预期空文件解析结果 */);
  });

  // 测试带特殊字符的文件场景
  it('should parse file with special characters', () => {
    const content = 'Hello! @#$%^&*() 中文测试 🚀\n换行测试';
    const specialCharFile = new File([content], 'special-chars.txt', { type: 'text/plain' });
    const result = service.parse(specialCharFile);
    expect(result).toEqual(/* 你的预期特殊字符解析结果 */);
  });

  // 测试大内容文件场景
  it('should process large file content', () => {
    const largeContent = '测试行内容\n'.repeat(10000);
    const largeFile = new File([largeContent], 'large-file.txt', { type: 'text/plain' });
    const result = service.parse(largeFile);
    expect(result.length).toBe(10000); // 示例断言，根据你的解析逻辑调整
  });
});

方案2：加载测试资源文件并转为File实例 #

如果你已经有现成的测试资源文件，不想把内容写在代码里，可以把文件放到Angular的测试资产目录中，通过HTTP请求加载内容后再构造File实例。

步骤1：配置测试资源路径 #

在angular.json的test配置中，把你的测试资源文件夹添加到assets数组：

"test": {
  "builder": "@angular-devkit/build-angular:karma",
  "options": {
    "assets": [
      "src/favicon.ico",
      "src/assets",
      "src/test-resources" // 你的测试资源文件夹路径
    ],
    // 其他测试配置...
  }
}

步骤2：在测试中加载并构造File #

用浏览器的fetch API或Angular的HttpClient加载文件内容，再转为File实例：

import { TestBed } from '@angular/core/testing';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ParseService } from './parse.service';

describe('ParseService', () => {
  let service: ParseService;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule]
    });
    service = TestBed.inject(ParseService);
  });

  // 加载外部测试资源文件
  it('should parse edge case file from test resources', (done) => {
    // 请求测试资源文件
    fetch('/test-resources/edge-case-1.txt')
      .then(response => response.text())
      .then(content => {
        const testFile = new File([content], 'edge-case-1.txt', { type: 'text/plain' });
        const result = service.parse(testFile);
        expect(result).toEqual(/* 你的预期解析结果 */);
        done(); // 异步测试需要调用done结束
      });
  });
});

额外说明：如果想用Node的fs模块 #

如果你坚持想用fs读取本地测试文件，需要切换到Jest测试框架（Jest运行在Node环境，支持fs模块）。不过这需要重新配置Angular的测试环境，相对复杂，对于你的需求来说，上面两种浏览器原生的方案更轻量直接。

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