Skip to content

Commit 142f600

Browse files
committed
fix: show :then block for null value
fixes #14439 This bug was introduced in #13642 because setting the input to `null` means the equality check ("is the input different") fails if you set the value to `null`
1 parent 4f0dde5 commit 142f600

File tree

4 files changed

+41
-11
lines changed

4 files changed

+41
-11
lines changed

.changeset/breezy-insects-live.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: show `:then` block for `null` value

packages/svelte/src/internal/client/dom/blocks/await.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
} from '../../runtime.js';
1515
import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
1616
import { queue_micro_task } from '../task.js';
17+
import { UNINITIALIZED } from '../../../../constants.js';
1718

1819
const PENDING = 0;
1920
const THEN = 1;
@@ -40,7 +41,7 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
4041
/** @type {any} */
4142
var component_function = DEV ? component_context?.function : null;
4243

43-
/** @type {V | Promise<V> | null} */
44+
/** @type {V | Promise<V> | typeof UNINITIALIZED} */
4445
var input;
4546

4647
/** @type {Effect | null} */
@@ -156,8 +157,8 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
156157
update(THEN, false);
157158
}
158159

159-
// Set the input to null, in order to disable the promise callbacks
160-
return () => (input = null);
160+
// Set the input to something else, in order to disable the promise callbacks
161+
return () => (input = UNINITIALIZED);
161162
});
162163

163164
if (hydrating) {
Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,28 @@
11
import { flushSync } from 'svelte';
2-
import { test } from '../../test';
2+
import { ok, test } from '../../test';
33

44
export default test({
5+
solo: true,
56
compileOptions: {
67
dev: true
78
},
8-
test() {}
9+
test({ assert, target }) {
10+
const [btn1, btn2] = target.querySelectorAll('button');
11+
const p = target.querySelector('p');
12+
ok(p);
13+
14+
assert.htmlEqual(p.outerHTML, `<p>0</p>`);
15+
16+
btn1.click();
17+
flushSync();
18+
assert.htmlEqual(p.outerHTML, `<p>1</p>`);
19+
20+
btn2.click();
21+
flushSync();
22+
assert.htmlEqual(p.outerHTML, `<p></p>`);
23+
24+
btn1.click();
25+
flushSync();
26+
assert.htmlEqual(p.outerHTML, `<p>1</p>`);
27+
}
928
});
Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
11
<script>
2-
let count = $state(43);
2+
let count = $state(0);
33
</script>
44

5-
{#await count}
6-
loading
7-
{:then count}
8-
{count}
9-
{/await}
5+
<button onclick={() => count += 1}>increment</button>
6+
<button onclick={() => count = null}>nullify</button>
7+
8+
<p>
9+
{#await count}
10+
loading
11+
{:then count}
12+
{count}
13+
{/await}
14+
</p>

0 commit comments

Comments
 (0)