SetFindTimeout and pollUntil with Intern for elements that are not visible when the page loads

Question

I had a problem with Intertern 2 waiting for the elements to appear. In Intern 1, I used wait() to set urgent time periods so that the page would wait for an element to appear after some user action. With Internet 2, there seems to be setFindTimeout() , which should always say that the find() method should wait a bit while the element is present. I set setFindTimeout() and tried to use pollUntil to handle these expectations, but the tests still do not work with the absence of an error element.

Here is an example test that uses the same requirements as my real tests and looks for the identifier of the element that appears 5 seconds after this page load.

 define([ 'intern!object', 'intern/chai!assert', 'require', 'tests/util', 'intern/dojo/node!leadfoot/Command', 'intern/dojo/node!leadfoot/Session', 'intern/dojo/node!leadfoot/helpers/pollUntil' ], function (registerSuite, assert, require, util, Command, Session, pollUntil) { registerSuite([ { name: 'testing_find_by_wait', test_create_form_on_web: function() { console.log('Create a form with account, number, number and formula fields') return this.remote .setFindTimeout(10000) .setWindowSize(1280, 960) .get("http://www.kgstew.com/waittest.html") .then(pollUntil('return document.getElementById("demo")', 10000)) .findById('demo') .click() .end() } } ]); }); 

Answer 1

Thanks to C Snover for your help to make this work.

I did not understand how setFindTimeout() and pollUntil . Both of them are looking for elements that should be present in the DOM (what they were), but if the element is not displayed (i.e. display:none style) when the click() command is issued, the test will fail.

What we wanted to do was wait for the item to appear after some user action. Got an idea from C Snover to look at element.offsetWidth so it was greater than 0.

In our test suite, we created the following utility.

 element_visible_by_class: function(elem) { return function(elem) { elem = document.getElementsByClassName(elem); if (!elem || elem.length == 0) { return null; } elem = elem[0]; return (elem.offsetWidth > 0 && elem.offsetHeight > 0) ? elem : null; } }, 

Now from any test we can call .then(pollUntil(util.element_visible_by_class(), ['class_name'], 10000)) , and it will wait until this element is visible on the page.

Answer 2

The element is detected just fine. For an error, it does not click element. This is because the element is empty and has no style, so it is zero in size and cannot be clicked when you try to click on it. You need to wait for the element to exist and be visible before you can click on it.