Intern and Leadfoot conditional wait until

Question

If there a way to perform .click() after the element become visible.

My function chain is built like that:

    this.remote.findByXpath("//div[@data-index='blockContainer']/button[text()='Create new']").then(function(element) {
       return element.click().end();
    })

Sometimes I got error says 'the element is not visible', is it possible to perform click after the element displayed in browser? I know Leadfoot supplies pollUntil to do similar thing but I don't want to execute xpath at browser side, instead of I want to do until at running server side.

To solve my problem I tried following two ways but doesn't help:

1. I tried to pass Leadfoot Element to browser side script and check if it is visible. But it seems browser side code doesn't recognize leadfoot/element object.

   command.find(...).then(function(element) {
       return command.then(pollUntil(
                       function(element) {
                          if (element.style.display == 'none') return null;
                                   return true;
                       }, [element], 60000, 500)).then(function(el){
   
                       });
           }).click().end();
   

2. Also tried to customize pollUntil myself but doesn't work as well

   function pollVisible(element, timeout) {
   var dfd = new Deferred();
   var endTime = Number(new Date()) + timeout;
    (function poll() {
       element.isDisplayed().then(function (displayed) {
           if (displayed) {
               dfd.resolve();
           }
           else if (Number(new Date()) < endTime) {
               setTimeout(poll, 500);
           }
           else {
               var error = new Error('timed out; final url is ' + url);
               dfd.reject(error);
           }
       });
      })();
     return dfd.promise;
    }
   

Answer 1

You've probably had an answer to this by now but here's my solution to this just in case you're still unsure or if anyone else comes across this issue.

I'm not sure why you are polling until an element is visible here. What I would do is set the find timeout of your leadfoot/Session as follows:

this.remote.setFindTimeout(60000)

Then when you invoke the this.remote.findByXPath method, it will automatically search for your element for a maximum of 1 minute (in the case of my above example). If it finds the element within that time, it will then proceed to the next step in your code. If it doesn't find the element within that time, the test case will time out.

You can then simplify your code to (for example):

this.remote
  .setFindTimeout(60000)
  .findByXpath("//div[@data-index='blockContainer']/button[text()='Create new']")
  .click()
  .end();

Of course there's no need to set the find timeout every time you wish to find an element in the UI. You can set it once somewhere more appropriate (ie. at the beginning of your test) and it will remain in place for the duration of your test. I'm just doing it here as a means of documenting a full example for you.

Hope this helps!