Skip to content

Commit c785178

Browse files
authored
fix: always mark props as stateful (#16504)
1 parent d0ebd42 commit c785178

File tree

7 files changed

+56
-1
lines changed

7 files changed

+56
-1
lines changed

.changeset/gorgeous-jeans-begin.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
fix: always mark props as stateful

packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,10 @@ export function Identifier(node, context) {
9393
context.state.expression.references.add(binding);
9494
context.state.expression.has_state ||=
9595
binding.kind !== 'static' &&
96-
!binding.is_function() &&
96+
(binding.kind === 'prop' ||
97+
binding.kind === 'bindable_prop' ||
98+
binding.kind === 'rest_prop' ||
99+
!binding.is_function()) &&
97100
!context.state.scope.evaluate(node).is_known;
98101
}
99102

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { flushSync } from 'svelte';
2+
import { test } from '../../test';
3+
4+
export default test({
5+
mode: ['client'],
6+
7+
test({ assert, target }) {
8+
const btn = target.querySelector('button');
9+
10+
assert.htmlEqual(target.innerHTML, `<button>inc</button> Inner: 0 Inner: 0`);
11+
btn?.click();
12+
flushSync();
13+
assert.htmlEqual(target.innerHTML, `<button>inc</button> Inner: 1 Inner: 1`);
14+
}
15+
});
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<script>
2+
let { getter } = $props()
3+
</script>
4+
Inner: {getter()}
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<script>
2+
import Wrapper1 from "./wrapper.svelte"
3+
import Wrapper2 from "./wrapper2.svelte"
4+
let count = $state(0);
5+
6+
let getter = $derived.by(() => {
7+
const copy = count;
8+
return () => copy;
9+
});
10+
</script>
11+
12+
<button onclick={() => count++}>inc</button>
13+
<Wrapper1 {getter}/>
14+
<Wrapper2 {getter}/>
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<script >
2+
import Inner from "./inner.svelte";
3+
4+
const { getter = () => -1} = $props();
5+
</script>
6+
7+
<Inner {getter} />
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<script >
2+
import Inner from "./inner.svelte";
3+
4+
const { getter = $bindable(() => -1)} = $props();
5+
</script>
6+
7+
<Inner {getter} />

0 commit comments

Comments
 (0)