Begin system spec harness (#633)

* Begin system spec harness

* Wire up frontend to backend for system specs

* Linting fixes

* Pass port env vars through to frontend server in dev

This supports running system specs on different frontend and backend
instances than the default ones.

* Drop --proxy option to `ember serve`

Appears to not be used or honored. The values in config/environment.js
seem to take effect instead.

* Exclude system specs by default

* Slight tweak to config

Author: solebared

Rakefile

@@ -4,7 +4,7 @@ desc "run application"
 task :run do
   pids = [
     spawn("cd backend && bundle install && foreman start -f Procfile.local"),
-    spawn("cd frontend && rm -rfd ./dist && ./node_modules/.bin/ember serve --port 4300 --proxy http://localhost:3000")
+    spawn("cd frontend && rm -rfd ./dist && ./node_modules/.bin/ember serve --port 4300")
   ]
 
   trap "INT" do

backend/.rspec

@@ -1 +1,2 @@
 --color
+--tag ~type:system

backend/Gemfile

@@ -89,6 +89,8 @@ group :development do
 end
 
 group :test do
+  gem "capybara"
+  gem "cuprite"
   gem "mongoid-rspec"
   gem "shoulda-matchers"
   gem "vcr"

backend/Gemfile.lock

@@ -96,6 +96,15 @@ GEM
     cancancan (3.3.0)
     cancancan-mongoid (2.0.0)
       cancancan (>= 2.0, < 4)
+    capybara (3.39.2)
+      addressable
+      matrix
+      mini_mime (>= 0.1.3)
+      nokogiri (~> 1.8)
+      rack (>= 1.6.0)
+      rack-test (>= 0.6.3)
+      regexp_parser (>= 1.5, < 3.0)
+      xpath (~> 3.2)
     coderay (1.1.3)
     coercible (1.0.0)
       descendants_tracker (~> 0.0.1)
@@ -108,6 +117,9 @@ GEM
     crack (0.4.5)
       rexml
     crass (1.0.6)
+    cuprite (0.14.3)
+      capybara (~> 3.0)
+      ferrum (~> 0.13.0)
     database_cleaner (2.0.2)
       database_cleaner-active_record (>= 2, < 3)
     database_cleaner-active_record (2.1.0)
@@ -168,6 +180,11 @@ GEM
     faraday-net_http_persistent (1.2.0)
     faraday-patron (1.0.0)
     faraday-rack (1.0.0)
+    ferrum (0.13)
+      addressable (~> 2.5)
+      concurrent-ruby (~> 1.1)
+      webrick (~> 1.7)
+      websocket-driver (>= 0.6, < 0.8)
     ffaker (2.21.0)
     ffi (1.15.5-java)
     foreman (0.87.2)
@@ -210,6 +227,7 @@ GEM
       net-pop
       net-smtp
     marcel (1.0.2)
+    matrix (0.4.2)
     method_source (1.0.0)
     mini_mime (1.1.5)
     mini_portile2 (2.8.5)
@@ -450,11 +468,14 @@ GEM
       addressable (>= 2.8.0)
       crack (>= 0.3.2)
       hashdiff (>= 0.4.0, < 2.0.0)
+    webrick (1.8.1)
     websocket-driver (0.7.6)
       websocket-extensions (>= 0.1.0)
     websocket-driver (0.7.6-java)
       websocket-extensions (>= 0.1.0)
     websocket-extensions (0.1.5)
+    xpath (3.2.0)
+      nokogiri (~> 1.8)
     yard (0.9.34)
     zeitwerk (2.6.12)
 
@@ -475,8 +496,10 @@ DEPENDENCIES
   byebug
   cancancan (~> 3.3.0)
   cancancan-mongoid (= 2.0.0)
+  capybara
   colored (~> 1.2)
   countries
+  cuprite
   database_cleaner
   database_cleaner-mongoid
   devise (= 4.8.0)

backend/bin/system_spec

@@ -0,0 +1,4 @@
+# Eg:
+#   bin/system_spec
+#   bin/system_spec --format doc spec/system/signup_spec.rb
+bundle exec rspec --tag type:system "$@"

backend/env-example

@@ -55,3 +55,10 @@ FULLSTORY_ORG=
 
 # MongoDB
 MONGODB_HOST=localhost
+
+# System spec server ports
+SYSTEM_SPEC_BACKEND_PORT=3003
+SYSTEM_SPEC_FRONTEND_PORT=4303
+
+# Run system specs with a headless chrome instance
+HEADLESS_CHROME=true

backend/lib/tasks/spec.rake

@@ -0,0 +1,28 @@
+namespace :spec do
+  begin
+    require "rspec/core/rake_task"
+
+    Rake::Task[:system].clear
+    RSpec::Core::RakeTask.new(:system) do |t|
+      t.rspec_opts = "--tag type:system"
+    end
+  rescue LoadError
+    # no rspec available
+  end
+
+  namespace :system do
+    task :start_frontend do
+      require_relative "../../spec/system/support/frontend_app"
+
+      frontend_app = SystemSpec::FrontendApp.instance
+      frontend_app.start $stdout
+
+      trap "INT" do
+        frontend_app.stop
+        exit 1
+      end
+
+      frontend_app.wait_on
+    end
+  end
+end

backend/spec/system/signup_spec.rb

@@ -0,0 +1,8 @@
+require "system_spec_helper"
+
+RSpec.describe "signup flow" do
+  it "loads the root page" do
+    visit "/"
+    expect(page.title).to eq "Flaredown"
+  end
+end

backend/spec/system/support/capybara_config.rb

@@ -0,0 +1,23 @@
+# Most of the config here, and in cuprite_config, was borrowed, with many thanks, from:
+# https://evilmartians.com/chronicles/system-of-a-test-setting-up-end-to-end-rails-testing
+Capybara.configure do |config|
+  # Usually, especially when using Selenium, developers tend to increase the max wait time.
+  # With Cuprite, there is no need for that.
+  # We use a Capybara default value here explicitly.
+  config.default_max_wait_time = 2
+
+  # Normalize whitespaces when using `has_text?` and similar matchers,
+  # i.e., ignore newlines, trailing spaces, etc.
+  # That makes tests less dependent on slightly UI changes.
+  config.default_normalize_ws = true
+
+  # Where to store system tests artifacts (e.g. screenshots, downloaded files, etc.).
+  # It could be useful to be able to configure this path from the outside (e.g., on CI).
+  config.save_path = ENV.fetch("CAPYBARA_ARTIFACTS", "./tmp/capybara")
+
+  # Port on which to fire up the rails backend.
+  config.server_port = ENV["SYSTEM_SPEC_BACKEND_PORT"]
+
+  # Where to find frontend app; see ./frontend_app.rb
+  config.app_host = "http://localhost:#{ENV["SYSTEM_SPEC_FRONTEND_PORT"]}"
+end

backend/spec/system/support/cuprite_config.rb

@@ -0,0 +1,14 @@
+require "capybara/cuprite"
+
+Capybara.register_driver(:cuprite) do |app|
+  Capybara::Cuprite::Driver.new(
+    app,
+    window_size: [1200, 800],
+    browser_options: {},
+    process_timeout: 10,
+    inspector: true,
+    headless: ENV["HEADLESS_CHROME"] != "false"
+  )
+end
+
+Capybara.default_driver = Capybara.javascript_driver = :cuprite

backend/spec/system/support/frontend_app.rb

@@ -0,0 +1,76 @@
+module SystemSpec
+  class FrontendApp
+    include Singleton
+
+    def start(log = "/dev/null")
+      if test_connection_to_frontend_app
+        puts "Frontend app already running at #{frontend_app_url}"
+        return
+      end
+
+      puts "Starting frontend app at #{frontend_app_url}"
+      @pid ||= Process.spawn(
+        frontend_app_cmd,
+        [:out, :err] => log,
+        :chdir => "../frontend"
+      )
+
+      timeout = 15.seconds
+      unless test_connection_to_frontend_app(timeout)
+        fail "Frontend app did not start within #{timeout} seconds"
+      end
+    end
+
+    def wait_on
+      return unless @pid
+      Process.wait @pid
+    end
+
+    def stop
+      return unless @pid
+      Process.kill "QUIT", @pid
+      Process.wait @pid
+    end
+
+    private
+
+    def test_connection_to_frontend_app(timeout = 0)
+      system(
+        test_connection_cmd(timeout),
+        out: "/dev/null"
+      )
+    end
+
+    def test_connection_cmd(timeout)
+      [
+        "curl --silent --head -X GET",
+        "--retry-connrefused",
+        "--retry", timeout.to_s,
+        "--retry-delay", "1",
+        frontend_app_url
+      ].join(" ")
+    end
+
+    def frontend_app_cmd
+      [
+        "PORT=#{backend_port}",
+        "BASE_URL=#{frontend_app_url}",
+        "FRONTEND_PORT=#{frontend_port}",
+        "./node_modules/.bin/ember", "serve",
+        "--port", frontend_port
+      ].join(" ")
+    end
+
+    def frontend_app_url
+      "http://localhost:#{frontend_port}"
+    end
+
+    def frontend_port
+      ENV["SYSTEM_SPEC_FRONTEND_PORT"]
+    end
+
+    def backend_port
+      ENV["SYSTEM_SPEC_BACKEND_PORT"]
+    end
+  end
+end

backend/spec/system_spec_helper.rb

@@ -0,0 +1,25 @@
+require "rails_helper"
+
+# Most of the system spec config was borrowed, with many thanks, from:
+# https://evilmartians.com/chronicles/system-of-a-test-setting-up-end-to-end-rails-testing
+require "system/support/frontend_app"
+require "system/support/capybara_config"
+require "system/support/cuprite_config"
+
+RSpec.configure do |config|
+  config.prepend_before(:each, type: :system) do
+    driven_by Capybara.javascript_driver
+  end
+
+  # System specs are excluded by default in ~/.rspec
+  # bin/system_spec provides a thin shim that includes them
+  unless config.exclusion_filter[:type] == "system"
+    config.before(:suite) do
+      SystemSpec::FrontendApp.instance.start
+    end
+
+    config.after(:suite) do
+      SystemSpec::FrontendApp.instance.stop
+    end
+  end
+end

frontend/config/environment.js

@@ -63,8 +63,8 @@ module.exports = function(environment) {
     // ENV.APP.LOG_TRANSITIONS = true;
     // ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
     // ENV.APP.LOG_VIEW_LOOKUPS = true;
-    ENV.apiHost = 'http://localhost:3000';
-    var STATIC_URL = 'http://localhost:4300';
+    ENV.apiHost    = 'http://localhost:' + (process.env.PORT || '3000');
+    var STATIC_URL = 'http://localhost:' + (process.env.FRONTEND_PORT || '4300');
   }
 
   if (environment === 'test') {