ruby-on-rails selenium-webdriver selenium-chromedriver capybara-webkit

Gitlab-CI Selenium::WebDriver::Error::WebDriverError: unable to connect to chromedriver 127.0.0.1:9515

I was able to setup my Selenium::Driver to use :headless_chrome and run my tests perfectly in my local machine but when I push to gitlab, my CI fails and raises a Selenium::WebDriver::Error: unable to connect to chromedriver 127.0.0.1:9515. I spent all night looking for solutions to different forums but to no avail.

In my spec/rails_helper.rb, I put the following codeblock inside the Rspec configuration:

  config.include Devise::Test::ControllerHelpers, type: :controller
  config.include Devise::Test::ControllerHelpers, type: :view
  config.include Devise::Test::IntegrationHelpers, type: :feature

  options = Selenium::WebDriver::Chrome::Options.new
  options.add_preference(:download, prompt_for_download: false, default_directory: '/tmp/downloads')
  options.add_preference(:browser, set_download_behavior: { behavior: 'allow' })

  Capybara.register_driver :chrome do |app|
    Capybara::Selenium::Driver.new(app, browser: :chrome, options: options)
  end

  Capybara.register_driver :headless_chrome do |app|
    options.add_argument('--headless')
    options.add_argument('--disable-gpu')
    options.add_argument('--window-size=1280,800')
    options.add_argument('--no-sandbox')

    Capybara::Selenium::Driver.new(app, browser: :chrome, options: options)
  end
  Capybara.javascript_driver = :headless_chrome

At this point, my tests are running just fine locally. Next is I set-up my gitlab-ci.yml file by following this tutorial. The tutorial was great except on the part that my system_test fails because of the said chromedriver error. After trying out a lot of things, I am now very lost and don't know what to do to make it work.

Here are the necessary files from the tutorial that I followed.

Dockerfile

FROM ruby:2.6.0

RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add -
RUN curl -sL https://deb.nodesource.com/setup_8.x | bash -
RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list
RUN apt-get update -qqy && apt-get install -qqyy yarn nodejs postgresql postgresql-contrib libpq-dev cmake
RUN rm -rf /var/lib/apt/lists/*

`.gitlab-ci.yml

image: "registry.gitlab.com/catch-all/catch-all-app:latest"

variables:
  LC_ALL: C.UTF-8
  LANG: en_US.UTF-8
  LANGUAGE: en_US.UTF-8
  RAILS_ENV: "test"
  POSTGRES_DB: test_db
  POSTGRES_USER: runner
  POSTGRES_PASSWORD: ""

# cache gems and node_modules for next usage
.default-cache: &default-cache
  cache:
    untracked: true
    key: my-project-key-5.2
    paths:
      - node_modules/
      - vendor/
      - public/

build:
  <<: *default-cache
  services:
    - postgres:latest
  stage: build
  script:
  - ruby -v
  - node -v
  - yarn --version
  - which ruby
  - gem install bundler  --no-document
  - bundle install  --jobs $(nproc) "${FLAGS[@]}" --path=vendor
  - yarn install
  - cp config/database.yml.gitlab config/database.yml
  - RAILS_ENV=test bundle exec rake db:create db:schema:load
  - RAILS_ENV=test bundle exec rails assets:precompile

integration_test:
  <<: *default-cache
  stage: test
  services:
    - postgres:latest
    - redis:alpine
  script:
    - gem install bundler  --no-document
    - bundle install  --jobs $(nproc) "${FLAGS[@]}" --path=vendor
    - cp config/database.yml.gitlab config/database.yml
    - bundle install --jobs $(nproc) "${FLAGS[@]}" --path=vendor
    - RAILS_ENV=test bundle exec rake db:create db:schema:load
    - RAILS_ENV=test bundle exec rails assets:precompile
    - bundle exec rspec spec/controllers
    - bundle exec rspec spec/helpers
    - bundle exec rspec spec/models
    - bundle exec rspec spec/policies

system_test:
  <<: *default-cache
  stage: test
  services:
    - postgres:latest
    - redis:alpine
    - selenium/standalone-chrome:latest
  script:
    - gem install bundler  --no-document
    - bundle install  --jobs $(nproc) "${FLAGS[@]}" --path=vendor
    - cp config/database.yml.gitlab config/database.yml
    - export selenium_remote_url="http://selenium__standalone-chrome:4444/wd/hub/"
    - bundle install  --jobs $(nproc) "${FLAGS[@]}" --path=vendor
    - RAILS_ENV=test bundle exec rake db:create db:schema:load
    - RAILS_ENV=test bundle exec rails assets:precompile
    - bundle exec rspec spec/features
  artifacts:
    when: on_failure
    paths:
      - tmp/screenshots/

rubocop:
  <<: *default-cache
  stage: test
  script:
      - gem install bundle --no-document
      - bundle install  --jobs $(nproc) "${FLAGS[@]}" --path=vendor
      - bundle exec rubocop

config/environments/test.rb

  # Raises error for missing translations
  # config.action_view.raise_on_missing_translations = true
  net = Socket.ip_address_list.detect(&:ipv4_private?)
  ip = net.nil? ? 'localhost' : net.ip_address
  config.domain = ip
  config.action_mailer.default_url_options = { host: config.domain }

  Capybara.server_port = 8200
  Capybara.server_host = ip

test/application_system_test_case.rb

# frozen_string_literal: true

require 'test_helper'
require 'socket'

def prepare_options
  driver_options = {
    desired_capabilities: {
      chromeOptions: {
        args: %w[headless disable-gpu disable-dev-shm-usage] # preserve memory & cpu consumption
      }
    }
  }

  driver_options[:url] = ENV['selenium_remote_url'] if ENV['selenium_remote_url']

  driver_options
end

class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
  driven_by :selenium, using: :chrome, screen_size: [1400, 1400]
end

Thanks and hoping that anyone can lead me to the right solution. :)

Solution

I was able to resolve my issue by adding the installation for the latest version of chrome and chrome-driver in my Dockerfile. This was achieved by adding the following lines:

# Latest Google Chrome installation package
RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
  && sh -c 'echo "deb http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google-chrome.list'

# Latest Ubuntu Firefox, Google Chrome, XVFB and JRE installs
RUN apt-get update -qqy \
  && apt-get -qqy install \
    xvfb \
    google-chrome-stable

# Clean clears out the local repository of retrieved package files. Run apt-get clean from time to time to free up disk space.
RUN apt-get clean \
  && rm -rf /var/lib/apt/lists/*

# 1. Step to fixing the error for Node.js native addon build tool (node-gyp)
# https://github.com/nodejs/node-gyp/issues/454
# https://github.com/npm/npm/issues/2952
RUN rm -fr /root/tmp
# Jasmine and protractor global install
# 2. Step to fixing the error for Node.js native addon build tool (node-gyp)
# https://github.com/nodejs/node-gyp/issues/454
RUN npm install --unsafe-perm --save-exact -g protractor@5.0.0 \
# Get the latest Google Chrome driver
  && npm update \
# Get the latest WebDriver Manager
  && webdriver-manager update