fix: tests fixed

Author: jesusbalderramawgu

src/authz-module/audit-user/index.test.tsx

@@ -1,4 +1,6 @@
-import { render, screen, waitFor } from '@testing-library/react';
+import {
+  render, screen, waitFor, act,
+} from '@testing-library/react';
 import { AppContext } from '@edx/frontend-platform/react';
 import userEvent from '@testing-library/user-event';
 import { MemoryRouter, Route, Routes } from 'react-router-dom';
@@ -17,6 +19,21 @@ jest.mock('@edx/frontend-platform/logging', () => ({
   logError: jest.fn(),
 }));
 
+// Mock StudioHeader to avoid prop validation errors in tests
+jest.mock('@edx/frontend-component-header', () => ({
+  StudioHeader: ({ children, ...props }: any) => <div data-testid="mocked-studio-header" {...props}>{children}</div>,
+}));
+
+// Mock the useRevokeUserRoles hook
+const mockRevokeUserRoles = jest.fn();
+jest.mock('@src/authz-module/data/hooks', () => ({
+  ...jest.requireActual('@src/authz-module/data/hooks'),
+  useRevokeUserRoles: () => ({
+    mutate: mockRevokeUserRoles,
+    isPending: false,
+  }),
+}));
+
 const mockUser = {
   username: 'johndoe',
   email: '[email protected]',
@@ -50,9 +67,16 @@ const renderWithRouter = (route = '/audit/johndoe') => {
     authenticatedUser: {
       username: 'testuser',
       email: '[email protected]',
+      userId: 1,
     },
     config: {
-      // @ts-ignore
+      LMS_BASE_URL: 'http://localhost:18000',
+      STUDIO_BASE_URL: 'http://localhost:18010',
+      AUTHZ_MICROFRONTEND_URL: 'http://localhost:18012',
+      ACCESS_TOKEN_COOKIE_NAME: 'edx-jwt-cookie-header-payload',
+      BASE_URL: 'http://localhost:18012',
+      ENVIRONMENT: 'test',
+      LANGUAGE_PREFERENCE_COOKIE_NAME: 'openedx-language-preference',
       ...process.env,
     },
   };
@@ -78,6 +102,11 @@ const renderWithRouter = (route = '/audit/johndoe') => {
 describe('AuditUserPage', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    // Set up default mock behavior for useRevokeUserRoles
+    mockRevokeUserRoles.mockImplementation((variables, { onSuccess }) => {
+      // Simulate successful deletion by default
+      onSuccess({ errors: [], completed: ['role1'] });
+    });
   });
 
   beforeAll(() => {
@@ -250,7 +279,6 @@ describe('AuditUserPage', () => {
         .fn()
         .mockResolvedValueOnce({ data: mockUser })
         .mockResolvedValueOnce({ data: mockAssignments }),
-      delete: jest.fn().mockResolvedValue({ data: { errors: [] } }),
     });
 
     renderWithRouter();
@@ -269,26 +297,35 @@ describe('AuditUserPage', () => {
     });
 
     const removeButton = screen.getByRole('button', { name: /remove/i });
-    await user.click(removeButton);
+
+    await act(async () => {
+      await user.click(removeButton);
+    });
 
     await waitFor(() => {
       expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+    });
+
+    await waitFor(() => {
       expect(screen.getByText(/role has been successfully removed/i)).toBeInTheDocument();
     });
   });
 
   it('shows error toast when role revocation succeeds but returns errors', async () => {
+    // Override mock for this specific test case
+    mockRevokeUserRoles.mockImplementation((_, { onSuccess }) => {
+      // Call onSuccess immediately with errors
+      onSuccess({
+        errors: ['Failed to revoke user role'],
+        completed: [],
+      });
+    });
+
     (getAuthenticatedHttpClient as jest.Mock).mockReturnValue({
       get: jest
         .fn()
         .mockResolvedValueOnce({ data: mockUser })
         .mockResolvedValueOnce({ data: mockAssignments }),
-      delete: jest.fn().mockResolvedValue({
-        data: {
-          errors: ['Failed to revoke user role'],
-          completed: [],
-        },
-      }),
     });
 
     renderWithRouter();
@@ -307,20 +344,28 @@ describe('AuditUserPage', () => {
     });
 
     const removeButton = screen.getByRole('button', { name: /remove/i });
-    await user.click(removeButton);
+
+    await act(async () => {
+      await user.click(removeButton);
+    });
 
     await waitFor(() => {
       expect(screen.getByText(/something went wrong/i)).toBeInTheDocument();
     });
   });
 
   it('shows error toast with retry when role revocation fails', async () => {
+    // Override mock for this specific test case
+    mockRevokeUserRoles.mockImplementation((variables, { onError }) => {
+      // Call onError immediately to simulate failure
+      onError(new Error('Network error'));
+    });
+
     (getAuthenticatedHttpClient as jest.Mock).mockReturnValue({
       get: jest
         .fn()
         .mockResolvedValueOnce({ data: mockUser })
         .mockResolvedValueOnce({ data: mockAssignments }),
-      delete: jest.fn().mockRejectedValue(new Error('Network error')),
     });
 
     renderWithRouter();
@@ -339,7 +384,10 @@ describe('AuditUserPage', () => {
     });
 
     const removeButton = screen.getByRole('button', { name: /remove/i });
-    await user.click(removeButton);
+
+    await act(async () => {
+      await user.click(removeButton);
+    });
 
     await waitFor(() => {
       expect(screen.getByText(/something went wrong on our end/i)).toBeInTheDocument();

src/authz-module/audit-user/index.tsx

@@ -24,9 +24,9 @@ import { useQuerySettings } from '@src/authz-module/hooks/useQuerySettings';
 import { useRevokeUserRoles, useUserAssignedRoles } from '@src/authz-module/data/hooks';
 import { RoleToDelete } from 'types';
 import { useToastManager } from '@src/components/ToastManager/ToastManagerContext';
+import UserPermissions from '@src/authz-module/components/UserPermissions';
 import messages from './messages';
 import ConfirmDeletionModal from '../components/ConfirmDeletionModal';
-import UserPermissions from '@src/authz-module/components/UserPermissions';
 
 const AuditUserPage = () => {
   const { formatMessage } = useIntl();

src/authz-module/components/TableCells.tsx

@@ -12,21 +12,12 @@ import { useNavigate } from 'react-router-dom';
 import { useContext, useMemo } from 'react';
 import { ADMIN_ROLES, DJANGO_MANAGED_ROLES, MAP_ROLE_KEY_TO_LABEL } from '@src/authz-module/constants';
 import {
-  Icon, IconButton, OverlayTrigger, Tooltip,
+  Icon, IconButton, OverlayTrigger, Tooltip, DataTableContext,
 } from '@openedx/paragon';
 import { RESOURCE_ICONS } from './constants';
 import messages from './messages';
 import ViewMoreLink from './ViewMoreLink';
 
-interface ExpandableTableRow<T> extends TableCellValue<T> {
-  row: TableCellValue<T>['row'] & {
-    id: string;
-    isExpanded: boolean;
-    toggleRowExpanded: () => void;
-    values: T;
-  };
-}
-
 interface DataTableInstance {
   state?: {
     expanded?: Record<string, boolean>;
@@ -35,7 +26,6 @@ interface DataTableInstance {
 }
 
 type CellProps = TableCellValue<UserRole>;
-type ExpandableCellProps = ExpandableTableRow<UserRole>;
 type CellPropsWithValue = CellProps & {
   value: string;
 };