fix(builder): sanitize non-string style values + allowlist element tags (XSS)
Adversarial re-review found the C1 fix incomplete plus an adjacent
same-class XSS, both reachable via the AI update_props path and
deserialized saved state:
- cssPropsToString only ran sanitizeCssValue on typeof-string values, so a
non-string style value (array/object) with a valid key skipped
sanitization entirely and was template-coerced raw into style="...",
e.g. { color: ['red', '"><img src=x onerror=alert(1)>'] }. Now every
non-number value is coerced with String() and sanitized; numbers stay
raw. sanitizeBreakoutChars also now escapes < and > (previously only ;
and ") as defense-in-depth, since values can reach it from non-string
sources.
- props.tag (Container) and props.level (Heading) were interpolated raw
into the tag position of exported HTML (`<${tag}`, `<${level}`) with no
runtime validation, letting a malicious value break out of the tag
entirely. Both are now allowlisted/clamped against their known-safe sets
(div/section/article/header/footer/main; h1-h6), falling back to
div/h2. Applied in Container's live render + toHtml, Heading's live
render + toHtml, and the typeName==='div' fallback branch in
html-export.ts's renderNode (hit for unresolved/legacy node types).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
import { describe, test, expect } from 'vitest';
|
||||
import { Heading } from './Heading';
|
||||
|
||||
const toHtml = (Heading as any).toHtml;
|
||||
|
||||
describe('Heading.toHtml level allowlist (adversarial re-review, same class as C1)', () => {
|
||||
test('a malicious level value clamps to h2 -- no injected <img>, no broken-out tag', () => {
|
||||
const { html } = toHtml({ text: 'x', level: 'h2><img src=x onerror=alert(1)' }, '');
|
||||
expect(html).not.toContain('<img');
|
||||
expect(html).not.toContain('onerror');
|
||||
expect(html.startsWith('<h2')).toBe(true);
|
||||
expect(html.endsWith('</h2>')).toBe(true);
|
||||
});
|
||||
|
||||
test('a numeric out-of-range level (99) clamps to h2', () => {
|
||||
const { html } = toHtml({ text: 'x', level: 99 as any }, '');
|
||||
expect(html.startsWith('<h2')).toBe(true);
|
||||
expect(html.endsWith('</h2>')).toBe(true);
|
||||
});
|
||||
|
||||
test('a non-heading string level clamps to h2', () => {
|
||||
const { html } = toHtml({ text: 'x', level: 'script' as any }, '');
|
||||
expect(html.startsWith('<h2')).toBe(true);
|
||||
expect(html).not.toContain('<script');
|
||||
});
|
||||
|
||||
test('a normal valid level (h4) still emits <h4', () => {
|
||||
const { html } = toHtml({ text: 'x', level: 'h4' }, '');
|
||||
expect(html).toContain('<h4');
|
||||
expect(html).toContain('</h4>');
|
||||
});
|
||||
|
||||
test('all valid levels h1-h6 still work', () => {
|
||||
for (const level of ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']) {
|
||||
const { html } = toHtml({ text: 'x', level }, '');
|
||||
expect(html.startsWith(`<${level}`)).toBe(true);
|
||||
expect(html.endsWith(`</${level}>`)).toBe(true);
|
||||
}
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user