@jmruthers/pace-core 0.6.5 → 0.6.7

package/src/rbac/components/NavigationProvider.test.tsx

@@ -1,481 +0,0 @@
-/**
- * @file Navigation Provider Tests
- * @package @jmruthers/pace-core
- * @module RBAC/Components/NavigationProvider
- * @since 2.0.0
- * 
- * Comprehensive tests for the NavigationProvider component covering all critical functionality.
- */
-
-import { render, screen, waitFor } from '@testing-library/react';
-import { vi, describe, it, expect, beforeEach, afterEach } from 'vitest';
-import React, { ReactNode } from 'react';
-import { NavigationProvider, useNavigationPermissions, NavigationItem } from './NavigationProvider';
-import { useUnifiedAuth } from '../../providers/services/UnifiedAuthProvider';
-import { UUID, Scope, Permission } from '../types';
-
-// Mock the auth provider
-const mockUseUnifiedAuthFn = vi.fn();
-vi.mock('../../providers/services/UnifiedAuthProvider', () => ({
-  useUnifiedAuth: () => mockUseUnifiedAuthFn(),
-  UnifiedAuthProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>,
-}));
-
-// Mock the RBAC hooks
-vi.mock('../hooks', () => ({
-  useCan: vi.fn()
-}));
-
-// Mock useResolvedScope
-const mockUseResolvedScopeFn = vi.fn();
-vi.mock('../hooks/useResolvedScope', () => ({
-  useResolvedScope: () => mockUseResolvedScopeFn(),
-}));
-
-import { useCan } from '../hooks';
-
-// Mock data
-const mockUser = {
-  id: 'user-123' as UUID,
-  email: 'test@example.com'
-};
-
-const mockScope: Scope = {
-  organisationId: 'org-123' as UUID,
-  eventId: 'event-456',
-  appId: 'app-789' as UUID
-};
-
-const mockNavigationItems: NavigationItem[] = [
-  {
-    id: 'dashboard',
-    label: 'Dashboard',
-    path: '/dashboard',
-    permissions: ['read:dashboard'] as Permission[],
-    pageId: 'page-dashboard'
-  },
-  {
-    id: 'users',
-    label: 'Users',
-    path: '/users',
-    permissions: ['read:users'] as Permission[],
-    pageId: 'page-users'
-  },
-  {
-    id: 'admin',
-    label: 'Admin',
-    path: '/admin',
-    permissions: ['update:admin'] as Permission[],
-    pageId: 'page-admin',
-    accessLevel: 'admin'
-  }
-];
-
-// Test component
-const TestComponent = ({ children }: { children: ReactNode }) => (
-  <div data-testid="test-component">{children}</div>
-);
-
-describe('NavigationProvider', () => {
-  const mockUseCan = vi.mocked(useCan);
-  const mockUseCanFn = mockUseCan; // Alias for consistency
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-    mockUseUnifiedAuthFn.mockReturnValue({
-      user: mockUser,
-      isAuthenticated: true,
-      signOut: vi.fn(),
-      selectedOrganisation: { id: 'org-123' },
-      selectedEvent: { event_id: 'event-456' },
-      supabase: {} as any,
-    } as any);
-    
-    // Set up default mock for useCan (called inside useCallback in NavigationProvider)
-    // Note: This violates React hooks rules but is needed for tests to work with current implementation
-    mockUseCanFn.mockImplementation(() => ({
-      can: true,
-      isLoading: false,
-      error: null,
-    }));
-    
-    // Mock useResolvedScope to return a valid scope
-    mockUseResolvedScopeFn.mockReturnValue({
-      resolvedScope: mockScope,
-      isLoading: false,
-      error: null,
-    });
-  });
-
-    describe('Provider Initialization', () => {
-    it('renders children correctly', () => {
-      render(
-        <NavigationProvider>
-          <TestComponent>Test Content</TestComponent>
-        </NavigationProvider>
-      );
-
-      expect(screen.getByTestId('test-component')).toBeInTheDocument();
-      expect(screen.getByText('Test Content')).toBeInTheDocument();
-    });
-
-    it('initializes with default configuration', () => {
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        return (
-          <div>
-            <div data-testid="enabled">{context.isEnabled.toString()}</div>
-            <div data-testid="strict-mode">{context.isStrictMode.toString()}</div>
-            <div data-testid="audit-log">{context.isAuditLogEnabled.toString()}</div>
-          </div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      expect(screen.getByTestId('enabled')).toHaveTextContent('true');
-      expect(screen.getByTestId('strict-mode')).toHaveTextContent('true');
-      expect(screen.getByTestId('audit-log')).toHaveTextContent('true');
-    });
-
-    it('initializes with custom configuration', () => {
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        return (
-          <div>
-            <div data-testid="enabled">{context.isEnabled.toString()}</div>
-            <div data-testid="strict-mode">{context.isStrictMode.toString()}</div>
-            <div data-testid="audit-log">{context.isAuditLogEnabled.toString()}</div>
-          </div>
-        );
-      };
-
-      render(
-        <NavigationProvider
-          strictMode={false}
-          auditLog={false}
-        >
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      expect(screen.getByTestId('enabled')).toHaveTextContent('true');
-      expect(screen.getByTestId('strict-mode')).toHaveTextContent('false');
-      expect(screen.getByTestId('audit-log')).toHaveTextContent('false');
-    });
-  });
-
-  describe('Navigation Permission Checking', () => {
-    it('checks navigation permissions correctly', async () => {
-      // Note: useCan is called inside a useCallback in NavigationProvider, which violates React hooks rules
-      // This is a bug in the implementation, but for tests we need the mock to work
-      mockUseCanFn.mockImplementation(() => ({
-        can: true,
-        isLoading: false,
-        error: null,
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const hasPermission = context.hasNavigationPermission(mockNavigationItems[0]);
-        
-        return (
-          <div data-testid="has-permission">{hasPermission.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('has-permission')).toHaveTextContent('true');
-      });
-    });
-
-    it('denies navigation permissions when user lacks access', async () => {
-      mockUseCanFn.mockImplementation(() => ({
-        can: false,
-        isLoading: false,
-        error: null,
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const hasPermission = context.hasNavigationPermission(mockNavigationItems[2]);
-        
-        return (
-          <div data-testid="has-permission">{hasPermission.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('has-permission')).toHaveTextContent('false');
-      });
-    });
-
-    it('filters navigation items based on permissions', async () => {
-      // Note: useCan is called inside a useCallback in NavigationProvider, which violates React hooks rules
-      // This is a bug in the implementation, but for tests we need the mock to work
-      let callCount = 0;
-      mockUseCanFn.mockImplementation(() => {
-        callCount++;
-        // Return true for first two calls (dashboard, users), false for third (admin)
-        return {
-          can: callCount <= 2,
-          isLoading: false,
-          error: null,
-        };
-      });
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const filteredItems = context.getFilteredNavigationItems(mockNavigationItems);
-        
-        return (
-          <div data-testid="filtered-count">{filteredItems.length.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('filtered-count')).toHaveTextContent('2');
-      });
-    });
-  });
-
-  describe('Navigation Items Management', () => {
-    it('gets all navigation permissions for current user', async () => {
-      mockUseCanFn.mockImplementation(() => ({
-        can: true,
-        isLoading: false,
-        error: null,
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const permissions = context.getNavigationPermissions();
-        
-        return (
-          <div data-testid="permissions">{JSON.stringify(permissions)}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('permissions')).toBeInTheDocument();
-      });
-    });
-
-    it('tracks navigation access history', async () => {
-      mockUseCanFn.mockImplementation(() => ({
-        can: true,
-        isLoading: false,
-        error: null,
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const history = context.getNavigationAccessHistory();
-        
-        return (
-          <div data-testid="history-length">{history.length.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('history-length')).toBeInTheDocument();
-      });
-    });
-
-    it('clears navigation access history', async () => {
-      mockUseCanFn.mockImplementation(() => ({
-        can: true,
-        isLoading: false,
-        error: null,
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const clearHistory = context.clearNavigationAccessHistory;
-        
-        return (
-          <button data-testid="clear-button" onClick={clearHistory}>
-            Clear History
-          </button>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      expect(screen.getByTestId('clear-button')).toBeInTheDocument();
-    });
-  });
-
-
-
-  describe('Error Handling', () => {
-    it('handles navigation permission check errors gracefully', async () => {
-      // Note: useCan is called inside a useCallback in NavigationProvider, which violates React hooks rules
-      // This is a bug in the implementation, but for tests we need the mock to work
-      // When there's an error, NavigationProvider should return true (graceful degradation)
-      mockUseCanFn.mockImplementation(() => ({
-        can: false,
-        isLoading: false,
-        error: new Error('Navigation permission check failed'),
-      }));
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const mockNavigationItem = {
-          id: 'dashboard',
-          label: 'Dashboard',
-          href: '/dashboard',
-          permissions: ['read:page.dashboard']
-        };
-        const hasPermission = context.hasNavigationPermission(mockNavigationItem);
-        
-        return (
-          <div data-testid="has-permission">{hasPermission.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('has-permission')).toHaveTextContent('true');
-      });
-    });
-
-    it('handles missing user context gracefully', async () => {
-      mockUseUnifiedAuthFn.mockReturnValue({
-        user: null,
-        isAuthenticated: false,
-        signOut: vi.fn(),
-        selectedOrganisationId: null,
-        selectedEventId: null,
-      } as any);
-
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        const hasPermission = context.hasNavigationPermission(mockNavigationItems[0]);
-        
-        return (
-          <div data-testid="has-permission">{hasPermission.toString()}</div>
-        );
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      await waitFor(() => {
-        expect(screen.getByTestId('has-permission')).toHaveTextContent('false');
-      });
-    });
-  });
-
-  describe('Context Hook', () => {
-    it('throws error when used outside provider', () => {
-      const TestConsumer = () => {
-        useNavigationPermissions();
-        return <div>Test</div>;
-      };
-
-      expect(() => {
-        render(<TestConsumer />);
-      }).toThrow('useNavigationPermissions must be used within a NavigationProvider');
-    });
-
-    it('provides context when used within provider', () => {
-      const TestConsumer = () => {
-        const context = useNavigationPermissions();
-        expect(context).toBeDefined();
-        expect(context.hasNavigationPermission).toBeInstanceOf(Function);
-        expect(context.getNavigationPermissions).toBeInstanceOf(Function);
-        expect(context.getFilteredNavigationItems).toBeInstanceOf(Function);
-        expect(context.getNavigationAccessHistory).toBeInstanceOf(Function);
-        expect(context.isEnabled).toBeDefined();
-        expect(context.isStrictMode).toBeDefined();
-        expect(context.isAuditLogEnabled).toBeDefined();
-        
-        return <div>Test</div>;
-      };
-
-      render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-    });
-  });
-
-  describe('Performance', () => {
-    it('memoizes context value to prevent unnecessary re-renders', () => {
-      let renderCount = 0;
-      
-      const TestConsumer = React.memo(() => {
-        renderCount++;
-        const context = useNavigationPermissions();
-        return <div data-testid="render-count">{renderCount}</div>;
-      });
-
-      const { rerender } = render(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      const initialRenderCount = renderCount;
-      
-      // Re-render with same props
-      rerender(
-        <NavigationProvider>
-          <TestConsumer />
-        </NavigationProvider>
-      );
-
-      // Should not cause additional renders due to memoization
-      expect(renderCount).toBe(initialRenderCount);
-    });
-  });
-
-});