Question

我有以下设置：

describe('Component: ArticleComponent', () => {

    let httpService;
    let alertService;
    let stateService;
    let settingsService;
    let windowRefService;

    /**
     * more let declarations here
     */

    beforeEach(() => {
        httpService = jasmine.createSpyObj(/* stuff */);
        alertService = jasmine.createSpyObj(/* stuff */);
        stateService = jasmine.createSpyObj(/* stuff */);

        /**
         * more definitions here
         */

        TestBed.configureTestingModule({
            declarations: [ArticleFactoryComponent, ArticleComponent],
            imports: [BrowserAnimationsModule],
            providers: [
                {provide: Http, useValue: httpService},
                {provide: AlertService, useValue: alertService},
                {provide: StateService, useValue: stateService},
                {provide: WindowRefService, useValue: windowRefService},
                {provide: SettingsService, useValue: settingsService},
            ]
        });

        fixture = TestBed.createComponent(ArticleFactoryComponent);
        comp = fixture.componentInstance;
        comp.article = article;
        fixture.detectChanges();
        de = fixture.debugElement.query(By.directive(ArticleComponent));
        el = de.nativeElement;
        articleComponent = de.injector.get(ArticleComponent);

    });

    it('should open an article in CS on double click', async () => {
        const openArticleInCueSpy = spyOn(articleComponent, 'openArticleInCue').and.returnValue(undefined);
        const openArticleInCsSpy = spyOn(articleComponent, 'openArticleInCs').and.returnValue(undefined);
        await de.triggerEventHandler("dblclick", new MouseEvent("dblclick"));
        await fixture.detectChanges();
        expect(openArticleInCueSpy).not.toHaveBeenCalled();
        expect(openArticleInCsSpy).toHaveBeenCalled();
    });

    it('should open an article in CUE on double click', async () => {
        const openArticleInCueSpy = spyOn(articleComponent, 'openArticleInCue').and.returnValue(undefined);
        const openArticleInCsSpy = spyOn(articleComponent, 'openArticleInCs').and.returnValue(undefined);
        settingsServiceMockSettings.openArticlesInCue = true;
        await de.triggerEventHandler("dblclick", new MouseEvent("dblclick"));
        await fixture.detectChanges();
        expect(openArticleInCueSpy).toHaveBeenCalled();
        expect(openArticleInCsSpy).not.toHaveBeenCalled();
    });

});

所以我正在做的是为服务初始化一些模拟，测试一个组件并用2个测试对它进行测试。

这些测试的不同之处在于我在一个（模拟的）服务中有一个变量，我为测试而改变了。

当我运行这样的测试时，它会失败并显示ZoneAwareError：

Expected spy openArticleInCs to have been called.
    at new ZoneAwareError Users/lbombach/WeltN24/Editorial-Products/projects/ep-papyrus-ng2/papyrus/node_modules/zone.js/dist/zone.js:993:1)
    at Object.<anonymous> Users/lbombach/WeltN24/Editorial-Products/projects/ep-papyrus-ng2/papyrus/src/app/article/article.component.spec.ts:81:36)
    at step (http://localhost:9876/_karma_webpack_/main.bundle.js:1864:23)
    at Object.next (http://localhost:9876/_karma_webpack_/main.bundle.js:1845:53)
    at fulfilled (http://localhost:9876/_karma_webpack_/main.bundle.js:1836:58)

第二次测试中会抛出错误。当我删除第一个测试时，第二个测试运行顺利。

Answer 1

原因我看到这是因为

de.triggerEventHandler("dblclick", new MouseEvent("dblclick"));

没有调用我的事件处理程序，并且断言hasBeenCalled失败。

当我运行多个测试时，Angular 4在测试中获得ZoneAwareError

1 个答案: