react_on_rails 12.0.1 → 13.0.0

data/lib/react_on_rails/git_utils.rb

@@ -10,10 +10,10 @@ module ReactOnRails
       status = `git status --porcelain`
       return false if $CHILD_STATUS.success? && status.empty?
 
-      error = if !$CHILD_STATUS.success?
-                "You do not have Git installed. Please install Git, and commit your changes before continuing"
-              else
+      error = if $CHILD_STATUS.success?
                 "You have uncommitted code. Please commit or stash your changes before continuing"
+              else
+                "You do not have Git installed. Please install Git, and commit your changes before continuing"
               end
       message_handler.add_error(error)
       true

data/lib/react_on_rails/helper.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 # rubocop:disable Metrics/ModuleLength
+# rubocop:disable Metrics/MethodLength
 # NOTE:
 # For any heredoc JS:
 # 1. The white spacing in this file matters!
@@ -32,8 +33,8 @@ module ReactOnRails
     #   Exposing the react_component_name is necessary to both a plain ReactComponent as well as
     #     a generator:
     #   See README.md for how to "register" your react components.
-    #   See spec/dummy/client/app/startup/serverRegistration.jsx and
-    #     spec/dummy/client/app/startup/ClientRegistration.jsx for examples of this
+    #   See spec/dummy/client/app/packs/server-bundle.js and
+    #     spec/dummy/client/app/packs/client-bundle.js for examples of this.
     #
     # options:
     #   props: Ruby Hash or JSON string which contains the properties to pass to the react object. Do
@@ -57,14 +58,15 @@ module ReactOnRails
       server_rendered_html = internal_result[:result]["html"]
       console_script = internal_result[:result]["consoleReplayScript"]
 
-      if server_rendered_html.is_a?(String)
+      case server_rendered_html
+      when String
         build_react_component_result_for_server_rendered_string(
           server_rendered_html: server_rendered_html,
           component_specification_tag: internal_result[:tag],
           console_script: console_script,
           render_options: internal_result[:render_options]
         )
-      elsif server_rendered_html.is_a?(Hash)
+      when Hash
         msg = <<~MSG
           Use react_component_hash (not react_component) to return a Hash to your ruby view code. See
           https://github.com/shakacode/react_on_rails/blob/master/spec/dummy/client/app/startup/ReactHelmetServerApp.jsx
@@ -152,7 +154,7 @@ module ReactOnRails
         @registered_stores_defer_render ||= []
         @registered_stores_defer_render << redux_store_data
         "YOU SHOULD NOT SEE THIS ON YOUR VIEW -- Uses as a code block, like <% redux_store %> "\
-        "and not <%= redux store %>"
+          "and not <%= redux store %>"
       else
         @registered_stores ||= []
         @registered_stores << redux_store_data
@@ -169,7 +171,7 @@ module ReactOnRails
     def redux_store_hydration_data
       return if @registered_stores_defer_render.blank?
 
-      @registered_stores_defer_render.reduce("".dup) do |accum, redux_store_data|
+      @registered_stores_defer_render.reduce(+"") do |accum, redux_store_data|
         accum << render_redux_store_data(redux_store_data)
       end.html_safe
     end
@@ -181,7 +183,7 @@ module ReactOnRails
     # Helper method to take javascript expression and returns the output from evaluating it.
     # If you have more than one line that needs to be executed, wrap it in an IIFE.
     # JS exceptions are caught and console messages are handled properly.
-    # Options include:{ prerender:, trace:, raise_on_prerender_error: }
+    # Options include:{ prerender:, trace:, raise_on_prerender_error:, throw_js_errors: }
     def server_render_js(js_expression, options = {})
       render_options = ReactOnRails::ReactComponent::RenderOptions
                        .new(react_component_name: "generic-js", options: options)
@@ -191,6 +193,8 @@ module ReactOnRails
         var htmlResult = '';
         var consoleReplayScript = '';
         var hasErrors = false;
