fix: choice parsing for answers with multi lines (#337)

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

@@ -198,10 +198,12 @@ export class OLXParser {
       );
     } else if (_.isArray(choice)) {
       choice.forEach((element, index) => {
-        const [preservedAnswer, ...preservedFeedback] = preservedAnswers[index];
+        const preservedAnswer = preservedAnswers[index].filter(answer => !Object.keys(answer).includes(`${option}hint`));
+        const preservedFeedback = preservedAnswers[index].filter(answer => Object.keys(answer).includes(`${option}hint`));
         let title = element['#text'];
+
         if (isComplexAnswer && preservedAnswer) {
-          title = this.richTextBuilder.build([preservedAnswer]);
+          title = this.richTextBuilder.build(preservedAnswer);
         }
         const correct = eval(element['@_correct'].toLowerCase());
         const id = indexToLetterMap[index];
@@ -216,10 +218,12 @@ export class OLXParser {
         );
       });
     } else {
-      const [preservedAnswer, ...preservedFeedback] = preservedAnswers[0];
+      const preservedAnswer = preservedAnswers[0].filter(answer => !Object.keys(answer).includes(`${option}hint`));
+      const preservedFeedback = preservedAnswers[0].filter(answer => Object.keys(answer).includes(`${option}hint`));
       let title = choice['#text'];
+
       if (isComplexAnswer && preservedAnswer) {
-        title = this.richTextBuilder.build([preservedAnswer]);
+        title = this.richTextBuilder.build(preservedAnswer);
       }
       const feedback = this.getAnswerFeedback(preservedFeedback, `${option}hint`);
       answers.push({

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

@@ -6,6 +6,7 @@ import {
   numericInputWithFeedbackAndHintsOLX,
   textInputWithFeedbackAndHintsOLX,
   multipleChoiceWithoutAnswers,
+  multipleChoiceSingleAnswer,
   multipleChoiceWithFeedbackAndHintsOLX,
   textInputWithFeedbackAndHintsOLXWithMultipleAnswers,
   advancedProblemOlX,
@@ -29,6 +30,7 @@ const numericOlxParser = new OLXParser(numericInputWithFeedbackAndHintsOLX.rawOL
 const dropdownOlxParser = new OLXParser(dropdownOLXWithFeedbackAndHintsOLX.rawOLX);
 const multipleChoiceOlxParser = new OLXParser(multipleChoiceWithFeedbackAndHintsOLX.rawOLX);
 const multipleChoiceWithoutAnswersOlxParser = new OLXParser(multipleChoiceWithoutAnswers.rawOLX);
+const multipleChoiceSingleAnswerOlxParser = new OLXParser(multipleChoiceSingleAnswer.rawOLX);
 const textInputOlxParser = new OLXParser(textInputWithFeedbackAndHintsOLX.rawOLX);
 const textInputMultipleAnswersOlxParser = new OLXParser(textInputWithFeedbackAndHintsOLXWithMultipleAnswers.rawOLX);
 const advancedOlxParser = new OLXParser(advancedProblemOlX.rawOLX);
@@ -179,6 +181,17 @@ describe('OLXParser', () => {
         expect(answers).toHaveLength(1);
       });
     });
+    describe('given a problem with one answer', () => {
+      const { answers } = multipleChoiceSingleAnswerOlxParser.parseMultipleChoiceAnswers(
+        'multiplechoiceresponse',
+        'choicegroup',
+        'choice',
+      );
+      it('should return a single answer', () => {
+        expect(answers).toEqual(multipleChoiceSingleAnswer.data.answers);
+        expect(answers).toHaveLength(1);
+      });
+    });
     describe('given multiple choice olx with hex numbers and leading zeros', () => {
       const olxparser = new OLXParser(numberParseTestOLX.rawOLX);
       const { answers } = olxparser.parseMultipleChoiceAnswers('multiplechoiceresponse', 'choicegroup', 'choice');

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

@@ -163,6 +163,77 @@ export const multipleChoiceWithoutAnswers = {
   },
 };
 
+export const multipleChoiceSingleAnswer = {
+  rawOLX: `<problem>
+  <multiplechoiceresponse>
+    <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes 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>
+    <choicegroup>
+      <choice correct="true"><p>a correct answer</p><div><img src="#" />image with <strong>caption</strong>.</div>
+        <choicehint selected="true"><p>You can specify optional feedback that appears after the learner selects and submits this answer.</p></choicehint>
+        <choicehint selected="false"><p>You can specify optional feedback that appears after the learner clears and submits this answer.</p></choicehint>
+      </choice>
+    </choicegroup>
+    <solution>
+      <div class="detailed-solution">
+          <p>Explanation</p>
+          <p>
+            You can form a voltage divider that evenly divides the input
+            voltage with two identically valued resistors, with the sampled
+            voltage taken in between the two.
+          </p>
+          <p><img src="/static/images/voltage_divider.png" alt=""></img></p>
+        </div>
+      </solution>
+  </multiplechoiceresponse>
+  </problem>`,
+  solutionExplanation: `
+  <p>
+      You can form a voltage divider that evenly divides the input
+      voltage with two identically valued resistors, with the sampled
+      voltage taken in between the two.
+  </p>
+  <p><img src="/static/images/voltage_divider.png" alt=""></img></p>`,
+  data: {
+    answers: [
+      {
+        id: 'A',
+        title: '<p>a correct answer</p><div><img src="#"></img>image with<strong>caption</strong>.</div>',
+        correct: true,
+        selectedFeedback: '<p>You can specify optional feedback that appears after the learner selects and submits this answer.</p>',
+        unselectedFeedback: '<p>You can specify optional feedback that appears after the learner clears and submits this answer.</p>',
+      },
+    ],
+  },
+  question: '<p>You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes 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>',
+  buildOLX: `<problem>
+  <multiplechoiceresponse>
+    <p>You can use this template as a guide to the simple editor markdown and OLX markup to use for checkboxes 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>
+    <checkboxgroup>
+      <choice correct="true">
+<p>a correct answer </p>       <choicehint selected="true"><p>You can specify optional feedback that appears after the learner selects and submits this answer.</p></choicehint>
+        <choicehint selected="false"><p>You can specify optional feedback that appears after the learner clears and submits this answer.</p></choicehint>
+      </choice>
+    </checkboxgroup>
+      <solution>
+      <div class="detailed-solution">
+      <p>Explanation</p>
+      <p>
+          You can form a voltage divider that evenly divides the input
+          voltage with two identically valued resistors, with the sampled
+          voltage taken in between the two.
+      </p>
+      <p><img src="/static/images/voltage_divider.png" alt=""></img></p>
+    </div>
+      </solution>
+  </multiplechoiceresponse>
+</problem>
+`,
+};
+
 export const dropdownOLXWithFeedbackAndHintsOLX = {
   rawOLX: `<problem>
 <optionresponse>