Running Capybara Tests for Ruby Apps in Remote Browsers

by Eugene MelnikovSeptember 6, 2013

This blog post provides step-by-step instructions on how to use virtual machines and BrowserStack to automatically test your application in real browsers.

Do you have concerns about how your Ruby applications work in Internet Explorer? Do you believe that checking for bugs by emulating previous versions with different modes is enough? Even if you skip some legacy versions, you can still face problems with lack of support for the JSON format, HTML5 tags, or ECMAScript, limitations for CSS selectors, and many other issues that cannot be detected by just changing a browser mode. In fact, there are a lot of bugs that can only be reproduced on certain platforms and browsers.

To identify such problems, we suggest that you run your Capybara tests in remote browsers. In this blog post, I provide step-by-step instructions on how to use virtual machines and BrowserStack along with code, which you can copy-paste to save time.

Table of Contents

Using a personal virtual machine

Feel free to read Capybara’s docs before working with the product.

Install a virtual machine (VM) with a desired browser. You can use your own distributive or ievms.
Make sure Java and desired browsers are installed on the VM.
Run Selenium Server on the VM.

java –jar selenium-server-standalone-2.35.0.jar -role hub -multiWindow -browserSessionReuse

Run on WebDriver.

java –jar selenium-server-standalone-2.35.0.jar -role webdriver -hub http://127.0.0.1:4444/grid/register -port 5555

Configure forwarding TCP port 4444 from a host machine to a guest machine.
Add to spec_helper.rb.

if ENV["SELENIUM"] == 'remote'   
   require 'selenium-webdriver'   
    url = 'http://127.0.0.1:4444/wd/hub'   
   capabilities = Selenium::WebDriver::Remote::Capabilities.internet_explorer
    Capybara.register_driver :remote_browser do |app|
     Capybara::Selenium::Driver.new(app,
                                    :browser =&gt; :remote, :url =&gt; url,
                                    :desired_capabilities =&gt; capabilities)
   end
    Capybara.server_port = 3010
   ip = `ifconfig | grep 'inet ' | grep -v 127.0.0.1 | cut -d ' ' -f2`.strip
   Capybara.app_host = http://#{ip}:#{Capybara.server_port}
   Capybara.current_driver = :remote_browser
   Capybara.javascript_driver = :remote_browser 
end

Run tests.

SELENIUM=remote bundle exec rspec spec/features/

You can easily change Internet Explorer to Chrome, Firefox, etc., and run tests again.

Using BrowserStack

Create account on BrowserStack
Download and put BrowserStackTunnel.jar to spec/support/
Make sure Java and сURL are installed on you VM
Add to spec_helper.rb

  if ENV["SELENIUM"] == 'browserstack'
    require 'selenium-webdriver'
    url = "https://#{AppConfig.browserstack['username']}:#{AppConfig.browserstack['accesskey']}@hub.browserstack.com/wd/hub"
    capabilities = Selenium::WebDriver::Remote::Capabilities.new
    capabilities['browser'] = ENV['browser'] || 'IE'
    capabilities['browser_version'] = ENV['browser_version'] || '8.0'
    capabilities['os'] = 'Windows'
    capabilities['os_version'] = '7'
    capabilities['browserstack.tunnel'] = 'true'
    capabilities['browserstack.debug'] = 'true'
    Capybara.register_driver :browser_stack do |app|
      Capybara::Selenium::Driver.new(app,
                                     :browser =&gt; :remote, :url =&gt; url,
                                     :desired_capabilities =&gt; capabilities)
    end
    Capybara.server_port = 3010
    Capybara.default_wait_time = 10
    Capybara.current_driver = :browser_stack
    Capybara.javascript_driver = :browser_stack
    RSpec.configure do |config|
     config.before(:all) do
       `java -jar spec/support/BrowserStackTunnel.jar #{AppConfig.browserstack['accesskey']} 127.0.0.1,#{Capybara.server_port},0 -v &gt;log/browserstack.log 2&gt;&amp;1 &amp;`
        visit '/'
        until (`curl -s -o /dev/null -w "%{http_code}" http://127.0.0.1:45691`.to_i == 200)
          sleep 1
        end
      end
      config.after(:all) do
        `ps -ef | awk '/BrowserStackTunnel.*,#{Capybara.server_port},/{print $2}' | xargs kill -9`
      end    
end  
end

Run tests

SELENIUM=browserstack browser=IE browser_version=11.0 bundle exec rspec spec/features/

Testing in remote browsers assumes using Selenium WebDriver. So, you should make sure all your tests are passed using Selenium if previously you used WebKit or another tool.

Conclusion

By using a personal VM, you have more control over your browsers, you can even change browser profiles or other options. However, BrowserStack allows you to run your tests on a lot of different combinations of platforms and browsers and even mobile emulators without any additional installations. Speed of testing, though, depends on network latency and a selected plan. Fortunately, you can run tests in several treads across different browsers or tests.

In addition, BrowserStack gives you the possibility to do live testing and debug your local application or folder with a prototype. You can even check responsiveness.

Feel free to improve my Capybara integration with BrowserStack. I’ll be happy if it inspires someone to create a new gem. You can ask any questions here or in Skype of BrowserStack support.