+        var renderingError = null;
+        var renderingErrorObject = {};
 
         try {
           htmlResult =
@@ -198,9 +202,17 @@ module ReactOnRails
               return #{js_expression};
             })();
         } catch(e) {
+          renderingError = e;
+          if (#{render_options.throw_js_errors}) {
+            throw e;
+          }
           htmlResult = ReactOnRails.handleError({e: e, name: null,
             jsCode: '#{escape_javascript(js_expression)}', serverSide: true});
           hasErrors = true;
+          renderingErrorObject = {
+            message: renderingError.message,
+            stack: renderingError.stack,
+          }
         }
 
         consoleReplayScript = ReactOnRails.buildConsoleReplay();
@@ -208,7 +220,8 @@ module ReactOnRails
         return JSON.stringify({
             html: htmlResult,
             consoleReplayScript: consoleReplayScript,
-            hasErrors: hasErrors
+            hasErrors: hasErrors,
+            renderingError: renderingErrorObject
         });
 
       })()
@@ -221,9 +234,9 @@ module ReactOnRails
       console_log_script = result["consoleLogScript"]
       raw("#{html}#{render_options.replay_console ? console_log_script : ''}")
     rescue ExecJS::ProgramError => err
-      raise ReactOnRails::PrerenderError, component_name: "N/A (server_render_js called)",
-                                          err: err,
-                                          js_code: js_code
+      raise ReactOnRails::PrerenderError.new(component_name: "N/A (server_render_js called)",
+                                             err: err,
+                                             js_code: js_code)
     end
 
     def json_safe_and_pretty(hash_or_string)
@@ -231,7 +244,7 @@ module ReactOnRails
 
       unless hash_or_string.is_a?(String) || hash_or_string.is_a?(Hash)
         raise ReactOnRails::Error, "#{__method__} only accepts String or Hash as argument "\
-            "(#{hash_or_string.class} given)."
+                                   "(#{hash_or_string.class} given)."
       end
 
       json_value = hash_or_string.is_a?(String) ? hash_or_string : hash_or_string.to_json
@@ -243,7 +256,7 @@ module ReactOnRails
     # second parameter passed to both component and store Render-Functions.
     # This method can be called from views and from the controller, as `helpers.rails_context`
     #
-    # rubocop:disable Metrics/AbcSize
+    # rubocop:disable Metrics/AbcSize, Metrics/CyclomaticComplexity
     def rails_context(server_side: true)
       # ALERT: Keep in sync with node_package/src/types/index.ts for the properties of RailsContext
       @rails_context ||= begin
@@ -254,8 +267,13 @@ module ReactOnRails
           i18nLocale: I18n.locale,
           i18nDefaultLocale: I18n.default_locale,
           rorVersion: ReactOnRails::VERSION,
+          # TODO: v13 just use the version if existing
           rorPro: ReactOnRails::Utils.react_on_rails_pro?
         }
+        if ReactOnRails::Utils.react_on_rails_pro?
+          result[:rorProVersion] = ReactOnRails::Utils.react_on_rails_pro_version
+        end
+
         if defined?(request) && request.present?
           # Check for encoding of the request's original_url and try to force-encoding the
           # URLs as UTF-8. This situation can occur in browsers that do not encode the
@@ -291,7 +309,8 @@ module ReactOnRails
 
       @rails_context.merge(serverSide: server_side)
     end
-    # rubocop:enable Metrics/AbcSize
+
+    # rubocop:enable Metrics/AbcSize, Metrics/CyclomaticComplexity
 
     private
 
