[FIX] component: tricky concurrency issue

This is a really interesting problem: there was a situation where a
component would not have an event handler properly bound. The reason was
that we were in a situation where the scheduler task queue was flushed
at an unfortunate timing:

- parent component template is rendered
- subcomponent is prepared:
   - sub component is willStarted
   - it is rendered (so, fiber counter is set to 0)
- scheduler task queue is flushed => we patch the DOM
- the code registered in the __prepare.then(handler) is executed, which
  add the createHook to the vnode (but after the dom is patched)

Usually, the last two steps happen in a different order, but in an
environment with connected components, we sometimes flush the task queue
at various moments, so some code could be executed between the end of
__prepare and the registered handler.

The fix is interesting: we give a callback to the __prepare function
instead of registering a .then handler to the deferred.  This callback
is then guaranteed to be called at exactly the proper timing.

Thanks seb for the hard work of finding the root cause of this issue

closes #520

tests/router/__snapshots__/link.test.ts.snap

@@ -6,16 +6,16 @@ exports[`Link component can render simple cases 1`] = `
     let utils = this.constructor.utils;
     let owner = context;
     var h = this.h;
-    let _6 = utils.toObj({'router-link-active':context['isActive']});
-    var _7 = context['href'];
-    let c8 = [], p8 = {key:8,attrs:{href: _7},class:_6,on:{}};
-    var vn8 = h('a', p8, c8);
-    extra.handlers['click' + 8] = extra.handlers['click' + 8] || function (e) {const fn = context['navigate'];if (fn) { fn.call(owner, e); } else { context.navigate; }};
-    p8.on['click'] = extra.handlers['click' + 8];
-    const slot9 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
-    if (slot9) {
-        slot9.call(this, context.__owl__.parent, Object.assign({}, extra, {parentNode: c8, vars: extra.vars, parent: extra.parent || owner}));
+    let _5 = utils.toObj({'router-link-active':context['isActive']});
+    var _6 = context['href'];
+    let c7 = [], p7 = {key:7,attrs:{href: _6},class:_5,on:{}};
+    var vn7 = h('a', p7, c7);
+    extra.handlers['click' + 7] = extra.handlers['click' + 7] || function (e) {const fn = context['navigate'];if (fn) { fn.call(owner, e); } else { context.navigate; }};
+    p7.on['click'] = extra.handlers['click' + 7];
+    const slot8 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
+    if (slot8) {
+        slot8.call(this, context.__owl__.parent, Object.assign({}, extra, {parentNode: c7, vars: extra.vars, parent: extra.parent || owner}));
     }
-    return vn8;
+    return vn7;
 }"
 `;

tests/router/__snapshots__/route_component.test.ts.snap

@@ -10,35 +10,33 @@ exports[`RouteComponent can render simple cases 1`] = `
     let result;
     var h = this.h;
     if (context['routeComponent']) {
-        const nodeKey6 = context['env'].router.currentRouteName;
+        const nodeKey5 = context['env'].router.currentRouteName;
         //COMPONENT
-        let k9 = \`__10__\` + nodeKey6;
-        let w8 = k9 in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap[k9]] : false;
-        let vn11 = {};
-        result = vn11;
-        let props8 = Object.assign({}, context['env'].router.currentParams);
-        if (w8 && w8.__owl__.currentFiber && !w8.__owl__.vnode) {
-            w8.destroy();
-            w8 = false;
+        let k7 = \`__8__\` + nodeKey5;
+        let w6 = k7 in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap[k7]] : false;
+        let vn9 = {};
+        result = vn9;
+        let props6 = Object.assign({}, context['env'].router.currentParams);
+        if (w6 && w6.__owl__.currentFiber && !w6.__owl__.vnode) {
+            w6.destroy();
+            w6 = false;
         }
-        if (w8) {
-            w8.__updateProps(props8, extra.fiber, undefined, undefined);
-            let pvnode = w8.__owl__.pvnode;
-            utils.defineProxy(vn11, pvnode);
+        if (w6) {
+            w6.__updateProps(props6, extra.fiber, undefined, undefined);
+            let pvnode = w6.__owl__.pvnode;
+            utils.defineProxy(vn9, pvnode);
         } else {
-            let componentKey8 = \`routeComponent\`;
-            let W8 = context.constructor.components[componentKey8] || QWeb.components[componentKey8]|| context['routeComponent'];
-            if (!W8) {throw new Error('Cannot find the definition of component \\"' + componentKey8 + '\\"')}
-            w8 = new W8(parent, props8);
-            parent.__owl__.cmap[k9] = w8.__owl__.id;
-            let def7 = w8.__prepare(extra.fiber, undefined, undefined);
-            let pvnode = h('dummy', {key: k9, hook: {remove() {},destroy(vn) {w8.destroy();}}});
-            const fiber = w8.__owl__.currentFiber;
-            def7.then(function () { if (fiber.isCompleted) { return; } const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
-            utils.defineProxy(vn11, pvnode);
-            w8.__owl__.pvnode = pvnode;
+            let componentKey6 = \`routeComponent\`;
+            let W6 = context.constructor.components[componentKey6] || QWeb.components[componentKey6]|| context['routeComponent'];
+            if (!W6) {throw new Error('Cannot find the definition of component \\"' + componentKey6 + '\\"')}
+            w6 = new W6(parent, props6);
+            parent.__owl__.cmap[k7] = w6.__owl__.id;
+            let fiber = w6.__prepare(extra.fiber, undefined, undefined, () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
+            let pvnode = h('dummy', {key: k7, hook: {remove() {},destroy(vn) {w6.destroy();}}});
+            utils.defineProxy(vn9, pvnode);
+            w6.__owl__.pvnode = pvnode;
         }
-        w8.__owl__.parentLastFiberId = extra.fiber.id;
+        w6.__owl__.parentLastFiberId = extra.fiber.id;
     }
     return result;
 }"