Прерывистая ошибка не может соответствовать ни одному из маршрутов модульного тестирования - PullRequest
Новая
       14

Прерывистая ошибка не может соответствовать ни одному из маршрутов модульного тестирования

0 голосов
/ 11 мая 2019

Я прочитал много сообщений на эту тему об использовании модуля тестирования маршрутизатора и попытке шпионить за методом router.navigate, но ни один из них не решил мою проблему. При каждом втором запуске моих тестов или около того я вижу ошибку, вот первая строка полностью 

Uncaught Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'post/view'

Повторение ошибки не было замечено, когда я запускаю свое приложение только при тестировании

Отображается только один раз, независимо от того, сколько тестов в компоненте, и это всегда первый тест, для которого это происходит, если я меняю порядок, то это новый первый тест, который не проходит с этой ошибкой

Мой компонент выглядит следующим образом (для краткости удален несвязанный код) 

export class CreatePostComponent implements OnInit {

  constructor(private postService: PostService,
              private router: Router,
              private location: Location) {
  }

  submitPost() {
    this.validMessage = '';
    if (!this.createPostForm.valid) {
      this.validMessage = 'Please fill out the form before submitting!';
      return;
    }
    const post = this.createPostForm.value as IPost;
    this.postService.createPost(post)
      .pipe(first())
      .subscribe(
        data => {
          this.createPostForm.reset();

          //Here's the call that I believe causes the issues
          this.router.navigate(['post/view']);
        },
        error => {
          return throwError(error);
        }
      );
  }
}

Вот спецификация, снова удалены несвязанные тесты 

describe('CreatePostComponent', () => {
  let component: CreatePostComponent;
  let fixture: ComponentFixture<CreatePostComponent>;
  let http: HttpTestingController;
  let mockPostService;
  let mockLocationService;


  beforeEach(async(() => {
    mockPostService = jasmine.createSpyObj(['createPost']);
    mockLocationService = jasmine.createSpyObj(['back']);
    TestBed.configureTestingModule({
      declarations: [CreatePostComponent],
      imports: [ReactiveFormsModule,
        HttpClientTestingModule,
        RouterTestingModule],
      providers: [
        {provide: PostService, useValue: mockPostService},
        {provide: Location, useValue: mockLocationService}]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    http = TestBed.get(HttpTestingController);
    fixture = TestBed.createComponent(CreatePostComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

Я также пытался шпионить за маршрутизатором, как показано ниже (остальная часть кода не изменилась) 

  beforeEach(async(() => {
    mockPostService = jasmine.createSpyObj(['createPost']);
    mockLocationService = jasmine.createSpyObj(['back']);
    TestBed.configureTestingModule({
      declarations: [CreatePostComponent],
      imports: [ReactiveFormsModule,
        HttpClientTestingModule,
        RouterTestingModule],
      providers: [
        {provide: PostService, useValue: mockPostService},
        {provide: Location, useValue: mockLocationService}]
    })
      .compileComponents();

    spyOn<any>(component['router'], 'navigate').and.returnValue(true);
  }));

и я попытался ввести свой собственный макет для навигации, как показано ниже 

  beforeEach(async(() => {
    mockPostService = jasmine.createSpyObj(['createPost']);
    mockLocationService = jasmine.createSpyObj(['back']);
    TestBed.configureTestingModule({
      declarations: [CreatePostComponent],
      imports: [ReactiveFormsModule,
        HttpClientTestingModule],
      providers: [
        {provide: PostService, useValue: mockPostService},
        {provide: Location, useValue: mockLocationService},
        {provide: Router, useValue: {navigate: () => true}}]
    })
      .compileComponents();
  }));

1 Ответ

1 голос
/ 15 мая 2019

Вы не предоставили RouterTestingModule какие-либо действительные маршруты, поэтому он говорит вам, что не знает, как выполнить маршрутизацию в «запись / просмотр».Измените свой импорт RouterTestingModule на что-то вроде следующего: 

RouterTestingModule.withRoutes([
  { path: 'post/view', component: BlankComponent },
])

Где BlankComponent - пустой компонент только для целей тестирования.

Вот рабочий StackBlitz , показывающий эторешение.Чтобы воссоздать вашу ошибку, просто закомментируйте объявление RouterTestingModule, которое я изменил, и раскомментируйте оригинал без маршрутов чуть ниже него в Stackblitz.

Я согласен, что документы не очень хороши - основная документация по тестированию простозаявляет, что в будущем будет документ, описывающий RouterTestingModule более подробно.См. Информацию об API здесь , в конце приведен пример использования withRoutes.

Надеюсь, это поможет.:)

...