feat(pages-and-resources): add permission tests for grading and pages/resources access

Author: bra-i-am

src/CourseAuthoringPage.test.tsx

@@ -108,14 +108,20 @@ describe('Course authoring page', () => {
 
     axiosMock.onGet(
       `${courseAppsApiUrl}/${courseId}`,
-    ).reply(403);
+    ).reply(403, { response: { status: 403 } });
     await executeThunk(fetchCourseApps(courseId), store.dispatch);
   };
   test('renders PermissionDeniedAlert when courseAppsApiStatus is DENIED', async () => {
     mockPathname = '/editor/';
     await mockStoreDenied();
 
-    const wrapper = renderComponent(<CourseAuthoringPage />);
+    // Test PagesAndResources (which has the PermissionDeniedAlert logic),
+    // not CourseAuthoringPage which is just the layout wrapper
+    const wrapper = renderComponent(
+      <CourseAuthoringPage>
+        <PagesAndResources />
+      </CourseAuthoringPage>,
+    );
     expect(await wrapper.findByTestId('permissionDeniedAlert')).toBeInTheDocument();
   });
 });

src/advanced-settings/setting-card/SettingCard.test.jsx

@@ -1,4 +1,4 @@
-import { fireEvent, render, waitFor } from '@testing-library/react';
+import { fireEvent, render, waitFor, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 
@@ -25,7 +25,7 @@ jest.mock('react-textarea-autosize', () =>
     />
   )));
 
-const RootWrapper = () => (
+const RootWrapper = (props = {}) => (
   <IntlProvider locale="en">
     <SettingCard
       isOn
@@ -37,6 +37,7 @@ const RootWrapper = () => (
       handleBlur={handleBlur}
       isEditableState
       saveSettingsPrompt={false}
+      {...props}
     />
   </IntlProvider>
 );
@@ -91,4 +92,16 @@ describe('<SettingCard />', () => {
       expect(handleBlur).toHaveBeenCalled();
     });
   });
+  it('renders in readOnly mode with disabled input', () => {
+    render(<RootWrapper readOnly />);
+    const input = screen.getByLabelText(/Setting Name/i);
+    expect(input).toBeDisabled();
+  });
+  it('shows help popup when clicking info button', () => {
+    render(<RootWrapper />);
+    const helpButton = screen.getByRole('button', { name: /show help text/i });
+    fireEvent.click(helpButton);
+    // The help text should be visible in the popup - verify component renders help
+    expect(screen.queryByText(/This is a help message/i)).toBeInTheDocument();
+  });
 });

src/authz/permissionHelpers.test.ts