@@ -395,7 +414,7 @@ module ReactOnRails
       # 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.
       component_specification_tag = content_tag(:script,
-                                                json_safe_and_pretty(render_options.props).html_safe,
+                                                json_safe_and_pretty(render_options.client_props).html_safe,
                                                 type: "application/json",
                                                 class: "js-react-on-rails-component",
                                                 "data-component-name" => render_options.react_component_name,
@@ -465,34 +484,34 @@ module ReactOnRails
         result = ReactOnRails::ServerRenderingPool.server_render_js_with_console_logging(js_code, render_options)
       rescue StandardError => err
         # This error came from the renderer
-        raise ReactOnRails::PrerenderError, component_name: react_component_name,
-                                            # Sanitize as this might be browser logged
-                                            props: sanitized_props_string(props),
-                                            err: err,
-                                            js_code: js_code
+        raise ReactOnRails::PrerenderError.new(component_name: react_component_name,
+                                               # Sanitize as this might be browser logged
+                                               props: sanitized_props_string(props),
+                                               err: err,
+                                               js_code: js_code)
       end
 
       if result["hasErrors"] && render_options.raise_on_prerender_error
         # We caught this exception on our backtrace handler
-        raise ReactOnRails::PrerenderError, component_name: react_component_name,
-                                            # Sanitize as this might be browser logged
-                                            props: sanitized_props_string(props),
-                                            err: nil,
-                                            js_code: js_code,
-                                            console_messages: result["consoleReplayScript"]
+        raise ReactOnRails::PrerenderError.new(component_name: react_component_name,
+                                               # Sanitize as this might be browser logged
+                                               props: sanitized_props_string(props),
+                                               err: nil,
+                                               js_code: js_code,
+                                               console_messages: result["consoleReplayScript"])
 
       end
       result
     end
 
     def initialize_redux_stores
-      result = <<-JS.dup
+      result = +<<-JS
       ReactOnRails.clearHydratedStores();
       JS
 
       return result unless @registered_stores.present? || @registered_stores_defer_render.present?
 
-      declarations = "var reduxProps, store, storeGenerator;\n".dup
+      declarations = +"var reduxProps, store, storeGenerator;\n"
       all_stores = (@registered_stores || []) + (@registered_stores_defer_render || [])
 
       result << all_stores.each_with_object(declarations) do |redux_store_data, memo|
@@ -518,6 +537,13 @@ module ReactOnRails
 
       controller.is_a?(ActionMailer::Base)
     end
+
+    if defined?(ScoutApm)
+      include ScoutApm::Tracer
+      instrument_method :react_component, type: "ReactOnRails", name: "react_component"
+      instrument_method :react_component_hash, type: "ReactOnRails", name: "react_component_hash"
+    end
   end
 end
 # rubocop:enable Metrics/ModuleLength
+# rubocop:enable Metrics/MethodLength

data/lib/react_on_rails/json_parse_error.rb

@@ -4,7 +4,7 @@ module ReactOnRails
   class JsonParseError < ::ReactOnRails::Error
     attr_reader :json
 
-    def initialize(parse_error, json)
+    def initialize(parse_error:, json:)
       @json = json
       @original_error = parse_error
       super(parse_error.message)

data/lib/react_on_rails/locales/base.rb

@@ -32,12 +32,12 @@ module ReactOnRails
       end
 
       def exist_files
-        @exist_files ||= files.select(&File.method(:exist?))
+        @exist_files ||= files.select { |file| File.exist?(file) }
       end
 
       def files_are_outdated
-        latest_yml = locale_files.map(&File.method(:mtime)).max
-        earliest = exist_files.map(&File.method(:mtime)).min
+        latest_yml = locale_files.map { |file| File.mtime(file) }.max
+        earliest = exist_files.map { |file| File.mtime(file) }.min
         latest_yml > earliest
       end
 
@@ -54,15 +54,13 @@ module ReactOnRails
       end
 
       def locale_files
-        @locale_files ||= begin
-          if i18n_yml_dir.present?
-            Dir["#{i18n_yml_dir}/**/*.yml"]
-          else
-            ReactOnRails::Utils.truthy_presence(
-              Rails.application && Rails.application.config.i18n.load_path
-            ).presence
-          end
-        end
+        @locale_files ||= if i18n_yml_dir.present?
+                            Dir["#{i18n_yml_dir}/**/*.yml"]
+                          else
+                            ReactOnRails::Utils.truthy_presence(
+                              Rails.application && Rails.application.config.i18n.load_path
+                            ).presence
+                          end
       end
 
       def i18n_dir
@@ -87,9 +85,7 @@ module ReactOnRails
 
       def generate_file(template, path)
         result = ERB.new(template).result()
-        File.open(path, "w") do |f|
-          f.write(result)
-        end
+        File.write(path, result)
       end
 
       def generate_translations

data/lib/react_on_rails/locales/to_js.rb

@@ -5,10 +5,6 @@ require "erb"
 module ReactOnRails
   module Locales
     class ToJs < Base
-      def initialize
-        super
-      end
-
       private
 
       def file_format

data/lib/react_on_rails/locales/to_json.rb

@@ -5,10 +5,6 @@ require "erb"
 module ReactOnRails
   module Locales
     class ToJson < Base
-      def initialize
-        super
-      end
-
       private
 
       def file_format

data/lib/react_on_rails/prerender_error.rb

@@ -46,13 +46,16 @@ module ReactOnRails
     private
 
     def calc_message(component_name, console_messages, err, js_code, props)
-      message = "ERROR in SERVER PRERENDERING\n".dup
+      message = +"ERROR in SERVER PRERENDERING\n"
       if err
         message << <<~MSG
-          Encountered error: \"#{err}\"
+          Encountered error:
+
+          #{err}
+
         MSG
 
-        backtrace = err.backtrace.join("\n")
+        backtrace = err.backtrace.first(15).join("\n")
       else
         backtrace = nil
       end

data/lib/react_on_rails/react_component/render_options.rb

@@ -11,6 +11,7 @@ module ReactOnRails
 
       NO_PROPS = {}.freeze
 
+      # TODO: remove the required for named params
       def initialize(react_component_name: required("react_component_name"), options: required("options"))
         @react_component_name = react_component_name.camelize
         @options = options
@@ -18,12 +19,30 @@ module ReactOnRails
 
       attr_reader :react_component_name
 
+      def throw_js_errors
+        options.fetch(:throw_js_errors, false)
+      end
+
       def props
         options.fetch(:props) { NO_PROPS }
       end
 
+      def client_props
+        props_extension = ReactOnRails.configuration.rendering_props_extension
+        if props_extension.present?
+          if props_extension.respond_to?(:adjust_props_for_client_side_hydration)
+            return props_extension.adjust_props_for_client_side_hydration(react_component_name,
+                                                                          props.clone)
+          end
+
+          raise ReactOnRails::Error, "ReactOnRails: your rendering_props_extension module is missing the "\
+                                     "required adjust_props_for_client_side_hydration method & can not be used"
+        end
+        props
+      end
+
       def random_dom_id
-        retrieve_key(:random_dom_id)
+        retrieve_configuration_value_for(:random_dom_id)
       end
 
       def dom_id
@@ -49,23 +68,23 @@ module ReactOnRails
       end
 
       def prerender
-        retrieve_key(:prerender)
+        retrieve_configuration_value_for(:prerender)
       end
 
       def trace
-        retrieve_key(:trace)
+        retrieve_configuration_value_for(:trace)
       end
 
       def replay_console
-        retrieve_key(:replay_console)
+        retrieve_configuration_value_for(:replay_console)
       end
 
       def raise_on_prerender_error
-        retrieve_key(:raise_on_prerender_error)
+        retrieve_configuration_value_for(:raise_on_prerender_error)
       end
 
       def logging_on_server
-        retrieve_key(:logging_on_server)
+        retrieve_configuration_value_for(:logging_on_server)
       end
 
       def to_s
@@ -76,6 +95,10 @@ module ReactOnRails
         options[key]
       end
 
+      def set_option(key, value)
+        options[key] = value
+      end
+
       private
 
       attr_reader :options
@@ -88,7 +111,7 @@ module ReactOnRails
         "#{base_dom_id}-#{SecureRandom.uuid}"
       end
 
-      def retrieve_key(key)
+      def retrieve_configuration_value_for(key)
         options.fetch(key) do
           ReactOnRails.configuration.public_send(key)
         end

data/lib/react_on_rails/server_rendering_js_code.rb

@@ -18,6 +18,19 @@ module ReactOnRails
         react_component_name: nil,
         render_options: nil
       )
