如何解决无法通过jest / jsdom设置未定义错误的属性“ _eventListeners”?

时间:2019-02-06 10:23:52

标签: reactjs typescript webpack jestjs jsdom

我用玩笑代替了业力,当我创建了所有需要的文件和设置时,您可以在下面看到。当我执行npm jest时出现错误:

Test suite failed to run
TypeError: Cannot set property '_eventListeners' of undefined
at Window.close (node_modules/jsdom/lib/jsdom/browser/Window.js:475:51)

我找到了一种解决方案,可以编辑没有意义的node_modules / *文件。 当我尝试将testEnvironment切换为“ node”时,看起来不错,但是当它不是节点服务项目时,我认为这不是一个好的解决方案。

/jest.config.js

module.exports = {
    coverageReporters: [
        "html",
        "text",
        "cobertura"
    ],
    globals: {
        "ts-jest": {
            tsConfig: "tsconfig.test.json",
            babelConfig: true
        }
    },
    moduleFileExtensions: [
        "ts",
        "tsx",
        "js",
        "jsx",
        "json",
        "node",
        "d.ts",
        "scss"
    ],
    moduleNameMapper: {
        "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/test/mocks/fileMock.js",
        "\\.(css|sass|scss)$": "<rootDir>/test/mocks/styleMock.js",
        "^worker-loader!": "<rootDir>/test/mocks/workerLoaderMock.js",
        "^resize-observer-polyfill$": "<rootDir>/test/mocks/resizeObserverPolyfillMock.js",
        "applicationinsights-js": "<rootDir>/test/mocks/appInsightsMock.js"
    },
    reporters: [
        "default",
        "jest-junit"
    ],
    setupFiles: [
        "<rootDir>/test/mocks/setupJest.js"
    ],
    setupFilesAfterEnv: [
        "<rootDir>/test/mocks/matchMedia.js"
    ],
    transform: {
        "^.+\\.(js|jsx|ts|tsx|d.ts)$": "ts-jest"
    },
    testMatch: [
        "<rootDir>/test/**/*-test.tsx"
    ],
    timers: "fake"
};

/setupJest.js

global.Intl = require("intl");
global.fetch = require('jest-fetch-mock')
global.AppSettings = {
    AUTHORITY_URL: "https://auth.blah.com",
    INSTRUMENTATION_KEY: "APP_SETTINGS_KEY",
    REALTIME_URL_BASE: "https//:realtime.blah.com"
};

my-test.js

import { Tooltip } from "../../src/components/shared";
import { expect, React, shallow } from "../test-utils";

describe("Tooltip with empty properties", () => {
    const component = shallow(<Tooltip tooltipText="" />);

    it("should have no text", () => {
        expect(component.find("span.tooltip-text").text()).to.have.length(0);
    });

    it("should have 'tooltip-container' class", () => {
        expect(component.hasClass("tooltip-container")).to.be.true;
    });

    it("should have child with 'tooltip-text' class", () => {
        expect(component.childAt(0).hasClass("tooltip-text")).to.be.true;
    });
});

describe("Tooltip with set properties", () => {
    const expectedClass = "test-class";
    const expectedText = "Test tooltip text";
    const component = shallow(<Tooltip tooltipText={expectedText} className={expectedClass} />);

    it("should have the expected text", () => {
        expect(component.find("span.tooltip-text").text()).to.be.equal(expectedText);
    });

    it("should have the expected classes", () => {
        expect(component.hasClass("tooltip-container")).to.be.true;
        expect(component.hasClass(expectedClass)).to.be.true;
    });
});

0 个答案:

没有答案