Renames (Display), fixes

This commit is contained in:
C. Fuhrman 2025-01-24 16:50:01 -05:00
parent ffa2200606
commit 54dc6b48a6
16 changed files with 51 additions and 41 deletions

View file

@ -1,10 +1,10 @@
import React from 'react'; import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react'; import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import MultipleChoiceQuestionDisplay from 'src/components/Questions/MultipleChoiceQuestionDisplay/MultipleChoiceQuestionDisplay';
import { act } from 'react'; import { act } from 'react';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
import { MultipleChoiceQuestion, parse } from 'gift-pegjs'; import { MultipleChoiceQuestion, parse } from 'gift-pegjs';
import MultipleChoiceQuestionDisplay from 'src/components/QuestionsDisplay/MultipleChoiceQuestionDisplay/MultipleChoiceQuestionDisplay';
const questions = parse( const questions = parse(
`::Sample Question 1:: Question stem `::Sample Question 1:: Question stem

View file

@ -1,10 +1,9 @@
// NumericalQuestion.test.tsx
import React from 'react'; import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react'; import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import NumericalQuestionDisplay from 'src/components/Questions/NumericalQuestionDisplay/NumericalQuestionDisplay';
import { NumericalQuestion, parse, ParsedGIFTQuestion } from 'gift-pegjs'; import { NumericalQuestion, parse, ParsedGIFTQuestion } from 'gift-pegjs';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
import NumericalQuestionDisplay from 'src/components/QuestionsDisplay/NumericalQuestionDisplay/NumericalQuestionDisplay';
const questions = parse( const questions = parse(
` `

View file

@ -2,7 +2,7 @@
import React from 'react'; import React from 'react';
import { render, screen, fireEvent, within } from '@testing-library/react'; import { render, screen, fireEvent, within } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import QuestionDisplay from 'src/components/Questions/QuestionDisplay'; import QuestionDisplay from 'src/components/QuestionsDisplay/QuestionDisplay';
import { parse, Question } from 'gift-pegjs'; import { parse, Question } from 'gift-pegjs';
describe('Questions Component', () => { describe('Questions Component', () => {
@ -29,13 +29,23 @@ describe('Questions Component', () => {
render(<QuestionDisplay question={question} {...sampleProps} />); render(<QuestionDisplay question={question} {...sampleProps} />);
}; };
it('parsed questions correctly', () => { describe('question type parsing', () => {
it('parses true/false question type correctly', () => {
expect(sampleTrueFalseQuestion.type).toBe('TF'); expect(sampleTrueFalseQuestion.type).toBe('TF');
expect(sampleMultipleChoiceQuestion.type).toBe('MC');
expect(sampleNumericalQuestion.type).toBe('Numerical');
expect(sampleShortAnswerQuestion.type).toBe('Short');
}); });
it('parses multiple choice question type correctly', () => {
expect(sampleMultipleChoiceQuestion.type).toBe('MC');
});
it('parses numerical question type correctly', () => {
expect(sampleNumericalQuestion.type).toBe('Numerical');
});
it('parses short answer question type correctly', () => {
expect(sampleShortAnswerQuestion.type).toBe('Short');
});
});
it('renders correctly for True/False question', () => { it('renders correctly for True/False question', () => {
renderComponent(sampleTrueFalseQuestion); renderComponent(sampleTrueFalseQuestion);

View file

@ -1,9 +1,8 @@
// ShortAnswerQuestion.test.tsx
import React from 'react'; import React from 'react';
import { render, screen, fireEvent, within } from '@testing-library/react'; import { render, screen, fireEvent, within } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import ShortAnswerQuestionDisplay from 'src/components/Questions/ShortAnswerQuestionDisplay/ShortAnswerQuestionDisplay';
import { parse, ShortAnswerQuestion } from 'gift-pegjs'; import { parse, ShortAnswerQuestion } from 'gift-pegjs';
import ShortAnswerQuestionDisplay from 'src/components/QuestionsDisplay/ShortAnswerQuestionDisplay/ShortAnswerQuestionDisplay';
describe('ShortAnswerQuestion Component', () => { describe('ShortAnswerQuestion Component', () => {
const mockHandleSubmitAnswer = jest.fn(); const mockHandleSubmitAnswer = jest.fn();

View file

@ -2,8 +2,8 @@
import React from 'react'; import React from 'react';
import { render, fireEvent, screen, act } from '@testing-library/react'; import { render, fireEvent, screen, act } from '@testing-library/react';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import TrueFalseQuestion from 'src/components/Questions/TrueFalseQuestion/TrueFalseQuestion';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
import TrueFalseQuestion from 'src/components/QuestionsDisplay/TrueFalseQuestionDisplay/TrueFalseQuestionDisplay';
describe('TrueFalseQuestion Component', () => { describe('TrueFalseQuestion Component', () => {
const mockHandleSubmitAnswer = jest.fn(); const mockHandleSubmitAnswer = jest.fn();

View file

@ -3,7 +3,7 @@ import React from 'react';
import { render, fireEvent, act } from '@testing-library/react'; import { render, fireEvent, act } from '@testing-library/react';
import { screen } from '@testing-library/dom'; import { screen } from '@testing-library/dom';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
import { parse } from 'gift-pegjs'; import { MultipleChoiceQuestion, parse } from 'gift-pegjs';
import TeacherModeQuiz from 'src/components/TeacherModeQuiz/TeacherModeQuiz'; import TeacherModeQuiz from 'src/components/TeacherModeQuiz/TeacherModeQuiz';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
@ -14,7 +14,11 @@ const mockGiftQuestions = parse(
describe('TeacherModeQuiz', () => { describe('TeacherModeQuiz', () => {
const mockQuestion = mockGiftQuestions[0]; it ('renders the initial question as MultipleChoiceQuestion', () => {
expect(mockGiftQuestions[0].type).toBe('MC');
});
const mockQuestion = mockGiftQuestions[0] as MultipleChoiceQuestion;
mockQuestion.id = '1'; mockQuestion.id = '1';
const mockSubmitAnswer = jest.fn(); const mockSubmitAnswer = jest.fn();

View file

@ -1,22 +1,23 @@
import { TemplateOptions, Description as DescriptionType } from './types'; import { TemplateOptions } from './types';
import QuestionContainer from './QuestionContainer'; import QuestionContainer from './QuestionContainer';
import Title from './Title'; import Title from './Title';
import textType from './TextType'; import { textType } from './TextType';
import { ParagraphStyle } from '../constants'; import { ParagraphStyle } from '../constants';
import { state } from '.'; import { state } from '.';
import { Description } from 'gift-pegjs';
type DescriptionOptions = TemplateOptions & DescriptionType; type DescriptionOptions = TemplateOptions & Description;
export default function Description({ title, stem }: DescriptionOptions): string { export default function DescriptionTemplate({ title, formattedStem}: DescriptionOptions): string {
return `${QuestionContainer({ return `${QuestionContainer({
children: [ children: [
Title({ Title({
type: 'Description', type: 'Description',
title: title title: title
}), }),
`<p style="${ParagraphStyle(state.theme)}">${textType({ `<p style="${ParagraphStyle(state.theme)}">
text: stem ${textType(formattedStem)}
})}</p>` </p>`
] ]
})}`; })}`;
} }

View file

@ -1,10 +1,7 @@
import { marked } from 'marked'; import { marked } from 'marked';
import katex from 'katex'; import katex from 'katex';
import { TemplateOptions, TextFormat } from './types'; import { TextFormat } from 'gift-pegjs';
interface TextTypeOptions extends TemplateOptions {
text: TextFormat;
}
export function formatLatex(text: string): string { export function formatLatex(text: string): string {
return text return text
@ -28,10 +25,10 @@ export function formatLatex(text: string): string {
* @see marked * @see marked
* @see katex * @see katex
*/ */
export function textType({ text }: TextTypeOptions) { export function textType(formattedText: TextFormat): string {
const formatText = formatLatex(text.text.trim()); // latex needs pure "&", ">", etc. Must not be escaped const formatText = formatLatex(formattedText.text.trim()); // latex needs pure "&", ">", etc. Must not be escaped
let parsedText = ''; let parsedText = '';
switch (text.format) { switch (formattedText.format) {
case 'moodle': case 'moodle':
case 'plain': case 'plain':
// Replace newlines with <br> tags // Replace newlines with <br> tags
@ -43,6 +40,6 @@ export function textType({ text }: TextTypeOptions) {
parsedText = marked.parse(formatText, { breaks: true }) as string; // https://github.com/markedjs/marked/discussions/3219 parsedText = marked.parse(formatText, { breaks: true }) as string; // https://github.com/markedjs/marked/discussions/3219
return parsedText.replace(/(^<p>)(.*?)(<\/p>)$/gm, '$2'); return parsedText.replace(/(^<p>)(.*?)(<\/p>)$/gm, '$2');
default: default:
throw new Error(`Unsupported text format: ${text.format}`); throw new Error(`Unsupported text format: ${formattedText.format}`);
} }
} }

View file

@ -1,5 +1,5 @@
import Category from './Category'; import Category from './Category';
import Description from './Description'; import DescriptionTemplate from './Description';
import Essay from './Essay'; import Essay from './Essay';
import Matching from './Matching'; import Matching from './Matching';
import MultipleChoice from './MultipleChoice'; import MultipleChoice from './MultipleChoice';
@ -67,7 +67,7 @@ export function ErrorTemplate(text: string, options?: Partial<DisplayOptions>):
export { export {
Category, Category,
Description, DescriptionTemplate as Description,
Essay, Essay,
Matching, Matching,
MultipleChoice, MultipleChoice,

View file

@ -12,13 +12,13 @@ export interface DisplayOptions {
preview: boolean; preview: boolean;
} }
export { // export {
QuestionType, FormatType, NumericalType, TextFormat, NumericalFormat, TextChoice, NumericalChoice, Question, Description, Category, MultipleChoice, ShortAnswer, Numerical, Essay, TrueFalse, // QuestionType, FormatType, NumericalType, TextFormat, NumericalFormat, TextChoice, NumericalChoice, Question, Description, Category, MultipleChoice, ShortAnswer, Numerical, Essay, TrueFalse,
Matching, Match, GIFTQuestion } from 'gift-pegjs'; // Matching, Match, GIFTQuestion } from 'gift-pegjs';
export interface Choice { // export interface Choice {
isCorrect: boolean; // isCorrect: boolean;
weight: number | null; // weight: number | null;
text: TextFormat | NumericalFormat; // text: TextFormat | NumericalFormat;
feedback: TextFormat | null; // feedback: TextFormat | null;
} // }