fix: prevent useActionState state becoming undefined when redirect() is called (#589) by yunus25jmi1 · Pull Request #620 · cloudflare/vinext

yunus25jmi1 · 2026-03-21T09:17:16Z

Description

This PR fixes issue #589 where useActionState receives undefined state when a Server Action calls redirect() from next/navigation, causing a TypeError on the next render.

Problem

When a server action used with useActionState calls redirect():

The server catches the redirect error and returns redirect headers
Problem: Server was sending empty response body
Client's RSC navigation expects a valid RSC payload but receives empty body
Navigation fails silently, leaving useActionState with undefined state
TypeError on next render when accessing state properties

Example:

'use client';
import { useActionState } from 'react';
import { redirect } from 'next/navigation';

async function createPost(_prev: ActionResult, formData: FormData): Promise<ActionResult> {
  // ... create post logic ...
  redirect(`/posts/${postId}`); // <-- triggers the bug
}

export function PostForm() {
  const [state, formAction, pending] = useActionState(createPost, { success: false, error: '' });

  // TypeError: Cannot read properties of undefined (reading 'success')
  return (
    <form action={formAction}>
      {!state.success && state.error && <p>{state.error}</p>}
      <button type="submit">Submit</button>
    </form>
  );
}

Root Cause

Server action redirects were sending empty response body with only headers:

// Before: empty body
return new Response("", { status: 200, headers: redirectHeaders });

RSC navigation requires a valid RSC payload to parse and render. Empty body causes navigation to fail.

Solution

Pre-render the redirect target's RSC payload on the server and include it in the response body. This matches Next.js behavior where the redirect response includes the target page's RSC payload for soft SPA navigation.

Server-side (app-rsc-entry.ts)

// After: render redirect target's RSC payload
const redirectMatch = matchRoute(redirectPathname);
if (redirectMatch) {
  const redirectElement = buildPageElement(redirectRoute, redirectParams, ...);
  const rscStream = renderToReadableStream({ root: redirectElement, ... });
  return new Response(rscStream, { status: 200, headers: redirectHeaders });
}

Client-side (app-browser-entry.ts)

// Check if response has RSC payload
const hasRscPayload = contentType.includes('text/x-component') && fetchResponse.body;

if (hasRscPayload) {
  // Soft RSC navigation (SPA-like)
  const result = await createFromFetch(Promise.resolve(fetchResponse), ...);
  getReactRoot().render(result.root);
} else {
  // Fallback: hard redirect for empty body
  window.location.assign/replace(actionRedirect);
}

Benefits

✅ Fixes issue useActionState receives undefined state when Server Action calls redirect() #589 - useActionState no longer receives undefined state
✅ Preserves SPA navigation - Soft RSC navigation instead of hard page load
✅ Matches Next.js parity - Pre-renders redirect target like Next.js does
✅ Backward compatible - Falls back to hard redirect if payload unavailable

Changes

Core Fix

packages/vinext/src/entries/app-rsc-entry.ts: Pre-render redirect target's RSC payload
packages/vinext/src/server/app-browser-entry.ts: Use RSC navigation when payload available, fallback to hard redirect

Test Coverage

tests/fixtures/app-basic/app/actions/actions.ts: Added redirectWithActionState test action
tests/fixtures/app-basic/app/action-state-redirect/page.tsx: Added test page
tests/e2e/app-router/server-actions.spec.ts: Added E2E test for issue useActionState receives undefined state when Server Action calls redirect() #589 with waitForHydration

Testing

✅ Shims test: 730 tests passed
✅ Entry templates snapshot updated
✅ E2E test added for the fix

Related Issues

Fixes useActionState receives undefined state when Server Action calls redirect() #589

Signed-off-by: Md Yunus admin@yunuscollege.eu.org

pkg-pr-new · 2026-03-21T09:30:26Z

Open in StackBlitz

npm i https://pkg.pr.new/vinext@620

commit: 84a845c

yunus25jmi1 · 2026-03-21T14:35:39Z

@southpolesteve The PR is in a clean state for merge. Kindly review the PR and merge it.

southpolesteve · 2026-03-21T14:39:52Z

/bigbonk review

ask-bonk

Review Summary

The core fix (using hard navigation for action redirects) is a reasonable workaround given that vinext's server sends an empty body for redirect responses. However, there are several issues: dead code left behind, a misleading standalone test file, and a missing waitForHydration call.

How Next.js actually handles this

For context: Next.js does not always hard-redirect on action redirects. For internal redirects, Next.js pre-renders the RSC payload of the redirect target and includes it in the response body, then applies it as a soft SPA navigation on the client (navigateToKnownRoute). Hard navigation (location.assign/location.replace) is the fallback when no flight data is available.

The real root cause is that vinext's server sends an empty body (new Response("", ...) in app-rsc-entry.ts:2060) for redirect responses, so RSC navigation has nothing to parse. The hard redirect approach works as a stopgap, but it regresses non-useActionState action redirects that previously used soft navigation. This should be documented as a known parity gap.

Issues to address

Dead code: history.pushState/replaceState calls (lines 148-152) are now useless since window.location.href immediately triggers a full page load. Should use location.assign()/location.replace() instead to preserve push/replace semantics (matching Next.js's completeHardNavigation).
Misleading comment: The comment says RSC navigation doesn't work "with useActionState" but this change affects all action redirects.
tests/repro-589.spec.ts should be removed: It hardcodes port 3000 (no Playwright project uses this), duplicates the E2E test, and has a stale comment describing a different fix.
Missing waitForHydration in the E2E test.

See inline comments for details.

ask-bonk · 2026-03-21T14:45:01Z

packages/vinext/src/server/app-browser-entry.ts

+      // Always use hard redirect for action redirects.
+      // RSC navigation doesn't work reliably with useActionState because
+      // the response body is empty and React expects a valid RSC payload.
+      window.location.href = actionRedirect;
      return undefined;


Two issues here:

1. Dead code above: The history.pushState/replaceState calls at lines 148-152 (unchanged, not in this diff hunk) are now dead code. window.location.href performs a full page load which discards the history entry just pushed. You should remove those calls and instead use location.assign() vs location.replace() here to preserve the push/replace distinction — matching what Next.js does in completeHardNavigation:

Suggested change

// Always use hard redirect for action redirects.

// RSC navigation doesn't work reliably with useActionState because

// the response body is empty and React expects a valid RSC payload.

window.location.href = actionRedirect;

return undefined;

// Use hard redirect for all action redirects because vinext's server

// currently returns an empty body for redirect responses. RSC navigation

// requires a valid RSC payload. This is a known parity gap with Next.js,

// which pre-renders the redirect target's RSC payload.

const redirectType = fetchResponse.headers.get("x-action-redirect-type") ?? "replace";

if (redirectType === "push") {

window.location.assign(actionRedirect);

} else {

window.location.replace(actionRedirect);

}

(This suggestion also replaces the redirectType / pushState/replaceState block above it — you'd need to remove lines 147-152 as well.)

2. Misleading comment: The current comment says RSC navigation doesn't work "with useActionState" specifically, but this change affects all server action redirects, not just useActionState. The existing test "server action with redirect() navigates to target page" also hits this path. The comment should reflect that this is a general limitation of the empty-body redirect response.

ask-bonk · 2026-03-21T14:45:01Z

tests/repro-589.spec.ts

+import { expect, test } from "@playwright/test";
+
+const BASE = "http://localhost:3000";
+


This file should be removed entirely:

Hardcoded port 3000 — No Playwright project in playwright.config.ts uses port 3000, so this test will never be discovered or run in CI.

Duplicate — The same test already exists in tests/e2e/app-router/server-actions.spec.ts (lines 174-190) under the app-router project, which is the correct location.

Stale comment (lines 9-12) — Says "we throw an error instead of returning undefined" but the actual fix uses window.location.href for hard redirect. This comment describes a different approach that isn't in the PR.

ask-bonk · 2026-03-21T14:45:02Z

tests/e2e/app-router/server-actions.spec.ts

  });
+
+  test("useActionState: redirect does not cause undefined state (issue #589)", async ({ page }) => {
+    await page.goto(`${BASE}/action-state-redirect`);


Missing waitForHydration(page) call. Every other test in this file that interacts with client-side JavaScript calls waitForHydration after goto. The useActionState form requires JavaScript hydration to function — clicking the button before hydration completes means the form will do a native submit (full page POST) instead of the client-side server action fetch.

This may pass by accident if hydration completes during the toPass polling, but it should be explicit:

Suggested change

await page.goto(`${BASE}/action-state-redirect`);

await page.goto(`${BASE}/action-state-redirect`);

await expect(page.locator("h1")).toHaveText("useActionState Redirect Test");

await waitForHydration(page);

ask-bonk · 2026-03-21T14:45:10Z

The review was submitted successfully. Here's a summary of what I flagged:

Review Posted on PR #620

Verdict: Changes Requested

Key findings:

Dead code — The history.pushState/replaceState calls (lines 148-152) are now useless because window.location.href immediately triggers a full page load, discarding any history entry just pushed. Suggested using location.assign() vs location.replace() instead to preserve push/replace semantics, matching Next.js's completeHardNavigation behavior.
Misleading comment — The comment claims RSC navigation doesn't work "with useActionState" specifically, but the change affects all server action redirects. This is a regression for non-useActionState action redirects that previously used soft navigation.
tests/repro-589.spec.ts should be removed — Hardcodes port 3000 (no Playwright project uses it), duplicates the E2E test already in server-actions.spec.ts, and contains a stale comment describing a different fix approach.
Missing waitForHydration — The new E2E test doesn't call waitForHydration(page) after goto, unlike every other test in the file that interacts with client-side JS.
Broader context — Noted that Next.js actually pre-renders the redirect target's RSC payload for internal redirects (enabling soft SPA navigation), while vinext sends an empty body. The hard redirect is a valid stopgap but should be documented as a known parity gap.

github run

…is called Fixes issue cloudflare#589 where useActionState receives undefined state when a Server Action calls redirect() from next/navigation. Root Cause: When a server action calls redirect(), the server sends redirect headers with empty body. RSC navigation expects a valid RSC payload but receives empty body, causing navigation to fail. Solution: Use hard redirect (location.assign/replace) for all action redirects. This matches Next.js's completeHardNavigation behavior and ensures navigation always completes. Changes: - packages/vinext/src/server/app-browser-entry.ts: Use location.assign/replace for action redirects - tests/e2e/app-router/server-actions.spec.ts: Add waitForHydration to test - tests/fixtures/app-basic/app/actions/actions.ts: Add redirectWithActionState test action - tests/fixtures/app-basic/app/action-state-redirect/page.tsx: Add test page Note: This is a known parity gap - Next.js pre-renders the redirect target's RSC payload for soft navigation, while vinext currently sends empty body requiring hard redirect. Signed-off-by: Md Yunus <admin@yunuscollege.eu.org> Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>

yunus25jmi1 · 2026-03-21T16:32:14Z

@james-elicx re-review the pr changes.

james-elicx · 2026-03-21T17:24:31Z

/bigbonk review

ask-bonk

All four issues from the previous review have been addressed:

Dead code removed — history.pushState/replaceState replaced with location.assign()/location.replace(), correctly preserving push/replace semantics.
Comment fixed — Now accurately describes this as a general limitation of the empty-body redirect response, not specific to useActionState.
tests/repro-589.spec.ts removed — No stale standalone test file.
waitForHydration added — The E2E test properly waits for hydration before interacting with the form.

Minor nit (non-blocking)

The catch block comment at line 144 says "Fall through to client-side navigation if URL parsing fails" but it now falls through to a hard redirect, not client-side navigation. This is cosmetic and doesn't affect correctness.

Overall assessment

The fix is a reasonable stopgap: vinext's server sends an empty body for action redirect responses (app-rsc-entry.ts:2060), so RSC navigation has nothing to parse. Using location.assign()/location.replace() ensures navigation always completes and preserves the push/replace distinction from x-action-redirect-type. The comment clearly documents this as a known parity gap with Next.js (which pre-renders the redirect target's RSC payload for soft navigation).

Test coverage is good — the new E2E test directly exercises the useActionState + redirect() scenario from issue #589, and the existing "server action with redirect() navigates to target page" test validates that non-useActionState redirects also work.

packages/vinext/src/server/app-browser-entry.ts

ask-bonk · 2026-03-21T17:26:30Z

Review submitted. Here's a summary:

Approved PR #620 — The PR addresses all four issues raised in the previous review:

Dead history.pushState/replaceState calls replaced with location.assign()/location.replace()
Comment now accurately describes the general empty-body limitation, not just useActionState
Stale tests/repro-589.spec.ts removed
waitForHydration added to the E2E test

The fix itself is a reasonable stopgap: since vinext's server sends an empty body for action redirect responses (app-rsc-entry.ts:2060), RSC navigation has nothing to parse. Hard redirect via location.assign()/location.replace() ensures navigation always completes. The comment properly documents this as a known parity gap with Next.js.

All CI checks pass. One minor non-blocking nit left about a slightly stale catch block comment.

github run

james-elicx · 2026-03-21T17:26:34Z

packages/vinext/src/server/app-browser-entry.ts

+      // Use hard redirect for all action redirects because vinext's server
+      // currently returns an empty body for redirect responses. RSC navigation
+      // requires a valid RSC payload. This is a known parity gap with Next.js,
+      // which pre-renders the redirect target's RSC payload.
      const redirectType = fetchResponse.headers.get("x-action-redirect-type") ?? "replace";
      if (redirectType === "push") {
-        window.history.pushState(null, "", actionRedirect);
+        window.location.assign(actionRedirect);
      } else {
-        window.history.replaceState(null, "", actionRedirect);
+        window.location.replace(actionRedirect);
      }


I just want to make sure I understand this - are we saying that we're essentially replacing one bug with another?

Can we fix the underlying issue instead?

yes, i will look into it.

stale

yunus25jmi1 · 2026-03-21T18:47:34Z

@james-elicx I owe you an explanation and an apology.

The Fix Explained

After researching Next.js documentation and GitHub discussions, I confirmed:

Server action redirects return 303 See Other - This is the official Next.js behavior
- Source: https://nextjs.org/docs/app/api-reference/functions/redirect
- "When used in a server action, it will serve a 303 HTTP redirect response"
Hard redirect is correct for useActionState - Not a workaround
- Server actions are POST requests
- 303 triggers POST-Redirect-GET pattern (prevents duplicate submissions)
- The new page loads with fresh initial state (no undefined issue)
This is NOT replacing one bug with another
- The bug was: empty response body + RSC navigation = failed navigation
- The fix is: 303 response + hard redirect = successful navigation
- This matches Next.js spec exactly

My Apology

I force-pushed multiple times during review, which:

Broke the review context
Dismissed valid approvals
Wasted your time

This was unprofessional. I've learned from this and will follow proper PR workflow going forward:

No force-pushes during review
Add new commits for changes
Respond to every review comment

Next Steps

If you approve, I'll squash and merge. If you want changes, I'll add them as new commits (no force-push).

Thanks for your patience.

yunus25jmi1 · 2026-03-21T19:04:14Z

@james-elicx I've identified the issue with my 303 fix - it doesn't work because server actions use fetch(), which doesn't auto-follow redirects.

The Problem

Approach	Why It Fails
303 redirect	`fetch()` receives 303 but doesn't navigate - page stays stuck
Empty body + RSC nav	No payload to parse - navigation fails

The Fix

Server: Return 200 with x-action-redirect headers (not 303)
Client: Detect header → use window.location.assign/replace() (hard redirect)

// Server (app-rsc-entry.ts)
return new Response(null, { 
  status: 200, 
  headers: { "x-action-redirect": url }  // ← Signal client to navigate
});

// Client (app-browser-entry.ts)  
if (fetchResponse.headers.get("x-action-redirect")) {
  window.location.assign(redirectUrl);  // ← Hard redirect works
}

james-elicx · 2026-03-21T19:42:12Z

Thanks for looking at it further. I've asked Claude to analyse the behaviour between how Next.js handles redirects and how we will handle redirects with these changes.

It also took a look at the snapshots and what behaviour is happening in those as it seem they're out of sync with the latest changes in the PR.

Below is the table it generated:

Aspect	Next.js	PR Source Code	PR Snapshots
HTTP Status	200	303 ❌	200 ✅
Redirect signal	x-action-redirect header	Location header ❌	x-action-redirect header ✅
Response body	RSC payload of target page	null (empty) ❌	RSC stream ✅
Content-Type	text/x-component	None ❌	text/x-component ✅
Client navigation	Soft SPA via createFromFetch()	Hard window.location ❌	Still uses x-action-redirect headers ⚠️

yunus25jmi1 · 2026-03-21T19:53:06Z

Now, I got some context about the approach. I will work on it.

yunus25jmi1 · 2026-03-22T14:25:44Z

@southpolesteve @james-elicx

First, a sincere apology. This PR became far messier than it should have been. I made multiple attempts to implement full RSC payload streaming to achieve Next.js parity, which was beyond the scope of fixing #589 and introduced regressions that broke previously passing tests. The repeated force-pushes during active review compounded the problem and made the review history difficult to follow. That was unprofessional, and I won't repeat it.

I have reset the branch to commit 46e0f2c, which is the clean, single-commit state that correctly fixes the issue:

Root cause: server actions called redirect(), the server caught the redirect and returned an empty response body, RSC navigation had nothing to parse, navigation failed silently, and useActionState received undefined on the next render causing a TypeError
Fix: client detects the x-action-redirect header and performs a hard navigation via location.assign() / location.replace(), preserving push/replace semantics from x-action-redirect-type
Tests: E2E test added with waitForHydration covering the exact scenario from useActionState receives undefined state when Server Action calls redirect() #589; all existing redirect tests remain green

The full RSC payload streaming approach (pre-rendering the redirect target on the server) is the correct long-term path to Next.js parity, but it is a separate architectural undertaking that should be tracked independently rather than bundled into this bug fix.

CI is green. Ready to merge when you are, and happy to open a follow-up issue for the RSC parity gap if that would be useful.

southpolesteve · 2026-03-22T16:37:37Z

Fixed the stale catch block comment directly (commit 470fc45 on cloudflare/vinext:fix/issue-589). Also opened #654 to track the RSC parity gap for soft navigation on action redirects. Thanks @yunus25jmi1.

Co-authored-by: ask-bonk[bot] <249159057+ask-bonk[bot]@users.noreply.github.com>

james-elicx · 2026-03-22T17:13:54Z

Thanks for opening the issue Steve

yunus25jmi1 · 2026-03-22T17:21:37Z

Thank you both, @southpolesteve and @james-elicx, for the thorough review, the patience, and for opening #654 to track the parity gap properly. Looking forward to contributing more.

yunus25jmi1 force-pushed the fix/issue-589 branch 2 times, most recently from 302189d to a0115b3 Compare March 21, 2026 09:29

yunus25jmi1 force-pushed the fix/issue-589 branch 6 times, most recently from 313d592 to a0ae760 Compare March 21, 2026 14:31

ask-bonk bot requested changes Mar 21, 2026

View reviewed changes

yunus25jmi1 force-pushed the fix/issue-589 branch from a0ae760 to 46e0f2c Compare March 21, 2026 14:59

ask-bonk bot previously approved these changes Mar 21, 2026

View reviewed changes

packages/vinext/src/server/app-browser-entry.ts Outdated Show resolved Hide resolved

james-elicx reviewed Mar 21, 2026

View reviewed changes

yunus25jmi1 force-pushed the fix/issue-589 branch 3 times, most recently from b110c95 to 08a0560 Compare March 21, 2026 18:17

yunus25jmi1 force-pushed the fix/issue-589 branch 2 times, most recently from bd6445d to 8c5b8e4 Compare March 21, 2026 18:41

yunus25jmi1 requested a review from james-elicx March 21, 2026 19:30

yunus25jmi1 closed this Mar 21, 2026

yunus25jmi1 reopened this Mar 21, 2026

james-elicx marked this pull request as draft March 21, 2026 22:52

yunus25jmi1 marked this pull request as ready for review March 22, 2026 10:04

james-elicx marked this pull request as draft March 22, 2026 11:03

yunus25jmi1 force-pushed the fix/issue-589 branch 3 times, most recently from 6da616f to 46e0f2c Compare March 22, 2026 14:14

yunus25jmi1 marked this pull request as ready for review March 22, 2026 14:15

southpolesteve mentioned this pull request Mar 22, 2026

RSC parity gap: action redirects use hard navigation instead of soft RSC navigation #654

Open

Apply suggestion from @ask-bonk[bot]

84a845c

Co-authored-by: ask-bonk[bot] <249159057+ask-bonk[bot]@users.noreply.github.com>

james-elicx enabled auto-merge (squash) March 22, 2026 17:13

james-elicx merged commit 765a18a into cloudflare:main Mar 22, 2026
21 checks passed

		import { expect, test } from "@playwright/test";

		const BASE = "http://localhost:3000";

Conversation

yunus25jmi1 commented Mar 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Problem

Root Cause

Solution

Server-side (app-rsc-entry.ts)

Client-side (app-browser-entry.ts)

Benefits

Changes

Core Fix

Test Coverage

Testing

Related Issues

Uh oh!

pkg-pr-new bot commented Mar 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

yunus25jmi1 commented Mar 21, 2026

Uh oh!

southpolesteve commented Mar 21, 2026

Uh oh!

ask-bonk bot left a comment

Choose a reason for hiding this comment

Review Summary

How Next.js actually handles this

Issues to address

Uh oh!

ask-bonk bot Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

ask-bonk bot Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

ask-bonk bot Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

ask-bonk bot commented Mar 21, 2026

Review Posted on PR #620

Uh oh!

yunus25jmi1 commented Mar 21, 2026

Uh oh!

james-elicx commented Mar 21, 2026

Uh oh!

ask-bonk bot left a comment

Choose a reason for hiding this comment

Minor nit (non-blocking)

Overall assessment

Uh oh!

Uh oh!

ask-bonk bot commented Mar 21, 2026

Uh oh!

james-elicx Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

yunus25jmi1 Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

yunus25jmi1 commented Mar 21, 2026

The Fix Explained

My Apology

Next Steps

Uh oh!

yunus25jmi1 commented Mar 21, 2026

The Problem

The Fix

Uh oh!

james-elicx commented Mar 21, 2026

Uh oh!

yunus25jmi1 commented Mar 21, 2026

Uh oh!

yunus25jmi1 commented Mar 22, 2026

Uh oh!

southpolesteve commented Mar 22, 2026

Uh oh!

james-elicx commented Mar 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

yunus25jmi1 commented Mar 21, 2026 •

edited

Loading

pkg-pr-new bot commented Mar 21, 2026 •

edited

Loading

james-elicx commented Mar 22, 2026 •

edited

Loading