Fix storefrontRedirect to strip trailing slashes in querying for re…

…directs (#2110)

The admin doesn't allow you to save a redirect with a trailing slash, so it should be safe to always strip it

.changeset/large-rivers-fold.md

@@ -0,0 +1,5 @@
+---
+'@shopify/hydrogen': patch
+---
+
+Fix `storefrontRedirect` to strip trailing slashes when querying for redirects. Resolves [#2090](https://github.com/Shopify/hydrogen/issues/2090)

packages/hydrogen/src/routing/redirect.test.ts

@@ -1,4 +1,4 @@
-import {describe, it, expect, vi} from 'vitest';
+import {describe, it, expect, vi, afterEach} from 'vitest';
 import type {Storefront} from '../storefront';
 import {storefrontRedirect} from './redirect';
 
@@ -10,6 +10,10 @@ describe('storefrontRedirect', () => {
     query: queryMock,
   } as unknown as Storefront;
 
+  afterEach(() => {
+    queryMock.mockReset();
+  });
+
   it('redirects to Shopify admin ', async () => {
     await expect(
       storefrontRedirect({
@@ -46,6 +50,27 @@ describe('storefrontRedirect', () => {
     });
   });
 
+  it('strips trailing slashes on the redirect query', async () => {
+    queryMock.mockResolvedValueOnce({
+      urlRedirects: {edges: [{node: {target: shopifyDomain + '/some-page'}}]},
+    });
+
+    await expect(
+      storefrontRedirect({
+        storefront: storefrontMock,
+        request: new Request('https://domain.com/some-page/'),
+      }),
+    ).resolves.toEqual(
+      new Response(null, {
+        status: 301,
+        headers: {location: shopifyDomain + '/some-page'},
+      }),
+    );
+    expect(queryMock).toHaveBeenCalledWith(expect.anything(), {
+      variables: {query: 'path:/some-page'},
+    });
+  });
+
   it('queries the SFAPI with the url lower cased', async () => {
     queryMock.mockResolvedValueOnce({
       urlRedirects: {edges: [{node: {target: shopifyDomain + '/some-page'}}]},

packages/hydrogen/src/routing/redirect.ts

@@ -59,7 +59,9 @@ export async function storefrontRedirect(
     const {urlRedirects} = await storefront.query<{
       urlRedirects: UrlRedirectConnection;
     }>(REDIRECT_QUERY, {
-      variables: {query: 'path:' + redirectFrom},
+      // The admin doesn't allow redirects to have a
+      // trailing slash, so strip them all off
+      variables: {query: 'path:' + redirectFrom.replace(/\/+$/, '')},
     });
 
     const location = urlRedirects?.edges?.[0]?.node?.target;