owl/tests/component/__snapshots__/slots.test.ts.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`t-slot directive can define and call slots 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"Parent\\"
    let utils = this.constructor.utils;
    let QWeb = this.constructor;
    let parent = context;
    let scope = Object.create(context);
    let h = this.h;
    let c1 = [], p1 = {key:1};
    let vn1 = h('div', p1, c1);
    // Component 'Dialog'
    let w2 = '__3__' in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap['__3__']] : false;
    let props2 = {};
    if (w2 && w2.__owl__.currentFiber && !w2.__owl__.vnode) {
        w2.destroy();
        w2 = false;
    }
    if (w2) {
        w2.__updateProps(props2, extra.fiber, Object.assign(Object.create(context), scope));
        let pvnode = w2.__owl__.pvnode;
        c1.push(pvnode);
    } else {
        let componentKey2 = \`Dialog\`;
        let W2 = context.constructor.components[componentKey2] || QWeb.components[componentKey2]|| scope['Dialog'];
        if (!W2) {throw new Error('Cannot find the definition of component \\"' + componentKey2 + '\\"')}
        w2 = new W2(parent, props2);
        parent.__owl__.cmap['__3__'] = w2.__owl__.id;
        w2.__owl__.slotId = 1;
        let fiber = w2.__prepare(extra.fiber, Object.assign(Object.create(context), scope), () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
        let pvnode = h('dummy', {key: '__3__', hook: {remove() {},destroy(vn) {w2.destroy();}}});
        c1.push(pvnode);
        w2.__owl__.pvnode = pvnode;
    }
    w2.__owl__.parentLastFiberId = extra.fiber.id;
    return vn1;
}"
`;

exports[`t-slot directive can define and call slots 2`] = `
"function anonymous(context, extra
) {
    // Template name: \\"Dialog\\"
    let h = this.h;
    let c9 = [], p9 = {key:9};
    let vn9 = h('div', p9, c9);
    let c10 = [], p10 = {key:10};
    let vn10 = h('div', p10, c10);
    c9.push(vn10);
    const slot11 = this.constructor.slots[context.__owl__.slotId + '_' + 'header'];
    if (slot11) {
        slot11.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c10, parent: extra.parent || context}));
    }
    let c12 = [], p12 = {key:12};
    let vn12 = h('div', p12, c12);
    c9.push(vn12);
    const slot13 = this.constructor.slots[context.__owl__.slotId + '_' + 'footer'];
    if (slot13) {
        slot13.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c12, parent: extra.parent || context}));
    }
    return vn9;
}"
`;

