diff --git a/app/src/main/resources/templates/client-details/page.html b/app/src/main/resources/templates/client-details/page.html
index fbf91affc..8d7711460 100644
--- a/app/src/main/resources/templates/client-details/page.html
+++ b/app/src/main/resources/templates/client-details/page.html
@@ -45,7 +45,7 @@
             </li>
         </ul>
         <footer>
-            <form data-hx-confirm="Are you sure you want to reset the client secret? The old client secret will be immediately revoked." th:data-hx-post="|/clients/${client.clientUid()}/reset|" data-hx-target="body">
+            <form data-hx-confirm="Are you sure you want to reset the client secret? The old client secret will be immediately revoked." th:data-hx-post="|/clients/${client.clientUid()}/reset|" th:action="|/clients/${client.clientUid()}/reset|" th:method="post" data-hx-target="body">
                 <div th:replace="~{common/form-csrf}"></div>
                 <button class="outline contrast" data-loading-disable>Reset client secret</button>
             </form>
diff --git a/e2e/tests/ui/my-clients-reset-client-secret.it.ts b/e2e/tests/ui/my-clients-reset-client-secret.it.ts
new file mode 100644
index 000000000..4ec627e7f
--- /dev/null
+++ b/e2e/tests/ui/my-clients-reset-client-secret.it.ts
@@ -0,0 +1,59 @@
+import { expect, testWithMockGamma as test } from "../../helpers/test-fixtures";
+import { login } from "../../helpers/auth";
+import { uniqueLabel } from "../../helpers/strings";
+
+test("given a personal client when resetting its secret then a new secret is shown", async ({
+  page,
+  gamma,
+}) => {
+  await login(page, gamma.url, "mscott", "password1337", "Boss");
+
+  const prettyName = uniqueLabel("E2E My Client Reset");
+
+  await page.goto(`${gamma.url}/my-clients/create`, { timeout: 30000 });
+  await page.fill('input[name="prettyName"]', prettyName);
+  await page.fill('input[name="svDescription"]', "E2E svensk beskrivning");
+  await page.fill('input[name="enDescription"]', "E2E english description");
+  await page.fill('input[name="redirectUrl"]', "https://example.org/callback");
+
+  await Promise.all([
+    page.waitForURL("**/clients/*", { timeout: 15000 }),
+    page.getByRole("button", { name: "Create" }).click(),
+  ]);
+
+  const credentialsArticle = page
+    .locator("main > article")
+    .filter({ hasText: "Credentials" })
+    .first();
+  await expect(credentialsArticle).toBeVisible({ timeout: 10000 });
+
+  const oldSecret = (
+    await credentialsArticle.locator("code").first().innerText()
+  ).trim();
+  expect(oldSecret.length).toBeGreaterThan(0);
+
+  page.once("dialog", async (dialog) => dialog.accept());
+  await Promise.all([
+    page.waitForResponse(
+      (response) =>
+        response.request().method() === "POST" &&
+        response.url().includes("/clients/") &&
+        response.url().includes("/reset") &&
+        response.status() >= 200 &&
+        response.status() < 400,
+    ),
+    page.getByRole("button", { name: "Reset client secret" }).click(),
+  ]);
+
+  const newCredentialsArticle = page
+    .locator("main > article")
+    .filter({ hasText: "Credentials" })
+    .first();
+  await expect(newCredentialsArticle).toBeVisible({ timeout: 10000 });
+
+  const newSecret = (
+    await newCredentialsArticle.locator("code").first().innerText()
+  ).trim();
+  expect(newSecret.length).toBeGreaterThan(0);
+  expect(newSecret).not.toBe(oldSecret);
+});