From e199d3f4ab16f77e0e45e0bc661b73d6b8654a9d Mon Sep 17 00:00:00 2001
From: Robert Mosolgo <rdmosolgo@gmail.com>
Date: Wed, 12 Apr 2017 10:59:05 -0400
Subject: [PATCH] fix(ComponentMount) move the console replay tag outside the
 rails mount container if it's present

---
 lib/react/rails/component_mount.rb                     | 10 +++++++++-
 lib/react/server_rendering.rb                          |  2 ++
 .../server_rendering/bundle_renderer/console_replay.js |  2 +-
 test/dummy/app/javascript/components/TodoList.js       |  1 +
 test/dummy/config/application.rb                       |  4 ++++
 test/react/server_rendering/bundle_renderer_test.rb    |  2 +-
 6 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/lib/react/rails/component_mount.rb b/lib/react/rails/component_mount.rb
index 9d5faddb3..c09336473 100644
--- a/lib/react/rails/component_mount.rb
+++ b/lib/react/rails/component_mount.rb
@@ -46,7 +46,15 @@ def react_component(name, props = {}, options = {}, &block)
         # remove internally used properties so they aren't rendered to DOM
         html_options.except!(:tag, :prerender, :camelize_props)
 
-        content_tag(html_tag, '', html_options, &block)
+        rendered_tag = content_tag(html_tag, '', html_options, &block)
+        if React::ServerRendering.renderer_options[:replay_console]
+          # Grab the server-rendered console replay script
+          # and move it _outside_ the container div
+          rendered_tag.sub!(/\n(<script class="react-rails-console-replay">.*<\/script>)<\/(\w+)>$/m,'</\2>\1')
+          rendered_tag.html_safe
+        else
+          rendered_tag
+        end
       end
 
       private
diff --git a/lib/react/server_rendering.rb b/lib/react/server_rendering.rb
index 21270c162..9e0118b1b 100644
--- a/lib/react/server_rendering.rb
+++ b/lib/react/server_rendering.rb
@@ -7,6 +7,8 @@ module ServerRendering
     mattr_accessor :renderer, :renderer_options,
       :pool_size, :pool_timeout
 
+    self.renderer_options = {}
+
     # Discard the old ConnectionPool & create a new one
     def self.reset_pool
       options = {size: pool_size, timeout: pool_timeout}
diff --git a/lib/react/server_rendering/bundle_renderer/console_replay.js b/lib/react/server_rendering/bundle_renderer/console_replay.js
index e54055806..dde5386c0 100644
--- a/lib/react/server_rendering/bundle_renderer/console_replay.js
+++ b/lib/react/server_rendering/bundle_renderer/console_replay.js
@@ -1,6 +1,6 @@
 (function (history) {
   if (history && history.length > 0) {
-    result += '\n<scr'+'ipt>';
+    result += '\n<scr'+'ipt class="react-rails-console-replay">';
     history.forEach(function (msg) {
       result += '\nconsole.' + msg.level + '.apply(console, ' + JSON.stringify(msg.arguments) + ');';
     });
diff --git a/test/dummy/app/javascript/components/TodoList.js b/test/dummy/app/javascript/components/TodoList.js
index 1a7512604..e9ea6bad8 100644
--- a/test/dummy/app/javascript/components/TodoList.js
+++ b/test/dummy/app/javascript/components/TodoList.js
@@ -8,6 +8,7 @@ module.exports = React.createClass({
     this.setState({mounted: 'yep'});
   },
   render: function() {
+    console.log("Test Console Replay")
     return (
       <ul>
         <li id='status'>{this.state.mounted}</li>
diff --git a/test/dummy/config/application.rb b/test/dummy/config/application.rb
index 2c814824c..24136dc8e 100644
--- a/test/dummy/config/application.rb
+++ b/test/dummy/config/application.rb
@@ -32,6 +32,10 @@ class Application < Rails::Application
     # config.i18n.default_locale = :de
     config.react.variant = :production
     config.react.addons = false
+    config.react.server_renderer_options = {
+      replay_console: true,
+    }
+
     if SprocketsHelpers.available?
       config.assets.enabled = true
     end
diff --git a/test/react/server_rendering/bundle_renderer_test.rb b/test/react/server_rendering/bundle_renderer_test.rb
index f01ad29eb..72e678a62 100644
--- a/test/react/server_rendering/bundle_renderer_test.rb
+++ b/test/react/server_rendering/bundle_renderer_test.rb
@@ -49,7 +49,7 @@ class BundleRendererTest < ActiveSupport::TestCase
 
     test '#render replays console messages' do
       result = @renderer.render("TodoListWithConsoleLog", {todos: ["log some messages"]}, nil)
-      assert_match(/<script>$/, result)
+      assert_match(/<script class="react-rails-console-replay">$/, result)
       assert_match(/console.log.apply\(console, \["got initial state"\]\);$/, result)
       assert_match(/console.warn.apply\(console, \["mounted component"\]\);$/, result)
       assert_match(/console.error.apply\(console, \["rendered!","foo"\]\);$/, result)