From dd7463259ad1f6384807616fe967e373003f3d69 Mon Sep 17 00:00:00 2001
From: Dan Brown <ssddanbrown@googlemail.com>
Date: Wed, 23 Mar 2022 15:11:14 +0000
Subject: [PATCH] Added wysiwyg filter to handle <br> tags within code blocks

This filters out <br> elements within code blocks and replaces them with
newlines. The editor started using <br>'s more harshley after some
configuration changes upon upgrading tinymce, in which we standardised
on forced br tags to avoid empty elements.

For #3327
---
 resources/js/wysiwyg/config.js | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/resources/js/wysiwyg/config.js b/resources/js/wysiwyg/config.js
index e75e4f712..c32a5ffc1 100644
--- a/resources/js/wysiwyg/config.js
+++ b/resources/js/wysiwyg/config.js
@@ -114,6 +114,23 @@ function fetchCustomHeadContent() {
     return headContentLines.slice(startLineIndex + 1, endLineIndex).join('\n');
 }
 
+/**
+ * Setup a serializer filter for <br> tags to ensure they're not rendered
+ * within code blocks and that we use newlines there instead.
+ * @param {Editor} editor
+ */
+function setupBrFilter(editor) {
+    editor.serializer.addNodeFilter('br', function(nodes) {
+        for (const node of nodes) {
+            if (node.parent && node.parent.name === 'code') {
+                const newline = new tinymce.html.Node.create('#text');
+                newline.value = '\n';
+                node.replace(newline);
+            }
+        }
+    });
+}
+
 /**
  * @param {WysiwygConfigOptions} options
  * @return {function(Editor)}
@@ -131,6 +148,10 @@ function getSetupCallback(options) {
             window.editor = editor;
         });
 
+        editor.on('PreInit', () => {
+            setupBrFilter(editor);
+        });
+
         function editorChange() {
             const content = editor.getContent();
             if (options.darkMode) {