exports[`t-slot directive can define and call slots 3`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_header_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    c4.push(vn5);
    c5.push({text: \`header\`});
}"
`;

exports[`t-slot directive can define and call slots 4`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_footer_template\\"
    let h = this.h;
    let c6 = extra.parentNode;
    let c7 = [], p7 = {key:7};
    let vn7 = h('span', p7, c7);
    c6.push(vn7);
    c7.push({text: \`footer\`});
}"
`;

exports[`t-slot directive can define and call slots using old t-set keyword 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__2\\"
    let utils = this.constructor.utils;
    let QWeb = this.constructor;
    let parent = context;
    let scope = Object.create(context);
    let h = this.h;
    let c1 = [], p1 = {key:1};
    let vn1 = h('div', p1, c1);
    // Component 'Dialog'
    let w2 = '__3__' in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap['__3__']] : false;
    let props2 = {};
    if (w2 && w2.__owl__.currentFiber && !w2.__owl__.vnode) {
        w2.destroy();
        w2 = false;
    }
    if (w2) {
        w2.__updateProps(props2, extra.fiber, Object.assign(Object.create(context), scope));
        let pvnode = w2.__owl__.pvnode;
        c1.push(pvnode);
    } else {
        let componentKey2 = \`Dialog\`;
        let W2 = context.constructor.components[componentKey2] || QWeb.components[componentKey2]|| scope['Dialog'];
        if (!W2) {throw new Error('Cannot find the definition of component \\"' + componentKey2 + '\\"')}
        w2 = new W2(parent, props2);
        parent.__owl__.cmap['__3__'] = w2.__owl__.id;
        w2.__owl__.slotId = 1;
        let fiber = w2.__prepare(extra.fiber, Object.assign(Object.create(context), scope), () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
        let pvnode = h('dummy', {key: '__3__', hook: {remove() {},destroy(vn) {w2.destroy();}}});
        c1.push(pvnode);
        w2.__owl__.pvnode = pvnode;
    }
    w2.__owl__.parentLastFiberId = extra.fiber.id;
    return vn1;
}"
`;

exports[`t-slot directive can define and call slots using old t-set keyword 2`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__1\\"
    let h = this.h;
    let c9 = [], p9 = {key:9};
    let vn9 = h('div', p9, c9);
    let c10 = [], p10 = {key:10};
    let vn10 = h('div', p10, c10);
    c9.push(vn10);
    const slot11 = this.constructor.slots[context.__owl__.slotId + '_' + 'header'];
    if (slot11) {
        slot11.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c10, parent: extra.parent || context}));
    }
    let c12 = [], p12 = {key:12};
    let vn12 = h('div', p12, c12);
    c9.push(vn12);
    const slot13 = this.constructor.slots[context.__owl__.slotId + '_' + 'footer'];
    if (slot13) {
        slot13.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c12, parent: extra.parent || context}));
    }
    return vn9;
}"
`;

exports[`t-slot directive can define and call slots using old t-set keyword 3`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_header_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    c4.push(vn5);
    c5.push({text: \`header\`});
}"
`;

exports[`t-slot directive can define and call slots using old t-set keyword 4`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_footer_template\\"
    let h = this.h;
    let c6 = extra.parentNode;
    let c7 = [], p7 = {key:7};
    let vn7 = h('span', p7, c7);
    c6.push(vn7);
    c7.push({text: \`footer\`});
}"
`;

exports[`t-slot directive content is the default slot 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    c4.push(vn5);
    c5.push({text: \`sts rocks\`});
}"
`;

exports[`t-slot directive dafault slots can define a default content 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__1\\"
    let h = this.h;
    let c4 = [], p4 = {key:4};
    let vn4 = h('span', p4, c4);
    const slot5 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
    if (slot5) {
        slot5.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c4, parent: extra.parent || context}));
    } else {
        c4.push({text: \`default content\`});
    }
    return vn4;
}"
`;

exports[`t-slot directive default slot work with text nodes 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    c4.push({text: \`sts rocks\`});
}"
`;

exports[`t-slot directive dynamic t-slot call 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__1\\"
    let utils = this.constructor.utils;
    let scope = Object.create(context);
    let h = this.h;
    let c10 = [], p10 = {key:10,on:{}};
    let vn10 = h('button', p10, c10);
    extra.handlers['click__11__'] = extra.handlers['click__11__'] || function (e) {if (context.__owl__.status === 5){return}utils.getComponent(context)['toggle'](e);};
    p10.on['click'] = extra.handlers['click__11__'];
    const slot12 = this.constructor.slots[context.__owl__.slotId + '_' + (scope['current'].slot)];
    if (slot12) {
        slot12.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c10, parent: extra.parent || context}));
    }
    return vn10;
}"
`;

exports[`t-slot directive multiple roots are allowed in a default slot 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    c4.push(vn5);
    c5.push({text: \`sts\`});
    let c6 = [], p6 = {key:6};
    let vn6 = h('span', p6, c6);
    c4.push(vn6);
    c6.push({text: \`rocks\`});
}"
`;

exports[`t-slot directive multiple roots are allowed in a named slot 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_content_template\\"
    let h = this.h;
    let c4 = extra.parentNode;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    c4.push(vn5);
    c5.push({text: \`sts\`});
    let c6 = [], p6 = {key:6};
    let vn6 = h('span', p6, c6);
    c4.push(vn6);
    c6.push({text: \`rocks\`});
}"
`;

exports[`t-slot directive named slots can define a default content 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__1\\"
    let h = this.h;
    let c4 = [], p4 = {key:4};
    let vn4 = h('span', p4, c4);
    const slot5 = this.constructor.slots[context.__owl__.slotId + '_' + 'header'];
    if (slot5) {
        slot5.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c4, parent: extra.parent || context}));
    } else {
        c4.push({text: \`default content\`});
    }
    return vn4;
}"
`;

exports[`t-slot directive refs are properly bound in slots 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_footer_template\\"
    let utils = this.constructor.utils;
    context.__owl__.refs = context.__owl__.refs || {};
    let h = this.h;
    let c8 = extra.parentNode;
    let c9 = [], p9 = {key:9,on:{}};
    let vn9 = h('button', p9, c9);
    c8.push(vn9);
    extra.handlers['click__10__'] = extra.handlers['click__10__'] || function (e) {if (context.__owl__.status === 5){return}utils.getComponent(context)['doSomething'](e);};
    p9.on['click'] = extra.handlers['click__10__'];
    const ref11 = \`myButton\`;
    p9.hook = {
      create: (_, n) => {
        context.__owl__.refs[ref11] = n.elm;
      },
      destroy: () => {
        delete context.__owl__.refs[ref11];
      },
    };
    c9.push({text: \`do something\`});
}"
`;

exports[`t-slot directive slots are rendered with proper context 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_footer_template\\"
    let utils = this.constructor.utils;
    let h = this.h;
    let c8 = extra.parentNode;
    let c9 = [], p9 = {key:9,on:{}};
    let vn9 = h('button', p9, c9);
    c8.push(vn9);
    extra.handlers['click__10__'] = extra.handlers['click__10__'] || function (e) {if (context.__owl__.status === 5){return}utils.getComponent(context)['doSomething'](e);};
    p9.on['click'] = extra.handlers['click__10__'];
    c9.push({text: \`do something\`});
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 2 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"Link\\"
    let scope = Object.create(context);
    let h = this.h;
    let _12 = scope['props'].to;
    let c13 = [], p13 = {key:13,attrs:{href: _12}};
    let vn13 = h('a', p13, c13);
    const slot14 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
    if (slot14) {
        slot14.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c13, parent: extra.parent || context}));
    }
    return vn13;
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 2 2`] = `
"function anonymous(context, extra
) {
    // Template name: \\"App\\"
    let utils = this.constructor.utils;
    let QWeb = this.constructor;
    let parent = context;
    let scope = Object.create(context);
    let h = this.h;
    let c1 = [], p1 = {key:1};
    let vn1 = h('div', p1, c1);
    let c2 = [], p2 = {key:2};
    let vn2 = h('u', p2, c2);
    c1.push(vn2);
    let _3 = scope['state'].users;
    if (!_3) { throw new Error('QWeb error: Invalid loop expression')}
    let _4 = _5 = _3;
    if (!(_3 instanceof Array)) {
        _4 = Object.keys(_3);
        _5 = Object.values(_3);
    }
    let _length4 = _4.length;
    let _origScope6 = scope;
    scope = Object.create(scope);
    for (let i1 = 0; i1 < _length4; i1++) {
        scope.user_first = i1 === 0
        scope.user_last = i1 === _length4 - 1
        scope.user_index = i1
        scope.user = _4[i1]
        scope.user_value = _5[i1]
        let key1 = scope['user'].id;
        let c7 = [], p7 = {key:\`\${key1}_7\`};
        let vn7 = h('li', p7, c7);
        c2.push(vn7);
        // Component 'Link'
        let k9 = \`__9__\${key1}__\`;
        let w8 = k9 in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap[k9]] : false;
        let props8 = {to:'/user/'+scope['user'].id};
        if (w8 && w8.__owl__.currentFiber && !w8.__owl__.vnode) {
            w8.destroy();
            w8 = false;
        }
        if (w8) {
            w8.__updateProps(props8, extra.fiber, Object.assign(Object.create(context), scope));
            let pvnode = w8.__owl__.pvnode;
            c7.push(pvnode);
        } else {
            let componentKey8 = \`Link\`;
            let W8 = context.constructor.components[componentKey8] || QWeb.components[componentKey8]|| scope['Link'];
            if (!W8) {throw new Error('Cannot find the definition of component \\"' + componentKey8 + '\\"')}
            w8 = new W8(parent, props8);
            parent.__owl__.cmap[k9] = w8.__owl__.id;
            w8.__owl__.slotId = 1;
            let fiber = w8.__prepare(extra.fiber, Object.assign(Object.create(context), scope), () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
            let pvnode = h('dummy', {key: k9, hook: {remove() {},destroy(vn) {w8.destroy();}}});
            c7.push(pvnode);
            w8.__owl__.pvnode = pvnode;
        }
        w8.__owl__.parentLastFiberId = extra.fiber.id;
    }
    scope = _origScope6;
    return vn1;
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 2 3`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let scope = Object.create(context);
    let h = this.h;
    let c10 = extra.parentNode;
    c10.push({text: \`User \`});
    let _11 = scope['user'].name;
    if (_11 != null) {
        c10.push({text: _11});
    }
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 3 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"Link\\"
    let scope = Object.create(context);
    let h = this.h;
    let _12 = scope['props'].to;
    let c13 = [], p13 = {key:13,attrs:{href: _12}};
    let vn13 = h('a', p13, c13);
    const slot14 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
    if (slot14) {
        slot14.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c13, parent: extra.parent || context}));
    }
    return vn13;
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 3 2`] = `
"function anonymous(context, extra
) {
    // Template name: \\"App\\"
    let utils = this.constructor.utils;
    let QWeb = this.constructor;
    let parent = context;
    let scope = Object.create(context);
    let h = this.h;
    let c1 = [], p1 = {key:1};
    let vn1 = h('div', p1, c1);
    let c2 = [], p2 = {key:2};
    let vn2 = h('u', p2, c2);
    c1.push(vn2);
    let _3 = scope['state'].users;
    if (!_3) { throw new Error('QWeb error: Invalid loop expression')}
    let _4 = _5 = _3;
    if (!(_3 instanceof Array)) {
        _4 = Object.keys(_3);
        _5 = Object.values(_3);
    }
    let _length4 = _4.length;
    let _origScope6 = scope;
    scope = Object.create(scope);
    for (let i1 = 0; i1 < _length4; i1++) {
        scope.user_first = i1 === 0
        scope.user_last = i1 === _length4 - 1
        scope.user_index = i1
        scope.user = _4[i1]
        scope.user_value = _5[i1]
        let key1 = scope['user'].id;
        let c7 = [], p7 = {key:\`\${key1}_7\`};
        let vn7 = h('li', p7, c7);
        c2.push(vn7);
        utils.getScope(scope, 'userdescr').userdescr = 'User '+scope['user'].name;
        // Component 'Link'
        let k9 = \`__9__\${key1}__\`;
        let w8 = k9 in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap[k9]] : false;
        let props8 = {to:'/user/'+scope['user'].id};
        if (w8 && w8.__owl__.currentFiber && !w8.__owl__.vnode) {
            w8.destroy();
            w8 = false;
        }
        if (w8) {
            w8.__updateProps(props8, extra.fiber, Object.assign(Object.create(context), scope));
            let pvnode = w8.__owl__.pvnode;
            c7.push(pvnode);
        } else {
            let componentKey8 = \`Link\`;
            let W8 = context.constructor.components[componentKey8] || QWeb.components[componentKey8]|| scope['Link'];
            if (!W8) {throw new Error('Cannot find the definition of component \\"' + componentKey8 + '\\"')}
            w8 = new W8(parent, props8);
            parent.__owl__.cmap[k9] = w8.__owl__.id;
            w8.__owl__.slotId = 1;
            let fiber = w8.__prepare(extra.fiber, Object.assign(Object.create(context), scope), () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
            let pvnode = h('dummy', {key: k9, hook: {remove() {},destroy(vn) {w8.destroy();}}});
            c7.push(pvnode);
            w8.__owl__.pvnode = pvnode;
        }
        w8.__owl__.parentLastFiberId = extra.fiber.id;
    }
    scope = _origScope6;
    return vn1;
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 3 3`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let scope = Object.create(context);
    let h = this.h;
    let c10 = extra.parentNode;
    let _11 = scope['userdescr'];
    if (_11 != null) {
        c10.push({text: _11});
    }
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 4 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"App\\"
    let utils = this.constructor.utils;
    let QWeb = this.constructor;
    let parent = context;
    let scope = Object.create(context);
    let h = this.h;
    let c1 = [], p1 = {key:1};
    let vn1 = h('div', p1, c1);
    scope.userdescr = 'User '+scope['state'].user.name;
    // Component 'Link'
    let w2 = '__3__' in parent.__owl__.cmap ? parent.__owl__.children[parent.__owl__.cmap['__3__']] : false;
    let props2 = {to:'/user/'+scope['state'].user.id};
    if (w2 && w2.__owl__.currentFiber && !w2.__owl__.vnode) {
        w2.destroy();
        w2 = false;
    }
    if (w2) {
        w2.__updateProps(props2, extra.fiber, Object.assign(Object.create(context), scope));
        let pvnode = w2.__owl__.pvnode;
        c1.push(pvnode);
    } else {
        let componentKey2 = \`Link\`;
        let W2 = context.constructor.components[componentKey2] || QWeb.components[componentKey2]|| scope['Link'];
        if (!W2) {throw new Error('Cannot find the definition of component \\"' + componentKey2 + '\\"')}
        w2 = new W2(parent, props2);
        parent.__owl__.cmap['__3__'] = w2.__owl__.id;
        w2.__owl__.slotId = 1;
        let fiber = w2.__prepare(extra.fiber, Object.assign(Object.create(context), scope), () => { const vnode = fiber.vnode; pvnode.sel = vnode.sel; });
        let pvnode = h('dummy', {key: '__3__', hook: {remove() {},destroy(vn) {w2.destroy();}}});
        c1.push(pvnode);
        w2.__owl__.pvnode = pvnode;
    }
    w2.__owl__.parentLastFiberId = extra.fiber.id;
    return vn1;
}"
`;

exports[`t-slot directive slots are rendered with proper context, part 4 2`] = `
"function anonymous(context, extra
) {
    // Template name: \\"slot_default_template\\"
    let scope = Object.create(context);
    let h = this.h;
    let c4 = extra.parentNode;
    let _5 = scope['userdescr'];
    if (_5 != null) {
        c4.push({text: _5});
    }
}"
`;

exports[`t-slot directive t-set t-value in a slot 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__1\\"
    let h = this.h;
    let c5 = [], p5 = {key:5};
    let vn5 = h('span', p5, c5);
    const slot6 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
    if (slot6) {
        slot6.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: c5, parent: extra.parent || context}));
    }
    return vn5;
}"
`;

exports[`t-slot directive template can just return a slot 1`] = `
"function anonymous(context, extra
) {
    // Template name: \\"__template__2\\"
    let utils = this.constructor.utils;
    let result;
    let h = this.h;
    const slot7 = this.constructor.slots[context.__owl__.slotId + '_' + 'default'];
    if (slot7) {
        let children8= []
        result = {}
        slot7.call(this, context.__owl__.scope, Object.assign({}, extra, {parentNode: children8, parent: extra.parent || context}));
        utils.defineProxy(result, children8[0]);
    }
    return result;
}"
`;