fix: add html render support for hard breaks/br tags

StackExchange · Nov 9, 2021 · a360b6d · a360b6d
1 parent 746743e
commit a360b6d
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 16 deletions.
diff --git a/src/rich-text/markdown-serializer.ts b/src/rich-text/markdown-serializer.ts
@@ -22,7 +22,8 @@ export type MarkdownSerializerNodes = {
 /** Renders a node as wrapped in html tags if the markup attribute is html */
 function renderHtmlTag(
     state: MarkdownSerializerState,
-    node: ProsemirrorNode
+    node: ProsemirrorNode,
+    selfClosing = false
 ): boolean {
     const markup = node.attrs.markup as string;
     if (!markup) {
@@ -34,9 +35,15 @@ function renderHtmlTag(
         return false;
     }
 
+    // TODO attributes
+    // if the tag is self closing, just render the markup itself and return
+    if (selfClosing) {
+        state.text(markup.trim(), false);
+        return true;
+    }
+
     const tag = markup.replace(/[<>]/g, "");
 
-    // TODO self closing?
     state.text(`<${tag}>`, false);
     // TODO will this always be inline content?
     state.renderInline(node);
@@ -124,7 +131,9 @@ const defaultMarkdownSerializerNodes: MarkdownSerializerNodes = {
         });
     },
     list_item(state, node) {
-        // TODO could be html
+        if (renderHtmlTag(state, node)) {
+            return;
+        }
         state.renderContent(node);
     },
     paragraph(state, node) {
@@ -147,6 +156,10 @@ const defaultMarkdownSerializerNodes: MarkdownSerializerNodes = {
         );
     },
     hard_break(state, node, parent, index) {
+        if (renderHtmlTag(state, node, true)) {
+            return;
+        }
+
         // TODO could be html, `[space][space][newline]` or `\[newline]`
         // TODO markdown-it's output doesn't differentiate in the later two cases, so assume spacespace since that is likely more common
         for (let i = index + 1; i < parent.childCount; i++)
@@ -191,8 +204,6 @@ const customMarkdownSerializerNodes: MarkdownSerializerNodes = {
     // TODO
     html_block(state, node) {
         state.write(node.attrs.content);
-        state.ensureNewLine();
-        state.write("\n");
     },
 
     // TODO

diff --git a/test/rich-text/markdown-serializer.test.ts b/test/rich-text/markdown-serializer.test.ts
@@ -123,17 +123,17 @@ describe("markdown-serializer", () => {
         [`- li1\n- li2\n- li3`, `- li1\n- li2\n- li3`],
         [`+ li1\n+ li2\n+ li3`, `+ li1\n+ li2\n+ li3`],
         [`* li1\n* li2\n* li3`, `* li1\n* li2\n* li3`],
-        // [
-        //     `<ul><li>li1</li><li>li2</li></ul>`,
-        //     `<ul><li>li1</li><li>li2</li></ul>`,
-        // ],
+        [
+            `<ul><li>li1</li><li>li2</li></ul>`,
+            `<ul><li>li1</li><li>li2</li></ul>`,
+        ],
         //[`1. li1\n1. li2\n1. li3`, `1. li1\n1. li2\n1. li3`],
         [`1. li1\n2. li2\n3. li3`, `1. li1\n2. li2\n3. li3`],
         [`1) li1\n2) li2\n3) li3`, `1) li1\n2) li2\n3) li3`],
-        // [
-        //     `<ol><li>li1</li><li>li2</li></ol>`,
-        //     `<ol><li>li1</li><li>li2</li></ol>`,
-        // ],
+        [
+            `<ol><li>li1</li><li>li2</li></ol>`,
+            `<ol><li>li1</li><li>li2</li></ol>`,
+        ],
         //loose lists
         [`- li1\n\n- li2\n\n- li3`, `- li1\n\n- li2\n\n- li3`],
         [`1. li1\n\n2. li2\n\n3. li3`, `1. li1\n\n2. li2\n\n3. li3`],
@@ -172,9 +172,9 @@ describe("markdown-serializer", () => {
         [`test\n\ntest`, `test\n\ntest`],
         //[`test\\\ntest`, `test\\\ntest`],
         [`test  \ntest`, `test  \ntest`],
-        // [`test<br>test`, `test<br>test`],
-        // [`test<br/>test`, `test<br/>test`],
-        // [`test<br />test`, `test<br />test`],
+        [`test<br>test`, `test<br>test`],
+        [`test<br/>test`, `test<br/>test`],
+        [`test<br />test`, `test<br />test`],
         // TODO html_inline, html_block, html_block_container
         // TODO stack_snippet, softbreak, table, taglink, spoiler
         /* Marks */