feat(react-router): add useSubmit/useFetcher to createMemoryRouter

packages/react-router-dom/__tests__/exports-test.tsx

@@ -3,16 +3,22 @@ import * as ReactRouterDOM from "react-router-dom";
 
 let nonReExportedKeys = new Set(["UNSAFE_mapRouteProperties"]);
 
+let exportedButDifferent = new Set(["useFetcher", "useFetchers", "useSubmit"]);
+
 describe("react-router-dom", () => {
   for (let key in ReactRouter) {
-    if (!nonReExportedKeys.has(key)) {
-      it(`re-exports ${key} from react-router`, () => {
-        expect(ReactRouterDOM[key]).toBe(ReactRouter[key]);
-      });
-    } else {
+    if (nonReExportedKeys.has(key)) {
       it(`does not re-export ${key} from react-router`, () => {
         expect(ReactRouterDOM[key]).toBe(undefined);
       });
+    } else if (exportedButDifferent.has(key)) {
+      it(`exports ${key} but not from react-router`, () => {
+        expect(ReactRouterDOM[key]).not.toBe(ReactRouter[key]);
+      });
+    } else {
+      it(`re-exports ${key} from react-router`, () => {
+        expect(ReactRouterDOM[key]).toBe(ReactRouter[key]);
+      });
     }
   }
 });

packages/react-router-dom/dom.ts

@@ -128,13 +128,14 @@ export interface SubmitOptions {
   method?: HTMLFormMethod;
 
   /**
-   * The action URL path used to submit the form. Overrides `<form action>`.
-   * Defaults to the path of the current route.
+   * The action URL path used to submit the form (or a direct action to be
+   * executed). Overrides `<form action>`. Defaults to the path of the current
+   * route.
    */
   action?: string | ActionFunction;
 
   /**
-   * The action URL used to submit the form. Overrides `<form encType>`.
+   * The encType to be used to encode the submission. Overrides `<form encType>`.
    * Defaults to "application/x-www-form-urlencoded".  Specifying `null` will
    * opt-out of serialization and will submit the data directly to your action
    * in the `payload` parameter.

packages/react-router-dom/index.tsx

@@ -979,7 +979,7 @@ function useSubmitImpl(
       let path =
         typeof options.action === "function" ? null : options.action || action;
       let routerAction =
-        typeof options.action === "function" ? options.action : null;
+        typeof options.action === "function" ? options.action : undefined;
 
       // Base options shared between fetch() and navigate()
       let opts = {

packages/react-router-native/__tests__/exports-test.tsx

@@ -5,14 +5,14 @@ let nonReExportedKeys = new Set(["UNSAFE_mapRouteProperties"]);
 
 describe("react-router-native", () => {
   for (let key in ReactRouter) {
-    if (!nonReExportedKeys.has(key)) {
-      it(`re-exports ${key} from react-router`, () => {
-        expect(ReactRouterNative[key]).toBe(ReactRouter[key]);
-      });
-    } else {
+    if (nonReExportedKeys.has(key)) {
       it(`does not re-export ${key} from react-router`, () => {
         expect(ReactRouterNative[key]).toBe(undefined);
       });
+    } else {
+      it(`re-exports ${key} from react-router`, () => {
+        expect(ReactRouterNative[key]).toBe(ReactRouter[key]);
+      });
     }
   }
 });

packages/react-router-native/index.tsx

@@ -27,6 +27,7 @@ export type {
   unstable_BlockerFunction,
   DataRouteMatch,
   DataRouteObject,
+  FetcherWithMethods,
   Fetcher,
   Hash,
   IndexRouteObject,
@@ -62,6 +63,8 @@ export type {
   RoutesProps,
   Search,
   ShouldRevalidateFunction,
+  SubmitFunction,
+  SubmitOptions,
   To,
 } from "react-router";
 export {
@@ -92,6 +95,8 @@ export {
   useActionData,
   useAsyncError,
   useAsyncValue,
+  useFetcher,
+  useFetchers,
   unstable_useBlocker,
   useHref,
   useInRouterContext,
@@ -110,6 +115,7 @@ export {
   useRouteError,
   useRouteLoaderData,
   useRoutes,
+  useSubmit,
 } from "react-router";
 
 ///////////////////////////////////////////////////////////////////////////////