@@ -0,0 +1,120 @@
+import { getGradingPermissions, getPagesAndResourcesPermissions } from './permissionHelpers';
+import { COURSE_PERMISSIONS } from './constants';
+
+describe('permissionHelpers', () => {
+  const courseId = 'course-v1:org+course+run';
+
+  describe('getGradingPermissions', () => {
+    it('returns correct permission structure with VIEW action', () => {
+      const result = getGradingPermissions(courseId);
+
+      expect(result.canViewGradingSettings).toBeDefined();
+      expect(result.canViewGradingSettings.action).toBe(COURSE_PERMISSIONS.VIEW_GRADING_SETTINGS);
+      expect(result.canViewGradingSettings.scope).toBe(courseId);
+    });
+
+    it('returns correct permission structure with EDIT action', () => {
+      const result = getGradingPermissions(courseId);
+
+      expect(result.canEditGradingSettings).toBeDefined();
+      expect(result.canEditGradingSettings.action).toBe(COURSE_PERMISSIONS.EDIT_GRADING_SETTINGS);
+      expect(result.canEditGradingSettings.scope).toBe(courseId);
+    });
+
+    it('returns both VIEW and EDIT permissions in single call', () => {
+      const result = getGradingPermissions(courseId);
+
+      const permissions = Object.keys(result);
+      expect(permissions).toContain('canViewGradingSettings');
+      expect(permissions).toContain('canEditGradingSettings');
+    });
+
+    it('uses correct courseId as scope for all permissions', () => {
+      const customCourseId = 'course-v1:custom+org+custom_run';
+      const result = getGradingPermissions(customCourseId);
+
+      expect(result.canViewGradingSettings.scope).toBe(customCourseId);
+      expect(result.canEditGradingSettings.scope).toBe(customCourseId);
+    });
+  });
+
+  describe('getPagesAndResourcesPermissions', () => {
+    it('returns correct permission structure with VIEW action', () => {
+      const result = getPagesAndResourcesPermissions(courseId);
+
+      expect(result.canViewPagesAndResources).toBeDefined();
+      expect(result.canViewPagesAndResources.action).toBe(COURSE_PERMISSIONS.VIEW_PAGES_AND_RESOURCES);
+      expect(result.canViewPagesAndResources.scope).toBe(courseId);
+    });
+
+    it('returns correct permission structure with EDIT action', () => {
+      const result = getPagesAndResourcesPermissions(courseId);
+
+      expect(result.canEditPagesAndResources).toBeDefined();
+      expect(result.canEditPagesAndResources.action).toBe(COURSE_PERMISSIONS.EDIT_PAGES_AND_RESOURCES);
+      expect(result.canEditPagesAndResources.scope).toBe(courseId);
+    });
+
+    it('returns both VIEW and EDIT permissions in single call', () => {
+      const result = getPagesAndResourcesPermissions(courseId);
+
+      const permissions = Object.keys(result);
+      expect(permissions).toContain('canViewPagesAndResources');
+      expect(permissions).toContain('canEditPagesAndResources');
+    });
+
+    it('uses correct courseId as scope for all permissions', () => {
+      const customCourseId = 'course-v1:another+test+course';
+      const result = getPagesAndResourcesPermissions(customCourseId);
+
+      expect(result.canViewPagesAndResources.scope).toBe(customCourseId);
+      expect(result.canEditPagesAndResources.scope).toBe(customCourseId);
+    });
+  });
+
+  describe('permission constants verification', () => {
+    it('uses correct VIEW_GRADING_SETTINGS constant', () => {
+      const result = getGradingPermissions(courseId);
+      expect(result.canViewGradingSettings.action).toBe('courses.view_grading_settings');
+    });
+
+    it('uses correct EDIT_GRADING_SETTINGS constant', () => {
+      const result = getGradingPermissions(courseId);
+      expect(result.canEditGradingSettings.action).toBe('courses.edit_grading_settings');
+    });
+
+    it('uses correct VIEW_PAGES_AND_RESOURCES constant', () => {
+      const result = getPagesAndResourcesPermissions(courseId);
+      expect(result.canViewPagesAndResources.action).toBe('courses.view_pages_and_resources');
+    });
+
+    it('uses correct EDIT_PAGES_AND_RESOURCES constant', () => {
+      const result = getPagesAndResourcesPermissions(courseId);
+      expect(result.canEditPagesAndResources.action).toBe('courses.manage_pages_and_resources');
+    });
+  });
+
+  describe('edge cases', () => {
+    it('handles empty courseId', () => {
+      const result = getGradingPermissions('');
+
+      expect(result.canViewGradingSettings.scope).toBe('');
+      expect(result.canEditGradingSettings.scope).toBe('');
+    });
+
+    it('handles special characters in courseId', () => {
+      const specialCourseId = 'course-v1:test+special:id';
+      const result = getPagesAndResourcesPermissions(specialCourseId);
+
+      expect(result.canViewPagesAndResources.scope).toBe(specialCourseId);
+    });
+
+    it('returns consistent structure across multiple calls', () => {
+      const result1 = getGradingPermissions(courseId);
+      const result2 = getGradingPermissions(courseId);
+
+      expect(Object.keys(result1)).toEqual(Object.keys(result2));
+      expect(result1.canViewGradingSettings.action).toBe(result2.canViewGradingSettings.action);
+    });
+  });
+});

src/pages-and-resources/PagesAndResources.test.tsx

