Setting up Jest with React and Phaser

npm i --dev jest babel-jest @babel/preset-env @babel/preset-react react-test-renderer
Syntax Error for require
const presets = [
[
"@babel/env",
{
targets: {
browsers: [">0.25%", "not ie 11", "not op_mini all"]
},
modules: false
}
],
"@babel/preset-react"
];
const plugins = [
"@babel/plugin-proposal-class-properties",
"@babel/plugin-transform-modules-commonjs"
];
module.exports = { presets, plugins };
Cannot set property ‘fillStyle’ of null on the Phaser import
"jest": {
"setupFiles": ["jest-canvas-mock"]
}
An invalid token error for our png
"jest": {
"transform": {
"^.+\\.jsx?$": "babel-jest"
},
"setupFiles": [
"jest-canvas-mock"
],
"moduleFileExtensions": [
"js",
"jsx"
],
"moduleNameMapper": {
"\\.(css|less|sass|scss)$": "<rootDir>/test/mocks/styleMock.js",
"\\.(gif|ttf|eot|svg|png)$": "<rootDir>/test/mocks/fileMock.js"
}
}
const { config } = require("../src/index.js");test("string is a string", () => {
expect(typeof "string").toBe("string");
});
test("config is an object", () => {
expect(typeof config).toBe("object");
});
Invariant Violation for the rendered element not being attached to a DOM element
ReactDOM.render(
<App />,
document.getElementById("root") || document.createElement("div")
);

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store