Svelte, a UI framework known for its "magical disappearing" act— compiling away into highly optimized vanilla JavaScript at build time —released version 1.22.0 following closely on the heels of version 1.21.0. While both versions share the same core philosophy and many of the same development dependencies, a closer look reveals subtle yet important updates that could impact developers.
Both versions depend on a suite of tools for development and testing, including rollup for bundling, babel for JavaScript transpilation, eslint for code linting, and mocha for testing. The core set of babel plugins for ES2015 transforms remains consistent, ensuring browser compatibility through features like spread operators and arrow functions.
One key difference can be spotted in the magic-string dependency, which is used for manipulating strings of code. Version 1.22.0 updates this dependency to version 0.21.1 from version 0.19.0 in version 1.21.0, potentially bringing performance improvements or bug fixes in string manipulation operations within the Svelte compiler.
Svelte's approach of shifting work to compile time enables developers to write declarative code that feels familiar, while the framework handles the complexities of creating efficient, reactive updates in the browser. The minimal runtime footprint results in faster load times and improved performance, making Svelte a compelling choice for building web applications where speed and efficiency are paramount. The updates in v1.22.0 continue to refine this process, improving the development experience for creating performant and maintainable web applications.
All the vulnerabilities related to the version 1.22.0 of the package
Svelte vulnerable to XSS when using objects during server-side rendering
The package svelte before 3.49.0 is vulnerable to Cross-site Scripting (XSS) due to improper input sanitization and to improper escape of attributes when using objects during SSR (Server-Side Rendering). Exploiting this vulnerability is possible via objects with a custom toString() function.
Svelte has a potential mXSS vulnerability due to improper HTML escaping
A potential XSS vulnerability exists in Svelte for versions prior to 4.2.19.
Svelte improperly escapes HTML on server-side rendering. It converts strings according to the following rules:
"
-> "
&
-> &
<
-> <
&
-> &
The assumption is that attributes will always stay as such, but in some situation the final DOM tree rendered on browsers is different from what Svelte expects on server-side rendering. This may be leveraged to perform XSS attacks. More specifically, this can occur when injecting malicious content into an attribute within a <noscript>
tag.
A vulnerable page (+page.svelte
):
<script>
import { page } from "$app/stores"
// user input
let href = $page.url.searchParams.get("href") ?? "https://example.com";
</script>
<noscript>
<a href={href}>test</a>
</noscript>
If a user accesses the following URL,
http://localhost:4173/?href=</noscript><script>alert(123)</script>
then, alert(123)
will be executed.
XSS, when using an attribute within a noscript tag