Skip to content

Commit db4c5e0

Browse files
committed
fix: lost reactivity in boundary snippet
1 parent 46daad3 commit db4c5e0

File tree

6 files changed

+51
-6
lines changed

6 files changed

+51
-6
lines changed

packages/svelte/src/internal/client/reactivity/effects.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,8 @@ import {
3535
INSPECT_EFFECT,
3636
HEAD_EFFECT,
3737
MAYBE_DIRTY,
38-
EFFECT_HAS_DERIVED
38+
EFFECT_HAS_DERIVED,
39+
BOUNDARY_EFFECT
3940
} from '../constants.js';
4041
import { set } from './sources.js';
4142
import * as e from '../errors.js';
@@ -142,7 +143,8 @@ function create_effect(type, fn, sync, push = true) {
142143
effect.first === null &&
143144
effect.nodes_start === null &&
144145
effect.teardown === null &&
145-
(effect.f & EFFECT_HAS_DERIVED) === 0;
146+
(effect.f & EFFECT_HAS_DERIVED) === 0 &&
147+
(effect.f & BOUNDARY_EFFECT) === 0;
146148

147149
if (!inert && !is_root && push) {
148150
if (parent_effect !== null) {

packages/svelte/tests/runtime-runes/samples/const-tag-boundary/_config.js

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,16 @@ import { flushSync } from 'svelte';
22
import { test } from '../../test';
33

44
export default test({
5-
html: '<button></button> 2',
6-
mode: ['client']
7-
// TODO fix reactivity lost in failed snippet and add a test here
5+
html: '<button></button><p>2</p>',
6+
mode: ['client'],
7+
test({ target, assert }) {
8+
const btn = target.querySelector('button');
9+
const p = target.querySelector('p');
10+
11+
flushSync(() => {
12+
btn?.click();
13+
});
14+
15+
assert.equal(p?.innerHTML, '4');
16+
}
817
});

packages/svelte/tests/runtime-runes/samples/const-tag-boundary/main.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<svelte:boundary>
99
{@const double = test * 2}
1010
{#snippet failed()}
11-
{double}
11+
<p>{double}</p>
1212
{/snippet}
1313
<FlakyComponent />
1414
</svelte:boundary>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<script>
2+
throw new Error();
3+
</script>
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { flushSync } from 'svelte';
2+
import { test } from '../../test';
3+
4+
export default test({
5+
html: '<button></button><div>0</div>',
6+
mode: ['client'],
7+
test({ assert, target }) {
8+
let btn = target.querySelector('button');
9+
let div = target.querySelector('div');
10+
11+
flushSync(() => {
12+
btn?.click();
13+
});
14+
15+
assert.equal(div?.innerHTML, `1`);
16+
}
17+
});
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<script>
2+
import Child from "./Child.svelte"
3+
4+
let count = $state(0);
5+
</script>
6+
7+
<button onclick={()=>count++}></button>
8+
<svelte:boundary>
9+
<Child />
10+
11+
{#snippet failed()}
12+
<div>{count}</div>
13+
{/snippet}
14+
</svelte:boundary>

0 commit comments

Comments
 (0)