more tests for submission replace/push logic

remix-run · Dec 9, 2022 · 99993d9 · 99993d9
1 parent e8d5340
commit 99993d9
Showing 1 changed file with 95 additions and 1 deletion.
diff --git a/packages/react-router-dom/__tests__/data-browser-router-test.tsx b/packages/react-router-dom/__tests__/data-browser-router-test.tsx
@@ -1266,7 +1266,7 @@ function testDomRouter(
       `);
     });
 
-    it('defaults useSubmit({ method: "post" }) to be a REPLACE navigation', async () => {
+    it('defaults useSubmit({ method: "post" }) to a new location to be a PUSH navigation', async () => {
       let { container } = render(
         <TestDataRouter window={getWindow("/")} hydrationData={{}}>
           <Route element={<Layout />}>
@@ -1342,6 +1342,100 @@ function testDomRouter(
         </div>"
       `);
 
+      fireEvent.click(screen.getByText("Go back"));
+      await waitFor(() => screen.getByText("Page 1"));
+      expect(getHtml(container.querySelector(".output")))
+        .toMatchInlineSnapshot(`
+        "<div
+          class=\\"output\\"
+        >
+          <h1>
+            Page 1
+          </h1>
+        </div>"
+      `);
+    });
+
+    it('defaults useSubmit({ method: "post" }) to the same location to be a REPLACE navigation', async () => {
+      let { container } = render(
+        <TestDataRouter window={getWindow("/")} hydrationData={{}}>
+          <Route element={<Layout />}>
+            <Route index loader={() => "index"} element={<h1>index</h1>} />
+            <Route
+              path="1"
+              action={() => "action"}
+              loader={() => "1"}
+              element={<h1>Page 1</h1>}
+            />
+          </Route>
+        </TestDataRouter>
+      );
+
+      function Layout() {
+        let navigate = useNavigate();
+        let submit = useSubmit();
+        let actionData = useActionData();
+        let formData = new FormData();
+        formData.append("test", "value");
+        return (
+          <>
+            <Link to="1">Go to 1</Link>
+            <button
+              onClick={() => {
+                submit(formData, { action: "1", method: "post" });
+              }}
+            >
+              Submit
+            </button>
+            <button onClick={() => navigate(-1)}>Go back</button>
+            <div className="output">
+              {actionData ? <p>{actionData}</p> : null}
+              <Outlet />
+            </div>
+          </>
+        );
+      }
+
+      expect(getHtml(container.querySelector(".output")))
+        .toMatchInlineSnapshot(`
+        "<div
+          class=\\"output\\"
+        >
+          <h1>
+            index
+          </h1>
+        </div>"
+      `);
+
+      fireEvent.click(screen.getByText("Go to 1"));
+      await waitFor(() => screen.getByText("Page 1"));
+      expect(getHtml(container.querySelector(".output")))
+        .toMatchInlineSnapshot(`
+        "<div
+          class=\\"output\\"
+        >
+          <h1>
+            Page 1
+          </h1>
+        </div>"
+      `);
+
+      fireEvent.click(screen.getByText("Submit"));
+      await waitFor(() => screen.getByText("action"));
+      expect(getHtml(container.querySelector(".output")))
+        .toMatchInlineSnapshot(`
+        "<div
+          class=\\"output\\"
+        >
+          <p>
+            action
+          </p>
+          <h1>
+            Page 1
+          </h1>
+        </div>"
+      `);
+
       fireEvent.click(screen.getByText("Go back"));
       await waitFor(() => screen.getByText("index"));
       expect(getHtml(container.querySelector(".output")))