blackcanyontickets/reactrebuild0825/tests/persistent-auth.spec.ts

import { test, expect } from '@playwright/test';

test.describe('Persistent Authentication', () => {
  test.beforeEach(async ({ page }) => {
    // Clear any existing auth state
    await page.goto('/login');
    await page.evaluate(() => {
      localStorage.removeItem('bct_auth_user');
      localStorage.removeItem('bct_auth_remember');
      sessionStorage.clear();
    });
  });

  test('should persist login when "Remember me" is checked', async ({ page }) => {
    // Go to login page
    await page.goto('/login');
    
    // Fill in login form with remember me checked (default)
    await page.fill('input[type="email"]', 'admin@example.com');
    await page.fill('input[type="password"]', 'password123');
    
    // Verify remember me is checked by default
    const rememberCheckbox = page.locator('input[type="checkbox"]');
    await expect(rememberCheckbox).toBeChecked();
    
    // Submit login
    await page.click('[data-testid="loginBtn"]');
    
    // Wait for redirect to dashboard
    await expect(page).toHaveURL('/dashboard');
    
    // Verify user is logged in
    await expect(page.locator('text=Admin User')).toBeVisible();
    
    // Check that auth data was stored in localStorage
    const authUser = await page.evaluate(() => localStorage.getItem('bct_auth_user'));
    const rememberMe = await page.evaluate(() => localStorage.getItem('bct_auth_remember'));
    
    expect(authUser).toBeTruthy();
    expect(rememberMe).toBe('true');
    
    // Parse and verify stored user data
    const userData = JSON.parse(authUser!);
    expect(userData.email).toBe('admin@example.com');
    expect(userData.role).toBe('admin');
    
    // Refresh the page to test persistence
    await page.reload();
    
    // Should still be on dashboard (not redirected to login)
    await expect(page).toHaveURL('/dashboard');
    await expect(page.locator('text=Admin User')).toBeVisible();
  });

  test('should not persist login when "Remember me" is unchecked', async ({ page }) => {
    // Go to login page
    await page.goto('/login');
    
    // Fill in login form and uncheck remember me
    await page.fill('input[type="email"]', 'admin@example.com');
    await page.fill('input[type="password"]', 'password123');
    
    // Uncheck remember me
    await page.uncheck('input[type="checkbox"]');
    
    // Submit login
    await page.click('[data-testid="loginBtn"]');
    
    // Wait for redirect to dashboard
    await expect(page).toHaveURL('/dashboard');
    
    // Check that auth data was NOT stored persistently
    const rememberMe = await page.evaluate(() => localStorage.getItem('bct_auth_remember'));
    expect(rememberMe).toBe('false');
    
    // Refresh the page
    await page.reload();
    
    // Should be redirected to login (session not persisted)
    await expect(page).toHaveURL(/\/login/);
  });

  test('should restore user session on app restart with remember me', async ({ page }) => {
    // Manually set auth data in localStorage (simulating previous login)
    await page.goto('/login');
    await page.evaluate(() => {
      const mockUser = {
        id: 'user-admin-001',
        email: 'admin@example.com',
        name: 'Admin User',
        role: 'admin',
        organization: {
          id: 'org-001',
          name: 'Black Canyon Tickets',
          slug: 'bct-main'
        },
        preferences: {
          theme: 'dark',
          emailNotifications: true,
          dashboardLayout: 'grid'
        },
        metadata: {
          createdAt: '2024-01-01T00:00:00Z',
          lastLogin: new Date().toISOString(),
          loginCount: 42
        }
      };
      
      localStorage.setItem('bct_auth_user', JSON.stringify(mockUser));
      localStorage.setItem('bct_auth_remember', 'true');
    });
    
    // Navigate to a protected route (dashboard)
    await page.goto('/dashboard');
    
    // Should be automatically logged in
    await expect(page).toHaveURL('/dashboard');
    await expect(page.locator('text=Admin User')).toBeVisible();
    
    // Verify the auth context has the restored user
    const isAuthenticated = await page.evaluate(() => {
      return document.body.textContent?.includes('Admin User');
    });
    
    expect(isAuthenticated).toBe(true);
  });

  test('should handle logout and clear stored auth', async ({ page }) => {
    // Set up authenticated state
    await page.goto('/login');
    await page.fill('input[type="email"]', 'admin@example.com');
    await page.fill('input[type="password"]', 'password123');
    await page.click('[data-testid="loginBtn"]');
    
    await expect(page).toHaveURL('/dashboard');
    
    // Verify auth data exists
    const authUserBefore = await page.evaluate(() => localStorage.getItem('bct_auth_user'));
    expect(authUserBefore).toBeTruthy();
    
    // Click logout button (assuming it exists in header/sidebar)
    const logoutButton = page.locator('[data-testid="logout"], button:has-text("Logout"), button:has-text("Sign Out")').first();
    
    if (await logoutButton.isVisible()) {
      await logoutButton.click();
      
      // Should be redirected to login
      await expect(page).toHaveURL(/\/login/);
      
      // Verify auth data was cleared
      const authUserAfter = await page.evaluate(() => localStorage.getItem('bct_auth_user'));
      const rememberAfter = await page.evaluate(() => localStorage.getItem('bct_auth_remember'));
      
      expect(authUserAfter).toBeNull();
      expect(rememberAfter).toBeNull();
    } else {
      console.log('Logout button not found - this test may need adjustment based on UI');
    }
  });

  test('should handle quick login with remember me enabled', async ({ page }) => {
    await page.goto('/login');
    
    // Click the Admin quick login button
    await page.click('button:has-text("Admin")');
    
    // Verify form was populated
    await expect(page.locator('input[type="email"]')).toHaveValue('admin@example.com');
    await expect(page.locator('input[type="password"]')).toHaveValue('password123');
    
    // Verify remember me is checked (should be set to true by quick login)
    const rememberCheckbox = page.locator('input[type="checkbox"]');
    await expect(rememberCheckbox).toBeChecked();
    
    // Submit login
    await page.click('[data-testid="loginBtn"]');
    
    // Should login successfully and persist
    await expect(page).toHaveURL('/dashboard');
    
    const rememberMe = await page.evaluate(() => localStorage.getItem('bct_auth_remember'));
    expect(rememberMe).toBe('true');
  });
});