mirror of https://github.com/sveltejs/svelte
Rich Harris
3 months ago
committed by
GitHub
commit
a6d9fcf4b8
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
fix: reapply context after transforming error during SSR
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
fix: rethrow error of failed iterable after calling `return()`
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
chore: remove unnecessary `increment_pending` calls
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
fix: abort running obsolete async branches
|
||||
@ -0,0 +1,19 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
// Tests that batch.#commit() does not null out a potentially new current_batch
|
||||
export default test({
|
||||
skip_initial_flushSync: true, // test that the initial batch is flushed without an explicit flushSync() call
|
||||
async test({ assert, target }) {
|
||||
await tick();
|
||||
|
||||
const [button] = target.querySelectorAll('button');
|
||||
const [updates] = target.querySelectorAll('p');
|
||||
|
||||
assert.htmlEqual(updates.innerHTML, 'false');
|
||||
|
||||
button.click();
|
||||
await tick();
|
||||
assert.htmlEqual(updates.innerHTML, 'true');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,30 @@
|
||||
<script>
|
||||
let count = $state(-1);
|
||||
let payload = $state(false);
|
||||
let updated = $state(false);
|
||||
|
||||
$effect(() => {
|
||||
if (payload) {
|
||||
updated = true;
|
||||
}
|
||||
});
|
||||
|
||||
function update() {
|
||||
count = 0;
|
||||
queueMicrotask(() => {
|
||||
payload = true;
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={update}>update</button>
|
||||
|
||||
<p>{updated}</p>
|
||||
|
||||
<svelte:boundary>
|
||||
{await new Promise(() => {})}
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,6 @@
|
||||
<script>
|
||||
let { count } = $props();
|
||||
let double = $derived(count * 2);
|
||||
|
||||
$effect.pre(() => console.log(count, double));
|
||||
</script>
|
||||
@ -0,0 +1,27 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs, warnings }) {
|
||||
const [increment, resolve] = target.querySelectorAll('button');
|
||||
|
||||
increment.click();
|
||||
await tick();
|
||||
assert.deepEqual(logs, []);
|
||||
|
||||
resolve.click();
|
||||
await tick();
|
||||
assert.deepEqual(logs, []);
|
||||
|
||||
resolve.click();
|
||||
await tick();
|
||||
assert.deepEqual(logs, []);
|
||||
|
||||
resolve.click();
|
||||
await tick();
|
||||
assert.deepEqual(logs, [1, 2]);
|
||||
|
||||
// no await waterfall / inert derived warnings
|
||||
assert.deepEqual(warnings, []);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,31 @@
|
||||
<script>
|
||||
import Child from "./Child.svelte";
|
||||
let count = $state(0);
|
||||
|
||||
let deferreds = [];
|
||||
|
||||
function push(v) {
|
||||
return new Promise((resolve, reject) => {
|
||||
deferreds.push({ resolve: () => resolve(v), reject });
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<button onclick={() => count += 1}>increment</button>
|
||||
<button onclick={() => deferreds.shift()?.resolve()}>resolve</button>
|
||||
|
||||
<svelte:boundary>
|
||||
{#if count % 2 === 0}
|
||||
{@const double = count * 2}
|
||||
<p>true</p>
|
||||
{await push(count)} {double}
|
||||
<Child count={await push(count)} />
|
||||
{:else}
|
||||
<p>false</p>
|
||||
<Child count={await push(count)} />
|
||||
{/if}
|
||||
|
||||
{#snippet pending()}
|
||||
<p>loading...</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,24 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
import { normalise_trace_logs } from '../../../helpers.js';
|
||||
|
||||
export default test({
|
||||
compileOptions: {
|
||||
dev: true
|
||||
},
|
||||
html: '<p>pending</p>',
|
||||
async test({ assert, target, warnings }) {
|
||||
await tick();
|
||||
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
'<h1>number -> number -> number -> return -> body failed -> ended</h1>'
|
||||
);
|
||||
|
||||
assert.deepEqual(normalise_trace_logs(warnings), [
|
||||
{
|
||||
log: 'Detected reactivity loss when reading `values[1]`. This happens when state is read in an async function after an earlier `await`'
|
||||
}
|
||||
]);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,45 @@
|
||||
<script>
|
||||
let values = $state([0, 1, 2]);
|
||||
|
||||
async function get_result() {
|
||||
const logs = [];
|
||||
|
||||
const iterator = {
|
||||
index: 0,
|
||||
async next() {
|
||||
if (this.index > 2) { done: true }
|
||||
return { done: false, value: values[this.index++] };
|
||||
},
|
||||
async return() {
|
||||
logs.push('return');
|
||||
},
|
||||
[Symbol.asyncIterator]() {
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
for await (const value of iterator) {
|
||||
logs.push('number');
|
||||
// Read reactive state after async iterator await.
|
||||
if (values.length === 3 && value === 2) {
|
||||
throw new Error('body failed');
|
||||
}
|
||||
}
|
||||
logs.push('done');
|
||||
} catch (error) {
|
||||
logs.push(error.message);
|
||||
}
|
||||
|
||||
logs.push('ended');
|
||||
return logs.join(' -> ');
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:boundary>
|
||||
<h1>{await get_result()}</h1>
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,21 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
import { normalise_trace_logs } from '../../../helpers.js';
|
||||
|
||||
export default test({
|
||||
compileOptions: {
|
||||
dev: true
|
||||
},
|
||||
html: '<p>pending</p>',
|
||||
async test({ assert, target, warnings }) {
|
||||
await tick();
|
||||
|
||||
assert.htmlEqual(target.innerHTML, '<h1>number -> number -> next failed -> ended</h1>');
|
||||
|
||||
assert.deepEqual(normalise_trace_logs(warnings), [
|
||||
{
|
||||
log: 'Detected reactivity loss when reading `values[1]`. This happens when state is read in an async function after an earlier `await`'
|
||||
}
|
||||
]);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,43 @@
|
||||
<script>
|
||||
let values = $state([0, 1, 2]);
|
||||
|
||||
async function get_result() {
|
||||
const logs = [];
|
||||
|
||||
const iterator = {
|
||||
index: 0,
|
||||
async next() {
|
||||
if (this.index > 1) throw new Error('next failed');
|
||||
return { done: false, value: values[this.index++] };
|
||||
},
|
||||
async return() {
|
||||
logs.push('return');
|
||||
},
|
||||
[Symbol.asyncIterator]() {
|
||||
return this;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
for await (const value of iterator) {
|
||||
logs.push('number');
|
||||
// Read reactive state after async iterator await.
|
||||
values.length === value;
|
||||
}
|
||||
logs.push('done');
|
||||
} catch (error) {
|
||||
logs.push(error.message);
|
||||
}
|
||||
|
||||
logs.push('ended');
|
||||
return logs.join(' -> ');
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:boundary>
|
||||
<h1>{await get_result()}</h1>
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
Loading…
Reference in new issue