在 Angular 测试库测试中渲染 html 属性

如何解决在 Angular 测试库测试中渲染 html 属性

我正在使用 testing-library 进行角度测试，我有一种情况，我需要从 HTML 设置一个属性，以便能够以我想要的方式呈现组件......这个属性来自模块，我已经尝试通过 componentProperties 来渲染组件，但它不起作用...你们知道我如何在测试中设置这个属性以便我可以正确渲染我的组件吗？

我需要像这样呈现 html 上的 ifMobile 属性：

<xpto-aba-table-mobile
      *ifMobile="true"
      id="id-xpto-table-mobile"
      class="tabela"
      [tableData]="detailsTableData"
      [loading]="loading"
    >
    </xpto-aba-table-mobile>

这就是我试图测试的方式：（以这种方式运行测试，没有显示任何错误，但是，它不渲染组件，它基本上没有改变我的组件）

  it('test',async () => {
    const { container } = await render(IfMobileModule,{
      imports: [IfMobileModule],template: `<xpto-aba-table-mobile id="id-ativos-escriturais-table-mobile" class="tabela" [tableData]="detailsTableData" \
      [loading]="loading" *ifMobile="true" ifMobile="true">should show when mobile</xpto-aba-table-mobile>`,wrapper: MyComponentDetailComponent,componentProperties: {
        hasMessage: false,detailsTableData$: myMock,ifMobile: true,// ifMobile: (): boolean => true,},});
    const element = container.querySelector("#id-xpto-table-mobile");
    expect(element).toBeInTheDocument();
  });

我也尝试过以这种方式进行测试（以这种方式我什至无法运行测试，因为它说 ifMobile 不是有效属性）

  it('test2',async () => {
    const { container,debug } = await render(MyComponentDetailComponent,});
    const element = container.querySelector("#id-xpto-table-mobile");
    expect(element).toBeInTheDocument();
  });