fix: error when removing 2nd list item (close #241) (#243)

- it produce a arbitrary nesting list we can not process - unwrap arbitrary nesting list
nhn · Jan 2, 2020 · fc56d47 · fc56d47
1 parent d6db563
commit fc56d47
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 6 deletions.
diff --git a/apps/core/src/js/wwListManager.js b/apps/core/src/js/wwListManager.js
@@ -231,18 +231,35 @@ class WwListManager {
     let nestedList = wrapperDiv.querySelector(NESTED_LIST_QUERY);
     while (nestedList !== null) {
       let prevLI = nestedList.previousElementSibling;
-      while (prevLI.tagName !== 'LI') {
+      while (prevLI && prevLI.tagName !== 'LI') {
         prevLI = prevLI.previousElementSibling;
       }
 
-      prevLI.appendChild(nestedList);
+      if (prevLI) {
+        prevLI.appendChild(nestedList);
+      } else {
+        this._unwrap(nestedList);
+      }
 
       nestedList = wrapperDiv.querySelector(NESTED_LIST_QUERY);
     }
 
     return wrapperDiv.innerHTML;
   }
 
+  /**
+   * unwrap nesting list
+   * @param {Node} nestedList - nested list to unwrap
+   * @private
+   */
+  _unwrap(nestedList) {
+    const fragment = document.createDocumentFragment();
+    while (nestedList.firstChild) {
+      fragment.appendChild(nestedList.firstChild);
+    }
+    nestedList.parentNode.replaceChild(fragment, nestedList);
+  }
+
   /**
    * Return lines in selection
    * @param {Node} start Start element

diff --git a/apps/core/test/unit/wwListManager.spec.js b/apps/core/test/unit/wwListManager.spec.js
@@ -52,7 +52,8 @@ describe('WwListManager', () => {
         '</ul>',
         '<ol>',
         '<li><div>me too!</div></li>',
-        '</ol>'].join(''));
+        '</ol>'
+      ].join(''));
 
       expect(wwe.get$Body().find('ul').length).toEqual(1);
       expect(wwe.get$Body().find('ol').length).toEqual(1);
@@ -114,7 +115,8 @@ describe('WwListManager', () => {
         '<li><div>t5</div></li>',
         '</ul>',
         '</li>',
-        '</ul>'].join(''));
+        '</ul>'
+      ].join(''));
       mgr._removeBranchListAll();
 
       expect(wwe.get$Body().find('ul').length).toEqual(3);
@@ -136,7 +138,8 @@ describe('WwListManager', () => {
         '</li>',
         '<li><div>t2</div></li>',
         '</ul>',
-        '</div>'].join(''));
+        '</div>'
+      ].join(''));
 
       mgr._removeBranchListAll();
 
@@ -155,7 +158,8 @@ describe('WwListManager', () => {
         '<li><div>t4<br></div></li>',
         '</ul>',
         '</li>',
-        '</ul>'].join(''));
+        '</ul>'
+      ].join(''));
       mgr._removeBranchListAll();
 
       expect(wwe.get$Body().find('ul').length).toEqual(2);
@@ -218,6 +222,26 @@ describe('WwListManager', () => {
     });
   });
 
+  describe('_unwrap', () => {
+    it('should unwrap itself and preserve the children', () => {
+      const arbitraryNestingList = $(`
+        <ul id="first">
+          <ul id="second">
+            <li>arbitrary nesting list item</li>
+            <li>arbitrary nesting list item</li>
+          </ul>
+        </ul>`).get(0);
+
+      mgr._unwrap(arbitraryNestingList.querySelector('ul ul'));
+
+      // <ul id="first">
+      //   <li>arbitrary nesting list item</li>
+      //   <li>arbitrary nesting list item</li>
+      // </ul>
+      expect(arbitraryNestingList.querySelector('ul ul')).toBeFalsy();
+    });
+  });
+
   describe('mergeList', () => {
     it('should merge list to previous list', () => {
       const list = $(`