Angular Firebase-使用angularFireAuth对服务进行单元测试

时间:2018-08-17 11:56:43

标签: angular unit-testing jasmine mocking angularfire2

我有一个核心服务,该服务获取firebase.auth obj的实例并使用getter返回它。它很简单,如下所示:

export class AuthService {

  ...
  constructor(private afAuth: AngularFireAuth,
              private afs: AngularFirestore) {
  ...
}

  public getAuthInstance(): FirebaseAuth {
    return this.afAuth.auth;
  }
}

现在我有一个LoginService,需要AuthService才能登录到我的应用程序。

export class LoginService {

  constructor(private authService: AuthService) {
  }

  public login(email, password): Promise<UserCredential | string> {
    return this.authService.getAuthInstance().signInWithEmailAndPassword(email, password)
      .catch(() => Promise.reject('Login failed.'));
  }

也不太复杂。但是现在我要测试我的登录组件。 -特别是login方法。我无法嘲笑signInWithEmailAndPassword。我基本上尝试了所有事情:

  • jasmine.spies
  • 自己创建了假obj。

测试类如下:

  ...
  const authStub: AuthService = jasmine.createSpyObj('AuthService', ['getAuthInstance']);
  const fireStub = {
    auth: {
      signInWithEmailAndPassword() {
        return Promise.resolve();
      }
    }
  };

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

  const spy = it('should call signInWithPasswordAndEmail', inject([LoginService], (service: LoginService) => {
    (<jasmine.Spy>authStub.getAuthInstance).and.returnValue({username: 'test'});
    spyOn(fireStub.auth, 'signInWithEmailAndPassword').and.callThrough();


    service.login(email, password).then(() => expect(spy).toHaveBeenCalledTimes(1));
  }));

有人可以帮助我获得该死的绿色测试吗? xD ^^ 错误消息。抛出的那个ist是:this.getAuthInstance()。signInWithEmail ....不是一个函数

1 个答案:

答案 0 :(得分:1)

经过反复试验后,我用#arrow-button:hover{ /* Example make the arrow yellow if buttos was hovered */ -fx-background-color: -fx-mark-highlight-color, yellow; } #arrow-button:pressed{ /* And red if it was pressed, you can apply different effect * like shadow , padding etc inside this rules. */ -fx-background-color: -fx-mark-highlight-color, red; } $.ajax({ method: 'GET', url: BaseUrl+'GetAllEmployees?AdminId=' + localStorage.getItem('AdminId'), success: function (data) { $.LoadingOverlay("hide"); $.each(data, function (index, value) { var row = ('<tr><td><a class="EmpDetails" href="api/PayrollSystem/GetEmployeeTooltipPageSummary?EmpId=' + value.Id + '&AdminId=' + localStorage.getItem('AdminId') +'">' + value.EmployeeID + '</a></td><td><a href="EditEmployee.html?Id=' + value.Id + '">' + value.FullName + '</a></td><td><a href="EditEmployee.html?Id=' + value.Id + '">' + value.Email + '</a></td><td><a href="EditEmployee.html?Id=' + value.Id + '">' + value.Position + '</a></td></tr>'); $('#EmpTable').append(row); }); $('#EmpTable').DataTable(); //Where I initiate qtip $('.EmpDetails').qtip({ content: " ", position: { my: 'top left', target: 'mouse', //viewport: $(window), // Keep it on-screen at all times if possible adjust: { x: 10, y: 10 } }, }); //Where i try to display results from the ajax call using qtip $(document).on('mouseenter', '.EmpDetails', function () { $.ajax({ context: this, url: $(this).attr('href'), cache: false, success: function (html) { $(html).empty(); $(this).qtip('option', 'content.text', html); }, error: function (err) { console.log(err.reponseText); } }); }); }, error: function () { $.LoadingOverlay("hide"); $.alert({ title: 'Ooopsss', content: 'You Have Not Added Any Employee', }); } });间接模拟了AuthService,测试配置如下:

AngularFireAuth

完成工作。如果有人有更好的解决方案,我将很高兴知道。