diff --git a/CHANGELOG.md b/CHANGELOG.md index dbad13d01f..ca47ad51b7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,7 @@ * Support dimension bindings in cross-origin environments ([#2147](https://github.com/sveltejs/svelte/issues/2147)) * Try using `globalThis` rather than `globals` for the benefit of non-Node servers and web workers ([#3561](https://github.com/sveltejs/svelte/issues/3561), [#4545](https://github.com/sveltejs/svelte/issues/4545)) +* Support `{#await ... catch ...}` syntax shorthand ([#3623](https://github.com/sveltejs/svelte/issues/3623)) * Fix attaching of JS debugging comments to HTML comments ([#4565](https://github.com/sveltejs/svelte/issues/4565)) ## 3.20.1 diff --git a/src/compiler/parse/state/mustache.ts b/src/compiler/parse/state/mustache.ts index 28ef853f8e..0f6608f679 100644 --- a/src/compiler/parse/state/mustache.ts +++ b/src/compiler/parse/state/mustache.ts @@ -309,6 +309,13 @@ export default function mustache(parser: Parser) { parser.allow_whitespace(); } + const await_block_catch_shorthand = !await_block_shorthand && type === 'AwaitBlock' && parser.eat('catch'); + if (await_block_catch_shorthand) { + parser.require_whitespace(); + block.error = parser.read_destructure_pattern(); + parser.allow_whitespace(); + } + parser.eat('}', true); parser.current().children.push(block); @@ -319,6 +326,9 @@ export default function mustache(parser: Parser) { if (await_block_shorthand) { block.then.skip = false; child_block = block.then; + } else if (await_block_catch_shorthand) { + block.catch.skip = false; + child_block = block.catch; } else { block.pending.skip = false; child_block = block.pending; diff --git a/test/runtime/samples/await-catch-shorthand/_config.js b/test/runtime/samples/await-catch-shorthand/_config.js new file mode 100644 index 0000000000..2e1574145f --- /dev/null +++ b/test/runtime/samples/await-catch-shorthand/_config.js @@ -0,0 +1,41 @@ +let fulfil; + +let thePromise = new Promise(f => { + fulfil = f; +}); + +export default { + props: { + thePromise + }, + + html: ``, + + test({ assert, component, target }) { + fulfil(42); + + return thePromise + .then(() => { + assert.htmlEqual(target.innerHTML, ``); + + let reject; + + thePromise = new Promise((f, r) => { + reject = r; + }); + + component.thePromise = thePromise; + + assert.htmlEqual(target.innerHTML, ``); + + reject(new Error('something broke')); + + return thePromise.catch(() => {}); + }) + .then(() => { + assert.htmlEqual(target.innerHTML, ` +

oh no! something broke

+ `); + }); + } +}; \ No newline at end of file diff --git a/test/runtime/samples/await-catch-shorthand/main.svelte b/test/runtime/samples/await-catch-shorthand/main.svelte new file mode 100644 index 0000000000..844e7da08c --- /dev/null +++ b/test/runtime/samples/await-catch-shorthand/main.svelte @@ -0,0 +1,7 @@ + + +{#await thePromise catch theError} +

oh no! {theError.message}

+{/await} \ No newline at end of file diff --git a/test/validator/samples/await-shorthand-no-then/input.svelte b/test/validator/samples/await-shorthand-no-then/input.svelte new file mode 100644 index 0000000000..6e8a99f131 --- /dev/null +++ b/test/validator/samples/await-shorthand-no-then/input.svelte @@ -0,0 +1,7 @@ + + +{#await promise catch error} +

Error: {error}

+{/await} diff --git a/test/validator/samples/await-shorthand-no-then/warnings.json b/test/validator/samples/await-shorthand-no-then/warnings.json new file mode 100644 index 0000000000..fe51488c70 --- /dev/null +++ b/test/validator/samples/await-shorthand-no-then/warnings.json @@ -0,0 +1 @@ +[]