如何检测 AngularJS 应用程序何时完成使用 JavaScript 加载页面？答案

【问题标题】：How can I detect when an AngularJS app is finished loading a page using JavaScript?如何检测 AngularJS 应用程序何时完成使用 JavaScript 加载页面？
【发布时间】：2018-09-29 00:31:31
【问题描述】：

我正在尝试编写机器人框架测试来涵盖第三方 AngularJS 应用程序的某些用例。

我需要使用 Python 3.5+ 和 SeleniumLibrary（而不是旧的 Selenium2Library）。

我已尝试调整 https://github.com/rickypc/robotframework-extendedselenium2library 中的 wait_until_angular_ready 关键字以在此库的上下文之外工作，并将其更新为与 Python 3.5+ 和 SeleniumLibrary 一起使用。

该关键字执行以下 JavaScript 以检查 Angular 何时就绪，但它似乎总是立即返回 true

var cb = arguments[arguments.length-1];
if(window.angular){
  var $inj;
  try {
    $inj = angular.element(document.querySelector('[data-ng-app],[ng-app],.ng-scope')
      ||document).injector()
      ||angular.injector(['ng'])
  } catch(ex) {
    $inj = angular.injector(['ng'])
  };
  $inj.get = $inj.get||$inj;
  $inj.get('$browser').notifyWhenNoOutstandingRequests(function() {
    cb(true) // it's always returning here
  })
} else {
  cb(true)
}

这是从我的 wait_until_angular_ready 关键字版本中调用的，该关键字位于 SeleniumLibrary WaitingKeywords 类的子类中。

执行Js的代码是这样的

WebDriverWait(self.driver, 100, 0.1). \
  until(lambda driver: driver.execute_async_script(script), error)

我在这里犯了错误还是这不是检查 Angular 何时完成页面渲染的正确方法？我承认我对AngularJS不是很熟悉

【问题讨论】：

这不是一个正确的问题，因为没有特定的时刻“角度完成渲染”。例如。一个不断刷新图表的仪表板，它什么时候完成渲染？它总是取决于特定情况，但大多数时候有一些可以等待的初始状态。它无法被追踪。你可以使用一些通用的技术，比如等待窗口load事件，每秒检查一次developer.mozilla.org/en-US/docs/Web/API/MutationObserver直到页面稳定等等。
嗯，肯定有办法的，不然github.com/rickypc/robotframework-extendedselenium2library怎么办？
通过使用类似于我列出的通用技术，notifyWhenNoOutstandingRequests 就是其中之一。没有准确的方法可以做到这一点。如果页面没有呈现到特定的初始状态，所有这些都将失败，例如仪表板示例。通常在 e2e/验收测试中，您不应该担心应用程序状态（Angular 应用程序可能已初始化，但您之后的指令可能不会），而是轮询特定元素的 DOM（例如，查看 Protractor 测试的编写方式）。
在您的代码中||angular.injector(['ng'])、catch(ex) { $inj = angular.injector(['ng']) } 和else { cb(true) } 会导致误报。如果应用处于生产模式，这将不起作用。

标签： javascript python angularjs selenium robotframework

【解决方案1】：

可能你已经解决了这个问题，但是如果将来有人遇到同样的不便，可以在 Robot 框架中使用这个库来实现 Angular：https://github.com/Selenium2Library/robotframework-angularjs

【讨论】：

【解决方案2】：

您可以使用 document.readyState ，如果页面完整呈现，它将返回“完成”作为响应。

【讨论】：

@Kittenmittons : 你能试试这个吗...？