diff --git a/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js b/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js index 26153bd52..dcb8a89e5 100644 --- a/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js +++ b/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js @@ -612,7 +612,11 @@ function transformAttributes(path, results) { ) ) ); - } else if (isConstant || t.isFunction(value.expression)) { + } else if ( + isConstant || + t.isFunction(value.expression) || + t.isArrayExpression(value.expression) + ) { results.exprs.unshift( t.expressionStatement( t.callExpression( diff --git a/packages/babel-plugin-jsx-dom-expressions/src/shared/component.js b/packages/babel-plugin-jsx-dom-expressions/src/shared/component.js index 3762b868b..71bba95c1 100644 --- a/packages/babel-plugin-jsx-dom-expressions/src/shared/component.js +++ b/packages/babel-plugin-jsx-dom-expressions/src/shared/component.js @@ -108,7 +108,11 @@ export default function transformComponent(path) { ]) ) ); - } else if (isConstant || t.isFunction(value.expression)) { + } else if ( + isConstant || + t.isFunction(value.expression) || + t.isArrayExpression(value.expression) + ) { runningObject.push(t.objectProperty(t.identifier("ref"), value.expression)); } else if (t.isCallExpression(value.expression)) { const refIdentifier = path.scope.generateUidIdentifier("_ref$"); diff --git a/packages/babel-plugin-jsx-dom-expressions/src/universal/element.js b/packages/babel-plugin-jsx-dom-expressions/src/universal/element.js index cff5d84ec..7c0bf8a95 100644 --- a/packages/babel-plugin-jsx-dom-expressions/src/universal/element.js +++ b/packages/babel-plugin-jsx-dom-expressions/src/universal/element.js @@ -123,7 +123,11 @@ function transformAttributes(path, results) { ) ) ); - } else if (isConstant || t.isFunction(value.expression)) { + } else if ( + isConstant || + t.isFunction(value.expression) || + t.isArrayExpression(value.expression) + ) { results.exprs.unshift( t.expressionStatement( t.callExpression( diff --git a/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/code.js b/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/code.js index 7425e869b..867054dd0 100644 --- a/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/code.js +++ b/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/code.js @@ -325,3 +325,9 @@ const template88 = ( {count()} ); + +const template89 = ( + +); diff --git a/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/output.js b/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/output.js index 6702b7f97..357f341c2 100644 --- a/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/output.js +++ b/packages/babel-plugin-jsx-dom-expressions/test/__dom_compatible_fixtures__/attributeExpressions/output.js @@ -820,4 +820,10 @@ const template88 = (() => { }); return _el$107; })(); +const template89 = (() => { + var _el$108 = _tmpl$46(); + _$use([props.ref, myref], _el$108); + _$insert(_el$108, count); + return _el$108; +})(); _$delegateEvents(["click", "input"]); diff --git a/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/code.js b/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/code.js index f9486555e..43c95e529 100644 --- a/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/code.js +++ b/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/code.js @@ -124,4 +124,5 @@ const template26 =
const template27 = const template28 = -const template29 = \ No newline at end of file +const template29 = +const template30 = \ No newline at end of file diff --git a/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/output.js b/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/output.js index 0774fed24..1c3f67fc4 100644 --- a/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/output.js +++ b/packages/babel-plugin-jsx-dom-expressions/test/__universal_fixtures__/attributeExpressions/output.js @@ -308,3 +308,8 @@ const template29 = (() => { typeof _ref$10 === "function" ? _$use(_ref$10, _el$38) : (refUnknown = _el$38); return _el$38; })(); +const template30 = (() => { + var _el$39 = _$createElement("div"); + _$use([refFn, refUnknown], _el$39); + return _el$39; +})(); diff --git a/packages/dom-expressions/src/client.js b/packages/dom-expressions/src/client.js index 96b2826e3..61331d3c2 100644 --- a/packages/dom-expressions/src/client.js +++ b/packages/dom-expressions/src/client.js @@ -222,7 +222,9 @@ export function dynamicProperty(props, key) { } export function use(fn, element, arg) { - untrack(() => fn(element, arg)); + untrack(() => + Array.isArray(fn) ? fn.flat(Infinity).forEach(fn => fn && fn(element, arg)) : fn(element, arg) + ); } export function insert(parent, accessor, marker, initial) { diff --git a/packages/dom-expressions/src/universal.js b/packages/dom-expressions/src/universal.js index 18d7928db..764c3828d 100644 --- a/packages/dom-expressions/src/universal.js +++ b/packages/dom-expressions/src/universal.js @@ -243,7 +243,11 @@ export function createRenderer({ memo, createComponent, use(fn, element, arg) { - return untrack(() => fn(element, arg)); + return untrack(() => + Array.isArray(fn) + ? fn.flat(Infinity).forEach(fn => fn && fn(element, arg)) + : fn(element, arg) + ); } }; }