react_on_rails 6.0.5 → 6.1.0

data/lib/generators/USAGE

@@ -9,6 +9,10 @@ can pass the redux option if you'd like to have redux setup for you automaticall
     to integrate the Redux state container framework. The necessary node modules
     will be automatically included for you.
 
+* Node
+
+    Passing the --node generator option sets up the necessary files for node to render the react_components. 
+
 *******************************************************************************
 
 After running the generator, you will want to:
@@ -21,4 +25,4 @@ Then you may run
 
 More Details:
 
-    `https://github.com/shakacode/react_on_rails#generator`
+    `https://github.com/shakacode/react_on_rails/blob/master/docs/basics/generator.md`

data/lib/generators/react_on_rails/base_generator.rb

@@ -23,7 +23,7 @@ module ReactOnRails
       def update_git_ignore
         data = <<-DATA.strip_heredoc
           # React on Rails
-          npm-debug.log
+          npm-debug.log*
           node_modules
 
           # Generated js bundles
@@ -82,7 +82,7 @@ module ReactOnRails
       end
 
       def add_base_gems_to_gemfile
-        append_to_file("Gemfile", "\ngem 'therubyracer', platforms: :ruby\n")
+        append_to_file("Gemfile", "\ngem 'mini_racer', platforms: :ruby\n")
       end
 
       ASSETS_RB_APPEND = <<-DATA.strip_heredoc

data/lib/generators/react_on_rails/install_generator.rb

@@ -17,6 +17,13 @@ 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,
@@ -46,6 +53,7 @@ module ReactOnRails
         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?
       end
 
       # NOTE: other requirements for existing files such as .gitignore or application.

data/lib/generators/react_on_rails/node_generator.rb

@@ -0,0 +1,22 @@
+require "rails/generators"
+
+module ReactOnRails
+  module Generators
+    class NodeGenerator < Rails::Generators::Base
+      Rails::Generators.hide_namespace(namespace)
+      source_root(File.expand_path("../templates", __FILE__))
+
+      def create_node_directory
+        empty_directory("client/node")
+      end
+
+      def copy_base_redux_files
+        base_path = "node/base/"
+        %w(client/node/server.js
+           client/node/package.json).each do |file|
+             copy_file(base_path + file, file)
+           end
+      end
+    end
+  end
+end

data/lib/generators/react_on_rails/templates/base/base/client/REACT_ON_RAILS_CLIENT_README.md

