Angular Testing : override to use template instead of templateUrl

我有一个包含 iframe 的组件。为了防止在测试中从 iframe 加载不存在的 URL，我想模拟组件的模板。我以为我可以使用 TestBed.overrideComponent() 做到这一点，但它没有效果。当测试运行时，我可以看到原始模板存在并且 iframe 加载不存在的 url。

我试过的:

fixture = TestBed.overrideComponent(IFrameComponent, {
  remove: {
    templateUrl: './iframe.component.html'
  },
  add: {
    template: '<div></div>'
  }
}).createComponent(IFrameComponent);

如何覆盖组件以使用 template 而不是 templateUrl ？

最佳答案

它对我不起作用的原因是我在 TestBed.overrideComponent() 之后调用了 compileComponents() 。

正确的顺序是这样的:

TestBed.configureTestingModule({
   declarations: [IFrameComponent]
}).overrideComponent(IFrameComponent, {
   remove: {
      templateUrl: './iframe.component.html'
   },
   add: {
      template: '<div data-test-iframe="iframe"></div>'
   }
}).compileComponents();
fixture = TestBed.createComponent(IFrameComponent);

关于 Angular Testing : override to use template instead of templateUrl，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52926599/