Malibu-73/ Bug: Fix failing tests (#244)

* upgrade playwright * RECAPTCHA_DISABLED env var added * added missing static env vars * remove sentry config from vite file * added correct env vars back * Revert "remove sentry config from vite file" This reverts commit 310246b. * remove recaptcha from client if PUBLIC_RECAPTCHA_ENABLED false * update env vars from flow and .env.example * fix validation * rm RECAPTCHA_DISABLED usage * use isRecaptchaEnabled * recaptcha env vars can be any value in ci:test
prototypsthlm · Jan 10, 2025 · c3dcbd6 · c3dcbd6
1 parent b018b16
commit c3dcbd6
Show file tree

Hide file tree

Showing 10 changed files with 52 additions and 34 deletions.
diff --git a/.env.example b/.env.example
@@ -21,4 +21,4 @@ PUBLIC_SITE_URL=http://localhost:5173
 
 PUBLIC_RECAPTCHA_SITE_KEY=
 RECAPTCHA_SECRET_KEY=
-#RECAPTCHA_DISABLED=true
+PUBLIC_RECAPTCHA_ENABLED=true
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -35,9 +35,9 @@ jobs:
       ORIGIN: ${{ vars.ORIGIN }}
       SECRET_KEY: ${{ secrets.SECRET_KEY }}
       OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
-      PUBLIC_RECAPTCHA_SITE_KEY: ${{ secrets.PUBLIC_RECAPTCHA_SITE_KEY }}
-      RECAPTCHA_SECRET_KEY: ${{ secrets.RECAPTCHA_SECRET_KEY }}
-      RECAPTCHA_DISABLED: true
+      PUBLIC_RECAPTCHA_SITE_KEY: 'any-value'
+      RECAPTCHA_SECRET_KEY: 'any-value'
+      PUBLIC_RECAPTCHA_ENABLED: false
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4

diff --git a/src/lib/utils/recaptcha.client.ts b/src/lib/utils/recaptcha.client.ts
@@ -1,4 +1,4 @@
-import { PUBLIC_RECAPTCHA_SITE_KEY } from '$env/static/public'
+import { PUBLIC_RECAPTCHA_SITE_KEY, PUBLIC_RECAPTCHA_ENABLED } from '$env/static/public'
 
 export interface ReCaptcha {
   ready(callback: () => void): void
@@ -30,3 +30,5 @@ export const executeRecaptcha = async (grecaptcha: ReCaptcha): Promise<string> =
     })
   })
 }
+
+export const isRecaptchaEnabled = PUBLIC_RECAPTCHA_ENABLED === 'true'
diff --git a/src/lib/utils/recaptcha.server.ts b/src/lib/utils/recaptcha.server.ts
@@ -1,9 +1,6 @@
 import { RECAPTCHA_SECRET_KEY } from '$env/static/private'
