Question

我正在对我的角度应用进行自动测试，但出现以下错误：无法获取未定义或空引用抛出的属性'unuseGeometry'。我不知道这有什么问题，要测试我是否使用Edge浏览器。

it('should call goToInitialMenu()', () => {
    spyOn(component, 'goToInitialMenu');
    component.goToInitialMenu();
    fixture.whenStable().then(()=> {
      expect(component.goToInitialMenu).toHaveBeenCalled();
    });
});

完整测试文件：

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from '@angular/core';
import { SinglePlayerMenuComponent } from './single-player-menu.component';
import { HttpClientModule } from '@angular/common/http';

fdescribe('SinglePlayerMenuComponent', () => {
  let component: SinglePlayerMenuComponent;
  let fixture: ComponentFixture<SinglePlayerMenuComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ SinglePlayerMenuComponent ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
      providers: [SinglePlayerMenuComponent],
      imports: [ HttpClientModule ],
    })
    .compileComponents();
  }));

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

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

  it('should call goToInitialMenu()', () => {
    spyOn(component, 'goToInitialMenu');
    component.goToInitialMenu();
    fixture.whenStable().then(()=> {
      expect(component.goToInitialMenu).toHaveBeenCalled();
    });
  });
});

这是组件文件：

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Song } from 'src/app/shared/song/song.model';
import { SceneOrchestratorService } from 'src/app/services/scene-orchestrator.service';
import { Scene } from 'src/app/shared/scene/scene.enum';
import { SongService } from 'src/app/services/song.service';
import { Subscription } from 'rxjs';

@Component({
  selector: 'a-single-player-menu',
  templateUrl: './single-player-menu.component.html',
  styleUrls: ['./single-player-menu.component.css']
})
export class SinglePlayerMenuComponent implements OnInit, OnDestroy {

  private _songSrvSubscription: Subscription;
  constructor(private _sceneOrchestratorSrv: SceneOrchestratorService,
              private _songSrv: SongService) { }

  private _songs: Song[];
  private _selectedSong: Song;

  ngOnInit() {
    this._songSrvSubscription = this._songSrv.getTopRaitedSongsList().subscribe(
      (result: Song[]) => {
        this.songs = result;
      });
  }

  ngOnDestroy() {
    if (this._songSrvSubscription != undefined) {
      this._songSrvSubscription.unsubscribe();
    }
  }

  get songs(): Song[] {
    return this._songs;
  }

  set songs(songs: Song[]) {
    console.log(songs)
    this._songs = songs;
  }

  get selectedSong() {
    return this._selectedSong;
  }

  set selectedSong(songSelected: Song) {
    this._selectedSong = songSelected;
  }

  selectTheSong(song: Song) {
    this._selectedSong = song;
  }

  goToInitialMenu() {
    this._sceneOrchestratorSrv.actualScene = Scene.initialMenu;
  }
}

我在其他组件中具有相同的代码，并且工作正常，我不知道为什么在此组件中出现此错误。

Answer 1

最后，解决方案是将服务添加到

app.module.ts

还要添加

HttpClientModule，HttpClient

供应商和进口

import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { NgModule, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA } from '@angular/core';

import { AppComponent } from './app.component';
import { MenuComponent } from './menu/menu.component';
import { GameComponent } from './game/game.component';
import { SinglePlayerMenuComponent } from './menu/single-player-menu/single-player-menu.component';
import { PartyMenuComponent } from './menu/party-menu/party-menu.component';
import { HowToPlayComponent } from './menu/how-to-play/how-to-play.component';
import { CreditsComponent } from './menu/credits/credits.component';
import { SongService } from '../services/song.service';
import { BeatsaverAPIService } from '../services/beatsaverAPI.service';

const appRoutes: Routes = [
  { path: '/game', component: GameComponent },
  { path: '/menu',      component: MenuComponent },
  { path: '/singlePlayerMenu',      component: SinglePlayerMenuComponent },
  { path: '/',      component: AppComponent },
];

@NgModule({
  declarations: [
    AppComponent,
    MenuComponent,
    GameComponent,
    SinglePlayerMenuComponent,
    PartyMenuComponent,
    HowToPlayComponent,
    CreditsComponent,
  ],
  imports: [
    BrowserModule,
    HttpClientModule
  ],
  providers: [HttpClientModule, HttpClient, SongService, BeatsaverAPIService],
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA]
})
export class AppModule { }

无法获取抛出未定义或空引用的属性“ unuseGeometry”

1 个答案: