Repository navigation
Rearchitecture for v0.4.0 - #197
Conversation
|
New database-level support for:
Each one of these can have multiple versions, each containing:
And then they can specialize with another table, which contains additional metadata. For the |
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
... copilot suggested this I feel dirty.
| const svgContent = await file.text(); | ||
| const parser = new DOMParser(); | ||
| try { | ||
| const document = parser.parseFromString(svgContent, "image/svg+xml"); |
Check warning
Code scanning / CodeQL
DOM text reinterpreted as HTML Medium
Show autofix suggestion
Hide autofix suggestion
Copilot Autofix
AI about 1 year ago
To fix the vulnerability, the code should sanitize the SVG content before storing or rendering it. This means stripping out potential scripts, event handlers, and other risky elements from the user-provided SVG string before setting it as platform.value.icon. The best way to do this in a Vue context is to use a well-known, dedicated sanitization library such as DOMPurify, which is robust, easy to use, and widely accepted for sanitizing HTML/SVG. The fix should import DOMPurify, sanitize the extracted SVG using DOMPurify.sanitize, and then store the sanitized version. This change should be made in the region of the addSvg method where the value is assigned.
Edits:
- Add import for
DOMPurify. - Use
DOMPurify.sanitize(svg.outerHTML, { USE_PROFILES: { svg: true } })before assigning toplatform.value.icon(see DOMPurify docs for SVG handling).
No other functionality should be changed.
| @@ -1,4 +1,6 @@ | ||
| <!-- eslint-disable vue/no-v-html --> | ||
| <script setup> | ||
| import DOMPurify from 'dompurify'; | ||
| <template> | ||
| <div class="flex flex-row gap-x-4"> | ||
| <label | ||
| @@ -289,7 +291,7 @@ | ||
| if (!svg) throw "No SVG in uploaded image."; | ||
| svg.removeAttribute("width"); | ||
| svg.removeAttribute("height"); | ||
| platform.value.icon = svg.outerHTML; | ||
| platform.value.icon = DOMPurify.sanitize(svg.outerHTML, { USE_PROFILES: { svg: true } }); | ||
| } catch (e) { | ||
| createModal( | ||
| ModalType.Notification, |
| @@ -58,7 +58,8 @@ | ||
| "vue-router": "latest", | ||
| "vue3-carousel": "^0.16.0", | ||
| "vue3-carousel-nuxt": "^1.1.5", | ||
| "vuedraggable": "^4.1.0" | ||
| "vuedraggable": "^4.1.0", | ||
| "dompurify": "^3.3.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@intlify/eslint-plugin-vue-i18n": "^4.0.1", |
| Package | Version | Security advisories |
| dompurify (npm) | 3.3.0 | None |
|
TODO list for this PR:
Features:
|
No description provided.