croceldon
croceldon

Reputation: 4615

How to set screen size for chrome headless system test in rails 5.1?

In order to work with and test a new responsive frontend for my site, I'm trying to use Rails' new system tests (specs) with javascript and Chrome headless. I cannot figure out a way to set the screen size of the browser in the spec, though.

Here's my setup in spec/rails_helper.rb

config.before(:each, type: :system, js: true) do
  driven_by :selenium_chrome_headless, screen_size: [1900, 800]
end

I then create the screenshot with:

page.driver.save_screenshot(the_uri)

But the size of the rendered screenshot still is the default, which is much smaller. Ideally, I'd like to see the entire rendered page, but at this point, I'd be happy with just using the dimensions I've provided.

Ideas on what I'm missing here?

Upvotes: 12

Views: 4849

Answers (3)

Andrey
Andrey

Reputation: 367

Had same issue.

Changed this line

driven_by :selenium_chrome_headless, screen_size: [1400, 1400]

to this

driven_by :selenium, using: :headless_chrome, screen_size: [1400, 1400]

to fix the issue.

Upvotes: 18

Daniel Westendorf
Daniel Westendorf

Reputation: 3465

You simply need to redefine the driver which passes the headless and screen size arguments.

Capybara.register_driver :selenium_chrome_headless do |app|
  options = Selenium::WebDriver::Chrome::Options.new

  [
    "headless",
    "window-size=1280x1280",
    "disable-gpu" # https://developers.google.com/web/updates/2017/04/headless-chrome
  ].each { |arg| options.add_argument(arg) }

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

RSpec.configure do |config|
  config.before(:each, type: :system, js: true) do
    driven_by :selenium_chrome_headless
  end
end

Upvotes: 20

mhaliski
mhaliski

Reputation: 95

I just ran into this today and I think the answer is... you can't :(

From the docs:

driven_by has a required argument for the driver name. The keyword arguments are :using for the browser and :screen_size to change the size of the browser screen. These two options are not applicable for headless drivers and will be silently ignored if passed.

Huge bummer. Testing responsive websites is going to be nearly impossible as certain elements show and hide depending on screen width.

Upvotes: -4

Related Questions