react_on_rails 9.0.0.beta.11 → 9.0.0.beta.12

data/lib/generators/react_on_rails/dev_tests_generator.rb

@@ -5,6 +5,7 @@ require_relative "generator_helper"
 
 module ReactOnRails
   module Generators
+    # TODO9: Do we need something like this still? How to put in with
     FALLBACK_OPTION_FOR_NODE_MODULES = <<-TEXT
     // This fixes an issue with resolving 'react' when using a local symlinked version
     // of the node_package folder
@@ -28,7 +29,8 @@ module ReactOnRails
                    desc: "Setup prerender true for server rendered examples"
 
       def copy_rspec_files
-        %w[spec/spec_helper.rb
+        %w[.eslintrc
+           spec/spec_helper.rb
            spec/rails_helper.rb
            spec/simplecov_helper.rb
            .rspec].each { |file| copy_file(file) }
@@ -54,16 +56,16 @@ module ReactOnRails
         File.open(hello_world_index, "w+") { |f| f.puts new_hello_world_contents }
       end
 
-      def add_yarn_relative_install_script_in_client_package_json
-        client_package_json = File.join(destination_root, "client", "package.json")
-        contents = File.read(client_package_json)
+      def add_yarn_relative_install_script_in_package_json
+        package_json = File.join(destination_root, "package.json")
+        contents = File.read(package_json)
         replacement_value = <<-STRING
   "scripts": {
     "postinstall": "yarn link react-on-rails",
 STRING
         new_client_package_json_contents = contents.gsub(/ {2}"scripts": {/,
                                                          replacement_value)
-        File.open(client_package_json, "w+") { |f| f.puts new_client_package_json_contents }
+        File.open(package_json, "w+") { |f| f.puts new_client_package_json_contents }
       end
     end
   end

data/lib/generators/react_on_rails/install_generator.rb

@@ -19,13 +19,6 @@ module ReactOnRails
                    desc: "Install Redux gems and Redux version of Hello World Example. Default: false",
                    aliases: "-R"
 
-      # --redux
-      class_option :node,
-                   type: :boolean,
-                   default: false,
-                   desc: "Sets up node as a server rendering option. Default: false",
-                   aliases: "-N"
-
       # --ignore-warnings
       class_option :ignore_warnings,
                    type: :boolean,
@@ -53,9 +46,11 @@ module ReactOnRails
 
       def invoke_generators
         invoke "react_on_rails:base"
-        invoke "react_on_rails:react_no_redux" unless options.redux?
-        invoke "react_on_rails:react_with_redux" if options.redux?
-        invoke "react_on_rails:node" if options.node?
+        if options.redux?
+          invoke "react_on_rails:react_with_redux"
+        else
+          invoke "react_on_rails:react_no_redux"
+        end
       end
 
       # NOTE: other requirements for existing files such as .gitignore or application.

data/lib/generators/react_on_rails/react_no_redux_generator.rb

@@ -11,21 +11,22 @@ module ReactOnRails
       source_root(File.expand_path("../templates", __FILE__))
 
       def copy_base_files
-        base_path = "base/base/"
-        base_files = %w[client/app/bundles/HelloWorld/components/HelloWorld.jsx]
-        base_files.each { |file| copy_file("#{base_path}#{file}", file) }
+        base_js_path = "base/base"
+        base_files = %w[app/javascript/bundles/HelloWorld/components/HelloWorld.jsx]
+        base_files.each { |file| copy_file("#{base_js_path}/#{file}", file) }
       end
 
       def create_appropriate_templates
-        base_path = "base/base/"
-        location = "client/app/bundles/HelloWorld/"
-        source = base_path + location
+        base_path = "base/base"
         config = {
           component_name: "HelloWorld",
-          app_relative_path: "../components/HelloWorld"
+          app_relative_path: "../bundles/HelloWorld/components/HelloWorld"
         }
-        template("#{source}/startup/registration.jsx.tt", "#{location}/startup/registration.jsx", config)
-        template("#{base_path}app/views/hello_world/index.html.erb.tt", "app/views/hello_world/index.html.erb", config)
+
+        template("#{base_path}/app/javascript/packs/registration.js.tt",
+                 "app/javascript/packs/hello-world-bundle.js", config)
+        template("#{base_path}/app/views/hello_world/index.html.erb.tt",
+                 "app/views/hello_world/index.html.erb", config)
       end
     end
   end

data/lib/generators/react_on_rails/react_with_redux_generator.rb

@@ -9,33 +9,43 @@ module ReactOnRails
       source_root(File.expand_path("../templates", __FILE__))
 
       def create_redux_directories
-        dirs = %w[actions constants reducers store]
-        dirs.each { |name| empty_directory("client/app/bundles/HelloWorld/#{name}") }
+        dirs = %w[actions constants containers reducers store startup]
+        dirs.each { |name| empty_directory("app/javascript/bundles/HelloWorld/#{name}") }
+      end
+
+      def copy_base_files
+        base_js_path = "base/base"
+        base_files = %w[app/javascript/bundles/HelloWorld/components/HelloWorld.jsx]
+        base_files.each { |file| copy_file("#{base_js_path}/#{file}", file) }
       end
 
       def copy_base_redux_files
-        base_path = "redux/base/"
-        %w[client/app/bundles/HelloWorld/components/HelloWorld.jsx
-           client/app/bundles/HelloWorld/actions/helloWorldActionCreators.jsx
-           client/app/bundles/HelloWorld/containers/HelloWorldContainer.jsx
-           client/app/bundles/HelloWorld/constants/helloWorldConstants.jsx
-           client/app/bundles/HelloWorld/reducers/helloWorldReducer.jsx
-           client/app/bundles/HelloWorld/store/helloWorldStore.jsx
-           client/app/bundles/HelloWorld/startup/HelloWorldApp.jsx].each do |file|
-             copy_file(base_path + file, file)
+        base_hello_world_path = "redux/base/app/javascript/bundles/HelloWorld"
+        %w[actions/helloWorldActionCreators.js
+           containers/HelloWorldContainer.js
+           constants/helloWorldConstants.js
+           reducers/helloWorldReducer.js
+           store/helloWorldStore.js
+           startup/HelloWorldApp.jsx].each do |file|
+             copy_file("#{base_hello_world_path}/#{file}",
+                       "app/javascript/bundles/HelloWorld/#{file}")
            end
       end
 
       def create_appropriate_templates
-        base_path = "base/base/"
-        location = "client/app/bundles/HelloWorld/"
-        source = base_path + location
+        base_path = "base/base"
+        base_js_path = "#{base_path}/app/javascript"
         config = {
           component_name: "HelloWorldApp",
-          app_relative_path: "./HelloWorldApp"
+          app_relative_path: "../bundles/HelloWorld/startup/HelloWorldApp"
         }
-        template("#{source}/startup/registration.jsx.tt", "#{location}/startup/registration.jsx", config)
-        template("#{base_path}app/views/hello_world/index.html.erb.tt", "app/views/hello_world/index.html.erb", config)
+
+        template("#{base_js_path}/packs/registration.js.tt", "app/javascript/packs/hello-world-bundle.js", config)
+        template("#{base_path}/app/views/hello_world/index.html.erb.tt", "app/views/hello_world/index.html.erb", config)
+      end
+
+      def add_redux_yarn_dependencies
+        run "yarn add redux react-redux"
       end
     end
   end

data/lib/generators/react_on_rails/templates/.eslintrc

@@ -21,3 +21,5 @@ rules:
 
   # because template cannot find react-on-rails
   import/no-unresolved: 0
+
+  semi: 0

data/lib/generators/react_on_rails/templates/base/base/Procfile.dev

@@ -0,0 +1,4 @@
+web: rails s -p 3000
+
+# Next line runs a watch process with webpack
+client: sh -c 'rm -rf public/packs/* || true && bundle exec rake react_on_rails:locale && bin/webpack -w'

data/lib/generators/react_on_rails/templates/base/base/Procfile.dev-server

@@ -0,0 +1,5 @@
+web: rails s -p 3000
+
+# Next line runs the webpack-dev-server
+# You can edit config/webpacker.yml to set HMR to true to see hot reloading
+client: sh -c 'rm -rf public/packs/* || true && bundle exec rake react_on_rails:locale && bin/webpack-dev-server'

data/lib/generators/react_on_rails/templates/base/base/app/views/hello_world/index.html.erb.tt

@@ -1,3 +1,2 @@
 <h1>Hello World</h1>
 <%%= react_component("<%= config[:component_name] %>", props: @hello_world_props, prerender: false) %>
-

data/lib/generators/react_on_rails/templates/base/base/app/views/layouts/{hello_world.html.erb.tt → hello_world.html.erb}

@@ -2,11 +2,11 @@
 <html>
   <head>
     <title>ReactOnRailsWithWebpacker</title>
-    <%%= csrf_meta_tags %>
-    <%%= javascript_pack_tag 'hello-world-bundle' %>
+    <%= csrf_meta_tags %>
+    <%= javascript_pack_tag 'hello-world-bundle' %>
   </head>
 
   <body>
-    <%%= yield %>
+    <%= yield %>
   </body>
 </html>

data/lib/generators/react_on_rails/templates/base/base/config/initializers/react_on_rails.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+# See docs/basics/configuration.md for many more options
+
+ReactOnRails.configure do |config|
+  # This configures the script to run to build the production assets by webpack. Set this to nil
+  # if you don't want react_on_rails building this file for you.
+  config.npm_build_production_command = "RAILS_ENV=production bin/webpack"
+
+  ################################################################################
+  ################################################################################
+  # TEST CONFIGURATION OPTIONS
+  # Below options are used with the use of this test helper:
+  # ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
+  ################################################################################
+
+  # If you are using this in your spec_helper.rb (or rails_helper.rb):
+  #
+  # ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
+  #
+  # with rspec then this controls what yarn command is run
+  # to automatically refresh your webpack assets on every test run.
+  #
+  config.build_test_command = "RAILS_ENV=test bin/webpack"
+
+  ################################################################################
+  ################################################################################
+  # SERVER RENDERING OPTIONS
+  ################################################################################
+  # This is the file used for server rendering of React when using `(prerender: true)`
+  # If you are never using server rendering, you should set this to "".
+  # Note, there is only one server bundle, unlike JavaScript where you want to minimize the size
+  # of the JS sent to the client. For the server rendering, React on Rails creates a pool of
+  # JavaScript execution instances which should handle any component requested.
+  #
+  # While you may configure this to be the same as your client bundle file, this file is typically
+  # different. You should have ONE server bundle which can create all of your server rendered
+  # React components.
+  #
+  config.server_bundle_js_file = "hello-world-bundle.js"
+end

data/lib/generators/react_on_rails/templates/dev_tests/.eslintrc

@@ -0,0 +1,25 @@
+---
+extends: eslint-config-shakacode
+
+plugins:
+  - react
+
+globals:
+  __DEBUG_SERVER_ERRORS__: true
+  __SERVER_ERRORS__: true
+
+env:
+  browser: true
+  node: true
+  mocha: true
+
+rules:
+  no-console: 0
+
+  # https://github.com/benmosher/eslint-plugin-import/issues/340
+  import/no-extraneous-dependencies: 0
+
+  # because template cannot find react-on-rails
+  import/no-unresolved: 0
+
+  semi: 0

data/lib/generators/react_on_rails/templates/dev_tests/spec/rails_helper.rb

@@ -38,7 +38,6 @@ Capybara.javascript_driver = :poltergeist
 RSpec.configure do |config|
   # Ensure that if we are running js tests, we are using latest webpack assets
   # This will use the defaults of :js and :server_rendering meta tags
-  ReactOnRails::TestHelper.launch_node if ReactOnRails.configuration.server_render_method == "NodeJS"
   ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
 
   # Remove this line if you"re not using ActiveRecord or ActiveRecord fixtures

data/lib/generators/react_on_rails/templates/dev_tests/spec/spec_helper.rb

@@ -19,6 +19,8 @@
 #
 # See http://rubydoc.info/gems/rspec-core/RSpec/Core/Configuration
 RSpec.configure do |config|
+  ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
+
   # rspec-expectations config goes here. You can use an alternate
   # assertion/expectation library such as wrong or the stdlib/minitest
   # assertions if you prefer.

data/lib/react_on_rails/configuration.rb

@@ -1,5 +1,7 @@
 # frozen_string_literal: true
 
+# NOTE: ReactOnRails::Utils.using_webpacker? always will return false when called here.
+
 module ReactOnRails
   def self.configure
     yield(configuration)
@@ -81,6 +83,7 @@ module ReactOnRails
 
   def self.configuration
     @configuration ||= Configuration.new(
+      node_modules_location: "",
       generated_assets_dirs: nil,
 
       # generated_assets_dirs is deprecated
@@ -97,11 +100,11 @@ module ReactOnRails
       skip_display_none: nil,
 
       # skip_display_none is deprecated
-      webpack_generated_files: [],
+      webpack_generated_files: %w[manifest.json],
       rendering_extension: nil,
-      server_render_method: "",
+      server_render_method: "ExecJS",
       symlink_non_digested_assets_regex: nil,
-      npm_build_test_command: "",
+      build_test_command: "",
       i18n_dir: "",
       i18n_yml_dir: "",
       npm_build_production_command: ""
@@ -109,30 +112,32 @@ module ReactOnRails
   end
 
   class Configuration
-    attr_accessor :server_bundle_js_file, :prerender, :replay_console,
+    attr_accessor :node_modules_location, :server_bundle_js_file, :prerender, :replay_console,
                   :trace, :development_mode,
                   :logging_on_server, :server_renderer_pool_size,
                   :server_renderer_timeout, :skip_display_none, :raise_on_prerender_error,
                   :generated_assets_dirs, :generated_assets_dir,
-                  :webpack_generated_files, :rendering_extension, :npm_build_test_command,
+                  :webpack_generated_files, :rendering_extension, :build_test_command,
                   :npm_build_production_command,
                   :i18n_dir, :i18n_yml_dir,
                   :server_render_method, :symlink_non_digested_assets_regex
 
-    def initialize(server_bundle_js_file: nil, prerender: nil, replay_console: nil,
+    def initialize(node_modules_location: "", server_bundle_js_file: nil, prerender: nil,
+                   replay_console: nil,
                    trace: nil, development_mode: nil,
                    logging_on_server: nil, server_renderer_pool_size: nil,
-                   server_renderer_timeout: nil, raise_on_prerender_error: nil,
+                   server_renderer_timeout: nil, raise_on_prerender_error: true,
                    skip_display_none: nil, generated_assets_dirs: nil,
                    generated_assets_dir: nil, webpack_generated_files: nil,
-                   rendering_extension: nil, npm_build_test_command: nil,
+                   rendering_extension: nil, build_test_command: nil,
                    npm_build_production_command: nil,
                    i18n_dir: nil, i18n_yml_dir: nil,
-                   server_render_method: nil, symlink_non_digested_assets_regex: nil)
+                   server_render_method: "ExecJS", symlink_non_digested_assets_regex: nil)
+      self.node_modules_location = node_modules_location
       self.server_bundle_js_file = server_bundle_js_file
       self.generated_assets_dirs = generated_assets_dirs
       self.generated_assets_dir = generated_assets_dir
-      self.npm_build_test_command = npm_build_test_command
+      self.build_test_command = build_test_command
       self.npm_build_production_command = npm_build_production_command
       self.i18n_dir = i18n_dir
       self.i18n_yml_dir = i18n_yml_dir

data/lib/react_on_rails/server_rendering_pool/exec.rb

@@ -1,5 +1,7 @@
 # frozen_string_literal: true
 
+require "open-uri"
+
 module ReactOnRails
   module ServerRenderingPool
     # This implementation of the rendering pool uses ExecJS to execute javasript code
@@ -14,11 +16,21 @@ module ReactOnRails
 
       def self.reset_pool_if_server_bundle_was_modified
         return unless ReactOnRails.configuration.development_mode
-        file_mtime = File.mtime(ReactOnRails::Utils.server_bundle_js_file_path)
-        @server_bundle_timestamp ||= file_mtime
-        return if @server_bundle_timestamp == file_mtime
+
+        server_bundle_js_file_path = ReactOnRails::Utils.server_bundle_js_file_path
+
+        if Webpacker.dev_server.running?
+          return if @last_loaded_server_bundle == server_bundle_js_file_path
+          @last_loaded_server_bundle = server_bundle_js_file_path
+        else
+          # we're not hashing the server name and we can use the mtime
+          file_mtime = File.mtime(server_bundle_js_file_path)
+          @server_bundle_timestamp ||= file_mtime
+          return if @server_bundle_timestamp == file_mtime
+          @server_bundle_timestamp = file_mtime
+        end
+
         ReactOnRails::ServerRenderingPool.reset_pool
-        @server_bundle_timestamp = file_mtime
       end
 
       # js_code: JavaScript expression that returns a string.
@@ -83,14 +95,15 @@ module ReactOnRails
 
           server_js_file = ReactOnRails::Utils.server_bundle_js_file_path
 
-          unless File.exist?(server_js_file)
+          # bundle_js_code = File.read(server_js_file)
+          begin
+            bundle_js_code = open(server_js_file, &:read)
+          rescue => e
             msg = "You specified server rendering JS file: #{server_js_file}, but it cannot be "\
                 "read. You may set the server_bundle_js_file in your configuration to be \"\" to "\
-                "avoid this warning"
+                "avoid this warning.\nError is: #{e}"
             raise msg
           end
-
-          bundle_js_code = File.read(server_js_file)
           # rubocop:disable Layout/IndentHeredoc
           base_js_code = <<-JS
 #{console_polyfill}

data/lib/react_on_rails/test_helper.rb

@@ -44,27 +44,27 @@ module ReactOnRails
     # an example of usage.
     #
     # Typical usage passes all params as nil defaults.
-    # webpack_assets_status_checker: provide: `up_to_date?`, `whats_not_up_to_date`, `client_dir`
+    # webpack_assets_status_checker: provide: `up_to_date?`, `whats_not_up_to_date`, `source_path`
     #                         defaults to ReactOnRails::TestHelper::WebpackAssetsStatusChecker
     # webpack_assets_compiler: provide one method: `def compile`
     #                         defaults to ReactOnRails::TestHelper::WebpackAssetsCompiler
-    # client_dir and generated_assets_dir are passed into the default webpack_assets_status_checker if you
+    # source_path and generated_assets_dir are passed into the default webpack_assets_status_checker if you
     #                        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
     def self.ensure_assets_compiled(webpack_assets_status_checker: nil,
                                     webpack_assets_compiler: nil,
-                                    client_dir: nil,
+                                    source_path: nil,
                                     generated_assets_dir: nil,
                                     webpack_generated_files: nil)
       ReactOnRails::Utils.check_manifest_not_cached
       if webpack_assets_status_checker.nil?
-        client_dir ||= Rails.root.join("client")
-        generated_assets_dir ||= ReactOnRails.configuration.generated_assets_dir
+        source_path ||= ReactOnRails::Utils.source_path
+        generated_assets_dir ||= ReactOnRails::Utils.generated_assets_dir
         webpack_generated_files ||= ReactOnRails.configuration.webpack_generated_files
 
         webpack_assets_status_checker ||=
-          WebpackAssetsStatusChecker.new(client_dir: client_dir,
+          WebpackAssetsStatusChecker.new(source_path: source_path,
                                          generated_assets_dir: generated_assets_dir,
                                          webpack_generated_files: webpack_generated_files)