feat(tldraw): add custom SVG sanitizer for external content by MitjaBezensek · Pull Request #7896 · tldraw/tldraw

MitjaBezensek · 2026-02-12T09:13:02Z

After reverting DOMPurify-based sanitization (#7886) because it stripped <foreignObject> (needed for text) and <style> (needed for fonts), the SDK had no sanitization of pasted/dropped SVGs. This PR adds a custom allowlist-based sanitizer (~643 lines, <3KB gzip) that blocks attack vectors while preserving tldraw's own SVG output. The tag/attribute allowlists and URI sanitization approach are derived from DOMPurify (MIT license).

What it does

Root element validation: Rejects documents whose root is not <svg>.

Mode-switching sanitizer: Walks the SVG DOM tree, switching between SVG and HTML sanitization modes at <foreignObject> boundaries. This preserves tldraw's text rendering (foreignObject with HTML) while applying the correct allowlist in each context.

Context-dependent URI sanitization:

<image> / <feImage>: raster data: only (no svg+xml — could embed unsanitized SVG)
<use>: fragment refs (#id) only
<a>: http:, https:, mailto: only

CSS sanitization: Strips @import, expression(), -moz-binding, behavior:, and external url() references. Preserves data: font/image URLs and url(#id) fragment references (needed for gradients/filters). Handles multiline url() values (dotAll flag) and CSS escape decoding with bounds checks.

URL-bearing presentation attributes: Sanitizes url() values in fill, filter, clip-path, mask, stroke, marker-*, cursor — not just href/xlink:href. Case-insensitive matching. External url() references in these attributes are stripped while url(#id) internal refs are preserved.

Animation safety: <animate>, <set>, <animateColor>, <animateTransform> elements targeting href, xlink:href, or on* via attributeName are removed (prevents runtime injection of javascript: URIs that bypass static sanitization).

Event handler stripping: All on* attributes stripped after invisible whitespace normalization — catches current and future handlers without maintaining a blocklist.

Integration: Applied at all 4 SVG entry points via dynamic import (keeps sanitizer out of main bundle). maybeSanitizeSvgFile has try-catch so one bad file doesn't abort a batch. Failed SVG sanitization shows a toast in multi-file drops. SVG text paste returns silently on failure. File-replace returns silently on failure (called without await).

Change type

improvement

Test plan

Paste tldraw-generated SVG (copy as SVG) — text, fonts, foreignObject preserved
Paste malicious SVGs (script, onerror, onload, javascript: href) — all blocked
Paste SVG with animation targeting href — animation removed
Paste SVG with external url() in fill/filter/mask attributes — stripped
Drop multiple files including a malicious SVG — toast shown, other files still processed

Unit tests (76 tests covering attack vectors, preservation, and round-trip with all shape types)

API changes

Added sanitizeSvg(svgText: string): string — public export for SDK users building custom handlers

Release notes

Add SVG sanitization on paste and file drop to prevent XSS and data exfiltration

vercel · 2026-02-12T09:13:08Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
examples	Ready	Preview	Feb 12, 2026 2:01pm

5 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
analytics	Ignored	Preview	Feb 12, 2026 2:01pm
chat-template	Ignored	Preview	Feb 12, 2026 2:01pm
tldraw-docs	Ignored	Preview	Feb 12, 2026 2:01pm
tldraw-shader	Ignored	Preview	Feb 12, 2026 2:01pm
workflow-template	Ignored	Preview	Feb 12, 2026 2:01pm

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts

cursor · 2026-02-12T09:51:14Z

packages/tldraw/src/lib/defaultExternalContentHandlers.ts


+async function maybeSanitizeSvgFile(file: File): Promise<File | null> {
+	if (file.type !== 'image/svg+xml') return file
+	try {


Strict MIME check bypasses SVG sanitizer

Medium Severity

maybeSanitizeSvgFile only sanitizes when file.type is exactly image/svg+xml. SVG files with valid MIME variants (for example with parameters) bypass sanitizeSvg and are processed as trusted content when those MIME types are allowed in acceptedImageMimeTypes, creating a sanitizer bypass path.

DEFAULT_SUPPORTED_VECTOR_IMAGE_TYPES is exactly ['image/svg+xml']. notifyIfFileNotAllowed rejects files before they reach maybeSanitizeSvgFile if their type isn't in the accepted list.

packages/tldraw/src/lib/defaultExternalContentHandlers.ts

cursor · 2026-02-12T10:03:46Z

packages/tldraw/src/lib/defaultExternalContentHandlers.ts

 ) {
+	const { sanitizeSvg } = await import('./utils/svg/sanitizeSvg')
+	text = sanitizeSvg(text)
+	if (!text) return


SVG text paste can still throw

Low Severity

defaultHandleExternalSvgTextContent dynamically imports sanitizeSvg without a try/catch. If that chunk load fails, paste handling rejects before reaching the new silent-failure path, so SVG text paste can still produce an unhandled error instead of being safely ignored.

cursor

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.}

cursor · 2026-02-12T14:04:00Z

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts

+			return match
+		}
+		return ''
+	})


CSS comments bypass URL sanitization

High Severity

sanitizeCssValue matches url( and @import with regexes that do not handle CSS comments. Payloads like url/**/(...) or @import/**/url(...) survive sanitization because CSS treats comments as whitespace. This leaves external resource loads in sanitized SVG/CSS and reintroduces network exfiltration vectors.

Additional Locations (1)

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts#L402-L404

mimecuvalo

this PR does make me pretty nervous to maintain this 😬

couple things to consider before moving forward:

how do we stay up to date with DOMPurify?
can this block the main thread if it's a big SVG? should we consider a web worker?
is this possibly a delay-loaded JS module since not many regular folks would prbly paste in SVGs?

MitjaBezensek · 2026-02-18T11:19:23Z

this PR does make me pretty nervous to maintain this 😬

couple things to consider before moving forward:

how do we stay up to date with DOMPurify?

can this block the main thread if it's a big SVG? should we consider a web worker?

is this possibly a delay-loaded JS module since not many regular folks would prbly paste in SVGs?

That's why I initially went with using DOMPurify directly, but it did pull 9k minified (or something like that). And I think we decided that's too much.

We use DOMParser which doesn't seem to be available in a worker. This should be pretty fast, it's a linear scan over nodes.

We already use a dynamic import

const { sanitizeSvg } = await import('./utils/svg/sanitizeSvg')

mimecuvalo

cool, i didn't see that it was delay-loaded, nice.

LGTM 👍

Add 12 new entries from PRs merged since v4.4.0: - Featured: click-through on transparent image pixels (#7942) - API: enum-to-const-object refactor (#8084) - Improvements: SVG sanitizer (#7896), save-on-blur (#8037) - Bug fixes: cross-origin download (#8090), zero-size draw (#8067), rich text toolbar cleanup (#8050), zoom threshold (#8040), selection foreground fallback (#8011), sticky note SVG shadow (#7934), arrow frame clamping (#7932), zero pressure draw (#5693)

Update `next.mdx` release notes to cover all SDK-relevant PRs merged to main since v4.4.0. Highlights: - Display values system (#8121) with breaking changes and migration guide - Click-through on transparent image pixels (#7942) - `Editor.resizeToBounds()` (#8120) - SVG sanitization (#7896) - TypeScript enum-to-const refactoring (#8084) - 14 bug fixes and 4 improvements ### Change type - [x] `other` ### Test plan 1. Verify the release notes render correctly on the docs site ### Release notes - Update next release notes with changes since v4.4.0.  --- > [!NOTE] > **Low Risk** > Low risk: documentation-only changes updating release notes content and date, with no runtime/code behavior impact. > > **Overview** > Updates `apps/docs/content/releases/next.mdx` for the upcoming release by refreshing the date and replacing the brief blurb with expanded release notes. > > Documents new SDK surface area (`Geometry2d.ignoreHit`, `Editor.resizeToBounds`, `sanitizeSvg`), highlights click-through on transparent image pixels, and adds a list of recent improvements and bug fixes (paste parenting, link/alt-text persistence, SVG sanitization behavior, circular-dependency cleanup, and several crash/export/sync fixes). > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 5f7dc0a. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup>

In order to publish the v4.5.0 release notes and record the v4.4.1 patch, this PR archives release notes and resets `next.mdx` for the next cycle. **v4.5.0.mdx** (new file): - Archived from `next.mdx` with full frontmatter, keywords, and GitHub release link - Featured sections: click-through on transparent image pixels (#7942), breaking `EmbedShapeUtil.configure()` change (#8034) - API changes: `Editor.getResizeScaleFactor()` (#8042), `TLImageAsset.pixelRatio` (#8163), `sanitizeSvg` (#7896), `experimental__onDropOnCanvas` (#7911), enum-to-const refactoring (#8084) - 6 improvements and 20 bug fixes from production **v4.4.0.mdx:** - Add v4.4.1 patch release section with tooltip positioning fix (#8171) - Add v4.4.1 to keywords **next.mdx:** - Reset with `last_version: v4.5.0` and empty content ### Change type - [x] `other` ### Code changes | Section | LOC change | | ------------- | ------------- | | Documentation | +128 / -107 |

Once again.

5e0d23f

huppy-bot bot added the improvement Product improvement label Feb 12, 2026

Add attribution.

a856b31

cursor bot reviewed Feb 12, 2026

View reviewed changes

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts Show resolved Hide resolved

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts Show resolved Hide resolved

Feedback.

6c06780

MitjaBezensek temporarily deployed to bemo-canary February 12, 2026 09:28 — with GitHub Actions Inactive

github-actions bot deployed to bemo-preview February 12, 2026 09:31 View deployment

Add tests, more feedback.

ac86f31

vercel bot deployed to Preview – examples February 12, 2026 09:31 View deployment

MitjaBezensek force-pushed the mitja/sanitization-again branch from e11e5a2 to ac86f31 Compare February 12, 2026 09:32

cursor bot reviewed Feb 12, 2026

View reviewed changes

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts Show resolved Hide resolved

Update docs.

16987cb

vercel bot temporarily deployed to Preview – tldraw-shader February 12, 2026 09:40 Inactive

vercel bot temporarily deployed to Preview – chat-template February 12, 2026 09:40 Inactive

vercel bot temporarily deployed to Preview – workflow-template February 12, 2026 09:40 Inactive

Make sure we have an svg tag.

05825d6

cursor bot reviewed Feb 12, 2026

View reviewed changes

packages/tldraw/src/lib/utils/svg/sanitizeSvg.ts Show resolved Hide resolved

MitjaBezensek temporarily deployed to bemo-canary February 12, 2026 09:46 — with GitHub Actions Inactive

github-actions bot deployed to bemo-preview February 12, 2026 09:48 View deployment

vercel bot deployed to Preview – examples February 12, 2026 09:49 View deployment

cursor bot reviewed Feb 12, 2026

View reviewed changes

MitjaBezensek temporarily deployed to e2e-dotcom February 12, 2026 09:53 — with GitHub Actions Inactive

Feedback.

61f2a31

MitjaBezensek force-pushed the mitja/sanitization-again branch from 5dab162 to 61f2a31 Compare February 12, 2026 09:57

cursor bot reviewed Feb 12, 2026

View reviewed changes

Feedback.

7cc22fd

MitjaBezensek temporarily deployed to e2e-dotcom February 12, 2026 13:58 — with GitHub Actions Inactive

MitjaBezensek temporarily deployed to bemo-canary February 12, 2026 13:58 — with GitHub Actions Inactive

github-actions bot deployed to bemo-preview February 12, 2026 14:00 View deployment

vercel bot deployed to Preview – examples February 12, 2026 14:01 View deployment

cursor bot reviewed Feb 12, 2026

View reviewed changes

mimecuvalo reviewed Feb 18, 2026

View reviewed changes

mimecuvalo approved these changes Feb 20, 2026

View reviewed changes

MitjaBezensek added this pull request to the merge queue Feb 23, 2026

Merged via the queue into main with commit 579ba9f Feb 23, 2026
20 checks passed

MitjaBezensek deleted the mitja/sanitization-again branch February 23, 2026 08:49

This was referenced Feb 27, 2026

docs: update next.mdx release notes #8105

Closed

docs(releases): update next.mdx with changes since v4.4.0 #8149

Merged

steveruizok mentioned this pull request Mar 18, 2026

docs(releases): add v4.5.0 release notes and v4.4.1 patch notes #8263

Merged

1 task

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(tldraw): add custom SVG sanitizer for external content#7896

feat(tldraw): add custom SVG sanitizer for external content#7896
MitjaBezensek merged 8 commits intomainfrom
mitja/sanitization-again

MitjaBezensek commented Feb 12, 2026 •

edited

Loading

Uh oh!

vercel bot commented Feb 12, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cursor bot Feb 12, 2026

Uh oh!

MitjaBezensek Feb 12, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

cursor bot Feb 12, 2026

Uh oh!

cursor bot left a comment

Uh oh!

cursor bot Feb 12, 2026

Uh oh!

mimecuvalo left a comment

Uh oh!

MitjaBezensek commented Feb 18, 2026

Uh oh!

mimecuvalo left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

MitjaBezensek commented Feb 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What it does

Change type

Test plan

API changes

Release notes

Uh oh!

vercel bot commented Feb 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

cursor bot Feb 12, 2026

Choose a reason for hiding this comment

Strict MIME check bypasses SVG sanitizer

Uh oh!

MitjaBezensek Feb 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

cursor bot Feb 12, 2026

Choose a reason for hiding this comment

SVG text paste can still throw

Uh oh!

cursor bot left a comment

Choose a reason for hiding this comment

Uh oh!

cursor bot Feb 12, 2026

Choose a reason for hiding this comment

CSS comments bypass URL sanitization

Uh oh!

mimecuvalo left a comment

Choose a reason for hiding this comment

Uh oh!

MitjaBezensek commented Feb 18, 2026

Uh oh!

mimecuvalo left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

MitjaBezensek commented Feb 12, 2026 •

edited

Loading

vercel bot commented Feb 12, 2026 •

edited

Loading

MitjaBezensek Feb 12, 2026 •

edited

Loading