fix: issue with using __flush_here_and_after__ when in sync mode (#1804)

Author: DylanPiercey

.changeset/spicy-actors-suffer.md

@@ -0,0 +1,5 @@
+---
+"marko": patch
+---
+
+Fix issue when internal <**flush_here_and_after**> tag (used by bundler plugins) is used in sync mode.

packages/marko/src/core-tags/core/__flush_here_and_after__.js

@@ -1,32 +1,44 @@
 const BufferedWriter = require("../../runtime/html/BufferedWriter");
 
 module.exports = function __flushHereAndAfter__(input, out) {
-  let flushed = false;
-  const asyncOut = out.beginAsync({ last: true });
-  const nextWriter = out.writer;
+  if (out.isSync()) {
+    // We create an async out that we pinky promise is going to be sync in order to postpone execution of the renderBody.
+    out._sync = false;
+    const asyncOut = out.beginAsync({ last: true });
+    out._sync = true;
+    asyncOut.sync();
+    out.onLast(() => {
+      input.renderBody(asyncOut);
+      asyncOut.end();
+    });
+  } else {
+    let flushed = false;
+    const asyncOut = out.beginAsync({ last: true });
+    const nextWriter = out.writer;
+
+    out.on("___toString", writer => {
+      if (writer instanceof BufferedWriter) {
+        if (flushed) {
+          const detachedOut = out.createOut();
+          detachedOut.sync();
+          input.renderBody(detachedOut);
+          writer._content = detachedOut.toString() + writer._content;
+        } else if (writer.next === nextWriter) {
+          asyncOut.sync();
+          input.renderBody(asyncOut);
+          asyncOut.end();
+          flushed = true;
+        }
+      }
+    });
 
-  out.on("___toString", writer => {
-    if (writer instanceof BufferedWriter) {
-      if (flushed) {
-        const detachedOut = out.createOut();
-        detachedOut.sync();
-        input.renderBody(detachedOut);
-        writer._content = detachedOut.toString() + writer._content;
-      } else if (writer.next === nextWriter) {
+    out.onLast(() => {
+      if (!flushed) {
         asyncOut.sync();
         input.renderBody(asyncOut);
         asyncOut.end();
         flushed = true;
       }
-    }
-  });
-
-  out.onLast(() => {
-    if (!flushed) {
-      asyncOut.sync();
-      input.renderBody(asyncOut);
-      asyncOut.end();
-      flushed = true;
-    }
-  });
+    });
+  }
 };

packages/marko/test/render/fixtures/flush-here-and-after-sync/test.js

@@ -1,3 +1,3 @@
 exports.templateData = {};
-
+exports.sync = true;
 exports["fails_html ≅ vdom"] = true;

packages/marko/test/render/index.test.js

@@ -126,6 +126,10 @@ async function runRenderTest(fixture) {
         isVDOM
       );
 
+      if (main.sync) {
+        out.sync();
+      }
+
       await template.render(templateData, out).end();
 
       if (isVDOM) {