wait until angular 2+ has finished loading issue

Question

I recently posted a question about an issue I have white testing an angular based application (ref: wait until Angular has finished loading issue )

Turns out that the check done was valid for angular 1.x apps, while our application runs on angular 6.x.

I've then found out that post: Detecting that Angular 2 is done running

which explains how to do a similar check but for angular 2+ apps. I've set up the check in a similar fashion to "Michal Filip" explained.

I've also tried to use the ngWebdriver solution proposed further down in the post.

Both suffers of the same problem: the check will always return true as in its done loading which isn't true.

tried to inverse the check, it didn't help (state never changed)

// Will check if Angular still has pending http_requests ongoing and wait if required
public void untilAngular2HasFinishedProcessing()
{
  until(() ->
    {
      log.info("Waiting on angular 2+ to finish processing");
      final boolean isReady = ((JavascriptExecutor) driver).executeAsyncScript(
        "var callback = arguments[arguments.length - 1];" +
          "if (document.readyState !== 'complete') {" +
          "  callback('document not ready');" +
          "} else {" +
          "  try {" +
          "    var testabilities =  window.getAllAngularTestabilities();" +
            "    var count = testabilities.length;" +
            "    var decrement = function() {" +
            "      count--;" +
            "      if (count === 0) {" +
            "        callback('complete');" +
            "      }" +
            "    };" +
            "    testabilities.forEach(function(testability) {" +
            "      testability.whenStable(decrement);" +
            "    });" +
            "  } catch (err) {" +
            "    callback(err.message);" +
            "  }" +
            "}"
      ).toString().equals("complete");
      log.info("Is angular 2+ ready? " + isReady);
      return isReady;
    }
  );
 }


  // sample call would be
 untilAngular2HasFinishedProcessing();

Excpected: the test would wait until Angular is done loading before returning true

Actual: Returns true from the start, which I know isn't the case.

Possible duplicate? No, because this is a problem question based on the implementation proposed in the linked question.

Dave · Accepted Answer · 2019-01-17T20:34:23.760

Here's the solution I ended up using:

public boolean untilAngular2HasFinishedProcessing()
  {
    until(() ->
      {
        log.info("Waiting on angular 2+ to finish processing");
        final boolean isReady = (Boolean.valueOf(((JavascriptExecutor) driver)
          .executeScript(
            "try{" +
          "return (window.getAllAngularTestabilities()[0]._ngZone.hasPendingMicrotasks == " +
          "false && " +
          "window.getAllAngularTestabilities()[0]._ngZone.hasPendingMacrotasks == false && " +
          "window.getAllAngularTestabilities()[0]._ngZone._nesting == 0 &&" +

          "window.getAllAngularTestabilities()[0]._ngZone.isStable == true)" +
          "}" +
          "catch(err) {" +
          "if (err.message == ('window.getAllAngularTestabilities is not a function'))" +
          "{" +
          "return true" +
          "}" +
          "}")
          .toString()));
        log.info("Is Angular 2+ ready? " + isReady);
        return isReady;
      }
    );
    return true;
  }

That worked on a consistent fashion so far.

wait until angular 2+ has finished loading issue

1 Answers1