Issue rendering modal (SweetAlert) in CapybaraWebkit
synth opened this issue · 5 comments
We use SweetAlert2 (https://sweetalert2.github.io/) in our application. We recently updated to the latest version of SweetAlert (v7.12.11) and unfortunately all our SweetAlert tests are failing.
A relevant change in the upgrade is SweetAlert's move to Promise objects. We know Capybara-Webkit (or rather QT) doesn't support ES6 (and similarly Promise objects), so we've included a polyfill as per SweetAlert's docs (https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/core.js).
The Swal modal renders correctly if we use other Capybara drivers such as Selenium.
While debugging, I see that the Swal modal is indeed created and added to the DOM but the positioning is off and there might be an issue with the z-index. At the end of the day, capybara-webkit doesn't detect the ".swal2-modal" div, even though I can see the div by using page.evaluate_script.
I've created a sample application that demonstrates the issue: https://github.com/synth/swal-capybara-webkit-bug
The versions I'm on are as follows:
- ruby 2.3.3p222
- Rails 4.2.8
- capybara (2.18.0)
- capybara-webkit (1.15.0)
- capybara-screenshot (1.0.18)
- QT: 5.5.1
- sweetalert2 v7.12.11
Any advice to tracking this down is appreciated!
Not only does capybara-webkit not support ES6 but it also doesn't support a lot of modern CSS either (the last QtWebkit release was basically equivalent to a 6 year old version of Safari), so display issues are going to be common with anything that uses modern CSS. In this case it would guess it's the use of flex box for alignment/display of the modal. This is going to be an issue until/if/when annullens version of qtwebkit is supported rather than the last official release of QtWebkit. PRs welcome.
so display issues are going to be common with anything that uses modern CSS
:(
Where can we follow/contribute to here or annullens progress? I thought I remember there was a thread somewhere of people discussing alternatives/workarounds? I can't seem to find it now.
We've been loyal Capybara-webkit users for years, and would hate to abandon it. Thank you so much for all your work. Love live capybara-webkit!
For anyone who might see this, we had success moving to Chrome headless (or selenium_chrome driver) as per this thread: teamcapybara/capybara#1860 (comment)
@synth https://github.com/annulen/webkit/tree/qtwebkit-stable Is the repo for annulus qtwebkit. First step is to get it building with a new Qt version and then try building/running specs of capybara-webkit to see what works and what's broken. I've been meaning to do it for a while but just haven't had the time.