Question

我只有组件

@Component({
    selector: 'app-certificate-panel',
    templateUrl: './certificate.component.html'
})
export class CertificateComponent {
    @Input()
    public certificate: Certificate;
}

带模板

<h3 translate>General</h3>
<x-form-row label="{{'Version' | translate}}">
    {{ certificate.version }}
</x-form-row>
<x-form-row label="{{'Serial Number' | translate}}">
    {{ certificate.serialNumber }}
</x-form-row>
<h3 translate>Issued From</h3>
<x-form-row label="{{'Common Name (CN)' | translate}}" *ngIf="certificate.issuedFrom.commonName">
    {{ certificate.issuedFrom.commonName }}
</x-form-row>
<x-form-row label="{{'Organization Unit (OU)' | translate}}" *ngIf="certificate.issuedFrom.organizationUnit">
    {{ certificate.issuedFrom.organizationUnit }}
</x-form-row>

显示了更多属性。此模板中有多个*ngIf。

现在我想编写单元测试。我应该测试每个*ngIf吗？它不是在测试框架功能吗？

Answer 1

您可以使用此组件进行一系列可能的测试：

设置compoenent然后查询DOM元素以确保它们存在，个人而言，如果ngIf我不做这些，但如果它是批评那么你必须打电话，这是你的应用程序。
因为ngIf检查语句的真实性，单元测试语句，即：setup component，检查所有这些语句的真实性。同样，根据上下文，因为这是从父母那里获取数据，所以你应该考虑一下这是多么肯定，这将是一个防御性的程序。如果它有可能破裂，那就做一个像这样的廉价测试。
测试ngIf有时毫无意义，就像我在2中所说的那样，这可能是浪费时间，因为它要么是真的，要么不是如此，如果你可以控制它，那么这个组件非常简单。
你也可以在规范中制作一个父测试组件来进行集成测试，这是非常复杂的，但是如果这个组件树是关键或复杂的，这通常是非常强大的测试（个人很少会这样做）。

上面的组件的好处是它很简单，因此测试可以很简单。我个人会做选项2

许多简单* ngIf的单元测试

1 个答案: