[IMP] support modifiers with t-on directive

Supported modifiers are stop, prevent and self.

Closes #115.
This commit is contained in:
Aaron Bohy
2019-05-23 11:26:03 +02:00
committed by Géry Debongnie
parent 13b31458da
commit 8a32d823cd
4 changed files with 321 additions and 21 deletions
+155 -9
View File
@@ -1154,7 +1154,10 @@ exports[`t-on can bind event handler 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
extra.handlers['click' + 1] = extra.handlers['click' + 1] || (context['add'] || (function () {throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner);
if (!context['add']) {
throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 1] = extra.handlers['click' + 1] || context['add'].bind(owner);
p1.on['click'] = extra.handlers['click' + 1];
c1.push({text: \`Click\`});
return vn1;
@@ -1168,7 +1171,10 @@ exports[`t-on can bind handlers with arguments 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
p1.on['click'] = (context['add'] || (function () {throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner, 5);
if (!context['add']) {
throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)
}
p1.on['click'] = context['add'].bind(owner, 5);
c1.push({text: \`Click\`});
return vn1;
}"
@@ -1181,7 +1187,10 @@ exports[`t-on can bind handlers with empty object (with non empty inner string 1
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
p1.on['click'] = (context['doSomething'] || (function () {throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner, {});
if (!context['doSomething']) {
throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'test'\`)
}
p1.on['click'] = context['doSomething'].bind(owner, {});
c1.push({text: \`Click\`});
return vn1;
}"
@@ -1194,7 +1203,10 @@ exports[`t-on can bind handlers with empty object 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
p1.on['click'] = (context['doSomething'] || (function () {throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner, {});
if (!context['doSomething']) {
throw new Error('Missing handler \\\\'' + 'doSomething' + \`\\\\' when evaluating template 'test'\`)
}
p1.on['click'] = context['doSomething'].bind(owner, {});
c1.push({text: \`Click\`});
return vn1;
}"
@@ -1226,7 +1238,10 @@ exports[`t-on can bind handlers with loop variable as argument 1`] = `
let c6 = [], p6 = {key:6,on:{}};
var vn6 = h('a', p6, c6);
c5.push(vn6);
p6.on['click'] = (context['activate'] || (function () {throw new Error('Missing handler \\\\'' + 'activate' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner, context['action']);
if (!context['activate']) {
throw new Error('Missing handler \\\\'' + 'activate' + \`\\\\' when evaluating template 'test'\`)
}
p6.on['click'] = context['activate'].bind(owner, context['action']);
c6.push({text: \`link\`});
}
return vn1;
@@ -1240,7 +1255,10 @@ exports[`t-on can bind handlers with object arguments 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
p1.on['click'] = (context['add'] || (function () {throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner, {val: 5});
if (!context['add']) {
throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)
}
p1.on['click'] = context['add'].bind(owner, {val: 5});
c1.push({text: \`Click\`});
return vn1;
}"
@@ -1253,9 +1271,15 @@ exports[`t-on can bind two event handlers 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
extra.handlers['click' + 1] = extra.handlers['click' + 1] || (context['handleClick'] || (function () {throw new Error('Missing handler \\\\'' + 'handleClick' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner);
if (!context['handleClick']) {
throw new Error('Missing handler \\\\'' + 'handleClick' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 1] = extra.handlers['click' + 1] || context['handleClick'].bind(owner);
p1.on['click'] = extra.handlers['click' + 1];
extra.handlers['dblclick' + 1] = extra.handlers['dblclick' + 1] || (context['handleDblClick'] || (function () {throw new Error('Missing handler \\\\'' + 'handleDblClick' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner);
if (!context['handleDblClick']) {
throw new Error('Missing handler \\\\'' + 'handleDblClick' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['dblclick' + 1] = extra.handlers['dblclick' + 1] || context['handleDblClick'].bind(owner);
p1.on['dblclick'] = extra.handlers['dblclick' + 1];
c1.push({text: \`Click\`});
return vn1;
@@ -1269,13 +1293,135 @@ exports[`t-on handler is bound to proper owner 1`] = `
var h = this.utils.h;
let c1 = [], p1 = {key:1,on:{}};
var vn1 = h('button', p1, c1);
extra.handlers['click' + 1] = extra.handlers['click' + 1] || (context['add'] || (function () {throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)})()).bind(owner);
if (!context['add']) {
throw new Error('Missing handler \\\\'' + 'add' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 1] = extra.handlers['click' + 1] || context['add'].bind(owner);
p1.on['click'] = extra.handlers['click' + 1];
c1.push({text: \`Click\`});
return vn1;
}"
`;
exports[`t-on t-on with prevent and self modifiers (order matters) 1`] = `
"function anonymous(context,extra
) {
let owner = context;
var h = this.utils.h;
let c1 = [], p1 = {key:1};
var vn1 = h('div', p1, c1);
let c2 = [], p2 = {key:2,on:{}};
var vn2 = h('button', p2, c2);
c1.push(vn2);
if (!context['onClick']) {
throw new Error('Missing handler \\\\'' + 'onClick' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 2] = extra.handlers['click' + 2] || function (e) {e.preventDefault();if (e.target !== this.elm) {return}context['onClick'].call(owner, e);};
p2.on['click'] = extra.handlers['click' + 2];
let c3 = [], p3 = {key:3};
var vn3 = h('span', p3, c3);
c2.push(vn3);
c3.push({text: \`Button\`});
return vn1;
}"
`;
exports[`t-on t-on with prevent and/or stop modifiers 1`] = `
"function anonymous(context,extra
) {
let owner = context;
var h = this.utils.h;
let c1 = [], p1 = {key:1};
var vn1 = h('div', p1, c1);
let c2 = [], p2 = {key:2,on:{}};
var vn2 = h('button', p2, c2);
c1.push(vn2);
if (!context['onClickPrevented']) {
throw new Error('Missing handler \\\\'' + 'onClickPrevented' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 2] = extra.handlers['click' + 2] || function (e) {e.preventDefault();context['onClickPrevented'].call(owner, e);};
p2.on['click'] = extra.handlers['click' + 2];
c2.push({text: \`Button 1\`});
let c3 = [], p3 = {key:3,on:{}};
var vn3 = h('button', p3, c3);
c1.push(vn3);
if (!context['onClickStopped']) {
throw new Error('Missing handler \\\\'' + 'onClickStopped' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 3] = extra.handlers['click' + 3] || function (e) {e.stopPropagation();context['onClickStopped'].call(owner, e);};
p3.on['click'] = extra.handlers['click' + 3];
c3.push({text: \`Button 2\`});
let c4 = [], p4 = {key:4,on:{}};
var vn4 = h('button', p4, c4);
c1.push(vn4);
if (!context['onClickPreventedAndStopped']) {
throw new Error('Missing handler \\\\'' + 'onClickPreventedAndStopped' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 4] = extra.handlers['click' + 4] || function (e) {e.preventDefault();e.stopPropagation();context['onClickPreventedAndStopped'].call(owner, e);};
p4.on['click'] = extra.handlers['click' + 4];
c4.push({text: \`Button 3\`});
return vn1;
}"
`;
exports[`t-on t-on with self and prevent modifiers (order matters) 1`] = `
"function anonymous(context,extra
) {
let owner = context;
var h = this.utils.h;
let c1 = [], p1 = {key:1};
var vn1 = h('div', p1, c1);
let c2 = [], p2 = {key:2,on:{}};
var vn2 = h('button', p2, c2);
c1.push(vn2);
if (!context['onClick']) {
throw new Error('Missing handler \\\\'' + 'onClick' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 2] = extra.handlers['click' + 2] || function (e) {if (e.target !== this.elm) {return}e.preventDefault();context['onClick'].call(owner, e);};
p2.on['click'] = extra.handlers['click' + 2];
let c3 = [], p3 = {key:3};
var vn3 = h('span', p3, c3);
c2.push(vn3);
c3.push({text: \`Button\`});
return vn1;
}"
`;
exports[`t-on t-on with self modifier 1`] = `
"function anonymous(context,extra
) {
let owner = context;
var h = this.utils.h;
let c1 = [], p1 = {key:1};
var vn1 = h('div', p1, c1);
let c2 = [], p2 = {key:2,on:{}};
var vn2 = h('button', p2, c2);
c1.push(vn2);
if (!context['onClick']) {
throw new Error('Missing handler \\\\'' + 'onClick' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 2] = extra.handlers['click' + 2] || context['onClick'].bind(owner);
p2.on['click'] = extra.handlers['click' + 2];
let c3 = [], p3 = {key:3};
var vn3 = h('span', p3, c3);
c2.push(vn3);
c3.push({text: \`Button\`});
let c4 = [], p4 = {key:4,on:{}};
var vn4 = h('button', p4, c4);
c1.push(vn4);
if (!context['onClickSelf']) {
throw new Error('Missing handler \\\\'' + 'onClickSelf' + \`\\\\' when evaluating template 'test'\`)
}
extra.handlers['click' + 4] = extra.handlers['click' + 4] || function (e) {if (e.target !== this.elm) {return}context['onClickSelf'].call(owner, e);};
p4.on['click'] = extra.handlers['click' + 4];
let c5 = [], p5 = {key:5};
var vn5 = h('span', p5, c5);
c4.push(vn5);
c5.push({text: \`Button\`});
return vn1;
}"
`;
exports[`t-raw literal 1`] = `
"function anonymous(context,extra
) {