Я заменяю карму на шутку, и когда я создал все необходимые файлы и настройки, которые вы можете увидеть ниже.Когда я выполнил 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 на «узел», он выглядел нормально, но я думаю, что это не очень хорошее решение, когда это не проект службы узла.
/ 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;
});
});