@jmruthers/pace-core 0.2.7 → 0.5.1

package/src/components/PaceAppLayout/__tests__/PaceAppLayout.security.test.tsx

@@ -1,782 +0,0 @@
-import React from 'react';
-import { screen, fireEvent, waitFor } from '@testing-library/react';
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import '@testing-library/jest-dom';
-import { BrowserRouter, useLocation } from 'react-router-dom';
-import { renderWithProviders, rerenderWithProviders } from '../../../__tests__/shared';
-
-// Mock React Router hooks
-const mockNavigate = vi.fn();
-const mockLocation = { pathname: '/test-path' };
-vi.mock('react-router-dom', async () => {
-  const actual = await vi.importActual('react-router-dom');
-  return {
-    ...actual,
-    useNavigate: () => mockNavigate,
-    useLocation: () => mockLocation,
-    Outlet: () => <div data-testid="mock-outlet">Mock Outlet Content</div>
-  };
-});
-
-// Mock UnifiedAuthProvider
-const mockSignOut = vi.fn().mockResolvedValue({ error: null });
-const mockUpdatePassword = vi.fn().mockResolvedValue({ error: null });
-const mockUser = {
-  id: 'test-user-id',
-  email: 'test@example.com',
-  user_metadata: { 
-    display_name: 'Test User',
-    organisationId: 'test-org-123',
-    eventId: 'test-event-456',
-    appId: 'test-app-789'
-  }
-};
-
-vi.mock('../../../providers/UnifiedAuthProvider', () => ({
-  useUnifiedAuth: () => ({
-    user: mockUser,
-    signOut: mockSignOut,
-    updatePassword: mockUpdatePassword,
-    isAuthenticated: true,
-    authLoading: false,
-    authError: null,
-    supabase: null,
-    appName: 'Test App',
-    signIn: vi.fn().mockResolvedValue({ error: null }),
-    signUp: vi.fn().mockResolvedValue({ error: null }),
-    resetPassword: vi.fn().mockResolvedValue({ error: null }),
-    refreshSession: vi.fn().mockResolvedValue({ error: null }),
-    permissions: {},
-    roles: [],
-    accessLevel: 'viewer',
-    rbacLoading: false,
-    rbacError: null,
-    selectedEventId: null,
-    appConfig: null,
-    userEventAccess: [],
-    eventAccessLoading: false,
-    selectedOrganisationId: 'test-org-id',
-    requireOrganisationContext: vi.fn().mockReturnValue('test-org-id'),
-    hasPermission: vi.fn().mockReturnValue(true),
-    hasAnyPermission: vi.fn().mockReturnValue(true),
-    hasAllPermissions: vi.fn().mockReturnValue(true),
-    hasRole: vi.fn().mockReturnValue(true),
-    hasAccessLevel: vi.fn().mockReturnValue(true),
-    canAccess: vi.fn().mockReturnValue(true),
-    validatePermission: vi.fn().mockResolvedValue(true),
-    validateAccess: vi.fn().mockResolvedValue(true),
-    refreshPermissions: vi.fn().mockResolvedValue(undefined),
-    setSelectedEventId: vi.fn(),
-    loadUserEventAccess: vi.fn().mockResolvedValue(undefined),
-    getUserEventAccess: vi.fn().mockReturnValue(undefined),
-    rbacEnabled: false,
-    isLoading: false,
-    hasErrors: false
-  })
-}));
-
-// Mock OrganisationProvider
-const mockOrganisation = {
-  id: 'test-org-id',
-  name: 'Test Organisation',
-  display_name: 'Test Organisation',
-  description: 'Test organisation for testing',
-  subscription_tier: 'basic',
-  settings: {},
-  is_active: true,
-  created_at: '2023-01-01T00:00:00Z',
-  updated_at: '2023-01-01T00:00:00Z'
-};
-
-const mockOrganisationContext = {
-  selectedOrganisation: mockOrganisation,
-  organisations: [mockOrganisation],
-  userMemberships: [{
-    id: 'test-membership-id',
-    user_id: 'test-user-id',
-    organisation_id: 'test-org-id',
-    role: 'org_admin',
-    granted_at: '2023-01-01T00:00:00Z',
-    status: 'active' as const,
-    created_at: '2023-01-01T00:00:00Z',
-    updated_at: '2023-01-01T00:00:00Z'
-  }],
-  isLoading: false,
-  error: null,
-  hasValidOrganisationContext: true,
-  setSelectedOrganisation: vi.fn(),
-  switchOrganisation: vi.fn().mockResolvedValue(undefined),
-  getUserRole: vi.fn().mockReturnValue('member'),
-  validateOrganisationAccess: vi.fn().mockReturnValue(true),
-  ensureOrganisationContext: vi.fn().mockReturnValue(mockOrganisation),
-  refreshOrganisations: vi.fn().mockResolvedValue(undefined),
-  getPrimaryOrganisation: vi.fn().mockReturnValue(mockOrganisation),
-  isOrganisationSecure: vi.fn().mockReturnValue(true)
-};
-
-vi.mock('../../../providers/OrganisationProvider', () => ({
-  OrganisationProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
-  useOrganisations: () => mockOrganisationContext
-}));
-
-// Mock the new RBAC system for security testing
-const mockIsPermitted = vi.fn().mockResolvedValue(true);
-const mockCheckPermission = vi.fn().mockResolvedValue(true);
-
-vi.mock('../../../rbac/api', () => ({
-  isPermitted: vi.fn().mockResolvedValue(true),
-  getPermissionMap: vi.fn().mockResolvedValue({}),
-  getAccessLevel: vi.fn().mockResolvedValue('viewer'),
-  isSuperAdmin: vi.fn().mockResolvedValue(false),
-  setupRBAC: vi.fn()
-}));
-
-// Mock child components
-vi.mock('../../Header', () => ({
-  Header: vi.fn(({ appName, user, onSignOut, onChangePassword, onNavigate, currentPath, logo, userMenu, actions }) => (
-    <header data-testid="mock-header" role="banner">
-      <div data-testid="app-name">{appName ?? 'Test App'}</div>
-      <div data-testid="user-info">{user?.user_metadata?.display_name || user?.email}</div>
-      <nav data-testid="navigation">
-        <button 
-          data-testid="home-nav" 
-          onClick={() => onNavigate({ id: 'home', label: 'Home', href: '/' })}
-        >
-          Home
-        </button>
-        <button 
-          data-testid="dashboard-nav" 
-          onClick={() => onNavigate({ id: 'dashboard', label: 'Dashboard', href: '/dashboard' })}
-        >
-          Dashboard
-        </button>
-        <button 
-          data-testid="admin-nav" 
-          onClick={() => onNavigate({ id: 'admin', label: 'Admin', href: '/admin' })}
-        >
-          Admin
-        </button>
-      </nav>
-      <button 
-        data-testid="sign-out-button" 
-        onClick={() => onSignOut()}
-      >
-        Sign Out
-      </button>
-      <button 
-        data-testid="change-password-button" 
-        onClick={() => onChangePassword('newpassword123')}
-      >
-        Change Password
-      </button>
-      <div data-testid="current-path">{currentPath}</div>
-      {logo && <div data-testid="custom-logo">{logo}</div>}
-      {userMenu && <div data-testid="custom-user-menu">{userMenu}</div>}
-      {actions && <div data-testid="header-actions">{actions}</div>}
-    </header>
-  ))
-}));
-
-vi.mock('../../Footer', () => ({
-  Footer: vi.fn(() => <footer data-testid="mock-footer" role="contentinfo">Mock Footer</footer>)
-}));
-
-// Mock window.location
-Object.defineProperty(window, 'location', {
-  value: {
-    pathname: '/test-path'
-  },
-  writable: true
-});
-
-import { PaceAppLayout } from '../PaceAppLayout';
-// Define Operation type locally since old RBAC types are removed
-type Operation = 'read' | 'create' | 'update' | 'delete' | 'manage';
-
-// Wrapper component to provide Router context
-const TestWrapper = ({ children }: { children: React.ReactNode }) => (
-  <BrowserRouter>
-    {children}
-  </BrowserRouter>
-);
-
-describe('PaceAppLayout Security', () => {
-  beforeEach(async () => {
-    vi.clearAllMocks();
-    vi.resetModules();
-    mockCheckPermission.mockClear();
-    mockCheckPermission.mockResolvedValue(true);
-    mockIsPermitted.mockClear();
-    mockIsPermitted.mockResolvedValue(true);
-    
-    // Reset the mocked function
-    const { isPermitted } = await import('../../../rbac/api');
-    vi.mocked(isPermitted).mockClear();
-    vi.mocked(isPermitted).mockResolvedValue(true);
-    
-    // Ensure the user mock is properly reset
-    Object.assign(mockUser, {
-      id: 'test-user-id',
-      email: 'test@example.com',
-      user_metadata: { 
-        display_name: 'Test User',
-        organisationId: 'test-org-123',
-        eventId: 'test-event-456',
-        appId: 'test-app-789'
-      }
-    });
-  });
-
-  describe('Permission Enforcement', () => {
-    it('enforces permissions when enabled', async () => {
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={true} />
-        </TestWrapper>
-      );
-      
-      // With permission enforcement enabled and proper organisation context,
-      // the component should render normally (permission check passes)
-      await waitFor(() => {
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        expect(screen.getByTestId('mock-outlet')).toBeInTheDocument();
-      });
-    });
-
-    it('prevents access when user lacks permission', async () => {
-      // Mock the RBAC system to deny permission
-      const { isPermitted } = await import('../../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={true} />
-        </TestWrapper>
-      );
-      
-      // Should show access denied when permission is denied
-      await waitFor(() => {
-        expect(screen.getByText('Access Denied')).toBeInTheDocument();
-        expect(screen.getByText("You don't have permission to access this page.")).toBeInTheDocument();
-      });
-    });
-
-    it('enforces route-specific permissions', async () => {
-      const routePermissions: Record<string, Operation> = {
-        '/admin': 'delete',
-        '/dashboard': 'read'
-      };
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            enforcePermissions={true}
-            routePermissions={routePermissions}
-          />
-        </TestWrapper>
-      );
-      
-      // With route-specific permissions and proper organisation context,
-      // the component should render normally (permission check passes)
-      await waitFor(() => {
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        expect(screen.getByTestId('mock-outlet')).toBeInTheDocument();
-      });
-    });
-
-    it('handles permission check failures securely', async () => {
-      // Mock the RBAC system to throw an error
-      const { isPermitted } = await import('../../../rbac/api');
-      vi.mocked(isPermitted).mockRejectedValue(new Error('Permission check failed'));
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={true} />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        // When permission check throws an error, should show Permission Error page
-        expect(screen.getByText('Permission Error')).toBeInTheDocument();
-        expect(screen.getByText('Permission check failed')).toBeInTheDocument();
-      });
-    });
-
-    it('prevents bypassing permission checks', async () => {
-      // Test that permission checks cannot be bypassed by manipulating props
-      const { rerender } = renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={true} />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        // With permission enforcement enabled, the component should render normally
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        expect(screen.getByTestId('mock-outlet')).toBeInTheDocument();
-      });
-      
-      // Try to bypass by changing props
-      mockIsPermitted.mockClear();
-      rerenderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={false} />
-        </TestWrapper>
-      );
-      
-      // Should not call permission check when disabled
-      expect(mockIsPermitted).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('Navigation Security', () => {
-    it('filters navigation items based on permissions', async () => {
-      // Mock permission check to deny access to admin
-      mockIsPermitted.mockImplementation((userId, scope, operation, pageId) => {
-        if (pageId === 'admin') return Promise.resolve(false);
-        return Promise.resolve(true);
-      });
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            enforcePermissions={true}
-            filterNavigationByPermissions={true}
-            routePermissions={{
-              '/admin': 'delete',
-              '/dashboard': 'read'
-            }}
-          />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        // With permission enforcement enabled, the component should render normally
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        expect(screen.getByTestId('mock-outlet')).toBeInTheDocument();
-      });
-    });
-
-    it('prevents navigation to unauthorized routes', () => {
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Test that navigation is properly handled
-      fireEvent.click(screen.getByTestId('admin-nav'));
-      expect(mockNavigate).toHaveBeenCalledWith('/admin');
-    });
-
-    it('handles navigation items without proper href securely', () => {
-      const customNavItems = [
-        { id: 'malicious', label: 'Malicious', href: 'javascript:alert("xss")' },
-        { id: 'safe', label: 'Safe', href: '/safe' }
-      ];
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" navItems={customNavItems} />
-        </TestWrapper>
-      );
-      
-      // Should not crash or execute malicious code
-      expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-    });
-  });
-
-  describe('Authentication Security', () => {
-    it('handles authentication securely', async () => {
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      fireEvent.click(screen.getByTestId('sign-out-button'));
-      
-      await waitFor(() => {
-        expect(mockSignOut).toHaveBeenCalled();
-      });
-    });
-
-    it('handles password changes securely', async () => {
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      fireEvent.click(screen.getByTestId('change-password-button'));
-      
-      await waitFor(() => {
-        expect(mockUpdatePassword).toHaveBeenCalledWith('newpassword123');
-      });
-    });
-
-    it('prevents authentication bypass', async () => {
-      // Test that authentication cannot be bypassed
-      const { rerender } = renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Simulate user becoming null by temporarily overriding the mock
-      const originalUser = mockUser;
-      Object.assign(mockUser, { ...mockUser, id: null });
-      
-      rerenderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Should handle null user gracefully
-      const headerElements = screen.getAllByTestId('mock-header');
-      const lastHeader = headerElements[headerElements.length - 1];
-      expect(lastHeader).toBeInTheDocument();
-      
-      // Restore original user
-      Object.assign(mockUser, originalUser);
-    });
-  });
-
-  describe('Data Isolation', () => {
-    it('isolates user data between different users', () => {
-      const user1 = {
-        id: 'user-1',
-        email: 'user1@example.com',
-        user_metadata: { display_name: 'User 1' }
-      };
-      
-      const user2 = {
-        id: 'user-2',
-        email: 'user2@example.com',
-        user_metadata: { display_name: 'User 2' }
-      };
-      
-      // Test first user by temporarily overriding the mock
-      const originalMock = mockUser;
-      Object.assign(mockUser, user1);
-      
-      const { unmount } = renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={false} />
-        </TestWrapper>
-      );
-      
-      expect(screen.getByTestId('user-info')).toHaveTextContent('User 1');
-      unmount();
-      
-      // Test second user
-      Object.assign(mockUser, user2);
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={false} />
-        </TestWrapper>
-      );
-      
-      expect(screen.getByTestId('user-info')).toHaveTextContent('User 2');
-      
-      // Restore original mock
-      Object.assign(mockUser, originalMock);
-    });
-
-    it('isolates organisation context', () => {
-      const org1 = {
-        id: 'org-1',
-        name: 'Organisation 1',
-        display_name: 'Organisation 1'
-      };
-      
-      const org2 = {
-        id: 'org-2',
-        name: 'Organisation 2',
-        display_name: 'Organisation 2'
-      };
-      
-      // Test that organisation context is properly isolated
-      vi.doMock('../../../providers/OrganisationProvider', () => ({
-        OrganisationProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
-        useOrganisations: () => ({
-          ...mockOrganisationContext,
-          selectedOrganisation: org1
-        })
-      }));
-      
-      const { rerender } = renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Change organisation context
-      vi.doMock('../../../providers/OrganisationProvider', () => ({
-        OrganisationProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
-        useOrganisations: () => ({
-          ...mockOrganisationContext,
-          selectedOrganisation: org2
-        })
-      }));
-      
-      rerenderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Should handle organisation changes gracefully
-      const headerElements = screen.getAllByTestId('mock-header');
-      const lastHeader = headerElements[headerElements.length - 1];
-      expect(lastHeader).toBeInTheDocument();
-    });
-  });
-
-  describe('Input Validation', () => {
-    it('validates appName input securely', () => {
-      // Test with potentially malicious app names
-      const maliciousAppNames = [
-        '<script>alert("xss")</script>',
-        'javascript:alert("xss")',
-        '"><script>alert("xss")</script>',
-        'Admin<script>alert("xss")</script>'
-      ];
-      
-      maliciousAppNames.forEach(appName => {
-        const { unmount } = renderWithProviders(
-          <TestWrapper>
-            <PaceAppLayout appName={appName} />
-          </TestWrapper>
-        );
-        
-        // Should not crash or execute malicious code
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        unmount();
-      });
-    });
-
-    it('validates navigation items securely', () => {
-      const maliciousNavItems = [
-        { id: 'malicious1', label: '<script>alert("xss")</script>', href: '/safe' },
-        { id: 'malicious2', label: 'Safe', href: 'javascript:alert("xss")' },
-        { id: 'malicious3', label: 'Safe', href: 'data:text/html,<script>alert("xss")</script>' }
-      ];
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" navItems={maliciousNavItems} />
-        </TestWrapper>
-      );
-      
-      // Should not crash or execute malicious code
-      expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-    });
-
-    it('validates custom components securely', () => {
-      const MaliciousComponent = () => {
-        // Simulate a component that might try to execute malicious code
-        React.useEffect(() => {
-          // This would be dangerous in a real scenario
-          console.log('Component mounted');
-        }, []);
-        
-        return <div data-testid="malicious-component">Malicious Component</div>;
-      };
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            customLogo={<MaliciousComponent />}
-          />
-        </TestWrapper>
-      );
-      
-      // Should render safely
-      expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-    });
-  });
-
-  describe('Error Handling Security', () => {
-    it('handles authentication errors securely', async () => {
-      mockSignOut.mockResolvedValue({ error: { message: 'Authentication failed' } });
-      mockUpdatePassword.mockResolvedValue({ error: { message: 'Password update failed' } });
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      fireEvent.click(screen.getByTestId('sign-out-button'));
-      fireEvent.click(screen.getByTestId('change-password-button'));
-      
-      await waitFor(() => {
-        expect(mockSignOut).toHaveBeenCalled();
-        expect(mockUpdatePassword).toHaveBeenCalled();
-      });
-    });
-
-    it('handles permission errors securely', async () => {
-      // Mock the RBAC system to deny permission (secure behavior)
-      const { isPermitted } = await import('../../../rbac/api');
-      vi.mocked(isPermitted).mockResolvedValue(false);
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" enforcePermissions={true} />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        expect(screen.getByText('Access Denied')).toBeInTheDocument();
-      });
-    });
-
-    it('prevents information leakage in error messages', async () => {
-      // Mock the RBAC system to throw an error with sensitive information
-      const { isPermitted } = await import('../../../rbac/api');
-      const sensitiveError = new Error('Database connection failed: password=secret123');
-      vi.mocked(isPermitted).mockClear();
-      vi.mocked(isPermitted).mockRejectedValue(sensitiveError);
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            enforcePermissions={true}
-            routePermissions={{
-              '/test-path': 'read'
-            }}
-          />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        expect(screen.getByText('Permission Error')).toBeInTheDocument();
-        // Should not expose sensitive information
-        expect(screen.queryByText('password=secret123')).not.toBeInTheDocument();
-      });
-    });
-  });
-
-  describe('Session Security', () => {
-    it('handles session expiration securely', async () => {
-      // Mock user becoming null (session expired) by temporarily overriding the mock
-      const originalUser = mockUser;
-      Object.assign(mockUser, { ...mockUser, id: null });
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Should handle null user gracefully
-      expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-      
-      // Restore original user
-      Object.assign(mockUser, originalUser);
-    });
-
-    it('handles organisation context loss securely', () => {
-      // Mock organisation context becoming invalid
-      vi.doMock('../../../providers/OrganisationProvider', () => ({
-        OrganisationProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
-        useOrganisations: () => ({
-          ...mockOrganisationContext,
-          hasValidOrganisationContext: false,
-          selectedOrganisation: null
-        })
-      }));
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout appName="Test App" />
-        </TestWrapper>
-      );
-      
-      // Should handle invalid organisation context gracefully
-      expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-    });
-  });
-
-  describe('Access Control', () => {
-    it('enforces proper access control levels', async () => {
-      const routePermissions: Record<string, Operation> = {
-        '/test-path': 'read',
-        '/dashboard': 'read',
-        '/admin': 'delete',
-        '/settings': 'update'
-      };
-      
-      // Ensure the mock is properly set to allow access
-      const { isPermitted } = await import('../../../rbac/api');
-      vi.mocked(isPermitted).mockClear();
-      vi.mocked(isPermitted).mockResolvedValue(true);
-      
-      renderWithProviders(
-        <TestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            enforcePermissions={true}
-            routePermissions={routePermissions}
-          />
-        </TestWrapper>
-      );
-      
-      await waitFor(() => {
-        // With proper access control levels, the component should render normally
-        expect(screen.getByTestId('mock-header')).toBeInTheDocument();
-        expect(screen.getByTestId('mock-outlet')).toBeInTheDocument();
-      });
-    });
-
-    it('prevents privilege escalation', async () => {
-      // Test that users cannot escalate their privileges
-      const { isPermitted } = await import('../../../rbac/api');
-      vi.mocked(isPermitted).mockImplementation(({ userId, scope, permission, pageId }) => {
-        // Simulate user trying to access admin with read permission
-        if (pageId === 'admin' && permission === 'read') {
-          return Promise.resolve(false);
-        }
-        return Promise.resolve(true);
-      });
-      
-      // Create a test wrapper with admin path for privilege escalation test
-      const AdminTestWrapper = ({ children }: { children: React.ReactNode }) => (
-        <BrowserRouter>
-          <div style={{ '--app-width': '1200px' } as React.CSSProperties}>
-            {children}
-          </div>
-        </BrowserRouter>
-      );
-      
-      // Mock the location to be /admin for this test
-      mockLocation.pathname = '/admin';
-      
-      renderWithProviders(
-        <AdminTestWrapper>
-          <PaceAppLayout 
-            appName="Test App" 
-            enforcePermissions={true}
-            routePermissions={{
-              '/admin': 'read'
-            }}
-          />
-        </AdminTestWrapper>
-      );
-      
-      await waitFor(() => {
-        // With privilege escalation prevention, should show access denied for admin
-        expect(screen.getByText('Access Denied')).toBeInTheDocument();
-        expect(screen.getByText("You don't have permission to access this page.")).toBeInTheDocument();
-      }, { timeout: 5000 });
-    });
-  });
-});