Skip to content

Commit ba5ede5

Browse files
committed
Allows actions to use any expression type
Allow any expression to pass data to an action. Added a test for a ternary statement and a string template. Fixes #1676
1 parent f38bdaa commit ba5ede5

File tree

3 files changed

+44
-2
lines changed

3 files changed

+44
-2
lines changed

src/parse/read/directives.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ const DIRECTIVES: Record<string, {
7777
attribute(start, end, type, name, expression) {
7878
return { start, end, type, name, expression };
7979
},
80-
allowedExpressionTypes: ['Identifier', 'MemberExpression', 'ObjectExpression', 'Literal', 'CallExpression'],
80+
allowedExpressionTypes: ['*'],
8181
error: 'Data passed to actions must be an identifier (e.g. `foo`), a member expression ' +
8282
'(e.g. `foo.bar` or `foo[baz]`), a method call (e.g. `foo()`), or a literal (e.g. `true` or `\'a string\'`'
8383
},
@@ -163,7 +163,8 @@ export function readDirective(
163163

164164
try {
165165
expression = readExpression(parser, expressionStart, quoteMark);
166-
if (directive.allowedExpressionTypes.indexOf(expression.type) === -1) {
166+
const allowed = directive.allowedExpressionTypes;
167+
if (allowed[0] !== '*' && allowed.indexOf(expression.type) === -1) {
167168
parser.error({
168169
code: `invalid-directive-value`,
169170
message: directive.error
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
export default {
2+
data: {
3+
target: 'World!',
4+
display: true,
5+
},
6+
7+
html: `
8+
<h1></h1>
9+
`,
10+
11+
test ( assert, component, target, window ) {
12+
const header = target.querySelector( 'h1' );
13+
const eventClick = new window.MouseEvent( 'click' );
14+
15+
header.dispatchEvent( eventClick );
16+
assert.htmlEqual( target.innerHTML, `
17+
<h1>Hello World!</h1>
18+
` );
19+
}
20+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<h1 use:insert="display ? `Hello ${target}` : ''"></h1>
2+
3+
<script>
4+
export default {
5+
actions: {
6+
insert(node, text) {
7+
8+
function onClick() {
9+
node.textContent = text;
10+
}
11+
node.addEventListener('click', onClick);
12+
13+
return {
14+
destroy() {
15+
node.removeEventListener('click', onClick);
16+
}
17+
}
18+
}
19+
}
20+
}
21+
</script>

0 commit comments

Comments
 (0)