Angular带*ngIf条件渲染div的组件测试失败，原因是什么？

• 核心语法错误：测试代码中it函数的括号位置写错，导致测试逻辑无法正常执行。
  错误代码片段：

  it('should display the info') , () => {
     spectator = createComponent()
     spectator.setInput( { shouldRender:true})
     spectator.detectChanges()
     const infoBanner = spectator.query("#info-banner")
     expect(infoBanner).toBeTruthy()
  })
  

  这里it('should display the info')多写了一个右括号，正确写法需将回调函数作为it的第二个参数传入：

  it('should display the info', () => {
     spectator = createComponent()
     spectator.setInput( { shouldRender:true})
     spectator.detectChanges()
     const infoBanner = spectator.query("#info-banner")
     expect(infoBanner).toBeTruthy()
  })
  

• 潜在辅助检查点：若修复语法后仍失败，需确认：

  • 组件中的shouldRender是否添加了@Input()装饰器，否则spectator.setInput无法正确传递属性值。
  • createComponent的初始化配置是否存在限制（比如禁用自动变更检测），不过你已手动调用detectChanges()，该情况概率较低。

内容的提问来源于stack exchange，提问作者Boko Moko