diff --git a/src/generators/dom/visitors/AwaitBlock.ts b/src/generators/dom/visitors/AwaitBlock.ts index c0d5c25b85..6e014af289 100644 --- a/src/generators/dom/visitors/AwaitBlock.ts +++ b/src/generators/dom/visitors/AwaitBlock.ts @@ -67,7 +67,7 @@ export default function visitAwaitBlock( ${old_block}.u(); ${old_block}.d(); ${await_block}.c(); - ${await_block}.m(${anchor}.parentNode, ${anchor}); + ${await_block}.m(${state.parentNode || `${anchor}.parentNode`}, ${anchor}); } } @@ -142,6 +142,10 @@ export default function visitAwaitBlock( `); } + block.builders.unmount.addBlock(deindent` + ${await_block}.u(); + `); + block.builders.destroy.addBlock(deindent` ${await_token} = null; ${await_block}.d(); diff --git a/test/runtime/samples/await-then-catch-anchor/_config.js b/test/runtime/samples/await-then-catch-anchor/_config.js new file mode 100644 index 0000000000..697c119ccd --- /dev/null +++ b/test/runtime/samples/await-then-catch-anchor/_config.js @@ -0,0 +1,49 @@ +let fulfil; + +let thePromise = new Promise(f => { + fulfil = f; +}); + +export default { + data: { + thePromise + }, + + html: ` +

loading...

+ `, + + test(assert, component, target) { + fulfil(42); + + return thePromise + .then(() => { + assert.htmlEqual(target.innerHTML, ` +

the value is 42

+ `); + + let reject; + + thePromise = new Promise((f, r) => { + reject = r; + }); + + component.set({ + thePromise + }); + + assert.htmlEqual(target.innerHTML, ` +

loading...

+ `); + + reject(new Error('something broke')); + + return thePromise.catch(() => {}); + }) + .then(() => { + assert.htmlEqual(target.innerHTML, ` +

oh no! something broke

+ `); + }); + } +}; diff --git a/test/runtime/samples/await-then-catch-anchor/main.html b/test/runtime/samples/await-then-catch-anchor/main.html new file mode 100644 index 0000000000..b8e32962fa --- /dev/null +++ b/test/runtime/samples/await-then-catch-anchor/main.html @@ -0,0 +1,9 @@ +
+{{#await thePromise}} +

loading...

+{{then theValue}} +

the value is {{theValue}}

+{{catch theError}} +

oh no! {{theError.message}}

+{{/await}} +
diff --git a/test/runtime/samples/await-then-catch-if/_config.js b/test/runtime/samples/await-then-catch-if/_config.js new file mode 100644 index 0000000000..bbd8d792c6 --- /dev/null +++ b/test/runtime/samples/await-then-catch-if/_config.js @@ -0,0 +1,45 @@ +let fulfil; + +const thePromise = new Promise(f => { + fulfil = f; +}); + +export default { + data: { + show: true, + thePromise + }, + + html: ` +

loading...

+ `, + + test(assert, component, target) { + fulfil(42); + + return thePromise + .then(() => { + assert.htmlEqual(target.innerHTML, ` +

the value is 42

+ `); + + component.set({ + show: false + }); + + assert.htmlEqual(target.innerHTML, ` +

Else

+ `); + + component.set({ + show: true + }); + + return thePromise.then(() => { + assert.htmlEqual(target.innerHTML, ` +

the value is 42

+ `); + }); + }); + } +}; diff --git a/test/runtime/samples/await-then-catch-if/main.html b/test/runtime/samples/await-then-catch-if/main.html new file mode 100644 index 0000000000..20449734d4 --- /dev/null +++ b/test/runtime/samples/await-then-catch-if/main.html @@ -0,0 +1,11 @@ +{{#if show}} +{{#await thePromise}} +

loading...

+{{then theValue}} +

the value is {{theValue}}

+{{catch theError}} +

oh no! {{theError.message}}

+{{/await}} +{{else}} +

Else

+{{/if}}