javascript - Test for rejected promise with Jasmine - Stack Overflow

admin管理员组

文章数量:1390564

In my Angular2 app which uses AngularFire2, I have an AuthService which tries to authenticate anonymously with Firebase.

I am trying to write a test that expects AngularFireAuth's signInAnonymously to return a rejected promise; for authState to be null and an error to be thrown.

I an new to Jasmine and testing in general but I think I may need to be using asynchronous tests but I'm getting quite stuck.

Here is a simplified AuthService:

import { Injectable } from '@angular/core';

import { AngularFireAuth } from 'angularfire2/auth';
import * as firebase from 'firebase/app';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class AuthService {
  private authState: firebase.User;

  constructor(private afAuth: AngularFireAuth) { this.init(); }

  private init (): void {
    this.afAuth.authState.subscribe((authState: firebase.User) => {
      if (authState === null) {
        this.afAuth.auth.signInAnonymously()
          .then((authState) => {
            this.authState = authState;
          })
          .catch((error) => {
            throw new Error(error.message);
          });
      } else {
        this.authState = authState;
      }
    }, (error) => {
      throw new Error(error.message);
    });
  }
}

And here are my test specs:

import { TestBed, inject } from '@angular/core/testing';

import { AngularFireAuth } from 'angularfire2/auth';
import 'rxjs/add/observable/of';
import { Observable } from 'rxjs/Rx';

import { AuthService } from './auth.service';
import { environment } from '../environments/environment';

describe('AuthService', () => {
  const mockAngularFireAuth: any = {
    auth: jasmine.createSpyObj('auth', {
      'signInAnonymously': Promise.resolve('foo'),
      // 'signInWithPopup': Promise.reject(),
      // 'signOut': Promise.reject()
    }),
    authState: Observable.of(null)
  };

  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        { provide: AngularFireAuth, useValue: mockAngularFireAuth },
        { provide: AuthService, useClass: AuthService }
      ]
    });
  });

  it('should be created', inject([ AuthService ], (service: AuthService) => {
    expect(service).toBeTruthy();
  }));

  //
  //
  //
  //
  //

  describe('when we can’t authenticate', () => {
    beforeEach(() => {
      mockAngularFireAuth.auth.signInAnonymously.and.returnValue(Promise.reject('bar'));
    });

    it('should thow', inject([ AuthService ], (service: AuthService) => {
      expect(mockAngularFireAuth.auth.signInAnonymously).toThrow();
    }));
  });

  //
  //
  //
  //
  //

});

Thank you for your help!

In my Angular2 app which uses AngularFire2, I have an AuthService which tries to authenticate anonymously with Firebase.

I am trying to write a test that expects AngularFireAuth's signInAnonymously to return a rejected promise; for authState to be null and an error to be thrown.

I an new to Jasmine and testing in general but I think I may need to be using asynchronous tests but I'm getting quite stuck.

Here is a simplified AuthService:

import { Injectable } from '@angular/core';

import { AngularFireAuth } from 'angularfire2/auth';
import * as firebase from 'firebase/app';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class AuthService {
  private authState: firebase.User;

  constructor(private afAuth: AngularFireAuth) { this.init(); }

  private init (): void {
    this.afAuth.authState.subscribe((authState: firebase.User) => {
      if (authState === null) {
        this.afAuth.auth.signInAnonymously()
          .then((authState) => {
            this.authState = authState;
          })
          .catch((error) => {
            throw new Error(error.message);
          });
      } else {
        this.authState = authState;
      }
    }, (error) => {
      throw new Error(error.message);
    });
  }
}

And here are my test specs:

import { TestBed, inject } from '@angular/core/testing';

import { AngularFireAuth } from 'angularfire2/auth';
import 'rxjs/add/observable/of';
import { Observable } from 'rxjs/Rx';

import { AuthService } from './auth.service';
import { environment } from '../environments/environment';

describe('AuthService', () => {
  const mockAngularFireAuth: any = {
    auth: jasmine.createSpyObj('auth', {
      'signInAnonymously': Promise.resolve('foo'),
      // 'signInWithPopup': Promise.reject(),
      // 'signOut': Promise.reject()
    }),
    authState: Observable.of(null)
  };

  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        { provide: AngularFireAuth, useValue: mockAngularFireAuth },
        { provide: AuthService, useClass: AuthService }
      ]
    });
  });

  it('should be created', inject([ AuthService ], (service: AuthService) => {
    expect(service).toBeTruthy();
  }));

  //
  //
  //
  //
  //

  describe('when we can’t authenticate', () => {
    beforeEach(() => {
      mockAngularFireAuth.auth.signInAnonymously.and.returnValue(Promise.reject('bar'));
    });

    it('should thow', inject([ AuthService ], (service: AuthService) => {
      expect(mockAngularFireAuth.auth.signInAnonymously).toThrow();
    }));
  });

  //
  //
  //
  //
  //

});

