时间戳

首页 > 解决方案 > 无法在 Jest 中模拟 Renderer2

angular - 无法在 Jest 中模拟 Renderer2

问题描述

试图在 Jest 环境中模拟 Renderer2 并且无法使其工作。Jest 23 & Angular 7. 尝试了一切：

组件.ts

const icosahedron = document.getElementById('renderIcosahedron');
this.renderer2.appendChild(icosahedron, this.renderer.domElement);

一直得到错误（仅在测试中）：

TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

编辑：更详细的解释已添加到 Angular 的存储库中，但它被视为错误而被拒绝。链接：https ://github.com/angular/angular/issues/30865#issue-452458779

标签： angularunit-testingjestjstddbdd

解决方案

您可以调用组件构造函数，而不是从 TestBed 创建组件对象，

const renderer2 = { setStyle: () => {}, removeStyle: () => {} } as any;
    const myComponent: MyComponent= new MyComponent(
      {} as ChangeDetectorRef,
      renderer2 as Renderer2,
      {} as NgZone
    );

    const setStyleSpy = jest.spyOn(renderer2, "setStyle");

让我们说，如果应该在异步调用中调用 renderer2 逻辑，我们可以模拟该异步调用函数并测试发生异步操作时是否调用了该函数。然后该函数可以作为其他规范的一部分单独调用并测试渲染逻辑。

推荐阅读