From 8cdb09a892078f6072b402ab23f1b2f2c1ef2d48 Mon Sep 17 00:00:00 2001
From: Austin Kelleher <austin.kell47@gmail.com>
Date: Tue, 13 Jun 2017 17:15:45 -0400
Subject: [PATCH] Fixes #655 - Implement renderToString in the browser.

---
 src/runtime/vdom/AsyncVDOMBuilder.js             | 12 +++++++++++-
 .../component.js                                 | 16 ++++++++++++++++
 .../components/hello/index.marko                 |  3 +++
 .../components/test-async/renderer.js            |  7 +++++++
 .../index.marko                                  |  3 +++
 .../test.js                                      | 16 ++++++++++++++++
 .../component-renderToString/component.js        |  9 +++++++++
 .../components/hello.marko                       |  3 +++
 .../component-renderToString/index.marko         |  3 +++
 .../component-renderToString/test.js             |  9 +++++++++
 10 files changed, 80 insertions(+), 1 deletion(-)
 create mode 100644 test/autotests/components-browser/component-renderToString-callback-sync/component.js
 create mode 100644 test/autotests/components-browser/component-renderToString-callback-sync/components/hello/index.marko
 create mode 100644 test/autotests/components-browser/component-renderToString-callback-sync/components/test-async/renderer.js
 create mode 100644 test/autotests/components-browser/component-renderToString-callback-sync/index.marko
 create mode 100644 test/autotests/components-browser/component-renderToString-callback-sync/test.js
 create mode 100644 test/autotests/components-browser/component-renderToString/component.js
 create mode 100644 test/autotests/components-browser/component-renderToString/components/hello.marko
 create mode 100644 test/autotests/components-browser/component-renderToString/index.marko
 create mode 100644 test/autotests/components-browser/component-renderToString/test.js

diff --git a/src/runtime/vdom/AsyncVDOMBuilder.js b/src/runtime/vdom/AsyncVDOMBuilder.js
index b89fbd5026..4a6d763492 100644
--- a/src/runtime/vdom/AsyncVDOMBuilder.js
+++ b/src/runtime/vdom/AsyncVDOMBuilder.js
@@ -311,7 +311,17 @@ var proto = AsyncVDOMBuilder.prototype = {
     },
 
     toString: function() {
-        return this.___getNode().outerHTML;
+        var docFragment = this.___getNode();
+        var html = '';
+
+        if (docFragment.hasChildNodes()) {
+            var children = docFragment.childNodes;
+            for (var i = 0; i < children.length; i++) {
+                html += children[i].outerHTML;
+            }
+        }
+
+        return html;
     },
 
     then: function(fn, fnErr) {
diff --git a/test/autotests/components-browser/component-renderToString-callback-sync/component.js b/test/autotests/components-browser/component-renderToString-callback-sync/component.js
new file mode 100644
index 0000000000..8bf5482fdf
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString-callback-sync/component.js
@@ -0,0 +1,16 @@
+var helloComponent = require('./components/hello');
+
+module.exports = {
+    onMount: function() {
+        var self = this;
+        helloComponent.renderToString({
+            name: this.input.name
+        }, function (error, html) {
+            if (error) {
+                self.emit('renderError', error);
+            } else {
+                self.emit('html', html);
+            }
+        });
+    }
+};
diff --git a/test/autotests/components-browser/component-renderToString-callback-sync/components/hello/index.marko b/test/autotests/components-browser/component-renderToString-callback-sync/components/hello/index.marko
new file mode 100644
index 0000000000..25c110b221
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString-callback-sync/components/hello/index.marko
@@ -0,0 +1,3 @@
+<div>
+    <test-async name=input.name/>
+</div>
diff --git a/test/autotests/components-browser/component-renderToString-callback-sync/components/test-async/renderer.js b/test/autotests/components-browser/component-renderToString-callback-sync/components/test-async/renderer.js
new file mode 100644
index 0000000000..5fcbeeeb18
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString-callback-sync/components/test-async/renderer.js
@@ -0,0 +1,7 @@
+module.exports = function(input, out) {
+    var asyncOut = out.beginAsync();
+    setTimeout(function() {
+        asyncOut.write('[async] ' + input.name);
+        asyncOut.end();
+    }, 10);
+};
diff --git a/test/autotests/components-browser/component-renderToString-callback-sync/index.marko b/test/autotests/components-browser/component-renderToString-callback-sync/index.marko
new file mode 100644
index 0000000000..4547c6587a
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString-callback-sync/index.marko
@@ -0,0 +1,3 @@
+<div>
+    <div name=input.name/>
+</div>
diff --git a/test/autotests/components-browser/component-renderToString-callback-sync/test.js b/test/autotests/components-browser/component-renderToString-callback-sync/test.js
new file mode 100644
index 0000000000..d30dd65555
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString-callback-sync/test.js
@@ -0,0 +1,16 @@
+var expect = require('chai').expect;
+
+module.exports = function(helpers, done) {
+    var component = helpers.mount(require('./index'), {
+        name: 'john'
+    });
+
+    component.on('html', function(renderedHtml) {
+        expect(renderedHtml).to.equal('<div>[async] john</div>');
+        done();
+    });
+
+    component.on('error', function (error) {
+        done(error);
+    });
+};
diff --git a/test/autotests/components-browser/component-renderToString/component.js b/test/autotests/components-browser/component-renderToString/component.js
new file mode 100644
index 0000000000..4f8d613fe0
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString/component.js
@@ -0,0 +1,9 @@
+var helloComponent = require('./components/hello');
+
+module.exports = {
+    onMount: function() {
+        this.renderedHtml = helloComponent.renderToString({
+            name: this.input.name
+        });
+    }
+};
diff --git a/test/autotests/components-browser/component-renderToString/components/hello.marko b/test/autotests/components-browser/component-renderToString/components/hello.marko
new file mode 100644
index 0000000000..c45b9351d2
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString/components/hello.marko
@@ -0,0 +1,3 @@
+<div class="hello">
+    <div>${input.name}</div>
+</div>
diff --git a/test/autotests/components-browser/component-renderToString/index.marko b/test/autotests/components-browser/component-renderToString/index.marko
new file mode 100644
index 0000000000..0d514ca471
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString/index.marko
@@ -0,0 +1,3 @@
+<div>
+    <hello name=input.name/>
+</div>
diff --git a/test/autotests/components-browser/component-renderToString/test.js b/test/autotests/components-browser/component-renderToString/test.js
new file mode 100644
index 0000000000..b84ab17d31
--- /dev/null
+++ b/test/autotests/components-browser/component-renderToString/test.js
@@ -0,0 +1,9 @@
+var expect = require('chai').expect;
+
+module.exports = function(helpers) {
+    var component = helpers.mount(require('./index'), {
+        name: 'john'
+    });
+
+    expect(component.renderedHtml).to.equal('<div class="hello"><div>john</div></div>');
+};