[main] avoid getters when possible, and apply getters recursively

packages/babel-plugin-jsx-dom-expressions/src/shared/component.js

@@ -7,7 +7,8 @@ import {
   filterChildren,
   trimWhitespace,
   transformCondition,
-  convertJSXIdentifier
+  convertJSXIdentifier,
+  hasStaticMarker
 } from "./utils";
 import { transformNode, getCreateTemplate } from "./transform";
 
@@ -172,13 +173,7 @@ export default function transformComponent(path) {
               runningObject.push(t.objectMethod("get", id, [], body, !t.isValidIdentifier(key)));
             } else {
               runningObject.push(
-                t.objectMethod(
-                  "get",
-                  id,
-                  [],
-                  t.blockStatement([t.returnStatement(value.expression)]),
-                  !t.isValidIdentifier(key)
-                )
+                transformObjectGetter(id, !t.isValidIdentifier(key), value.expression, path)
               );
             }
           } else runningObject.push(t.objectProperty(id, value.expression));
@@ -279,3 +274,62 @@ function transformComponentChildren(children, config) {
   }
   return [transformedChildren, dynamic];
 }
+
+function transformObjectGetter(key, isComputed, value, path) {
+  if (t.isObjectExpression(value)) {
+    // is object recurse
+
+    if (
+      !hasStaticMarker(value, path) &&
+      value.properties.some(
+        prop =>
+          (t.isSpreadElement(prop) || (prop.computed && t.isMemberExpression(prop.key))) &&
+          !hasStaticMarker(prop, path) &&
+          !hasStaticMarker(prop.value, path)
+      )
+    ) {
+      return t.objectMethod(
+        "get",
+        key,
+        [],
+        t.blockStatement([t.returnStatement(transformObjectGetterRecurse(value, path))]),
+        isComputed
+      );
+    }
+
+    return t.objectProperty(key, transformObjectGetterRecurse(value, path), isComputed);
+  }
+
+  // is not object, do not recurse
+
+  if (hasStaticMarker(value, path)) {
+    return t.objectProperty(key, value, isComputed);
+  }
+
+  return t.objectMethod("get", key, [], t.blockStatement([t.returnStatement(value)]), isComputed);
+}
+
+function transformObjectGetterRecurse(object, path) {
+  const properties = object.properties.map(prop => {
+    const key = prop.key;
+    const value = prop.value;
+
+    if (!t.isObjectProperty(prop)) {
+      return prop;
+    }
+
+    if (
+      t.isStringLiteral(value) ||
+      t.isNumericLiteral(value) ||
+      t.isBooleanLiteral(value) ||
+      t.isNullLiteral(value) ||
+      t.isIdentifier(value)
+    ) {
+      return prop;
+    }
+
+    return transformObjectGetter(key, !t.isValidIdentifier(key.name), value, path);
+  });
+
+  return t.objectExpression(properties);
+}

packages/babel-plugin-jsx-dom-expressions/src/shared/utils.js

@@ -77,6 +77,17 @@ export function isComponent(tagName) {
   );
 }
 
+export function hasStaticMarker(object, path) {
+  if (!object) return false;
+  if (
+    object.leadingComments &&
+    object.leadingComments[0] &&
+    object.leadingComments[0].value.trim() === getConfig(path).staticMarker
+  )
+    return true;
+  if (object.expression) return hasStaticMarker(object.expression, path);
+}
+
 export function isDynamic(path, { checkMember, checkTags, checkCallExpressions = true, native }) {
   const config = getConfig(path);
   if (config.generate === "ssr" && native) {

packages/babel-plugin-jsx-dom-expressions/test/__dom_fixtures__/attributeExpressions/code.js

@@ -264,3 +264,130 @@ const template80 = <div attr:true={true} attr:false={false}/>
 const template81 = <math display="block"><mrow></mrow></math>
 const template82 = <mrow><mi>x</mi><mo>=</mo></mrow>
 
+const template84 = <Comp inputProps={
+    {
+        quack,
+        title: title(),
+        name: name(),
+        quack:"best cat",
+        store:store.access,
+        static_: {
+          store:store.access,
+          quack: "best cat",
+          team:uy(),
+          store
+        },
+        spread: {
+          ...store
+        }
+    }
+} />
+
+const template85 = <Comp inputProps={
+    {
+        quack,
+        title: title(),
+        name: name(),
+        quack:"best cat",
+        store:store.access,
+        static_: {
+          store:store.access,
+          quack: "best cat",
+          team:uy(),
+          store
+        },
+        ...store
+    }
+} />
+
+
+
+const template86 = <Comp inputProps={
+    {
+        [quack]:'meaw',
+        title: title(),
+        name: name(),
+        quack:"best cat",
+        store:store.access,
+        static_: {
+          store:store.access,
+          quack: "best cat",
+          team:uy(),
+          store
+        },
+        ...store
+    }
+} />
+
+const template87 = <Comp inputProps={
+    {
+        [quack]:'meaw',
+        [store.key]: 'ha'
+    }
+} />
+const template87a1 = <Comp inputProps={
+    {
+        [quack]:'meaw',
+        [store]: 'ha'
+    }
+} />
+const template87a2 = <Comp inputProps={
+    {
+        [quack.key]:'meaw',
+        [store.key]: 'ha'
+    }
+} />
+
+const template88 = <Comp inputProps={
+   {
+       [quack]: /* @once */'meaw',
+        title: title(),
+        name:  /* @once */name(),
+        quack:"best cat",
+        store:store.access,
+        static_:  /* @once */ {
+            store:/* @once */store.access,
+            quack: "best cat",
+            team: /* @once */uy(),
+            /* @once */ store
+        },
+        /* @once */ ...store
+    }
+} />
+
+const template89 = <Comp inputProps={
+   {
+       [quack]: /* @once */'meaw',
+        title: title(),
+        name:  /* @once */name(),
+        quack:"best cat",
+        store:store.access,
+        static_:  /* @once */ {
+            store:/* @once */store.access,
+            quack: "best cat",
+            team: /* @once */uy(),
+            /* @once */ store
+        },
+        /* @once */ ...store,
+       ...store
+    }
+} />
+
+const template90 = <Comp inputProps={
+   {
+       [quack]: /* @once */'meaw',
+        title: title(),
+        name:  /* @once */name(),
+        quack:"best cat",
+        store:store.access,
+        static_:  /* @once */ {
+            store:/* @once */store.access,
+            quack: "best cat",
+            team: /* @once */uy(),
+            /* @once */ store,
+            ...store,
+        },
+        /* @once */ ...store,
+       ...store
+    }
+} />