How to deal with modals not opening in PhantomJS?

Question

I have a Watir code that uses Phantomjs as headless browser. I'm trying to fill a form on website using this code (because Phantomjs doesn't show modal on simple click ( browser.link(id: 'choise-sity').click) ):

require 'watir'

browser = Watir::Browser.new :phantomjs
browser.goto 'http://sales.ubrr.ru/open'

browser.execute_script(" $('#modalCityChoise').show();$('#modalCityChoise').css({'opacity':'1', 'top':'0'})")
browser.link(text: 'Архангельск').click

browser.screenshot.save 'a.png'

Current code does show modal, but I'm unable to click links there after.
My question is: is there an easier way to deal with modals in PhantomJS - they said they added support to modals? Or how to deal with this particular example by javascript injection?

edit: I managed to deal with this modal just by changing a value of hidden input browser.execute_script(" $('#OpenBkiForm_city_code').val('4600000100000') ") - but question still lingers.

Answer 1

I misinterpreted the issue - modals were managed correctly by Phantomjs, but I couldn't prove it because at the time of my screenshoting they were only beginning to fade in, which I haven't thought of.
The real issue was that I couldn't press the button in modal window. Turns out that was because of the window size - even when screenshots captured the button, it wasn't really accessible to Watir somehow. This resolved the whole issue:

$browser.driver.manage.window.maximize

Answer 2

Modals can be implemented differently. Sometimes they are animated which makes it necessary to wait until they are fully visible to then work on them further.

In your case you can use Wait:until :

browser.goto 'http://sales.ubrr.ru/open'
Watir::Wait.until { browser.a(:id => "modalCityChoise").visible? }
browser.link(text: 'Архангельск').click
browser.screenshot.save 'a.png'