-import { env } from '$env/dynamic/private'
 
 export async function verifyRecaptcha(response: string) {
-  if (env.RECAPTCHA_DISABLED === 'true') return
-
   const recaptchaResponse = await fetch('https://www.google.com/recaptcha/api/siteverify', {
     method: 'POST',
     headers: {

diff --git a/src/routes/forgot-password/+page.server.ts b/src/routes/forgot-password/+page.server.ts
@@ -5,6 +5,7 @@ import { fail } from '@sveltejs/kit'
 import { z, ZodError } from 'zod'
 import type { Actions } from './$types'
 import { verifyRecaptcha } from '$lib/utils/recaptcha.server'
+import { isRecaptchaEnabled } from '$lib/utils/recaptcha.client'
 
 export const actions: Actions = {
   default: async ({ request, url }) => {
@@ -13,11 +14,11 @@ export const actions: Actions = {
       const schema = z
         .object({
           email: z.string().email().toLowerCase(),
-          recaptchaToken: z.string().min(1),
+          recaptchaToken: z.string().optional(),
         })
         .parse(fields)
 
-      await verifyRecaptcha(schema.recaptchaToken)
+      if (isRecaptchaEnabled) await verifyRecaptcha(schema.recaptchaToken || '')
 
       let user = await getUserByEmail(schema.email)
 

diff --git a/src/routes/forgot-password/+page.svelte b/src/routes/forgot-password/+page.svelte
@@ -5,16 +5,18 @@
   import TacoIcon from '$lib/components/icons/TacoIcon.svelte'
   import type { ActionData } from './$types'
   import { PUBLIC_RECAPTCHA_SITE_KEY } from '$env/static/public'
-  import { executeRecaptcha } from '$lib/utils/recaptcha.client'
+  import { executeRecaptcha, isRecaptchaEnabled } from '$lib/utils/recaptcha.client'
 
   export let form: ActionData
 </script>
 
 <svelte:head>
   <title>Forgot Password</title>
-  <script
-    src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
-  ></script>
+  {#if isRecaptchaEnabled}
+    <script
+      src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
+    ></script>
+  {/if}
 </svelte:head>
 
 <div
@@ -43,8 +45,11 @@
         method="POST"
         novalidate
         use:enhance={async ({ formData }) => {
-          const recaptchaToken = await executeRecaptcha(window.grecaptcha)
-          formData.append('recaptchaToken', recaptchaToken)
+          if (isRecaptchaEnabled) {
+            const recaptchaToken = await executeRecaptcha(window.grecaptcha)
+            formData.append('recaptchaToken', recaptchaToken)
+          }
+
           return async ({ update }) => {
             return update({ reset: false })
           }

diff --git a/src/routes/signin/+page.server.ts b/src/routes/signin/+page.server.ts
@@ -7,6 +7,7 @@ import { verifyRecaptcha } from '$lib/utils/recaptcha.server'
 import { fail, redirect } from '@sveltejs/kit'
 import { z, ZodError } from 'zod'
 import type { Actions } from './$types'
+import { isRecaptchaEnabled } from '$lib/utils/recaptcha.client'
 
 export const actions: Actions = {
   default: async ({ request, cookies, url }) => {
@@ -17,15 +18,16 @@ export const actions: Actions = {
           email: z.string().email(),
           password: z.string(),
           remember: z.preprocess((value) => value === 'on', z.boolean()),
-          recaptchaToken: z.string().min(1),
+          recaptchaToken: z.string().optional(),
         })
         .refine(async (data) => doesCredentialsMatch(data.email, data.password), {
           message: 'Wrong credentials',
           path: ['password'],
         })
         .parseAsync(fields)
 
-      await verifyRecaptcha(schema.recaptchaToken)
+      if (isRecaptchaEnabled) await verifyRecaptcha(schema.recaptchaToken || '')
+
       const user = await getUserByEmail(schema.email)
 
       if (!user) {

diff --git a/src/routes/signin/+page.svelte b/src/routes/signin/+page.svelte
@@ -3,7 +3,7 @@
   import Alert from '$lib/components/Alert.svelte'
   import Input from '$lib/components/Input.svelte'
   import TacoIcon from '$lib/components/icons/TacoIcon.svelte'
-  import { executeRecaptcha } from '$lib/utils/recaptcha.client'
+  import { executeRecaptcha, isRecaptchaEnabled } from "$lib/utils/recaptcha.client";
   import type { ActionData } from './$types'
   import { PUBLIC_RECAPTCHA_SITE_KEY } from '$env/static/public'
   import Spinner from '$lib/components/Spinner.svelte'
@@ -14,9 +14,11 @@
 
 <svelte:head>
   <title>Sign in</title>
-  <script
-    src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
-  ></script>
+  {#if isRecaptchaEnabled}
+    <script
+      src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
+    ></script>
+  {/if}
 </svelte:head>
 
 <div class="min-h-screen bg-gray-50 dark:bg-gray-900 flex flex-col justify-center sm:px-6 lg:px-8">
@@ -43,9 +45,12 @@
         method="POST"
         novalidate
         use:enhance={async ({ formData }) => {
-          const recaptchaToken = await executeRecaptcha(window.grecaptcha)
-          formLoading = true
-          formData.append('recaptchaToken', recaptchaToken)
+          if (isRecaptchaEnabled) {
+            const recaptchaToken = await executeRecaptcha(window.grecaptcha)
+            formLoading = true
+            formData.append('recaptchaToken', recaptchaToken)
+          }
+
           return async ({ update }) => {
             formLoading = false
             return update({ reset: false })

diff --git a/src/routes/signup/+page.server.ts b/src/routes/signup/+page.server.ts
@@ -5,6 +5,7 @@ import { PrismaClientKnownRequestError } from '@prisma/client/runtime/library'
 import { fail, redirect } from '@sveltejs/kit'
 import { z, ZodError } from 'zod'
 import type { Actions } from './$types'
+import { isRecaptchaEnabled } from '$lib/utils/recaptcha.client'
 
 export const actions: Actions = {
   default: async ({ request, cookies, url }) => {
@@ -17,15 +18,15 @@ export const actions: Actions = {
           email: z.string().email().toLowerCase(),
           password: z.string().min(6),
           confirmPassword: z.string().min(6),
-          recaptchaToken: z.string().min(1),
+          recaptchaToken: z.string().optional(),
         })
         .refine((data) => data.password === data.confirmPassword, {
           message: "Passwords don't match",
           path: ['confirmPassword'],
         })
         .parse(fields)
 
-      await verifyRecaptcha(schema.recaptchaToken)
+      if (isRecaptchaEnabled) await verifyRecaptcha(schema.recaptchaToken || '')
 
       const user = await createUser(schema.name, schema.email, schema.password)
 

diff --git a/src/routes/signup/+page.svelte b/src/routes/signup/+page.svelte
@@ -3,7 +3,7 @@
   import Alert from '$lib/components/Alert.svelte'
   import TacoIcon from '$lib/components/icons/TacoIcon.svelte'
   import Input from '$lib/components/Input.svelte'
-  import { executeRecaptcha } from '$lib/utils/recaptcha.client'
+  import { executeRecaptcha, isRecaptchaEnabled } from '$lib/utils/recaptcha.client'
   import type { ActionData } from './$types'
   import { PUBLIC_RECAPTCHA_SITE_KEY } from '$env/static/public'
   import Spinner from '$lib/components/Spinner.svelte'
@@ -14,9 +14,11 @@
 
 <svelte:head>
   <title>Signup</title>
-  <script
-    src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
-  ></script>
+  {#if isRecaptchaEnabled}
+    <script
+      src={`https://www.google.com/recaptcha/api.js?render=${PUBLIC_RECAPTCHA_SITE_KEY}`}
+    ></script>
+  {/if}
 </svelte:head>
 
 <div class="min-h-screen bg-gray-50 dark:bg-gray-900 flex flex-col justify-center sm:px-6 lg:px-8">
@@ -43,9 +45,12 @@
         method="POST"
         novalidate
         use:enhance={async ({ formData }) => {
-          const recaptchaToken = await executeRecaptcha(window.grecaptcha)
-          formLoading = true
-          formData.append('recaptchaToken', recaptchaToken)
+          if (isRecaptchaEnabled) {
+            const recaptchaToken = await executeRecaptcha(window.grecaptcha)
+            formLoading = true
+            formData.append('recaptchaToken', recaptchaToken)
+          }
+
           return async ({ update }) => {
             formLoading = false
             return update({ reset: false })