@@ -5,5 +5,5 @@ See documentation [at github.com/shakacode/react_on_rails](https://github.com/sh
 If you need additional help, please consider:
 
 * [Our ShakaCode Forum for React on Rails](https://forum.shakacode.com/c/rails/reactonrails).
-* Joining our Slack discussion room by [email us a bit about you and your project](mailto:contact@shakacode.com).
+* Joining our Slack discussion room by [emailing us a bit about you and your project](mailto:contact@shakacode.com).
 * [Hiring us](https://forum.shakacode.com/c/rails/reactonrails) for coaching and custom web application development for your project.

data/lib/generators/react_on_rails/templates/base/base/client/webpack.config.js

@@ -4,7 +4,7 @@ const path = require('path');
 const devBuild = process.env.NODE_ENV !== 'production';
 const nodeEnv = devBuild ? 'development' : 'production';
 
-config = {
+const config = {
   entry: [
     'es5-shim/es5-shim',
     'es5-shim/es5-sham',
@@ -38,7 +38,8 @@ config = {
         loader: 'imports?shim=es5-shim/es5-shim&sham=es5-shim/es5-sham',
       },
       {
-        test: /\.jsx?$/, loader: 'babel-loader',
+        test: /\.jsx?$/,
+        loader: 'babel-loader',
         exclude: /node_modules/,
       },
     ],

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

@@ -52,7 +52,7 @@ ReactOnRails.configure do |config|
 
   # Server rendering only (not for render_component helper)
   # You can configure your pool of JS virtual machines and specify where it should load code:
-  # On MRI, use `therubyracer` for the best performance
+  # On MRI, use `mini_racer` for the best performance
   # (see [discussion](https://github.com/reactjs/react-rails/pull/290))
   # On MRI, you'll get a deadlock with `pool_size` > 1
   # If you're using JRuby, you can increase `pool_size` to have real multi-threaded rendering.
@@ -67,11 +67,15 @@ ReactOnRails.configure do |config|
   config.skip_display_none = false
 
   # The server render method - either ExecJS or NodeJS
+  <%- if options.node? -%>
+  config.server_render_method = "NodeJS"
+  <%- else -%>
   config.server_render_method = "ExecJS"
+  <%- end -%>
 
   # Client js uses assets not digested by rails.
-  # For any asset matching this regex, non-digested symlink will be created
+  # For any asset matching this regex, non-digested symlink will be created (what webpack's css wants)
   # To disable symlinks set this parameter to nil.
-  config.symlink_non_digested_assets_regex = /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg)/
+  config.symlink_non_digested_assets_regex = /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg|map)/
 
 end

data/lib/generators/react_on_rails/templates/node/base/client/node/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "react_on_rails_node",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+      "start": "node ./server.js -s webpack-bundle.js"
+  },
+  "dependencies": {
+  }
+}

data/lib/generators/react_on_rails/templates/node/base/client/node/server.js

@@ -0,0 +1,87 @@
+const net = require('net');
+const fs = require('fs');
+
+const bundlePath = '../../app/assets/webpack/';
+let bundleFileName = 'webpack-bundle.js';
+
+let currentArg;
+
+function Handler() {
+  this.queue = [];
+  this.initialized = false;
+}
+
+Handler.prototype.handle = (connection) => {
+  const callback = () => {
+    connection.setEncoding('utf8');
+    connection.on('data', (data) => {
+      console.log(`Processing request: ${data}`);
+
+      // eslint-disable-next-line no-eval
+      const result = eval(data);
+      connection.write(result);
+    });
+  };
+
+  if (this.initialized) {
+    callback();
+  } else {
+    this.queue.push(callback);
+  }
+};
+
+Handler.prototype.initialize = () => {
+  console.log(`Processing ${this.queue.length} pending requests`);
+  let callback;
+
+  // eslint-disable-next-line no-cond-assign
+  while (callback = this.queue.pop()) {
+    callback();
+  }
+
+  this.initialized = true;
+};
+
+const handler = new Handler();
+
+process.argv.forEach((val) => {
+  if (val[0] === '-') {
+    currentArg = val.slice(1);
+    return;
+  }
+
+  if (currentArg === 's') {
+    bundleFileName = val;
+  }
+});
+
+try {
+  fs.mkdirSync(bundlePath);
+} catch (e) {
+  if (e.code !== 'EEXIST') throw e;
+}
+
+fs.watchFile(bundlePath + bundleFileName, (curr) => {
+  if (curr && curr.blocks && curr.blocks > 0) {
+    if (handler.initialized) {
+      console.log('Reloading server bundle must be implemented by restarting the node process!');
+      return;
+    }
+
+    // eslint-disable-next-line global-require
+    require(bundlePath + bundleFileName);
+    console.log(`Loaded server bundle: ${bundlePath + bundleFileName}`);
+    handler.initialize();
+  }
+});
+
+const unixServer = net.createServer((connection) => {
+  handler.handle(connection);
+});
+
+unixServer.listen('node.sock');
+
+process.on('SIGINT', () => {
+  unixServer.close();
+  process.exit();
+});

data/lib/react_on_rails/assets_precompile.rb

@@ -0,0 +1,112 @@
+module ReactOnRails
+  class AssetsPrecompile
+    # Used by the rake task
+    def default_asset_path
+      dir = File.join(Rails.configuration.paths["public"].first,
+                      Rails.configuration.assets.prefix)
+      Pathname.new(dir)
+    end
+
+    def initialize(assets_path: nil,
+                   symlink_non_digested_assets_regex: nil,
+                   generated_assets_dir: nil)
+      @assets_path = assets_path.presence || default_asset_path
+      @symlink_non_digested_assets_regex = symlink_non_digested_assets_regex.presence ||
+                                           ReactOnRails.configuration.symlink_non_digested_assets_regex
+      @generated_assets_dir = generated_assets_dir.presence || ReactOnRails.configuration.generated_assets_dir
+    end
+
+    # target and symlink are relative to the assets directory
+    def symlink_file(target, symlink)
+      target_path = @assets_path.join(target)
+      symlink_path = @assets_path.join(symlink)
+      target_exists = File.exist?(target_path)
+
+      # File.exist?(symlink_path) will check the file the sym is pointing to is existing
+      # File.lstat(symlink_path).symlink? confirms that this is a symlink
+      symlink_already_there_and_valid = File.exist?(symlink_path) &&
+                                        File.lstat(symlink_path).symlink?
+      if symlink_already_there_and_valid
+        puts "React On Rails: Digested #{symlink} already exists indicating #{target} did not change."
+      elsif target_exists
+        if File.exist?(symlink_path) && File.lstat(symlink_path).symlink?
+          puts "React On Rails: Removing invalid symlink #{symlink_path}"
+          `cd #{@assets_path} && rm #{symlink}`
+        end
+        # Might be like:
+        # "images/5cf5db49df178f9357603f945752a1ef.png":
+        # "images/5cf5db49df178f9357603f945752a1ef-033650e1d6193b70d59bb60e773f47b6d9aefdd56abc7cc.png"
+        # need to cd to directory and then symlink
+        target_sub_path, _divider, target_filename = target.rpartition("/")
+        _symlink_sub_path, _divider, symlink_filename = symlink.rpartition("/")
+        puts "React On Rails: Symlinking \"#{target}\" to \"#{symlink}\""
+        dest_path = File.join(@assets_path, target_sub_path)
+        FileUtils.chdir(dest_path) do
+          File.symlink(target_filename, symlink_filename)
+        end
+      end
+    end
+
+    def symlink_non_digested_assets
+      # digest ==> means that the file has a unique sha so the browser will load a new copy.
+      # Webpack's CSS extract-text-plugin copies digested asset files over to directory where we put
+      # we deploy the webpack compiled JS file. Since Rails will deploy the image files in this
+      # directory with a digest, then the files are essentially "double-digested" and the CSS
+      # references from webpack's CSS would be invalid. The fix is to symlink the double-digested
+      # file back to the original digested name, and make a similar symlink for the gz version.
+      if @symlink_non_digested_assets_regex
+        manifest_glob = Dir.glob(@assets_path.join(".sprockets-manifest-*.json")) +
+                        Dir.glob(@assets_path.join("manifest-*.json"))
+        if manifest_glob.empty?
+          puts "Warning: React On Rails: expected to find .sprockets-manifest-*.json or manifest-*.json "\
+                   "at #{@assets_path}, but found none. Canceling symlinking tasks."
+          return -1
+        end
+        manifest_path = manifest_glob.first
+        manifest_data = JSON.load(File.new(manifest_path))
+
+        # We realize that we're copying other Rails assets that match the regexp, but this just
+        # means that we'd be exposing the original, undigested names.
+        manifest_data["assets"].each do |original_filename, rails_digested_filename|
+          # TODO: we should remove any original_filename that is NOT in the webpack deploy folder.
+          next unless original_filename =~ @symlink_non_digested_assets_regex
+          # We're symlinking from the digested filename back to the original filename which has
+          # already been symlinked by Webpack
+          symlink_file(rails_digested_filename, original_filename)
+
+          # We want the gz ones as well
+          symlink_file("#{rails_digested_filename}.gz", "#{original_filename}.gz")
+        end
+      end
+    end
+
+    def delete_broken_symlinks
+      Dir.glob(@assets_path.join("*")).each do |filename|
+        next unless File.lstat(filename).symlink?
+        begin
+          target = File.readlink(filename)
+        rescue
+          puts "React on Rails: Warning: your platform doesn't support File::readlink method." /
+               "Skipping broken link check."
+          break
+        end
+        path = Pathname.new(File.dirname(filename))
+        target_path = path.join(target)
+        unless File.exist?(target_path)
+          puts "React on Rails: Deleting broken link: #{filename}"
+          File.delete(filename)
+        end
+      end
+    end
+
+    def clobber
+      dir = Rails.root.join(@generated_assets_dir)
+      if dir.present? && File.directory?(dir)
+        puts "Deleting files in directory #{dir}"
+        FileUtils.rm_r(Dir.glob(Rails.root.join("#{@generated_assets_dir}/*")))
+      else
+        puts "Could not find generated_assets_dir #{dir} defined in react_on_rails initializer: "
+      end
+    end
+  end
+end

data/lib/react_on_rails/configuration.rb

@@ -57,7 +57,7 @@ module ReactOnRails
       webpack_generated_files: [],
       rendering_extension: nil,
       server_render_method: "",
-      symlink_non_digested_assets_regex: /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg)/,
+      symlink_non_digested_assets_regex: /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg|map)/,
       npm_build_test_command: "",
       npm_build_production_command: ""
     )

