Reputation: 4615
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
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
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
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