diff --git a/app/assets/javascripts/react_on_rails.js b/app/assets/javascripts/react_on_rails.js index 62e4677ac..36652113f 100644 --- a/app/assets/javascripts/react_on_rails.js +++ b/app/assets/javascripts/react_on_rails.js @@ -4,19 +4,16 @@ ReactOnRails.clientRenderReactComponent = function(options) { var componentName = options.componentName; var domId = options.domId; - var propsVarName = options.propsVarName; var props = options.props; var trace = options.trace; var generatorFunction = options.generatorFunction; var expectTurboLinks = options.expectTurboLinks; - this[propsVarName] = props; - var renderIfDomNodePresent = function() { try { var domNode = document.getElementById(domId); if (domNode) { - var reactElement = createReactElement(componentName, propsVarName, props, + var reactElement = createReactElement(componentName, props, domId, trace, generatorFunction); provideClientReact().render(reactElement, domNode); } @@ -60,7 +57,6 @@ ReactOnRails.serverRenderReactComponent = function(options) { var componentName = options.componentName; var domId = options.domId; - var propsVarName = options.propsVarName; var props = options.props; var trace = options.trace; var generatorFunction = options.generatorFunction; @@ -69,8 +65,7 @@ var consoleReplay = ''; try { - var reactElement = createReactElement(componentName, propsVarName, props, - domId, trace, generatorFunction); + var reactElement = createReactElement(componentName, props, domId, trace, generatorFunction); htmlResult = provideServerReact().renderToString(reactElement); } catch (e) { @@ -156,10 +151,9 @@ return consoleReplay; }; - function createReactElement(componentName, propsVarName, props, domId, trace, generatorFunction) { + function createReactElement(componentName, props, domId, trace, generatorFunction) { if (trace) { - console.log('RENDERED ' + componentName + ' with data_variable ' + - propsVarName + ' to dom node with id: ' + domId); + console.log('RENDERED ' + componentName + ' to dom node with id: ' + domId); } if (generatorFunction) { diff --git a/app/helpers/react_on_rails_helper.rb b/app/helpers/react_on_rails_helper.rb index 70a057547..56fada18f 100644 --- a/app/helpers/react_on_rails_helper.rb +++ b/app/helpers/react_on_rails_helper.rb @@ -50,18 +50,16 @@ def react_component(component_name, props = {}, options = {}) # Setup the page_loaded_js, which is the same regardless of prerendering or not! # The reason is that React is smart about not doing extra work if the server rendering did its job. - data_variable_name = "__#{component_name.camelize(:lower)}Data#{react_component_index}__" turbolinks_loaded = Object.const_defined?(:Turbolinks) # NOTE: props might include closing script tag that might cause XSS props_string = sanitized_props_string(props) page_loaded_js = <<-JS (function() { - window.#{data_variable_name} = #{props_string}; + var props = #{props_string}; ReactOnRails.clientRenderReactComponent({ componentName: '#{react_component_name}', domId: '#{dom_id}', - propsVarName: '#{data_variable_name}', - props: window.#{data_variable_name}, + props: props, trace: #{trace(options)}, generatorFunction: #{generator_function(options)}, expectTurboLinks: #{turbolinks_loaded} @@ -73,8 +71,7 @@ def react_component(component_name, props = {}, options = {}) # Create the HTML rendering part server_rendered_html, console_script = - server_rendered_react_component_html(options, props_string, react_component_name, - data_variable_name, dom_id) + server_rendered_react_component_html(options, props_string, react_component_name, dom_id) content_tag_options = options.except(:generator_function, :prerender, :trace, :replay_console, :id, :react_component_name, @@ -136,7 +133,7 @@ def next_react_component_index # Returns Array [0]: html, [1]: script to console log # NOTE, these are NOT html_safe! - def server_rendered_react_component_html(options, props_string, react_component_name, data_variable_name, dom_id) + def server_rendered_react_component_html(options, props_string, react_component_name, dom_id) return ["", ""] unless prerender(options) # Make sure that we use up-to-date server-bundle @@ -148,7 +145,6 @@ def server_rendered_react_component_html(options, props_string, react_component_ return ReactOnRails.serverRenderReactComponent({ componentName: '#{react_component_name}', domId: '#{dom_id}', - propsVarName: '#{data_variable_name}', props: props, trace: #{trace(options)}, generatorFunction: #{generator_function(options)} diff --git a/spec/dummy/spec/requests/console_logging_spec.rb b/spec/dummy/spec/requests/console_logging_spec.rb index c3080c86b..79b14bb4b 100644 --- a/spec/dummy/spec/requests/console_logging_spec.rb +++ b/spec/dummy/spec/requests/console_logging_spec.rb @@ -6,8 +6,8 @@ html_nodes = Nokogiri::HTML(response.body) expected = <<-JS -console.log.apply(console, ["[SERVER] RENDERED HelloWorldWithLogAndThrow with data_variable \ -__helloWorldWithLogAndThrowData0__ to dom node with id: HelloWorldWithLogAndThrow-react-component-0"]); +console.log.apply(console, ["[SERVER] RENDERED HelloWorldWithLogAndThrow to dom node with id: \ +HelloWorldWithLogAndThrow-react-component-0"]); console.log.apply(console, ["[SERVER] console.log in HelloWorld"]); console.warn.apply(console, ["[SERVER] console.warn in HelloWorld"]); console.error.apply(console, ["[SERVER] console.error in HelloWorld"]);