data/lib/react_on_rails/server_rendering_pool.rb

@@ -16,6 +16,7 @@ module ReactOnRails
         end
       end
 
+      # rubocop:disable Style/MethodMissing
       def method_missing(sym, *args, &block)
         pool.send sym, *args, &block
       end

data/lib/react_on_rails/test_helper/ensure_assets_compiled.rb

@@ -45,7 +45,7 @@ Detected are the following stale generated files:
 #{stale_files.join("\n")}
 
 React on Rails will ensure your JavaScript generated files are up to date, using your
-/client level package.json `build:test` command.
+/client level package.json `#{ReactOnRails.configuration.npm_build_test_command}` command.
 
         MSG
       end

data/lib/react_on_rails/utils.rb

@@ -11,6 +11,7 @@ module ReactOnRails
     end
 
     def self.last_process_completed_successfully?
+      # rubocop:disable Style/NumericPredicate
       $CHILD_STATUS.exitstatus == 0
     end
 

data/lib/react_on_rails/version.rb

@@ -1,4 +1,4 @@
 # frozen_string_literal: true
 module ReactOnRails
-  VERSION = "6.0.5".freeze
+  VERSION = "6.1.0".freeze
 end

data/lib/react_on_rails/version_checker.rb

@@ -3,6 +3,7 @@ module ReactOnRails
   # against each otherat runtime.
   class VersionChecker
     attr_reader :node_package_version, :logger
