[Routing] Using redirect from server action always uses "replace" redirect type

[joshfullmer]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
      Platform: darwin
      Arch: arm64
      Version: Darwin Kernel Version 21.5.0: Tue Apr 26 21:08:37 PDT 2022; root:xnu-8020.121.3~4/RELEASE_ARM64_T6000
    Binaries:
      Node: 16.15.1
      npm: 8.11.0
      Yarn: 1.22.19
      pnpm: 8.6.11
    Relevant Packages:
      next: 13.4.14-canary.2
      eslint-config-next: 13.4.13
      react: 18.2.0
      react-dom: 18.2.0
      typescript: 5.1.6
    Next.js Config:
      output: N/A

Which area(s) of Next.js are affected? (leave empty if unsure)

Routing (next/router, next/navigation, next/link)

Link to the code that reproduces this issue or a replay of the bug

https://github.com/joshfullmer/redirect-test

To Reproduce

Setup:

• Have two pages (A and B)
• Have server action that redirects to Page B, including the RedirectType.push option.
• Page A implements a form that uses the server action with a button to submit the form

Steps:

• Open new tab/window with clear browser history
• Visit Page A
• Click button in form

Expected:

• Page A should be in the browser history
• Clicking the browser's back button navigates from Page B to Page A

Actual:

• Browser history is replaced, only Page B exists in the browser history
• Clicking the browser's back button does nothing

Describe the Bug

When using the redirect function from next/navigation in a server function, the redirect type is always "replace".

The docs say that "push" is the default value for redirect type in the redirect function when used in server actions, but that does not appear to happen. The current route always appears to be replaced, even when the redirect type is explicitly RedirectType.push.

Expected Behavior

When redirect is used within a server action, the default value for redirect type of "push" should be respected, and browser history should include the previous page.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

_NEXT-1551

[og2t]

I can confirm this bug.

@joshfullmer Could you point to the code where:

the redirect type is always "replace"?

[fullyherge]

Getting this behaviour as well. Worked around it for now by having my server action, which is called from within an onSubmit on a <form>, return the uri to redirect to and doing it in the client.

This will probably not cover all cases though.

Server Action, heavily redacted

"use server";

export async function runSearch(...) {
  // [...]
  if (result) {
    // redirect(`/device/cubic/${result.id}`);
    return {
      redirect: true,
      redirectUri: `/device/cubic/${result.id}`,
      result: [],
      error: null,
    };
  }
  // [...]
}

Form submit

"use client";

<form
  onSubmit={(e) => {
    e.preventDefault();
    setError(null);
    startTransition(async () => {
      try {
        const result = await runSearch(query, activeCategory);
        if (result?.redirect && result.redirectUri) {
          return router.push(result.redirectUri);
        }
        if (result?.result) {
          setResults(result?.result);
        }
      } catch (error) {
        setError(error as { status: number; message: string });
      }
    });
  }}
>

[karlhorky]

Thanks for the super fast PR #54458 and review @shuding @ijjk 🙌

This change was released in next@13.4.20-canary.4. I upgraded to this version and can confirm that a new history state is added in my application when calling redirect() in a Server Action - the back button now returns to the previous page where the Server Action was called.

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.