Skip to content

Commit

Permalink
fire oncreate handlers for components inside await blocks (#1061)
Browse files Browse the repository at this point in the history
  • Loading branch information
Rich-Harris committed Jan 11, 2018
1 parent 9cfa174 commit c1b5bed
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 0 deletions.
6 changes: 6 additions & 0 deletions src/generators/nodes/AwaitBlock.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,10 @@ export default class AwaitBlock extends Node {
block.addVariable(promise);
block.addVariable(resolved);

// the `#component.root.set({})` below is just a cheap way to flush
// any oncreate handlers. We could have a dedicated `flush()` method
// but it's probably not worth it

block.builders.init.addBlock(deindent`
function ${replace_await_block}(${token}, type, ${value}, ${params}) {
if (${token} !== ${await_token}) return;
Expand All @@ -113,6 +117,8 @@ export default class AwaitBlock extends Node {
${old_block}.d();
${await_block}.c();
${await_block}.m(${updateMountNode}, ${anchor});
#component.root.set({});
}
}
Expand Down
14 changes: 14 additions & 0 deletions test/runtime/samples/await-component-oncreate/Foo.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<p>{{value}}</p>
<p>{{called}}</p>

<script>
export default {
data() {
return { called: false };
},

oncreate() {
this.set({ called: true });
}
};
</script>
16 changes: 16 additions & 0 deletions test/runtime/samples/await-component-oncreate/_config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
const promise = Promise.resolve(42);

export default {
data: {
promise
},

test(assert, component, target) {
return promise.then(() => {
assert.htmlEqual(target.innerHTML, `
<p>42</p>
<p>true</p>
`);
});
}
};
13 changes: 13 additions & 0 deletions test/runtime/samples/await-component-oncreate/main.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{{#await promise then value}}
<Foo :value />
{{/await}}

<script>
import Foo from './Foo.html';

export default {
components: {
Foo
}
};
</script>

0 comments on commit c1b5bed

Please sign in to comment.