TypeError:无法读取未定义的属性“ authState”

时间:2018-12-03 22:00:14

标签: angular firebase karma-jasmine

在Angular应用中开始业力测试时出现此错误

错误: UserNavComponent should compile TypeError: Cannot read property 'authState' of undefined TypeError: Cannot read property 'authState' of undefined at AuthService../src/app/auth/shared/auth.service.ts.AuthService.isAuthenticated (http://localhost:9876/src/app/auth/shared/auth.service.ts?:27:26) at UserNavComponent../src/app/user-nav/user-nav.component.ts.UserNavComponent.ngOnInit (http://localhost:9876/src/app/user-nav/user-nav.component.ts?:28:13) at checkAndUpdateDirectiveInline (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:18620:1) at checkAndUpdateNodeInline (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:19884:1) at checkAndUpdateNode (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:19846:1) at debugCheckAndUpdateNode (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:20480:1) at debugCheckDirectivesFn (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:20440:1) at Object.eval [as updateDirectives] (ng:///DynamicTestModule/UserNavComponent_Host.ngfactory.js:9:5) at Object.debugUpdateDirectives [as updateDirectives] (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:20432:1) at checkAndUpdateView (http://localhost:9876/node_modules/@angular/core/fesm5/core.js?:19828:1)

我订阅了名为getAuthUser的FireAuth方法的组件上发生了错误。此方法由我的authService注入,提供了所有fireauth方法

无法编译的组件:

import { Component } from '@angular/core';
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { AuthService } from '../auth/shared/auth.service';

@Component({
  selector: 'app-user-nav',
  templateUrl: './user-nav.component.html',
  styleUrls: ['./user-nav.component.css'],
})
export class UserNavComponent {
 showNav;
 userProfile;
 isHandset$: Observable<boolean> = 
 this.breakpointObserver.observe(Breakpoints.Handset)
.pipe(
  map(result => result.matches)
  );

 constructor(private breakpointObserver: BreakpointObserver, private auth: 
  AuthService) {

 }

 ngOnInit() {

    this.auth.isAuthenticated().subscribe(isAuth => {
    if(!isAuth) {
     this.showNav = false;
    }
    else
    this.showNav = true;
    })
    this.auth.getAuthUser().subscribe(authUser => {
    this.userProfile = authUser;
    })


 }


    logOut() {
    this.auth.logout();
    }


 }

测试失败的代码

测试类:

import { LayoutModule } from '@angular/cdk/layout';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { NoopAnimationsModule } from '@angular/platform- 
browser/animations';
import {
MatButtonModule,
MatIconModule,
MatListModule,
MatSidenavModule,
MatToolbarModule,
} from '@angular/material';

import { UserNavComponent } from './user-nav.component';
import { AngularFirestore, AngularFirestoreDocument } from 
'@angular/fire/firestore';
import { AngularFireAuth } from '@angular/fire/auth';

describe('UserNavComponent', () => {
let component: UserNavComponent;
let fixture: ComponentFixture<UserNavComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
  declarations: [UserNavComponent],
  providers: [{ provide: AngularFirestore} ,{ provide: AngularFireAuth}, 
{provide: AngularFirestoreDocument}],
  imports: [
    NoopAnimationsModule,
    LayoutModule,
    MatButtonModule,
    MatIconModule,
    MatListModule,
    MatSidenavModule,
    MatToolbarModule,
    ]
    }).compileComponents();
    }));

    beforeEach(() => {
    fixture = TestBed.createComponent(UserNavComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
    });

    it('should compile', () => {
    expect(component).toBeTruthy();
    });
    });

期望它进行编译,但没有这样做。有什么建议吗?

0 个答案:

没有答案