HTML:
<button [disabled]="isFormValid()"></button>
.TS:
isFormValid() {
if (this.data.dataForm.valid && this.flag) {
if (!!this.testData.data) {
return !this.testData.data.dataForm.valid;
} else {
return true;
}
} else {
return !this.data.dataForm.valid;
}
}
我有一个这样的方法,嵌套if条件和多个return语句。我正在学习单元测试,以及使用多个单元测试用例处理此方法的最佳方法。
我发现将组件模板和typescript类视为一个要测试的单元是最有用的。这样我就可以自由重构并在不破坏测试的情况下移动内容并在测试结果中获得误报。
在您测试它的情况下,我将介绍一个函数,它将返回您要测试的按钮的句柄,如:
function submitButton() {
return fixture.debugElement.query(By.css('.some-class')).nativeElement
}
这样我就可以创建多个测试用例,我将值传递给其他表单字段,调用submitButton.click()
并验证操作是否已经完成。
设置表单值(模拟用户输入)时,请记住,您可能需要发布input
浏览器事件,以便角度更新表单。