angular - 在 Angular Karma Jasmine 测试中模拟服务

Question

我试图通过将服务添加到规范中的提供程序数组并使用它的函数添加 createSpyObj 来模拟服务，但出现以下错误:

Access to XMLHttpRequest at ''ng://DynamicTestModule/mycomponent_Host.ngfactory.js' from origin 'http:localhost:9876'

我做错了什么？

// .... import the service

mockService = jasmine.createSpyObj(['function1'])
testBed.configureTestingModule({
  providers:[{
      {provide: myService, useValue: mockService}
  }]
}).compileComponents()

Answer 1

您创建 spy 的方式本身就是错误的。从报错来看，似乎与invalid import 或其他什么有关。

正确的做法是:

describe("UserDetailComponent", () => {
  let component: UserDetailComponent;
  let fixture: ComponentFixture<UserDetailComponent>;
  const mockUserService = jasmine.createSpyObj("UserSvcService", ["getUserDetail"]);

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [UserDetailComponent],
      providers: [
        { provide: UserSvcService, useValue: mockUserService }
      ]
    }).compileComponents();
  }));
....
...
 it('should set some values using service',()=>{
   mockUserService.getUserDetail.and.returnValue(
      of({ data: 'somevalue'})
    );
   expect(someCondition).toBeDefined();
 })
)}

还有其他方法可以做到这一点，使用 Stubs 然后使用 useClass 插入到组件中。 you can refer to this article of mine to get the idea