Angular 预期未定义为真实-茉莉花/业力

我在angular 2中开发了一个简单的反应式表单，其中包括用户名、密码和登录按钮。此处按钮默认禁用最多获取电子邮件和密码值。在这里，我试图为按钮启用和禁用编写一个测试用例（如果我们将输入数据提供给这两个字段，则按钮应启用，否则按钮将禁用）。 我编写了一个测试用例，比如“Button应该被禁用”，期望它能通过，但是它失败了，错误是“error:Expected undefined to be truthy”

这是我的反应形式：

签到表
{{useridMessage}}


{{passwordMessage}}


登录

这是我的.spec文件

beforeach（（）=>{
fixture=TestBed.createComponent（LoginFormComponent）；
组件=fixture.componentInstance；
fixture.detectChanges（）；
});
它（'应该创建应用'，异步（（）=>{
const fixture=TestBed.createComponent（LoginFormComponent）；
常量app=fixture.debugElement.componentInstance；
expect（app.toBeTruthy（）；
}));
它（'按钮应禁用'），异步（（）=>{
控件['userid'].setValue（''）；
控件['password'].setValue（''）；
fixture.detectChanges（）；
设btn=fixture.debugElement.query（By.css（'carbon-button'）；
expect（btn.nativeElement.disabled）.toBeTruthy（）；
}));

这是一个.ts文件

从'@angular/core'导入{Component，OnInit}；
从'@angular/forms'导入{AbstractControl，FormGroup，FormBuilder，Validators，FormControl}；
从“../../../@core/auth/auth.reducer”导入{ActionLoadModule}；
从'@ngrx/Store'导入{Store}；
从“../../../@models/app state”导入{AppState}；
从“../../../@core/login/login.reducer”导入{ActionSignIn，selectorLogin，ActionChangePassword}；
从“../../../@core/login/login.state”导入{LoginState}；
从“../../../@shared/busy-indicator/busy-state”导入{BusyState}；
@组成部分({
选择器：“eose登录表单”，
templateUrl:'./login form.component.html'，
样式URL:['./登录表单.component.scss']
})
导出类LoginFormComponent实现OnInit{
肮脏：真实；
//加载：BusyState；
加载：布尔值=false；
loadingMsg:string=''；
authForm:FormGroup；
changeForm:FormGroup
建造师(
私家店，
私人fb:FormBuilder
) {
}
userid=newformcontrol（“”，[Validators.required，Validators.maxLength（8）]）；
密码=新FormControl（“”，[Validators.required，Validators.maxLength（8）]；
useridMessage:string；
passwordMessage:string；
手动加载更改（加载状态：总线状态）{
//this.loading=加载状态；
}
private useridValidationMessage={
必需：“需要用户id值”，
maxlength:'用户id允许的最大长度为8'
};
专用密码验证消息={
必需：“需要密码值”，
maxlength:'密码允许的最大长度为8'
};
setMessage（c:AbstractControl）：void{
this.useridMessage=''；
如果（（c.脏的| | c.碰过的）和c.错误）{
this.useridMessage=Object.keys（c.errors）.map（key=>
this.useridValidationMessage[key]）.join（“”）；
}
}
setpasswordMessage（c:AbstractControl）：void{
this.passwordMessage=''；
如果（（c.脏的| | c.碰过的）和c.错误）{
this.passwordMessage=Object.keys（c.errors）.map（key=>
this.passwordValidationMessages[key]）.join（“”）；
}
}
恩戈尼尼特（）{
this.authForm=this.fb.group({
“env”：新表单控件（'cdtdevdir'），
userid:this.userid，
密码：这个是密码
});
const useridControl=this.authForm.get（'userid'）；
useridControl.valueChanges.subscribe（值=>
this.setMessage（useridControl））；
const passwordControl=this.authForm.get（'password'）；
passwordControl.valueChanges.subscribe（值=>
this.setpasswordMessage（passwordControl））；
this.store.select（selectorLogin）
.subscribe（（loginState:loginState）=>{
this.loading=loginState.loading；
this.loadingMsg=loginState.loadingMsg；
});
}
onLogin（）{
log（'Login Payload'，this.authForm.value）；
this.store.dispatch（新ActionSignIn（this.authForm.value））；
console.log（'保存用户ID以获取Authstate'的位置'）
dispatch（新的ActionLoadModule（{userid:'SOSMSV'}））；
这个.onReset（）；
}
onReset（）{
console.log（“表单已提交！”）；
this.authForm.get（'password'）.setValue（null）；
这个.changeForm.reset（）；
this.authForm.removeControl（'newpassword'）；
}
}

给出组件的代码。ts.@SujataChanda Added.。我尝试了您的测试用例，它对我有效，我所做的唯一更改是删除

async

，并添加了

无错误模式

。试试看，让我知道。comment fixture.detectChanges（）；在每一次尝试之前again@SujataChanda不，不工作，但我已经改变了获得按钮元素，而不是“碳按钮”，我给了“按钮”。现在它工作得很好。但我不明白这一点，如果你知道，请给我澄清。