title: Angular can't test error handling with jasmina&karma
body: <p>I am trying to test my authService <code>signIn</code> method, with mockedAuthService. I have done scenario where, sign in passes and I also want to test the case, when it fails with backend error when credentials are not correct, everything is working perfectly since going  through it in GUI so I decided to ensure that it won't be changed by writing test:</p>
  <pre><code>class MockAuthService implements BaseAuth {
    signIn(data: SignInRequestData): Observable&lt;AuthResponseData&gt; {
      const successData = {
        username: 'goodjob',
        password: 'password123',
      }
      if (JSON.stringify(data) === JSON.stringify(successData))  {
        return of({
          accessToken: 'string',
          refreshToken: 'string',
          user: {
            id: '',
            firstName: '',
            lastName: '',
            email: ''
          }
        });
      } else {
        return throwError(() =&gt; ({error: {
          nonFieldErrors: [ &quot;Podane dane do logowania są niepoprawne.&quot; ]
        }}));
      }
    }
  } 
  </code></pre>
  <p>that is how my mocked service looks like I am not totally sure if i approach it right way if you have advice how to make it better let me know.</p>
  <pre><code>  onSubmit(): void {
      if (this.form.valid) {
        this.errorMessage = undefined;
        this.authService.signIn(this.form.value)
        .pipe(
          catchError((err) =&gt; {
            this.errorMessage = err.error.nonFieldErrors[0];
  
            return throwError(() =&gt; err);
          })
        )
        .subscribe((authData: AuthResponseData) =&gt; {
          this.router.navigate(['/panel'])
        });
      } else {
        Object.values(this.form.controls).forEach(control =&gt; {
          if (control.invalid) {
            control.markAsDirty();
            control.updateValueAndValidity({ onlySelf: true });
          }
        });
      }
    }
  </code></pre>
  <p>above is the method implemented in component, that calls the signIn method from a service, as you can propably see I am catching here an error than assign its message to component field and on this basis alert in template will appear.</p>
  <pre><code>  it(`should display alert above form when credentails aren't correct`, fakeAsync(() =&gt; {
  
      component.form.patchValue({
        username: 'not',
        password: 'correct',
      })
      const submitBtn = debugElement.query(By.css(&quot;[data-test='submit']&quot;));
      submitBtn.nativeElement.click();
  
      tick(1000)
      fixture.detectChanges()
  
      expect(debugElement.query(By.css(&quot;[nz-alert]&quot;))).toBeTruthy();
    }));
  </code></pre>
  <p>this is the test, which fails because of error thrown, instead of failing I would like it to check assertion.</p>
  <p><a href="https://i.stack.imgur.com/9xKIY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9xKIY.png" alt="enter image description here" /></a></p>