角度测试：覆盖以使用模板而不是 templateUrl答案

【问题标题】：Angular test: override to use template instead of templateUrl角度测试：覆盖以使用模板而不是 templateUrl
【发布时间】：2018-10-22 09:54:45
【问题描述】：

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

我尝试了什么：

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

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

【问题讨论】：

标签： angular testing mocking testbed

【解决方案1】：

它对我不起作用的原因是我打电话给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);

【讨论】：