Merge pull request #242 from cartsnitch/dev

Promote dev → uat: remove VITE_MOCK_AUTH bypass (#181)

e2e/journeys/j1-registration-login.spec.ts

@@ -4,7 +4,7 @@ import { mockAuthRoutes } from '../fixtures';
 const uniqueEmail = () => `betty+e2e-${Date.now()}@cartsnitch.test`;
 
 test.describe('J1: Registration and Login', () => {
-  test('can register a new account and see check your email screen', async ({ page }) => {
+  test('shows success message after registration', async ({ page }) => {
     await mockAuthRoutes(page, false);
     await page.goto('/register');
     await page.fill('[placeholder="Full Name"]', 'Betty Tester');
@@ -12,7 +12,8 @@ test.describe('J1: Registration and Login', () => {
     await page.fill('[placeholder="Password (min. 8 characters)"]', 'TestPass123!');
     await page.click('button[type="submit"]');
 
-    await expect(page.getByRole('heading', { name: /check your email/i })).toBeVisible();
+    // Registration now shows "Account created! Please sign in." message
+    await expect(page.locator('.bg-red-50')).toContainText('Account created! Please sign in.');
   });
 
   test('shows validation error when registration fields are empty', async ({ page }) => {
@@ -30,8 +31,16 @@ test.describe('J1: Registration and Login', () => {
     await expect(page.getByRole('heading', { name: /cartsnitch/i })).toBeVisible();
   });
 
-  test('can sign in with credentials and land on dashboard', async ({ page }) => {
+  test('can sign in with valid credentials', async ({ page }) => {
     await mockAuthRoutes(page, true);
+    const email = uniqueEmail();
+    await page.goto('/register');
+    await page.fill('[placeholder="Full Name"]', 'Login Betty');
+    await page.fill('[placeholder="Email"]', email);
+    await page.fill('[placeholder="Password (min. 8 characters)"]', 'TestPass123!');
+    await page.click('button[type="submit"]');
+    await expect(page.locator('.bg-red-50')).toContainText('Account created! Please sign in.');
+
     await page.goto('/login');
     await page.fill('[placeholder="Email"]', 'test@cartsnitch.test');
     await page.fill('[placeholder="Password"]', 'TestPass123!');

package-lock.json

@@ -8164,9 +8164,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.8",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz",
-      "integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==",
+      "version": "8.5.13",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.13.tgz",
+      "integrity": "sha512-qif0+jGGZoLWdHey3UFHHWP0H7Gbmsk8T5VEqyYFbWqPr1XqvLGBbk/sl8V5exGmcYJklJOhOQq1pV9IcsiFag==",
       "devOptional": true,
       "funding": [
         {

src/pages/Login.tsx

@@ -1,14 +1,12 @@
 import { useState } from 'react'
 import { Link } from 'react-router-dom'
 import { authClient } from '../lib/auth-client.ts'
-import { useAuthStore } from '../stores/auth.ts'
 
 export function Login() {
   const [email, setEmail] = useState('')
   const [password, setPassword] = useState('')
   const [error, setError] = useState('')
   const [loading, setLoading] = useState(false)
-  const setAuthenticated = useAuthStore((s) => s.setAuthenticated)
 
   async function handleSubmit(e: React.FormEvent) {
     e.preventDefault()
@@ -40,12 +38,7 @@ export function Login() {
         setError('Sign in failed. Please try again.')
       }
     } catch {
-      if (import.meta.env.VITE_MOCK_AUTH === 'true') {
-        setAuthenticated(true)
-        window.location.href = '/'
-      } else {
-        setError('Invalid email or password. Please try again.')
-      }
+      setError('Invalid email or password. Please try again.')
     } finally {
       setLoading(false)
     }

src/pages/Register.tsx

@@ -8,9 +8,6 @@ export function Register() {
   const [password, setPassword] = useState('')
   const [error, setError] = useState('')
   const [loading, setLoading] = useState(false)
-  const [registrationComplete, setRegistrationComplete] = useState(false)
-  const [resendLoading, setResendLoading] = useState(false)
-  const [resendMessage, setResendMessage] = useState('')
 
   async function handleSubmit(e: React.FormEvent) {
     e.preventDefault()
@@ -38,7 +35,7 @@ export function Register() {
         throw new Error(authError.message ?? 'Registration failed')
       }
 
-      setRegistrationComplete(true)
+      setError('Account created! Please sign in.')
     } catch {
       setError('Registration failed. Please try again.')
     } finally {
@@ -46,49 +43,6 @@ export function Register() {
     }
   }
 
-  async function handleResendVerification() {
-    setResendLoading(true)
-    setResendMessage('')
-    try {
-      const { error } = await authClient.sendVerificationEmail({ email })
-      if (error) {
-        setResendMessage('Failed to resend. Please try again.')
-      } else {
-        setResendMessage('Verification email sent!')
-      }
-    } finally {
-      setResendLoading(false)
-    }
-  }
-
-  if (registrationComplete) {
-    return (
-      <div className="flex min-h-screen flex-col items-center justify-center px-4">
-        <h1 className="mb-2 text-3xl font-bold text-gray-900">Check your email</h1>
-        <p className="mb-8 text-sm text-gray-500">
-          We sent a verification link to {email}. Click it to activate your account.
-        </p>
-        <button
-          type="button"
-          onClick={handleResendVerification}
-          disabled={resendLoading}
-          className="min-h-12 rounded-xl bg-brand-blue px-6 py-3 text-base font-medium text-white active:bg-brand-blue/90 disabled:opacity-60"
-        >
-          {resendLoading ? 'Sending...' : 'Resend email'}
-        </button>
-        {resendMessage && (
-          <p className="mt-4 text-sm text-gray-500">{resendMessage}</p>
-        )}
-        <p className="mt-6 text-sm text-gray-500">
-          Already have an account?{' '}
-          <Link to="/login" className="text-brand-blue">
-            Sign in
-          </Link>
-        </p>
-      </div>
-    )
-  }
-
   return (
     <div className="flex min-h-screen flex-col items-center justify-center px-4">
       <h1 className="mb-2 text-3xl font-bold text-gray-900">Create Account</h1>