单元测试错误:无法从同步测试中调用Promise.then

本文介绍了单元测试错误:无法从同步测试中调用Promise.then的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我开始研究角度2应用程序的单元测试，但是即使在最简单的示例中，我也陷入了困境.我只想运行一个简单的测试以查看它是否还能工作，基本上我想要的是将标题页中的值与测试中的值进行比较.

I started looking into unit testing angular 2 applications, but I'm stuck even in the simplest examples. I just want to run a simple test to see if it even works, basically what I want is to compare a value from the title page to the one in the test.

这是我遇到的错误，但由于所有内容似乎都与我同步，因此我看不到错误的出处.

This is the error I'm getting, but I don't see where the error is coming from since everything looks to be synchronous to me.

错误:错误:无法从同步测试中调用Promise.然后

Error: Error: Cannot call Promise.then from within a sync test.

单元测试:

import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { DebugElement, Input} from '@angular/core'; import { ToDoComponent } from './todoponent'; 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 ] }) pileComponents(); }); fixture = TestBed.createComponent(ToDoComponent); comp = fixtureponentInstance; 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'); }); });

我的组件:

import {Component} from "@angular/core"; import {Note} from "app/note"; @Component({ selector : "toDoArea", templateUrl : "todoponent.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); } }

推荐答案

将变量初始化移动到beforeEach内部.

Move your variable initialization inside a beforeEach.

您不应该将事情从TestBed上移走，也不应该在describe范围内管理固定装置或组件.您只能在测试运行范围内执行这些操作:在beforeEach/beforeAll，afterEach/afterAll内部或在it内部.

You shouldn't be getting things out of the TestBed or managing the fixture or component in the describe scope. You should only do these things within the scope of a test run: inside a beforeEach/beforeAll, afterEach/afterAll, or inside an 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] }) pileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(ToDoComponent); comp = fixtureponentInstance; 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'); }); });

另请参见

• angular.io/docs/ts/latest/guide/testing.html#！#waiting-compile-components