Javascript code to do clicks by Id and by Xpath executes so fast

Question

I'm very new to Javascript. I try to set a javascript code in Selenium IDE with "execute Script" command in order to open a settings button that share the same class="MyClass" (there are 16 buttons).

After clicking the button appears a window with some options. When these options are visible I want to click the option that can be located by Xpath, and finally I want to save the settings for each button, then repeat the same for the 16 buttons.

The code I have so far it seems to work partially, because locates the 16 button and I can do the for loop and click on them, but it seems that runs so fast and this generates that the other actions don't be completed.

var items = document.getElementsByClassName("MyClass"); 
for (var i = 0; i < items.length; i++) {
    items[i].click(); // To open each button that have the class = "MyClass"
    document.evaluate(" //li[contains(.,'sometext')] ", document.body, null, 9, null). singleNodeValue.click(); // Click on elemenet by Xpath
    document.getElementById("savesettings").click(); // Save settings
};

How can I add some pause for example like this?

var items = document.getElementsByClassName("MyClass"); 
for (var i = 0; i < items.length; i++) {
    items[i].click(); // To open each button that have the class = "MyClass"

    **Command to wait 2 seconds**

    document.evaluate(" //li[contains(.,'sometext')] ", document.body, null, 9, null). singleNodeValue.click(); // Click on elemenet by Xpath

    **Command to wait 2 seconds**

    document.getElementById("savesettings").click(); 
};

Thanks in advance for any help.

Possible duplicate of [JavaScript ES6 promise for loop](https://stackoverflow.com/questions/40328932/javascript-es6-promise-for-loop) — Kenan Balija, May 24 '19 at 00:39

score 1 · Accepted Answer · answered May 24 '19 at 00:39

I'm not too sure what you're trying to do here but you can delay the execution by utilizing the window.setTimeout function. This will trigger a function after a pre-determined amount of time.

Inside this function you can decide what to do - initiate another timout or execute something right-away - with a simple switch-block.

var items = document.getElementsByClassName("MyClass");
var currentItem = 0;
var currentAction = 0;

function update() {
  switch (currentAction) {
    case 0:
      items[currentItem].click();
      currentAction = 1;
      window.setTimeout(update, 2000);
      break;
    case 1:
      document.evaluate(" //li[contains(.,'sometext')] ", document.body, null, 9, null).singleNodeValue.click(); // Click on elemenet by Xpath
      currentAction = 2;
      window.setTimeout(update, 2000);
      break;
    case 2:
      document.getElementById("savesettings").click();
      currentAction = 0;
      if (currentItem + 1 < items.length) {
        currentItem++;
        update();
      }
      break;
  }
}

update();

score 0 · Answer 2 · answered May 24 '19 at 00:40

Looks like you should use Promises: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

There is an answer here: JavaScript ES6 promise for loop

You can take the example there and implement it inside your code:

for (let i = 0, p = Promise.resolve(); i < 10; i++) {
    p = p.then(_ => new Promise(resolve =>
        setTimeout(function () {
            console.log(i);
            resolve();
        }, Math.random() * 1000)
    ));
}

Thanks for your answer, but I didn't see a easy way to adapt your example to my code. — Ger Cas, May 24 '19 at 06:19

Javascript code to do clicks by Id and by Xpath executes so fast

2 Answers2