Skip to content

fix: Security removal dependency svg-prep #3236

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mtrezza merged 2 commits into from
Feb 20, 2026
+51 −57
Merged

fix: Security removal dependency svg-prep #3236

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a3a70be
fix
mtrezza Feb 20, 2026
1594b46
fix https://github.com/parse-community/parse-dashboard/pull/3236#disc…
mtrezza Feb 20, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 0 additions & 51 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 0 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,6 @@
"semantic-release": "25.0.3",
"semver": "7.7.4",
"style-loader": "3.3.1",
"svg-prep": "1.0.4",
"typescript": "5.9.3",
"webpack": "5.105.1",
"webpack-cli": "6.0.1",
Expand Down
56 changes: 51 additions & 5 deletions webpack/plugins/svg-prep.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,57 @@

const fs = require('fs');
const path = require('path');
const SvgPrep = require('svg-prep');
const { Compilation, sources } = require('webpack');
const { RawSource } = sources;

/**
* Builds an SVG sprite from individual SVG files. Each SVG becomes a
* <symbol> element identified by its filename (without extension).
*/
function buildSvgSprite(files) {
const symbols = files.map(file => {
const name = path.basename(file, '.svg');
const svg = fs.readFileSync(file, 'utf-8');

// Extract viewBox from the root <svg> element
const viewBoxMatch = svg.match(/viewBox="([^"]*)"/);
const viewBox = viewBoxMatch ? viewBoxMatch[1] : '0 0 100 100';

// Extract inner content between <svg ...> and </svg>
const innerMatch = svg.match(/<svg[^>]*>([\s\S]*)<\/svg>/);
const inner = innerMatch ? innerMatch[1] : '';

// Strip elements that are unnecessary or potential XSS vectors
// Remove attributes that interfere with sprite styling or pose security risks
const cleaned = inner
.replace(/<style[\s\S]*?<\/style>/gi, '')
.replace(/<defs[\s\S]*?<\/defs>/gi, '')
.replace(/<title[\s\S]*?<\/title>/gi, '')
.replace(/<desc[\s\S]*?<\/desc>/gi, '')
.replace(/<script[\s\S]*?<\/script>/gi, '')
.replace(/<!--[\s\S]*?-->/g, '')
.replace(/\s+id="[^"]*"/g, '')
.replace(/\s+fill="[^"]*"/g, '')
.replace(/\s+class="[^"]*"/g, '')
.replace(/\s+style="[^"]*"/g, '')
.replace(/\s+stroke="[^"]*"/g, '')
.replace(/\s+stroke-[a-z]+="[^"]*"/g, '')
.replace(/\s+on[a-zA-Z]+="[^"]*"/g, '')
.replace(/\s+on[a-zA-Z]+='[^']*'/g, '')
.replace(/\s+href="[^"]*"/g, '')
.replace(/\s+xlink:href="[^"]*"/g, '');
Comment on lines +34 to +50
Copy link

@coderabbitai coderabbitai bot Feb 20, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

<foreignObject> elements are not stripped.

All previously flagged XSS vectors (<script>, on* attributes, href/xlink:href) are now removed. However, <foreignObject> — which allows embedding arbitrary HTML content inside SVG — is still passed through. Even though descendant on* attributes would be caught by the attribute regexes, the element itself can carry HTML <iframe>, navigation anchors, and other non-script vectors that survive into sprites.svg.

🔒 Proposed addition to strip <foreignObject> 
     const cleaned = inner
       .replace(/<style[\s\S]*?<\/style>/gi, '')
       .replace(/<defs[\s\S]*?<\/defs>/gi, '')
       .replace(/<title[\s\S]*?<\/title>/gi, '')
       .replace(/<desc[\s\S]*?<\/desc>/gi, '')
       .replace(/<script[\s\S]*?<\/script>/gi, '')
+      .replace(/<foreignObject[\s\S]*?<\/foreignObject>/gi, '')
       .replace(/<!--[\s\S]*?-->/g, '')
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@webpack/plugins/svg-prep.js` around lines 34 - 50, The sanitization pipeline
building the cleaned string (variable cleaned in svg-prep.js) currently strips
scripts, event handlers, hrefs, etc., but misses <foreignObject> elements;
update the chain of .replace calls that produce cleaned to also remove any
<foreignObject>...</foreignObject> blocks (case-insensitive) by adding a regex
replacement for /<foreignObject[\s\S]*?<\/foreignObject>/gi so embedded
HTML/iframes inside SVGs are stripped before writing sprites.svg.


return ` <symbol id="${name}" viewBox="${viewBox}">\n ${cleaned.trim()}\n </symbol>`;
});

return [
'<?xml version="1.0" encoding="UTF-8" standalone="yes"?>',
'<svg id="sprites" xmlns="http://www.w3.org/2000/svg" style="display:none">',
symbols.join('\n'),
'</svg>',
].join('\n');
}

function SvgPrepPlugin(options) {
this.options = {};
Object.assign(
Expand All @@ -33,17 +80,16 @@ SvgPrepPlugin.prototype.apply = function (compiler) {
},
async () => {
if (!this.options.source) {
return Promise.resolve();
return;
}

// TODO: Keep track of file hashes, so we can avoid recompiling when none have changed
const files = fs
.readdirSync(this.options.source)
.filter(name => name.endsWith('.svg'))
.sort()
.map(name => path.join(this.options.source, name));

const sprited = await SvgPrep(files).filter({ removeIds: true, noFill: true }).output();

const sprited = buildSvgSprite(files);
compilation.emitAsset(this.options.output, new RawSource(sprited));
}
);
Expand Down
Loading