如果 'app-user' 是一个 Angular 组件并且它有 'InwelcomeMsg' 输入，那么验证它是这个模块的一部分

Question

当我测试 child 组件时出现如下错误：

1. If 'app-user' is an Angular component and it has 'InwelcomeMsg' input, then verify that it is part of this module.

关于测试组件。我将 testing-library 用于 angular 和 jestjs。无法找出问题。

容器component.ts:

import { Component, OnInit, Output } from '@angular/core';

@Component({
  selector: 'app-shell-user',
  templateUrl: './shell-user.component.html',
  styleUrls: ['./shell-user.component.scss']
})
export class ShellUserComponent implements OnInit {

  @Output() OutwellcomeMsg: string | undefined;

  title = "Welcome to user!!"

  constructor() { }

  ngOnInit(): void {
    this.OutwellcomeMsg = this.title;
  }

}

html:

<section>
    <app-user [InwelcomeMsg]="OutwellcomeMsg"></app-user>
</section>

child component.ts:

import { Component, Input, OnInit } from '@angular/core';

@Component({
  selector: 'app-user',
  templateUrl: './user.component.html',
  styleUrls: ['./user.component.scss']
})
export class UserComponent implements OnInit {

  @Input()
  InwelcomeMsg!: string | undefined;

  constructor() { }

  ngOnInit(): void { }

}

child.test.spec:

import { render, screen } from '@testing-library/angular';
import { UserComponent } from './user.component';

describe('UserComponent', () => {
  it('should find the paragrap text "Hi Adil"', async () => {

    await render(UserComponent, {
      declarations: [],
      componentProperties: {
        InwelcomeMsg: "Hi Adil"
      } as any
    });

    expect(await screen.findByText(/Hi Adil/i)).toBeTruthy();

  });

});

不知道我在测试中想念她什么。有人帮帮我吗？

Answer 1

问题出在父规范文件中。它寻找子组件。我已经更新了我的父规范，例如：

import { render } from '@testing-library/angular';
import { UserComponent } from './../../components/user/user.component';
import { ShellUserComponent } from "./shell-user.component";

describe('UserComponent', () => {
  it('parent component should render with child', async () => {
    await render(ShellUserComponent, {
      declarations: [UserComponent]
    });

  });

});

现在可以正常使用了。