web-dev-qa-db-fra.com

Erreur de test unitaire: impossible d'appeler Promise.then à partir d'un test de synchronisation

J'ai commencé à chercher dans les tests unitaires angular 2 applications, mais je suis coincé même dans les exemples les plus simples. Je veux juste exécuter un test simple pour voir si cela fonctionne, essentiellement ce que je veux est pour comparer une valeur de la page de titre à celle du test.

C'est l'erreur que je reçois, mais je ne vois pas d'où vient l'erreur car tout semble être synchrone pour moi.

Erreur: Erreur: impossible d'appeler Promise.then à partir d'un test de synchronisation.

Test de l'unité:

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By }              from '@angular/platform-browser';
import { DebugElement, Input}    from '@angular/core';
import { ToDoComponent } from './todo.component';
import { FormsModule } from '@angular/forms';
describe(("test input "),() => {
    let comp:    ToDoComponent;
    let fixture: ComponentFixture<ToDoComponent>;
    let de:      DebugElement;
    let el:      HTMLElement;

    beforeEach(() => {
        TestBed.configureTestingModule({
            declarations: [ ToDoComponent ],
            imports: [ FormsModule ]
        })
        .compileComponents();  
    });

    fixture = TestBed.createComponent(ToDoComponent);
    comp = fixture.componentInstance;
    de = fixture.debugElement.query(By.css("h1"));
    el = de.nativeElement;

    it('should display a different test title', () => {
        comp.pageTitle = 'Test Title';
        fixture.detectChanges();
        expect(el.textContent).toBe('Test Title423');
    });
});

Ma composante:

import {Component} from "@angular/core";
import {Note} from "app/note";

@Component({
    selector : "toDoArea",
    templateUrl : "todo.component.html"
})

export class ToDoComponent{
    pageTitle : string = "Test";
    noteText : string ="";
    noteArray : Note[] = [];
    counter : number = 1;
    removeCount : number = 1;

    addNote() : void {

        if (this.noteText.length > 0){
            var a = this.noteText;
            var n1 : Note = new Note();
            n1.noteText = a;
            n1.noteId = this.counter;
            this.counter = this.counter + 1;
            this.noteText = "";
            this.noteArray.Push(n1);        
        }

    }

    removeNote(selectedNote : Note) :void{
        this.noteArray.splice(this.noteArray.indexOf(selectedNote),this.removeCount);
    }

}
javascriptunit-testingangular
29
Proxy

Déplacez votre initialisation de variable dans un beforeEach.

Vous ne devez pas extraire des éléments du TestBed ou gérer le luminaire ou le composant dans la portée describe. Vous ne devriez faire ces choses que dans le cadre d'un test: à l'intérieur d'un beforeEach/beforeAll, afterEach/afterAll, ou à l'intérieur d'un it.

describe(("test input "), () => {
  let comp: ToDoComponent;
  let fixture: ComponentFixture<ToDoComponent>;
  let de: DebugElement;
  let el: HTMLElement;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
        declarations: [ToDoComponent],
        imports: [FormsModule]
      })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(ToDoComponent);
    comp = fixture.componentInstance;
    de = fixture.debugElement.query(By.css("h1"));
    el = de.nativeElement;
  })


  it('should display a different test title', () => {
    comp.pageTitle = 'Test Title';
    fixture.detectChanges();
    expect(el.textContent).toBe('Test Title423');
  });

});

Voir également

53
yurzui

J'ai eu la même erreur pour une raison différente. J'ai mis un appel TestBed.get(Dependency) dans un bloc describe. Le correctif le déplaçait vers le bloc it.

Faux:

describe('someFunction', () => {
    const dependency = TestBed.get(Dependency); // this was causing the error

    it('should not fail', () => {
        someFunction(dependency);
    });
});

Fixé:

describe('someFunction', () => {
    it('should not fail', () => {
        const dependency = TestBed.get(Dependency); // putting it here fixed the issue
        someFunction(dependency);
    });
});
6
Nathan Hanna