Adapt dev env to run on a remote box (#8232)

* Adapt dev env to run on a remote box

* webpack-dev-server ignores CLI arguments, so switched to environment
  variables.
* Dynamically determine remote webpack host via APP_DOMAIN environment
  variable, defined in application.yml.
* Setup content security policy to allow connecting to webpack on a
  remote box, defined by APP_DOMAIN environment variable.

* Make Webpacker listen on 0.0.0.0

* Account for APP_DOMAIN port

* Add support for URI scheme and tests

* Fix a spec by disabling a Rubocop linter

Procfile.dev

@@ -1,3 +1,3 @@
 web: bin/rails s -p 3000 -b 0.0.0.0
-webpacker: ./bin/webpack-dev-server --listen-host 0.0.0.0 --host 0.0.0.0
+webpacker: ./bin/webpack-dev-server
 sidekiq: bundle exec sidekiq

config/initializers/0_application_config.rb

@@ -1,7 +1,15 @@
 ENVied.require(*ENV["ENVIED_GROUPS"] || Rails.groups)
 
 class ApplicationConfig
+  URI_REGEXP = %r{(?<scheme>https?://)?(?<host>.+?)(?<port>:\d+)?$}.freeze
+
   def self.[](key)
     ENVied.send(key)
   end
+
+  def self.app_domain_no_port
+    app_domain = self["APP_DOMAIN"]
+    match = app_domain.match(URI_REGEXP)
+    match[:host]
+  end
 end

config/initializers/content_security_policy.rb

@@ -16,7 +16,11 @@ Rails.application.config.content_security_policy do |policy|
   #   # policy.report_uri "/csp-violation-report-endpoint"
 
   # allow webpack-dev-server host as allowed origin for connect-src
-  policy.connect_src :self, :https, "http://localhost:3035", "ws://localhost:3035" if Rails.env.development?
+  if Rails.env.development?
+    webpack_host = "#{ApplicationConfig.app_domain_no_port}:3035"
+    policy.connect_src :self, :https,
+                       "http://#{webpack_host}", "ws://#{webpack_host}"
+  end
 end
 
 # If you are using UJS then enable automatic nonce generation

config/webpacker.yml

@@ -56,9 +56,9 @@ development:
   # Reference: https://webpack.js.org/configuration/dev-server/
   dev_server:
     https: false
-    host: localhost
+    host: 0.0.0.0
     port: 3035
-    public: localhost:3035
+    public: 0.0.0.0:3035
     hmr: false
     # Inline should be set to true if using HMR
     inline: true

spec/initializers/application_config_spec.rb

@@ -0,0 +1,39 @@
+require "rails_helper"
+
+describe ApplicationConfig do
+  describe ".app_domain_no_port" do
+    it "handles plain subdomain only name" do
+      setup_app_domain("renner")
+
+      expect(described_class.app_domain_no_port).to eq "renner"
+    end
+
+    it "handles plain domain name" do
+      setup_app_domain("renner.ngrok.io")
+
+      expect(described_class.app_domain_no_port).to eq "renner.ngrok.io"
+    end
+
+    it "handles domain with port" do
+      setup_app_domain("renner:3000")
+
+      expect(described_class.app_domain_no_port).to eq "renner"
+    end
+
+    it "handles domain with schema and port" do
+      setup_app_domain("http://renner:4000")
+
+      expect(described_class.app_domain_no_port).to eq "renner"
+    end
+
+    private
+
+    def setup_app_domain(app_domain)
+      # No #and_return for #have_received.
+      # rubocop:disable RSpec/MessageSpies
+      expect(ApplicationConfig).to receive(:[]).with("APP_DOMAIN").
+        and_return(app_domain)
+      # rubocop:enable RSpec/MessageSpies
+    end
+  end
+end