fix: remove unnecessary /signout appending to signout form action URL (#9901)

* fix: remove unnecessary /signout appending to signout form action URL

* fix: default to /signout

* fix: default to /auth/signout

* fix: add tests for signout page

* fix: more testing with mocking component that returns jsx

* fix: cleanup core/pages test

* fix: export SigninProps

* fix: add preact vitest plugin and cleanup pages rendering tests

* Discard changes to packages/core/src/lib/pages/signin.tsx

* fix: signout page, default to instance of URL

* fix: add optional chain to url

* fix: update fixture

* fix: fixture AuthConfig

* fix: cleanup pages test

Author: ndom91

packages/core/src/lib/pages/signout.tsx

@@ -37,7 +37,7 @@ export default function SignoutPage(props: SignoutProps) {
         {theme?.logo && <img src={theme.logo} alt="Logo" className="logo" />}
         <h1>Signout</h1>
         <p>Are you sure you want to sign out?</p>
-        <form action={`${url}/signout`} method="POST">
+        <form action={url?.toString()} method="POST">
           <input type="hidden" name="csrfToken" value={csrfToken} />
           <button id="submitButton" type="submit">
             Sign out

packages/core/test/fixtures/pages.ts

@@ -0,0 +1,56 @@
+import type { AuthConfig } from "../../src/types"
+
+const userProfile = {
+  id: "abc",
+  name: "Fill Murray",
+  email: "[email protected]",
+  image: "https://source.boringavatars.com/marble",
+}
+
+export const authOptions = {
+  debug: false,
+  pages: {},
+  theme: {
+    colorScheme: "auto" as const,
+    logo: "",
+    brandColor: "",
+    buttonText: "",
+  },
+  session: {
+    strategy: "jwt" as const,
+    maxAge: 2592000,
+    updateAge: 86400,
+    generateSessionToken: () => "abc123",
+  },
+  providers: [
+    {
+      id: "github",
+      name: "GitHub",
+      type: "oauth" as const,
+      authorization: `https://github.com/login/oauth/authorize`,
+      token: `https://github.com/login/oauth/access_token`,
+      userinfo: {
+        url: `https://github.com/user`,
+        async request() {
+          return userProfile
+        },
+      },
+      profile: () => userProfile,
+      style: { logo: "", bg: "", text: "" },
+      clientId: "abc",
+      clientSecret: "abc",
+      redirectProxyUrl: undefined,
+      checks: [],
+      account: () => {},
+    },
+  ],
+  basePath: "/auth",
+  secret: ["abc"],
+  redirectProxyUrl: undefined,
+  trustHost: true,
+  adapter: undefined,
+  logger: {
+    error: (msg: Error) => console.error(msg),
+  },
+  experimental: {},
+} satisfies AuthConfig

packages/core/test/pages.test.ts

@@ -0,0 +1,75 @@
+import { vi, expect, it, describe, beforeEach } from "vitest"
+import renderPage from "../src/lib/pages/index"
+import { authOptions } from "./fixtures/pages"
+import { init } from "../src/lib/init"
+
+describe("pages", () => {
+  describe("sign-out", () => {
+    beforeEach(() => {
+      vi.resetAllMocks()
+    })
+
+    it("should attempt to render signout page", async () => {
+      // Generated when visiting `/auth/signout`
+      const { options } = await init({
+        authOptions,
+        action: "signout",
+        providerId: "github",
+        url: new URL("http://localhost:3000/auth/signout"),
+        cookies: {},
+        isPost: true,
+        csrfDisabled: true,
+      })
+
+      const render = renderPage({ ...options, query: {}, cookies: [] })
+      const signOutPage = render.signout()
+
+      expect(signOutPage.body).toContain(`<title>Sign Out</title>`)
+      expect(signOutPage.body).toContain(
+        `action="http://localhost:3000/auth/signout"`
+      )
+    })
+
+    it("should return correct URL for signout page form action", async () => {
+      // When visiting `/auth/signout`, for example
+      const { options } = await init({
+        authOptions: authOptions,
+        action: "signout",
+        providerId: "github",
+        url: new URL("http://localhost:3000/auth/signout"),
+        cookies: {},
+        isPost: true,
+        csrfDisabled: true,
+      })
+
+      expect(options.url).toBeInstanceOf(URL)
+      expect(options.url.toString()).toBe("http://localhost:3000/auth/signout")
+    })
+  })
+  describe("sign-in", () => {
+    beforeEach(() => {
+      vi.resetAllMocks()
+    })
+
+    it("should attempt to render signin page", async () => {
+      // Generated when visiting `/auth/signin`
+      const { options } = await init({
+        authOptions: authOptions,
+        action: "signin",
+        providerId: "github",
+        url: new URL("http://localhost:3000/auth/signin"),
+        cookies: {},
+        isPost: true,
+        csrfDisabled: true,
+      })
+
+      const render = renderPage({ ...options, query: {}, cookies: [] })
+      const signInPage = render.signin()
+
+      expect(signInPage.body).toContain(`<title>Sign In</title>`)
+      expect(signInPage.body).toContain(
+        `action="http://localhost:3000/auth/signin/github"`
+      )
+    })
+  })
+})

packages/utils/package.json

@@ -3,7 +3,8 @@
   "private": true,
   "version": "0.0.0",
   "devDependencies": {
-    "@auth/core": "workspace:*"
+    "@auth/core": "workspace:*",
+    "@preact/preset-vite": "^2.8.1"
   },
   "type": "module",
   "dependencies": {

packages/utils/vitest.config.ts

@@ -2,6 +2,7 @@
 
 import { defineConfig } from "vite"
 import swc from "unplugin-swc"
+import preact from "@preact/preset-vite"
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -16,5 +17,5 @@ export default defineConfig({
     },
     setupFiles: ["../utils/vitest-setup.ts"],
   },
-  plugins: [swc.vite()],
+  plugins: [swc.vite(), preact()],
 })