时间戳

首页 > 解决方案 > Angular 单元测试验证子组件的方法调用

javascript - Angular 单元测试验证子组件的方法调用

问题描述

我有一个带有侧边栏组件的页面和带有页面组件的内容部分。从页面组件中，当我单击按钮时，侧边栏组件会切换。下面是代码，

  async onSidebarButtonPressed() {
    const sidebar = document.querySelector('#filter-sidebar');
    console.log(sidebar);
    (sidebar as any)?.toggle();
  }

现在我想介绍一下场景

切换（）

叫做。我尝试插入侧边栏组件，

  @Component({ selector: 'cf-wc-sidebar-filter-v9', template: '' })
    class SidebarStubComponent {
      toggle() { /* */}
    }
..
..
..


      it('should toggle sidebar action', async () => {
              const sidebarSpy= spyOn(document,'querySelector').and.callFake(()=>SidebarStubComponent);
   fixture.detectChanges();

  await component.onSidebarButtonPressed();

  });

我收到错误“ _a.toggle 不是函数”。最初我尝试使用 state 并且技术人员告诉不要为此使用 state。我试过@ViewChild，它没有定义。由于这两个组件完全断开

我还能如何测试这种情况？

标签： javascriptangularkarma-jasmineangular-unit-test

解决方案

推荐阅读