fix EditorQuiz tests

This commit is contained in:
Philippe 2025-03-27 15:07:20 -04:00
parent b0cbb7af39
commit 58da59c632

View file

@ -1,62 +1,55 @@
import React from 'react'; import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react'; import { render, screen, waitFor } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
import QuizForm from '../../../../pages/Teacher/EditorQuiz/EditorQuiz'; import QuizForm from '../../../../pages/Teacher/EditorQuiz/EditorQuiz';
import { waitFor } from '@testing-library/react';
// Mock localStorage with proper TypeScript types
const localStorageMock = (() => { const localStorageMock = (() => {
let store: Record<string, string> = {}; let store: Record<string, string> = {};
return { return {
getItem: (key: string) => store[key] || null, getItem: (key: string): string | null => store[key] || null,
setItem: (key: string, value: string) => (store[key] = value.toString()), setItem: (key: string, value: string): void => {
clear: () => (store = {}), store[key] = value.toString();
},
clear: (): void => {
store = {};
},
}; };
})(); })();
Object.defineProperty(window, 'localStorage', { value: localStorageMock }); Object.defineProperty(window, 'localStorage', { value: localStorageMock });
// Mock react-router-dom
const mockNavigate = jest.fn();
jest.mock('react-router-dom', () => ({ jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'), ...jest.requireActual('react-router-dom'),
useNavigate: jest.fn(), useNavigate: () => mockNavigate,
useParams: () => ({ id: 'new' }), // Simulate the "new" route
}));
// Mock ApiService
jest.mock('../../../../services/ApiService', () => ({
getUserFolders: jest.fn(() => Promise.resolve([])), // Mock empty folder list
getQuiz: jest.fn(),
createQuiz: jest.fn(),
updateQuiz: jest.fn(),
uploadImage: jest.fn(),
})); }));
describe('QuizForm Component', () => { describe('QuizForm Component', () => {
test('renders QuizForm with default state for a new quiz', () => { test('renders QuizForm with default state for a new quiz', async () => {
render( render(
<MemoryRouter initialEntries={['/teacher/editor-quiz/new']}> <MemoryRouter initialEntries={['/teacher/editor-quiz/new']}>
<QuizForm /> <QuizForm />
</MemoryRouter> </MemoryRouter>
); );
expect(screen.queryByText('Éditeur de quiz')).toBeInTheDocument(); // Wait for the component to render the title
// expect(screen.queryByText('Éditeur')).toBeInTheDocument();
expect(screen.queryByText('Prévisualisation')).toBeInTheDocument();
});
test.skip('renders QuizForm for a new quiz', async () => {
const { container } = render(
<MemoryRouter initialEntries={['/teacher/editor-quiz']}>
<QuizForm />
</MemoryRouter>
);
expect(screen.getByText(/Éditeur de quiz/i)).toBeInTheDocument();
// find the 'editor' text area
const editorTextArea = container.querySelector('textarea.editor');
fireEvent.change(editorTextArea!, { target: { value: 'Sample question?' } });
await waitFor(() => { await waitFor(() => {
const sampleQuestionElements = screen.queryAllByText(/Sample question\?/i); expect(screen.getByText('Éditeur de Quiz')).toBeInTheDocument();
expect(sampleQuestionElements.length).toBeGreaterThan(0);
}); });
const saveButton = screen.getByText(/Enregistrer/i); // Check for other expected elements
fireEvent.click(saveButton); expect(screen.getByText('Prévisualisation')).toBeInTheDocument();
await waitFor(() => {
expect(screen.getByText(/Sauvegarder le questionnaire/i)).toBeInTheDocument();
}); });
});
}); });