From 5190a4cf63088a0fe74b0d595e03bdcf8c47b20c Mon Sep 17 00:00:00 2001
From: Shu Ding <g@shud.in>
Date: Wed, 5 Apr 2023 22:51:25 +0200
Subject: [PATCH 1/2] warn to use experimental react to enable actions

---
 packages/next/src/build/webpack-config.ts                | 1 +
 .../build/webpack/plugins/flight-client-entry-plugin.ts  | 9 +++++++++
 test/e2e/app-dir/actions/app/server/form.js              | 6 ++----
 test/e2e/app-dir/actions/next.config.js                  | 2 ++
 4 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts
index 475f5b16d029..24eca3b1c2d7 100644
--- a/packages/next/src/build/webpack-config.ts
+++ b/packages/next/src/build/webpack-config.ts
@@ -2248,6 +2248,7 @@ export default async function getBaseWebpackConfig(
               appDir,
               dev,
               isEdgeServer,
+              useExperimentalReact,
             })),
       hasAppDir &&
         !isClient &&
diff --git a/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts b/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
index 943700b00519..48b396ea4428 100644
--- a/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
+++ b/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
@@ -32,11 +32,13 @@ import {
 import { traverseModules, forEachEntryModule } from '../utils'
 import { normalizePathSep } from '../../../shared/lib/page-path/normalize-path-sep'
 import { getProxiedPluginState } from '../../build-context'
+import { warnOnce } from '../../../shared/lib/utils/warn-once'
 
 interface Options {
   dev: boolean
   appDir: string
   isEdgeServer: boolean
+  useExperimentalReact: boolean
 }
 
 const PLUGIN_NAME = 'ClientEntryPlugin'
@@ -75,11 +77,13 @@ export class ClientReferenceEntryPlugin {
   dev: boolean
   appDir: string
   isEdgeServer: boolean
+  useExperimentalReact: boolean
 
   constructor(options: Options) {
     this.dev = options.dev
     this.appDir = options.appDir
     this.isEdgeServer = options.isEdgeServer
+    this.useExperimentalReact = options.useExperimentalReact
   }
 
   apply(compiler: webpack.Compiler) {
@@ -241,6 +245,11 @@ export class ClientReferenceEntryPlugin {
       }
 
       if (actionEntryImports.size > 0) {
+        if (!this.useExperimentalReact) {
+          warnOnce(
+            '\nServer Actions require `experimental.experimentalReact` option to be enabled in your Next.js config.\n'
+          )
+        }
         addActionEntryList.push(
           this.injectActionEntry({
             compiler,
diff --git a/test/e2e/app-dir/actions/app/server/form.js b/test/e2e/app-dir/actions/app/server/form.js
index 82860e06a71d..bbf315f07ac1 100644
--- a/test/e2e/app-dir/actions/app/server/form.js
+++ b/test/e2e/app-dir/actions/app/server/form.js
@@ -14,16 +14,14 @@ export default function Form() {
   return (
     <>
       <hr />
-      <form action="" method="POST">
+      <form method="POST" action={action}>
         <input type="text" name="name" id="name" required />
-        <input type="text" name="$$id" value={action.$$id} hidden readOnly />
         <button type="submit" id="submit">
           Submit
         </button>
       </form>
       <hr />
-      <form action="" method="POST">
-        <input type="text" name="$$id" value={nowhere.$$id} hidden readOnly />
+      <form method="POST" action={nowhere}>
         <button type="submit" id="nowhere">
           Go nowhere
         </button>
diff --git a/test/e2e/app-dir/actions/next.config.js b/test/e2e/app-dir/actions/next.config.js
index cfa3ac3d7aa9..0445043e14fa 100644
--- a/test/e2e/app-dir/actions/next.config.js
+++ b/test/e2e/app-dir/actions/next.config.js
@@ -1,5 +1,7 @@
+/** @type {import('next').NextConfig} */
 module.exports = {
   experimental: {
     appDir: true,
+    experimentalReact: true,
   },
 }

From b7120197792fa3fcc0cc4025b95a2a7090e7d495 Mon Sep 17 00:00:00 2001
From: Shu Ding <g@shud.in>
Date: Thu, 6 Apr 2023 16:17:29 +0200
Subject: [PATCH 2/2] update form

---
 test/e2e/app-dir/actions/app/server/form.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/test/e2e/app-dir/actions/app/server/form.js b/test/e2e/app-dir/actions/app/server/form.js
index bbf315f07ac1..a8ba60bff0c9 100644
--- a/test/e2e/app-dir/actions/app/server/form.js
+++ b/test/e2e/app-dir/actions/app/server/form.js
@@ -14,14 +14,16 @@ export default function Form() {
   return (
     <>
       <hr />
-      <form method="POST" action={action}>
+      <form method="POST" action="">
+        <input type="text" name="$$id" value={action.$$id} hidden readOnly />
         <input type="text" name="name" id="name" required />
         <button type="submit" id="submit">
           Submit
         </button>
       </form>
       <hr />
-      <form method="POST" action={nowhere}>
+      <form method="POST" action="">
+        <input type="text" name="$$id" value={nowhere.$$id} hidden readOnly />
         <button type="submit" id="nowhere">
           Go nowhere
         </button>