Skip to content

feat: added SVG file preview to the editor file view#1492

Open
MarkQuach12 wants to merge 6 commits into
overleaf:mainfrom
MarkQuach12:svg-file-preview
Open

feat: added SVG file preview to the editor file view#1492
MarkQuach12 wants to merge 6 commits into
overleaf:mainfrom
MarkQuach12:svg-file-preview

Conversation

@MarkQuach12

@MarkQuach12 MarkQuach12 commented Jul 3, 2026

Copy link
Copy Markdown

Description

Adds a preview for SVG files in the editor file view. Previously, selecting an .svg file in the file tree showed "No preview available"; it now renders the image, matching the behaviour of PNG/JPG/GIF files.

The blob endpoint serves every file as application/octet-stream, and browsers deliberately refuse to content-sniff SVG (an anti-XSS measure), so a direct <img src> to the blob renders blank. Instead, a new FileViewSvg component fetches the blob and re-wraps the bytes as an image/svg+xml object URL, which renders reliably with no backend change. Rendering through an <img> also means any scripts embedded in the SVG never execute, so no new XSS surface is introduced.

Related issues / Pull Requests

Related to #1458

Contributor Agreement

(Feedback appreciated, my first open source pr :))

@MarkQuach12 MarkQuach12 changed the title [web] add SVG file preview to the editor file view feat: added SVG file preview to the editor file view Jul 3, 2026
@mserranom

Copy link
Copy Markdown
Contributor

Hey @MarkQuach12 thanks for your contribution. We tried the same solution, but we reverted (hopefully only temporary) due to security concerns. You can see the revert commit in ad651a2.

An extra sanitisation layer (like dompurify) would help, but there are still a few things we need to consider before allowing user's SVG to be rendered.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants