Skip to content

Commit 1ac643f

Browse files
committed
fix: prevent component pre-mounting in async boundaries
1 parent 7b2d774 commit 1ac643f

File tree

1 file changed

+15
-23
lines changed

1 file changed

+15
-23
lines changed

packages/svelte/src/internal/client/dom/blocks/svelte-component.js

Lines changed: 15 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { EFFECT_TRANSPARENT } from '#client/constants';
44
import { block, branch, pause_effect } from '../../reactivity/effects.js';
55
import { current_batch } from '../../reactivity/batch.js';
66
import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
7-
import { create_text, should_defer_append } from '../operations.js';
7+
import { should_defer_append } from '../operations.js';
88

99
/**
1010
* @template P
@@ -27,19 +27,13 @@ export function component(node, get_component, render_fn) {
2727
/** @type {Effect | null} */
2828
var effect;
2929

30-
/** @type {DocumentFragment | null} */
31-
var offscreen_fragment = null;
32-
3330
/** @type {Effect | null} */
3431
var pending_effect = null;
3532

3633
function commit() {
37-
if (offscreen_fragment) {
38-
// remove the anchor
39-
/** @type {Text} */ (offscreen_fragment.lastChild).remove();
40-
41-
anchor.before(offscreen_fragment);
42-
offscreen_fragment = null;
34+
if (effect) {
35+
pause_effect(effect);
36+
effect = null;
4337
}
4438

4539
effect = pending_effect;
@@ -51,25 +45,23 @@ export function component(node, get_component, render_fn) {
5145

5246
var defer = should_defer_append();
5347

54-
if (effect) {
55-
pause_effect(effect);
56-
effect = null;
57-
}
58-
5948
if (component) {
60-
var target = anchor;
61-
6249
if (defer) {
63-
offscreen_fragment = document.createDocumentFragment();
64-
offscreen_fragment.append((target = create_text()));
6550
if (effect) {
6651
/** @type {Batch} */ (current_batch).skipped_effects.add(effect);
6752
}
53+
/** @type {Batch} */ (current_batch).add_callback(() => {
54+
if (effect) {
55+
pause_effect(effect);
56+
effect = null;
57+
}
58+
effect = branch(() => render_fn(anchor, component));
59+
});
60+
} else {
61+
pending_effect = branch(() => render_fn(anchor, component));
62+
commit();
6863
}
69-
pending_effect = branch(() => render_fn(target, component));
70-
}
71-
72-
if (defer) {
64+
} else if (defer) {
7365
/** @type {Batch} */ (current_batch).add_callback(commit);
7466
} else {
7567
commit();

0 commit comments

Comments
 (0)