Thank you for your help!

• javascript
• angular
• jasmine
• karma-jasmine
• angularfire2

Share Improve this question Follow edited Sep 29, 2021 at 15:06 Phil Dukhov 89.5k2222 gold badges260260 silver badges292292 bronze badges asked Sep 16, 2017 at 10:27 Jonathon OatesJonathon Oates 2,95244 gold badges3838 silver badges6060 bronze badges 4

• Why are you writing the test for the mock? What's the code under test supposed to be doing? – jonrsharpe Commented Sep 16, 2017 at 10:45
• Hi @jonrsharpe, I'm mocking AngularFireAuth's signInAnonymously otherwise it would make actual calls to Firebase each time the tests are ran. I am led to believe I'm supposed to mock these sort of 3rd party providers? – Jonathon Oates Commented Sep 16, 2017 at 10:51
• Yes, but that mock is the only thing your test seems to be exercising. – jonrsharpe Commented Sep 16, 2017 at 10:52
• That's only because I have not written the rest of the AuthService or any more tests for for those future methods ;-) I think I am fortable writing those tests so to keep this concise I've only included the tests I actually need help with. Cheers – Jonathon Oates Commented Sep 16, 2017 at 10:55

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

It turns out I was mocking mockAngularFireAuth correctly. I needed to reject mockAngularFireAuth.auth signInAnonymously()'s promise with an error and expect it to be caught, a la:

import { TestBed, async, inject } from '@angular/core/testing';

import { AngularFireAuth } from 'angularfire2/auth';
import 'rxjs/add/observable/of';
import { Observable } from 'rxjs/Rx';

import { AuthService } from './auth.service';
import { MockUser} from './mock-user';
import { environment } from '../environments/environment';

describe('AuthService', () => {
  // An anonymous user
  const authState: MockUser = {
    displayName: null,
    isAnonymous: true,
    uid: '17WvU2Vj58SnTz8v7EqyYYb0WRc2'
  };

  const mockAngularFireAuth: any = {
    auth: jasmine.createSpyObj('auth', {
      'signInAnonymously': Promise.reject({
        code: 'auth/operation-not-allowed'
      }),
      // 'signInWithPopup': Promise.reject(),
      // 'signOut': Promise.reject()
    }),
    authState: Observable.of(authState)
  };

  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        { provide: AngularFireAuth, useValue: mockAngularFireAuth },
        { provide: AuthService, useClass: AuthService }
      ]
    });
  });

  it('should be created', inject([ AuthService ], (service: AuthService) => {
    expect(service).toBeTruthy();
  }));

  describe('can authenticate anonymously', () => {
    describe('AngularFireAuth.auth.signInAnonymously()', () => {
      it('should return a resolved promise', () => {
        mockAngularFireAuth.auth.signInAnonymously()
          .then((data: MockUser) => {
            expect(data).toEqual(authState);
          });
      });
    });
  });

  describe('can’t authenticate anonymously', () => {
    describe('AngularFireAuth.auth.signInAnonymously()', () => {
      it('should return a rejected promise', () => {
        mockAngularFireAuth.auth.signInAnonymously()
          .catch((error: { code: string }) => {
            expect(error.code).toEqual('auth/operation-not-allowed');
          });
      });
    });
  });
  …
});

I solved this problem by doing the following:

        describe('should reject promise', () => {

            let resolved: boolean;
            let rejected: boolean;
            let _e: any;

            beforeEach(function (done) {
                resolved = false;
                rejected = false;
                // ensure conditions here are such that myFn() should return a rejected promise
                service.myFn().then(() => {
                    resolved = true;
                    done();
                }).catch((e) => {
                    rejected = true;
                    _e = e;
                    done();
                });
            })

            it('should reject', () => {
                expect(resolved).toEqual(false);
                expect(rejected).toEqual(true);
                expect(_e.name).toEqual("MyCustomErrorName");
            });
        });

本文标签： javascriptTest for rejected promise with JasmineStack Overflow