+    MAJOR_VERSION_REGEX = /(\d+)\.?/
 
     def self.build
       new(NodePackageVersion.build, Rails.logger)
@@ -38,7 +39,7 @@ module ReactOnRails
     end
 
     def gem_major_version
-      gem_version.match(/(\d+)\./)[1]
+      gem_version.match(MAJOR_VERSION_REGEX)[1]
     end
 
     class NodePackageVersion
@@ -66,7 +67,7 @@ module ReactOnRails
 
       def major
         return if relative_path?
-        raw.match(/(\d+)\./)[1]
+        raw.match(MAJOR_VERSION_REGEX)[1]
       end
 
       private

data/lib/tasks/assets.rake

@@ -1,72 +1,15 @@
-module ReactOnRails
-  class << self
-    def assets_path
-      dir = File.join(Rails.configuration.paths['public'].first,
-                      Rails.configuration.assets.prefix)
-      Pathname.new(dir)
-    end
-
-    def symlink_file(target, symlink)
-      target_path = ReactOnRails::assets_path.join(target)
-      symlink_path = ReactOnRails::assets_path.join(symlink)
-      if not File.exist?(symlink_path) or File.lstat(symlink_path).symlink?
-        if File.exist?(target_path)
-          puts "React On Rails: Symlinking #{target_path} to #{symlink_path}"
-          `cd #{ReactOnRails::assets_path} && ln -s #{target} #{symlink}`
-        end
-      else
-        puts "React On Rails: File #{symlink_path} already exists. Failed to symlink #{target_path}"
-      end
-    end
-  end
-end
+require "react_on_rails/assets_precompile"
 
 namespace :react_on_rails do
   namespace :assets do
     desc "Creates non-digested symlinks for the assets in the public asset dir"
     task symlink_non_digested_assets: :"assets:environment" do
