remix-run · brophdawg11 · Jun 25, 2024 · Jun 20, 2024 · Jun 24, 2024 · Jun 25, 2024
diff --git a/.changeset/fair-cheetahs-hope.md b/.changeset/fair-cheetahs-hope.md
@@ -0,0 +1,6 @@
+---
+"react-router-dom": major
+"react-router": major
+---
+
+Remove `future.v7_normalizeFormMethod` future flag
diff --git a/packages/react-router-dom/index.ts b/packages/react-router-dom/index.ts
@@ -77,7 +77,6 @@ export type {
   FormMethod,
   GetScrollRestorationKeyFunction,
   StaticHandlerContext,
-  V7_FormMethod,
   BrowserRouterProps,
   HashRouterProps,
   HistoryRouterProps,

diff --git a/packages/react-router/__tests__/router/fetchers-test.ts b/packages/react-router/__tests__/router/fetchers-test.ts
@@ -169,7 +169,7 @@ describe("fetchers", () => {
         formData: createFormData({ key: "value" }),
       });
       expect(A.fetcher.state).toBe("loading");
-      expect(A.fetcher.formMethod).toBe("get");
+      expect(A.fetcher.formMethod).toBe("GET");
       expect(A.fetcher.formAction).toBe("/foo");
       expect(A.fetcher.formData).toEqual(createFormData({ key: "value" }));
       expect(A.fetcher.formEncType).toBe("application/x-www-form-urlencoded");
@@ -2111,7 +2111,7 @@ describe("fetchers", () => {
           "formAction": "/two/three",
           "formData": FormData {},
           "formEncType": "application/x-www-form-urlencoded",
-          "formMethod": "post",
+          "formMethod": "POST",
           "json": undefined,
           "nextParams": {
             "a": "two",

diff --git a/packages/react-router/__tests__/router/navigation-test.ts b/packages/react-router/__tests__/router/navigation-test.ts
@@ -1154,7 +1154,7 @@ describe("navigations", () => {
         // @ts-expect-error
         new URLSearchParams(navigation.formData).toString()
       ).toBe("gosh=dang");
-      expect(navigation.formMethod).toBe("post");
+      expect(navigation.formMethod).toBe("POST");
       expect(navigation.formEncType).toBe("application/x-www-form-urlencoded");
       expect(navigation.location).toMatchObject({
         pathname: "/foo",
@@ -1169,7 +1169,7 @@ describe("navigations", () => {
         // @ts-expect-error
         new URLSearchParams(navigation.formData).toString()
       ).toBe("gosh=dang");
-      expect(navigation.formMethod).toBe("post");
+      expect(navigation.formMethod).toBe("POST");
       expect(navigation.formEncType).toBe("application/x-www-form-urlencoded");
       expect(navigation.location).toMatchObject({
         pathname: "/foo",
@@ -1203,7 +1203,7 @@ describe("navigations", () => {
         // @ts-expect-error
         new URLSearchParams(navigation.formData).toString()
       ).toBe("gosh=dang");
-      expect(navigation.formMethod).toBe("post");
+      expect(navigation.formMethod).toBe("POST");
       expect(navigation.location).toMatchObject({
         pathname: "/bar",
         search: "",
@@ -1229,7 +1229,7 @@ describe("navigations", () => {
       let navigation = t.router.state.navigation;
       expect(navigation.state).toBe("loading");
       expect(navigation.formData).toEqual(createFormData({ gosh: "dang" }));
-      expect(navigation.formMethod).toBe("get");
+      expect(navigation.formMethod).toBe("GET");
       expect(navigation.formEncType).toBe("application/x-www-form-urlencoded");
       expect(navigation.location).toMatchObject({
         pathname: "/foo",
@@ -1257,7 +1257,7 @@ describe("navigations", () => {
       let navigation = t.router.state.navigation;
       expect(navigation.state).toBe("loading");
       expect(navigation.formData).toEqual(createFormData({ gosh: "dang" }));
-      expect(navigation.formMethod).toBe("get");
+      expect(navigation.formMethod).toBe("GET");
       expect(navigation.formEncType).toBe("application/x-www-form-urlencoded");
       expect(navigation.location?.pathname).toBe("/bar");
 

diff --git a/packages/react-router/__tests__/router/revalidate-test.ts b/packages/react-router/__tests__/router/revalidate-test.ts
@@ -271,7 +271,7 @@ describe("router.revalidate", () => {
           pathname: "/tasks",
           search: "?key=value",
         },
-        formMethod: "get",
+        formMethod: "GET",
         formData: createFormData({ key: "value" }),
       },
       revalidation: "loading",

diff --git a/packages/react-router/__tests__/router/router-test.ts b/packages/react-router/__tests__/router/router-test.ts
@@ -690,7 +690,7 @@ describe("a router", () => {
         pathname: "/tasks",
         search: "?key=value",
       });
-      expect(t.router.state.navigation.formMethod).toBe("get");
+      expect(t.router.state.navigation.formMethod).toBe("GET");
       expect(t.router.state.navigation.formData).toEqual(
         createFormData({ key: "value" })
       );
@@ -710,7 +710,7 @@ describe("a router", () => {
         pathname: "/tasks",
         search: "?key=value",
       });
-      expect(t.router.state.navigation.formMethod).toBe("get");
+      expect(t.router.state.navigation.formMethod).toBe("GET");
       expect(t.router.state.navigation.formData).toEqual(
         createFormData({ key: "value" })
       );
@@ -730,7 +730,7 @@ describe("a router", () => {
         pathname: "/tasks",
         search: "?key=2",
       });
-      expect(t.router.state.navigation.formMethod).toBe("get");
+      expect(t.router.state.navigation.formMethod).toBe("GET");
       expect(t.router.state.navigation.formData).toEqual(
         createFormData({ key: "2" })
       );
@@ -750,7 +750,7 @@ describe("a router", () => {
         pathname: "/tasks",
         search: "?key=1",
       });
-      expect(t.router.state.navigation.formMethod).toBe("post");
+      expect(t.router.state.navigation.formMethod).toBe("POST");
       expect(t.router.state.navigation.formData).toEqual(
         createFormData({ key: "2" })
       );

diff --git a/packages/react-router/__tests__/router/should-revalidate-test.ts b/packages/react-router/__tests__/router/should-revalidate-test.ts
@@ -256,7 +256,7 @@ describe("shouldRevalidate", () => {
       nextParams: {},
       nextUrl: expect.urlMatch("http://localhost/child"),
       defaultShouldRevalidate: true,
-      formMethod: "post",
+      formMethod: "POST",
       formAction: "/child",
       formEncType: "application/x-www-form-urlencoded",
       actionResult: "ACTION",
@@ -310,7 +310,7 @@ describe("shouldRevalidate", () => {
       nextParams: {},
       nextUrl: expect.urlMatch("http://localhost/"),
       defaultShouldRevalidate: true,
-      formMethod: "post",
+      formMethod: "POST",
       formAction: "/child",
       formEncType: "application/x-www-form-urlencoded",
       actionResult: undefined,
@@ -364,7 +364,7 @@ describe("shouldRevalidate", () => {
       nextParams: {},
       nextUrl: expect.urlMatch("http://localhost/child"),
       defaultShouldRevalidate: true,
-      formMethod: "post",
+      formMethod: "POST",
       formAction: "/child",
       formEncType: "application/x-www-form-urlencoded",
       actionResult: "ACTION",
@@ -406,7 +406,7 @@ describe("shouldRevalidate", () => {
     // @ts-expect-error
     let arg = shouldRevalidate.mock.calls[0][0];
     let expectedArg: Partial<ShouldRevalidateFunctionArgs> = {
-      formMethod: "post",
+      formMethod: "POST",
       formAction: "/",
       formEncType: "application/json",
       text: undefined,
@@ -448,7 +448,7 @@ describe("shouldRevalidate", () => {
     // @ts-expect-error
     let arg = shouldRevalidate.mock.calls[0][0];
     let expectedArg: Partial<ShouldRevalidateFunctionArgs> = {
-      formMethod: "post",
+      formMethod: "POST",
       formAction: "/",
       formEncType: "text/plain",
       text: "hello world",
@@ -657,7 +657,7 @@ describe("shouldRevalidate", () => {
       formAction: "/child",
       formData: createFormData({}),
       formEncType: "application/x-www-form-urlencoded",
-      formMethod: "post",
+      formMethod: "POST",
       defaultShouldRevalidate: true,
     });
 
@@ -715,7 +715,7 @@ describe("shouldRevalidate", () => {
         "formAction": "/fetch",
         "formData": FormData {},
         "formEncType": "application/x-www-form-urlencoded",
-        "formMethod": "post",
+        "formMethod": "POST",
         "json": undefined,
         "nextParams": {},
         "nextUrl": "http://localhost/",
@@ -779,7 +779,7 @@ describe("shouldRevalidate", () => {
         "formAction": "/fetch",
         "formData": FormData {},
         "formEncType": "application/x-www-form-urlencoded",
-        "formMethod": "post",
+        "formMethod": "POST",
         "json": undefined,
         "nextParams": {},
         "nextUrl": "http://localhost/",

diff --git a/packages/react-router/__tests__/router/submission-test.ts b/packages/react-router/__tests__/router/submission-test.ts
@@ -504,16 +504,16 @@ describe("submissions", () => {
           formMethod: "get",
           formData: createFormData({}),
         });
-        expect(t.router.state.navigation.formMethod).toBe("get");
+        expect(t.router.state.navigation.formMethod).toBe("GET");
         await A.loaders.child.resolve("LOADER");
         expect(t.router.state.navigation.formMethod).toBeUndefined();
         await t.router.navigate("/");
 
         let B = await t.navigate("/child", {
-          formMethod: "POST",
+          formMethod: "post",
           formData: createFormData({}),
         });
-        expect(t.router.state.navigation.formMethod).toBe("post");
+        expect(t.router.state.navigation.formMethod).toBe("POST");
         await B.actions.child.resolve("ACTION");
         await B.loaders.child.resolve("LOADER");
         expect(t.router.state.navigation.formMethod).toBeUndefined();
@@ -523,20 +523,20 @@ describe("submissions", () => {
           formMethod: "GET",
           formData: createFormData({}),
         });
-        expect(t.router.state.fetchers.get("key")?.formMethod).toBe("get");
+        expect(t.router.state.fetchers.get("key")?.formMethod).toBe("GET");
         await C.loaders.child.resolve("LOADER FETCH");
         expect(t.router.state.fetchers.get("key")?.formMethod).toBeUndefined();
 
         let D = await t.fetch("/child", "key", {
-          formMethod: "post",
+          formMethod: "POST",
           formData: createFormData({}),
         });
-        expect(t.router.state.fetchers.get("key")?.formMethod).toBe("post");
+        expect(t.router.state.fetchers.get("key")?.formMethod).toBe("POST");
         await D.actions.child.resolve("ACTION FETCH");
         expect(t.router.state.fetchers.get("key")?.formMethod).toBeUndefined();
       });
 
-      it("normalizes to uppercase in v7 via v7_normalizeFormMethod", async () => {
+      it("normalizes to uppercase", async () => {
         let t = setup({
           routes: [
             {
@@ -553,7 +553,6 @@ describe("submissions", () => {
             },
           ],
           future: {
-            v7_normalizeFormMethod: true,
             v7_prependBasename: false,
           },
         });

diff --git a/packages/react-router/__tests__/router/utils/data-router-setup.ts b/packages/react-router/__tests__/router/utils/data-router-setup.ts
@@ -507,7 +507,7 @@ export function setup({
     // Otherwise we should only need a loader for the leaf match
     let activeLoaderMatches = [match];
     // @ts-expect-error
-    if (opts?.formMethod != null && opts.formMethod.toLowerCase() !== "get") {
+    if (opts?.formMethod != null && opts.formMethod.toUpperCase() !== "GET") {
       if (currentRouter.state.navigation?.location) {
         let matches = matchRoutes(
           inFlightRoutes || currentRouter.routes,
@@ -572,7 +572,7 @@ export function setup({
     invariant(currentRouter, "No currentRouter available");
 
     // @ts-expect-error
-    if (opts?.formMethod != null && opts.formMethod.toLowerCase() !== "get") {
+    if (opts?.formMethod != null && opts.formMethod.toUpperCase() !== "GET") {
       activeActionType = "navigation";
       activeActionNavigationId = navigationId;
       // Assume happy path and mark this navigations loaders as active.  Even if
@@ -662,7 +662,7 @@ export function setup({
     invariant(currentRouter, "No currentRouter available");
 
     // @ts-expect-error
-    if (opts?.formMethod != null && opts.formMethod.toLowerCase() !== "get") {
+    if (opts?.formMethod != null && opts.formMethod.toUpperCase() !== "GET") {
       activeActionType = "fetch";
       activeActionFetchId = navigationId;
     } else {

diff --git a/packages/react-router/index.ts b/packages/react-router/index.ts
@@ -258,7 +258,6 @@ export type {
   GetScrollRestorationKeyFunction,
   StaticHandlerContext,
   Submission,
-  V7_FormMethod,
 } from "./lib/router";
 
 export type {

diff --git a/packages/react-router/lib/dom/dom.ts b/packages/react-router/lib/dom/dom.ts
@@ -59,9 +59,9 @@ export type URLSearchParamsInit =
   supports arrays as values in the object form of the initializer
   instead of just strings. This is convenient when you need multiple
   values for a given key, but don't want to use an array initializer.
-  
+
   For example, instead of:
-  
+
   ```tsx
   let searchParams = new URLSearchParams([
     ['sort', 'name'],

diff --git a/packages/react-router/lib/dom/server.tsx b/packages/react-router/lib/dom/server.tsx
@@ -304,7 +304,6 @@ export function createStaticRouter(
     get future() {
       return {
         v7_fetcherPersist: false,
-        v7_normalizeFormMethod: false,
         v7_partialHydration: opts.future?.v7_partialHydration === true,
         v7_prependBasename: false,
         unstable_skipActionErrorRevalidation: false,

diff --git a/packages/react-router/lib/dom/ssr/browser.tsx b/packages/react-router/lib/dom/ssr/browser.tsx
@@ -162,7 +162,6 @@ function createHydratedRouter(): RemixRouter {
     history: createBrowserHistory(),
     basename: ssrInfo.context.basename,
     future: {
-      v7_normalizeFormMethod: true,
       v7_fetcherPersist: ssrInfo.context.future.v3_fetcherPersist,
       v7_partialHydration: true,
       v7_prependBasename: true,

diff --git a/packages/react-router/lib/router/index.ts b/packages/react-router/lib/router/index.ts
@@ -35,7 +35,6 @@ export type {
   TrackedPromise,
   UIMatch,
   UpperCaseFormMethod,
-  V7_FormMethod,
 } from "./utils";
 
 export {