Question

我正在编写一个Angular2模块的测试规范，它似乎有一个问题，即当前4个被注释掉时最终测试工作但是当它们没有被注销时失败。它让我相信最终的测试是使用了一个已被先前测试干扰的TestingModule，并且testModule没有在使用beforeEach的每个测试中构建。这是我的测试模块：

import { TestBed, ComponentFixture, async } from "@angular/core/testing";
import { CUSTOM_ELEMENTS_SCHEMA, DebugElement } from "@angular/core";
import { HttpModule } from "@angular/http";
import { By } from "@angular/platform-browser";
import { FileUploaderDirective } from "../../../components/directives/files/FileUploaderDirective";
import { APIUrlPipe } from "../../../pipes/apiurl.pipe";
import { FilesService } from "../../../services/files.service";
import { MockFilesService } from "../../mocks/services/mockFilesService";
import { mockFilesData } from "../../mocks/data/fileData";

let comp:    FileUploaderDirective;
let fixture: ComponentFixture<FileUploaderDirective>;
let de:      DebugElement;
let el:      HTMLElement;

describe('Directive: File Uploader', () => {
    let fileService = new MockFilesService();

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [
                FileUploaderDirective,
                APIUrlPipe
            ],
            providers: [
                {
                    provide: FilesService, useValue: fileService
                }
            ],
            imports: [
                HttpModule
            ],
            schemas: [CUSTOM_ELEMENTS_SCHEMA]
        })
            .compileComponents()
                .then(() => {
                    fixture = TestBed.createComponent(FileUploaderDirective);
                    comp = fixture.componentInstance;
                });

    }));

    it('Should check filesLoaded is true after page load', async(() => {
        comp.fileUploaderScope = {
            fileType: "image",
            options: {
                files: [

                ]
            },
            type: "product"
        };
        fixture.detectChanges();
        expect(comp.filesLoaded).toBe(true);
    }));


    it('Should check files are populated by images only', () => {
        //TODO fix this test!
        comp.fileUploaderScope = {
            fileType: "image",
            options: {
                files: mockFilesData.allFiles
            },
            type: "product"
        };
        fixture.detectChanges();
        expect(comp.files.length).toEqual(2);
    });

    it('Should check files are populated by files only', () => {
        comp.fileUploaderScope = {
            fileType: "file",
            options: {
                files: mockFilesData.allFiles
            },
            type: "product"
        };
        fixture.detectChanges();
        expect(comp.files.length).toEqual(2);
    });

    it('Should mark products as assigned if they exist in product assigned scope', () => {
        comp.fileUploaderScope = {
            fileType: "file",
            options: {
                files: mockFilesData.allFiles
            },
            type: "product"
        };
        fixture.detectChanges();
        comp.files.forEach((file) => {
            expect(file.assigned).toEqual(true);
        });
    });

    it('Should mark a file as assigned on click', () => {
        comp.fileUploaderScope = {
            fileType: "file",
            options: {
                files: []
            },
            type: "product"
        };
        fixture.detectChanges();

        let productToClick = fixture.nativeElement.querySelector('.image-file-wrap .file');
        expect(comp.files[0].assigned).not.toBeDefined();

        productToClick.dispatchEvent(new Event('click'));

    });
});

在上一次测试中，当它独立运行时，测试运行正常。这是预期的，是正确的结果。正如您所看到的，它检查是否在元素对象上定义了一个名为“assigned”的属性，但没有。当我通过评论其他测试而单独运行该测试时，它失败了，我得到了：

Expected true not to be defined.
Error: Expected true not to be defined.

之前的测试之一'如果产品分配范围存在，则应将产品标记为已分配'将“已分配”产品设置为true，这将在我的最终测试之前进行，因此我能想到的是我的测试模块状态不是在beforeEach中的每个测试中重建。谁能明白为什么会这样呢？

谢谢！

Angular2测试相互干扰

0 个答案: