fix(builder): preserve data-URI semicolons in css value sanitizer

sanitizeCssValue's blanket `;` strip ran on the whole value AFTER url(...)
content was already safely re-wrapped, corrupting legitimate
data:image/png;base64,... URLs pasted into Background Image fields
(the MIME/base64 separator `;` was deleted, breaking the data URI in
exported/published HTML). Scope the `;`/`"` breakout sanitization to the
segments outside url(...) matches only -- the url() branch is already
fully safe via escapeAttr(safeUrl(...)) and must not be re-stripped.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-12 12:15:23 -07:00
parent fb4e9f87be
commit 4c001e1af4
2 changed files with 45 additions and 10 deletions
+18
View File
@@ -35,4 +35,22 @@ describe('cssPropsToString sanitizes emitted values (A5)', () => {
expect(out).toContain('https://example.com/img.jpg');
expect(out).not.toContain('javascript:');
});
test('data-URI background image survives with its semicolon separator intact (A3)', () => {
const out = cssPropsToString({
backgroundImage: 'url(data:image/png;base64,iVBORw0KGgo=)',
} as any);
// The `;` between the MIME type and `base64` is a required part of the
// data-URI syntax -- it must not be stripped by breakout sanitization.
expect(out).toContain('data:image/png;base64,iVBORw0KGgo=');
});
test('quote/semicolon breakout is still neutralized alongside a url()', () => {
const out = cssPropsToString({
color: 'red";background:url(x)"',
} as any);
expect(out).not.toContain('"');
const withoutEntities = out.replace(/&(?:quot|amp|#39|#96|#x[0-9a-f]+|#[0-9]+);/gi, '');
expect(withoutEntities).not.toContain(';');
});
});