[FIXED] Why does an async callback in for cycle only execute once?

Issue

I have a selenium-js function that takes callbacks

const poll = async <T extends error.WebDriverError>(
  action: Promise<void>,
  waitingAction: Promise<void>,
  errorConstructor: { new (): T },
): Promise<void> => {
  const maxIterations = 200
  for (let i = 0; i < maxIterations; i++) {
    try {
      await action
      break
    } catch (e) {
      if (e instanceof errorConstructor && i < maxIterations - 1) {
        await waitingAction
      } else throw e
    }
  }
}

What this should do, is to try action. If it fails with an expected error (still under maximum number of iterations), I perform a waitingAction and try again. In this case, waitingAction can be wait (for element to load), or scroll to an element.

However when I use function scrollTo as waitingFunction

const scrollTo = async (driver: Driver, selector: By) => {
  const element = await driver.findElement(selector)
  await driver.executeScript('arguments[0].scrollIntoView();', element)
}

it only executes once, even if the loop runs 200 times.

What gives? How can I ensure that the waitingAction is performed in each step?

Solution

You could change your code to receive a delegate instead:

const poll = async <T extends error.WebDriverError>(
  action: () => Promise<void>,
  waitingAction: () => Promise<void>,
  errorConstructor: { new (): T },
): Promise<void> => {
  const maxIterations = 200
  for (let i = 0; i < maxIterations; i++) {
    try {
      await action(); // When we invoke the delegate we receive a new Promise each time.
      break
    } catch (e) {
      if (e instanceof errorConstructor && i < maxIterations - 1) {
        await waitingAction();
      } else throw e
    }
  }
}

and then call it like this:

await poll(() => myAction(), () => myWaitingAction(), myErrorCtor);

Answered By - Silvermind