How to install Capybara-Webkit for Ubuntu 12.04

24th July 2015 – 292 words

Installing recent version of Capybara fail on Ubuntu 12.04, because the qt version is too old.

Symptons

Running Capybara on Rails just fails with:

Capybara::Webkit::ConnectionError:
  /home/user/.rvm/gems/ruby-2.2.0/gems/capybara-webkit-1.6.0/bin/webkit_server failed to start.

(Re)-installing Capybara-Webkit might point out the problem:

gem install capybara-webkit

ERROR:  Error installing capybara-webkit:
        ERROR: Failed to build gem native extension.

/home/user/.rvm/rubies/ruby-2.2.0/bin/ruby extconf.rb
  cd src/ && ( test -e Makefile.webkit_server || /usr/lib/x86_64-linux-gnu/qt5/bin/qmake /home/user/.rvm/gems/ruby-2.2.0/gems/capybara-webkit-1.6.0/src/webkit_server.pro -o Makefile.webkit_server ) && make -f Makefile.webkit_server
  Project ERROR: Unknown module(s) in QT: webkitwidgets
  make: *** [sub-src-webkit_server-pro-make_first-ordered] Error 3
  Command 'make' failed

# OR other missing packages
  Project ERROR: Unknown module(s) in QT: quick

Install Qt5 on Ubuntu 12.04

sudo apt-add-repository ppa:ubuntu-sdk-team/ppa
sudo apt-get update
sudo apt-get install qt5-default libqt5webkit5-dev qtdeclarative5-dev g++

Running without screen

If you are running the tests on a server without screen, webkit will still fail:

/home/user/.rvm/gems/capybara-webkit-1.6.0/bin/webkit_server

QXcbConnection: Could not connect to display
[2]    26798 abort (core dumped)

This happens, because Webkit needs a screen.

First, you install a virtual one (xvfb):

sudo apt-get install xvfb

Then use the Headless gem:

# Gemfile
group :test do
  gem 'headless'
end

and wrap your tests in a virtual framebuffer:

# e.g. rspec
  around(:each, js: true) do |example|
    Headless.ly do
      example.run
    end
  end

(Alternatively, you can just use xvfb-run as written in capybara-webkit doc)