I have been getting the below error whenever i run jest jest --coverage
;
Stackoverflow says that i can't add images to my post yet. So please open the link to view the error. Thanks
Click here to view error's screenshot
Code and configurations are below:
Package.json
"fetch-mock": "^9.9.0",
"fetch-mock-jest": "^1.5.1",
"jest": "26.6.3",
"@types/jest": "26.0.23",
"babel-jest": "^27.2.0",
"eslint-plugin-jest": "^23.20.0",
"ts-jest": "^27.0.5",
Jest Configuration
"jest": {
"preset": "ts-jest",
"transform": {
"^.+\.(ts|tsx)?$": "ts-jest",
"^.+\.(js|jsx)$": "babel-jest"
},
"testRegex": "./test/.*.(js|jsx)$",
"rootDir": ".",
"moduleNameMapper": {
"\.css$": "identity-obj-proxy"
},
"globals": {
"ts-jest": {
"isolatedModules": true
}
},
"moduleDirectories": [
"js",
".",
"node_modules"
]
},
example.test.js
import 'regenerator-runtime/runtime';
import configureMockStore from 'redux-mock-store';
import thunk from 'redux-thunk';
import fetchMock from 'fetch-mock';
** It shows error on above line **
import { getEntityItems } from '../../src/actions/entity1';
const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);
global.requestURI = '';
const store = mockStore({});
const root = '/endpoint';
const testHelper = (description, path, query_params = {}) = {
it(description, () => {
fetchMock.getOnce(
path, { body: { interactions: [] }, headers: { 'content-type': 'application/json' } }
);
return store.dispatch(getEntityItems(query_params)).then(() => {
expect(fetchMock.called(path)).toBe(true);
});
});
};
describe('GET entites query parameters', () => {
afterEach(fetchMock.reset());
testHelper('accepts an array of ids', root.concat('&ids=0,1,2'), { ids: [0, 1, 2] });
});
Earlier the project was written in javascript and this code was running fine but now its migrated to typescript. Running tests throws the above error. I have been trying to solve this; No Luck :(
I also tried using fetch-mock-jest but couldn't get it working. If anyone can help me with the solution. It would be great! Thanks in Advance :)
Debugging Update
When i tried to debug fetch-mock, to see what's happening. Got few insights.
When i click on debug at line 1, it opens debug/index.js
as we can
see in the screenshot 1:
Screenshot 1
When i debug the test in actual using VSCode's Debugger, i saw, the value of debug
variable present at line 1 is empty object i.e. {}
(which is astonishing) and can be seen in the screenshot 2:
Screenshot 2
I am still not able to figure it why the code isn't able to import the package content when it is actually running. :(