fix(lists): fixed merge list (#373)

Author: makhnatkin

src/extensions/markdown/Lists/commands.test.ts

@@ -1,11 +1,10 @@
 import type {NodeType} from 'prosemirror-model';
-import {liftListItem, wrapInList} from 'prosemirror-schema-list';
+import {wrapInList} from 'prosemirror-schema-list';
 import type {Command} from 'prosemirror-state';
 
 import {joinPreviousBlock} from '../../../commands/join';
-import {get$CursorAtBlockStart} from '../../../utils/selection';
 
-import {findAnyParentList, isListItemNode, isListNode, isListOrItemNode, liType} from './utils';
+import {findAnyParentList, isListNode, isListOrItemNode} from './utils';
 
 export function toList(listType: NodeType): Command {
     return (state, dispatch) => {
@@ -20,17 +19,6 @@ export function toList(listType: NodeType): Command {
     };
 }
 
-export const liftIfCursorIsAtBeginningOfItem: Command = (state, dispatch) => {
-    const $cursor = get$CursorAtBlockStart(state.selection);
-    if (!$cursor) return false;
-    const {schema} = state;
-    const parentBlock = $cursor.node($cursor.depth - 1);
-    if (parentBlock.firstChild === $cursor.parent && isListItemNode(parentBlock)) {
-        return liftListItem(liType(schema))(state, dispatch);
-    }
-    return false;
-};
-
 export const joinPrevList = joinPreviousBlock({
     checkPrevNode: isListNode,
     skipNode: isListOrItemNode,

src/extensions/markdown/Lists/commands.ts

@@ -1,12 +1,11 @@
-import {chainCommands} from 'prosemirror-commands';
 import {liftListItem, sinkListItem, splitListItem} from 'prosemirror-schema-list';
 
 import type {Action, ExtensionAuto, Keymap} from '../../../core';
 import {withLogAction} from '../../../utils/keymap';
 
 import {ListsSpecs, blType, liType, olType} from './ListsSpecs';
 import {actions} from './actions';
-import {joinPrevList, liftIfCursorIsAtBeginningOfItem, toList} from './commands';
+import {joinPrevList, toList} from './commands';
 import {ListAction} from './const';
 import {ListsInputRulesExtension, ListsInputRulesOptions} from './inputrules';
 import {mergeListsPlugin} from './plugins/MergeListsPlugin';
@@ -42,7 +41,7 @@ export const Lists: ExtensionAuto<ListsOptions> = (builder, opts) => {
     builder.addKeymap(
         ({schema}) => ({
             Enter: splitListItem(liType(schema)),
-            Backspace: chainCommands(liftIfCursorIsAtBeginningOfItem, joinPrevList),
+            Backspace: joinPrevList,
         }),
         builder.Priority.Low,
     );

src/extensions/markdown/Lists/index.ts

@@ -13,7 +13,7 @@ const {schema, markupParser} = new ExtensionsManager({
     extensions: (builder) => builder.use(BaseSchemaSpecs, {}).use(ListsSpecs).use(CodeSpecs),
 }).buildDeps();
 
-const {doc, p, li, ul, c} = builders<'doc' | 'p' | 'li' | 'ul' | 'ol', 'c'>(schema, {
+const {doc, p, li, ul, c, ol} = builders<'doc' | 'p' | 'li' | 'ul' | 'ol', 'c'>(schema, {
     doc: {nodeType: BaseNode.Doc},
     p: {nodeType: BaseNode.Paragraph},
     li: {nodeType: ListNode.ListItem},
@@ -32,9 +32,21 @@ const nestedListsMarkup = `
 * Very easy!
 `;
 
+const orderedListMarkup = `
+1. Create a list by starting a line with \`+\`, \`-\`, or \`*\`
+2. Sub-lists are made by indenting 2 spaces:
+    1. Marker character change forces new list start:
+    2. Ac tristique libero volutpat at
+    3. Facilisis in pretium nisl aliquet
+    4. Nulla volutpat aliquam velit
+
+1. Very easy!
+2. Very easy!
+`;
+
 describe('Lists extension', () => {
     describe('MergeListsPlugin', () => {
-        it('should merge lists', () => {
+        it('should merge bullet lists', () => {
             const view = new EditorView(null, {
                 state: EditorState.create({schema, plugins: [mergeListsPlugin()]}),
             });
@@ -83,13 +95,66 @@ describe('Lists extension', () => {
                                 li({[ListsAttr.Markup]: '-'}, p('Nulla volutpat aliquam velit')),
                             ),
                         ),
+                        li({[ListsAttr.Markup]: '*'}, p('Very easy!')),
                     ),
-                    ul(
+                ),
+            );
+        });
+
+        it('should merge ordered lists', () => {
+            const view = new EditorView(null, {
+                state: EditorState.create({schema, plugins: [mergeListsPlugin()]}),
+            });
+            view.dispatch(
+                view.state.tr.replaceWith(
+                    0,
+                    view.state.doc.nodeSize - 2,
+                    markupParser.parse(orderedListMarkup).content,
+                ),
+            );
+            expect(view.state.doc).toMatchNode(
+                doc(
+                    ol(
                         {
-                            [ListsAttr.Tight]: true,
-                            [ListsAttr.Bullet]: '*',
+                            [ListsAttr.Bullet]: '.',
                         },
-                        li({[ListsAttr.Markup]: '*'}, p('Very easy!')),
+                        li(
+                            {
+                                [ListsAttr.Markup]: '.',
+                            },
+                            p(
+                                'Create a list by starting a line with ',
+                                c('+'),
+                                ', ',
+                                c('-'),
+                                ', or ',
+                                c('*'),
+                            ),
+                        ),
+                        li(
+                            {
+                                [ListsAttr.Markup]: '.',
+                            },
+                            p('Sub-lists are made by indenting 2 spaces:'),
+                            ol(
+                                {
+                                    [ListsAttr.Tight]: true,
+                                    [ListsAttr.Bullet]: '.',
+                                },
+                                li(
+                                    {[ListsAttr.Markup]: '.'},
+                                    p('Marker character change forces new list start:'),
+                                ),
+                                li({[ListsAttr.Markup]: '.'}, p('Ac tristique libero volutpat at')),
+                                li(
+                                    {[ListsAttr.Markup]: '.'},
+                                    p('Facilisis in pretium nisl aliquet'),
+                                ),
+                                li({[ListsAttr.Markup]: '.'}, p('Nulla volutpat aliquam velit')),
+                            ),
+                        ),
+                        li({[ListsAttr.Markup]: '.'}, p('Very easy!')),
+                        li({[ListsAttr.Markup]: '.'}, p('Very easy!')),
                     ),
                 ),
             );

src/extensions/markdown/Lists/plugins/MergeListsPlugin.test.ts

@@ -1,3 +1,4 @@
+import type {Node} from 'prosemirror-model';
 import {Plugin, Transaction} from 'prosemirror-state';
 import {findChildren, hasParentNode} from 'prosemirror-utils';
 
@@ -27,12 +28,18 @@ function mergeAdjacentNodesWithSameType(
     tr: Transaction,
     nodes: ReturnType<typeof findChildren>,
 ): void {
-    for (let i = nodes.length - 1; i > 0; i--) {
-        const prev = nodes[i - 1];
-        const next = nodes[i];
+    const posAfterMap: Partial<Record<number, Node>> = {};
 
-        if (prev.node.type === next.node.type && prev.pos + prev.node.nodeSize === next.pos) {
-            tr.join(next.pos);
+    for (const item of nodes) {
+        const posBefore = item.pos;
+        const posAfter = posBefore + item.node.nodeSize;
+
+        posAfterMap[posAfter] = item.node;
+
+        const nodeBefore = posAfterMap[posBefore];
+        if (nodeBefore?.type === item.node.type) {
+            tr.join(tr.mapping.map(posBefore));
+            posAfterMap[posBefore] = undefined;
         }
     }
 }