+
+        config_server_bundle_js = ReactOnRails.configuration.server_bundle_js_file
+
+        if render_options.prerender == true && config_server_bundle_js.blank?
+          msg = <<~MSG
+            The `prerender` option to allow Server Side Rendering is marked as true but the ReactOnRails configuration
+            for `server_bundle_js_file` is nil or not present in `config/initializers/react_on_rails.rb`.
+            Set `config.server_bundle_js_file` to your javascript bundle to allow server side rendering.
+            Read more at https://www.shakacode.com/react-on-rails/docs/guides/react-server-rendering/
+          MSG
+          raise ReactOnRails::Error, msg
+        end
+
         js_code_renderer.render(props_string, rails_context, redux_stores, react_component_name, render_options)
       end
 

data/lib/react_on_rails/server_rendering_pool/ruby_embedded_java_script.rb

@@ -47,6 +47,7 @@ module ReactOnRails
         # Note, js_code does not have to be based on React.
         # js_code MUST RETURN json stringify Object
         # Calling code will probably call 'html_safe' on return value before rendering to the view.
+        # rubocop:disable Metrics/CyclomaticComplexity, Metrics/AbcSize, Metrics/PerceivedComplexity
         def exec_server_render_js(js_code, render_options, js_evaluator = nil)
           js_evaluator ||= self
           if render_options.trace
