diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 31e7e62461..ce3e1db67c 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -402,6 +402,10 @@ export default class InlineComponentWrapper extends Wrapper { if (this.node.handlers.length > 0) { const target = x`${name}`; + if (component.compile_options.dev) { + /* Hook for restoring handlers on components after HMR */ + munged_bindings.push(b`@fix_callbacks_hmr_dev(${target})`); + } for (const handler of this.node.handlers) { new EventHandler(handler, this) .render(block, target, true); diff --git a/src/runtime/internal/dev.ts b/src/runtime/internal/dev.ts index 9aff69d813..fd0090b3d2 100644 --- a/src/runtime/internal/dev.ts +++ b/src/runtime/internal/dev.ts @@ -1,7 +1,7 @@ import { custom_event, append, append_hydration, insert, insert_hydration, detach, listen, attr, prevent_default, stop_propagation, trusted, self, stop_immediate_propagation } from './dom'; import { SvelteComponent } from './Component'; import { is_void } from '../../shared/utils/names'; -import { bubble, listen_comp } from './lifecycle'; +import { bubble, listen_comp, restart_all_callback } from './lifecycle'; export function dispatch_dev(type: string, detail?: T) { document.dispatchEvent(custom_event(type, { version: '__VERSION__', ...detail }, { bubbles: true })); @@ -94,6 +94,13 @@ export function listen_comp_dev(comp: SvelteComponent, event: string, handler: E }; } +/* Hook for restarting callbacks after HMR */ +export function fix_callbacks_hmr_dev(comp: any) { + comp.$$.on_hmr && comp.$$.on_hmr.push( (_: any) => { + return (c: SvelteComponent) => restart_all_callback(c); + }); +} + export function attr_dev(node: Element, attribute: string, value?: string) { attr(node, attribute, value);