Skip to content

Potential fix for code scanning alert no. 1: DOM text reinterpreted as HTML #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
EthanThePhoenix38 merged 1 commit into from
Jan 31, 2026
Merged

Potential fix for code scanning alert no. 1: DOM text reinterpreted as HTML #10

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 36 additions & 20 deletions chatbot.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,18 +125,26 @@ class PhoenixChatbot {
setTimeout(() => {
this.removeTypingIndicator();

const messageHTML = `
<div class="chatbot-message bot">
<div class="message-avatar">
<svg viewBox="0 0 24 24">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"/>
</svg>
</div>
<div class="message-content">${text}</div>
</div>
// Create bot message element safely without interpreting text as HTML
const messageEl = document.createElement('div');
messageEl.className = 'chatbot-message bot';

const avatarEl = document.createElement('div');
avatarEl.className = 'message-avatar';
avatarEl.innerHTML = `
<svg viewBox="0 0 24 24">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2c-2.5 0-4.71-1.28-6-3.22.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08-1.29 1.94-3.5 3.22-6 3.22z"/>
</svg>
`;

messagesDiv.insertAdjacentHTML('beforeend', messageHTML);
const contentEl = document.createElement('div');
contentEl.className = 'message-content';
contentEl.textContent = text;

messageEl.appendChild(avatarEl);
messageEl.appendChild(contentEl);

messagesDiv.appendChild(messageEl);
this.scrollToBottom();
this.messages.push({ type: 'bot', text });
}, 1000);
Expand All @@ -145,18 +153,26 @@ class PhoenixChatbot {
addUserMessage(text) {
const messagesDiv = document.getElementById('chatbotMessages');

const messageHTML = `
<div class="chatbot-message user">
<div class="message-content">${text}</div>
<div class="message-avatar">
<svg viewBox="0 0 24 24">
<path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
</svg>
</div>
</div>
// Create user message element safely without interpreting text as HTML
const messageEl = document.createElement('div');
messageEl.className = 'chatbot-message user';

const contentEl = document.createElement('div');
contentEl.className = 'message-content';
contentEl.textContent = text;

const avatarEl = document.createElement('div');
avatarEl.className = 'message-avatar';
avatarEl.innerHTML = `
<svg viewBox="0 0 24 24">
<path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
</svg>
`;

messagesDiv.insertAdjacentHTML('beforeend', messageHTML);
messageEl.appendChild(contentEl);
messageEl.appendChild(avatarEl);

messagesDiv.appendChild(messageEl);
this.scrollToBottom();
this.messages.push({ type: 'user', text });
}
Expand Down
Loading