test: fix tests

openedx · Oct 29, 2024 · 87868c1 · 87868c1
1 parent 9cf4b37
commit 87868c1
Show file tree

Hide file tree

Showing 7 changed files with 104 additions and 46 deletions.
diff --git a/src/course-unit/course-xblock/CourseXBlock.test.jsx b/src/course-unit/course-xblock/CourseXBlock.test.jsx
@@ -29,7 +29,6 @@ const blockId = '567890';
 const handleDeleteMock = jest.fn();
 const handleDuplicateMock = jest.fn();
 const handleConfigureSubmitMock = jest.fn();
-const mockedUsedNavigate = jest.fn();
 const {
   name,
   block_id: id,
@@ -42,11 +41,6 @@ const unitXBlockActionsMock = {
   handleDuplicate: handleDuplicateMock,
 };
 
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
-  useNavigate: () => mockedUsedNavigate,
-}));
-
 jest.mock('react-redux', () => ({
   ...jest.requireActual('react-redux'),
   useSelector: jest.fn(),
@@ -78,6 +72,16 @@ useSelector.mockImplementation((selector) => {
 });
 
 describe('<CourseXBlock />', () => {
+  const locationTemp = window.location;
+  beforeAll(() => {
+    delete window.location;
+    window.location = {
+      assign: jest.fn(),
+    };
+  });
+  afterAll(() => {
+    window.location = locationTemp;
+  });
   beforeEach(async () => {
     initializeMockApp({
       authenticatedUser: {
@@ -168,8 +172,8 @@ describe('<CourseXBlock />', () => {
       expect(editButton).toBeInTheDocument();
 
       userEvent.click(editButton);
-      expect(mockedUsedNavigate).toHaveBeenCalled();
-      expect(mockedUsedNavigate).toHaveBeenCalledWith(`/course/${courseId}/editor/html/${id}`);
+      expect(window.location.assign).toHaveBeenCalled();
+      expect(window.location.assign).toHaveBeenCalledWith(`/course/${courseId}/editor/html/${id}`);
     });
 
     it('navigates to editor page on edit Video xblock', () => {
@@ -182,8 +186,8 @@ describe('<CourseXBlock />', () => {
       expect(editButton).toBeInTheDocument();
 
       userEvent.click(editButton);
-      expect(mockedUsedNavigate).toHaveBeenCalled();
-      expect(mockedUsedNavigate).toHaveBeenCalledWith(`/course/${courseId}/editor/video/${id}`);
+      expect(window.location.assign).toHaveBeenCalled();
+      expect(window.location.assign).toHaveBeenCalledWith(`/course/${courseId}/editor/video/${id}`);
     });
 
     it('navigates to editor page on edit Problem xblock', () => {
@@ -196,8 +200,8 @@ describe('<CourseXBlock />', () => {
       expect(editButton).toBeInTheDocument();
 
       userEvent.click(editButton);
-      expect(mockedUsedNavigate).toHaveBeenCalled();
-      expect(mockedUsedNavigate).toHaveBeenCalledWith(`/course/${courseId}/editor/problem/${id}`);
+      expect(window.location.assign).toHaveBeenCalled();
+      expect(window.location.assign).toHaveBeenCalledWith(`/course/${courseId}/editor/problem/${id}`);
       expect(handleDeleteMock).toHaveBeenCalledWith(id);
     });
   });

diff --git a/...ors/containers/ProblemEditor/components/EditProblemView/__snapshots__/index.test.jsx.snap b/...ors/containers/ProblemEditor/components/EditProblemView/__snapshots__/index.test.jsx.snap
@@ -3,6 +3,7 @@
 exports[`EditorProblemView component renders raw editor 1`] = `
 <EditorContainer
   getContent={[Function]}
+  isDirty={[Function]}
   returnFunction={null}
 >
   <AlertModal
@@ -72,6 +73,7 @@ exports[`EditorProblemView component renders raw editor 1`] = `
 exports[`EditorProblemView component renders simple view 1`] = `
 <EditorContainer
   getContent={[Function]}
+  isDirty={[Function]}
   returnFunction={null}
 >
   <AlertModal

diff --git a/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap b/src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap
@@ -14,6 +14,18 @@ exports[`TextEditor snapshots block failed to load, Toast is shown 1`] = `
       },
     }
   }
+  isDirty={
+    {
+      "isDirty": {
+        "editorRef": {
+          "current": {
+            "value": "something",
+          },
+        },
+        "showRawEditor": false,
+      },
+    }
+  }
   onClose={[MockFunction props.onClose]}
   returnFunction={null}
 >
@@ -67,6 +79,18 @@ exports[`TextEditor snapshots loaded, raw editor 1`] = `
       },
     }
   }
+  isDirty={
+    {
+      "isDirty": {
+        "editorRef": {
+          "current": {
+            "value": "something",
+          },
+        },
+        "showRawEditor": true,
+      },
+    }
+  }
   onClose={[MockFunction props.onClose]}
   returnFunction={null}
 >
@@ -114,6 +138,18 @@ exports[`TextEditor snapshots not yet loaded, Spinner appears 1`] = `
       },
     }
   }
+  isDirty={
+    {
+      "isDirty": {
+        "editorRef": {
+          "current": {
+            "value": "something",
+          },
+        },
+        "showRawEditor": false,
+      },
+    }
+  }
   onClose={[MockFunction props.onClose]}
   returnFunction={null}
 >
@@ -153,6 +189,18 @@ exports[`TextEditor snapshots renders as expected with default behavior 1`] = `
       },
     }
   }
+  isDirty={
+    {
+      "isDirty": {
+        "editorRef": {
+          "current": {
+            "value": "something",
+          },
+        },
+        "showRawEditor": false,
+      },
+    }
+  }
   onClose={[MockFunction props.onClose]}
   returnFunction={null}
 >
@@ -206,6 +254,18 @@ exports[`TextEditor snapshots renders static images with relative paths 1`] = `
       },
     }
   }
+  isDirty={
+    {
+      "isDirty": {
+        "editorRef": {
+          "current": {
+            "value": "something",
+          },
+        },
+        "showRawEditor": false,
+      },
+    }
+  }
   onClose={[MockFunction props.onClose]}
   returnFunction={null}
 >

diff --git a/src/editors/containers/TextEditor/index.test.jsx b/src/editors/containers/TextEditor/index.test.jsx
@@ -22,6 +22,7 @@ jest.mock('../EditorContainer', () => 'EditorContainer');
 
 jest.mock('./hooks', () => ({
   getContent: jest.fn(args => ({ getContent: args })),
+  isDirty: jest.fn(args => ({ isDirty: args })),
   nullMethod: jest.fn().mockName('hooks.nullMethod'),
 }));
 

diff --git a/src/editors/containers/VideoEditor/__snapshots__/index.test.tsx.snap b/src/editors/containers/VideoEditor/__snapshots__/index.test.tsx.snap
@@ -5,6 +5,7 @@ exports[`VideoEditor snapshots renders as expected with default behavior 1`] = `
   value="hooks.errorsHook.error"
 >
   <EditorContainer
+    isDirty={[Function]}
     onClose={[MockFunction props.onClose]}
     validateEntry={[MockFunction validateEntry]}
   >

diff --git a/src/editors/data/redux/problem/reducers.test.js b/src/editors/data/redux/problem/reducers.test.js
@@ -19,6 +19,7 @@ describe('problem reducer', () => {
         it(`load ${target} from payload`, () => {
           expect(reducer(testingState, actions[action](testValue))).toEqual({
             ...testingState,
+            isDirty: true,
             [target]: testValue,
           });
         });
@@ -62,6 +63,7 @@ describe('problem reducer', () => {
         expect(reducer(testingState, actions.addAnswer(answer))).toEqual({
           ...testingState,
           answers: [answer],
+          isDirty: true,
         });
       });
     });
@@ -79,6 +81,7 @@ describe('problem reducer', () => {
         const payload = { hints: ['soMehInt'] };
         expect(reducer(testingState, actions.updateSettings(payload))).toEqual({
           ...testingState,
+          isDirty: true,
           settings: {
             ...testingState.settings,
             ...payload,
@@ -99,6 +102,7 @@ describe('problem reducer', () => {
         expect(reducer({ ...testingState, problemType: 'choiceresponse' }, actions.addAnswer())).toEqual({
           ...testingState,
           problemType: 'choiceresponse',
+          isDirty: true,
           answers: [answer],
         });
       });
@@ -111,6 +115,7 @@ describe('problem reducer', () => {
         expect(reducer(numericTestState, actions.addAnswer())).toEqual({
           ...numericTestState,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{
             ...answer,
             correct: true,
@@ -131,6 +136,7 @@ describe('problem reducer', () => {
         expect(reducer({ ...testingState, problemType: ProblemTypeKeys.NUMERIC }, actions.addAnswerRange())).toEqual({
           ...testingState,
           correctAnswerCount: 1,
+          isDirty: true,
           problemType: ProblemTypeKeys.NUMERIC,
           answers: [answerRange],
         });
@@ -151,6 +157,7 @@ describe('problem reducer', () => {
         )).toEqual({
           ...testingState,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{ id: 'A', correct: true }],
         });
       });
@@ -183,6 +190,7 @@ describe('problem reducer', () => {
           actions.deleteAnswer(payload),
         )).toEqual({
           ...testingState,
+          isDirty: true,
           correctAnswerCount: 0,
           answers: [{
             id: 'A',
@@ -220,6 +228,7 @@ describe('problem reducer', () => {
         )).toEqual({
           ...testingState,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{
             id: 'A',
             correct: true,
@@ -259,6 +268,7 @@ describe('problem reducer', () => {
         )).toEqual({
           ...testingState,
           problemType: ProblemTypeKeys.SINGLESELECT,
+          isDirty: true,
           correctAnswerCount: 1,
           answers: [{
             id: 'A',
@@ -300,6 +310,7 @@ describe('problem reducer', () => {
         )).toEqual({
           ...testingState,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{
             id: 'A',
             correct: true,
@@ -380,6 +391,7 @@ describe('problem reducer', () => {
         )).toEqual({
           ...testingState,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{
             id: 'A',
             correct: true,
@@ -429,6 +441,7 @@ describe('problem reducer', () => {
           ...testingState,
           problemType: ProblemTypeKeys.NUMERIC,
           correctAnswerCount: 1,
+          isDirty: true,
           answers: [{
             id: 'A',
             title: '',

diff --git a/...neric/promptIfDirty/PromtIfDirty.test.jsx → ...c/promptIfDirty/usePromptIfDirty.test.jsx b/...neric/promptIfDirty/PromtIfDirty.test.jsx → ...c/promptIfDirty/usePromptIfDirty.test.jsx
@@ -1,71 +1,48 @@
-import React from 'react';
-import { render, unmountComponentAtNode } from 'react-dom';
-import { act } from 'react-dom/test-utils';
-import PromptIfDirty from './usePromptIfDirty';
+import { renderHook } from '@testing-library/react-hooks';
+import usePromptIfDirty from './usePromptIfDirty';
 
-describe('PromptIfDirty', () => {
-  let container = null;
+describe('usePromptIfDirty', () => {
   let mockEvent = null;
 
   beforeEach(() => {
-    container = document.createElement('div');
-    document.body.appendChild(container);
     mockEvent = new Event('beforeunload');
     jest.spyOn(window, 'addEventListener');
     jest.spyOn(window, 'removeEventListener');
     jest.spyOn(mockEvent, 'preventDefault');
     Object.defineProperty(mockEvent, 'returnValue', { writable: true });
-    mockEvent.returnValue = '';
   });
 
   afterEach(() => {
     window.addEventListener.mockRestore();
     window.removeEventListener.mockRestore();
     mockEvent.preventDefault.mockRestore();
     mockEvent = null;
-    unmountComponentAtNode(container);
-    container.remove();
-    container = null;
   });
 
   it('should add event listener on mount', () => {
-    act(() => {
-      render(<PromptIfDirty dirty />, container);
-    });
+    renderHook(() => usePromptIfDirty(() => true));
 
     expect(window.addEventListener).toHaveBeenCalledWith('beforeunload', expect.any(Function));
   });
 
   it('should remove event listener on unmount', () => {
-    act(() => {
-      render(<PromptIfDirty dirty />, container);
-    });
-    act(() => {
-      unmountComponentAtNode(container);
-    });
+    const { unmount } = renderHook(() => usePromptIfDirty(() => true));
+    unmount();
 
     expect(window.removeEventListener).toHaveBeenCalledWith('beforeunload', expect.any(Function));
   });
 
   it('should call preventDefault and set returnValue when dirty is true', () => {
-    act(() => {
-      render(<PromptIfDirty dirty />, container);
-    });
-    act(() => {
-      window.dispatchEvent(mockEvent);
-    });
+    renderHook(() => usePromptIfDirty(() => true));
+    window.dispatchEvent(mockEvent);
 
     expect(mockEvent.preventDefault).toHaveBeenCalled();
-    expect(mockEvent.returnValue).toBe('');
+    expect(mockEvent.returnValue).toBe(true);
   });
 
   it('should not call preventDefault when dirty is false', () => {
-    act(() => {
-      render(<PromptIfDirty dirty={false} />, container);
-    });
-    act(() => {
-      window.dispatchEvent(mockEvent);
-    });
+    renderHook(() => usePromptIfDirty(() => false));
+    window.dispatchEvent(mockEvent);
 
     expect(mockEvent.preventDefault).not.toHaveBeenCalled();
   });