-      if ReactOnRails.configuration.symlink_non_digested_assets_regex
-        manifest_glob = Dir.glob(ReactOnRails::assets_path.join(".sprockets-manifest-*.json")) +
-            Dir.glob(ReactOnRails::assets_path.join("manifest-*.json"))
-        if manifest_glob.empty?
-          puts "Warning: React On Rails: expected to find .sprockets-manifest-*.json or manifest-*.json "\
-                   "at #{ReactOnRails::assets_path}, but found none. Canceling symlinking tasks."
-          next
-        end
-        manifest_path = manifest_glob.first
-        manifest_data = JSON.load(File.new(manifest_path))
-
-        manifest_data["assets"].each do |logical_path, digested_path|
-          regex = ReactOnRails.configuration.symlink_non_digested_assets_regex
-          if logical_path =~ regex
-            digested_gz_path = "#{digested_path}.gz"
-            logical_gz_path = "#{logical_path}.gz"
-            ReactOnRails::symlink_file(digested_path, logical_path)
-            ReactOnRails::symlink_file(digested_gz_path, logical_gz_path)
-          end
-        end
-      end
+      ReactOnRails::AssetsPrecompile.new.symlink_non_digested_assets
     end
 
     desc "Cleans all broken symlinks for the assets in the public asset dir"
     task delete_broken_symlinks: :"assets:environment" do
-      Dir.glob(ReactOnRails::assets_path.join("*")).each do |filename|
-        if File.lstat(filename).symlink?
-          begin
-            target = File.readlink(filename)
-          rescue
-            puts "React on Rails: Warning: your platform doesn't support File::readlink method."/
-                 "Skipping broken link check."
-            return
-          end
-          path = Pathname.new(File.dirname(filename))
-          target_path = path.join(target)
-          unless File.exist?(target_path)
-            puts "React on Rails: Deleting broken link: #{filename}"
-            File.delete(filename)
-          end
-        end
-      end
+      ReactOnRails::AssetsPrecompile.new.delete_broken_symlinks
     end
 
     # In this task, set prerequisites for the assets:precompile task
@@ -93,13 +36,7 @@ sh "cd client && `ReactOnRails.configuration.npm_build_production_command`"
 
     desc "Delete assets created with webpack, in the generated assetst directory (/app/assets/webpack)"
     task clobber: :environment do
-      dir = Rails.root.join(ReactOnRails.configuration.generated_assets_dir)
-      if dir.present? && File.directory?(dir)
-        puts "Deleting files in directory #{dir}"
-        rm_r Dir.glob(Rails.root.join("#{ReactOnRails.configuration.generated_assets_dir}/*"))
-      else
-        puts "Could not find dir #{dir}"
-      end
+      ReactOnRails::AssetsPrecompile.new.clobber
     end
   end
 end
@@ -107,10 +44,10 @@ end
 # These tasks run as pre-requisites of assets:precompile.
 # Note, it's not possible to refer to ReactOnRails configuration values at this point.
 Rake::Task["assets:precompile"]
-    .clear_prerequisites
-    .enhance([:environment, "react_on_rails:assets:compile_environment"])
-    .enhance do
-      Rake::Task["react_on_rails:assets:symlink_non_digested_assets"].invoke
-      Rake::Task["react_on_rails:assets:delete_broken_symlinks"].invoke
-    end
+  .clear_prerequisites
+  .enhance([:environment, "react_on_rails:assets:compile_environment"])
+  .enhance do
+    Rake::Task["react_on_rails:assets:symlink_non_digested_assets"].invoke
+    Rake::Task["react_on_rails:assets:delete_broken_symlinks"].invoke
+  end