thoughtbot/capybara-webkit

Window size issue/question

zacharyjt opened this issue · 4 comments

I'm trying to write some tests for scrolling and clicking anchors, but seem to be running into a bit of a snag. I have a paragraph that should be outside of the visible area (that you have to scroll to see). I verified the position of this element using evaluate_script('arguments[0].getBoundingClientRect();', element) and found the top to be 1344px from the top of the window. The window height is only 1050px, so in theory the paragraph is not visible. I tried setting the scrollTop of the scrollable element, but nothing happens. The value of scrollTop always stays 0, and the position of the paragraph never changes (whereas in a real browser console I can modify the scrollTop and have it behave as expected). When I take a screenshot of the page, all of the content is visible and the window height is definitely larger than the 1050px that I've specified. I even set this in my spec_helper: Capybara::Screenshot.webkit_options = { width: 1680, height: 1050 }, but the height never seems to be respected.

So it seems like the screenshots and possibly even the headless window expand dynamically with the content of the page. Is this the case? If so, is this expected, and is there any way to force a window height? Lastly, do you have any tips/recommendations for testing the scrollability of a page?

A little additional info:
Using Qt5
When I checked the clientHeight of the scrollable element, it was larger than the window height. Resizing the window seemed to have no effect on the clientHeight.

How are you setting the screen/window size you think should be set?

I don't explicitly set it anywhere in my setup, but while running tests I can call current_window.size to see that it is [1680, 1050]. When I resize during the test, I use current_window.resize_to(w, h)

After poking at this a bit more, I've found I can work around the issue by manipulating the CSS to set the height of the scrollable element: execute_script('$(arguments[0]).css("height", "1050px")', element)