无法使用 Angular2+ 成功测试我的 NgForm 调用答案

【问题标题】：Cannot successfully test my NgForm call with Angular2+无法使用 Angular2+ 成功测试我的 NgForm 调用
【发布时间】：2018-07-30 09:33:02
【问题描述】：

我正在尝试通过 NgForm 发送用户名和密码输入来测试我是否可以成功登录，但我似乎无法成功通过...有什么我遗漏的吗？

我目前收到错误：

Chrome 67.0.3396 (Mac OS X 10.13.5) LoginComponent should call auth.login when passed a valid form with correct credentials onSubmit FAILED
    Expected spy login to have been called.
        at UserContext.<anonymous> src/app/components/login/login.component.spec.ts:87:26)
        at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke node_modules/zone.js/dist/zone.js:388:1)
        at ProxyZoneSpec.push../node_modules/zone.js/dist/zone-testing.js.ProxyZoneSpec.onInvoke node_modules/zone.js/dist/zone-testing.js:288:1)
        at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke node_modules/zone.js/dist/zone.js:387:1)

【问题讨论】：

你的测试输出是什么？你在beforeEach 块中有你的it 块，你在监视logout 以测试login，并且你没有返回一个 Observable，这将导致类似于@987654327 的错误@.
道歉@trichetriche。已更新。
现已更新。没想到你反应这么快;-)
你纠正了一个问题（这不是一个，这是一个请求）：其他的呢？返回一个可观察的，监视正确的方法...？
我不确定你的意思？我想我在监视正确的东西，我不确定我是否发送了正确的 json，来自这个链接：stackoverflow.com/questions/45332847/… 表明我是......

标签： javascript angular typescript angularjs-ng-form

【解决方案1】：

在@trichetriche 的大力帮助下，我遇到的解决方案是我的spyOn 需要回报。

我还需要将 valid: true 选项添加到要传递的 NgForm json 中：

const validFormGoodCreds = <NgForm>{
    valid: true,
    value: {
      username: "someUsername",
      password: "somePassword"
    }
  };

由于我不关心当前返回的是什么，只想关注函数是否被调用，所以我选择了换行的方案：

authLoginSpy = spyOn(component['authService'], 'login');

到

authLoginSpy = spyOn(component['authService'], 'login').and.callThrough();

然后可以看到该函数应该完全运行，因此将调用login()。

【讨论】：

虽然这已经解决了你的问题，但mock中的valid属性也是解决方案的重要组成部分，也许你也应该添加它。
好收获。实际上我只是自己再次测试了它。