not using innerhtml in flushAccumulatingMessage

This commit is contained in:
mic 2024-07-21 22:12:18 +02:00
parent 57d5e54ff0
commit 3e96681d03

View file

@ -131,6 +131,12 @@ class MessagesArea extends HTMLElement {
this.messages.scrollTop = this.messages.scrollHeight; this.messages.scrollTop = this.messages.scrollHeight;
} }
addActionButtons() {
const actionButtons = document.createElement('div');
actionButtons.classList.add('action-buttons');
this.messages.appendChild(actionButtons);
}
flushAccumulatingMessage() { flushAccumulatingMessage() {
if (this.accumulatingMessageEl) { if (this.accumulatingMessageEl) {
// Collect all tokens in a full text // Collect all tokens in a full text
@ -138,20 +144,29 @@ class MessagesArea extends HTMLElement {
this.accumulatingMessageEl.querySelectorAll('.token').forEach(tokenEl => { this.accumulatingMessageEl.querySelectorAll('.token').forEach(tokenEl => {
fullText += tokenEl.textContent; fullText += tokenEl.textContent;
}); });
// Convert Markdown to DOM nodes using the markdown-it library // Convert Markdown to DOM nodes using the markdown-it library
const md = window.markdownit(); const md = window.markdownit();
const html = md.render(fullText); const html = md.render(fullText);
const tempDiv = document.createElement('div');
tempDiv.innerHTML = html; // Create a new DOM parser
this.accumulatingMessageEl.innerHTML = ''; // Remove existing tokens const parser = new DOMParser();
Array.from(tempDiv.childNodes).forEach(node => { const doc = parser.parseFromString(html, 'text/html');
// Remove existing tokens
while (this.accumulatingMessageEl.firstChild) {
this.accumulatingMessageEl.removeChild(this.accumulatingMessageEl.firstChild);
}
// Append new nodes
Array.from(doc.body.childNodes).forEach(node => {
this.accumulatingMessageEl.appendChild(node); this.accumulatingMessageEl.appendChild(node);
}); });
this.accumulatingMessageEl = null; this.accumulatingMessageEl = null;
} }
} }
appendBotMessage(messageText) { appendBotMessage(messageText) {
console.log("appendBotMessage: " + messageText); console.log("appendBotMessage: " + messageText);