fix: compat issues

marko-js · Sep 20, 2024 · 81c5c0e · 81c5c0e
1 parent 8ae0ef9
commit 81c5c0e
Show file tree

Hide file tree

Showing 6 changed files with 65 additions and 41 deletions.
diff --git a/.changeset/curly-brooms-eat.md b/.changeset/curly-brooms-eat.md
@@ -0,0 +1,8 @@
+---
+"@marko/babel-utils": patch
+"@marko/compiler": patch
+"marko": patch
+"@marko/translator-default": patch
+---
+
+Fix issues related to recent babel changes.
diff --git a/.changeset/wet-jars-count.md b/.changeset/wet-jars-count.md
@@ -0,0 +1,11 @@
+---
+"@marko/babel-utils": patch
+"@marko/compiler": patch
+"marko": patch
+"@marko/runtime-tags": patch
+"@marko/translator-default": patch
+"@marko/translator-interop-class-tags": patch
+"@marko/translator-tags": patch
+---
+
+Improve support for @marko/compat.
diff --git a/packages/babel-utils/src/loc.js b/packages/babel-utils/src/loc.js
@@ -27,9 +27,10 @@ export function withLoc(file, node, start, end) {
 }
 
 export function getStart(file, node) {
-  if (node.start != null) {
-    return node.start;
-  }
+  // Restore if merged: https://github.com/babel/babel/pull/16849
+  // if (node.start != null) {
+  //   return node.start;
+  // }
 
   if (node.loc) {
     return locToIndex(file, node.loc.start);
@@ -39,9 +40,10 @@ export function getStart(file, node) {
 }
 
 export function getEnd(file, node) {
-  if (node.end != null) {
-    return node.end;
-  }
+  // Restore if merged: https://github.com/babel/babel/pull/16849
+  // if (node.end != null) {
+  //   return node.end;
+  // }
 
   if (node.loc) {
     return locToIndex(file, node.loc.end);

diff --git a/packages/compiler/src/babel-types/generator/patch.js b/packages/compiler/src/babel-types/generator/patch.js
@@ -39,7 +39,7 @@ Object.assign(Printer.prototype, {
     }
 
     this.token(node.escape ? "${" : "$!{");
-    this.print(node.value, node);
+    this.print(node.value);
     this.token("}");
   },
   MarkoScriptlet(node, parent) {
@@ -56,20 +56,20 @@ Object.assign(Printer.prototype, {
       !statementCouldHaveUnenclosedNewline(node.body[0])
     ) {
       // TODO should determine if node has unenclosed newlines.
-      this.print(node.body[0], node);
+      this.print(node.body[0]);
     } else {
       this.token("{");
       this.newline();
       this.indent();
-      this.printSequence(node.body, node);
+      this.printSequence(node.body);
       this.dedent();
       this.token("}");
     }
   },
   MarkoClass(node) {
     this.token("class");
     this.token(" ");
-    this.print(node.body, node);
+    this.print(node.body);
   },
   MarkoAttribute(node) {
     const value = node.value;
@@ -84,7 +84,7 @@ Object.assign(Printer.prototype, {
 
       if (node.arguments && node.arguments.length) {
         this.token("(");
-        this.printList(node.arguments, node);
+        this.printList(node.arguments);
         this.token(")");
       }
     }
@@ -95,18 +95,18 @@ Object.assign(Printer.prototype, {
         !(value.id || value.async || value.generator)
       ) {
         this.token("(");
-        this.printList(value.params, value);
+        this.printList(value.params);
         this.token(") ");
-        this.print(value.body, value);
+        this.print(value.body);
       } else {
         this.token(node.bound ? ":=" : "=");
-        printWithParansIfNeeded.call(this, value, node);
+        printWithParansIfNeeded.call(this, value);
       }
     }
   },
   MarkoSpreadAttribute(node) {
     this.token("...");
-    printWithParansIfNeeded.call(this, node.value, node);
+    printWithParansIfNeeded.call(this, node.value);
   },
   MarkoText(node, parent) {
     const parentBody = parent.body;
@@ -136,7 +136,7 @@ Object.assign(Printer.prototype, {
     }
   },
   MarkoTagBody(node) {
-    this.printSequence(node.body, node, { indent: true });
+    this.printSequence(node.body, { indent: true });
   },
   MarkoTag(node) {
     const isDynamicTag = !t.isStringLiteral(node.name);
@@ -158,30 +158,30 @@ Object.assign(Printer.prototype, {
     } else {
       if (isDynamicTag) {
         this.token("${");
-        this.print(node.name, node);
+        this.print(node.name);
         this.token("}");
       } else {
         this.token(tagName);
       }
 
       if (node.typeArguments) {
         this.token("<");
-        this.printList(node.typeArguments.params, node);
+        this.printList(node.typeArguments.params);
         this.token(">");
       }
 
       if (node.var) {
         this.token("/");
-        this.print(node.var, node);
+        this.print(node.var);
 
         if (node.var.typeAnnotation) {
-          this.print(node.var.typeAnnotation, node.var);
+          this.print(node.var.typeAnnotation);
         }
       }
 
       if (node.arguments && node.arguments.length) {
         this.token("(");
-        this.printList(node.arguments, node);
+        this.printList(node.arguments);
         this.token(")");
       }
 
@@ -191,11 +191,11 @@ Object.assign(Printer.prototype, {
             this.token(" ");
           }
           this.token("<");
-          this.printList(node.body.typeParameters.params, node);
+          this.printList(node.body.typeParameters.params);
           this.token(">");
         }
         this.token("|");
-        this.printList(node.body.params, node);
+        this.printList(node.body.params);
         this.token("|");
       }
 
@@ -206,7 +206,7 @@ Object.assign(Printer.prototype, {
           this.token(" ");
         }
 
-        this.printJoin(node.attributes, node, { separator: spaceSeparator });
+        this.printJoin(node.attributes, { separator: spaceSeparator });
       }
     }
 
@@ -220,7 +220,7 @@ Object.assign(Printer.prototype, {
     } else {
       this.token(">");
       this.newline();
-      this.print(node.body, node);
+      this.print(node.body);
       this.token("</");
       if (!isDynamicTag) {
         this.token(tagName);
@@ -234,14 +234,14 @@ function spaceSeparator() {
   this.token(" ");
 }
 
-function printWithParansIfNeeded(value, parent) {
+function printWithParansIfNeeded(value) {
   const needsParans = expressionCouldHaveUnenclosedWhitespace(value);
 
   if (needsParans) {
     this.token("(");
   }
 
-  this.print(value, parent);
+  this.print(value);
 
   if (needsParans) {
     this.token(")");

diff --git a/packages/marko/src/node_modules/@internal/components-entry/index.js b/packages/marko/src/node_modules/@internal/components-entry/index.js
@@ -139,7 +139,8 @@ function addComponentsFromContext(componentsContext, componentsToHydrate) {
 
     if (typeof renderBody === "function" && renderBody.toJSON === w10ToJSON) {
       flags |= FLAG_HAS_RENDER_BODY;
-      renderBody = input.renderBody = undefined;
+      renderBody = undefined;
+      if (input) input.renderBody = undefined;
     }
 
     var extra = {

diff --git a/packages/translator-default/src/index.js b/packages/translator-default/src/index.js
@@ -61,18 +61,20 @@ export const analyze = {
         meta.deps.unshift(styleFile);
       }
 
-      if (meta.hasComponentBrowser) {
-        meta.component = componentBrowserFile;
-      } else if (
-        meta.hasComponent ||
-        meta.hasStatefulTagParams ||
-        meta.hasFunctionEventHandlers
-      ) {
-        meta.component = file.opts.filename;
-      } else if (meta.hasStringEventHandlers) {
-        meta.component = componentFiles.componentBrowserFile =
-          "marko/src/runtime/helpers/empty-component.js";
-        meta.hasComponentBrowser = true;
+      if (!meta.widgetBind) {
+        if (meta.hasComponentBrowser) {
+          meta.component = componentBrowserFile;
+        } else if (
+          meta.hasComponent ||
+          meta.hasStatefulTagParams ||
+          meta.hasFunctionEventHandlers
+        ) {
+          meta.component = file.opts.filename;
+        } else if (meta.hasStringEventHandlers) {
+          meta.component = componentFiles.componentBrowserFile =
+            "marko/src/runtime/helpers/empty-component.js";
+          meta.hasComponentBrowser = true;
+        }
       }
 
       meta.component =
@@ -123,7 +125,7 @@ export const analyze = {
       }
     }
 
-    if (!meta.hasFunctionEventHandlers || !meta.hasStringEventHandlers) {
+    if (!(meta.hasFunctionEventHandlers || meta.hasStringEventHandlers)) {
       for (const attr of tag.node.attributes) {
         if (
           t.isMarkoAttribute(attr) &&