Posted over 8 years ago. Visible to the public.
How to test if an element has scrollbars with JavaScript (Cucumber step inside)
The basic idea is pretty simple: an element's height is accessible via the offsetHeight property, its drawn height via scrollHeight -- if they are not the same, the browser shows scrollbars.
Copyvar hasScrollbars = element.scrollHeight != element.offsetHeight;
So, in order to say something like...
CopyThen the element "#dialog_content" should not have scrollbars
... you can use this step (only for Selenium scenarios):
CopyThen /^the element "([^\"]+)" should( not)? have scrollbars$/ do |selector, no_scrollbars| scroll_height = page.execute_script("return $('#{selector}').get(0).scrollHeight;") offset_height = page.execute_script("return $('#{selector}').get(0).offsetHeight;") comparison = no_scrollbars ? '==' : '!=' scroll_height.should.send(comparison, offset_height) end
This should respect padding. However, I have not tested if margins have an effect on it.
Check out our new e-book:
Learn to structure large Ruby on Rails codebases with the tools you already know and love.
