fix HTML representation

editors/demo/src/HHMI/MultipleChoiceQuestionService/components/QuestionComponent.js

@@ -77,10 +77,10 @@ export default ({ node, view, getPos }) => {
   });
 
   const removeOption = () => {
-    main.state.doc.nodesBetween(getPos(), getPos() + 1, (nodes, pos) => {
-      if (nodes.attrs.id === node.attrs.id) {
+    main.state.doc.nodesBetween(getPos(), getPos() + 1, (sinlgeNode, pos) => {
+      if (sinlgeNode.attrs.id === node.attrs.id) {
         main.dispatch(
-          main.state.tr.deleteRange(getPos(), getPos() + nodes.nodeSize),
+          main.state.tr.deleteRange(getPos(), getPos() + sinlgeNode.nodeSize),
         );
       }
     });
@@ -111,7 +111,7 @@ export default ({ node, view, getPos }) => {
           // create Empty Paragraph
           setTimeout(() => {
             helpers.createEmptyParagraph(context, newAnswerId);
-          }, 100);
+          }, 30);
         }
       }
     });

editors/demo/src/HHMI/MultipleChoiceQuestionService/helpers/helpers.js

@@ -10,21 +10,22 @@ const createEmptyParagraph = (context, newAnswerId) => {
         ),
       ),
     );
-
-    let type = context.view.main.state.schema.nodes.paragraph;
+    if (context.view[newAnswerId].dispatch) {
+      let type = context.view.main.state.schema.nodes.paragraph;
+      context.view[newAnswerId].dispatch(
+        context.view[newAnswerId].state.tr.insert(0, type.create()),
+      );
+    }
     context.view[newAnswerId].dispatch(
-      context.view[newAnswerId].state.tr.insert(0, type.create()),
+      context.view[newAnswerId].state.tr.setSelection(
+        TextSelection.between(
+          context.view[newAnswerId].state.selection.$anchor,
+          context.view[newAnswerId].state.selection.$head,
+        ),
+      ),
     );
+    context.view[newAnswerId].focus();
   }
-  context.view[newAnswerId].dispatch(
-    context.view[newAnswerId].state.tr.setSelection(
-      TextSelection.between(
-        context.view[newAnswerId].state.selection.$anchor,
-        context.view[newAnswerId].state.selection.$head,
-      ),
-    ),
-  );
-  context.view[newAnswerId].focus();
 };
 
 export default {

editors/demo/src/HHMI/MultipleChoiceQuestionService/schema/multipleChoiceNode.js

 const multipleChoiceNode = {
   attrs: {
+    class: { default: 'mutiple-choice-option' },
     id: { default: '' },
     correct: { default: false },
     feedback: { default: '' },
@@ -7,17 +8,18 @@ const multipleChoiceNode = {
   group: 'block',
   content: 'block*',
   // atom: true,
-  toDOM: node => ['multiple-choice', node.attrs, 0],
   parseDOM: [
     {
-      tag: 'multiple-choice',
+      tag: 'div.mutiple-choice-option',
       getAttrs(dom) {
         return {
           id: dom.getAttribute('id'),
+          class: dom.getAttribute('class'),
         };
       },
     },
   ],
+  toDOM: node => ['div', node.attrs, 0],
 };
 
 export default multipleChoiceNode;