From 8aa56aedfd5cb5a2caa4dd070fb6a233e960dbec Mon Sep 17 00:00:00 2001 From: Claire Date: Mon, 14 Nov 2022 22:14:55 +0100 Subject: [PATCH] [Glitch] Fix nodes order being sometimes mangled when rewriting emoji Port ccbca50a2502108884f7f3c9ea24df8b2129731d to glitch-soc Signed-off-by: Claire --- .../flavours/glitch/features/emoji/emoji.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/app/javascript/flavours/glitch/features/emoji/emoji.js b/app/javascript/flavours/glitch/features/emoji/emoji.js index 6138164e0..880f9401d 100644 --- a/app/javascript/flavours/glitch/features/emoji/emoji.js +++ b/app/javascript/flavours/glitch/features/emoji/emoji.js @@ -19,10 +19,13 @@ const emojiFilename = (filename) => { return borderedEmoji.includes(filename) ? (filename + '_border') : filename; }; +const domParser = new DOMParser(); + const emojifyTextNode = (node, customEmojis) => { - const parentElement = node.parentElement; let str = node.textContent; + const fragment = new DocumentFragment(); + for (;;) { let match, i = 0; @@ -64,12 +67,16 @@ const emojifyTextNode = (node, customEmojis) => { } } + fragment.append(document.createTextNode(str.slice(0, i))); + if (replacement) { + fragment.append(domParser.parseFromString(replacement, 'text/html').documentElement.getElementsByTagName('img')[0]); + } node.textContent = str.slice(0, i); - parentElement.insertAdjacentHTML('beforeend', replacement); str = str.slice(rend); - node = document.createTextNode(str); - parentElement.append(node); } + + fragment.append(document.createTextNode(str)); + node.parentElement.replaceChild(fragment, node); }; const emojifyNode = (node, customEmojis) => {