Merge pull request #5904 from marcellamaki/fix-linebreaks

update how linebreaks are saved so they render properly in perseus

Author: rtibbles

contentcuration/contentcuration/frontend/shared/views/TipTapEditor/TipTapEditor/utils/markdownSerializer.js

@@ -57,14 +57,25 @@ export const createCustomMarkdownSerializer = editor => {
       switch (node.type.name) {
         case 'doc': {
           const parts = [];
-          // Process all children
           if (node.content && node.content.size > 0) {
             for (let i = 0; i < node.content.size; i++) {
               const child = node.content.content[i];
-              if (child) parts.push(serializeNode(child, null, depth));
+              if (child)
+                parts.push({ type: child.type?.name, md: serializeNode(child, null, depth) });
             }
           }
-          return parts.join('\n\n');
+          // Use a hard break (  \n) between consecutive plain paragraphs so Perseus
+          // renders them as <br> (inline-safe). All other block transitions keep \n\n
+          // so marked still parses lists, headings, etc. correctly.
+          return parts
+            .map((part, idx) => {
+              if (idx === 0) return part.md;
+              const prev = parts[idx - 1];
+              const separator =
+                prev.type === 'paragraph' && part.type === 'paragraph' ? '  \n' : '\n\n';
+              return separator + part.md;
+            })
+            .join('');
         }
 
         case 'paragraph': {

contentcuration/contentcuration/frontend/shared/views/TipTapEditor/__tests__/markdownSerializer.spec.js

@@ -177,14 +177,32 @@ describe('createCustomMarkdownSerializer', () => {
       expect(getMarkdown()).toBe('- Item 1\n  - Nested 1.1\n- Item 2');
     });
 
-    it('should place two newlines between block elements', () => {
+    it('should use a hard break between consecutive paragraphs so Perseus renders them as <br>', () => {
       const docContent = [
         { type: 'paragraph', content: [{ type: 'text', text: 'First paragraph.' }] },
         { type: 'paragraph', content: [{ type: 'text', text: 'Second paragraph.' }] },
       ];
       const mockEditor = createMockEditor(docContent);
       const getMarkdown = createCustomMarkdownSerializer(mockEditor);
-      expect(getMarkdown()).toBe('First paragraph.\n\nSecond paragraph.');
+      expect(getMarkdown()).toBe('First paragraph.  \nSecond paragraph.');
+    });
+
+    it('should use two newlines between a paragraph and a non-paragraph block', () => {
+      const docContent = [
+        { type: 'paragraph', content: [{ type: 'text', text: 'Intro.' }] },
+        {
+          type: 'bulletList',
+          content: [
+            {
+              type: 'listItem',
+              content: [{ type: 'paragraph', content: [{ type: 'text', text: 'Item A' }] }],
+            },
+          ],
+        },
+      ];
+      const mockEditor = createMockEditor(docContent);
+      const getMarkdown = createCustomMarkdownSerializer(mockEditor);
+      expect(getMarkdown()).toBe('Intro.\n\n- Item A');
     });
   });
 
@@ -405,7 +423,7 @@ describe('createCustomMarkdownSerializer', () => {
     const mockEditor = createMockEditor(docContent);
     const getMarkdown = createCustomMarkdownSerializer(mockEditor);
     expect(getMarkdown()).toBe(
-      '<p style="text-align: center">Centered</p>\n\nNormal\n\n<p style="text-align: right">Right</p>',
+      '<p style="text-align: center">Centered</p>  \nNormal  \n<p style="text-align: right">Right</p>',
     );
   });