fix(paste): Allow inserting multiple markup sections onto a list item (…

…#459) The first section is merged, subsequent sections form new list items. Fixes #456
bustle · Aug 23, 2016 · 1898cf5 · 1898cf5
1 parent f7c72cd
commit 1898cf5
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 9 deletions.
diff --git a/src/js/editor/post/post-inserter.js b/src/js/editor/post/post-inserter.js
@@ -66,8 +66,11 @@ class Visitor {
     if (this.cursorSection.isBlank && !this._isNested) {
       // replace blank section with entire post
       let newSections = node.sections.map(s => s.clone());
-      this._replaceSection(this.cursorSection, newSections);
-      this.cursorPosition = newSections[newSections.length - 1].tailPosition();
+      newSections.forEach(section => {
+        this._replaceSection(this.cursorSection, section);
+      });
+      let lastNewSection = newSections[newSections.length - 1];
+      this.cursorPosition = lastNewSection.tailPosition();
     } else {
       node.sections.forEach(section => this.visit(section));
     }
@@ -111,6 +114,17 @@ class Visitor {
   [MARKERABLE](section) {
     if (this._canMergeSection(section)) {
       this._mergeSection(section);
+    } else if (this._isNested && this._isMarkerable) {
+      // If we are attaching a markerable section to a list item,
+      // insert a linebreak then merge the section onto the resulting blank list item
+      this._breakAtCursor();
+
+      // Advance the cursor to the head of the blank list item
+      let nextPosition = this.cursorSection.next.headPosition();
+      this.cursorPosition = nextPosition;
+
+      // Merge this section onto the list item
+      this._mergeSection(section);
     } else {
       this._breakAtCursor();
       this._insertLeafSection(section);
@@ -215,17 +229,14 @@ class Visitor {
     this.cursorPosition = pre.tailPosition();
   }
 
-  _replaceSection(section, newSections) {
+  _replaceSection(section, newSection) {
     assert('Cannot replace section that does not have parent.sections',
            section.parent && section.parent.sections);
-    assert('Must pass enumerable to _replaceSection', !!newSections.forEach);
 
     let collection = section.parent.sections,
         reference = section.next;
     this.postEditor.removeSection(section);
-    newSections.forEach(_newSection => {
-      this.postEditor.insertSectionBefore(collection, _newSection, reference);
-    });
+    this.postEditor.insertSectionBefore(collection, newSection, reference);
   }
 
   _insertLeafSection(section) {
@@ -238,9 +249,9 @@ class Visitor {
     if (this.cursorSection.isBlank) {
       assert('Cannot insert leaf non-markerable section when cursor is nested',
              !(section.isMarkerable && this._isNested));
-      this._replaceSection(this.cursorSection, [section]);
+      this._replaceSection(this.cursorSection, section);
     } else if (this.cursorSection.next && this.cursorSection.next.isBlank) {
-      this._replaceSection(this.cursorSection.next, [section]);
+      this._replaceSection(this.cursorSection.next, section);
     } else {
       let reference = this.cursorSection.next;
       let collection = this.cursorSection.parent.sections;

diff --git a/tests/unit/editor/post/insert-post-test.js b/tests/unit/editor/post/insert-post-test.js
@@ -991,3 +991,39 @@ test('in nested markerable at middle with multiple items and paste is non-marker
                          expectedSection.tailPosition(),
                          'cursor at end of pasted');
 });
+
+// See https://github.com/bustlelabs/mobiledoc-kit/issues/456
+test('insert 2 markup sections onto list', (assert) => {
+  let {post: toInsert} = Helpers.postAbstract.buildFromText(['ghi','jkl']);
+  let {post: expected} = Helpers.postAbstract.buildFromText(['* abc','* defghi','* jkl']);
+
+  editor = buildEditorWithMobiledoc(({post, listSection, listItem, marker}) => {
+    return post([listSection('ul', [listItem([marker('abc')]), listItem([marker('def')])])]);
+  });
+
+  let position = editor.post.tailPosition();
+  postEditor = new PostEditor(editor);
+  postEditor.insertPost(position, toInsert);
+  postEditor.complete();
+
+  assert.postIsSimilar(editor.post, expected);
+  assert.renderTreeIsEqual(editor._renderTree, expected);
+});
+
+// See https://github.com/bustlelabs/mobiledoc-kit/issues/456
+test('insert 2 markup sections + non-markup onto list', (assert) => {
+  let {post: toInsert} = Helpers.postAbstract.buildFromText(['ghi','jkl', '[some-card]']);
+  let {post: expected} = Helpers.postAbstract.buildFromText(['* abc','* defghi','* jkl', '[some-card]']);
+
+  editor = buildEditorWithMobiledoc(({post, listSection, listItem, marker}) => {
+    return post([listSection('ul', [listItem([marker('abc')]), listItem([marker('def')])])]);
+  });
+
+  let position = editor.post.tailPosition();
+  postEditor = new PostEditor(editor);
+  postEditor.insertPost(position, toInsert);
+  postEditor.complete();
+
+  assert.postIsSimilar(editor.post, expected);
+  assert.renderTreeIsEqual(editor._renderTree, expected);
+});