You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular 2 Karma测试报错:Undefined is not an object(evaluating 'this.outages.getValues')求助

解决Karma测试中Undefined is not an object(evaluating 'this.outages.getValues')错误

兄弟,我太懂你卡了3小时毫无进展的崩溃感!这个错误我之前踩过一模一样的坑,咱们直接说重点:

这个报错的核心原因是在Karma测试环境中,你的OutagesService没有被正确注入或者Mock,导致组件里的this.outages是undefined,调用它的getValues方法自然就炸了。

给你一套直接能用的解决步骤:

1. 在测试文件中正确Mock所有依赖服务

Angular组件测试必须手动Mock所有注入的服务,不能直接用真实服务(除非有特殊需求)。你可以用jasmine.createSpyObj来创建Mock对象,示例代码如下:

describe('CallComponent', () => {
  let component: CallComponent;
  let fixture: ComponentFixture<CallComponent>;
  // 提前声明Mock服务对象
  let mockOutagesService: jasmine.SpyObj<OutagesService>;
  let mockChatService: jasmine.SpyObj<ChatActiveService>;
  let mockMonitorService: jasmine.SpyObj<MonitorService>;

  beforeEach(async () => {
    // 初始化Mock,要包含组件中用到的所有方法(比如getValues)
    mockOutagesService = jasmine.createSpyObj('OutagesService', ['getValues']);
    mockChatService = jasmine.createSpyObj('ChatActiveService', ['callA']);
    mockMonitorService = jasmine.createSpyObj('MonitorService', []); // 按需添加组件用到的方法

    await TestBed.configureTestingModule({
      declarations: [CallComponent],
      providers: [
        { provide: ChatActiveService, useValue: mockChatService },
        { provide: MonitorService, useValue: mockMonitorService },
        // 关键:把Mock的OutagesService注入到测试模块中
        { provide: OutagesService, useValue: mockOutagesService }
      ]
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(CallComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create the component', () => {
    expect(component).toBeTruthy();
  });
});

2. 给Mock方法设置返回值(如果组件用到了)

如果你的initCall方法里调用了outages.getValues,还需要给这个Mock方法设置返回值,否则会返回undefined导致后续逻辑出错:

// 在需要测试initCall的用例中,或者beforeEach里设置
mockOutagesService.getValues.and.returnValue(of({/* 这里放你需要模拟的返回数据 */}));
// 同理,chat.callA也需要设置返回值,避免forkJoin出错
mockChatService.callA.and.returnValue(of({/* 模拟callA的返回数据 */}));

3. 检查组件代码中的this指向(可选排查)

虽然大概率是测试注入的问题,但也可以快速检查下组件里的handleConversationError方法有没有丢失this指向(比如用了普通函数而不是箭头函数),不过从你贴的代码来看,这个可能性不大。

卡3小时真的太磨人了,Angular测试的Mock注入是新手最容易踩的坑之一,搞定这个之后应该就能正常跑测试了!

内容的提问来源于stack exchange,提问作者Ramya S

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.22 07:46:10