tsParticles - Easily create highly customizable JavaScript particles effects, confetti explosions and fireworks animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components.
When tsparticles is loaded on a page via the CDN script, the browser's native Range class gets replaced with a class from this library, which has a different API. This can break code on the page which attempts to use the native Range object. The issue can be observed on https://particles.js.org. Evaluating window.Range in the console returns a reference to a value from this library instead of the native DOM Range.
Ideally classes from this library would only be exposed by the CDN bundle under a namespace, so they don't accidentally overwrite browser globals.
Contact Details
robertknight@hypothes.is
What happened?
When tsparticles is loaded on a page via the CDN script, the browser's native
Rangeclass gets replaced with a class from this library, which has a different API. This can break code on the page which attempts to use the nativeRangeobject. The issue can be observed on https://particles.js.org. Evaluatingwindow.Rangein the console returns a reference to a value from this library instead of the native DOMRange.Ideally classes from this library would only be exposed by the CDN bundle under a namespace, so they don't accidentally overwrite browser globals.
The issue was originally observed in the context of https://github.com/hypothesis/client/issues/6210.
tsParticles Version
3.0.3
tsParticles Configuration
What browsers are you seeing the problem on?
Chrome
Relevant log output
No response
Code of Conduct