@salesforce/pwa-kit-react-sdk 3.17.0 → 3.17.1

package/CHANGELOG.md

@@ -1,3 +1,6 @@
+## v3.17.1 (Mar 20, 2026)
+- Add base path prefix to support multiple MRT environments under 1 domain [#3614](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3614)
+
 ## v3.17.0 (Mar 12, 2026)
 - Update test setup for Jest 29 compatibility [#3663](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3663)
 - Add Node 24 support. Drop Node 16 support [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/pwa-kit-react-sdk",
-  "version": "3.17.0",
+  "version": "3.17.1",
   "description": "A library that supports the isomorphic React rendering pipeline for Commerce Cloud Managed Runtime apps",
   "homepage": "https://github.com/SalesforceCommerceCloud/pwa-kit/tree/develop/packages/pwa-kit-react-sdk#readme",
   "bugs": {
@@ -43,7 +43,7 @@
     "@opentelemetry/resources": "^1.15.1",
     "@opentelemetry/sdk-trace-base": "^1.15.1",
     "@opentelemetry/sdk-trace-node": "^1.15.1",
-    "@salesforce/pwa-kit-runtime": "3.17.0",
+    "@salesforce/pwa-kit-runtime": "3.17.1",
     "@tanstack/react-query": "^4.28.0",
     "cross-env": "^5.2.1",
     "event-emitter": "^0.3.5",
@@ -57,11 +57,11 @@
   "devDependencies": {
     "@h4ad/serverless-adapter": "4.4.0",
     "@loadable/component": "^5.15.3",
-    "@salesforce/pwa-kit-dev": "3.17.0",
+    "@salesforce/pwa-kit-dev": "3.17.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "14.4.3",
-    "internal-lib-build": "3.17.0",
+    "internal-lib-build": "3.17.1",
     "node-html-parser": "^3.3.6",
     "nodemon": "^2.0.22",
     "react": "^18.2.0",
@@ -86,5 +86,5 @@
   "publishConfig": {
     "directory": "dist"
   },
-  "gitHead": "6d0cfd2308b9f25d8badd722469074889bd3b891"
+  "gitHead": "d09ed57f84432913ab3e55e3073802d319c5dc3c"
 }

package/ssr/browser/main.js

@@ -16,6 +16,7 @@ var _component = require("@loadable/component");
 var _uuidv = require("../../utils/uuidv4.client");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _loggerInstance = _interopRequireDefault(require("../../utils/logger-instance"));
+var _utils = require("../universal/utils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /*
@@ -49,10 +50,12 @@ const OuterApp = ({
 }) => {
   const AppConfig = (0, _compatibility.getAppConfig)();
   const isInitialPageRef = (0, _react.useRef)(true);
+  const routerBasename = (0, _utils.getRouterBasePath)() || undefined;
   return /*#__PURE__*/_react.default.createElement(_contexts.ServerContext.Provider, {
     value: {}
   }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, {
-    ref: onHydrate
+    ref: onHydrate,
+    basename: routerBasename
   }, /*#__PURE__*/_react.default.createElement(_contexts.CorrelationIdProvider, {
     correlationId: () => {
       // If we are hydrating an error page use the server correlation id.

package/ssr/server/react-rendering.js

@@ -282,6 +282,7 @@ const OuterApp = ({
   location
 }) => {
   const AppConfig = (0, _compatibility.getAppConfig)();
+  const routerBasename = (0, _utils.getRouterBasePath)() || undefined;
   return /*#__PURE__*/_react.default.createElement(_contexts.ServerContext.Provider, {
     value: {
       req,
@@ -289,7 +290,8 @@ const OuterApp = ({
     }
   }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.StaticRouter, {
     location: location,
-    context: routerContext
+    context: routerContext,
+    basename: routerBasename
   }, /*#__PURE__*/_react.default.createElement(_contexts.CorrelationIdProvider, {
     correlationId: res.locals.requestId,
     resetOnPageChange: false
@@ -383,6 +385,7 @@ const renderApp = args => {
     __CONFIG__: config,
     __PRELOADED_STATE__: appState,
     __ERROR__: error,
+    __MRT_ENV_BASE_PATH__: process.env.MRT_ENV_BASE_PATH || '',
     // `window.Progressive` has a long history at Mobify and some
     // client-side code depends on it. Maintain its name out of tradition.
     Progressive: getWindowProgressive(req, res)

package/ssr/universal/components/refresh/index.js

@@ -8,6 +8,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactRouterDom = require("react-router-dom");
 var _reactQuery = require("@tanstack/react-query");
 var _loggerInstance = _interopRequireDefault(require("../../../../utils/logger-instance"));
+var _utils = require("../../utils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
@@ -58,6 +59,12 @@ const Refresh = () => {
           });
           referrer = '/';
         }
+
+        // Remove the base path before navigating (React Router will add it back)
+        const basePath = (0, _utils.getRouterBasePath)();
+        if (basePath && (referrer.startsWith(basePath + '/') || referrer === basePath)) {
+          referrer = referrer.slice(basePath.length) || '/';
+        }
         history.replace(referrer);
       });
       return function refetchData() {

package/ssr/universal/components/refresh/index.test.js

@@ -5,6 +5,7 @@ var _react = require("@testing-library/react");
 var _react2 = _interopRequireDefault(require("react"));
 var _reactRouterDom = require("react-router-dom");
 var _index = _interopRequireDefault(require("./index"));
+var _utils = require("../../utils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
 function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; } /*
@@ -34,6 +35,9 @@ jest.mock('@tanstack/react-query', () => {
     }))
   };
 });
+jest.mock('../../utils', () => ({
+  getRouterBasePath: jest.fn(() => '')
+}));
 test('renders a loading spinner initially', () => {
   (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_index.default, null));
   expect(_react.screen.getByTestId('loading-spinner')).toBeInTheDocument();
@@ -75,4 +79,43 @@ test('navigate to homepage if `referrer` search param cannot be found in the pag
     expect(console.warn).toHaveBeenCalled();
     expect((0, _reactRouterDom.useHistory)().replace).toHaveBeenCalledWith('/');
   });
+}));
+test('strips base path from referrer when basePath is set', /*#__PURE__*/_asyncToGenerator(function* () {
+  const basePath = '/my-base';
+  _utils.getRouterBasePath.mockReturnValue(basePath);
+  _reactRouterDom.useLocation.mockImplementationOnce(() => ({
+    search: `?referrer=${encodeURIComponent('/my-base/some-page')}`
+  }));
+  (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_index.default, null));
+  jest.runAllTimers();
+  yield (0, _react.waitFor)(() => {
+    expect((0, _reactRouterDom.useHistory)().replace).toHaveBeenCalledWith('/some-page');
+  });
+  _utils.getRouterBasePath.mockReturnValue('');
+}));
+test('strips base path from referrer when referrer equals basePath exactly', /*#__PURE__*/_asyncToGenerator(function* () {
+  const basePath = '/my-base';
+  _utils.getRouterBasePath.mockReturnValue(basePath);
+  _reactRouterDom.useLocation.mockImplementationOnce(() => ({
+    search: `?referrer=${encodeURIComponent('/my-base')}`
+  }));
+  (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_index.default, null));
+  jest.runAllTimers();
+  yield (0, _react.waitFor)(() => {
+    expect((0, _reactRouterDom.useHistory)().replace).toHaveBeenCalledWith('/');
+  });
+  _utils.getRouterBasePath.mockReturnValue('');
+}));
+test('does not strip base path when referrer does not start with basePath', /*#__PURE__*/_asyncToGenerator(function* () {
+  const basePath = '/my-base';
+  _utils.getRouterBasePath.mockReturnValue(basePath);
+  _reactRouterDom.useLocation.mockImplementationOnce(() => ({
+    search: `?referrer=${encodeURIComponent('/other-path/page')}`
+  }));
+  (0, _react.render)(/*#__PURE__*/_react2.default.createElement(_index.default, null));
+  jest.runAllTimers();
+  yield (0, _react.waitFor)(() => {
+    expect((0, _reactRouterDom.useHistory)().replace).toHaveBeenCalledWith('/other-path/page');
+  });
+  _utils.getRouterBasePath.mockReturnValue('');
 }));

package/ssr/universal/utils.client.test.js

@@ -1,6 +1,8 @@
 "use strict";
 
 var utils = _interopRequireWildcard(require("./utils"));
+var _ssrConfig = require("@salesforce/pwa-kit-runtime/utils/ssr-config");
+var _ssrNamespacePaths = require("@salesforce/pwa-kit-runtime/utils/ssr-namespace-paths");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /*
  * Copyright (c) 2021, salesforce.com, inc.
@@ -9,6 +11,12 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
 
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-config', () => ({
+  getConfig: jest.fn()
+}));
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-namespace-paths', () => ({
+  getEnvBasePath: jest.fn()
+}));
 describe('getProxyConfigs (client-side)', () => {
   const configs = [{
     foo: 'bar'
@@ -26,6 +34,16 @@ describe('getProxyConfigs (client-side)', () => {
   test('should return proxy configs set on window.Progressive', () => {
     expect(utils.getProxyConfigs()).toEqual(configs);
   });
+  test('should return empty array when ssrOptions is missing', () => {
+    global.Progressive = {};
+    expect(utils.getProxyConfigs()).toEqual([]);
+  });
+  test('should return empty array when proxyConfigs is missing', () => {
+    global.Progressive = {
+      ssrOptions: {}
+    };
+    expect(utils.getProxyConfigs()).toEqual([]);
+  });
 });
 describe('getAssetUrl (client-side)', () => {
   beforeEach(() => {
@@ -42,4 +60,47 @@ describe('getAssetUrl (client-side)', () => {
   test('should return origin + path', () => {
     expect(utils.getAssetUrl('/path')).toBe('test.com/path');
   });
+});
+describe('getRouterBasePath (client-side)', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  test('should return base path when showBasePath is true', () => {
+    const mockBasePath = '/test-base';
+    _ssrNamespacePaths.getEnvBasePath.mockReturnValue(mockBasePath);
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {
+          showBasePath: true
+        }
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe(mockBasePath);
+  });
+  test('should return empty string when showBasePath is undefined', () => {
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {}
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe('');
+  });
+  test('should return empty string when showBasePath is false', () => {
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {
+          showBasePath: false
+        }
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe('');
+  });
+  test('should return empty string when app config is missing', () => {
+    _ssrConfig.getConfig.mockReturnValue({});
+    expect(utils.getRouterBasePath()).toBe('');
+  });
+  test('should return empty string when getConfig returns null', () => {
+    _ssrConfig.getConfig.mockReturnValue(null);
+    expect(utils.getRouterBasePath()).toBe('');
+  });
 });

package/ssr/universal/utils.js

@@ -3,9 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getProxyConfigs = exports.getAssetUrl = void 0;
+exports.getRouterBasePath = exports.getProxyConfigs = exports.getAssetUrl = void 0;
 var _ssrShared = require("@salesforce/pwa-kit-runtime/utils/ssr-shared");
 var _ssrNamespacePaths = require("@salesforce/pwa-kit-runtime/utils/ssr-namespace-paths");
+var _ssrConfig = require("@salesforce/pwa-kit-runtime/utils/ssr-config");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -58,4 +59,24 @@ const getProxyConfigs = () => {
   // Clone to avoid accidental mutation of important configuration variables.
   return configs.map(config => _objectSpread({}, config));
 };
-exports.getProxyConfigs = getProxyConfigs;
+
+/**
+ * Returns the base path (defined in config.ssrParameters.envBasePath)
+ * for React Router routes when showBasePath is enabled in the app config.
+ *
+ * This function should be used when working with a React Router route
+ * (The route is defined in routes.jsx).
+ *
+ * Use getEnvBasePath (pwa-kit-runtime) if you are working with an express route\
+ * (The route is defined in ssr.js).
+ *
+ * @returns {string} - The base path if showBasePath is true, otherwise an empty string
+ */
+exports.getProxyConfigs = getProxyConfigs;
+const getRouterBasePath = () => {
+  var _config$app, _config$app$url;
+  const config = (0, _ssrConfig.getConfig)();
+  const showBasePath = (config === null || config === void 0 ? void 0 : (_config$app = config.app) === null || _config$app === void 0 ? void 0 : (_config$app$url = _config$app.url) === null || _config$app$url === void 0 ? void 0 : _config$app$url.showBasePath) === true;
+  return showBasePath ? (0, _ssrNamespacePaths.getEnvBasePath)() : '';
+};
+exports.getRouterBasePath = getRouterBasePath;

package/ssr/universal/utils.server.test.js

@@ -2,6 +2,8 @@
 
 var utils = _interopRequireWildcard(require("./utils"));
 var _ssrShared = require("@salesforce/pwa-kit-runtime/utils/ssr-shared");
+var _ssrConfig = require("@salesforce/pwa-kit-runtime/utils/ssr-config");
+var _ssrNamespacePaths = require("@salesforce/pwa-kit-runtime/utils/ssr-namespace-paths");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * @jest-environment node
@@ -16,8 +18,53 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 // conflicts with the eslint header rule.
 /* eslint-disable header/header */
 
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-config', () => ({
+  getConfig: jest.fn()
+}));
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-namespace-paths', () => ({
+  getEnvBasePath: jest.fn()
+}));
 describe('getProxyConfigs (server-side)', () => {
   test('should return the currently used proxy configs', () => {
     expect(utils.getProxyConfigs()).toEqual(_ssrShared.proxyConfigs);
   });
+});
+describe('getRouterBasePath (server-side)', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+  test('should return base path when showBasePath is true', () => {
+    const mockBasePath = '/test-base';
+    _ssrNamespacePaths.getEnvBasePath.mockReturnValue(mockBasePath);
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {
+          showBasePath: true
+        }
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe(mockBasePath);
+  });
+  test('should return empty string when showBasePath is undefined', () => {
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {}
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe('');
+  });
+  test('should return empty string when showBasePath is false', () => {
+    _ssrConfig.getConfig.mockReturnValue({
+      app: {
+        url: {
+          showBasePath: false
+        }
+      }
+    });
+    expect(utils.getRouterBasePath()).toBe('');
+  });
+  test('should return empty string when app config is missing', () => {
+    _ssrConfig.getConfig.mockReturnValue({});
+    expect(utils.getRouterBasePath()).toBe('');
+  });
 });