@@ -8,8 +8,16 @@ import {
 import { getConfig, setConfig } from '@edx/frontend-platform';
 import { PLUGIN_OPERATIONS, DIRECT_PLUGIN } from '@openedx/frontend-plugin-framework';
 import { CourseAuthoringProvider } from '@src/CourseAuthoringContext';
+import { mockWaffleFlags } from '@src/data/apiHooks.mock';
+import { useCourseUserPermissions } from '@src/authz/hooks';
 import { PagesAndResources } from '.';
 
+// Mock authz hooks
+jest.mock('@src/authz/hooks', () => ({
+  ...jest.requireActual('@src/authz/hooks'),
+  useCourseUserPermissions: jest.fn(),
+}));
+
 const mockPlugin = (identifier) => ({
   plugins: [
     {
@@ -45,8 +53,30 @@ describe('PagesAndResources', () => {
         ),
       },
     });
+
+    // Set up waffle flags to disable authz by default
+    mockWaffleFlags({ enableAuthzCourseAuthoring: false });
+
+    // Default: authz disabled allows everything
+    jest.mocked(useCourseUserPermissions).mockReturnValue({
+      isLoading: false,
+      isAuthzEnabled: false,
+      canViewPagesAndResources: true,
+      canEditPagesAndResources: true,
+    } as ReturnType<typeof useCourseUserPermissions>);
   });
 
+  // Helper to set up permission mocks
+  const mockPermissions = (canView: boolean, canEdit: boolean) => {
+    mockWaffleFlags({ enableAuthzCourseAuthoring: true });
+    jest.mocked(useCourseUserPermissions).mockReturnValue({
+      isLoading: false,
+      isAuthzEnabled: true,
+      canViewPagesAndResources: canView,
+      canEditPagesAndResources: canEdit,
+    } as ReturnType<typeof useCourseUserPermissions>);
+  };
+
   it('doesn\'t show content permissions section if relevant apps are not enabled', async () => {
     const initialState = {
       models: {
@@ -128,4 +158,60 @@ describe('PagesAndResources', () => {
     await waitFor(() => expect(screen.queryByTestId('additional_course_plugin')).toBeInTheDocument());
     await waitFor(() => expect(screen.queryByTestId('additional_course_content_plugin')).toBeInTheDocument());
   });
+
+  describe('permission integration', () => {
+    it('shows PermissionDeniedAlert when user has no VIEW or EDIT permissions', async () => {
+      mockPermissions(false, false);
+
+      const initialState = {
+        models: {
+          courseApps: {},
+        },
+        pagesAndResources: {
+          courseAppIds: [],
+        },
+      };
+
+      initializeMocks({ initialState });
+      renderComponent();
+
+      await waitFor(() => expect(screen.getByTestId('permissionDeniedAlert')).toBeInTheDocument());
+    });
+
+    it('does NOT show PermissionDeniedAlert when user has VIEW permission', async () => {
+      mockPermissions(true, false);
+
+      const initialState = {
+        models: {
+          courseApps: {},
+        },
+        pagesAndResources: {
+          courseAppIds: [],
+        },
+      };
+
+      initializeMocks({ initialState });
+      renderComponent();
+
+      await waitFor(() => expect(screen.queryByTestId('permissionDeniedAlert')).not.toBeInTheDocument());
+    });
+
+    it('does NOT show PermissionDeniedAlert when user has EDIT permission', async () => {
+      mockPermissions(true, true);
+
+      const initialState = {
+        models: {
+          courseApps: {},
+        },
+        pagesAndResources: {
+          courseAppIds: [],
+        },
+      };
+
+      initializeMocks({ initialState });
+      renderComponent();
+
+      await waitFor(() => expect(screen.queryByTestId('permissionDeniedAlert')).not.toBeInTheDocument());
+    });
+  });
 });

src/pages-and-resources/discussions/app-config-form/apps/openedx/OpenedXConfigForm.test.jsx

@@ -77,14 +77,15 @@ describe('OpenedXConfigForm', () => {
     axiosMock.reset();
   });
 
-  const createComponent = (onSubmit = jest.fn(), formRef = createRef(), legacy = true) => {
+  const createComponent = (onSubmit = jest.fn(), formRef = createRef(), legacy = true, isEditable = false) => {
     const wrapper = render(
       <AppProvider store={store}>
         <IntlProvider locale="en">
           <OpenedXConfigForm
             onSubmit={onSubmit}
             formRef={formRef}
             legacy={legacy}
+            isEditable={isEditable}
           />
         </IntlProvider>
       </AppProvider>,
@@ -348,4 +349,18 @@ describe('OpenedXConfigForm', () => {
       assertHasErrorValidation(false);
     });
   });
+
+  describe('isEditable prop', () => {
+    test('renders with isEditable=false (read-only mode)', async () => {
+      await mockStore(legacyApiResponse);
+      const wrapper = createComponent(jest.fn(), createRef(), true, false);
+      expect(wrapper.querySelector('form')).toBeInTheDocument();
+    });
+
+    test('renders with isEditable=true (edit mode)', async () => {
+      await mockStore(legacyApiResponse);
+      const wrapper = createComponent(jest.fn(), createRef(), true, true);
+      expect(wrapper.querySelector('form')).toBeInTheDocument();
+    });
+  });
 });

src/pages-and-resources/discussions/app-config-form/apps/shared/InContextDiscussionFields.test.jsx

@@ -0,0 +1,51 @@
+// @ts-check
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
+import { Formik, Form } from 'formik';
+import InContextDiscussionFields from './InContextDiscussionFields';
+
+const defaultProps = {
+  onBlur: jest.fn(),
+  onChange: jest.fn(),
+  values: {
+    enableGradedUnits: false,
+    groupAtSubsection: false,
+  },
+};
+
+const renderComponent = (props = {}) => render(
+  <IntlProvider locale="en">
+    <Formik initialValues={defaultProps.values} onSubmit={jest.fn()}>
+      <Form>
+        <InContextDiscussionFields {...defaultProps} {...props} />
+      </Form>
+    </Formik>
+  </IntlProvider>,
+);
+
+describe('InContextDiscussionFields', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders without crashing', () => {
+    renderComponent();
+    // Component renders - check for presence of expected text
+    expect(screen.getByText(/Visibility of in-context discussions/)).toBeInTheDocument();
+  });
+
+  it('renders with disabled prop', () => {
+    renderComponent({ disabled: true });
+    expect(screen.getByText(/Visibility of in-context discussions/)).toBeInTheDocument();
+  });
+
+  it('accepts different values', () => {
+    renderComponent({
+      values: {
+        enableGradedUnits: true,
+        groupAtSubsection: true,
+      },
+    });
+    expect(screen.getByText(/Visibility of in-context discussions/)).toBeInTheDocument();
+  });
+});