Тестируя приложение в Angular 7 с помощью Karma, я не могу удалить ошибку в subj.
Я искал разные места (в основном здесь), но либо решения не работают, либо не имеют отношения к моему делу.
App.component.html:
<app-header></app-header>
<router-outlet></router-outlet>
Заголовок.component.ts:
import { Component, OnInit, ViewChild, ElementRef, AfterViewInit, EventEmitter, Output } from '@angular/core';
import { Router } from '@angular/router';
import { Location } from '@angular/common';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.less']
})
export class HeaderComponent implements AfterViewInit, OnInit {
constructor(private location: Location, private router: Router) {
setInterval(() => {
this.now = new Date();
}, 1000);
}
...
onKeyDown(event: KeyboardEvent): void {
event.preventDefault();
if (event.which === this.KEY_ESCAPE){
if (this.router.url !== '/'){
this.location.back();
}
}
}
App.component.spec.ts:
import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { HeaderComponent } from './header/header.component';
import { RouterOutlet } from '@angular/router';
describe('AppComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
AppComponent,
HeaderComponent,
RouterOutlet
],
}).compileComponents();
}));
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.debugElement.componentInstance;
expect(app).toBeTruthy();
});
AppComponent should create the app
Error: StaticInjectorError(DynamicTestModule)[HeaderComponent -> Location]:
StaticInjectorError(Platform: core)[HeaderComponent -> Location]:
NullInjectorError: No provider for Location!
Можешь попробовать import
> CommonModule
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [CommonModule]
declarations: [
AppComponent,
HeaderComponent,
RouterOutlet
],
}).compileComponents();
}));
Исправлено: все, что мне нужно было сделать, это импортировать RouterModule.forRoot([])
, что кажется распространенной ошибкой, поскольку исправляет множество ошибок StaticInjectorError(DynamicTestModule)
.
В файл спецификации импорта.
Альтернативой NullInjectorError: No provider for Location!
во время тестирования является импорт RouterTestingModule
.
бывший. mycomponent.spec.ts:
import { RouterTestingModule } from '@angular/router/testing';
...
beforeEach(() => TestBed.configureTestingModule({
imports: [ RouterTestingModule ]
}));
В моем случае я уже использовал RouterTestingModule, который не должен вызывать эту ошибку. Я импортировал Location не из того места, поэтому появилась ошибка. «Местоположение» должно быть импортировано отсюда:
import {Location} from '@angular/common';
В вашем импорте вы должны импортировать только RouterTestingModule следующим образом:
TestBed.configureTestingModule({
imports: [
RouterTestingModule.withRoutes(
[
{path: 'add', component: DummyComponent, pathMatch: 'full'}
]
)
],
а затем вы можете использовать Location следующим образом:
it('Should navigate to / before + button click', () => {
const location: Location = TestBed.get(Location);
expect(location.path()).toBe('');
});
Только не забудьте импортировать Location из @angular/common
В любом случае, я всегда предлагаю использовать шпион на навигации по маршрутизатору, а не напрямую использовать местоположение.
Не могли бы вы расширить свой ответ и объяснить, какой файл нуждается в этом импорте?