Dockerize System Tests

.gitignore

@@ -1,8 +1,14 @@
-.bundle/
+.npm/_update-notifier-last-checked
+.npm/_cacache/
+.npm/_logs/
+.npm/_npx
+
 .idea
 log/*.log
 pkg/
 demo/db/*.sqlite3
+demo/db/*.sqlite3-shm
+demo/db/*.sqlite3-wal
 demo/doc/screenshots/**/*.diff.png
 demo/log/*.log
 demo/tmp/

CONTRIBUTING.md

@@ -123,7 +123,26 @@ services:
 
 You may have to change the `1000:1000` to the user and group IDs of your laptop. You may also have to change the `version` parameter to match the version of the `docker-compose.yml` file.
 
-Adapting the above `docker-compose.override.yml` for MacOS should be relatively straight-forward. Windows users, I'm afraid you're on your own.
+Adapting the above `docker-compose.override.yml` for MacOS should be relatively straight-forward. Windows users, I'm afraid you're on your own. If you figure this out, a PR documenting how to do it would be most welcome.
+
+The above doesn't allow you to run the system tests. To keep the image small, it doesn't include Chrome or any other browser.
+
+There is an experimental `docker-compose-system-test.yml` file, that runs the `bootstrap_forms` docker container along with an off-the-shelf Selenium container. To start this configuration:
+
+```bash
+RUBY_VERSION=3.2 docker-compose -f docker-compose-system-test.yml up
+```
+
+(Sometimes, on shutdown, the Rails server PID file isn't removed, and so the above will fail. `rm demo/tmp/pids/server.pid` will fix it.)
+
+This starts the containers to run the system tests. In another terminal, run `docker ps` to find the container ID of the `bootstrap-form` image, and then run `docker exec -it <container_id> /bin/bash` to get a shell. Once in the shell:
+
+```bash
+cd demo
+bundle exec rails test:system
+```
+
+Note that this system test approach is highly experimental and has some rough edges. For example, on Linux at least, it creates files owned by `root` in your project directories. The docker compose file and/or steps to run system tests may change.
 
 #### Simple Dockerfile
 

demo/Procfile.dev

@@ -1,3 +1,3 @@
-web: bundle exec bin/rails server -p 3000 -b 0.0.0.0
+web: bundle exec bin/rails server -p ${TEST_APP_PORT:-3000} -b 0.0.0.0
 js: yarn build --watch
 css: yarn build:css --watch

demo/test/application_system_test_case.rb

@@ -2,9 +2,29 @@
 
 class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
   include Capybara::Screenshot::Diff
-  driven_by :selenium, using: :headless_chrome, screen_size: [960, 720] do |capabilities|
+
+  class << self
+    def remote_selenium? = @remote_selenium ||= ENV["SELENIUM_HOST"].present? || ENV["SELENIUM_PORT"].present?
+  end
+
+  options = if remote_selenium?
+              {
+                browser: :remote,
+                url: "http://#{ENV.fetch('SELENIUM_HOST', 'selenium')}:#{ENV.fetch('SELENIUM_PORT', '4444')}"
+              }
+            else
+              {}
+            end
+
+  driven_by :selenium, using: :headless_chrome, screen_size: [960, 720], options: options do |capabilities|
     capabilities.add_argument "force-device-scale-factor=1"
   end
+
   Capybara::Screenshot.enabled = ENV["CI"].blank?
   Capybara.server = :puma, { Silent: true }
+
+  if remote_selenium?
+    Capybara.server_host = "0.0.0.0"
+    Capybara.app_host = "http://#{ENV.fetch('TEST_APP_HOST', 'web')}:#{ENV.fetch('TEST_APP_PORT', Capybara.server_port)}"
+  end
 end

docker-compose-system-test.yml

@@ -0,0 +1,44 @@
+version: '3.3'
+
+services:
+  app: &app
+    build:
+      context: .
+      args:
+        NODE_MAJOR: "12"
+        YARN_VERSION: "1.22.4"
+        RUBY_VERSION: ${RUBY_VERSION}
+    image: bootstrap-form:latest-$RUBY_VERSION
+    tmpfs:
+      - /tmp
+
+  web:
+    <<: *app
+    stdin_open: true
+    tty: true
+    volumes:
+      - .:/app:cached
+    environment:
+      - SSH_AUTH_SOCK=/ssh-agent
+      - NODE_ENV=development
+      - BOOTSNAP_CACHE_DIR=/usr/local/bundle/_bootsnap
+      - WEB_CONCURRENCY=1
+      - HISTFILE=/app/.bash_history
+      - RAILS_ENV=test
+      - SELENIUM_HOST=selenium
+      - SELENIUM_PORT=4444
+      - TEST_APP_HOST=web
+      - TEST_APP_PORT=3001
+    ports:
+      - "3001:3001"
+    command: /bin/bash -c "cd demo && bin/dev"
+
+  selenium:
+    image: selenium/standalone-chrome:118.0
+    logging:
+      driver: none
+    stdin_open: true
+    tty: true
+    ports:
+      - '4444:4444'
+      - '5900:5900'