Fix: Custom API endpoint incorrect path encoding (@W-20091358@) - Hotfix only (#248)

* implement fix

* bump size

* address pr comments

* remove multiple slashes

Author: joeluong-sfcc

CHANGELOG.md

@@ -2,11 +2,15 @@
 
 ## v4.1.0
 
-### Enchancements
+### Enhancements
 
 - Use native node fetch available in node 18+ instead of `node-fetch` polyfill [#214](https://github.com/SalesforceCommerceCloud/commerce-sdk-isomorphic/pull/214)
 - Support subpath imports for individual APIs and named imports [#219](https://github.com/SalesforceCommerceCloud/commerce-sdk-isomorphic/pull/219)
 
+### Bug Fixes
+
+- Fix incorrect encoding of multi-segment endpoint paths in `callCustomEndpoint` [#246](https://github.com/SalesforceCommerceCloud/commerce-sdk-isomorphic/pull/246)
+
 ## v4.0.0
 
 ### API Versions

package.json

@@ -246,7 +246,7 @@
   "bundlesize": [
     {
       "path": "lib/**/*.js",
-      "maxSize": "54 kB"
+      "maxSize": "55 kB"
     },
     {
       "path": "commerce-sdk-isomorphic-with-deps.tgz",

src/static/helpers/customApi.test.ts

@@ -249,4 +249,96 @@ describe('callCustomEndpoint', () => {
       undefined
     );
   });
+
+  test('should support multi-segment paths even with special characters', async () => {
+    const {shortCode, organizationId} = clientConfig.parameters;
+    const {apiName} = options.customApiPathParameters;
+    const endpointPath = 'multi/segment/path/Special,Summer%';
+    const expectedEndpointPath = 'multi/segment/path/Special%2CSummer%25';
+
+    const nockBasePath = `https://${shortCode}.api.commercecloud.salesforce.com`;
+    const nockEndpointPath = `/custom/${apiName}/v2/organizations/${
+      organizationId as string
+    }/${expectedEndpointPath}`;
+    nock(nockBasePath).post(nockEndpointPath).query(true).reply(200);
+
+    const copyOptions = {
+      ...options,
+      customApiPathParameters: {
+        ...options.customApiPathParameters,
+        endpointPath,
+      },
+    };
+
+    const expectedUrl = `${
+      nockBasePath + nockEndpointPath
+    }?${queryParamString}`;
+    const expectedOptions = addSiteIdToOptions(copyOptions);
+
+    const expectedClientConfig = {
+      ...clientConfig,
+      baseUri:
+        'https://{shortCode}.api.commercecloud.salesforce.com/custom/{apiName}/{apiVersion}',
+    };
+
+    const doFetchSpy = jest.spyOn(fetchHelper, 'doFetch');
+    await callCustomEndpoint({
+      options: copyOptions,
+      clientConfig,
+      rawResponse: true,
+    });
+    expect(doFetchSpy).toBeCalledTimes(1);
+    expect(doFetchSpy).toBeCalledWith(
+      expectedUrl,
+      expectedOptions,
+      expectedClientConfig,
+      true
+    );
+  });
+
+  test('should normalize endpoint path with multiple slashes', async () => {
+    const {shortCode, organizationId} = clientConfig.parameters;
+    const {apiName} = options.customApiPathParameters;
+    const endpointPath = 'multi/segment///path////Special,Summer%';
+    const expectedEndpointPath = 'multi/segment/path/Special%2CSummer%25';
+
+    const nockBasePath = `https://${shortCode}.api.commercecloud.salesforce.com`;
+    const nockEndpointPath = `/custom/${apiName}/v2/organizations/${
+      organizationId as string
+    }/${expectedEndpointPath}`;
+    nock(nockBasePath).post(nockEndpointPath).query(true).reply(200);
+
+    const copyOptions = {
+      ...options,
+      customApiPathParameters: {
+        ...options.customApiPathParameters,
+        endpointPath,
+      },
+    };
+
+    const expectedUrl = `${
+      nockBasePath + nockEndpointPath
+    }?${queryParamString}`;
+    const expectedOptions = addSiteIdToOptions(copyOptions);
+
+    const expectedClientConfig = {
+      ...clientConfig,
+      baseUri:
+        'https://{shortCode}.api.commercecloud.salesforce.com/custom/{apiName}/{apiVersion}',
+    };
+
+    const doFetchSpy = jest.spyOn(fetchHelper, 'doFetch');
+    await callCustomEndpoint({
+      options: copyOptions,
+      clientConfig,
+      rawResponse: true,
+    });
+    expect(doFetchSpy).toBeCalledTimes(1);
+    expect(doFetchSpy).toBeCalledWith(
+      expectedUrl,
+      expectedOptions,
+      expectedClientConfig,
+      true
+    );
+  });
 });

src/static/helpers/customApi.ts

@@ -134,11 +134,37 @@ export const callCustomEndpoint = async (args: {
     };
   }
 
+  const currentEndpointPath = (options?.customApiPathParameters?.endpointPath ||
+    clientConfig.parameters?.endpointPath) as string;
+  let newEndpointPath = currentEndpointPath;
+  const endpointPathSegments = {} as Record<string, string>;
+
+  // Normalize and template the endpointPath so each segment is encoded as a path param.
+  // Example:
+  //    currentEndpointPath: "action/categories/Special,Summer" ->
+  //    endpointPathParams: { endpointPathSegment0: "action", endpointPathSegment1: "categories", endpointPathSegment2: "Special,Summer" }
+  //    newEndpointPath: "{endpointPathSegment0}/{endpointPathSegment1}/{endpointPathSegment2}/"
+  // The TemplateURL will then encode the path parameters and construct the URL with the encoded path parameters
+  // The resulting endpointPath will be: "actions/categories/Special%2CSummer"
+  if (currentEndpointPath.includes('/')) {
+    // Normalize endpoint path by removing multiple consecutive slashes
+    const segments = currentEndpointPath.split('/').filter(segment => segment !== '');
+    newEndpointPath = '';
+    segments.forEach((segment: string, index: number) => {
+      const key = `endpointPathSegment${index}`;
+      endpointPathSegments[key] = segment;
+      newEndpointPath += `{${key}}/`;
+    });
+    // Remove the trailing slash added after the last segment
+    // as TemplateURL does not expect a trailing slash
+    newEndpointPath = newEndpointPath.slice(0, -1);
+  }
+
   const url = new TemplateURL(
-    '/organizations/{organizationId}/{endpointPath}',
+    `/organizations/{organizationId}/${newEndpointPath}`,
     clientConfigCopy.baseUri as string,
     {
-      pathParams: pathParams as PathParameters,
+      pathParams: {...pathParams, ...endpointPathSegments} as PathParameters,
       queryParams: optionsCopy.parameters,
       origin: clientConfigCopy.proxy,
     }