@@ -55,28 +56,42 @@ module ReactOnRails
                                "tmp/server-generated-#{@file_index % 10}.js")
             @file_index += 1
           end
-          json_string = js_evaluator.eval_js(js_code, render_options)
+          begin
+            json_string = js_evaluator.eval_js(js_code, render_options)
+          rescue StandardError => err
+            msg = <<~MSG
+              Error evaluating server bundle. Check your webpack configuration.
+              ===============================================================
+              Caught error:
+              #{err.message}
+              ===============================================================
+            MSG
+
+            if err.message.include?("ReferenceError: self is not defined")
+              msg << "\nError indicates that you may have code-splitting incorrectly enabled.\n"
+            end
+            raise ReactOnRails::Error, msg, err.backtrace
+          end
           result = nil
           begin
             result = JSON.parse(json_string)
           rescue JSON::ParserError => e
-            raise ReactOnRails::JsonParseError.new(e, json_string)
+            raise ReactOnRails::JsonParseError.new(parse_error: e, json: json_string)
           end
 
           if render_options.logging_on_server
             console_script = result["consoleReplayScript"]
             console_script_lines = console_script.split("\n")
             console_script_lines = console_script_lines[2..-2]
-            re = /console\.(log|error)\.apply\(console, \["\[SERVER\] (?<msg>.*)"\]\);/
-            if console_script_lines
-              console_script_lines.each do |line|
-                match = re.match(line)
-                Rails.logger.info { "[react_on_rails] #{match[:msg]}" } if match
-              end
+            re = /console\.(?:log|error)\.apply\(console, \["\[SERVER\] (?<msg>.*)"\]\);/
+            console_script_lines&.each do |line|
+              match = re.match(line)
+              Rails.logger.info { "[react_on_rails] #{match[:msg]}" } if match
             end
           end
           result
         end
+        # rubocop:enable Metrics/CyclomaticComplexity, Metrics/AbcSize, Metrics/PerceivedComplexity
 
         def trace_js_code_used(msg, js_code, file_name = "tmp/server-generated.js", force: false)
           return unless ReactOnRails.configuration.trace || force
@@ -133,15 +148,15 @@ module ReactOnRails
             if ReactOnRails.configuration.trace
               Rails.logger.info do
                 "[react_on_rails] Created JavaScript context with file "\
-                "#{ReactOnRails::Utils.server_bundle_js_file_path}"
+                  "#{ReactOnRails::Utils.server_bundle_js_file_path}"
               end
             end
             ExecJS.compile(base_js_code)
           rescue StandardError => e
             msg = "ERROR when compiling base_js_code! "\
-              "See file #{file_name} to "\
-              "correlate line numbers of error. Error is\n\n#{e.message}"\
-              "\n\n#{e.backtrace.join("\n")}"
+                  "See file #{file_name} to "\
+                  "correlate line numbers of error. Error is\n\n#{e.message}"\
+                  "\n\n#{e.backtrace.join("\n")}"
             Rails.logger.error(msg)
             trace_js_code_used("Error when compiling JavaScript code for the context.", base_js_code,
                                file_name, force: true)
