diff --git a/src/qweb/qweb.ts b/src/qweb/qweb.ts
index 7f80795a..5e442ded 100644
--- a/src/qweb/qweb.ts
+++ b/src/qweb/qweb.ts
@@ -347,8 +347,8 @@ export class QWeb extends EventBus {
     if (parentContext) {
       ctx.templates = Object.create(parentContext.templates);
       ctx.variables = Object.create(parentContext.variables);
-      ctx.nextID = parentContext.parentNode! + 1;
-      ctx.parentNode = parentContext.parentNode!;
+      ctx.nextID = parentContext.nextID + 1;
+      ctx.parentNode = parentContext.parentNode || ctx.nextID++;
       ctx.allowMultipleRoots = true;
       ctx.hasParentWidget = true;
       ctx.shouldDefineResult = false;
diff --git a/src/router/RouteComponent.ts b/src/router/RouteComponent.ts
index db37c702..c8afd805 100644
--- a/src/router/RouteComponent.ts
+++ b/src/router/RouteComponent.ts
@@ -13,6 +13,6 @@ export class RouteComponent extends Component<any, {}, {}> {
   `;
 
   get routeComponent(): any {
-      return this.env.router.currentRoute && this.env.router.currentRoute.component;
+    return this.env.router.currentRoute && this.env.router.currentRoute.component;
   }
 }
diff --git a/tests/component/__snapshots__/component.test.ts.snap b/tests/component/__snapshots__/component.test.ts.snap
index cf98c4bb..9a7e3f28 100644
--- a/tests/component/__snapshots__/component.test.ts.snap
+++ b/tests/component/__snapshots__/component.test.ts.snap
@@ -1447,10 +1447,10 @@ exports[`t-slot directive can define and call slots 3`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('span', p2, c2);
-    c1.push(vn2);
-    c2.push({text: \`header\`});
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c1.push(vn6);
+    c6.push({text: \`header\`});
 }"
 `;
 
@@ -1460,10 +1460,10 @@ exports[`t-slot directive can define and call slots 4`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('span', p2, c2);
-    c1.push(vn2);
-    c2.push({text: \`footer\`});
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c1.push(vn6);
+    c6.push({text: \`footer\`});
 }"
 `;
 
@@ -1473,10 +1473,10 @@ exports[`t-slot directive content is the default slot 1`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('span', p2, c2);
-    c1.push(vn2);
-    c2.push({text: \`sts rocks\`});
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c1.push(vn6);
+    c6.push({text: \`sts rocks\`});
 }"
 `;
 
@@ -1496,14 +1496,14 @@ exports[`t-slot directive multiple roots are allowed in a default slot 1`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('span', p2, c2);
-    c1.push(vn2);
-    c2.push({text: \`sts\`});
-    let c3 = [], p3 = {key:3};
-    var vn3 = h('span', p3, c3);
-    c1.push(vn3);
-    c3.push({text: \`rocks\`});
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c1.push(vn6);
+    c6.push({text: \`sts\`});
+    let c7 = [], p7 = {key:7};
+    var vn7 = h('span', p7, c7);
+    c1.push(vn7);
+    c7.push({text: \`rocks\`});
 }"
 `;
 
@@ -1513,14 +1513,14 @@ exports[`t-slot directive multiple roots are allowed in a named slot 1`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('span', p2, c2);
-    c1.push(vn2);
-    c2.push({text: \`sts\`});
-    let c3 = [], p3 = {key:3};
-    var vn3 = h('span', p3, c3);
-    c1.push(vn3);
-    c3.push({text: \`rocks\`});
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c1.push(vn6);
+    c6.push({text: \`sts\`});
+    let c7 = [], p7 = {key:7};
+    var vn7 = h('span', p7, c7);
+    c1.push(vn7);
+    c7.push({text: \`rocks\`});
 }"
 `;
 
@@ -1531,21 +1531,21 @@ exports[`t-slot directive refs are properly bound in slots 1`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2,on:{}};
-    var vn2 = h('button', p2, c2);
-    c1.push(vn2);
+    let c10 = [], p10 = {key:10,on:{}};
+    var vn10 = h('button', p10, c10);
+    c1.push(vn10);
     if (!context['doSomething']) {
         throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'slot_footer_template'\`)
     }
-    extra.handlers['click' + 2] = extra.handlers['click' + 2] || context['doSomething'].bind(owner);
-    p2.on['click'] = extra.handlers['click' + 2];
-    const ref3 = \`myButton\`;
-    p2.hook = {
+    extra.handlers['click' + 10] = extra.handlers['click' + 10] || context['doSomething'].bind(owner);
+    p10.on['click'] = extra.handlers['click' + 10];
+    const ref11 = \`myButton\`;
+    p10.hook = {
       create: (_, n) => {
-        context.refs[ref3] = n.elm;
+        context.refs[ref11] = n.elm;
       },
     };
-    c2.push({text: \`do something\`});
+    c10.push({text: \`do something\`});
 }"
 `;
 
@@ -1556,15 +1556,15 @@ exports[`t-slot directive slots are rendered with proper context 1`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2,on:{}};
-    var vn2 = h('button', p2, c2);
-    c1.push(vn2);
+    let c10 = [], p10 = {key:10,on:{}};
+    var vn10 = h('button', p10, c10);
+    c1.push(vn10);
     if (!context['doSomething']) {
         throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'slot_footer_template'\`)
     }
-    extra.handlers['click' + 2] = extra.handlers['click' + 2] || context['doSomething'].bind(owner);
-    p2.on['click'] = extra.handlers['click' + 2];
-    c2.push({text: \`do something\`});
+    extra.handlers['click' + 10] = extra.handlers['click' + 10] || context['doSomething'].bind(owner);
+    p10.on['click'] = extra.handlers['click' + 10];
+    c10.push({text: \`do something\`});
 }"
 `;
 
@@ -1665,9 +1665,9 @@ exports[`t-slot directive slots are rendered with proper context, part 2 3`] = `
     let c6 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
     c6.push({text: \`User \`});
-    var _7 = context['user'].name;
-    if (_7 || _7 === 0) {
-        c6.push({text: _7});
+    var _12 = context['user'].name;
+    if (_12 || _12 === 0) {
+        c6.push({text: _12});
     }
 }"
 `;
diff --git a/tests/component/component.test.ts b/tests/component/component.test.ts
index a13c5485..10614583 100644
--- a/tests/component/component.test.ts
+++ b/tests/component/component.test.ts
@@ -2312,16 +2312,16 @@ describe("random stuff/miscellaneous", () => {
   });
 
   test("can inject values in tagged templates", async () => {
-      const SUBTEMPLATE = xml`<span><t t-esc="state.n"/></span>`
-      class Parent extends Widget {
-          static template = xml`<div><t t-call="${SUBTEMPLATE}"/></div>`
-          state = {n: 42};
-      }
+    const SUBTEMPLATE = xml`<span><t t-esc="state.n"/></span>`;
+    class Parent extends Widget {
+      static template = xml`<div><t t-call="${SUBTEMPLATE}"/></div>`;
+      state = { n: 42 };
+    }
 
     const widget = new Parent(env);
     await widget.mount(fixture);
     expect(env.qweb.templates[Parent.template].fn.toString()).toMatchSnapshot();
-    expect(fixture.innerHTML).toBe('<div><span>42</span></div>')
+    expect(fixture.innerHTML).toBe("<div><span>42</span></div>");
   });
 });
 
@@ -3476,6 +3476,25 @@ describe("t-slot directive", () => {
     await nextTick();
     expect(fixture.innerHTML).toBe("<div><button>Inc[5]</button><div><div> SC:5</div></div></div>");
   });
+
+  test("slots and wrapper components", async () => {
+    class Link extends Component<any, any, any> {
+      static template = xml`
+        <a href="abc">
+            <t t-slot="default"/>
+        </a>`;
+    }
+
+    class A extends Component<any, any, any> {
+      static template = xml`<Link>hey</Link>`;
+      static components = { Link: Link };
+    }
+
+    const a = new A(env);
+    await a.mount(fixture);
+
+    expect(fixture.innerHTML).toBe(`<a href="abc">hey</a>`);
+  });
 });
 
 describe("t-model directive", () => {
diff --git a/tests/qweb/__snapshots__/qweb.test.ts.snap b/tests/qweb/__snapshots__/qweb.test.ts.snap
index a2544eb6..eb49df37 100644
--- a/tests/qweb/__snapshots__/qweb.test.ts.snap
+++ b/tests/qweb/__snapshots__/qweb.test.ts.snap
@@ -897,15 +897,15 @@ exports[`t-call (template calling recursive template, part 1 2`] = `
     var h = this.h;
     let c1 = extra.parentNode;
         Object.assign(context, extra.fiber.scope);
-    let c2 = [], p2 = {key:2};
-    var vn2 = h('div', p2, c2);
-    c1.push(vn2);
-    let c3 = [], p3 = {key:3};
-    var vn3 = h('span', p3, c3);
-    c2.push(vn3);
-    c3.push({text: \`hey\`});
+    let c5 = [], p5 = {key:5};
+    var vn5 = h('div', p5, c5);
+    c1.push(vn5);
+    let c6 = [], p6 = {key:6};
+    var vn6 = h('span', p6, c6);
+    c5.push(vn6);
+    c6.push({text: \`hey\`});
     if (false) {
-        this.recursiveFns['__3'].call(this, context, Object.assign({}, extra, {parentNode: c2, fiber: {vars: {}, scope}}));
+        this.recursiveFns['__3'].call(this, context, Object.assign({}, extra, {parentNode: c5, fiber: {vars: {}, scope}}));
     }
 }"
 `;
@@ -968,36 +968,36 @@ exports[`t-call (template calling recursive template, part 2 2`] = `
     let c3 = extra.parentNode;
     let _v0 = extra.fiber.vars._v0
         Object.assign(context, extra.fiber.scope);
-    let c4 = [], p4 = {key:4};
-    var vn4 = h('div', p4, c4);
-    c3.push(vn4);
-    let c5 = [], p5 = {key:5};
-    var vn5 = h('p', p5, c5);
-    c4.push(vn5);
-    var _6 = _v0.val;
-    if (_6 || _6 === 0) {
-        c5.push({text: _6});
+    let c12 = [], p12 = {key:12};
+    var vn12 = h('div', p12, c12);
+    c3.push(vn12);
+    let c13 = [], p13 = {key:13};
+    var vn13 = h('p', p13, c13);
+    c12.push(vn13);
+    var _14 = _v0.val;
+    if (_14 || _14 === 0) {
+        c13.push({text: _14});
     }
-    var _7 = _v0.children||[];
-    if (!_7) { throw new Error('QWeb error: Invalid loop expression')}
-    var _8 = _9 = _7;
-    if (!(_7 instanceof Array)) {
-        _8 = Object.keys(_7);
-        _9 = Object.values(_7);
+    var _15 = _v0.children||[];
+    if (!_15) { throw new Error('QWeb error: Invalid loop expression')}
+    var _16 = _17 = _15;
+    if (!(_15 instanceof Array)) {
+        _16 = Object.keys(_15);
+        _17 = Object.values(_15);
     }
-    var _length8 = _8.length;
-    for (let i = 0; i < _length8; i++) {
+    var _length16 = _16.length;
+    for (let i = 0; i < _length16; i++) {
         context.subtree_first = i === 0;
         scope.subtree_first = context.subtree_first;
-        context.subtree_last = i === _length8 - 1;
+        context.subtree_last = i === _length16 - 1;
         scope.subtree_last = context.subtree_last;
         context.subtree_index = i;
         scope.subtree_index = context.subtree_index;
-        context.subtree = _8[i];
+        context.subtree = _16[i];
         scope.subtree = context.subtree;
-        context.subtree_value = _9[i];
+        context.subtree_value = _17[i];
         scope.subtree_value = context.subtree_value;
-        this.recursiveFns['__10'].call(this, context, Object.assign({}, extra, {parentNode: c4, fiber: {vars: {_v0: context['subtree']}, scope}}));
+        this.recursiveFns['__10'].call(this, context, Object.assign({}, extra, {parentNode: c12, fiber: {vars: {_v0: context['subtree']}, scope}}));
     }
 }"
 `;
@@ -1060,36 +1060,36 @@ exports[`t-call (template calling recursive template, part 3 2`] = `
     let c3 = extra.parentNode;
     let _v0 = extra.fiber.vars._v0
         Object.assign(context, extra.fiber.scope);
-    let c4 = [], p4 = {key:4};
-    var vn4 = h('div', p4, c4);
-    c3.push(vn4);
-    let c5 = [], p5 = {key:5};
-    var vn5 = h('p', p5, c5);
-    c4.push(vn5);
-    var _6 = _v0.val;
-    if (_6 || _6 === 0) {
-        c5.push({text: _6});
+    let c12 = [], p12 = {key:12};
+    var vn12 = h('div', p12, c12);
+    c3.push(vn12);
+    let c13 = [], p13 = {key:13};
+    var vn13 = h('p', p13, c13);
+    c12.push(vn13);
+    var _14 = _v0.val;
+    if (_14 || _14 === 0) {
+        c13.push({text: _14});
     }
-    var _7 = _v0.children||[];
-    if (!_7) { throw new Error('QWeb error: Invalid loop expression')}
-    var _8 = _9 = _7;
-    if (!(_7 instanceof Array)) {
-        _8 = Object.keys(_7);
-        _9 = Object.values(_7);
+    var _15 = _v0.children||[];
+    if (!_15) { throw new Error('QWeb error: Invalid loop expression')}
+    var _16 = _17 = _15;
+    if (!(_15 instanceof Array)) {
+        _16 = Object.keys(_15);
+        _17 = Object.values(_15);
     }
-    var _length8 = _8.length;
-    for (let i = 0; i < _length8; i++) {
+    var _length16 = _16.length;
+    for (let i = 0; i < _length16; i++) {
         context.subtree_first = i === 0;
         scope.subtree_first = context.subtree_first;
-        context.subtree_last = i === _length8 - 1;
+        context.subtree_last = i === _length16 - 1;
         scope.subtree_last = context.subtree_last;
         context.subtree_index = i;
         scope.subtree_index = context.subtree_index;
-        context.subtree = _8[i];
+        context.subtree = _16[i];
         scope.subtree = context.subtree;
-        context.subtree_value = _9[i];
+        context.subtree_value = _17[i];
         scope.subtree_value = context.subtree_value;
-        this.recursiveFns['__10'].call(this, context, Object.assign({}, extra, {parentNode: c4, fiber: {vars: {_v0: context['subtree']}, scope}}));
+        this.recursiveFns['__10'].call(this, context, Object.assign({}, extra, {parentNode: c12, fiber: {vars: {_v0: context['subtree']}, scope}}));
     }
 }"
 `;