From 6b173dd92f1f016baad3fe9b7cf26174a79619ef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Petri=20=C3=84mm=C3=A4l=C3=A4?= Date: Fri, 27 Sep 2024 08:23:15 +0300 Subject: [PATCH 1/3] Revert exam grading instruction being editable Only need to edit answer grading instructions. --- .../ExamGradingInstruction.tsx | 17 ++++++----------- packages/mastering/src/mastering/index.ts | 13 +------------ packages/mastering/src/mastering/schema.ts | 1 - 3 files changed, 7 insertions(+), 24 deletions(-) diff --git a/packages/core/src/components/grading-instructions/ExamGradingInstruction.tsx b/packages/core/src/components/grading-instructions/ExamGradingInstruction.tsx index 2d63a518a9..ef76a48ad0 100644 --- a/packages/core/src/components/grading-instructions/ExamGradingInstruction.tsx +++ b/packages/core/src/components/grading-instructions/ExamGradingInstruction.tsx @@ -1,15 +1,10 @@ -import React, { useContext } from 'react' +import React from 'react' import { ExamComponentProps } from '../../createRenderChildNodes' -import { GradingInstructionContext } from '../context/GradingInstructionContext' -import EditableGradingInstruction from './EditableGradingInstruction' -const ExamGradingInstruction: React.FunctionComponent = ({ element, renderChildNodes }) => { - const { editable } = useContext(GradingInstructionContext) +const ExamGradingInstruction: React.FunctionComponent = ({ element, renderChildNodes }) => ( +
+ {renderChildNodes(element)} +
+) - return ( -
- {editable ? : renderChildNodes(element)} -
- ) -} export default ExamGradingInstruction diff --git a/packages/mastering/src/mastering/index.ts b/packages/mastering/src/mastering/index.ts index 72047d83bf..49eaa1d8a7 100644 --- a/packages/mastering/src/mastering/index.ts +++ b/packages/mastering/src/mastering/index.ts @@ -694,13 +694,6 @@ function findLocalization(gradingInstruction: GradingInstruction, language: stri ) } -function addGradingInstructionAttributesForExam(exam: Exam, language: string, type: ExamType) { - if (exam.examGradingInstruction) { - const localization = findLocalization(exam.examGradingInstruction, language, type) - exam.examGradingInstruction.element.attr('path', localization?.path() ?? exam.examGradingInstruction.element.path()) - } -} - function addGradingInstructionAttributesForQuestions(questions: Question[], language: string, type: ExamType) { for (const question of questions) { if (question.gradingInstruction) { @@ -725,7 +718,6 @@ function addGradingInstructionAttributesForAnswers(answers: Answer[], language: function addGradingInstructionAttributes(root: Element, language: string, type: ExamType) { const exam = parseExamStructure(root) - addGradingInstructionAttributesForExam(exam, language, type) addGradingInstructionAttributesForQuestions(exam.questions, language, type) addGradingInstructionAttributesForAnswers(exam.answers, language, type) } @@ -868,9 +860,6 @@ function mkError(message: string, element: Element): SyntaxError { function parseExamStructure(element: Element): Exam { const sections = element.find('//e:section', ns).map(parseSection) - const [examGradingInstruction] = element - .find('//e:exam-grading-instruction', ns) - .map(parseGradingInstruction) const topLevelQuestions = sections.flatMap(s => s.questions) const questions: Question[] = [] const answers: Answer[] = [] @@ -883,7 +872,7 @@ function parseExamStructure(element: Element): Exam { topLevelQuestions.forEach(collect) - return { element, sections, questions, topLevelQuestions, answers, examGradingInstruction } + return { element, sections, questions, topLevelQuestions, answers } } function parseSection(element: Element): Section { diff --git a/packages/mastering/src/mastering/schema.ts b/packages/mastering/src/mastering/schema.ts index b39518098e..c83be595c2 100644 --- a/packages/mastering/src/mastering/schema.ts +++ b/packages/mastering/src/mastering/schema.ts @@ -15,7 +15,6 @@ export interface Exam { questions: Question[] topLevelQuestions: Question[] answers: Answer[] - examGradingInstruction?: GradingInstruction } export interface Section { From a1bb319b7c2337d08e57ffb5eb1e1cc3de9347f3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Petri=20=C3=84mm=C3=A4l=C3=A4?= Date: Thu, 26 Sep 2024 16:23:03 +0300 Subject: [PATCH 2/3] Put some padding to make cursor visible at the edge --- .../src/components/grading-instructions/editor/Editor.less | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/core/src/components/grading-instructions/editor/Editor.less b/packages/core/src/components/grading-instructions/editor/Editor.less index 70bd763b71..2360b7ea33 100644 --- a/packages/core/src/components/grading-instructions/editor/Editor.less +++ b/packages/core/src/components/grading-instructions/editor/Editor.less @@ -49,3 +49,6 @@ } } +.ProseMirror-focused { + padding: 3px; +} \ No newline at end of file From 6c90c928bbccaaca7c5bb46978d10ea3167e25a4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Petri=20=C3=84mm=C3=A4l=C3=A4?= Date: Thu, 26 Sep 2024 16:31:51 +0300 Subject: [PATCH 3/3] Prevent triggering onContentChange if nothing changed --- packages/core/__tests__/editor/nbsp.test.tsx | 2 +- .../EditableGradingInstruction.tsx | 29 +++++++++++-------- 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/packages/core/__tests__/editor/nbsp.test.tsx b/packages/core/__tests__/editor/nbsp.test.tsx index 0626b1e52e..5b65a6fd8d 100644 --- a/packages/core/__tests__/editor/nbsp.test.tsx +++ b/packages/core/__tests__/editor/nbsp.test.tsx @@ -50,7 +50,7 @@ describe('Editor - NBSP', () => { await act(async () => { await userEvent.click(await result.findByText('NBSP')) }) - expect(onContentChangeMock).toHaveBeenCalledTimes(2) // focus causes another call + expect(onContentChangeMock).toHaveBeenCalledTimes(1) expect(onContentChangeMock).toHaveBeenLastCalledWith(expectedOutput, '') }) }) diff --git a/packages/core/src/components/grading-instructions/EditableGradingInstruction.tsx b/packages/core/src/components/grading-instructions/EditableGradingInstruction.tsx index 16e4a7460c..cb463554b8 100644 --- a/packages/core/src/components/grading-instructions/EditableGradingInstruction.tsx +++ b/packages/core/src/components/grading-instructions/EditableGradingInstruction.tsx @@ -64,18 +64,23 @@ function EditableGradingInstruction({ element }: { element: Element }) { mount={mount} state={state} dispatchTransaction={tr => { - setState(s => s.apply(tr)) - const fragment = DOMSerializer.fromSchema(outputSchema).serializeFragment(tr.doc.content) - const div = document.createElement('div') - div.appendChild(fragment) - const path = element.getAttribute('path') ?? '' - if (onContentChange) { - const nbspFixed = div.innerHTML - .replace(/ /g, ' ') - .replace(/
/g, '
') - .replace(/
/g, '
') - onContentChange(nbspFixed, path) - } + setState(s => { + const newContent = s.apply(tr) + if (tr.docChanged) { + const fragment = DOMSerializer.fromSchema(outputSchema).serializeFragment(tr.doc.content) + const div = document.createElement('div') + div.appendChild(fragment) + const path = element.getAttribute('path') ?? '' + if (onContentChange) { + const nbspFixed = div.innerHTML + .replace(/ /g, ' ') + .replace(/
/g, '
') + .replace(/
/g, '
') + onContentChange(nbspFixed, path) + } + } + return newContent + }) }} >