使用Jest Spectator测试Angular组件中被调用的私有函数

核心思路 #

私有函数属于组件内部实现细节，不建议直接测试私有函数，更合理的做法是测试它带来的业务副作用（比如EventEmitter是否正确触发）。如果一定要验证私有函数的调用，可以通过类型断言绕过TypeScript的访问限制，结合Jest的spy功能实现。

组件代码参考（基于描述） #

假设你的组件代码大致如下：

import { Component, EventEmitter, Output } from '@angular/core';

@Component({
  selector: 'app-file-upload',
  templateUrl: './file-upload.component.html'
})
export class FileUploadComponent {
  @Output() piecesJointesChange = new EventEmitter<any[]>();

  public fileDeleted(file: any): void {
    // 其他业务逻辑
    this.emitPiecesJointes();
  }

  private emitPiecesJointes(): void {
    this.piecesJointesChange.emit([]); // 触发EventEmitter，可根据实际逻辑调整参数
  }
}

正确测试代码实现 #

方式1：测试业务副作用（推荐） #

直接验证fileDeleted调用后，piecesJointesChange是否正确触发，这更贴合测试的业务目标：

import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
import { FileUploadComponent } from './file-upload.component';

describe('FileUploadComponent', () => {
  let spectator: Spectator<FileUploadComponent>;
  const createComponent = createComponentFactory(FileUploadComponent);

  beforeEach(() => {
    spectator = createComponent();
  });

  it('should trigger piecesJointesChange after fileDeleted is called', () => {
    // 监听EventEmitter的emit方法
    const emitSpy = jest.spyOn(spectator.component.piecesJointesChange, 'emit');
    
    // 调用公共方法
    spectator.component.fileDeleted({ id: 1 });
    
    // 验证emit是否被调用，还可以验证触发的参数是否符合预期
    expect(emitSpy).toHaveBeenCalled();
    expect(emitSpy).toHaveBeenCalledWith([]);
  });
});

方式2：直接验证私有函数调用（不推荐，但满足需求） #

如果一定要验证emitPiecesJointes的调用，通过as any绕过TypeScript的私有访问限制，给私有方法创建spy：

import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
import { FileUploadComponent } from './file-upload.component';

describe('FileUploadComponent', () => {
  let spectator: Spectator<FileUploadComponent>;
  const createComponent = createComponentFactory(FileUploadComponent);

  beforeEach(() => {
    spectator = createComponent();
  });

  it('should call emitPiecesJointes when fileDeleted is invoked', () => {
    // 给私有方法创建spy对象
    const privateMethodSpy = jest.spyOn(spectator.component as any, 'emitPiecesJointes');
    
    // 调用公共方法
    spectator.component.fileDeleted({ id: 1 });
    
    // 验证私有函数是否被调用
    expect(privateMethodSpy).toHaveBeenCalled();
  });
});

常见问题说明 #

• 之前测试失败的原因：大概率是直接访问私有函数时被TypeScript的类型检查拦截，或者没有正确创建spy对象。
• 不推荐直接测试私有函数的原因：私有函数是内部实现，后续重构时可能修改函数名或逻辑，但业务行为（比如EventEmitter触发）不会改变，测试副作用的用例更稳定。

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