2025-01-11 02:22:14 -05:00
|
|
|
import React from 'react';
|
2024-09-15 21:41:24 -04:00
|
|
|
import { render, screen, fireEvent, act } from '@testing-library/react';
|
2024-03-29 20:08:34 -04:00
|
|
|
import '@testing-library/jest-dom';
|
2024-09-15 00:34:41 -04:00
|
|
|
import { MemoryRouter } from 'react-router-dom';
|
2025-01-23 22:38:22 -05:00
|
|
|
import { Question } from 'gift-pegjs';
|
2025-01-16 12:37:07 -05:00
|
|
|
import StudentModeQuiz from 'src/components/StudentModeQuiz/StudentModeQuiz';
|
2025-01-23 22:38:22 -05:00
|
|
|
import { parse } from 'gift-pegjs';
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 21:41:24 -04:00
|
|
|
const mockGiftQuestions = parse(
|
|
|
|
|
`::Sample Question 1:: Sample Question 1 {=Option A ~Option B}
|
|
|
|
|
|
|
|
|
|
::Sample Question 2:: Sample Question 2 {T}`);
|
|
|
|
|
|
2025-01-23 22:38:22 -05:00
|
|
|
const mockQuestions: Question[] = mockGiftQuestions.map((question, index) => {
|
|
|
|
|
if (question.type !== "Category")
|
|
|
|
|
question.id = (index + 1).toString();
|
|
|
|
|
const newMockQuestion = question;
|
2024-09-15 21:41:24 -04:00
|
|
|
return newMockQuestion;
|
|
|
|
|
});
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 00:34:41 -04:00
|
|
|
const mockSubmitAnswer = jest.fn();
|
|
|
|
|
const mockDisconnectWebSocket = jest.fn();
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 21:41:24 -04:00
|
|
|
beforeEach(() => {
|
|
|
|
|
render(
|
|
|
|
|
<MemoryRouter>
|
|
|
|
|
<StudentModeQuiz
|
2024-03-29 20:08:34 -04:00
|
|
|
questions={mockQuestions}
|
|
|
|
|
submitAnswer={mockSubmitAnswer}
|
|
|
|
|
disconnectWebSocket={mockDisconnectWebSocket}
|
2024-09-15 21:41:24 -04:00
|
|
|
/>
|
|
|
|
|
</MemoryRouter>);
|
|
|
|
|
});
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 21:41:24 -04:00
|
|
|
describe('StudentModeQuiz', () => {
|
|
|
|
|
test('renders the initial question', async () => {
|
|
|
|
|
expect(screen.getByText('Sample Question 1')).toBeInTheDocument();
|
|
|
|
|
expect(screen.getByText('Option A')).toBeInTheDocument();
|
|
|
|
|
expect(screen.getByText('Option B')).toBeInTheDocument();
|
|
|
|
|
expect(screen.getByText('Quitter')).toBeInTheDocument();
|
|
|
|
|
});
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 21:41:24 -04:00
|
|
|
test('handles answer submission text', async () => {
|
|
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Option A'));
|
2024-09-15 00:34:41 -04:00
|
|
|
});
|
2024-09-15 21:41:24 -04:00
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Répondre'));
|
|
|
|
|
});
|
|
|
|
|
|
2024-09-26 00:34:30 -04:00
|
|
|
expect(mockSubmitAnswer).toHaveBeenCalledWith('Option A', 1);
|
2024-03-29 20:08:34 -04:00
|
|
|
});
|
|
|
|
|
|
2024-09-15 00:34:41 -04:00
|
|
|
test('handles quit button click', async () => {
|
2024-09-15 21:41:24 -04:00
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Quitter'));
|
2024-09-15 00:34:41 -04:00
|
|
|
});
|
2024-09-15 21:41:24 -04:00
|
|
|
|
|
|
|
|
expect(mockDisconnectWebSocket).toHaveBeenCalled();
|
2024-03-29 20:08:34 -04:00
|
|
|
});
|
|
|
|
|
|
2024-09-15 00:34:41 -04:00
|
|
|
test('navigates to the next question', async () => {
|
2024-09-15 21:41:24 -04:00
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Option A'));
|
|
|
|
|
});
|
|
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Répondre'));
|
|
|
|
|
});
|
|
|
|
|
act(() => {
|
|
|
|
|
fireEvent.click(screen.getByText('Question suivante'));
|
2024-09-15 00:34:41 -04:00
|
|
|
});
|
2024-03-29 20:08:34 -04:00
|
|
|
|
2024-09-15 21:41:24 -04:00
|
|
|
const sampleQuestionElements = screen.queryAllByText(/Sample question 2/i);
|
|
|
|
|
expect(sampleQuestionElements.length).toBeGreaterThan(0);
|
|
|
|
|
expect(screen.getByText('V')).toBeInTheDocument();
|
|
|
|
|
|
2024-03-29 20:08:34 -04:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|