search

thoughtbot / capybara-webkit

A Capybara driver for headless WebKit to test JavaScript web apps
https://thoughtbot.com/open-source
MIT License
1.97k stars 428 forks source link

Missing elements on screenshots #985

Closed BroiSatse closed 6 years ago

BroiSatse commented 7 years ago

Hi all,

We are having some issues with screenshots made during the capybara tests. Some of the elements are just not there - initially we fought it only affects modals (both bootstrap ones and the ones we've made), however we also noticed this is happening even for our main layout navigation and footer (see below): capybara-201703011507187244913248

I started playing with navigation styling to figure out what's wrong and it seems to be related with z-index. After removing z-index from the stylesheets the screenshot looks like below: capybara-201703011508307641479191

So now we can only see the navigation bar. Can anyone advice?

> puts page.driver.version

Capybara: 2.7.1
capybara-webkit: 1.11.1
Qt: 5.6.1
WebKit: 538.1
QtWebKit: 5.6.1
samstickland commented 7 years ago

This problem is still plaguing us. Any hints on how we can go about debugging this?

twalpole commented 6 years ago

This is due to the level of JS/CSS support provided by QtWebkit, the only "solution" to get screenshots looking exactly like the page is to make sure the page is only using CSS that was supported 5-6 years ago - Nothing capybara-webkit can really do about it.