Desktop: Fixes #6822: Fix extra lines added to KaTeX source when toggling the rich text editor (#8442)

packages/app-cli/tests/MdToHtml.ts

@@ -252,4 +252,41 @@ describe('MdToHtml', () => {
 			);
 		}
 	}));
+
+	it('should attach source blocks to block KaTeX', async () => {
+		const mdToHtml = newTestMdToHtml();
+
+		const katex = [
+			'3 + 3',
+			'\n\\int_0^1 x dx\n\n',
+			'\n\\int_0^1 x dx\n3 + 3\n',
+			'\n\t2^{3^4}\n\t3 + 3\n',
+			'3\n4',
+		];
+		const surroundingTextChoices = [
+			['', ''],
+			['Test', ''],
+			['Test', 'Test!'],
+			['Test\n\n', '\n\nTest!'],
+		];
+
+		const tests = [];
+		for (const texSource of katex) {
+			for (const [start, end] of surroundingTextChoices) {
+				tests.push([texSource, `${start}\n$$${texSource}$$\n${end}`]);
+			}
+		}
+
+		for (const [tex, input] of tests) {
+			const html = await mdToHtml.render(input, null, { bodyOnly: true });
+
+			const opening = '<pre class="joplin-source" data-joplin-language="katex" data-joplin-source-open="$$&#10;" data-joplin-source-close="&#10;$$&#10;">';
+			const closing = '</pre>';
+
+			// Remove any single leading and trailing newlines, those are included in data-joplin-source-open
+			// and data-joplin-source-close.
+			const trimmedTex = tex.replace(/^[\n]/, '').replace(/[\n]$/, '');
+			expect(html.html).toContain(opening + trimmedTex + closing);
+		}
+	});
 });

packages/renderer/MdToHtml/rules/katex.ts

@@ -246,9 +246,24 @@ function math_block(state: any, start: number, end: number, silent: boolean) {
 
 	state.line = next + 1;
 
+	const contentLines = [];
+	if (firstLine && firstLine.trim()) {
+		contentLines.push(firstLine);
+	}
+
+	const includeTrailingNewline = false;
+	const interiorLines = state.getLines(start + 1, next, state.tShift[start], includeTrailingNewline);
+	if (interiorLines.length > 0) {
+		contentLines.push(interiorLines);
+	}
+
+	if (lastLine && lastLine.trim()) {
+		contentLines.push(lastLine);
+	}
+
 	const token = state.push('math_block', 'math', 0);
 	token.block = true;
-	token.content = (firstLine && firstLine.trim() ? `${firstLine}\n` : '') + state.getLines(start + 1, next, state.tShift[start], true) + (lastLine && lastLine.trim() ? lastLine : '');
+	token.content = contentLines.join('\n');
 	token.map = [start, state.line];
 	token.markup = '$$';
 	return true;
@@ -312,6 +327,7 @@ export default {
 			} catch (error) {
 				outputHtml = renderKatexError(latex, error);
 			}
+
 			return `<div class="joplin-editable"><pre class="joplin-source" data-joplin-language="katex" data-joplin-source-open="$$&#10;" data-joplin-source-close="&#10;$$&#10;">${markdownIt.utils.escapeHtml(latex)}</pre>${outputHtml}</div>`;
 		};