@@ -150,6 +165,12 @@ module ReactOnRails
         end
 
         def execjs_timer_polyfills
+          if ReactOnRails::Utils.react_on_rails_pro? &&
+             ReactOnRailsPro.configuration.respond_to?(:include_execjs_polyfills) &&
+             ReactOnRailsPro.configuration.include_execjs_polyfills == false
+            return ""
+          end
+
           <<~JS
             function getStackTrace () {
               var stack;
@@ -180,15 +201,17 @@ module ReactOnRails
         def undefined_for_exec_js_logging(function_name)
           if ReactOnRails.configuration.trace
             "console.error('[React on Rails Rendering] #{function_name} is not defined for server rendering.');\n"\
-            "  console.error(getStackTrace().join('\\n'));"
+              "  console.error(getStackTrace().join('\\n'));"
           else
             ""
           end
         end
 
         # Reimplement console methods for replaying on the client
+        # Save a handle to the original console if needed.
         def console_polyfill
           <<~JS
+            var debugConsole = console;
             var console = { history: [] };
             ['error', 'log', 'info', 'warn'].forEach(function (level) {
               console[level] = function () {
@@ -202,6 +225,11 @@ module ReactOnRails
           JS
         end
 
+        if defined?(ScoutApm)
+          include ScoutApm::Tracer
+          instrument_method :exec_server_render_js, type: "ReactOnRails", name: "ExecJs React Server Rendering"
+        end
+
         private
 
         def file_url_to_string(url)

data/lib/react_on_rails/test_helper/webpack_assets_compiler.rb

@@ -8,7 +8,7 @@ module ReactOnRails
       def compile_assets
         if ReactOnRails.configuration.build_test_command.blank?
           msg = <<~MSG
-            You are using the React on Rails test helper. 
+            You are using the React on Rails test helper.
             Either you used:
               ReactOnRails::TestHelper.configure_rspec_to_compile_assets or
               ReactOnRails::TestHelper.ensure_assets_compiled

data/lib/react_on_rails/test_helper/webpack_assets_status_checker.rb

@@ -66,10 +66,10 @@ module ReactOnRails
             file_list = make_file_list(make_globs(generated_assets_full_path)).to_ary
             puts "V" * 80
             puts "Please define config.webpack_generated_files (array) so the test helper knows "\
-            "which files are required. If you are using webpacker, you typically need to only "\
-            "include 'manifest.json'."
+                 "which files are required. If you are using webpacker, you typically need to only "\
+                 "include 'manifest.json'."
             puts "Detected the possible following files to check for webpack compilation in "\
-              "#{generated_assets_full_path}"
+                 "#{generated_assets_full_path}"
             puts file_list.join("\n")
             puts "^" * 80
             file_list

data/lib/react_on_rails/test_helper.rb

@@ -52,6 +52,7 @@ module ReactOnRails
     #                        don't provide one.
     # webpack_generated_files List of files to check for up-to-date-status, defaulting to
     #                        webpack_generated_files in your configuration
+    # rubocop:disable Metrics/CyclomaticComplexity
     def self.ensure_assets_compiled(webpack_assets_status_checker: nil,
                                     webpack_assets_compiler: nil,
                                     source_path: nil,
@@ -71,8 +72,8 @@ module ReactOnRails
         unless @printed_once
           puts
           puts "====> React On Rails: Checking files in "\
-            "#{webpack_assets_status_checker.generated_assets_full_path} for "\
-            "outdated/missing bundles based on source_path #{source_path}"
+               "#{webpack_assets_status_checker.generated_assets_full_path} for "\
+               "outdated/missing bundles based on source_path #{source_path}"
           puts
           @printed_once = true
 
@@ -96,4 +97,5 @@ module ReactOnRails
       ).call
     end
   end
+  # rubocop:enable Metrics/CyclomaticComplexity
 end