Skip to content

Commit

Permalink
fix: Include submitter data in partial form data (#2307)
Browse files Browse the repository at this point in the history 
Fixes #2306
  • Loading branch information
@adamgreg
adamgreg authored Jun 6, 2024
1 parent c3ec742 commit 8c5e2b0
Show file tree
Hide file tree
Showing 2 changed files with 31 additions and 17 deletions.
4 changes: 2 additions & 2 deletions src/runtime/client/partials.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -251,10 +251,10 @@ document.addEventListener("submit", async (e) => {
if (lowerMethod === "get") {
// TODO: Looks like constructor type for URLSearchParam is wrong
// deno-lint-ignore no-explicit-any
const qs = new URLSearchParams(new FormData(el) as any);
const qs = new URLSearchParams(new FormData(el, e.submitter) as any);
qs.forEach((value, key) => partialUrl.searchParams.set(key, value));
} else {
init = { body: new FormData(el), method: lowerMethod };
init = { body: new FormData(el, e.submitter), method: lowerMethod };
}

await fetchPartials(actionUrl, partialUrl, init);
Expand Down
44 changes: 29 additions & 15 deletions tests/partials_test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1403,10 +1403,12 @@ Deno.test({
fn: async () => {
const app = testApp()
.get("/partial", (ctx) => {
const name = ctx.url.searchParams.get("name")!;
const submitter = ctx.url.searchParams.get("submitter")!;
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + ctx.url.searchParams.get("name")!}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1421,7 +1423,7 @@ Deno.test({
<p class="init">init</p>
</Partial>
<SelfCounter />
<button class="update">
<button class="update" name="submitter" value="sub">
update
</button>
</form>
Expand All @@ -1438,7 +1440,7 @@ Deno.test({
await waitForText(page, ".output", "1");

await page.locator(".update").click();
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();
});
},
});
Expand All @@ -1448,10 +1450,12 @@ Deno.test({
fn: async () => {
const app = testApp()
.get("/partial", (ctx) => {
const name = ctx.url.searchParams.get("name")!;
const submitter = ctx.url.searchParams.get("submitter")!;
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + ctx.url.searchParams.get("name")!}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1466,7 +1470,7 @@ Deno.test({
<p class="init">init</p>
</Partial>
<SelfCounter />
<button class="update">
<button class="update" name="submitter" value="sub">
update
</button>
</form>
Expand All @@ -1483,7 +1487,7 @@ Deno.test({
await waitForText(page, ".output", "1");

await page.locator(".update").click();
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();

const pathname = await page.evaluate(() => window.location.pathname);
expect(pathname).toEqual("/foo");
Expand All @@ -1498,10 +1502,11 @@ Deno.test({
.post("/partial", async (ctx) => {
const data = await ctx.req.formData();
const name = data.get("name");
const submitter = data.get("submitter");
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + name}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1516,7 +1521,7 @@ Deno.test({
<p class="init">init</p>
</Partial>
<SelfCounter />
<button class="update">
<button class="update" name="submitter" value="sub">
update
</button>
</form>
Expand All @@ -1533,7 +1538,7 @@ Deno.test({
await waitForText(page, ".output", "1");

await page.locator(".update").click();
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();
});
},
});
Expand Down Expand Up @@ -1599,10 +1604,11 @@ Deno.test({
.post("/partial", async (ctx) => {
const data = await ctx.req.formData();
const name = data.get("name");
const submitter = data.get("submitter");
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + name}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1627,6 +1633,8 @@ Deno.test({
form="foo"
formaction="/partial"
formmethod="POST"
name="submitter"
value="sub"
>
submit
</button>
Expand All @@ -1643,7 +1651,7 @@ Deno.test({
await waitForText(page, ".output", "1");

await page.locator(".update").click();
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();
});
},
});
Expand All @@ -1655,10 +1663,11 @@ Deno.test({
.post("/partial", async (ctx) => {
const data = await ctx.req.formData();
const name = data.get("name");
const submitter = data.get("submitter");
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + name}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1684,6 +1693,8 @@ Deno.test({
formaction="/foo"
formmethod="POST"
f-partial="/partial"
name="submitter"
value="sub"
>
submit
</button>
Expand All @@ -1700,7 +1711,7 @@ Deno.test({
await waitForText(page, ".output", "1");

await page.locator(".update").click();
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();
});
},
});
Expand All @@ -1713,10 +1724,11 @@ Deno.test({
.post("/partial", async (ctx) => {
const data = await ctx.req.formData();
const name = data.get("name");
const submitter = data.get("submitter");
return ctx.render(
<Doc>
<Partial name="foo">
<p class={"done-" + name}>done</p>
<p class={`done-${name}-${submitter}`}>done</p>
</Partial>
</Doc>,
);
Expand All @@ -1743,6 +1755,8 @@ Deno.test({
formaction="/partial"
formmethod="POST"
f-partial="/partial"
name="submitter"
value="sub"
>
submit
</button>
Expand All @@ -1762,7 +1776,7 @@ Deno.test({
page.waitForNavigation(),
page.locator(".update").click(),
]);
await page.locator(".done-foo").wait();
await page.locator(".done-foo-sub").wait();

const doc = parseHtml(await page.content());
assertNotSelector(doc, "button");
Expand Down

0 comments on commit 8c5e2b0

Please sign in to comment.