fix: parsing text input problems (#1679)

* Parse incorrect answer fields in text input problems
* Fix feedback order

Author: navinkarkera

src/editors/containers/ProblemEditor/components/EditProblemView/hooks.js

@@ -93,7 +93,7 @@ export const checkForNoAnswers = ({ openSaveWarningModal, problem }) => {
     const titles = [];
     answers.forEach(answer => {
       const title = simpleTextAreaProblems.includes(problemType) ? answer.title : answerTitles[answer.id];
-      if (title.length > 0) {
+      if (title?.length > 0) {
         titles.push(title);
       }
     });
@@ -108,7 +108,7 @@ export const checkForNoAnswers = ({ openSaveWarningModal, problem }) => {
     answers.forEach(answer => {
       if (answer.correct) {
         const title = simpleTextAreaProblems.includes(problemType) ? answer.title : answerTitles[answer.id];
-        if (title.length > 0) {
+        if (title?.length > 0) {
           correctAnswer = true;
         }
       }

src/editors/containers/ProblemEditor/data/OLXParser.js

@@ -140,10 +140,12 @@ export class OLXParser {
       [correctAnswerFeedbackTag, incorrectAnswerFeedbackTag] = option;
     }
     const problemBodyArr = problemBody[problemType];
+    let hasCorrectAnswerFeedback = isChoiceProblem;
     problemBodyArr.forEach(subtag => {
       const tagNames = Object.keys(subtag);
       if (!isChoiceProblem && tagNames.includes(correctAnswerFeedbackTag)) {
         preservedAnswers.unshift(subtag[correctAnswerFeedbackTag]);
+        hasCorrectAnswerFeedback = true;
       }
       if (problemType === ProblemTypeKeys.TEXTINPUT && tagNames.includes(incorrectAnswerFeedbackTag)) {
         preservedAnswers.push(subtag);
@@ -157,6 +159,11 @@ export class OLXParser {
         });
       }
     });
+    // Since the first feedback is taken as correct answer feedback by non-choice problems,
+    // we insert an empty array to preserve feedback order.
+    if (!hasCorrectAnswerFeedback) {
+      preservedAnswers.unshift([]);
+    }
     return preservedAnswers;
   }
 
@@ -360,7 +367,7 @@ export class OLXParser {
     const stringEqualHint = _.get(stringresponse, 'stringequalhint', []);
     if (_.isArray(stringEqualHint)) {
       stringEqualHint.forEach((newAnswer, indx) => {
-        answerFeedback = this.richTextBuilder.build(stringEqualHintFeedback[indx].stringequalhint);
+        answerFeedback = this.getFeedback(stringEqualHintFeedback[indx]?.stringequalhint);
         answers.push({
           id: indexToLetterMap[answers.length],
           title: newAnswer['@_answer'],
@@ -369,7 +376,7 @@ export class OLXParser {
         });
       });
     } else {
-      answerFeedback = this.richTextBuilder.build(stringEqualHintFeedback[0].stringequalhint);
+      answerFeedback = this.getFeedback(stringEqualHintFeedback[0]?.stringequalhint);
       answers.push({
         id: indexToLetterMap[answers.length],
         title: stringEqualHint['@_answer'],

src/editors/containers/ProblemEditor/data/OLXParser.test.js

@@ -4,6 +4,7 @@ import {
   dropdownOLXWithFeedbackAndHintsOLX,
   numericInputWithFeedbackAndHintsOLX,
   textInputWithFeedbackAndHintsOLX,
+  textInputWithFeedbackInIncorrectAnswerOnlyOLX,
   multipleChoiceWithoutAnswers,
   multipleChoiceSingleAnswer,
   multipleChoiceWithFeedbackAndHintsOLX,
@@ -39,6 +40,7 @@ const multipleChoiceOlxParser = new OLXParser(multipleChoiceWithFeedbackAndHints
 const multipleChoiceWithoutAnswersOlxParser = new OLXParser(multipleChoiceWithoutAnswers.rawOLX);
 const multipleChoiceSingleAnswerOlxParser = new OLXParser(multipleChoiceSingleAnswer.rawOLX);
 const textInputOlxParser = new OLXParser(textInputWithFeedbackAndHintsOLX.rawOLX);
+const textInputIncorrectFeedbackOlxParser = new OLXParser(textInputWithFeedbackInIncorrectAnswerOnlyOLX.rawOLX);
 const textInputMultipleAnswersOlxParser = new OLXParser(textInputWithFeedbackAndHintsOLXWithMultipleAnswers.rawOLX);
 const advancedOlxParser = new OLXParser(advancedProblemOlX.rawOLX);
 const multipleTextInputOlxParser = new OLXParser(multipleTextInputProblemOlX.rawOLX);
@@ -286,6 +288,13 @@ describe('OLXParser', () => {
         expect(answers).toHaveLength(3);
       });
     });
+    describe('given text input olx with feedback for incorrect answer only and hints', () => {
+      const { answers } = textInputIncorrectFeedbackOlxParser.parseStringResponse();
+      it('should equal an array of objects with length three', () => {
+        expect(answers).toEqual(textInputWithFeedbackInIncorrectAnswerOnlyOLX.data.answers);
+        expect(answers).toHaveLength(4);
+      });
+    });
     describe('given text input olx with feedback and hints with multiple answers', () => {
       const { answers } = textInputMultipleAnswersOlxParser.parseStringResponse();
       it('should equal an array of objects with length four', () => {

src/editors/containers/ProblemEditor/data/mockData/olxTestData.js

@@ -562,6 +562,86 @@ export const textInputWithFeedbackAndHintsOLX = {
 `,
 };
 
+export const textInputWithFeedbackInIncorrectAnswerOnlyOLX = {
+  rawOLX: `<problem>
+<stringresponse answer="the correct answer" type="ci">
+  <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for text input with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
+<label>Add the question text, or prompt, here. This text is required.</label>
+<description>You can add an optional tip or note related to the prompt like this. </description>
+  <additional_answer answer="optional acceptable variant of the correct answer"/>
+  <stringequalhint answer="optional incorrect answer such as a frequent misconception"><p>You can specify optional feedback for none, a subset, or all of the answers.</p></stringequalhint>
+  <stringequalhint answer="another optional incorrect answer such as a frequent misconception"><p>You can specify feedback again.</p></stringequalhint>
+  <textline size="20"/>
+</stringresponse>
+<demandhint>
+  <hint><p>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</p></hint>
+  <hint><p>If you add more than one hint, a different hint appears each time learners select the hint button.</p></hint>
+</demandhint>
+</problem>`,
+  hints: [{
+    id: 0,
+    value: '<p>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</p>',
+  },
+  {
+    id: 1,
+    value: '<p>If you add more than one hint, a different hint appears each time learners select the hint button.</p>',
+  },
+  ],
+  data: {
+    answers: [
+      {
+        id: 'A',
+        title: 'the correct answer',
+        correct: true,
+        selectedFeedback: '',
+      },
+      {
+        id: 'B',
+        title: 'optional acceptable variant of the correct answer',
+        correct: true,
+        selectedFeedback: '',
+      },
+      {
+        id: 'C',
+        title: 'optional incorrect answer such as a frequent misconception',
+        correct: false,
+        selectedFeedback: '<p>You can specify optional feedback for none, a subset, or all of the answers.</p>',
+      },
+      {
+        id: 'D',
+        title: 'another optional incorrect answer such as a frequent misconception',
+        correct: false,
+        selectedFeedback: '<p>You can specify feedback again.</p>',
+      },
+    ],
+    additionalStringAttributes: {
+      type: 'ci',
+      textline: {
+        size: '20',
+      },
+    },
+  },
+  question: `<p>You can use this template as a guide to the simple editor markdown and OLX markup to use for text input with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
+<label>Add the question text, or prompt, here. This text is required.</label>
+<em class="olx_description">You can add an optional tip or note related to the prompt like this. </em>`,
+  buildOLX: `<problem>
+  <stringresponse answer="the correct answer" type="ci">
+    <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for text input with hints and feedback problems. Edit this component to replace this template with your own assessment.</p>
+    <label>Add the question text, or prompt, here. This text is required.</label>
+    <em>You can add an optional tip or note related to the prompt like this.</em>
+    <correcthint><p>You can specify optional feedback like this, which appears after this answer is submitted.</p></correcthint>
+    <additional_answer answer="optional acceptable variant of the correct answer"></additional_answer>
+    <stringequalhint answer="optional incorrect answer such as a frequent misconception"><p>You can specify optional feedback for none, a subset, or all of the answers.</p></stringequalhint>
+    <textline size="20"></textline>
+  </stringresponse>
+  <demandhint>
+    <hint><p>You can add an optional hint like this. Problems that have a hint include a hint button, and this text appears the first time learners select the button.</p></hint>
+    <hint><p>If you add more than one hint, a different hint appears each time learners select the hint button.</p></hint>
+  </demandhint>
+</problem>
+`,
+};
+
 export const textInputWithFeedbackAndHintsOLXWithMultipleAnswers = {
   rawOLX: `<problem>
 <stringresponse answer="the correct answer" type="ci">