fix: stale ctx for await block in slot

fix-stale-await-ctx
gtmnayan 2 years ago
parent abf257306b
commit 61f6bead32

@ -0,0 +1,24 @@
// Fetch a REPL from svelte.dev and write the files to the src/ directory
// Usage: node fetch-repl.js <id> or node fetch-repl.js <url>
import { writeFileSync } from 'fs';
const id = process.argv[2];
if (!id) {
throw new Error('Missing id');
}
let json_url = `https://svelte.dev/repl/api/${id}.json`;
try {
const tmp = new URL(id);
tmp.pathname = tmp.pathname.replace(/\/repl/, '/repl/api');
tmp.pathname += '.json';
json_url = tmp.href;
} catch {}
const repl_data = await fetch(json_url).then((r) => r.json());
for (const component of repl_data.components) {
writeFileSync(`src/${component.name}.${component.type}`, component.source);
}

@ -2,7 +2,7 @@ import App from './App.svelte';
new App({ new App({
target: document.getElementById('app'), target: document.getElementById('app'),
hydrate: true hydrate: globalThis.__playground_hydrate,
}); });
function get_version() { function get_version() {

@ -8,6 +8,7 @@
</head> </head>
<body> <body>
<div id="app"><!--app-html--></div> <div id="app"><!--app-html--></div>
<script>globalThis.__playground_hydrate = __HYDRATE__</script>
<script type="module" src="/entry-client.js"></script> <script type="module" src="/entry-client.js"></script>
</body> </body>
</html> </html>

@ -6,6 +6,7 @@ import serve from 'rollup-plugin-serve';
import * as svelte from '../svelte/src/compiler/index.js'; import * as svelte from '../svelte/src/compiler/index.js';
const __dirname = fileURLToPath(new URL('.', import.meta.url)); const __dirname = fileURLToPath(new URL('.', import.meta.url));
const no_ssr = process.argv.includes('--no-ssr');
/** @returns {import('rollup').Plugin}*/ /** @returns {import('rollup').Plugin}*/
function create_plugin(ssr = false) { function create_plugin(ssr = false) {
@ -34,7 +35,7 @@ function create_plugin(ssr = false) {
const compiled = svelte.compile(code, { const compiled = svelte.compile(code, {
filename: id, filename: id,
generate: ssr ? 'ssr' : 'dom', generate: ssr ? 'ssr' : 'dom',
hydratable: true, hydratable: !no_ssr,
css: 'injected' css: 'injected'
}); });
@ -54,9 +55,24 @@ const watcher = watch([
format: 'esm', format: 'esm',
sourcemap: true sourcemap: true
}, },
plugins: [client_plugin, serve('dist')] plugins: [
client_plugin,
{
async generateBundle(_, bundle) {
writeFileSync(
'dist/index.html',
readFileSync('src/template.html', 'utf-8')
.replace('__HYDRATE__', !no_ssr)
.replace('<!--app-title-->', svelte.VERSION)
.replace('<!--app-html-->', '')
);
writeFileSync('dist/version.json', Date.now().toString());
}
},
serve('dist')
]
}, },
{ !no_ssr && {
input: 'src/entry-server.js', input: 'src/entry-server.js',
output: { output: {
dir: 'dist-ssr', dir: 'dist-ssr',
@ -74,8 +90,9 @@ const watcher = watch([
writeFileSync( writeFileSync(
'dist/index.html', 'dist/index.html',
readFileSync('src/template.html', 'utf-8') readFileSync('src/template.html', 'utf-8')
.replace('<!--app-html-->', html) .replace('__HYDRATE__', !no_ssr)
.replace('<!--app-title-->', svelte.VERSION) .replace('<!--app-title-->', svelte.VERSION)
.replace('<!--app-html-->', html)
); );
writeFileSync('dist/version.json', Date.now().toString()); writeFileSync('dist/version.json', Date.now().toString());
} }

@ -260,13 +260,12 @@ export default class AwaitBlockWrapper extends Wrapper {
block.chunks.intro.push(b`@transition_in(${info}.block);`); block.chunks.intro.push(b`@transition_in(${info}.block);`);
} }
const dependencies = this.node.expression.dynamic_dependencies(); const dependencies = this.node.expression.dynamic_dependencies();
const update_await_block_branch = b`@update_await_block_branch(${info}, #ctx, #dirty)`; const update_await_block_branch = b`@update_await_block_branch(${info}, ${info}.ctx = #ctx, #dirty)`;
if (dependencies.length > 0) { if (dependencies.length > 0) {
const condition = x` const condition = x`
${block.renderer.dirty(dependencies)} && ${block.renderer.dirty(dependencies)} &&
${promise} !== (${promise} = ${snippet}) && ${promise} !== (${promise} = ${snippet}) &&
@handle_promise(${promise}, ${info})`; @handle_promise(${promise}, ${info})`;
block.chunks.update.push(b`${info}.ctx = #ctx;`);
if (this.pending.block.has_update_method) { if (this.pending.block.has_update_method) {
block.chunks.update.push(b` block.chunks.update.push(b`
if (${condition}) { if (${condition}) {
@ -281,10 +280,9 @@ export default class AwaitBlockWrapper extends Wrapper {
`); `);
} }
} else { } else {
// TODO: Why is this specific to pending?
if (this.pending.block.has_update_method) { if (this.pending.block.has_update_method) {
block.chunks.update.push(b` block.chunks.update.push(update_await_block_branch);
${update_await_block_branch}
`);
} }
} }
if (this.pending.block.has_outro_method) { if (this.pending.block.has_outro_method) {

Loading…
Cancel
Save