Fix unwanted basePath removal if base path is a substring

Author: vcua-mobify

packages/pwa-kit-runtime/CHANGELOG.md

@@ -1,6 +1,7 @@
 ## v3.16.0-dev (Dec 17, 2025)
 - Move envBasePath into ssrParameters [#3590](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3590)
 - Support adding base paths to shopper facing URLs [#3615](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3615)
+- Update storefront preview to support base paths [#3666](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3666)
 
 ## v3.15.0 (Dec 17, 2025)
 - Fix multiple set-cookie headers [#3508](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3508)

packages/pwa-kit-runtime/src/ssr/server/build-remote-server.js

@@ -602,8 +602,10 @@ export const RemoteServerFactory = {
                 return next()
             }
 
-            // For other routes, only proceed if path actually starts with base path
-            if (!req.path.startsWith(basePath)) {
+            // For other routes, only proceed if path equals basePath or path starts with basePath + '/'
+            const pathMatchesBasePath =
+                req.path === basePath || req.path.startsWith(basePath + '/')
+            if (!pathMatchesBasePath) {
                 return next()
             }
 

packages/template-retail-react-app/app/utils/site-utils.js

@@ -95,6 +95,20 @@ export const getSiteByReference = (siteRef) => {
     )
 }
 
+/**
+ * Remove the base path from a path string only when path equals basePath or path starts with basePath + '/'.
+ * @param {string} path - the path to strip
+ * @param {string} basePath - the base path to remove
+ * @returns {string} the path with base path removed, or the original path
+ */
+export const removeBasePathFromPath = (path, basePath) => {
+    if (!basePath) return path
+    if (path.startsWith(basePath + '/') || path === basePath) {
+        return path.substring(basePath.length) || '/'
+    }
+    return path
+}
+
 /**
  * This function return the identifiers (site and locale) from the given url
  * The site will always go before locale if both of them are presented in the pathname
@@ -107,9 +121,7 @@ export const getParamsFromPath = (path) => {
     // Remove the base path from the pathname if present since
     // it shifts the location of the site and locale in the pathname
     const basePath = getRouterBasePath()
-    if (basePath && pathname.startsWith(basePath)) {
-        pathname = pathname.substring(basePath.length)
-    }
+    pathname = removeBasePathFromPath(pathname, basePath)
 
     const config = getConfig()
     const {pathMatcher, searchMatcherForSite, searchMatcherForLocale} = getConfigMatcher(config)

packages/template-retail-react-app/app/utils/site-utils.test.js

@@ -16,7 +16,8 @@ import {getRouterBasePath} from '@salesforce/pwa-kit-react-sdk/ssr/universal/uti
 import mockConfig from '@salesforce/retail-react-app/config/mocks/default'
 import {
     getParamsFromPath,
-    resolveLocaleFromUrl
+    resolveLocaleFromUrl,
+    removeBasePathFromPath
 } from '@salesforce/retail-react-app/app/utils/site-utils'
 jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-config', () => {
     const origin = jest.requireActual('@salesforce/pwa-kit-react-sdk/ssr/universal/utils')
@@ -341,6 +342,43 @@ describe('getParamsFromPath', function () {
             const result = getParamsFromPath(path)
             expect(result).toEqual({siteRef: 'us', localeRef: 'en-US'})
         })
+
+        test('should not strip when path has basePath only as substring (e.g. /shop vs /shopping/cart)', () => {
+            const basePath = '/shop'
+            getRouterBasePath.mockReturnValue(basePath)
+            getConfig.mockImplementation(() => ({
+                ...mockConfig,
+                app: {
+                    ...mockConfig.app,
+                    url: {
+                        ...mockConfig.app.url,
+                        showBasePath: true
+                    }
+                }
+            }))
+
+            const result = getParamsFromPath('/shopping/cart')
+            expect(result).toBeDefined()
+        })
+    })
+})
+
+describe('removeBasePathFromPath', () => {
+    test('removes when path starts with basePath + "/"', () => {
+        expect(removeBasePathFromPath('/shop/cart', '/shop')).toBe('/cart')
+        expect(removeBasePathFromPath('/test-base/uk/en-GB/foo', '/test-base')).toBe(
+            '/uk/en-GB/foo'
+        )
+    })
+    test('removes to "/" when path exactly equals basePath', () => {
+        expect(removeBasePathFromPath('/shop', '/shop')).toBe('/')
+    })
+    test('does not remove when basePath is only a substring (e.g. /shop vs /shopping/cart)', () => {
+        expect(removeBasePathFromPath('/shopping/cart', '/shop')).toBe('/shopping/cart')
+        expect(removeBasePathFromPath('/shopping', '/shop')).toBe('/shopping')
+    })
+    test('returns path unchanged when basePath is empty', () => {
+        expect(removeBasePathFromPath('/any/path', '')).toBe('/any/path')
     })
 })
 

packages/template-retail-react-app/app/utils/url.js

@@ -9,7 +9,8 @@ import {
     getLocaleByReference,
     getParamsFromPath,
     getDefaultSite,
-    getSiteByReference
+    getSiteByReference,
+    removeBasePathFromPath
 } from '@salesforce/retail-react-app/app/utils/site-utils'
 import {HOME_HREF, urlPartPositions} from '@salesforce/retail-react-app/app/constants'
 import {getRouterBasePath} from '@salesforce/pwa-kit-react-sdk/ssr/universal/utils'
@@ -121,9 +122,7 @@ export const getPathWithLocale = (shortCode, buildUrl, opts = {}) => {
 
     // sanitize the base path from current url if existing
     const basePath = getRouterBasePath()
-    if (basePath && pathname.startsWith(basePath)) {
-        pathname = pathname.substring(basePath.length)
-    }
+    pathname = removeBasePathFromPath(pathname, basePath)
 
     // sanitize the site from current url if existing
     if (siteRef) {
@@ -269,9 +268,7 @@ export const removeSiteLocaleFromPath = (pathName = '') => {
     let {siteRef, localeRef} = getParamsFromPath(pathName)
 
     const basePath = getRouterBasePath()
-    if (basePath && pathName.startsWith(basePath)) {
-        pathName = pathName.substring(basePath.length)
-    }
+    pathName = removeBasePathFromPath(pathName, basePath)
 
     // remove the site alias from the current pathName
     if (siteRef) {

packages/template-retail-react-app/app/utils/url.test.js

@@ -201,6 +201,18 @@ describe('getPathWithLocale', () => {
         // Caller uses basePath + path for window.location or full href
         expect(`${basePath}${path}`).toBe(`${basePath}/uk/fr/category/newarrivals-womens`)
     })
+
+    test('getPathWithLocale does not strip when path has basePath only as substring (e.g. /shop vs /shopping/cart)', () => {
+        const basePath = '/shop'
+        getRouterBasePath.mockReturnValue(basePath)
+
+        const location = new URL('http://localhost:3000/shopping/cart')
+        const buildUrl = createUrlTemplate(mockConfig.app, 'uk', 'en-GB')
+
+        const path = getPathWithLocale('en-GB', buildUrl, {location})
+        expect(path).toContain('/shopping')
+        expect(path).not.toBe('/cart')
+    })
 })
 
 describe('createUrlTemplate tests', () => {