Enhancement: Add XSS escaping utility and audit all innerHTML usage in frontend JS

[techmore]

Type

security

Severity

medium

Area

static/js/discovery_ui.js, static/js/reports_tab.js, static/js/settings_tab.js, static/js/customer_ui.js

Description

Multiple frontend JavaScript files use innerHTML to insert server-provided data (scan results, CVE data, report metadata) into the DOM. While the most critical scan-result rendering paths in discovery_ui.js already use safe textContent and createElement patterns, there are still several innerHTML usages that insert server data:

discovery_ui.js:

• Line 189: versionCell.innerHTML = versionHtml — service version/banner strings from nmap (attacker-controlled in adversarial scan targets)
• Line 192-194: cvesCell.innerHTML = host.cves.map(...) — CVE IDs and URLs interpolated into HTML template strings

reports_tab.js:

• Line 259, 365, 413, 439: Report metadata (customer names, targets, diff summaries) interpolated via template literals into innerHTML

settings_tab.js:

• Line 130, 240: Settings values inserted via innerHTML

While nmap itself sanitizes some output, service banners and hostnames are attacker-controlled content in adversarial environments. A malicious device on the scanned network could return a hostname or service banner containing <script> tags.

Proposed Fix

1. Create a shared escapeHtml() utility in a new static/js/utils.js:

function escapeHtml(str) {
    const div = document.createElement("div");
    div.textContent = str;
    return div.innerHTML;
}

2. Wrap all server-provided values in escapeHtml() before interpolation in innerHTML template literals
3. Where possible, replace innerHTML with textContent + createElement (the pattern already used in discovery_ui.js for most cells)

Related Issues

#164 (Security hardening initiative)
#201 (CSP headers)