Angular中Jasmine测试含构造依赖组件方法的报错问题

错误原因说明 #

第一个报错：getEmails is not a function #

最初直接通过Component['getEmails'](text)调用方法是错误的：getEmails是组件类的实例方法，只能在类的实例对象上调用，直接通过类本身访问不到这个方法。

第二个报错：Cannot read properties of undefined (reading 'get') #

后续手动通过new Component()创建实例的写法不符合Angular测试规范：
Angular组件的依赖注入是由框架DI容器统一管理的，手动new实例时，构造函数里声明的FormBuilder、自定义Service等依赖都不会被自动注入，执行到构造函数里this.Service.get('somename')这行时，this.Service是undefined，自然会抛出错误。
注意：虽然在TestBed里配置了Service的spy对象，但手动new出来的组件实例完全不走TestBed的DI流程，所以配置的模拟对象根本不会生效。

正确测试实现方案 #

• 确保TestBed的测试模块配置完整：用到FormBuilder必须导入ReactiveFormsModule，所有依赖的服务都要提供对应的模拟实现
• 不要手动实例化组件，通过TestBed.createComponent获取组件实例，这个实例会自动完成所有依赖注入
• 对构造函数里调用的服务方法，提前配置spy的返回值，避免初始化阶段报错
• 组件实例获取后，再调用getEmails方法做断言

完整测试代码示例 #

describe('EmailComponent', () => {
  let component: EmailComponent;
  let fixture: ComponentFixture<EmailComponent>;
  let serviceSpy: jasmine.SpyObj<Service>;

  beforeEach(async(() => {
    // 创建服务的spy对象，列出所有需要mock的方法
    const serviceSpyObj = jasmine.createSpyObj('Service', ['get']);

    TestBed.configureTestingModule({
      declarations: [EmailComponent],
      // 导入依赖的模块，FormBuilder来自ReactiveFormsModule必须导入
      imports: [ReactiveFormsModule],
      providers: [
        { provide: Service, useValue: serviceSpyObj }
      ]
    })
    .compileComponents();

    serviceSpy = TestBed.inject(Service);
    // 提前配置构造函数里调用的get方法返回值
    serviceSpy.get.and.returnValue('mock-config-value');
  }));

  beforeEach(() => {
    // 通过TestBed创建组件实例，自动完成所有依赖注入
    fixture = TestBed.createComponent(EmailComponent);
    component = fixture.componentInstance;
    // 触发变更检测，执行组件初始化逻辑
    fixture.detectChanges();
  });

  it('should extract email addresses correctly from input text', () => {
    const testText = 'Jon Doe <Jon.Doe@domain.com>';
    const expectedEmails = ['Jon.Doe@domain.com'];
    // 注意：如果emailRegExp没有设置忽略大小写flag，不要把邮箱转成全小写断言，避免误判
    const result = component.getEmails(testText);
    expect(result).toEqual(expectedEmails);
  });
});

额外注意点 #

• 旧版本Angular用TestBed.get()获取服务实例，Angular 9+推荐用TestBed.inject()，避免类型丢失问题
• 测试前确认组件里的emailRegExp正则已经正确初始化，否则调用match方法时也会抛出错误
• 如果正则设置了i（忽略大小写）标记，断言时可以统一转小写后比对，避免大小写导致测试不通过

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