Props, I<%= component_name %>State> {
25 | render() {
26 | return (
27 |
28 | <% attributes.each do |attribute| -%>
29 | <%= attribute[:name].titleize %>: {this.props.<%= attribute[:name].camelize(:lower) %>}
30 | <% end -%>
31 |
32 | );
33 | }
34 | }
35 |
36 | <%= file_footer %>
37 |
--------------------------------------------------------------------------------
/lib/generators/templates/react_server_rendering.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | # To render React components in production, precompile the server rendering manifest:
4 | Rails.application.config.assets.precompile += ["server_rendering.js"]
5 |
--------------------------------------------------------------------------------
/lib/generators/templates/server_rendering.js:
--------------------------------------------------------------------------------
1 | //= require react-server
2 | //= require react_ujs
3 | //= require ./components
4 | //
5 | // By default, this file is loaded for server-side rendering.
6 | // It should require your components and any dependencies.
7 |
--------------------------------------------------------------------------------
/lib/generators/templates/server_rendering_pack.js:
--------------------------------------------------------------------------------
1 | // By default, this pack is loaded for server-side rendering.
2 | // It must expose react_ujs as `ReactRailsUJS` and prepare a require context.
3 | var componentRequireContext = require.context("components", true);
4 | var ReactRailsUJS = require("react_ujs");
5 | ReactRailsUJS.useContext(componentRequireContext);
6 |
--------------------------------------------------------------------------------
/lib/react-rails.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "react"
4 | require "react/jsx"
5 | require "react/rails"
6 | require "react/server_rendering"
7 |
8 | module React
9 | module Rails
10 | autoload :TestHelper, "react/rails/test_helper"
11 | end
12 | end
13 |
--------------------------------------------------------------------------------
/lib/react.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | # Recursively camelize `props`, returning a new Hash
5 | # @param props [Object] If it's a Hash or Array, it will be recursed. Otherwise it will be returned.
6 | # @return [Hash] a new hash whose keys are camelized strings
7 | def self.camelize_props(props)
8 | props_as_json = props.as_json
9 |
10 | case props_as_json
11 | when Hash
12 | props_as_json.each_with_object({}) do |(key, value), new_props|
13 | new_key = key.to_s.camelize(:lower)
14 | new_value = camelize_props(value)
15 | new_props[new_key] = new_value
16 | end
17 | when Array
18 | props_as_json.map { |item| camelize_props(item) }
19 | else
20 | props_as_json
21 | end
22 | end
23 | end
24 |
--------------------------------------------------------------------------------
/lib/react/jsx.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "execjs"
4 | require "react/jsx/processor"
5 | require "react/jsx/template"
6 | require "react/jsx/jsx_transformer"
7 | require "react/jsx/babel_transformer"
8 | require "react/jsx/sprockets_strategy"
9 | require "rails"
10 |
11 | module React
12 | module JSX
13 | DEFAULT_TRANSFORMER = BabelTransformer
14 | mattr_accessor :transform_options, :transformer_class, :transformer
15 |
16 | # You can assign `config.react.jsx_transformer_class = `
17 | # to provide your own transformer. It must implement:
18 | # - #initialize(options)
19 | # - #transform(code) => new code
20 | self.transformer_class = DEFAULT_TRANSFORMER
21 |
22 | # @param code [String] JSX code to transform into JavaScript
23 | # @return [String] plain, browser-ready JavaScript code
24 | def self.transform(code)
25 | self.transformer ||= transformer_class.new(transform_options)
26 | self.transformer.transform(code)
27 | end
28 | end
29 | end
30 |
--------------------------------------------------------------------------------
/lib/react/jsx/babel_transformer.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "babel/transpiler"
4 | module React
5 | module JSX
6 | # A {React::JSX}-compliant transformer which uses `Babel::Transpiler` to transform JSX.
7 | class BabelTransformer
8 | DEPRECATED_OPTIONS = %i[harmony strip_types asset_path].freeze
9 | DEFAULT_TRANSFORM_OPTIONS = { blacklist: ["spec.functionName", "validation.react", "strict"] }.freeze
10 | def initialize(options)
11 | if (options.keys & DEPRECATED_OPTIONS).any?
12 | ActiveSupport::Deprecation.warn(
13 | <<-MSG
14 | Setting config.react.jsx_transform_options for :harmony, :strip_types, and :asset_path keys is now deprecated and has no effect with the default Babel Transformer.
15 | Please use new Babel Transformer options :whitelist, :plugin instead.
16 | MSG
17 | )
18 | end
19 |
20 | @transform_options = DEFAULT_TRANSFORM_OPTIONS.merge(options)
21 | end
22 |
23 | def transform(code)
24 | Babel::Transpiler.transform(code, @transform_options)["code"]
25 | end
26 | end
27 | end
28 | end
29 |
--------------------------------------------------------------------------------
/lib/react/jsx/jsx_transformer.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module JSX
5 | # A {React::JSX}-compliant transformer which uses the deprecated `JSXTransformer.js` to transform JSX.
6 | class JSXTransformer
7 | DEFAULT_ASSET_PATH = "JSXTransformer.js"
8 |
9 | def initialize(options)
10 | @transform_options = {
11 | stripTypes: options.fetch(:strip_types, false),
12 | harmony: options.fetch(:harmony, false)
13 | }
14 |
15 | @asset_path = options.fetch(:asset_path, DEFAULT_ASSET_PATH)
16 |
17 | # If execjs uses therubyracer, there is no 'global'. Make sure
18 | # we have it so JSX script can work properly.
19 | js_code = "var global = global || this;#{jsx_transform_code}"
20 | @context = ExecJS.compile(js_code)
21 | end
22 |
23 | def transform(code)
24 | result = @context.call("JSXTransformer.transform", code, @transform_options)
25 | result["code"]
26 | end
27 |
28 | # search for transformer file using sprockets - allows user to override
29 | # this file in their own application
30 | def jsx_transform_code
31 | ::Rails.application.assets[@asset_path].to_s
32 | end
33 | end
34 | end
35 | end
36 |
--------------------------------------------------------------------------------
/lib/react/jsx/processor.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module JSX
5 | # A Sprockets 3+-compliant processor
6 | class Processor
7 | def self.call(input)
8 | JSX.transform(input[:data])
9 | end
10 | end
11 | end
12 | end
13 |
--------------------------------------------------------------------------------
/lib/react/jsx/sprockets_strategy.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module JSX
5 | # Depending on the Sprockets version,
6 | # attach JSX transformation the the Sprockets environment.
7 | #
8 | # You can override it with `config.sprockets_strategy`
9 | # @example Specifying a Sprockets strategy
10 | # app.config.react.sprockets_strategy = :register_engine
11 | #
12 | # @example Opting out of any Sprockets strategy
13 | # app.config.react.sprockets_strategy = false
14 | #
15 | module SprocketsStrategy
16 | module_function
17 |
18 | # @param [Sprockets::Environment] the environment to attach JSX to
19 | # @param [Symbol, Nil] A strategy name, or `nil` to detect a strategy
20 | def attach_with_strategy(sprockets_env, strategy_or_nil)
21 | strategy = strategy_or_nil || detect_strategy
22 | public_send(strategy, sprockets_env)
23 | end
24 |
25 | # @return [Symbol] based on the environment, return a method name to call with the sprockets environment
26 | def detect_strategy
27 | sprockets_version = Gem::Version.new(Sprockets::VERSION)
28 | if sprockets_version >= Gem::Version.new("4.a")
29 | :register_processors
30 | elsif sprockets_version >= Gem::Version.new("3.0.0")
31 | :register_engine_with_mime_type
32 | else
33 | :register_engine
34 | end
35 | end
36 |
37 | def register_engine(sprockets_env)
38 | sprockets_env.register_engine(".jsx", React::JSX::Template)
39 | end
40 |
41 | def register_engine_with_mime_type(sprockets_env)
42 | sprockets_env.register_engine(".jsx", React::JSX::Processor, mime_type: "application/javascript",
43 | silence_deprecation: true)
44 | end
45 |
46 | def register_processors(sprockets_env)
47 | sprockets_env.register_mime_type("application/jsx", extensions: [".jsx", ".js.jsx", ".es.jsx", ".es6.jsx"])
48 | sprockets_env.register_mime_type("application/jsx+coffee", extensions: [".jsx.coffee", ".js.jsx.coffee"])
49 | sprockets_env.register_transformer("application/jsx", "application/javascript", React::JSX::Processor)
50 | sprockets_env.register_transformer("application/jsx+coffee", "application/jsx",
51 | Sprockets::CoffeeScriptProcessor)
52 | sprockets_env.register_preprocessor("application/jsx",
53 | Sprockets::DirectiveProcessor.new(comments: ["//", ["/*", "*/"]]))
54 | sprockets_env.register_preprocessor("application/jsx+coffee",
55 | Sprockets::DirectiveProcessor.new(comments: ["#", ["###", "###"]]))
56 | end
57 | end
58 | end
59 | end
60 |
--------------------------------------------------------------------------------
/lib/react/jsx/template.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "tilt"
4 |
5 | module React
6 | module JSX
7 | # Sprockets 2-compliant processor
8 | class Template < Tilt::Template
9 | self.default_mime_type = "application/javascript"
10 |
11 | def prepare; end
12 |
13 | def evaluate(_scope, _locals)
14 | @evaluate ||= JSX.transform(data)
15 | end
16 | end
17 | end
18 | end
19 |
--------------------------------------------------------------------------------
/lib/react/rails.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "react/rails/asset_variant"
4 | require "react/rails/railtie"
5 | require "react/rails/controller_lifecycle"
6 | require "react/rails/version"
7 | require "react/rails/component_mount"
8 | require "react/rails/view_helper"
9 | require "react/rails/controller_renderer"
10 |
--------------------------------------------------------------------------------
/lib/react/rails/asset_variant.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | # This class accepts some options for which build you want, then exposes where you can find
6 | # them. In general, these paths should be added to the sprockets environment.
7 | class AssetVariant
8 | GEM_ROOT = Pathname.new("../../../../").expand_path(__FILE__)
9 | # @return [String] "production" or "development"
10 | attr_reader :react_build
11 |
12 | # @return [String] The path which contains the specified React.js build as "react.js"
13 | attr_reader :react_directory
14 |
15 | # @return [String] The path which contains the JSX Transformer
16 | attr_reader :jsx_directory
17 |
18 | # @param [Hash] Options for the asset variant
19 | # @option variant [Symbol] if `:production`, use the minified React.js build
20 | def initialize(options = {})
21 | @react_build = options[:variant] == :production ? "production" : "development"
22 |
23 | @react_directory = GEM_ROOT.join("lib/assets/react-source/").join(@react_build).to_s
24 | @jsx_directory = GEM_ROOT.join("lib/assets/javascripts/").to_s
25 | end
26 | end
27 | end
28 | end
29 |
--------------------------------------------------------------------------------
/lib/react/rails/component_mount.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | # This is the default view helper implementation.
6 | # It just inserts HTML into the DOM (see {#react_component}).
7 | #
8 | # You can extend this class or provide your own implementation
9 | # by assigning it to `config.react.view_helper_implementation`.
10 | class ComponentMount
11 | include ActionView::Helpers::TagHelper
12 | include ActionView::Helpers::TextHelper
13 | attr_accessor :output_buffer
14 |
15 | mattr_accessor :camelize_props_switch
16 |
17 | def initialize
18 | @cache_ids = []
19 | end
20 |
21 | # {ControllerLifecycle} calls these hooks
22 | # You can use them in custom helper implementations
23 | def setup(controller)
24 | @controller = controller
25 | end
26 |
27 | def teardown(controller); end
28 |
29 | # Render a UJS-type HTML tag annotated with data attributes, which
30 | # are used by react_ujs to actually instantiate the React component
31 | # on the client.
32 | def react_component(name, props = {}, options = {}, &block)
33 | options = { tag: options } if options.is_a?(Symbol)
34 | props = React.camelize_props(props) if options.fetch(:camelize_props, camelize_props_switch)
35 |
36 | prerender_options = options[:prerender]
37 | block = proc { concat(prerender_component(name, props, prerender_options)) } if prerender_options
38 |
39 | html_options = generate_html_options(name, options, props, prerender_options)
40 |
41 | rendered_tag(html_options, &block)
42 | end
43 |
44 | private
45 |
46 | # If this controller has checked out a renderer, use that one.
47 | # Otherwise, use {React::ServerRendering} directly (which will check one out for this rendering).
48 | def prerender_component(component_name, props, prerender_options)
49 | renderer = @controller.try(:react_rails_prerenderer) || React::ServerRendering
50 | renderer.render(component_name, props, prerender_options)
51 | end
52 |
53 | def generate_html_options(name, options, props, prerender_options)
54 | html_options = options.reverse_merge(data: {})
55 |
56 | unless prerender_options == :static
57 | html_options[:data].tap do |data|
58 | data[:react_class] = name
59 | data[:react_props] = (props.is_a?(String) ? props : props.to_json)
60 | data[:hydrate] = "t" if prerender_options
61 |
62 | num_components = @cache_ids.count { |c| c.start_with? name }
63 | data[:react_cache_id] = "#{name}-#{num_components}"
64 | end
65 | end
66 |
67 | html_options
68 | end
69 |
70 | def rendered_tag(html_options, &block)
71 | html_tag = html_options[:tag] || :div
72 |
73 | # remove internally used properties so they aren't rendered to DOM
74 | html_option_to_use = html_options.except(:tag, :prerender, :camelize_props)
75 |
76 | tag = content_tag(html_tag, "", html_option_to_use, &block)
77 | return tag unless React::ServerRendering.renderer_options[:replay_console]
78 |
79 | # Grab the server-rendered console replay script
80 | # and move it _outside_ the container div
81 | tag.sub!(%r{\n()$}m, '\1')
82 | tag.html_safe
83 | end
84 | end
85 | end
86 | end
87 |
--------------------------------------------------------------------------------
/lib/react/rails/controller_lifecycle.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | # This module is included into ActionController so that
6 | # per-request hooks can be called in the view helper.
7 | module ControllerLifecycle
8 | extend ActiveSupport::Concern
9 |
10 | included do
11 | # use both names to support Rails 3..5
12 | around_action_with_fallback = respond_to?(:around_action) ? :around_action : :around_filter
13 | public_send(around_action_with_fallback, :use_react_component_helper)
14 | attr_reader :__react_component_helper
15 | end
16 |
17 | module ClassMethods
18 | # Call this in the controller to check out a prerender for the whole request.
19 | # You can access the renderer with {#react_rails_prerenderer}.
20 | def per_request_react_rails_prerenderer
21 | around_action_with_fallback = respond_to?(:around_action) ? :around_action : :around_filter
22 | public_send(around_action_with_fallback, :per_request_react_rails_prerenderer)
23 | end
24 | end
25 |
26 | # Instantiate the ViewHelper implementation and call its #setup method
27 | # then let the controller action run,
28 | # then call the ViewHelper implementation's #teardown method
29 | def use_react_component_helper
30 | new_helper = React::Rails::ViewHelper.helper_implementation_class.new
31 | new_helper.setup(self)
32 | @__react_component_helper = new_helper
33 | yield
34 | @__react_component_helper.teardown(self)
35 | end
36 |
37 | # If you want a per-request renderer, add this method as an around-action
38 | #
39 | # (`.per_request_react_rails_prerenderer` does this for you)
40 | # @example Having one renderer instance for each controller action
41 | # around_action :per_request_react_rails_prerenderer
42 | def per_request_react_rails_prerenderer
43 | React::ServerRendering.with_renderer do |renderer|
44 | @__react_rails_prerenderer = renderer
45 | yield
46 | end
47 | end
48 |
49 | # An instance of a server renderer, for use during this request
50 | def react_rails_prerenderer
51 | @__react_rails_prerenderer
52 | end
53 | end
54 | end
55 | end
56 |
--------------------------------------------------------------------------------
/lib/react/rails/controller_renderer.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | # A renderer class suitable for `ActionController::Renderers`.
6 | # It is associated to `:component` in the Railtie.
7 | #
8 | # It is prerendered by default with {React::ServerRendering}.
9 | # Set options[:prerender] to `false` to disable prerendering.
10 | #
11 | # @example Rendering a component from a controller
12 | # class TodosController < ApplicationController
13 | # def index
14 | # @todos = Todo.all
15 | # render component: 'TodoList', props: { todos: @todos }, tag: 'span', class: 'todo'
16 | # end
17 | # end
18 | class ControllerRenderer
19 | include React::Rails::ViewHelper
20 | include ActionView::Helpers::TagHelper
21 | include ActionView::Helpers::TextHelper
22 |
23 | attr_accessor :output_buffer
24 |
25 | def initialize(options = {})
26 | controller = options[:controller]
27 | @__react_component_helper = controller.__react_component_helper
28 | end
29 |
30 | # @return [String] HTML for `component_name` with `options[:props]`
31 | def call(component_name, options, &block)
32 | props = options.fetch(:props, {})
33 | options = default_options.merge(options.slice(:data, :aria, :tag, :class, :id, :prerender, :camelize_props))
34 | react_component(component_name, props, options, &block)
35 | end
36 |
37 | private
38 |
39 | def default_options
40 | { prerender: true }
41 | end
42 | end
43 | end
44 | end
45 |
--------------------------------------------------------------------------------
/lib/react/rails/test_helper.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | module TestHelper
6 | extend ActiveSupport::Concern
7 |
8 | # assert react_component render
9 | #
10 | # assert_react_component("HelloWorld") do |props|
11 | # assert_equal "Hello world", props[:message]
12 | # end
13 | def assert_react_component(name)
14 | assert_select "div[data-react-class=?]", name do |dom|
15 | if block_given?
16 | props = JSON.parse(dom.attr("data-react-props"))
17 | props.deep_symbolize_keys!
18 |
19 | yield(props)
20 | end
21 | end
22 | end
23 | end
24 | end
25 | end
26 |
--------------------------------------------------------------------------------
/lib/react/rails/version.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | # If you change this, make sure to update VERSIONS.md
6 | # and republish the UJS by updating package.json and `bundle exec rake ujs:publish`
7 | VERSION = "3.2.1"
8 | end
9 | end
10 |
--------------------------------------------------------------------------------
/lib/react/rails/view_helper.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module Rails
5 | module ViewHelper
6 | # This class will be used for inserting tags into HTML.
7 | # It should implement:
8 | # - #setup(controller_instance)
9 | # - #teardown(controller_instance)
10 | # - #react_component(name, props, options &block)
11 | # The default is {React::Rails::ComponentMount}
12 | mattr_accessor :helper_implementation_class
13 |
14 | # Render a React component into the view
15 | # using the {helper_implementation_class}
16 | #
17 | # If called during a Rails controller-managed request, use the instance
18 | # created by the controller.
19 | #
20 | # Otherwise, make a new instance.
21 | def react_component(*args, &block)
22 | helper_obj = @__react_component_helper ||= helper_implementation_class.new
23 | helper_obj.react_component(*args) { capture(&block) if block }
24 | end
25 | end
26 | end
27 | end
28 |
--------------------------------------------------------------------------------
/lib/react/server_rendering.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "connection_pool"
4 | require "react/server_rendering/exec_js_renderer"
5 | require "react/server_rendering/bundle_renderer"
6 |
7 | module React
8 | module ServerRendering
9 | mattr_accessor :renderer, :renderer_options,
10 | :pool_size, :pool_timeout
11 |
12 | self.renderer_options = {}
13 |
14 | # Discard the old ConnectionPool & create a new one.
15 | # This will clear all state such as loaded code, JS VM state, or options.
16 | # @return [void]
17 | def self.reset_pool
18 | options = { size: pool_size, timeout: pool_timeout }
19 | @pool = ConnectionPool.new(options) { renderer.new(renderer_options) }
20 | end
21 |
22 | # Check a renderer out of the pool and use it to render the component.
23 | # @param component_name [String] Component identifier, looked up by UJS
24 | # @param props [String, Hash] Props for this component
25 | # @param prerender_options [Hash] Renderer-specific options
26 | # @return [String] Prerendered HTML from `component_name`
27 | def self.render(component_name, props, prerender_options)
28 | @pool.with do |renderer|
29 | renderer.render(component_name, props, prerender_options)
30 | end
31 | end
32 |
33 | # Yield a renderer for an arbitrary block
34 | def self.with_renderer(&block)
35 | @pool.with(&block)
36 | end
37 |
38 | # Raised when something went wrong during server rendering.
39 | class PrerenderError < RuntimeError
40 | def initialize(component_name, props, js_message)
41 | message = ["Encountered error \"#{js_message.inspect}\" when prerendering #{component_name} with #{props}",
42 | js_message.backtrace.join("\n")].join("\n")
43 | super(message)
44 | end
45 | end
46 | end
47 | end
48 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/bundle_renderer/console_polyfill.js:
--------------------------------------------------------------------------------
1 | var console = { history: [] };
2 | ['error', 'log', 'info', 'warn'].forEach(function (fn) {
3 | console[fn] = function () {
4 | console.history.push({level: fn, arguments: Array.prototype.slice.call(arguments)});
5 | };
6 | });
7 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/bundle_renderer/console_replay.js:
--------------------------------------------------------------------------------
1 | (function (history) {
2 | if (history && history.length > 0) {
3 | result += '\n';
4 | history.forEach(function (msg) {
5 | result += '\nconsole.' + msg.level + '.apply(console, ' + JSON.stringify(msg.arguments) + ');';
6 | });
7 | result += '\n';
8 | }
9 | })(console.history);
10 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/bundle_renderer/console_reset.js:
--------------------------------------------------------------------------------
1 | if (typeof console !== "undefined" && console.history) {
2 | console.history = [];
3 | }
4 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/bundle_renderer/timeout_polyfill.js:
--------------------------------------------------------------------------------
1 | function getStackTrace() {
2 | var stack;
3 | try {
4 | throw new Error('');
5 | }
6 | catch (error) {
7 | stack = error.stack || '';
8 | }
9 | stack = stack.split('\\n').map(function (line) {
10 | return line.trim();
11 | });
12 | return stack.splice(stack[0] == 'Error' ? 2 : 1);
13 | };
14 |
15 | function printError(functionName){
16 | console.error(functionName + ' is not defined for execJS. See https://github.com/sstephenson/execjs#faq. Note babel-polyfill may call this.');
17 | console.error(getStackTrace().join('\\n'));
18 | };
19 |
20 | function setTimeout() {
21 | printError('setTimeout');
22 | };
23 |
24 | function clearTimeout() {
25 | printError('clearTimeout');
26 | };
27 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/environment_container.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module ServerRendering
5 | # Return asset contents by getting them from a Sprockets::Environment instance.
6 | #
7 | # This is good for Rails development but bad for production because:
8 | # - It compiles the asset lazily, not ahead-of-time
9 | # - Rails 5 / Sprockets 3 doesn't expose a Sprockets::Environment in production.
10 | class EnvironmentContainer
11 | def initialize
12 | @environment = ::Rails.application.assets
13 | end
14 |
15 | def find_asset(logical_path)
16 | @environment[logical_path].to_s
17 | end
18 | end
19 | end
20 | end
21 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/exec_js_renderer.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module ServerRendering
5 | # A bare-bones renderer for React.js + Exec.js
6 | # - Depends on global ReactRailsUJS in the ExecJS context
7 | # - No Rails dependency
8 | # - No browser concerns
9 | class ExecJSRenderer
10 | # @return [ExecJS::Runtime::Context] The JS context for this renderer
11 | attr_reader :context
12 |
13 | def initialize(options = {})
14 | js_code = options[:code] || raise("Pass `code:` option to instantiate a JS context!")
15 | full_code = GLOBAL_WRAPPER + js_code
16 | # File.write("./test/dummy/tmp/latest_js_context.js", full_code)
17 | @context = ExecJS.compile(full_code)
18 | end
19 |
20 | def render(component_name, props, prerender_options)
21 | js_executed_before = before_render(component_name, props, prerender_options)
22 | js_executed_after = after_render(component_name, props, prerender_options)
23 | js_main_section = main_render(component_name, props, prerender_options)
24 | render_from_parts(js_executed_before, js_main_section, js_executed_after)
25 | rescue ExecJS::ProgramError => err
26 | raise React::ServerRendering::PrerenderError.new(component_name, props, err)
27 | end
28 |
29 | # Hooks for inserting JS before/after rendering
30 | def before_render(_component_name, _props, _prerender_options)
31 | ""
32 | end
33 |
34 | def after_render(_component_name, _props, _prerender_options)
35 | ""
36 | end
37 |
38 | # Handle Node.js & other ExecJS contexts
39 | GLOBAL_WRAPPER = <<-JS
40 | var global = global || this;
41 | var self = self || this;
42 | JS
43 |
44 | private
45 |
46 | def render_from_parts(before, main, after)
47 | js_code = compose_js(before, main, after)
48 | @context.eval(js_code).html_safe
49 | end
50 |
51 | def main_render(component_name, props, prerender_options)
52 | render_function = prerender_options.fetch(:render_function, "renderToString")
53 | "this.ReactRailsUJS.serverRender('#{render_function}', '#{component_name}', #{props})"
54 | end
55 |
56 | def compose_js(before, main, after)
57 | <<-JS
58 | (function () {
59 | #{before}
60 | var result = #{main};
61 | #{after}
62 | return result;
63 | })()
64 | JS
65 | end
66 | end
67 | end
68 | end
69 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/manifest_container.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module ServerRendering
5 | # Get asset content by reading the compiled file from disk using a Sprockets::Manifest.
6 | #
7 | # This is good for Rails production when assets are compiled to public/assets
8 | # but sometimes, they're compiled to other directories (or other servers)
9 | class ManifestContainer
10 | def initialize
11 | @manifest = ::Rails.application.assets_manifest
12 | end
13 |
14 | def find_asset(logical_path)
15 | asset_path = @manifest.assets[logical_path] || raise(
16 | "No compiled asset for #{logical_path}, was it precompiled?"
17 | )
18 | asset_full_path = ::Rails.root.join("public", @manifest.dir, asset_path)
19 | File.read(asset_full_path)
20 | end
21 |
22 | # sprockets-rails < 2.2.2 does not have `application.assets_manifest`
23 | def self.compatible?
24 | ::Rails.application.respond_to?(:assets_manifest)
25 | end
26 | end
27 | end
28 | end
29 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/separate_server_bundle_container.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "open-uri"
4 |
5 | module React
6 | module ServerRendering
7 | # Get a compiled file from Shakapacker's output path
8 | class SeparateServerBundleContainer
9 | def self.compatible?
10 | !!defined?(Shakapacker)
11 | end
12 |
13 | def find_asset(filename)
14 | asset_path = Shakapacker.config.public_output_path.join(filename).to_s
15 | File.read(asset_path)
16 | end
17 | end
18 | end
19 | end
20 |
--------------------------------------------------------------------------------
/lib/react/server_rendering/yaml_manifest_container.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module React
4 | module ServerRendering
5 | # Get asset content by reading the compiled file from disk using the generated manifest.yml file
6 | #
7 | # This is good for Rails production when assets are compiled to public/assets
8 | # but sometimes, they're compiled to other directories (or other servers)
9 | class YamlManifestContainer
10 | def initialize
11 | @assets = YAML.load_file(public_asset_path("manifest.yml"))
12 | end
13 |
14 | def find_asset(logical_path)
15 | asset_path = @assets[logical_path] || raise("No compiled asset for #{logical_path}, was it precompiled?")
16 | File.read(public_asset_path(asset_path))
17 | end
18 |
19 | def self.compatible?
20 | ::Rails::VERSION::MAJOR == 3
21 | end
22 |
23 | private
24 |
25 | def public_asset_path(asset_name)
26 | asset_path = File.join("public", ::Rails.application.config.assets.prefix, asset_name)
27 | ::Rails.root.join(asset_path)
28 | end
29 | end
30 | end
31 | end
32 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "react_ujs",
3 | "version": "3.2.1",
4 | "description": "Rails UJS for the react-rails gem",
5 | "repository": "reactjs/react-rails",
6 | "main": "react_ujs/index.js",
7 | "files": [
8 | "react_ujs"
9 | ],
10 | "scripts": {
11 | "build": "cd react_ujs && webpack"
12 | },
13 | "dependencies": {
14 | "@babel/preset-react": "^7.22.5",
15 | "css-loader": "^6.8.1",
16 | "css-minimizer-webpack-plugin": "^5.0.1",
17 | "mini-css-extract-plugin": "^2.7.6",
18 | "prop-types": "^15.8.1",
19 | "react": "^18.2.0",
20 | "react-dom": "^18.2.0",
21 | "react_ujs": "^2.7.1",
22 | "style-loader": "^3.3.3"
23 | },
24 | "devDependencies": {
25 | "webpack": "^5.74.0",
26 | "webpack-cli": "^5.0.1"
27 | },
28 | "packageManager": "yarn@1.22.21"
29 | }
30 |
--------------------------------------------------------------------------------
/react-builds/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "react-rails-builds",
3 | "version": "0.0.0",
4 | "description": "Prepares react-rails asset files",
5 | "main": "react.js",
6 | "scripts": {
7 | "build": "NODE_ENV=development webpack && NODE_ENV=production webpack"
8 | },
9 | "dependencies": {
10 | "create-react-class": "^15.6.2",
11 | "fast-text-encoding": "^1.0.6",
12 | "immutability-helper": "^2.4.0",
13 | "node-polyfill-webpack-plugin": "^2.0.1",
14 | "prop-types": "^15.6.0",
15 | "react": "^18.2.0",
16 | "react-dom": "^18.2.0",
17 | "webpack": "^5.74.0"
18 | },
19 | "packageManager": "yarn@1.22.21"
20 | }
21 |
--------------------------------------------------------------------------------
/react-builds/react-browser.js:
--------------------------------------------------------------------------------
1 | var React = require("react");
2 | var ReactDOM = require("react-dom");
3 | var createReactClass = require("create-react-class");
4 | var PropTypes = require("prop-types");
5 |
6 | window.React = React;
7 | window.ReactDOM = ReactDOM;
8 | window.createReactClass = createReactClass;
9 | window.PropTypes = PropTypes;
10 |
--------------------------------------------------------------------------------
/react-builds/react-server.js:
--------------------------------------------------------------------------------
1 | // polyfill TextEncoder & TextDecoder onto `util` b/c `node-util` polyfill doesn't include them
2 | // https://github.com/browserify/node-util/issues/46
3 | import util from 'util';
4 | import 'fast-text-encoding';
5 |
6 | Object.assign(util, { TextDecoder, TextEncoder });
7 |
8 | var React = require("react");
9 | var ReactDOMServer = require("react-dom/server");
10 | var createReactClass = require("create-react-class");
11 | var PropTypes = require("prop-types");
12 |
13 | global.React = React;
14 | global.ReactDOMServer = ReactDOMServer;
15 | global.createReactClass = createReactClass;
16 | global.PropTypes = PropTypes;
17 |
--------------------------------------------------------------------------------
/react-builds/webpack.config.js:
--------------------------------------------------------------------------------
1 | // Use `rake react:update` to build this bundle & copy files into the gem.
2 | // Be sure to set NODE_ENV=production or NODE_ENV=development before running
3 | const NodePolyfillPlugin = require('node-polyfill-webpack-plugin');
4 |
5 | module.exports = {
6 | context: __dirname,
7 | entry: {
8 | "react-browser": "./react-browser.js",
9 | "react-server": "./react-server.js",
10 | },
11 | output: {
12 | path: __dirname + "/build/" + process.env.NODE_ENV,
13 | filename: "[name].js",
14 | },
15 | plugins: [
16 | new NodePolyfillPlugin({
17 | excludeAliases: ['console', 'Buffer'],
18 | }),
19 | ],
20 | };
21 |
--------------------------------------------------------------------------------
/react-rails.gemspec:
--------------------------------------------------------------------------------
1 | # encoding: utf-8
2 |
3 | $:.push File.expand_path('../lib', __FILE__)
4 | require 'react/rails/version'
5 |
6 | Gem::Specification.new do |s|
7 | s.name = 'react-rails'
8 | s.version = React::Rails::VERSION
9 | s.summary = 'React integration for Ruby on Rails'
10 | s.description = 'Render components in views or controller actions. Server-side rendering powered by ExecJS. Transform JSX in the asset pipeline or use Shakapacker.'
11 | s.homepage = 'https://github.com/reactjs/react-rails'
12 | s.license = 'Apache-2.0'
13 |
14 | s.author = ['Paul O’Shannessy', 'Robert Mosolgo', 'Gregory Myers', 'Tsukuru Tanimichi']
15 | s.email = ['paul@oshannessy.com', 'rmosolgo@gmail.com', 'neonmd@hotmail.co.uk', 'info@ttanimichi.com']
16 |
17 | s.add_development_dependency 'appraisal'
18 | s.add_development_dependency 'bundler', '2.4.9'
19 | s.add_development_dependency 'codeclimate-test-reporter'
20 | s.add_development_dependency 'coffee-rails'
21 | s.add_development_dependency 'es5-shim-rails', '>= 2.0.5'
22 | s.add_development_dependency 'gem-release'
23 | s.add_development_dependency 'guard'
24 | s.add_development_dependency 'guard-minitest'
25 | s.add_development_dependency 'jbuilder'
26 | s.add_development_dependency 'listen', '~> 3.0.0'
27 | s.add_development_dependency 'capybara'
28 | s.add_development_dependency 'selenium-webdriver'
29 | s.add_development_dependency 'test-unit', '~> 2.5'
30 | s.add_development_dependency 'pry-byebug'
31 | s.add_development_dependency 'package_json'
32 | s.add_development_dependency 'rails', '~> 7.0.7', '>= 7.0.7.2'
33 | s.add_development_dependency 'turbo-rails'
34 | s.add_development_dependency 'minitest-retry'
35 |
36 | s.add_dependency 'connection_pool'
37 | s.add_dependency 'execjs'
38 | s.add_dependency 'railties', '>= 3.2'
39 | s.add_dependency 'tilt'
40 | s.add_dependency 'babel-transpiler', '>=0.7.0'
41 |
42 | s.files = Dir[
43 | 'lib/**/*',
44 | 'README.md',
45 | 'CHANGELOG.md',
46 | 'LICENSE'
47 | ]
48 |
49 | s.require_paths = ['lib']
50 | end
51 |
--------------------------------------------------------------------------------
/react_ujs/readme.md:
--------------------------------------------------------------------------------
1 | # react-rails UJS
2 |
3 | UJS driver for [`react-rails`](https://github.com/reactjs/react-rails). See the Ruby gem for license, documentation and changelog.
4 |
--------------------------------------------------------------------------------
/react_ujs/src/events/detect.js:
--------------------------------------------------------------------------------
1 | var nativeEvents = require("./native")
2 | var pjaxEvents = require("./pjax")
3 | var turbolinksEvents = require("./turbolinks")
4 | var turbolinksClassicDeprecatedEvents = require("./turbolinksClassicDeprecated")
5 | var turbolinksClassicEvents = require("./turbolinksClassic")
6 |
7 | // see what things are globally available
8 | // and setup event handlers to those things
9 | module.exports = function(ujs) {
10 | if (ujs.handleEvent) {
11 | // We're calling this a second time -- remove previous handlers
12 | if (typeof Turbolinks !== "undefined" && typeof Turbolinks.EVENTS !== "undefined") {
13 | turbolinksClassicEvents.teardown(ujs);
14 | }
15 | turbolinksEvents.teardown(ujs);
16 | turbolinksClassicDeprecatedEvents.teardown(ujs);
17 | pjaxEvents.teardown(ujs);
18 | nativeEvents.teardown(ujs);
19 | }
20 |
21 | if ('addEventListener' in window) {
22 | ujs.handleEvent = function(eventName, callback) {
23 | document.addEventListener(eventName, callback);
24 | };
25 | ujs.removeEvent = function(eventName, callback) {
26 | document.removeEventListener(eventName, callback);
27 | };
28 | } else {
29 | ujs.handleEvent = function(eventName, callback) {
30 | window.attachEvent(eventName, callback);
31 | };
32 | ujs.removeEvent = function(eventName, callback) {
33 | window.detachEvent(eventName, callback);
34 | };
35 | }
36 |
37 | // Detect which kind of events to set up:
38 | if (typeof Turbolinks !== 'undefined' && Turbolinks.supported) {
39 | if (typeof Turbolinks.EVENTS !== 'undefined') {
40 | // Turbolinks.EVENTS is in classic version 2.4.0+
41 | turbolinksClassicEvents.setup(ujs)
42 | } else if (typeof Turbolinks.controller !== "undefined") {
43 | // Turbolinks.controller is in version 5+
44 | turbolinksEvents.setup(ujs);
45 | } else {
46 | turbolinksClassicDeprecatedEvents.setup(ujs);
47 | }
48 | } else if (typeof $ !== "undefined" && typeof $.pjax === 'function') {
49 | pjaxEvents.setup(ujs);
50 | } else {
51 | nativeEvents.setup(ujs);
52 | }
53 | }
54 |
--------------------------------------------------------------------------------
/react_ujs/src/events/native.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | // Attach handlers to browser events to mount
3 | // (There are no unmount handlers since the page is destroyed on navigation)
4 | setup: function(ujs) {
5 | if ('addEventListener' in window) {
6 | ujs.handleEvent('DOMContentLoaded', ujs.handleMount);
7 | } else {
8 | // add support to IE8 without jQuery
9 | ujs.handleEvent('onload', ujs.handleMount);
10 | }
11 | },
12 |
13 | teardown: function(ujs) {
14 | ujs.removeEvent('DOMContentLoaded', ujs.handleMount);
15 | ujs.removeEvent('onload', ujs.handleMount);
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/react_ujs/src/events/pjax.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | // pjax support
3 | setup: function(ujs) {
4 | ujs.handleEvent('ready', ujs.handleMount);
5 | ujs.handleEvent('pjax:end', ujs.handleMount);
6 | ujs.handleEvent('pjax:beforeReplace', ujs.handleUnmount);
7 | },
8 |
9 | teardown: function(ujs) {
10 | ujs.removeEvent('ready', ujs.handleMount);
11 | ujs.removeEvent('pjax:end', ujs.handleMount);
12 | ujs.removeEvent('pjax:beforeReplace', ujs.handleUnmount);
13 | },
14 | }
15 |
--------------------------------------------------------------------------------
/react_ujs/src/events/turbolinks.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | // Turbolinks 5+ got rid of named events (?!)
3 | setup: function(ujs) {
4 | ujs.handleEvent('turbolinks:load', ujs.handleMount);
5 | },
6 |
7 | teardown: function(ujs) {
8 | ujs.removeEvent('turbolinks:load', ujs.handleMount);
9 | },
10 | }
11 |
--------------------------------------------------------------------------------
/react_ujs/src/events/turbolinksClassic.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | // Attach handlers to Turbolinks-Classic events
3 | // for mounting and unmounting components
4 | setup: function(ujs) {
5 | ujs.handleEvent(Turbolinks.EVENTS.CHANGE, ujs.handleMount);
6 | ujs.handleEvent(Turbolinks.EVENTS.BEFORE_UNLOAD, ujs.handleUnmount);
7 | },
8 | teardown: function(ujs) {
9 | ujs.removeEvent(Turbolinks.EVENTS.CHANGE, ujs.handleMount);
10 | ujs.removeEvent(Turbolinks.EVENTS.BEFORE_UNLOAD, ujs.handleUnmount);
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/react_ujs/src/events/turbolinksClassicDeprecated.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | // Before Turbolinks 2.4.0, Turbolinks didn't
3 | // have named events and didn't have a before-unload event.
4 | // Also, it didn't work with the Turbolinks cache, see
5 | // https://github.com/reactjs/react-rails/issues/87
6 | setup: function(ujs) {
7 | Turbolinks.pagesCached(0)
8 | ujs.handleEvent('page:change', ujs.handleMount);
9 | ujs.handleEvent('page:receive', ujs.handleUnmount);
10 | },
11 | teardown: function(ujs) {
12 | ujs.removeEvent('page:change', ujs.handleMount);
13 | ujs.removeEvent('page:receive', ujs.handleUnmount);
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/react_ujs/src/getConstructor/fromGlobal.js:
--------------------------------------------------------------------------------
1 | // Assume className is simple and can be found at top-level (window).
2 | // Fallback to eval to handle cases like 'My.React.ComponentName'.
3 | // Also, try to gracefully import Babel 6 style default exports
4 | var topLevel = typeof window === "undefined" ? this : window;
5 |
6 | module.exports = function(className) {
7 | var constructor;
8 | // Try to access the class globally first
9 | constructor = topLevel[className];
10 |
11 | // If that didn't work, try eval
12 | if (!constructor) {
13 | constructor = eval(className);
14 | }
15 |
16 | // Lastly, if there is a default attribute try that
17 | if (constructor && constructor['default']) {
18 | constructor = constructor['default'];
19 | }
20 |
21 | return constructor;
22 | }
23 |
--------------------------------------------------------------------------------
/react_ujs/src/getConstructor/fromRequireContext.js:
--------------------------------------------------------------------------------
1 | // Load React components by requiring them from "components/", for example:
2 | //
3 | // - "pages/index" -> `require("components/pages/index")`
4 | // - "pages/show.Header" -> `require("components/pages/show").Header`
5 | // - "pages/show.Body.Content" -> `require("components/pages/show").Body.Content`
6 | //
7 | module.exports = function(reqctx) {
8 | return function(className) {
9 | var parts = className.split(".")
10 | var filename = parts.shift()
11 | var keys = parts
12 | // Load the module:
13 | var component = reqctx("./" + filename)
14 | // Then access each key:
15 | keys.forEach(function(k) {
16 | component = component[k]
17 | })
18 | // support `export default`
19 | if (component.__esModule) {
20 | component = component["default"]
21 | }
22 | return component
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/react_ujs/src/getConstructor/fromRequireContextWithGlobalFallback.js:
--------------------------------------------------------------------------------
1 | // Make a function which:
2 | // - First tries to require the name
3 | // - Then falls back to global lookup
4 | var fromGlobal = require("./fromGlobal")
5 | var fromRequireContext = require("./fromRequireContext")
6 |
7 | module.exports = function(reqctx) {
8 | var fromCtx = fromRequireContext(reqctx)
9 | return function(className) {
10 | var component;
11 | try {
12 | // `require` will raise an error if this className isn't found:
13 | component = fromCtx(className)
14 | } catch (firstErr) {
15 | // fallback to global:
16 | try {
17 | component = fromGlobal(className)
18 | } catch (secondErr) {
19 | console.error(firstErr)
20 | console.error(secondErr)
21 | }
22 | }
23 | return component
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/react_ujs/src/getConstructor/fromRequireContextsWithGlobalFallback.js:
--------------------------------------------------------------------------------
1 | // Make a function which:
2 | // - First tries to require the name
3 | // - Then falls back to global lookup
4 | var fromGlobal = require("./fromGlobal")
5 | var fromRequireContext = require("./fromRequireContext")
6 |
7 | module.exports = function(reqctxs) {
8 | var fromCtxs = reqctxs.map((reqctx) => fromRequireContext(reqctx))
9 | return function(className) {
10 | var component;
11 | try {
12 | var index = 0, fromCtx, firstErr;
13 | do {
14 | fromCtx = fromCtxs[index];
15 |
16 | try {
17 | // `require` will raise an error if this className isn't found:
18 | component = fromCtx(className)
19 | } catch (fromCtxErr) {
20 | if (!firstErr) {
21 | firstErr = fromCtxErr;
22 | }
23 | }
24 |
25 | index += 1;
26 | } while (index < fromCtxs.length);
27 | if (!component) throw firstErr;
28 | } catch (firstErr) {
29 | // fallback to global:
30 | try {
31 | component = fromGlobal(className)
32 | } catch (secondErr) {
33 | console.error(firstErr)
34 | console.error(secondErr)
35 | }
36 | }
37 | return component
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/react_ujs/src/reactDomClient.js:
--------------------------------------------------------------------------------
1 | import ReactDOM from "react-dom"
2 | import supportsRootApi from "./supportsRootApi"
3 |
4 | let reactDomClient = ReactDOM
5 |
6 | if (supportsRootApi) {
7 | // This will never throw an exception, but it's the way to tell Webpack the dependency is optional
8 | // https://github.com/webpack/webpack/issues/339#issuecomment-47739112
9 | // Unfortunately, it only converts the error to a warning.
10 | try {
11 | // eslint-disable-next-line global-require,import/no-unresolved
12 | reactDomClient = require('react-dom/client');
13 | } catch (e) {
14 | // We should never get here, but if we do, we'll just use the default ReactDOM
15 | // and live with the warning.
16 | reactDomClient = ReactDOM;
17 | }
18 | }
19 |
20 | export default reactDomClient
21 |
--------------------------------------------------------------------------------
/react_ujs/src/renderHelpers.js:
--------------------------------------------------------------------------------
1 | import ReactDOM from "./reactDomClient"
2 | import supportsRootApi from "./supportsRootApi"
3 |
4 | export function supportsHydration() {
5 | return typeof ReactDOM.hydrate === "function" || typeof ReactDOM.hydrateRoot === "function"
6 | }
7 |
8 | export function reactHydrate(node, component) {
9 | if (typeof ReactDOM.hydrateRoot === "function") {
10 | return ReactDOM.hydrateRoot(node, component)
11 | } else {
12 | return ReactDOM.hydrate(component, node)
13 | }
14 | }
15 |
16 | export function createReactRootLike(node) {
17 | if(supportsRootApi) {
18 | return ReactDOM.createRoot(node)
19 | }
20 | return legacyReactRootLike(node)
21 | }
22 |
23 | function legacyReactRootLike(node) {
24 | const root = {
25 | render(component) {
26 | return ReactDOM.render(component, node)
27 | }
28 | }
29 | return root
30 | }
31 |
--------------------------------------------------------------------------------
/react_ujs/src/supportsRootApi.js:
--------------------------------------------------------------------------------
1 | var ReactDOM = require("react-dom")
2 |
3 | var reactMajorVersion, supportsRootApi;
4 | if (typeof ReactDOM != "undefined") {
5 | reactMajorVersion = ReactDOM.version.split('.')[0] || 16
6 |
7 | // TODO: once we require React 18, we can remove this and inline everything guarded by it.
8 | supportsRootApi = reactMajorVersion >= 18
9 | } else {
10 | supportsRootApi = false
11 | }
12 |
13 | module.exports = supportsRootApi
14 |
--------------------------------------------------------------------------------
/react_ujs/webpack.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | context: __dirname,
3 | entry: "./index.js",
4 | output: {
5 | path: __dirname + "/dist/",
6 | filename: "react_ujs.js",
7 | library: "ReactRailsUJS",
8 | libraryTarget: 'umd'
9 | },
10 | externals: {
11 | 'react': {
12 | root: 'React',
13 | commonjs2: 'react',
14 | commonjs: 'react',
15 | amd: 'react'
16 | },
17 | 'react-dom': {
18 | root: 'ReactDOM',
19 | commonjs2: 'react-dom',
20 | commonjs: 'react-dom',
21 | amd: 'react-dom'
22 | },
23 | 'react-dom/server': {
24 | root: 'ReactDOMServer',
25 | commonjs2: 'react-dom/server',
26 | commonjs: 'react-dom/server',
27 | amd: 'react-dom/server'
28 | }
29 | }
30 | };
31 |
--------------------------------------------------------------------------------
/test/bin/create-fake-js-package-managers:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env ruby
2 | # frozen_string_literal: true
3 |
4 | # creates a set of fake JavaScript package managers in a temporary bin
5 | # directory for GitHub Actions, _excluding_ the one passed in as an
6 | # argument in order to assert that only that package manager is used
7 |
8 | require "tmpdir"
9 |
10 | # setup the bin directory we want to use
11 | bin_dir = Dir.mktmpdir("react-rails-")
12 |
13 | if ENV["GITHUB_ACTIONS"]
14 | puts "adding #{bin_dir} to GITHUB_PATH..."
15 | File.write(ENV.fetch("GITHUB_PATH"), "#{bin_dir}\n", mode: "a+")
16 | end
17 |
18 | managers = %w[npm yarn pnpm bun]
19 | manager_in_use = ARGV[0]
20 |
21 | Dir.chdir(bin_dir) do
22 | managers.each do |manager|
23 | next if manager == manager_in_use
24 |
25 | puts "creating #{bin_dir}/#{manager}..."
26 | File.write(
27 | manager,
28 | <<~CONTENTS
29 | #!/usr/bin/env node
30 |
31 | throw new Error("(#{manager}) this is not the package manager you're looking...");
32 | CONTENTS
33 | )
34 | File.chmod(0o755, manager)
35 | end
36 | end
37 |
--------------------------------------------------------------------------------
/test/dummy/.gitignore:
--------------------------------------------------------------------------------
1 | /public/packs
2 | /node_modules
3 | /public/packs
4 | /public/packs-test
5 | /node_modules
6 |
--------------------------------------------------------------------------------
/test/dummy/.postcssrc.yml:
--------------------------------------------------------------------------------
1 | plugins:
2 | postcss-smart-import: {}
3 | postcss-cssnext: {}
4 |
--------------------------------------------------------------------------------
/test/dummy/README.rdoc:
--------------------------------------------------------------------------------
1 | == README
2 |
3 | This README would normally document whatever steps are necessary to get the
4 | application up and running.
5 |
6 | Things you may want to cover:
7 |
8 | * Ruby version
9 |
10 | * System dependencies
11 |
12 | * Configuration
13 |
14 | * Database creation
15 |
16 | * Database initialization
17 |
18 | * How to run the test suite
19 |
20 | * Services (job queues, cache servers, search engines, etc.)
21 |
22 | * Deployment instructions
23 |
24 | * ...
25 |
26 |
27 | Please feel free to use a different markup language if you do not plan to run
28 | rake doc:app.
29 |
--------------------------------------------------------------------------------
/test/dummy/Rakefile:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | # Add your own tasks in files placed in lib/tasks ending in .rake,
4 | # for example lib/tasks/capistrano.rake, and they will automatically be available to Rake.
5 |
6 | require File.expand_path("config/application", __dir__)
7 |
8 | Dummy::Application.load_tasks
9 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/config/manifest.js:
--------------------------------------------------------------------------------
1 | // Sprockets 4 expects this file
2 | //
3 | //= link application.js
4 | //= link turbolinks_only.js
5 | //= link application.css
6 | //= link app_no_turbolinks.js
--------------------------------------------------------------------------------
/test/dummy/app/assets/images/.keep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/app/assets/images/.keep
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/app_no_turbolinks.js:
--------------------------------------------------------------------------------
1 | //= require react
2 | //= require react_ujs
3 | //= require_tree ./components
4 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/application.js:
--------------------------------------------------------------------------------
1 | // This is a manifest file that'll be compiled into application.js, which will include all the files
2 | // listed below.
3 | //
4 | // Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
5 | // or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
6 | //
7 | // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
8 | // compiled file.
9 | //
10 | // Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
11 | // about supported directives.
12 | //
13 | //
14 | // es5-shim is necessary for PhantomJS to pass tests. See https://github.com/facebook/react/issues/303
15 | //
16 | //= require turbolinks
17 | //= require es5-shim/es5-shim
18 | //= require react
19 | //= require react_ujs
20 | //= require_tree ./components
21 | //= require ./pages
22 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components.js:
--------------------------------------------------------------------------------
1 | //= require_self
2 | //= require_tree ./components
3 | //= require ./pages
4 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components/PlainJSTodo.js:
--------------------------------------------------------------------------------
1 | var Todo = createReactClass({
2 | render: function() {
3 | return React.createElement("li", null, this.props.todo)
4 | }
5 | })
6 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components/Todo.js.jsx.coffee:
--------------------------------------------------------------------------------
1 | Todo = createReactClass
2 | render: ->
3 | `{this.props.todo}`
4 |
5 | # Because Coffee files are in an anonymous function,
6 | # expose it for server rendering tests
7 | this.Todo = Todo
8 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components/TodoList.js.jsx:
--------------------------------------------------------------------------------
1 | TodoList = createReactClass({
2 | getInitialState: function() {
3 | return({mounted: "nope"});
4 | },
5 | componentDidMount: function() {
6 | this.setState({mounted: 'yep'});
7 | },
8 | render: function() {
9 | console.log("Test Console Replay")
10 | return (
11 |
12 | - {this.state.mounted}
13 | {this.props.todos.map(function(todo, i) {
14 | return ()
15 | })}
16 |
17 | )
18 | }
19 | })
20 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components/TodoListWithConsoleLog.js.jsx:
--------------------------------------------------------------------------------
1 | TodoListWithConsoleLog = createReactClass({
2 | getInitialState: function() {
3 | console.log('got initial state');
4 | return({mounted: "nope"});
5 | },
6 | componentWillMount: function() {
7 | console.warn('mounted component');
8 | this.setState({mounted: 'yep'});
9 | },
10 | render: function() {
11 | var x = 'foo';
12 | console.error('rendered!', x);
13 | return (
14 |
15 | - Console Logged
16 | - {this.state.mounted}
17 | {this.props.todos.map(function(todo, i) {
18 | return ()
19 | })}
20 |
21 | )
22 | }
23 | })
24 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/components/WithSetTimeout.js.jsx:
--------------------------------------------------------------------------------
1 | WithSetTimeout = createReactClass({
2 | componentWillMount: function () {
3 | setTimeout(function () {}, 1000)
4 | clearTimeout(0)
5 | },
6 | render: function () {
7 | return I am rendered!
8 | }
9 | })
10 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/example.js.jsx:
--------------------------------------------------------------------------------
1 | [2, ...[1]];
2 | ;
3 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/example2.js.jsx.coffee:
--------------------------------------------------------------------------------
1 | Component = createReactClass
2 | render: ->
3 | ``
4 |
5 | this.Component = Component
6 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/example3.js.jsx:
--------------------------------------------------------------------------------
1 | ;
2 |
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/flow_types_example.js.jsx:
--------------------------------------------------------------------------------
1 | function flowTypesExample(i: number, name: string): string {
2 | return "OK"
3 | }
--------------------------------------------------------------------------------
/test/dummy/app/assets/javascripts/harmony_example.js.jsx:
--------------------------------------------------------------------------------
1 | var HarmonyComponent = createReactClass({
2 | statics: {
3 | generateGreeting() {
4 | return "Hello Harmony!"
5 | },
6 | generateGreetingWithWrapper() {
7 | var insertedGreeting = this.generateGreeting();
8 | return `Your greeting is: '${insertedGreeting}'.`
9 | },
10 | },
11 | render: function(){
12 | var greeting = HarmonyComponent.generateGreeting();
13 | var { active, ...other } = { active: true, x: 1, y:2 }
14 | return (
15 |
16 |
{greeting}
17 |
18 |
19 |
20 |
14 |
15 | {this.props.name} - {this.state.count}
16 |
17 |
20 |
15 | - {this.state.mounted}
16 | {this.props.todos.map(function(todo, i) {
17 | return (- {todo}
)
18 | })}
19 | - From Shakapacker
20 |
21 | )
22 | }
23 | })
24 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/components/TodoListWithConsoleLog.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 | var createReactClass = require("create-react-class")
3 |
4 | module.exports = createReactClass({
5 | getInitialState: function() {
6 | console.log('got initial state');
7 | return({mounted: "nope"});
8 | },
9 | componentWillMount: function() {
10 | // This will need to be replaced
11 | // https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html
12 | console.warn('mounted component');
13 | this.setState({mounted: 'yep'});
14 | },
15 | render: function() {
16 | var x = 'foo';
17 | console.error('rendered!', x);
18 | return (
19 |
20 | - Console Logged
21 | - {this.state.mounted}
22 | {this.props.todos.map(function(todo, i) {
23 | return (- {todo}
)
24 | })}
25 |
26 | )
27 | }
28 | })
29 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/components/WithSetTimeout.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 | var createReactClass = require("create-react-class")
3 |
4 | module.exports = createReactClass({
5 | componentWillMount: function () {
6 | setTimeout(function () {}, 1000)
7 | clearTimeout(0)
8 | },
9 | render: function () {
10 | return I am rendered!
11 | }
12 | })
13 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/components/export_default_component.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 |
3 | export default class ExportDefaultComponent extends React.Component {
4 | render() {
5 | return Export Default
6 | }
7 | }
8 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/components/named_export_component.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 |
3 | module.exports = {
4 | Component: function(props) { return Named Export
}
5 | }
6 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/components/subfolder/exports_component.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 |
3 | module.exports = function(props) {
4 | return Exports
5 | }
6 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/controllers/mount_counters.js:
--------------------------------------------------------------------------------
1 | var { Controller } = require("@hotwired/stimulus");
2 | var ReactRailsUJS = require("react_ujs");
3 |
4 | module.exports = class extends Controller {
5 | connect() {
6 | this.observeChange();
7 | }
8 |
9 | disconnect() {
10 | this.observer.disconnect();
11 | }
12 |
13 | observeChange() {
14 | var element = this.element;
15 | var callback = function (mutationsList, _observer) {
16 | mutationsList.forEach(function (mutation) {
17 | if (mutation.type === "childList") {
18 | ReactRailsUJS.mountComponents(element);
19 | }
20 | });
21 | };
22 |
23 | this.observer = new MutationObserver(callback);
24 | this.observer.observe(this.element, { childList: true });
25 | }
26 | };
27 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/packs/application.js:
--------------------------------------------------------------------------------
1 | require("@hotwired/turbo-rails");
2 | var { Application } = require("@hotwired/stimulus");
3 | var MountCountersController = require("../controllers/mount_counters");
4 |
5 | window.Stimulus = Application.start();
6 | Stimulus.register("mount-counters", MountCountersController);
7 |
8 | var ctx = require.context("components", true);
9 | var ReactRailsUJS = require("react_ujs");
10 | ReactRailsUJS.useContext(ctx);
11 | var React = require("react");
12 |
13 | window.GlobalComponent = function (props) {
14 | return React.createElement("h1", null, "Global Component");
15 | };
16 |
--------------------------------------------------------------------------------
/test/dummy/app/javascript/packs/server_rendering.js:
--------------------------------------------------------------------------------
1 | // By default, this pack is loaded for server-side rendering.
2 | // It must expose react_ujs as `ReactRailsUJS` and prepare a require context.
3 | var componentRequireContext = require.context("components", true);
4 | var ReactRailsUJS = require("react_ujs");
5 | ReactRailsUJS.useContext(componentRequireContext);
6 |
--------------------------------------------------------------------------------
/test/dummy/app/mailers/.keep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/app/mailers/.keep
--------------------------------------------------------------------------------
/test/dummy/app/models/.keep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/app/models/.keep
--------------------------------------------------------------------------------
/test/dummy/app/models/concerns/.keep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/app/models/concerns/.keep
--------------------------------------------------------------------------------
/test/dummy/app/pants/yfronts.js:
--------------------------------------------------------------------------------
1 | // used for testing file watcher configuration
2 |
--------------------------------------------------------------------------------
/test/dummy/app/views/counters/create.turbo_stream.erb:
--------------------------------------------------------------------------------
1 | <%= turbo_stream.append :counters do %>
2 | <%= react_component("Counter", @counter) %>
3 | <% end %>
4 |
--------------------------------------------------------------------------------
/test/dummy/app/views/counters/index.html.erb:
--------------------------------------------------------------------------------
1 | React 18 bug reproduction
2 |
3 | <%= turbo_frame_tag :counters, data: { controller: "mount-counters" } do %>
4 | <% @counters.each do |counter| %>
5 | <%= react_component("Counter", counter) %>
6 | <% end %>
7 | <% end %>
8 | <%= form_with(url: counters_path, method: :post, data: { turbo: true, turbo_stream: true }) do |form| %>
9 | <%= form.submit "Add counter" %>
10 | <% end %>
11 |
--------------------------------------------------------------------------------
/test/dummy/app/views/layouts/app_no_turbolinks.html.erb:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Dummy
5 | <%= javascript_include_tag "app_no_turbolinks" %>
6 | <%= csrf_meta_tags %>
7 |
8 |
9 |
10 | <%= yield %>
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/test/dummy/app/views/layouts/application.html.erb:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Dummy
5 | <% if ShakapackerHelpers.available? %>
6 | <%= javascript_pack_tag "application" %>
7 | <% elsif SprocketsHelpers.available? %>
8 | <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
9 | <% end %>
10 | <%= csrf_meta_tags %>
11 |
12 |
13 |
14 | <%= yield %>
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/test/dummy/app/views/pack_components/show.html.erb:
--------------------------------------------------------------------------------
1 | <%= javascript_pack_tag "application" if ShakapackerHelpers.available? %>
2 |
3 |
4 | <%= react_component("export_default_component") %>
5 | <%= react_component("named_export_component.Component") %>
6 | <%= react_component("subfolder/exports_component") %>
7 | <%= react_component("GlobalComponent") %>
8 |
--------------------------------------------------------------------------------
/test/dummy/app/views/pages/_component_with_inner_html.html.erb:
--------------------------------------------------------------------------------
1 | <%= react_component 'GreetingMessage', { :name => 'Name' }, { :id => 'component' } do %>
2 | NestedContent
3 | <% end %>
4 |
--------------------------------------------------------------------------------
/test/dummy/app/views/pages/show.html.erb:
--------------------------------------------------------------------------------
1 |
2 | - <%= link_to 'Alice', page_path(id: 0) %>
3 | - <%= link_to 'Bob', page_path(id: 1) %>
4 |
5 |
6 |
7 | <%= react_component 'GreetingMessage', { name: @name, lastName: "Last #{@name}", info: { name: @name, lastName: "Last #{@name}" } }, { id: 'component', class: "greeting-message", prerender: @prerender } %>
8 |
9 | <%= react_component 'Todo', { todo: 'Another Component' }, { id: 'todo', prerender: @prerender } %>
10 |
11 |
53 |
The page you were looking for doesn't exist.
54 |
You may have mistyped the address or the page may have moved.
55 |
If you are the application owner check the logs for more information.
57 |
58 |
59 |
--------------------------------------------------------------------------------
/test/dummy/public/422.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | The change you wanted was rejected (422)
5 |
48 |
49 |
50 |
51 |
52 |
53 |
The change you wanted was rejected.
54 |
Maybe you tried to change something you didn't have access to.
55 |
If you are the application owner check the logs for more information.
57 |
58 |
59 |
--------------------------------------------------------------------------------
/test/dummy/public/500.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | We're sorry, but something went wrong (500)
5 |
48 |
49 |
50 |
51 |
52 |
53 |
We're sorry, but something went wrong.
54 |
55 | If you are the application owner check the logs for more information.
56 |
57 |
58 |
--------------------------------------------------------------------------------
/test/dummy/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/public/favicon.ico
--------------------------------------------------------------------------------
/test/dummy/vendor/assets/javascripts/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reactjs/react-rails/6e811b6bc3634112a269821ee2f5b512167d39ae/test/dummy/vendor/assets/javascripts/.gitkeep
--------------------------------------------------------------------------------
/test/dummy/vendor/assets/react/JSXTransformer__.js:
--------------------------------------------------------------------------------
1 | var JSXTransformer = {
2 | transform: function () {
3 | return {
4 | code: 'test_confirmation_token_jsx_transformed;'
5 | };
6 | }
7 | };
8 |
--------------------------------------------------------------------------------
/test/dummy/vendor/assets/react/test/react__.js:
--------------------------------------------------------------------------------
1 | 'test_confirmation_token_react_content';
--------------------------------------------------------------------------------
/test/generators/coffee_component_generator_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/component_generator"
5 |
6 | class CoffeeComponentGeneratorTest < Rails::Generators::TestCase
7 | destination File.join(Rails.root, "tmp", "component_generator_test_output")
8 | setup :prepare_destination
9 | tests React::Generators::ComponentGenerator
10 |
11 | if ShakapackerHelpers.available?
12 | def filename
13 | "app/javascript/components/GeneratedComponent.coffee"
14 | end
15 |
16 | test "that Shakapacker defaults to ES6" do
17 | run_generator %w[GeneratedComponent name]
18 |
19 | es6 = File.read(File.join(destination_root, "app/javascript/components/GeneratedComponent.js"))
20 |
21 | assert_match(/const GeneratedComponent = \(props\) => {/, es6)
22 | end
23 | else
24 | def filename
25 | "app/assets/javascripts/components/generated_component.js.jsx.coffee"
26 | end
27 | end
28 | def class_name
29 | "GeneratedComponent"
30 | end
31 |
32 | test "that it the uses CoffeeScript syntax" do
33 | run_generator %w[GeneratedComponent name --coffee]
34 |
35 | assert_file filename, /^class #{class_name}\sextends\sReact\.Component/
36 | end
37 |
38 | test "that propTypes get assigned" do
39 | run_generator %w[GeneratedComponent name --coffee]
40 |
41 | assert_file filename, /@propTypes\s=/
42 | assert_file filename, /PropTypes/
43 | end
44 |
45 | test "that it generates working jsx" do
46 | run_generator %w[GeneratedComponent name:string address:shape --coffee]
47 | jsx = React::JSX.transform(CoffeeScript.compile(File.read(File.join(destination_root, filename))))
48 |
49 | assert_match(Regexp.new(expected_working_jsx), jsx)
50 | end
51 | end
52 |
--------------------------------------------------------------------------------
/test/generators/component_generator_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/component_generator"
5 |
6 | class ComponentGeneratorTest < Rails::Generators::TestCase
7 | destination File.join(Rails.root, "tmp", "component_generator_test_output")
8 | setup :prepare_destination
9 | tests React::Generators::ComponentGenerator
10 |
11 | if ShakapackerHelpers.available?
12 | def filename
13 | "app/javascript/components/GeneratedComponent.js"
14 | end
15 |
16 | def filename_with_subfolder
17 | "app/javascript/components/generated_folder/GeneratedComponent.js"
18 | end
19 | else
20 | def filename
21 | "app/assets/javascripts/components/generated_component.js.jsx"
22 | end
23 |
24 | def filename_with_subfolder
25 | "app/assets/javascripts/components/generated_folder/generated_component.js.jsx"
26 | end
27 | end
28 |
29 | test "creates the component file" do
30 | run_generator %w[GeneratedComponent]
31 |
32 | assert_file filename do |contents|
33 | if ShakapackerHelpers.available?
34 | assert_match(/^import React from "react"/, contents)
35 | assert_match(/export default GeneratedComponent\n$/m, contents)
36 | end
37 | end
38 | end
39 |
40 | test "creates the component file in a subdirectory" do
41 | run_generator %w[generated_folder/GeneratedComponent]
42 | assert_file filename_with_subfolder do |contents|
43 | if ShakapackerHelpers.available?
44 | assert_match(/^import React from "react"/, contents)
45 | assert_match(/export default GeneratedComponent\n$/m, contents)
46 | end
47 | end
48 | end
49 |
50 | test "creates the component file with a node argument" do
51 | run_generator %w[GeneratedComponent name]
52 |
53 | assert_file filename, /name: PropTypes.node/
54 | end
55 |
56 | test "creates the component file with various standard proptypes" do
57 | proptypes = %w[string bool number array func number object any]
58 | run_generator %w[GeneratedComponent] + proptypes.map { |type| "my_#{type}:#{type}" }
59 |
60 | proptypes.each do |type|
61 | assert_file filename, /my#{type.capitalize}: PropTypes.#{type}/
62 | end
63 | end
64 |
65 | test "creates a component file with an instanceOf property" do
66 | run_generator %w[GeneratedComponent favorite_food:instanceOf{food}]
67 |
68 | assert_file filename, /favoriteFood: PropTypes.instanceOf\(Food\)/
69 | end
70 |
71 | test "creates a component file with a oneOf property" do
72 | run_generator %w[GeneratedComponent favorite_food:oneOf{pizza,hamburgers}]
73 |
74 | assert_file filename, /favoriteFood: PropTypes.oneOf\(\['pizza','hamburgers'\]\)/
75 | end
76 |
77 | test "creates a component file with a oneOfType property" do
78 | run_generator %w[GeneratedComponent favorite_food:oneOfType{string,Food}]
79 | expected_property = "favoriteFood: PropTypes.oneOfType([PropTypes.string,PropTypes.instanceOf(Food)])"
80 |
81 | assert_file filename, Regexp.new(Regexp.quote(expected_property))
82 | end
83 |
84 | test "generates working jsx" do
85 | run_generator %w[GeneratedComponent name:string address:shape]
86 | jsx = React::JSX.transform(File.read(File.join(destination_root, filename)))
87 |
88 | assert_match(Regexp.new(expected_working_jsx_in_function_component), jsx)
89 | end
90 | end
91 |
--------------------------------------------------------------------------------
/test/generators/es6_component_generator_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/component_generator"
5 |
6 | class Es6ComponentGeneratorTest < Rails::Generators::TestCase
7 | destination File.join(Rails.root, "tmp", "component_generator_test_output")
8 | setup :prepare_destination
9 | tests React::Generators::ComponentGenerator
10 |
11 | if ShakapackerHelpers.available?
12 | def filename
13 | "app/javascript/components/GeneratedComponent.js"
14 | end
15 | else
16 | def filename
17 | "app/assets/javascripts/components/generated_component.es6.jsx"
18 | end
19 | end
20 |
21 | def component_name
22 | "GeneratedComponent"
23 | end
24 |
25 | test "uses es6 syntax" do
26 | run_generator %w[GeneratedComponent name --es6]
27 |
28 | assert_file filename, /const #{component_name} = \(props\) => {/
29 | end
30 |
31 | test "assigns defaultProps after function definintion" do
32 | run_generator %w[GeneratedComponent name --es6]
33 |
34 | assert_file filename, /\s^#{component_name}\.propTypes/
35 | end
36 |
37 | test "generates working jsx" do
38 | run_generator %w[GeneratedComponent name:string address:shape --es6]
39 | jsx = React::JSX.transform(File.read(File.join(destination_root, filename)))
40 |
41 | assert_match(Regexp.new(expected_working_jsx_in_function_component), jsx)
42 | end
43 | end
44 |
--------------------------------------------------------------------------------
/test/generators/install_generator_sprockets_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/install_generator"
5 |
6 | # If Shakapacker is available, its setup is preferred
7 | unless ShakapackerHelpers.available?
8 | class InstallGeneratorSprocketsTest < Rails::Generators::TestCase
9 | destination File.join(Rails.root, "tmp", "generator_test_output")
10 | tests React::Generators::InstallGenerator
11 | setup :prepare_destination
12 |
13 | def copy_directory(dir)
14 | source = Rails.root.join(dir)
15 | dest = Rails.root.join(destination_root, File.dirname(dir))
16 |
17 | FileUtils.mkdir_p dest
18 | FileUtils.cp_r source, dest
19 | end
20 |
21 | test "adds requires to `application.js`" do
22 | run_generator
23 |
24 | assert_application_file_created
25 | end
26 |
27 | test "it modifes an existing 'application.js'" do
28 | copy_directory("app/assets/javascripts/application.js")
29 | run_generator
30 |
31 | assert_application_file_modified
32 | end
33 |
34 | test "creates `application.js` if it doesn't exist" do
35 | copy_directory("app/assets/javascripts/application.js")
36 | File.delete "#{destination_root}/app/assets/javascripts/application.js"
37 |
38 | run_generator
39 |
40 | assert_application_file_created
41 | end
42 |
43 | test "modifies `application.js` if it's empty" do
44 | init_application_js ""
45 |
46 | run_generator
47 |
48 | assert_application_file_created
49 | end
50 |
51 | test "updates `application.js` if require_tree is commented" do
52 | init_application_js <<-DIRECTIVE
53 | //
54 | // require_tree .
55 | //
56 | DIRECTIVE
57 |
58 | run_generator
59 |
60 | assert_application_file_modified
61 | end
62 |
63 | test "updates `application.js` if require turbolinks has extra spaces" do
64 | init_application_js <<-DIRECTIVE
65 | //
66 | //= require turbolinks#{' '}
67 | //
68 | DIRECTIVE
69 |
70 | run_generator
71 |
72 | assert_application_file_modified
73 | end
74 |
75 | test "creates server_rendering.js with default requires" do
76 | run_generator
77 | server_rendering_file_path = "app/assets/javascripts/server_rendering.js"
78 |
79 | assert_file server_rendering_file_path, %r{//= require react-server\n}
80 | assert_file server_rendering_file_path, %r{//= require ./components\n}
81 | end
82 |
83 | test "creates server rendering initializer" do
84 | run_generator
85 | initializer_path = "config/initializers/react_server_rendering.rb"
86 |
87 | assert_file(initializer_path, /Rails.application.config.assets.precompile \+= \["server_rendering.js"\]/)
88 | end
89 |
90 | test "skipping server rendering" do
91 | run_generator %w[--skip-server-rendering]
92 |
93 | assert_no_file "config/initializers/react_server_rendering.rb"
94 | assert_no_file "app/assets/javascripts/server_rendering.js"
95 | end
96 |
97 | def init_application_js(content)
98 | FileUtils.mkdir_p "#{destination_root}/app/assets/javascripts/"
99 | File.write "#{destination_root}/app/assets/javascripts/application.js", content
100 | end
101 |
102 | private
103 |
104 | def assert_application_file_created
105 | assert_file "app/assets/javascripts/application.js",
106 | %r{//= require react\n//= require react_ujs\n//= require components\n}
107 | end
108 |
109 | def assert_application_file_modified
110 | assert_file "app/assets/javascripts/application.js", %r{\n//= require react\n}
111 | assert_file "app/assets/javascripts/application.js", %r{\n//= require react_ujs\n}
112 | assert_file "app/assets/javascripts/application.js", %r{\n//= require components\n}
113 | end
114 | end
115 | end
116 |
--------------------------------------------------------------------------------
/test/generators/install_generator_webpacker_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/install_generator"
5 | class InstallGeneratorShakapackerTest < Rails::Generators::TestCase
6 | ShakapackerHelpers.when_shakapacker_available do
7 | destination File.join(Rails.root, "tmp", "generator_test_output")
8 | tests React::Generators::InstallGenerator
9 | setup :prepare_destination
10 |
11 | expected_setup = %|// Support component names relative to this directory:
12 | var componentRequireContext = require.context("components", true);
13 | var ReactRailsUJS = require("react_ujs");
14 | ReactRailsUJS.useContext(componentRequireContext);
15 | |
16 |
17 | default_server_rendering_pack_path = "app/javascript/packs/server_rendering.js"
18 |
19 | def copy_directory(dir)
20 | source = Rails.root.join(dir)
21 | dest = Rails.root.join(destination_root, File.dirname(dir))
22 |
23 | FileUtils.mkdir_p dest
24 | FileUtils.cp_r source, dest
25 | end
26 |
27 | test "adds requires to `application.js`" do
28 | run_generator
29 |
30 | assert_file "app/javascript/packs/application.js", expected_setup
31 | assert_file "app/javascript/components"
32 | end
33 |
34 | test "creates server_rendering.js with default requires" do # rubocop:disable Minitest/MultipleAssertions
35 | run_generator
36 | assert_file default_server_rendering_pack_path do |contents|
37 | assert_includes contents, "var componentRequireContext = require.context(\"components\", true);\n"
38 | assert_includes contents, "var ReactRailsUJS = require(\"react_ujs\");\n"
39 | assert_includes contents, "ReactRailsUJS.useContext(componentRequireContext);\n"
40 | end
41 | end
42 |
43 | test "skipping server rendering" do
44 | run_generator %w[--skip-server-rendering]
45 |
46 | assert_no_file default_server_rendering_pack_path
47 | end
48 | end
49 | end
50 |
--------------------------------------------------------------------------------
/test/generators/ts_es6_component_generator_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "generators/react/component_generator"
5 |
6 | class TsEs6ComponentGeneratorTest < Rails::Generators::TestCase
7 | destination File.join(Rails.root, "tmp", "component_generator_test_output")
8 | setup :prepare_destination
9 | tests React::Generators::ComponentGenerator
10 |
11 | if ShakapackerHelpers.available?
12 | def filename
13 | "app/javascript/components/GeneratedComponent.tsx"
14 | end
15 | else
16 | def filename
17 | "app/assets/javascripts/components/generated_component.es6.tsx"
18 | end
19 | end
20 |
21 | def component_name
22 | "GeneratedComponent"
23 | end
24 |
25 | test "uses ts and es6 syntax" do
26 | run_generator %w[GeneratedComponent name:string --ts --es6]
27 |
28 | assert_file filename, /const #{component_name} = \(props: I#{component_name}Props\) => {/
29 | end
30 |
31 | test "defines props type" do
32 | run_generator %w[GeneratedComponent name:string --ts --es6]
33 |
34 | assert_file filename, /name: string;/
35 | end
36 | end
37 |
--------------------------------------------------------------------------------
/test/helper_files/TodoListWithUpdates.js:
--------------------------------------------------------------------------------
1 | var React = require("react")
2 | var createReactClass = require("create-react-class")
3 |
4 | module.exports = createReactClass({
5 | render: function() {
6 | return (
7 |
10 | )
11 | }
12 | })
13 |
--------------------------------------------------------------------------------
/test/helper_files/TodoListWithUpdates.js.jsx:
--------------------------------------------------------------------------------
1 | TodoList = createReactClass({
2 | getInitialState: function() {
3 | return({mounted: "nope"});
4 | },
5 | componentWillMount: function() {
6 | this.setState({mounted: 'yep'});
7 | },
8 | render: function() {
9 | return (
10 |
11 | - Updated
12 | - {this.state.mounted}
13 | {this.props.todos.map(function(todo, i) {
14 | return ()
15 | })}
16 |
17 | )
18 | }
19 | })
20 |
--------------------------------------------------------------------------------
/test/helper_files/WithoutSprockets.js:
--------------------------------------------------------------------------------
1 | // compiled with Babel 6.14.0
2 | // const WithoutSprockets = ({label}) => {label};
3 |
4 | var WithoutSprockets = function WithoutSprockets(_ref) {
5 | var label = _ref.label;
6 | return React.createElement(
7 | "span",
8 | null,
9 | label
10 | );
11 | };
--------------------------------------------------------------------------------
/test/react/jsx/jsx_prepocessor_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class JSXPreprocessorTest < ActiveSupport::TestCase
6 | SprocketsHelpers.when_available do
7 | required_javascript = "var requirePlainJavascript = true;"
8 | required_coffeescript = "var requireCoffee; requireCoffee = true;"
9 | required_jsx = 'React.createElement("div", { className: "require-jsx" });'
10 | own_jsx = 'React.createElement("div", { className: "le-javascript" });'
11 | test "executes //= require directives" do # rubocop:disable Minitest/MultipleAssertions
12 | require_parent = SprocketsHelpers.fetch_asset_body("require_test/jsx_preprocessor_test.js")
13 |
14 | assert_compiled_javascript_includes(require_parent, required_javascript)
15 | assert_compiled_javascript_includes(require_parent, required_coffeescript)
16 | assert_compiled_javascript_includes(require_parent, required_jsx)
17 | assert_compiled_javascript_includes(require_parent, own_jsx)
18 | end
19 | end
20 | end
21 |
--------------------------------------------------------------------------------
/test/react/jsx/jsx_transformer_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class JSXTransformerTest < ActionDispatch::IntegrationTest
6 | SprocketsHelpers.when_available do
7 | setup do
8 | reset_transformer
9 | React::JSX.transformer_class = React::JSX::JSXTransformer
10 | SprocketsHelpers.manually_expire_asset("JSXTransformer.js")
11 | end
12 |
13 | teardown do
14 | reset_transformer
15 | SprocketsHelpers.manually_expire_asset("JSXTransformer.js")
16 | end
17 |
18 | test "can use dropped-in version of JSX transformer" do
19 | hidden_path = Rails.root.join("vendor/assets/react/JSXTransformer__.js")
20 | replacing_path = Rails.root.join("vendor/assets/react/JSXTransformer.js")
21 |
22 | FileUtils.cp hidden_path, replacing_path
23 | SprocketsHelpers.manually_expire_asset("example3.js")
24 |
25 | get "/assets/example3.js"
26 | FileUtils.rm replacing_path
27 |
28 | assert_response :success
29 | assert_equal "test_confirmation_token_jsx_transformed;", @response.body.strip
30 | end
31 |
32 | test "accepts harmony: true option" do # rubocop:disable Minitest/MultipleAssertions
33 | React::JSX.transform_options = { harmony: true }
34 | get "/assets/harmony_example.js"
35 |
36 | assert_response :success
37 | assert_match(/generateGreeting:\s*function\(\)/, @response.body, "object literal methods")
38 | assert_match(/React.__spread/, @response.body, "spreading props")
39 | assert_match(/Your greeting is: '" \+ insertedGreeting \+ "'/, @response.body, "string interpolation")
40 | assert_match(/active=\$__0\.active/, @response.body, "destructuring assignment")
41 | end
42 |
43 | test "accepts strip_types: true option" do
44 | React::JSX.transform_options = { strip_types: true, harmony: true }
45 | get "/assets/flow_types_example.js"
46 |
47 | assert_response :success
48 | assert_match(/\(i\s*,\s*name\s*\)\s*\{/, @response.body, "type annotations are removed")
49 | end
50 |
51 | test "accepts asset_path: option" do
52 | hidden_path = Rails.root.join("vendor/assets/react/JSXTransformer__.js")
53 | custom_path = Rails.root.join("vendor/assets/react/custom")
54 | replacing_path = custom_path.join("CustomTransformer.js")
55 |
56 | React::JSX.transform_options = { asset_path: "custom/CustomTransformer.js" }
57 |
58 | FileUtils.mkdir_p(custom_path)
59 | FileUtils.cp(hidden_path, replacing_path)
60 | SprocketsHelpers.manually_expire_asset("example3.js")
61 | get "/assets/example3.js"
62 |
63 | FileUtils.rm_rf custom_path
64 |
65 | assert_response :success
66 | assert_equal "test_confirmation_token_jsx_transformed;", @response.body.strip
67 | end
68 | end
69 | end
70 |
--------------------------------------------------------------------------------
/test/react/jsx_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | # Sprockets is inserting a newline after the docblock for some reason...
6 | EXPECTED_JS = <<~STR
7 | [2].concat([1]);React.createElement("div", null);
8 | STR
9 |
10 | EXPECTED_JS_2 = <<~STR
11 | (function() {
12 | var Component;
13 |
14 | Component = createReactClass({
15 | render: function() {
16 | return React.createElement(ExampleComponent, {videos:this.props.videos} );
17 | }
18 | });
19 |
20 | this.Component = Component;
21 | }).call(this);
22 | STR
23 |
24 | class NullTransformer
25 | def initialize(_options = {}); end # rubocop:disable Style/RedundantInitialize
26 |
27 | def transform(_code)
28 | "TRANSFORMED CODE!;\n"
29 | end
30 | end
31 |
32 | class JSXTransformTest < ActionDispatch::IntegrationTest
33 | SprocketsHelpers.when_available do
34 | setup do
35 | reset_transformer
36 | end
37 |
38 | teardown do
39 | reset_transformer
40 | end
41 |
42 | test "asset pipeline should transform JSX" do
43 | SprocketsHelpers.manually_expire_asset("example.js")
44 | get "/assets/example.js"
45 |
46 | assert_response :success
47 | assert_compiled_javascript_matches(EXPECTED_JS, @response.body)
48 | end
49 |
50 | test "asset pipeline should transform JSX + Coffeescript" do
51 | SprocketsHelpers.manually_expire_asset("example2.js")
52 | get "/assets/example2.js"
53 |
54 | assert_response :success
55 | assert_compiled_javascript_matches(EXPECTED_JS_2, @response.body)
56 | end
57 |
58 | test "use a custom transformer" do
59 | React::JSX.transformer_class = NullTransformer
60 | SprocketsHelpers.manually_expire_asset("example2.js")
61 | get "/assets/example2.js"
62 |
63 | assert_equal "TRANSFORMED CODE!;\n", @response.body
64 | end
65 |
66 | def test_babel_transformer_accepts_babel_transformation_options
67 | React::JSX.transform_options = { blacklist: ["spec.functionName", "validation.react", "strict"] }
68 | SprocketsHelpers.manually_expire_asset("example.js")
69 | get "/assets/example.js"
70 |
71 | assert_response :success
72 |
73 | refute_includes @response.body, "strict"
74 | end
75 | end
76 | end
77 |
--------------------------------------------------------------------------------
/test/react/rails/asset_variant_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class AssetVariantTest < ActiveSupport::TestCase
6 | def build_variant(options)
7 | React::Rails::AssetVariant.new(options)
8 | end
9 |
10 | test "it points to different directories for react" do
11 | production_variant = build_variant(variant: :production)
12 |
13 | assert_match(%r{/lib/assets/react-source/production}, production_variant.react_directory)
14 |
15 | development_variant = build_variant(variant: nil)
16 |
17 | assert_match(%r{/lib/assets/react-source/development}, development_variant.react_directory)
18 | end
19 |
20 | test "points to jsx transformer" do
21 | variant = build_variant({})
22 |
23 | assert_match(%r{/lib/assets/javascripts/}, variant.jsx_directory)
24 | end
25 | end
26 |
--------------------------------------------------------------------------------
/test/react/rails/controller_lifecycle_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | # This helper implementation just counts the number of
6 | # calls to `react_component`
7 | class DummyHelperImplementation
8 | attr_reader :events
9 |
10 | def initialize
11 | @events = []
12 | end
13 |
14 | def setup(controller)
15 | @events << (controller.params["param_test"] || :setup)
16 | end
17 |
18 | def teardown(_env)
19 | @events << :teardown
20 | end
21 |
22 | def react_component(*_args)
23 | @events << :react_component
24 | end
25 | end
26 |
27 | class ControllerLifecycleTest < ActionDispatch::IntegrationTest
28 | compiled = false
29 | setup do
30 | ShakapackerHelpers.compile unless compiled
31 |
32 | @previous_helper_implementation = React::Rails::ViewHelper.helper_implementation_class
33 | React::Rails::ViewHelper.helper_implementation_class = DummyHelperImplementation
34 | end
35 |
36 | def teardown
37 | React::Rails::ViewHelper.helper_implementation_class = @previous_helper_implementation
38 | end
39 |
40 | test "it creates a helper object and puts it in the request env" do
41 | get "/pages/1"
42 | helper_obj = controller.__react_component_helper
43 |
44 | assert_kind_of(DummyHelperImplementation, helper_obj, "It uses the view helper implementation class")
45 | end
46 |
47 | test "it calls setup and teardown methods" do
48 | get "/pages/1?param_test=123"
49 | helper_obj = controller.__react_component_helper
50 | lifecycle_steps = ["123", :react_component, :react_component, :teardown]
51 |
52 | assert_equal(lifecycle_steps, helper_obj.events)
53 | end
54 |
55 | test "there's a new helper object for every request" do
56 | get "/pages/1"
57 | first_helper = controller.__react_component_helper
58 | get "/pages/1"
59 | second_helper = controller.__react_component_helper
60 |
61 | refute_equal(first_helper, second_helper, "The helper for the second request is brand new")
62 | end
63 | end
64 |
--------------------------------------------------------------------------------
/test/react/rails/pages_controller_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class PagesControllerTest < ActionController::TestCase
6 | include ParamsHelper
7 | setup do
8 | ShakapackerHelpers.compile_if_missing
9 | end
10 |
11 | test "renders successfully" do
12 | get :show, params: { id: 1 }
13 |
14 | assert_equal(200, response.status)
15 | end
16 |
17 | when_stateful_js_context_available do
18 | test "it sets up and tears down a react context" do
19 | get :show, params: { id: 1, prerender: true }
20 |
21 | assert_includes(response.body, "Hello")
22 | end
23 |
24 | test "it sets up and tears down a react context with the given greeting text" do
25 | get :show, params: { id: 1, prerender: true, greeting: "Howdy" }
26 |
27 | assert_includes(response.body, "Howdy")
28 | end
29 |
30 | test "it sets up and tears down a react context with the given greeting emoji" do
31 | get :show, params: { id: 1, prerender: true, greeting: "👋" }
32 |
33 | assert_includes(response.body, "👋")
34 | end
35 | end
36 | end
37 |
--------------------------------------------------------------------------------
/test/react/rails/railtie_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class RailtieTest < ActionDispatch::IntegrationTest
6 | test "reloaders are configured after initializers are loaded" do
7 | @test_file = File.expand_path("../../dummy/app/pants/yfronts.js", File.dirname(__FILE__))
8 | FileUtils.touch @test_file
9 | results = Dummy::Application.reloaders.map(&:updated?)
10 |
11 | assert_includes(results, true)
12 | end
13 | end
14 |
--------------------------------------------------------------------------------
/test/react/rails/realtime_update_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class RealtimeUpdateTest < ActiveSupport::TestCase
6 | ShakapackerHelpers.when_shakapacker_available do
7 | include Capybara::DSL
8 |
9 | def assert_counter_count(page, timer_name, count)
10 | assert page.has_content?("#{timer_name} - #{count}"), <<~MSG
11 | #{page.body}
12 | #{page.driver.browser.logs.get(:browser).inspect}
13 | MSG
14 | end
15 |
16 | setup do
17 | Capybara.current_driver = Capybara.javascript_driver
18 | ShakapackerHelpers.compile
19 | React::ServerRendering.reset_pool
20 | end
21 |
22 | teardown do
23 | ShakapackerHelpers.clear_shakapacker_packs
24 | end
25 |
26 | test "doesn't re-mount the components trees when mountComponents is called" do
27 | visit "/counters"
28 |
29 | assert_counter_count(page, "Counter 1", 0)
30 | page.click_button "Increment Counter 1"
31 | page.click_button "Add counter"
32 | sleep 0.1
33 |
34 | assert_counter_count(page, "Counter 1", 1)
35 | assert_counter_count(page, "Counter 2", 0)
36 | end
37 | end
38 | end
39 |
--------------------------------------------------------------------------------
/test/react/rails/test_helper_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class TestHelperTest < ActionDispatch::IntegrationTest
6 | setup do
7 | ShakapackerHelpers.compile_if_missing
8 | end
9 |
10 | test "assert_react_component" do # rubocop:disable Minitest/MultipleAssertions
11 | get "/pages/1"
12 |
13 | assert_equal 200, response.status
14 | assert_react_component "GreetingMessage"
15 | assert_react_component "GreetingMessage" do |props|
16 | assert_equal "Bob", props[:name]
17 | assert_equal "Last Bob", props[:lastName]
18 | assert_equal "Bob", props[:info][:name]
19 | assert_equal "Last Bob", props[:info][:lastName]
20 |
21 | assert_select "[id=?]", "component"
22 | assert_select "[class=?]", "greeting-message"
23 | end
24 | assert_react_component "Todo" do |props|
25 | assert_equal "Another Component", props[:todo]
26 | end
27 | end
28 | end
29 |
--------------------------------------------------------------------------------
/test/react/rails/view_helper_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | # Provide direct access to the view helper methods
6 | class ViewHelperHelper
7 | extend ActionView::Context
8 | extend ActionView::Helpers::CaptureHelper
9 | extend React::Rails::ViewHelper
10 | end
11 |
12 | class ViewHelperTest < ActionView::TestCase
13 | test "view helper can be called directly" do
14 | expected_html = %() # rubocop:disable Layout/LineLength
15 | rendered_html = ViewHelperHelper.react_component("Component", { a: "b" })
16 |
17 | assert_equal(expected_html, rendered_html)
18 | end
19 |
20 | test "view helper accepts block usage" do
21 | expected_html = %(content
) # rubocop:disable Layout/LineLength
22 | rendered_html = ViewHelperHelper.react_component("Component", { a: "b" }) do
23 | "content"
24 | end
25 |
26 | assert_equal(expected_html, rendered_html)
27 | end
28 |
29 | test "view helper can be used in stand-alone views" do
30 | @name = "React-Rails"
31 | render template: "pages/show"
32 |
33 | assert_includes(rendered, "React-Rails")
34 | end
35 |
36 | test "view helper can accept block and render inner content only once" do
37 | rendered_html = render partial: "pages/component_with_inner_html"
38 | expected_html = <<~HTML
39 |
42 | HTML
43 | assert_equal expected_html.strip, rendered_html
44 | end
45 |
46 | test "view helper uses the implementation class set in the initializer" do
47 | assert_equal("CustomComponentMount", React::Rails::ViewHelper.helper_implementation_class.to_s)
48 | end
49 | end
50 |
--------------------------------------------------------------------------------
/test/react/rails/webpacker_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class ReactRailsShakapackerTest < ActionDispatch::IntegrationTest
6 | ShakapackerHelpers.when_shakapacker_available do
7 | include Capybara::DSL
8 |
9 | setup do
10 | Capybara.current_driver = Capybara.javascript_driver
11 | ShakapackerHelpers.compile
12 | React::ServerRendering.reset_pool
13 | end
14 |
15 | teardown do
16 | ShakapackerHelpers.clear_shakapacker_packs
17 | end
18 |
19 | test "it mounts components from the pack" do # rubocop:disable Minitest/MultipleAssertions
20 | visit "/pack_component"
21 |
22 | assert page.has_content?("Export Default")
23 | assert page.has_content?("Named Export")
24 | assert page.has_content?("Exports")
25 | assert page.has_content?("Global Component")
26 | end
27 | end
28 | end
29 |
--------------------------------------------------------------------------------
/test/react/server_rendering/console_replay_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | if ShakapackerHelpers.available? || SprocketsHelpers.available?
6 | class ConsoleReplayTest < ActionDispatch::IntegrationTest
7 | setup do
8 | ShakapackerHelpers.compile
9 | React::ServerRendering.renderer_options = { replay_console: true }
10 | React::ServerRendering.reset_pool
11 | end
12 |
13 | EXPECTED_REPLAY = <<~HTML
14 |
17 | HTML
18 |
19 | test "it clears the state between each request" do
20 | # Each request should only contain one log:
21 | get "/server/1"
22 |
23 | assert_includes(response.body, EXPECTED_REPLAY)
24 | get "/server/1"
25 |
26 | assert_includes(response.body, EXPECTED_REPLAY)
27 | end
28 | end
29 | end
30 |
--------------------------------------------------------------------------------
/test/react/server_rendering/exec_js_renderer_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | DUMMY_IMPLEMENTATION = "
6 | var Todo = null
7 | var React = {
8 | createElement: function() {},
9 | }
10 | this.ReactRailsUJS = {
11 | serverRender: function() {
12 | return 'serverRender was called'
13 | },
14 | }
15 | "
16 |
17 | class ExecJSRendererTest < ActiveSupport::TestCase
18 | setup do
19 | react_server_source = File.read(File.expand_path("../../../lib/assets/react-source/production/react-server.js",
20 | __dir__))
21 | react_ujs_source = File.read(File.expand_path("../../../lib/assets/javascripts/react_ujs.js", __dir__))
22 | todo_component_source = File.read(
23 | File.expand_path(
24 | "../../dummy/app/assets/javascripts/components/PlainJSTodo.js", __dir__
25 | )
26 | )
27 | code = react_server_source + react_ujs_source + todo_component_source
28 | @renderer = React::ServerRendering::ExecJSRenderer.new(code: code)
29 | end
30 |
31 | test "#render returns HTML" do
32 | result = @renderer.render("Todo", { todo: "write tests" }.to_json, {})
33 |
34 | assert_match(%r{}, result)
35 | end
36 |
37 | test "#render accepts render_function:" do
38 | result = @renderer.render("Todo", { todo: "write more tests" }.to_json, render_function: "renderToStaticMarkup")
39 |
40 | assert_match(%r{write more tests}, result)
41 | end
42 |
43 | test "#before_render is called before #after_render" do
44 | def @renderer.before_render(_name, _props, _opts)
45 | "throw 'before_render ' + afterRenderVar"
46 | end
47 |
48 | def @renderer.after_render(_name, _props, _opts)
49 | "var afterRenderVar = 'assigned_after_render'"
50 | end
51 |
52 | error = assert_raises(React::ServerRendering::PrerenderError) do
53 | @renderer.render("Todo", { todo: "write tests" }.to_json, {})
54 | end
55 |
56 | assert_match(/before_render/, error.message)
57 | assert_no_match(/assigned_after_render/, error.message)
58 | end
59 |
60 | test "#after_render is called after #before_render" do
61 | def @renderer.before_render(_name, _props, _opts)
62 | "var beforeRenderVar = 'assigned_before_render'"
63 | end
64 |
65 | def @renderer.after_render(_name, _props, _opts)
66 | "throw 'after_render ' + beforeRenderVar"
67 | end
68 |
69 | error = assert_raises(React::ServerRendering::PrerenderError) do
70 | @renderer.render("Todo", { todo: "write tests" }.to_json, {})
71 | end
72 |
73 | assert_match(/after_render/, error.message)
74 | assert_match(/assigned_before_render/, error.message)
75 | end
76 |
77 | test ".new accepts code:" do
78 | dummy_renderer = React::ServerRendering::ExecJSRenderer.new(code: DUMMY_IMPLEMENTATION)
79 | result = dummy_renderer.render("Todo", { todo: "get a real job" }.to_json, {})
80 |
81 | assert_equal("serverRender was called", result)
82 | end
83 | end
84 |
--------------------------------------------------------------------------------
/test/react/server_rendering/manifest_container_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | # sprockets-rails < 2.2.2 does not support
6 | # `application.assets_manifest`. Since sprockets-rails < 2.1.2 does
7 | # not define `Sprockets::Rails::VERSION`, checking for
8 | # `Sprockets::Rails` is not enough.
9 | if defined?(Sprockets::Rails::VERSION) &&
10 | Gem::Version.new(Sprockets::Rails::VERSION) >= Gem::Version.new("2.2.2")
11 |
12 | class ManifestContainerTest < ActiveSupport::TestCase
13 | def setup
14 | SprocketsHelpers.precompile_assets
15 |
16 | @manifest_container = React::ServerRendering::ManifestContainer.new
17 | end
18 |
19 | def teardown
20 | SprocketsHelpers.clear_precompiled_assets
21 | end
22 |
23 | def test_find_asset_gets_asset_contents
24 | application_js_content = @manifest_container.find_asset("application.js")
25 |
26 | assert_operator(application_js_content.length, :>, 50_000, "It's the compiled file")
27 | end
28 | end
29 | end
30 |
--------------------------------------------------------------------------------
/test/react/server_rendering/webpacker_containers_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 | require "open-uri"
5 |
6 | class ShakapackerManifestContainerTest < ActiveSupport::TestCase
7 | ShakapackerHelpers.when_shakapacker_available do
8 | setup do
9 | ShakapackerHelpers.clear_shakapacker_packs
10 | end
11 |
12 | def test_it_loads_js_from_the_shakapacker_container
13 | ShakapackerHelpers.compile
14 | container = React::ServerRendering::SeparateServerBundleContainer.new
15 |
16 | assert_not_empty container.find_asset("server_rendering.js")
17 | end
18 | end
19 | end
20 |
--------------------------------------------------------------------------------
/test/react/server_rendering/yaml_manifest_container_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | if Rails::VERSION::MAJOR == 3
6 | class YamlManifestContainerTest < ActiveSupport::TestCase
7 | def setup
8 | SprocketsHelpers.precompile_assets
9 |
10 | @manifest_container = React::ServerRendering::YamlManifestContainer.new
11 | end
12 |
13 | def teardown
14 | SprocketsHelpers.clear_precompiled_assets
15 | end
16 |
17 | def test_find_asset_gets_asset_contents
18 | application_js_content = @manifest_container.find_asset("application.js")
19 |
20 | assert_operator(application_js_content.length, :>, 50_000, "It's the compiled file")
21 | end
22 | end
23 | end
24 |
--------------------------------------------------------------------------------
/test/react/server_rendering_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class NullRenderer
6 | def initialize(options)
7 | # in this case, options is actually a string (just for testing)
8 | @name = options
9 | end
10 |
11 | def render(component_name, props, prerender_options)
12 | "#{@name} rendered #{component_name} with #{props} and #{prerender_options}"
13 | end
14 | end
15 |
16 | class ReactServerRenderingTest < ActiveSupport::TestCase
17 | setup do
18 | @previous_renderer = React::ServerRendering.renderer
19 | @previous_options = React::ServerRendering.renderer_options
20 | React::ServerRendering.renderer_options = "TEST"
21 | React::ServerRendering.renderer = NullRenderer
22 | React::ServerRendering.reset_pool
23 | end
24 |
25 | teardown do
26 | React::ServerRendering.renderer = @previous_renderer
27 | React::ServerRendering.renderer_options = @previous_options
28 | React::ServerRendering.reset_pool
29 | end
30 |
31 | test ".render returns a rendered string" do
32 | props = { "props" => true }
33 | result = React::ServerRendering.render("MyComponent", props, "prerender-opts")
34 |
35 | assert_equal("TEST rendered MyComponent with #{props} and prerender-opts", result)
36 | end
37 |
38 | test ".reset_pool forgets old renderers" do # rubocop:disable Minitest/MultipleAssertions
39 | # At first, they use the first options:
40 | assert_match(/^TEST/, React::ServerRendering.render(nil, nil, nil))
41 | assert_match(/^TEST/, React::ServerRendering.render(nil, nil, nil))
42 |
43 | # Then change the init options and clear the pool:
44 | React::ServerRendering.renderer_options = "DIFFERENT"
45 | React::ServerRendering.reset_pool
46 | # New renderers are created with the new init options:
47 | assert_match(/^DIFFERENT/, React::ServerRendering.render(nil, nil, nil))
48 | assert_match(/^DIFFERENT/, React::ServerRendering.render(nil, nil, nil))
49 | end
50 | end
51 |
--------------------------------------------------------------------------------
/test/react_asset_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class ReactAssetTest < ActionDispatch::IntegrationTest
6 | SprocketsHelpers.when_available do
7 | setup do
8 | SprocketsHelpers.clear_sprockets_cache
9 | end
10 |
11 | teardown do
12 | SprocketsHelpers.clear_sprockets_cache
13 | end
14 |
15 | test "asset pipeline should deliver drop-in react file replacement" do
16 | app_react_file_path = File.expand_path("dummy/vendor/assets/javascripts/react.js", __dir__)
17 | react_file_token = "'test_confirmation_token_react_content_non_production';\n"
18 | File.write(app_react_file_path, react_file_token)
19 | SprocketsHelpers.manually_expire_asset("react.js")
20 | react_asset = Rails.application.assets["react.js"]
21 |
22 | get "/assets/react.js"
23 |
24 | File.unlink(app_react_file_path)
25 |
26 | assert_response :success
27 | assert_equal react_file_token.length, react_asset.to_s.length, "The asset pipeline serves the drop-in file"
28 | assert_equal react_file_token.length, @response.body.length, "The asset route serves the drop-in file"
29 | end
30 |
31 | test "precompiling assets works" do
32 | SprocketsHelpers.precompile_assets
33 | ensure
34 | SprocketsHelpers.clear_precompiled_assets
35 | end
36 |
37 | test "the production build is optimized for production" do
38 | production_path = File.expand_path("../lib/assets/react-source/production/react.js", __dir__)
39 | production_js = File.read(production_path)
40 | env_checks = production_js.scan("NODE_ENV")
41 |
42 | assert_equal(0, env_checks.length, "Dead code is removed for production")
43 | end
44 | end
45 | end
46 |
--------------------------------------------------------------------------------
/test/react_test.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | require "test_helper"
4 |
5 | class ReactTest < ActiveSupport::TestCase
6 | def test_it_camelizes_props
7 | raw_props = {
8 | multi_word_sym: {
9 | nested_key: [
10 | { double_nested: true },
11 | 1,
12 | "string item",
13 | [{ nested_array: {} }]
14 | ]
15 | },
16 | "alreadyCamelized" => :ok
17 | }
18 |
19 | expected_props = {
20 | "multiWordSym" => {
21 | "nestedKey" => [
22 | { "doubleNested" => true },
23 | 1,
24 | "string item",
25 | [{ "nestedArray" => {} }]
26 | ]
27 | },
28 | "alreadyCamelized" => "ok"
29 | }
30 |
31 | assert_equal expected_props, React.camelize_props(raw_props)
32 | end
33 |
34 | def test_it_camelizes_params
35 | raw_params = ActionController::Parameters.new({
36 | foo_bar_baz: "foo bar baz",
37 | nested_keys: {
38 | qux_etc: "bish bash bosh"
39 | }
40 | })
41 | permitted_params = raw_params.permit(:foo_bar_baz, nested_keys: :qux_etc)
42 |
43 | expected_params = {
44 | "fooBarBaz" => "foo bar baz",
45 | "nestedKeys" => {
46 | "quxEtc" => "bish bash bosh"
47 | }
48 | }
49 |
50 | assert_equal expected_params, React.camelize_props(permitted_params)
51 | end
52 |
53 | def test_it_camelizes_json_serializable_objects
54 | my_json_serializer = Class.new do
55 | def initialize(data)
56 | @data = data
57 | end
58 |
59 | def as_json
60 | @data
61 | end
62 | end
63 |
64 | raw_props = {
65 | key_one: "value1",
66 | key_two: my_json_serializer.new(
67 | nested_key_one: "nested_value1",
68 | nested_key_two: %w[nested value two]
69 | )
70 | }
71 |
72 | expected_params = {
73 | "keyOne" => "value1",
74 | "keyTwo" => {
75 | "nestedKeyOne" => "nested_value1",
76 | "nestedKeyTwo" => %w[nested value two]
77 | }
78 | }
79 |
80 | assert_equal expected_params, React.camelize_props(raw_props)
81 | end
82 | end
83 |
--------------------------------------------------------------------------------
/test/support/sprockets_helpers.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module SprocketsHelpers
4 | module_function
5 |
6 | def available?
7 | # We can't scan for sprockets in gemfile_lock because it's
8 | # a dependency of Rails even if not required.
9 | # We also can't scan for defined?(Sprockets) because this is used to
10 | # require Sprockets in the config/application.rb
11 | # !!Bundler.locked_gems.specs.find {|gem_spec| gem_spec.name == 'sprockets'}
12 | ENV.fetch("BUNDLE_GEMFILE", nil).include?("sprockets")
13 | end
14 |
15 | # The block depends on sprockets, don't run it if sprockets is missing
16 | def when_available
17 | return unless available?
18 |
19 | yield
20 | end
21 |
22 | def clear_sprockets_cache
23 | # Remove cached files
24 | Rails.root.join("tmp/cache").tap do |tmp|
25 | tmp.rmtree if tmp.exist?
26 | tmp.mkpath
27 | end
28 | end
29 |
30 | def fetch_asset_body(asset_logical_path)
31 | Rails.application.assets[asset_logical_path].to_s
32 | end
33 |
34 | # Sprockets 2 doesn't expire this assets well in
35 | # this kind of setting,
36 | # so override `fresh?` to mark it as expired.
37 | def manually_expire_asset(asset_name)
38 | asset = Rails.application.assets[asset_name]
39 | def asset.fresh?(_env)
40 | false
41 | end
42 | end
43 |
44 | def precompile_assets
45 | invoke_assets_precompile_task
46 |
47 | if Rails.application.respond_to?(:assets_manifest)
48 | # Make a new manifest since assets weren't compiled before
49 | config = Rails.application.config
50 | path = File.join(config.paths["public"].first, config.assets.prefix)
51 | new_manifest = Sprockets::Manifest.new(Rails.application.assets, path)
52 | Rails.application.assets_manifest = new_manifest
53 | end
54 |
55 | assets_directory = File.expand_path("../dummy/public/assets", __dir__)
56 | raise "Asset precompilation failed" unless Dir.exist?(assets_directory)
57 | end
58 |
59 | def clear_precompiled_assets
60 | assets_directory = File.expand_path("../dummy/public/assets", __dir__)
61 | FileUtils.rm_r(assets_directory)
62 | ENV.delete("RAILS_GROUPS")
63 | end
64 |
65 | class << self
66 | private
67 |
68 | def invoke_assets_precompile_task
69 | # Changing directories is required because:
70 | # - assets:precompile runs webpacker:compile when availabled
71 | # - webpacker:compile depends on `./bin/webpack`, so `.` must be the app root
72 | Dir.chdir("./test/dummy") do
73 | ENV["RAILS_GROUPS"] = "assets" # required for Rails 3.2
74 | Rake::Task["assets:precompile"].reenable
75 |
76 | if Rails::VERSION::MAJOR == 3
77 | Rake::Task["assets:precompile:all"].reenable
78 | Rake::Task["assets:precompile:primary"].reenable
79 | Rake::Task["assets:precompile:nondigest"].reenable
80 | end
81 |
82 | Rake::Task["assets:precompile"].invoke
83 | end
84 | end
85 | end
86 | end
87 |
--------------------------------------------------------------------------------
/test/support/webpacker_helpers.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | module ShakapackerHelpers
4 | PACKS_DIRECTORY = File.expand_path("../dummy/public/packs", __dir__)
5 |
6 | module_function
7 |
8 | def available?
9 | !!defined?(Shakapacker)
10 | end
11 |
12 | def when_shakapacker_available
13 | return unless available?
14 |
15 | yield
16 | end
17 |
18 | def compile
19 | return unless available?
20 |
21 | clear_shakapacker_packs
22 | Dir.chdir("./test/dummy") do
23 | Rake::Task["shakapacker:compile"].reenable
24 | Rake::Task["shakapacker:compile"].invoke
25 | end
26 | # Reload cached JSON manifest:
27 | manifest_refresh
28 | end
29 |
30 | def compile_if_missing
31 | return if File.exist?(PACKS_DIRECTORY)
32 |
33 | compile
34 | end
35 |
36 | def clear_shakapacker_packs
37 | FileUtils.rm_rf(PACKS_DIRECTORY)
38 | end
39 |
40 | # Start a webpack-dev-server
41 | # Call the block
42 | # Make sure to clean up the server
43 | def with_dev_server
44 | old_env = ENV.fetch("NODE_ENV", nil)
45 | ENV["NODE_ENV"] = "development"
46 |
47 | # Start the server in a forked process:
48 | Dir.chdir("test/dummy") do
49 | spawn "RAILS_ENV=development ./bin/shakapacker-dev-server"
50 | end
51 |
52 | stop_time = Time.now + 30.seconds
53 | detected_dev_server = false
54 | loop do
55 | detected_dev_server = dev_server_running?
56 | break if detected_dev_server || Time.now > stop_time
57 |
58 | sleep 0.5
59 | end
60 |
61 | # If we didn't hook up with a dev server after waiting, fail loudly.
62 | raise "Failed to start dev server" unless detected_dev_server
63 |
64 | puts "Detected dev server - Continuing"
65 |
66 | # Call the test block:
67 | yield
68 | ensure
69 | check_cmd = "lsof -i :8080 -S"
70 | 10.times do
71 | # puts check_cmd
72 | status = `#{check_cmd}`
73 | # puts status
74 | remaining_pid_match = status.match(/\n[a-z]+\s+(\d+)/)
75 | break unless remaining_pid_match
76 |
77 | remaining_pid = remaining_pid_match[1]
78 | # puts "Remaining #{remaining_pid}"
79 | kill_cmd = "kill -9 #{remaining_pid}"
80 | # puts kill_cmd
81 | `#{kill_cmd}`
82 | sleep 0.5
83 | end
84 |
85 | # Remove the dev-server packs:
86 | ShakapackerHelpers.clear_shakapacker_packs
87 | ENV["NODE_ENV"] = old_env
88 | puts "Killed."
89 | end
90 |
91 | def dev_server_running?
92 | Shakapacker.instance.instance_variable_set(:@config, nil)
93 | return false unless Shakapacker.dev_server.running?
94 |
95 | ds = Shakapacker.dev_server
96 | example_asset_path = manifest_data.values.first
97 | return false unless example_asset_path
98 |
99 | begin
100 | file = URI.parse("#{ds.protocol}://#{ds.host}:#{ds.port}#{example_asset_path}").open
101 | rescue StandardError
102 | file = nil
103 | end
104 | unless file
105 | puts "Dev server is not serving assets yet"
106 | return false
107 | end
108 | true
109 | end
110 |
111 | def manifest_refresh
112 | Shakapacker.manifest.refresh
113 | end
114 |
115 | def manifest_lookup
116 | Shakapacker.manifest
117 | end
118 |
119 | def manifest_data
120 | Shakapacker.manifest.refresh
121 | end
122 | end
123 |
--------------------------------------------------------------------------------
/test/test_helper.rb:
--------------------------------------------------------------------------------
1 | # frozen_string_literal: true
2 |
3 | if RUBY_PLATFORM != "java"
4 | require "simplecov"
5 | SimpleCov.start
6 | end
7 |
8 | support_path = File.expand_path("support/*.rb", __dir__)
9 | Dir.glob(support_path).sort.each do |f|
10 | require(f)
11 | end
12 |
13 | # Configure Rails Environment
14 | ENV["RAILS_ENV"] = "test"
15 |
16 | require File.expand_path("dummy/config/environment.rb", __dir__)
17 | require "rails/test_help"
18 | require "rails/generators"
19 | require "pathname"
20 | require "minitest/mock"
21 | require "capybara/rails"
22 | require "selenium/webdriver"
23 | require "minitest/retry"
24 | Minitest::Retry.use!
25 | Dummy::Application.load_tasks
26 |
27 | ShakapackerHelpers.clear_shakapacker_packs
28 |
29 | Capybara.app = Rails.application
30 | Capybara.server = :webrick
31 |
32 | Capybara.register_driver :headless_chrome do |app|
33 | options = Selenium::WebDriver::Chrome::Options.new(args: %w[no-sandbox headless=new disable-gpu])
34 |
35 | Capybara::Selenium::Driver.new(app, browser: :chrome, options: options, timeout: 300)
36 | end
37 |
38 | Capybara.javascript_driver = :headless_chrome
39 | Capybara.current_driver = Capybara.javascript_driver
40 |
41 | CACHE_PATH = Pathname.new File.expand_path("dummy/tmp/cache", __dir__)
42 |
43 | Rails.backtrace_cleaner.remove_silencers!
44 |
45 | def reset_transformer
46 | SprocketsHelpers.clear_sprockets_cache
47 | React::JSX.transformer_class = React::JSX::DEFAULT_TRANSFORMER
48 | React::JSX.transform_options = {}
49 | React::JSX.transformer = nil
50 | end
51 |
52 | # Load support files
53 | Dir["#{File.dirname(__FILE__)}/support/**/*.rb"].sort.each { |f| require f }
54 |
55 | # Load fixtures from the engine
56 | if ActiveSupport::TestCase.method_defined?(:fixture_path=)
57 | ActiveSupport::TestCase.fixture_path = File.expand_path("fixtures", __dir__)
58 | end
59 |
60 | ActiveSupport::TestCase.test_order = :random if ActiveSupport::TestCase.respond_to?(:test_order=)
61 |
62 | def wait_for_turbolinks_to_be_available
63 | sleep(1)
64 | end
65 |
66 | # Different processors may generate slightly different outputs,
67 | # as some version inserts an extra "\n" at the beginning.
68 | # Because appraisal is used, multiple versions of coffee-script are treated
69 | # together. Remove all spaces to make test pass.
70 | def assert_compiled_javascript_matches(javascript, expectation)
71 | assert_equal expectation.gsub(/\s/, ""), javascript.gsub(/\s/, "")
72 | end
73 |
74 | def assert_compiled_javascript_includes(javascript, expected_part)
75 | assert_includes javascript.gsub(/\s/, ""), expected_part.gsub(/\s/, "")
76 | end
77 |
78 | def when_stateful_js_context_available
79 | return unless defined?(V8) || defined?(MiniRacer)
80 |
81 | yield
82 | end
83 |
84 | def expected_working_jsx
85 | /\.createElement\(\s*\S*\.Fragment,\s*null,\s*"Name:\s*",\s*this\.props\.name,\s*"Address:\s*",\s*this\.props\.address\s*\)/x # rubocop:disable Layout/LineLength
86 | end
87 |
88 | def expected_working_jsx_in_function_component
89 | /\.createElement\(\s*\S*\.Fragment,\s*null,\s*"Name:\s*",\s*props\.name,\s*"Address:\s*",\s*props\.address\s*\)/x
90 | end
91 |
92 | module ParamsHelper
93 | # Normalize params for Rails 5.1+
94 | def query_params(params)
95 | if Rails::VERSION::MAJOR > 4
96 | { params: params }
97 | else
98 | params
99 | end
100 | end
101 | end
102 |
--------------------------------------------------------------------------------