As we begin migrating to RTK Query for API calls, we will need a means of mocking API endpoints for testing that works well with RTKQ. Mock Service Worker is an API mocking library that uses the Service Worker API to intercept actual requests and is recommended for use with RTKQ. https://mswjs.io/docs/ Some additional justification from the creator of RKT Query that explains why we would not want to simply continue mocking our API endpoints using Jest: ``` I wouldn't use jest mocking. I would mock the API. The reason for this being is that your mocks will assume certain return values from the RTKQ hook - and if your assumptions are wrong, you might have a nice green running test, but in reality your app will still fail. An example of this would be using skip and not checking for isUninitialized - since that case will not come up if you are not using skip and you might just assume that you will only ever see isLoading, isSuccess and isError cases in your component. It's a perfectly valid assumption in many cases, but not always true. Mocking RTKQ would hide the resulting bug behind green tests. Instead, I would recommend using something like mock service worker to just mock your api endpoints and let RTKQ do it's work. That is how we are testing RTKQ ourselved in our own tests - you are welcome to take a ook there: RTKQ tests. ``` https://stackoverflow.com/a/70313785
108 lines
3.5 KiB
JSON
108 lines
3.5 KiB
JSON
{
|
|
"name": "image-builder",
|
|
"version": "1.1.0",
|
|
"private": false,
|
|
"engines": {
|
|
"node": ">=16.0.0",
|
|
"npm": ">=7.0.0"
|
|
},
|
|
"dependencies": {
|
|
"@data-driven-forms/pf4-component-mapper": "3.16.10",
|
|
"@data-driven-forms/react-form-renderer": "3.20.0",
|
|
"@patternfly/patternfly": "4.210.2",
|
|
"@patternfly/react-core": "4.267.6",
|
|
"@patternfly/react-table": "4.112.6",
|
|
"@redhat-cloud-services/frontend-components": "3.9.25",
|
|
"@redhat-cloud-services/frontend-components-notifications": "3.2.12",
|
|
"@redhat-cloud-services/frontend-components-utilities": "3.3.11",
|
|
"@reduxjs/toolkit": "^1.9.1",
|
|
"@scalprum/react-core": "^0.2.8",
|
|
"classnames": "2.3.2",
|
|
"lodash": "4.17.21",
|
|
"react": "17.0.2",
|
|
"react-dom": "17.0.2",
|
|
"react-redux": "8.0.5",
|
|
"react-router-dom": "6.6.2",
|
|
"redux": "4.2.0",
|
|
"redux-promise-middleware": "6.1.3"
|
|
},
|
|
"jest": {
|
|
"coverageDirectory": "./coverage/",
|
|
"collectCoverage": true,
|
|
"collectCoverageFrom": [
|
|
"src/**/*.js",
|
|
"!src/**/stories/*",
|
|
"!src/entry-dev.js"
|
|
],
|
|
"testEnvironment": "jsdom",
|
|
"globals": {
|
|
"COMMITHASH": "dummy"
|
|
},
|
|
"roots": [
|
|
"<rootDir>/src/"
|
|
],
|
|
"moduleNameMapper": {
|
|
"\\.(css|scss)$": "identity-obj-proxy"
|
|
},
|
|
"setupFiles": [
|
|
"jest-canvas-mock"
|
|
]
|
|
},
|
|
"devDependencies": {
|
|
"@babel/core": "7.20.12",
|
|
"@babel/eslint-parser": "^7.17.0",
|
|
"@babel/plugin-proposal-object-rest-spread": "7.20.2",
|
|
"@babel/plugin-transform-runtime": "7.19.6",
|
|
"@babel/preset-env": "7.20.2",
|
|
"@babel/preset-react": "7.18.6",
|
|
"@redhat-cloud-services/eslint-config-redhat-cloud-services": "1.2.6",
|
|
"@redhat-cloud-services/frontend-components-config": "4.6.36",
|
|
"@testing-library/dom": "8.18.1",
|
|
"@testing-library/jest-dom": "5.16.5",
|
|
"@testing-library/react": "12.1.5",
|
|
"@testing-library/user-event": "13.5.0",
|
|
"babel-jest": "29.3.1",
|
|
"babel-plugin-dual-import": "1.2.1",
|
|
"babel-plugin-transform-imports": "2.0.0",
|
|
"css-loader": "6.7.3",
|
|
"eslint": "8.32.0",
|
|
"eslint-plugin-import": "2.27.5",
|
|
"eslint-plugin-jest-dom": "4.0.3",
|
|
"eslint-plugin-react": "7.32.1",
|
|
"eslint-plugin-testing-library": "5.10.1",
|
|
"git-revision-webpack-plugin": "5.0.0",
|
|
"history": "5.3.0",
|
|
"identity-obj-proxy": "3.0.0",
|
|
"jest": "29.4.1",
|
|
"jest-environment-jsdom": "29.4.1",
|
|
"jest-canvas-mock": "2.4.0",
|
|
"msw": "^1.0.0",
|
|
"npm-run-all": "4.1.5",
|
|
"postcss-scss": "4.0.6",
|
|
"prop-types": "15.8.1",
|
|
"redux-mock-store": "1.5.4",
|
|
"sass": "1.57.1",
|
|
"sass-loader": "13.0.2",
|
|
"stylelint": "14.16.1",
|
|
"stylelint-config-recommended-scss": "6.0.0",
|
|
"uuid": "9.0.0",
|
|
"webpack-bundle-analyzer": "4.7.0"
|
|
},
|
|
"scripts": {
|
|
"lint": "npm-run-all lint:*",
|
|
"lint:js": "eslint config src",
|
|
"lint:js:fix": "eslint config src --fix",
|
|
"lint:sass": "stylelint 'src/**/*.scss' --config .stylelintrc.json",
|
|
"prod-beta": "BETA=true PROXY=true webpack serve --config config/dev.webpack.config.js",
|
|
"prod-stable": "PROXY=true webpack serve --config config/dev.webpack.config.js",
|
|
"stage-stable": "STAGE=true npm run prod-stable",
|
|
"stage-beta": "STAGE=true npm run prod-beta",
|
|
"test": "TZ=UTC jest --verbose --no-cache",
|
|
"test:single": "jest --verbose -w 1",
|
|
"build": "webpack --config config/prod.webpack.config.js",
|
|
"verify": "npm-run-all build lint test"
|
|
},
|
|
"insights": {
|
|
"appname": "image-builder"
|
|
}
|
|
}
|