Question

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语句。我正在学习单元测试，什么是在多个单元测试用例中处理此方法的最佳方法。

Answer 1

我发现将组件模板和打字稿类视为一个要测试的单元最为有用。这样，我可以自由重构和移动东西，而不会破坏测试，也不会在测试结果中产生误报。

在您要测试的情况下，我将引入一个函数，该函数将使句柄返回您要测试的按钮，如：

function submitButton() {
    return fixture.debugElement.query(By.css('.some-class')).nativeElement
}

这样，我可以创建多个测试用例，在其中将值传递给其他表单字段，调用submitButton.click()并验证操作是否已经完成。

在设置表单值（模拟用户输入）时，请记住，您可能需要发布input浏览器事件，以便angular更新表单。

if（）返回的单元测试；在功能上

1 个答案: