forked from cartsnitch/cartsnitch
Merge pull request #242 from cartsnitch/dev
Promote dev → uat: remove VITE_MOCK_AUTH bypass (#181)
This commit is contained in:
@@ -4,7 +4,7 @@ import { mockAuthRoutes } from '../fixtures';
|
|||||||
const uniqueEmail = () => `betty+e2e-${Date.now()}@cartsnitch.test`;
|
const uniqueEmail = () => `betty+e2e-${Date.now()}@cartsnitch.test`;
|
||||||
|
|
||||||
test.describe('J1: Registration and Login', () => {
|
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 mockAuthRoutes(page, false);
|
||||||
await page.goto('/register');
|
await page.goto('/register');
|
||||||
await page.fill('[placeholder="Full Name"]', 'Betty Tester');
|
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.fill('[placeholder="Password (min. 8 characters)"]', 'TestPass123!');
|
||||||
await page.click('button[type="submit"]');
|
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 }) => {
|
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();
|
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);
|
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.goto('/login');
|
||||||
await page.fill('[placeholder="Email"]', 'test@cartsnitch.test');
|
await page.fill('[placeholder="Email"]', 'test@cartsnitch.test');
|
||||||
await page.fill('[placeholder="Password"]', 'TestPass123!');
|
await page.fill('[placeholder="Password"]', 'TestPass123!');
|
||||||
|
|||||||
Generated
+3
-3
@@ -8164,9 +8164,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/postcss": {
|
"node_modules/postcss": {
|
||||||
"version": "8.5.8",
|
"version": "8.5.13",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.13.tgz",
|
||||||
"integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==",
|
"integrity": "sha512-qif0+jGGZoLWdHey3UFHHWP0H7Gbmsk8T5VEqyYFbWqPr1XqvLGBbk/sl8V5exGmcYJklJOhOQq1pV9IcsiFag==",
|
||||||
"devOptional": true,
|
"devOptional": true,
|
||||||
"funding": [
|
"funding": [
|
||||||
{
|
{
|
||||||
|
|||||||
+1
-8
@@ -1,14 +1,12 @@
|
|||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import { Link } from 'react-router-dom'
|
import { Link } from 'react-router-dom'
|
||||||
import { authClient } from '../lib/auth-client.ts'
|
import { authClient } from '../lib/auth-client.ts'
|
||||||
import { useAuthStore } from '../stores/auth.ts'
|
|
||||||
|
|
||||||
export function Login() {
|
export function Login() {
|
||||||
const [email, setEmail] = useState('')
|
const [email, setEmail] = useState('')
|
||||||
const [password, setPassword] = useState('')
|
const [password, setPassword] = useState('')
|
||||||
const [error, setError] = useState('')
|
const [error, setError] = useState('')
|
||||||
const [loading, setLoading] = useState(false)
|
const [loading, setLoading] = useState(false)
|
||||||
const setAuthenticated = useAuthStore((s) => s.setAuthenticated)
|
|
||||||
|
|
||||||
async function handleSubmit(e: React.FormEvent) {
|
async function handleSubmit(e: React.FormEvent) {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
@@ -40,12 +38,7 @@ export function Login() {
|
|||||||
setError('Sign in failed. Please try again.')
|
setError('Sign in failed. Please try again.')
|
||||||
}
|
}
|
||||||
} catch {
|
} catch {
|
||||||
if (import.meta.env.VITE_MOCK_AUTH === 'true') {
|
setError('Invalid email or password. Please try again.')
|
||||||
setAuthenticated(true)
|
|
||||||
window.location.href = '/'
|
|
||||||
} else {
|
|
||||||
setError('Invalid email or password. Please try again.')
|
|
||||||
}
|
|
||||||
} finally {
|
} finally {
|
||||||
setLoading(false)
|
setLoading(false)
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-47
@@ -8,9 +8,6 @@ export function Register() {
|
|||||||
const [password, setPassword] = useState('')
|
const [password, setPassword] = useState('')
|
||||||
const [error, setError] = useState('')
|
const [error, setError] = useState('')
|
||||||
const [loading, setLoading] = useState(false)
|
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) {
|
async function handleSubmit(e: React.FormEvent) {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
@@ -38,7 +35,7 @@ export function Register() {
|
|||||||
throw new Error(authError.message ?? 'Registration failed')
|
throw new Error(authError.message ?? 'Registration failed')
|
||||||
}
|
}
|
||||||
|
|
||||||
setRegistrationComplete(true)
|
setError('Account created! Please sign in.')
|
||||||
} catch {
|
} catch {
|
||||||
setError('Registration failed. Please try again.')
|
setError('Registration failed. Please try again.')
|
||||||
} finally {
|
} 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 (
|
return (
|
||||||
<div className="flex min-h-screen flex-col items-center justify-center px-4">
|
<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>
|
<h1 className="mb-2 text-3xl font-bold text-gray-900">Create Account</h1>
|
||||||
|
|||||||
Reference in New Issue
Block a user