Skip to content

Hydration mismatches can cause duplicate event listeners #12360

@Rich-Harris

Description

@Rich-Harris

Describe the bug

If a hydration mismatch occurs, Svelte will yoink the outdated HTML out of the DOM and mount everything from scratch. It doesn't destroy existing event handlers etc. Most of the time this is unnoticeable (if potentially wasteful?) but if you have event listeners on <svelte:window> or <svelte:document> then they will be duplicated.

Reproduction

Hydrate this:

<svelte:window onclick={() => console.log('clicked')} />
<p>{@html '<p>invalid</p>'}</p>

Logs

No response

System Info

next

Severity

annoyance

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions