quilt_rails 3.3.0 → 3.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 368430de6c7c02cfc1a3c569997ca045cbd08afe6a463143740adf0c3d8c3989
-  data.tar.gz: c0e39d8dd544865e466ea919fe3414c722411c0d0f91757a82abac333fb17f2a
+  metadata.gz: 1aedbb7a0485b28dcddfb679cdec0197d8da16e2934b61d435a47ece1402f025
+  data.tar.gz: 49124ea67fcf5ed1aaa0ed3c76b6b56332aab8b2ed6e54033e36708ca4ec9f62
 SHA512:
-  metadata.gz: 65fec4f054fd578870567e4528ebd6b5e335877db8096d6af27775869a2fd7ecce8547ed6f0104c6e542cc58bb00ed98a2148a915198d4512f5eb769f2d023f8
-  data.tar.gz: c17031bff1b39d21b771e062dbdc5745e78b937a21989b444ca46d68cee1d6ead8b7b00e8b2c0131b6f0d656fa8fed962a37241e3c244f05716e7a19b4eb1c36
+  metadata.gz: '082b47b61be965938a4b882fe92e459b5651abadc753ef737840de1f62b18b011fbe8fd87b26c1168674ee33291dc1831806ffad3ab0145497a8db6ce66abe7e'
+  data.tar.gz: f9a2d1195fec698f192b091fac540a408e8e05721c3322f936c221da5b319a2a849955a6546b11ff13f48aebfe5299757c14c190ef309d8f3824ae0c91e496a3

data/README.md

@@ -1,6 +1,6 @@
 # quilt_rails
 
-A turn-key solution for integrating Quilt client-side libraries into your Rails app, with support for server-side-rendering using [`@shopify/react-server`](https://www.npmjs.com/package/@shopify/react-server), integration with [`@shopify/sewing-kit`](https://github.com/Shopify/sewing-kit) for building, testing and linting, and front-end performance tracking through [`@shopify/performance`](https://www.npmjs.com/package/@shopify/performance).
+A turn-key solution for integrating [Quilt](https://github.com/Shopify/quilt) client-side libraries into your Rails app, with support for server-side-rendering using [`@shopify/react-server`](https://www.npmjs.com/package/@shopify/react-server), integration with [`@shopify/sewing-kit`](https://github.com/Shopify/sewing-kit) for building, testing and linting, and front-end performance tracking through [`@shopify/performance`](https://www.npmjs.com/package/@shopify/performance).
 
 ## Table of Contents
 
@@ -67,9 +67,9 @@ Follow [this guide](./docs/manual-installation.md) on how to do manual setup wit
 
 For fast tests with consistent results, test front-end components using the tools provided by sewing-kit instead of Rails integration tests.
 
-Use [`sewing-kit test`](https://github.com/Shopify/sewing-kit/blob/master/docs/commands/test.md#L3) to run all `.test.{js|ts}x` files in the `app/ui` directory. [Jest](https://jestjs.io/) is used as a test runner, with customization available via [its sewing-kit plugin](https://github.com/Shopify/sewing-kit/blob/master/docs/plugins/jest.md).
+Use [`sewing-kit test`](https://github.com/Shopify/sewing-kit/blob/main/docs/commands/test.md#L3) to run all `.test.{js|ts}x` files in the `app/ui` directory. [Jest](https://jestjs.io/) is used as a test runner, with customization available via [its sewing-kit plugin](https://github.com/Shopify/sewing-kit/blob/main/docs/plugins/jest.md).
 
-For testing React applications we provide and support [`@shopify/react-testing`](https://github.com/Shopify/quilt/tree/master/packages/react-testing).
+For testing React applications we provide and support [`@shopify/react-testing`](https://github.com/Shopify/quilt/tree/main/packages/react-testing).
 
 ##### Example
 
@@ -102,11 +102,11 @@ describe('MyComponent', () => {
 
 Often you will want to hook up custom polyfills, global mocks, or other logic that needs to run either before the initialization of the test environment, or once for each test suite.
 
-By default, sewing-kit will look for such test setup files under `/app/ui/tests`. Check out the [documentation](https://github.com/Shopify/sewing-kit/blob/master/docs/plugins/jest.md#smart-defaults) for more details.
+By default, sewing-kit will look for such test setup files under `/app/ui/tests`. Check out the [documentation](https://github.com/Shopify/sewing-kit/blob/main/docs/plugins/jest.md#smart-defaults) for more details.
 
 ##### Interacting with the request and response in React code
 
-React-server sets up [@shopify/react-network](https://github.com/Shopify/quilt/blob/master/packages/react-network) automatically, so most interactions with the request or response can be done from inside the React app.
+React-server sets up [@shopify/react-network](https://github.com/Shopify/quilt/blob/main/packages/react-network) automatically, so most interactions with the request or response can be done from inside the React app.
 
 ##### Example: getting headers
 
@@ -131,7 +131,7 @@ function App() {
 export default App;
 ```
 
-**Note:** This solution works out of the box for initial server-side renders. If you wish to have consistent access to request headers on subsequent client-side renders, take a look at [`NetworkUniversalProvider`](https://github.com/Shopify/quilt/tree/master/packages/react-network#networkuniversalprovider).
+**Note:** This solution works out of the box for initial server-side renders. If you wish to have consistent access to request headers on subsequent client-side renders, take a look at [`NetworkUniversalProvider`](https://github.com/Shopify/quilt/tree/main/packages/react-network#networkuniversalprovider).
 
 ##### Example: sending custom headers from Rails controller
 
@@ -147,7 +147,7 @@ class ReactController < ApplicationController
 end
 ```
 
-🗒️ if you don't have a controller. Follow the [instruction](./docs/manual-installation#add-a-react-controller-and-routes) to setup `quilt_rails` in a controller instead of using the engine.
+🗒️ if you don't have a controller. Follow the [instruction](./docs/manual-installation.md#option-2-add-a-react-controller-and-routes) to setup `quilt_rails` in a controller instead of using the engine.
 
 Headers can be accessed during server-side-rendering with the `useRequestHeader` hook from `@shopify/react-network`.
 
@@ -171,7 +171,7 @@ In some cases you may want to send basic data from Rails to your React server. Q
 
 **Note:** The data passed should be data that is unlikely or will never change over the course of the session before they render any React components.
 
-**Note:** Please note the minimal dependencies require to use this feature is listed in [CHANGELOG](./CHANGELOG.md#[1.12.0]-2020-05-07)
+**Note:** Please note the minimal dependencies require to use this feature is listed in [CHANGELOG](./CHANGELOG.md#1.12.0-2020-05-07)
 
 ```ruby
 class ReactController < ApplicationController
@@ -183,7 +183,7 @@ class ReactController < ApplicationController
 end
 ```
 
-🗒️ if you don't have a controller. Follow the [instruction](./docs/manual-installation#add-a-react-controller-and-routes) to setup `quilt_rails` in a controller instead of using the engine.
+🗒️ if you don't have a controller. Follow the [instruction](./docs/manual-installation.md#option-2-add-a-react-controller-and-routes) to setup `quilt_rails` in a controller instead of using the engine.
 
 If using `react-server` without a customized server & client file, this will be automatically passed into your application as the `data` prop. If `react-server` is not being used or a customized server / client file was provided, check out [`react-server/webpack-plugin`](../../packages/react-server/src/webpack-plugin/webpack-plugin.ts) on how to pass the data to React.
 
@@ -222,9 +222,9 @@ export default App;
 
 #### Isomorphic state
 
-With SSR enabled React apps, state must be serialized on the server and deserialized on the client to keep it consistent. When using `@shopify/react-server`, the best tool for this job is [`@shopify/react-html`](https://github.com/Shopify/quilt/tree/master/packages/react-html)'s [`useSerialized`](https://github.com/Shopify/quilt/tree/master/packages/react-html#in-your-application-code) hook.
+With SSR enabled React apps, state must be serialized on the server and deserialized on the client to keep it consistent. When using `@shopify/react-server`, the best tool for this job is [`@shopify/react-html`](https://github.com/Shopify/quilt/tree/main/packages/react-html)'s [`useSerialized`](https://github.com/Shopify/quilt/tree/main/packages/react-html#in-your-application-code) hook.
 
-`useSerialized` can be used to implement [universal-providers](https://github.com/Shopify/quilt/tree/master/packages/react-universal-provider#what-is-a-universal-provider-), allowing application code to manage what is persisted between the server and client without adding any custom code to client or server entrypoints. We offer some for common use cases such as [GraphQL](https://github.com/Shopify/quilt/tree/master/packages/react-graphql-universal-provider), and [I18n](https://github.com/Shopify/quilt/tree/master/packages/react-i18n-universal-provider).
+`useSerialized` can be used to implement [universal-providers](https://github.com/Shopify/quilt/tree/main/packages/react-universal-provider#what-is-a-universal-provider-), allowing application code to manage what is persisted between the server and client without adding any custom code to client or server entrypoints. We offer some for common use cases such as [GraphQL](https://github.com/Shopify/quilt/tree/main/packages/react-graphql-universal-provider), and [I18n](https://github.com/Shopify/quilt/tree/main/packages/react-i18n-universal-provider).
 
 #### Customizing the Node server
 
@@ -289,7 +289,7 @@ end
 
 #### Exception monitoring with Bugsnag
 
-For an opinionated universal Bugsnag+React setup we provide and support [`@shopify/react-bugsnag`](https://github.com/Shopify/quilt/tree/master/packages/react-bugsnag).
+For an opinionated universal Bugsnag+React setup we provide and support [`@shopify/react-bugsnag`](https://github.com/Shopify/quilt/tree/main/packages/react-bugsnag).
 
 ##### Example
 

data/Rakefile

@@ -24,3 +24,5 @@ Rake::TestTask.new do |t|
   t.name = 'test:unit'
   t.pattern = 'test/quilt_rails/**/*_test.rb'
 end
+
+task(default: %i(test))

data/app/controllers/quilt/performance_report_controller.rb

@@ -8,9 +8,9 @@ module Quilt
     def create
       process_report
 
-      render json: { result: 'success' }, status: 200
+      render(json: { result: 'success' }, status: 200)
     rescue ActionController::ParameterMissing => error
-      render json: { error: error.message, status: 422 }
+      render(json: { error: error.message, status: 422 })
     end
   end
 end

data/app/controllers/quilt/ui_controller.rb

@@ -5,12 +5,17 @@ module Quilt
     include Quilt::ReactRenderable
     layout(false)
 
-    rescue_from(Quilt::ReactRenderable::ReactServerNoResponseError) do
-      render(:react_render_error, status: :internal_server_error)
-    end
-
     def index
       render_react
+    rescue Quilt::ReactRenderable::ReactServerNoResponseError
+      sleep(1)
+      retry if execution_count < 10
+      raise
+    end
+
+    def execution_count
+      @times ||= 0
+      @times = @times.next
     end
   end
 end

data/lib/generators/quilt/rails_setup/rails_setup_generator.rb

@@ -12,7 +12,7 @@ module Quilt
       if File.exist?(procfile_path)
         append_file(procfile_path, File.read(File.expand_path(find_in_source_paths(procfile_path))))
       else
-        copy_file procfile_path
+        copy_file(procfile_path)
       end
     end
 
@@ -20,12 +20,12 @@ module Quilt
       routes_path = "config/routes.rb"
 
       if File.exist?(routes_path)
-        route "mount Quilt::Engine, at: '/'"
+        route("mount Quilt::Engine, at: '/'")
       else
-        copy_file "routes.rb", routes_path
+        copy_file("routes.rb", routes_path)
       end
 
-      say "Added Quilt engine mount"
+      say("Added Quilt engine mount")
     end
   end
 end

data/lib/generators/quilt/react_setup/react_setup_generator.rb

@@ -10,7 +10,7 @@ module Quilt
     def install_js_dependencies
       return if options.skip_yarn?
 
-      say "Installing react and types dependencies"
+      say("Installing react and types dependencies")
       system("yarn add "\
         "typescript@~3.8.0 "\
         "react@~16.11.0 "\

data/lib/quilt_rails.rb

@@ -3,11 +3,12 @@ module Quilt
 end
 
 require "quilt_rails/version"
-require "quilt_rails/engine"
 require "quilt_rails/logger"
 require "quilt_rails/configuration"
 require "quilt_rails/react_renderable"
 require "quilt_rails/performance"
 require "quilt_rails/trusted_ui_server_csrf_strategy"
 require "quilt_rails/header_csrf_strategy"
+
+require "quilt_rails/engine"
 require "quilt_rails/monkey_patches/active_support_reloader" if Rails.env.development?

data/lib/quilt_rails/configuration.rb

@@ -1,23 +1,33 @@
 # frozen_string_literal: true
 
-module Quilt
-  class Configuration
-    attr_accessor :react_server_host, :react_server_protocol
+require "active_support/ordered_options"
 
+module Quilt
+  class Configuration < ActiveSupport::OrderedOptions
     def initialize
-      ip = ENV['REACT_SERVER_IP'] || 'localhost'
-      port = ENV['REACT_SERVER_PORT'] || 8081
+      super
+      react_server_ip   = ENV['REACT_SERVER_IP'] || "localhost"
+      react_server_port = ENV['REACT_SERVER_PORT'] || 8081
 
-      @react_server_host = "#{ip}:#{port}"
-      @react_server_protocol = ENV['REACT_SERVER_PROTOCOL'] || 'http'
+      self.react_server_host     = "#{react_server_ip}:#{react_server_port}"
+      self.react_server_protocol = ENV['REACT_SERVER_PROTOCOL'] || "http"
+      self.logger                = ::Logger.new($stdout)
+      self.mount                 = true
+      self.allow_integration_test = false
     end
-  end
 
-  def self.configuration
-    @configuration ||= Configuration.new
+    def mount?
+      mount
+    end
   end
 
-  def self.configure
-    yield(configuration)
+  class << self
+    def configuration
+      @configuration ||= Configuration.new
+    end
+
+    def configure
+      yield(configuration)
+    end
   end
 end

data/lib/quilt_rails/engine.rb

@@ -4,9 +4,17 @@ module Quilt
   class Engine < ::Rails::Engine
     isolate_namespace Quilt
 
+    config.quilt = Quilt.configuration
+
+    initializer(:initialize_quilt_logger, after: :initialize_logger) do
+      config.quilt.logger = ::Rails.logger
+    end
+
     initializer(:mount_quilt, before: :add_builtin_route) do |app|
-      app.routes.append do
-        mount(Quilt::Engine, at: '/') unless has_named_route?(:quilt)
+      if config.quilt.mount?
+        app.routes.append do
+          mount(Quilt::Engine, at: '/') unless has_named_route?(:quilt)
+        end
       end
     end
   end

data/lib/quilt_rails/header_csrf_strategy.rb

@@ -25,9 +25,10 @@ module Quilt
 
     class NoSameSiteHeaderError < StandardError
       def initialize
-        # rubocop:disable LineLength
-        super "CSRF verification failed. This request is missing the `x-shopify-react-xhr` header, or it does not have the expected value."
-        # rubocop:enable LineLength
+        super(<<~MSG.squish)
+          CSRF verification failed. This request is missing the
+          `x-shopify-react-xhr` header, or it does not have the expected value.
+        MSG
       end
     end
   end

data/lib/quilt_rails/logger.rb

@@ -3,11 +3,14 @@
 module Quilt
   module Logger
     def self.log(string)
-      if Rails.logger.nil?
-        puts string
-      else
-        Rails.logger.info(string)
-      end
+      ActiveSupport::Deprecation.warn(<<~MSG.squish)
+        Quilt::Logger.log is deprecated. Please use Quilt.logger instead.
+      MSG
+      Quilt.configuration.logger.info(string)
     end
   end
+
+  class << self
+    delegate(:logger, to: :configuration)
+  end
 end

data/lib/quilt_rails/performance/report.rb

@@ -7,25 +7,39 @@ module Quilt
       attr_accessor :navigations
       attr_accessor :connection
 
-      def self.from_params(params)
-        params.transform_keys! { |key| key.underscore.to_sym }
-        params[:connection] = { effectiveType: 'unknown' } if params[:connection].blank?
+      class << self
+        def from_params(params)
+          params.transform_keys! { |key| key.underscore.to_sym }
+          params[:connection] = { effectiveType: 'unknown' } if params[:connection].blank?
 
-        connection = Connection.from_params(params[:connection])
+          connection = Connection.from_params(params[:connection])
 
-        Report.new(
-          connection: connection,
-          navigations: (params[:navigations] || []).map do |navigation|
+          Report.new(
+            connection: connection,
+            navigations: build_navigations(params[:navigations], connection: connection),
+            events: build_events(params[:events], connection: connection),
+          )
+        end
+
+        private
+
+        def build_navigations(navigations_params, connection:)
+          navigations_params ||= []
+          navigations_params.map do |navigation|
             navigation = Navigation.from_params(navigation)
             navigation.connection = connection
             navigation
-          end,
-          events: (params[:events] || []).map do |event|
+          end
+        end
+
+        def build_events(events_params, connection:)
+          events_params ||= []
+          events_params.map do |event|
             event = Event.from_params(event)
             event.connection = connection
             event
-          end,
-        )
+          end
+        end
       end
 
       def initialize(events:, navigations:, connection:)

data/lib/quilt_rails/react_renderable.rb

@@ -7,7 +7,9 @@ module Quilt
     include ReverseProxy::Controller
 
     def render_react(headers: {}, data: {})
-      raise DoNotIntegrationTestError if Rails.env.test?
+      if Rails.env.test? && !Quilt.configuration.allow_integration_test
+        raise DoNotIntegrationTestError
+      end
 
       # Allow concurrent loading to prevent this thread from blocking class
       # loading in controllers called by the Node server.
@@ -20,7 +22,8 @@ module Quilt
 
     def call_proxy(headers, data)
       if defined? ShopifySecurityBase
-        ShopifySecurityBase::HTTPHostRestriction.whitelist([Quilt.configuration.react_server_host]) do
+        allowlist = ShopifySecurityBase::HTTPHostRestriction.respond_to?(:allowlist) ? :allowlist : :whitelist
+        ShopifySecurityBase::HTTPHostRestriction.send(allowlist, [Quilt.configuration.react_server_host]) do
           proxy(headers, data)
         end
       else
@@ -30,19 +33,19 @@ module Quilt
 
     def proxy(headers, data)
       url = "#{Quilt.configuration.react_server_protocol}://#{Quilt.configuration.react_server_host}"
-      Quilt::Logger.log("[ReactRenderable] proxying to React server at #{url}")
+      Quilt.logger.info("[ReactRenderable] proxying to React server at #{url}")
 
       unless headers.blank?
-        Quilt::Logger.log("[ReactRenderable] applying custom headers #{headers.inspect}")
+        Quilt.logger.info("[ReactRenderable] applying custom headers #{headers.inspect}")
       end
 
       begin
         reverse_proxy(
           url,
-          headers: headers.merge('X-Quilt-Data': data.to_json)
+          headers: headers.merge('X-Request-ID': request.request_id, 'X-Quilt-Data': data.to_json)
         ) do |callbacks|
           callbacks.on_response do |status_code, _response|
-            Quilt::Logger.log("[ReactRenderable] #{url} returned #{status_code}")
+            Quilt.logger.info("[ReactRenderable] #{url} returned #{status_code}")
           end
         end
       rescue Errno::ECONNREFUSED
@@ -52,17 +55,21 @@ module Quilt
 
     class ReactServerNoResponseError < StandardError
       def initialize(url)
-        # rubocop:disable LineLength
-        super "Errno::ECONNREFUSED: Waiting for React server to boot up. If this error persists verify that @shopify/react-server is configured on #{url}"
-        # rubocop:enable LineLength
+        super(<<~MSG.squish)
+          Connection refused while waiting for React server to boot up.
+          If this error persists, verify that @shopify/react-server is configured on #{url}.
+        MSG
       end
     end
 
     class DoNotIntegrationTestError < StandardError
       def initialize
-        # rubocop:disable LineLength
-        super "Do not try to use Rails integration tests on your quilt_rails app. Instead use Jest and @shopify/react-testing to test your React application directly."
-        # rubocop:enable LineLength
+        super(<<~MSG.squish)
+          Please don't test React views with Ruby.
+          Jest and @shopify/react-testing should be used to test React components.
+
+          If you meant to query your Rails application, please check your integration test for errors.
+        MSG
       end
     end
   end

data/lib/quilt_rails/version.rb

@@ -1,4 +1,4 @@
 # frozen_string_literal: true
 module Quilt
-  VERSION = "3.3.0"
+  VERSION = "3.5.0"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: quilt_rails
 version: !ruby/object:Gem::Version
-  version: 3.3.0
+  version: 3.5.0
 platform: ruby
 authors:
 - Mathew Allen
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-08-10 00:00:00.000000000 Z
+date: 2021-06-23 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
@@ -24,6 +24,20 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: 3.2.0
+- !ruby/object:Gem::Dependency
+  name: activesupport
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 3.2.0
 - !ruby/object:Gem::Dependency
   name: rails-reverse-proxy
   requirement: !ruby/object:Gem::Requirement
@@ -92,7 +106,6 @@ files:
 - Rakefile
 - app/controllers/quilt/performance_report_controller.rb
 - app/controllers/quilt/ui_controller.rb
-- app/views/quilt/ui/react_render_error.html
 - config/routes.rb
 - lib/generators/quilt/USAGE
 - lib/generators/quilt/install_generator.rb
@@ -124,7 +137,7 @@ files:
 - lib/quilt_rails/react_renderable.rb
 - lib/quilt_rails/trusted_ui_server_csrf_strategy.rb
 - lib/quilt_rails/version.rb
-homepage: https://github.com/Shopify/quilt/tree/master/gems/quilt_rails
+homepage: https://github.com/Shopify/quilt/tree/main/gems/quilt_rails
 licenses:
 - MIT
 metadata:
@@ -144,7 +157,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.0.3
+rubygems_version: 3.2.17
 signing_key: 
 specification_version: 4
 summary: A turn-key solution for integrating server-rendered React into your Rails

data/app/views/quilt/ui/react_render_error.html

@@ -1,21 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>React Render Error</title>
-  <meta name="viewport" content="width=device-width,initial-scale=1">
-  <meta http-equiv="refresh" content="3;URL='/'" />
-  <link rel="stylesheet" href="https://unpkg.com/@shopify/polaris@5.1.0/dist/styles.css" />
-</head>
-<body>
-  <div>
-    <div>
-      <h1>Waiting for React Sever to boot up.</h1>
-      <p>This page will refresh automatically.</p>
-    </div>
-    <p>
-      If this error persists, ensure <code>@shopify/react-server</code>
-      is running on <code>http://localhost:8081</code>.
-    </p>
-  </div>
-</body>
-</html>