joeluong-sfcc
commented
7 months ago Hey @AdamAnSubtractM, thanks for creating this issue. For context, the PWA Kit makes SCAPI calls through the commerce-sdk-isomorphic, which is essentially a javascript library that makes calling SCAPI easy. Previously with the package, if you passed in an invalid query parameter, it would be filtered out under the hood without the user knowing. We recently added support for custom query parameters to the commerce-sdk-isomorphic package, and as part of that change, we explicitly notify the user if an invalid query param is passed with a warning.
The PWA Kit previously passed on clientId, currency, and locale to all SDK calls, which are invalid query parameters for certain endpoints, but that was resolved with this PR: https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1655. That change hasn't been released yet, but once it is, those warnings should disappear. The warnings are more of a nuisance than originally anticipated, so moving forward we'll consider either removing this warning entirely or potentially introducing a toggle switch for disabling warnings.
tl;dr: Once the new version of @salesforce/commerce-sdk-react gets released, these warnings no longer appear
Summary
Prior to "Extensibility", when running the Jest tests (
npm run test), a warning would throw for each test stating the following:Now with "Extensibility" in place, running
npm run testfrom our repo does not run the tests on the retail-react-app components as those are now in a package, however, if you implement Jest testing by extending the@salesforce/retail-react-appjest and babel configs, you getting this warning for each component you have tests set up for.Steps To Reproduce
Reproducing prior to "Extensibility"
pwa-kit-3.3.0directory you extracted, type:cd packages/template-retail-react-app && npm i && npm run testReproducing with the latest version of
pwa-kit-create-appnpx @salesforce/pwa-kit-create-app --preset "retail-react-app"cd retail-react-app)babel.config.js(this will allow jest to use the right runtime. No need to install extra dependencies)const configs = { // base config from Salesforce PWA Kit ...base, default: { ...base.default, env: { ...base.default.env, test: { ...base.default.env.test, presets: ['@babel/preset-env', ['@babel/preset-react', {runtime: 'automatic'}]], plugins: ['babel-plugin-dynamic-import-node-babel-7'] } } } } module.exports = configs.default
const base = require('@salesforce/retail-react-app/jest.config.js') const path = require('path')
// extend/override config below const configs = { // base config from Salesforce PWA Kit ...base, collectCoverage: false, collectCoverageFrom: [ ...base.collectCoverageFrom, 'app//*.{js,jsx,ts,tsx}', 'non-pwa/*/.{js,jsx,ts,tsx}', '!worker//.{js,jsx,ts,tsx}', 'scripts/generator/.{js,jsx,ts,tsx}', '!app/pages/test-container/*/.{js,jsx,ts,tsx}', '!app/types/*' ], // maps aliases for Jest to understand // if you have any special aliases for your directories, include them in moduleNameMapper moduleNameMapper: { ...base.moduleNameMapper, '^@salesforce/retail-react-app(.)$': '/node_modules/@salesforce/retail-react-app/$1',
},
roots: [''],
// directories jest will ignore
testPathIgnorePatterns: [...base.testPathIgnorePatterns, 'dist'],
// so we can use ESM with Jest as Jest is built on commonjs
transform: {
'\.[jt]sx?$': ['babel-jest', {configFile: path.resolve(__dirname, 'babel.config.js')}]
},
transformIgnorePatterns: []
}
module.exports = configs