Codeception ElementNotVisibleException error, unable to select option, or click

Question

I am unable to interact with an element using browser tests. It says the element is not interact-able, or not visible. This doesn't happen in Acceptance

Answer 1

Sometimes this solution doesn't work because the element is unavailable for some other cryptic reason.
We just had a situation where we couldn't use a <select> element to pick one of the options.
Further more, there was behaviour that was being triggered by the "change" event when the option was selected.
We were able to solve it like this.

$js = "jQuery('#chosen-option-quantity-2').val('2').trigger('change');";
$I->executeJS($js);

so the first command selects the option, and the second triggers the change event.
I hope that helps some one, even if it is me in the future.

Answer 2

The problem that is happening here is that the html element is being hidden by something, probably css somewhere. Because it is hidden (display:none), WebDriver can't see it, and therefore can't interact with it. In order to fix this problem, you need to use JS to un-hide the element.

use this $I->executeJS('jQuery("#your-css-selector").show()');

This doesn't happen in Acceptance tests because PHP Browser looks at the Page Source, and so can see everything, while WebDriver see's what a user see's on the browser.

Answer 3

You may use PhpBrowser

It works only with HTML then how PhantomJs emulate the real browser

But, with PhpBrowser you can't see what see your browser (only HTML such I said)

Another way, try executeJs with PhantomJs as it said before