Check for display of answers in the table cells of Live Results

This commit is contained in:
C. Fuhrman 2025-03-21 14:33:43 -04:00
parent 886b8125d3
commit 331ff33d5b
2 changed files with 37 additions and 3 deletions

View file

@ -152,7 +152,7 @@ describe('LiveResults', () => {
expect(classAverageElement).toBeInTheDocument();
});
test('displays the correct answers per question', () => {
test('displays the correct answers per question in %', () => {
render(
<LiveResults
socket={mockSocket}
@ -175,4 +175,33 @@ describe('LiveResults', () => {
});
});
test('displays the chosen answer in a question cell', () => {
render(
<LiveResults
socket={mockSocket}
questions={mockQuestions}
showSelectedQuestion={jest.fn()}
quizMode="teacher"
students={mockStudents}
/>
);
// Show answers should be enabled
const showAnswersSwitch = screen.getByLabelText('Afficher les réponses');
// Toggle the display of answers is it's not already enabled
if (!(showAnswersSwitch as HTMLInputElement).checked) {
fireEvent.click(showAnswersSwitch);
}
mockStudents.forEach((student) => {
student.answers.forEach((answer) => {
const chosenAnswerElements = screen.getAllByText(answer.answer.join(', '));
const chosenAnswerElement = chosenAnswerElements.find((element) => {
return element.closest('td')?.classList.contains('MuiTableCell-root');
});
expect(chosenAnswerElement).toBeInTheDocument();
});
});
});
});

View file

@ -42,7 +42,11 @@ const LiveResultsTableFooter: React.FC<LiveResultsFooterProps> = ({
const answer = student.answers.find(
(answer) => parseInt(answer.idQuestion.toString()) === index + 1
);
const answerText = answer ? answer.answer.toString() : '';
const answerText = answer
? Array.isArray(answer.answer)
? answer.answer.join(', ') // Join array elements with a space or another delimiter
: "" // never reached
: '';
const isCorrect = answer ? answer.isCorrect : false;
return (
@ -63,6 +67,7 @@ const LiveResultsTableFooter: React.FC<LiveResultsFooterProps> = ({
}
>
{showCorrectAnswers ? (
// strips out formatting of answer text here (it will break images, katex, etc.)
<div dangerouslySetInnerHTML={{ __html: FormattedTextTemplate({ format: '', text: answerText }) }}></div>
) : isCorrect ? (
<FontAwesomeIcon icon={faCheck} aria-label="correct" />