Fix relative redirect

packages/next/src/client/assign-location.ts

@@ -0,0 +1,22 @@
+import { addBasePath } from './add-base-path'
+
+/**
+ * Function to correctly assign location to URL
+ *
+ * The method will add basePath, and will also correctly add location (including if it is a relative path)
+ * @param location Location that should be added to the url
+ * @param url Base URL to which the location should be assigned
+ */
+export function assignLocation(location: string, url: URL): URL {
+  if (location.startsWith('.')) {
+    const urlBase = url.origin + url.pathname
+    return new URL(
+      // In order for a relative path to be added to the current url correctly, the current url must end with a slash
+      // new URL('./relative', 'https://example.com/subdir').href -> 'https://example.com/relative'
+      // new URL('./relative', 'https://example.com/subdir/').href -> 'https://example.com/subdir/relative'
+      (urlBase.endsWith('/') ? urlBase : urlBase + '/') + location
+    )
+  }
+
+  return new URL(addBasePath(location), url.href)
+}

packages/next/src/client/components/router-reducer/reducers/server-action-reducer.ts

@@ -31,7 +31,7 @@ import {
   type ServerActionAction,
   type ServerActionMutable,
 } from '../router-reducer-types'
-import { addBasePath } from '../../../add-base-path'
+import { assignLocation } from '../../../assign-location'
 import { createHrefFromUrl } from '../create-href-from-url'
 import { handleExternalUrl } from './navigate-reducer'
 import { applyRouterStatePatchToTree } from '../apply-router-state-patch-to-tree'
@@ -129,9 +129,8 @@ async function fetchServerAction(
   }
 
   const redirectLocation = location
-    ? new URL(
-        addBasePath(location),
-        // Ensure relative redirects in Server Actions work, e.g. redirect('./somewhere-else')
+    ? assignLocation(
+        location,
         new URL(state.canonicalUrl, window.location.href)
       )
     : undefined

test/e2e/app-dir/server-actions-relative-redirect/app/subdir/page.tsx

@@ -0,0 +1,32 @@
+'use client'
+
+import { startTransition } from 'react'
+import { absoluteRedirect, relativeRedirect } from '../actions'
+
+export default function Page() {
+  return (
+    <>
+      <p>hello subdir page</p>
+      <button
+        onClick={async () => {
+          startTransition(async () => {
+            await relativeRedirect()
+          })
+        }}
+        id="relative-subdir-redirect"
+      >
+        relative redirect
+      </button>
+      <button
+        onClick={async () => {
+          startTransition(async () => {
+            await absoluteRedirect()
+          })
+        }}
+        id="absolute-subdir-redirect"
+      >
+        absolute redirect
+      </button>
+    </>
+  )
+}

test/e2e/app-dir/server-actions-relative-redirect/app/subdir/subpage/page.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return <p id="page-loaded">hello subdir nested page</p>
+}

test/e2e/app-dir/server-actions-relative-redirect/server-actions-relative-redirect.test.ts

@@ -32,4 +32,30 @@ describe('server-actions-relative-redirect', () => {
       return 'success'
     }, 'success')
   })
+
+  it('should work with relative redirect from subdir', async () => {
+    const browser = await next.browser('/subdir')
+    await browser.waitForElementByCss('#relative-subdir-redirect').click()
+
+    await check(async () => {
+      expect(await browser.waitForElementByCss('#page-loaded').text()).toBe(
+        'hello subdir nested page'
+      )
+
+      return 'success'
+    }, 'success')
+  })
+
+  it('should work with absolute redirect from subdir', async () => {
+    const browser = await next.browser('/subdir')
+    await browser.waitForElementByCss('#absolute-subdir-redirect').click()
+
+    await check(async () => {
+      expect(await browser.waitForElementByCss('#page-loaded').text()).toBe(
+        'hello nested page'
+      )
+
+      return 'success'
+    }, 'success')
+  })
 })