security: escape dynamic content in innerHTML to prevent XSS

This commit addresses several XSS vulnerabilities by ensuring that
dynamic data from external APIs (GitHub) and error messages are
properly escaped before being rendered via innerHTML.

Affected areas:
- openVersionMenu error handling and version list
- showErrorModal title and button text
- showToast message content

All changes were verified with a reproduction test case.

Co-authored-by: TauNeutrino <1600410+TauNeutrino@users.noreply.github.com>
This commit is contained in:
google-labs-jules[bot]
2026-03-10 12:37:54 +00:00
parent adc018d4d3
commit a2b2ec227f
3 changed files with 144 additions and 7 deletions

View File

@@ -0,0 +1,137 @@
const fs = require('fs');
const vm = require('vm');
const path = require('path');
console.log("=== Running Vulnerability Reproduction Tests ===");
// Mock DOM
const createMockElement = (id = 'mock') => {
const el = {
id,
classList: { add: () => { }, remove: () => { }, contains: () => false },
_innerHTML: '',
get innerHTML() { return this._innerHTML; },
set innerHTML(val) {
this._innerHTML = val;
// Check for XSS
if (val.includes('<img src=x onerror=alert(1)>')) {
console.error(`❌ VULNERABILITY DETECTED in ${id}: XSS payload found in innerHTML!`);
console.error(`Payload: ${val}`);
process.exit(1);
}
},
_textContent: '',
get textContent() { return this._textContent; },
set textContent(val) { this._textContent = val; },
value: '',
style: { cssText: '', display: '' },
addEventListener: () => { },
removeEventListener: () => { },
appendChild: (child) => { },
removeChild: () => { },
querySelector: (sel) => createMockElement(sel),
querySelectorAll: () => [createMockElement()],
getAttribute: () => '',
setAttribute: () => { },
remove: () => { },
dataset: {}
};
return el;
};
const sandbox = {
console: console,
document: {
body: createMockElement('body'),
createElement: (tag) => createMockElement(tag),
getElementById: (id) => createMockElement(id),
querySelector: (sel) => createMockElement(sel),
},
localStorage: {
getItem: () => null,
setItem: () => { },
removeItem: () => { }
},
fetch: () => Promise.reject(new Error('<img src=x onerror=alert(1)>')),
setTimeout: (cb) => cb(),
setInterval: () => { },
requestAnimationFrame: (cb) => cb(),
Date: Date,
Notification: { permission: 'denied', requestPermission: () => { } },
window: { location: { href: '' } },
crypto: { randomUUID: () => '1234' }
};
// Load utils.js (for escapeHtml if needed)
const utilsCode = fs.readFileSync(path.join(__dirname, '../src/utils.js'), 'utf8')
.replace(/export /g, '')
.replace(/import .*? from .*?;/g, '');
// Load constants.js
const constantsCode = fs.readFileSync(path.join(__dirname, '../src/constants.js'), 'utf8')
.replace(/export /g, '');
// Load ui_helpers.js
const uiHelpersCode = fs.readFileSync(path.join(__dirname, '../src/ui_helpers.js'), 'utf8')
.replace(/export /g, '')
.replace(/import .*? from .*?;/g, '');
// Load actions.js
const actionsCode = fs.readFileSync(path.join(__dirname, '../src/actions.js'), 'utf8')
.replace(/export /g, '')
.replace(/import .*? from .*?;/g, '');
vm.createContext(sandbox);
vm.runInContext(utilsCode, sandbox);
vm.runInContext(constantsCode, sandbox);
// Mock state
vm.runInContext(`
var authToken = 'mock-token';
var currentUser = 'mock-user';
var orderMap = new Map();
var userFlags = new Set();
var highlightTags = [];
var allWeeks = [];
var currentWeekNumber = 1;
var currentYear = 2024;
var displayMode = 'this-week';
var langMode = 'de';
`, sandbox);
vm.runInContext(uiHelpersCode, sandbox);
vm.runInContext(actionsCode, sandbox);
async function runTests() {
console.log("Testing openVersionMenu error handling...");
try {
await sandbox.openVersionMenu();
} catch (e) {}
console.log("Testing showToast...");
sandbox.showToast('<img src=x onerror=alert(1)>');
console.log("Testing showErrorModal...");
sandbox.showErrorModal('<img src=x onerror=alert(1)>', 'safe content', '<img src=x onerror=alert(1)>', 'http://example.com');
console.log("Testing openVersionMenu version list rendering...");
// Mock successful fetch but with malicious data
sandbox.fetch = () => Promise.resolve({
ok: true,
json: () => Promise.resolve([
{
tag: '<img src=x onerror=alert(1)>',
name: 'malicious',
url: 'javascript:alert(1)',
body: 'malicious body'
}
])
});
await sandbox.openVersionMenu();
console.log("All tests finished (if you see this, no vulnerability was detected by the check).");
}
runTests().catch(err => {
console.error("Test execution failed:", err);
process.exit(1);
});