等待 selenium webdriver 中的角度响应答案

【问题标题】：Wait for angular response in selenium webdriver等待 selenium webdriver 中的角度响应
【发布时间】：2018-01-13 11:00:45
【问题描述】：

我正在使用 Selenium WebDriver(Java) 自动化一个基于角度的应用程序。

在我的 AUT（被测应用程序）中，从下拉列表中选择任何选项后，它会将数据加载到页面中。现在这个加载是基于 ajax 的，基本上它调用一个 web 服务并返回数据，但是在页面加载微调器或消息没有显示在这个时间间隔内。以前我在显式等待中使用以下 javascript。

notDisplay = Boolean.valueOf(((JavascriptExecutor) input)
  .executeScript("return angular.element(document).injector()
  .get('$http').pendingRequests.length === 0")
  .toString());

但现在它不起作用。不工作意味着它总是返回 true，因此它不会等待等待加载。

这个应用程序正在使用角度，所以我尝试实现基于角度的等待策略，但我之前也尝试使用 jQuery 或 JS 等待策略，但它也不起作用。对于 jQuery，我使用以下 JavaScriptExecutor

boolean jqueryReady = (Boolean) ((JavascriptExecutor)driver)
  .executeScript("return jQuery.active==0")

谁能帮我解决这个问题。我还附上了 DOM 结构以便更好地理解应用程序

<head>
<meta charset="utf-8">
<title>XISOT | Energy Software</title>
<base href="/">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="assets/css/font-include.css" rel="stylesheet">
<link href="assets/css/datepicker-theme.css" rel="stylesheet">
<link href="assets/css/component.css" rel="stylesheet">
<link href="assets/css/custom.css" rel="stylesheet">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script async="" src="https://www.google-analytics.com/analytics.js">
<script src="https://use.fontawesome.com/webfontloader/1.6.24/webfontloader.js">
<script async="" src="https://www.googletagmanager.com/gtm.js?id=GTM-MH7JJN7">
<script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.js">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js">
<script src="https://use.fontawesome.com/7fbaaf4e79.js">
<script src="https://cdnjs.cloudflare.com/ajax/libs/accounting.js/0.4.1/accounting.min.js">
<link rel="stylesheet" media="screen" href="https://cdnjs.cloudflare.com/ajax/libs/handsontable/0.30.0/handsontable.full.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/handsontable/0.30.0/handsontable.full.js">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.bundle.min.js">
<script src="https://www.google.com/jsapi">
<script>
<link rel="stylesheet" href="https://use.fontawesome.com/7fbaaf4e79.css" media="all">
<script src="https://www.google.com/uds/?file=visualization&v=1.0&packages=corechart" type="text/javascript">
<link href="https://www.google.com/uds/api/visualization/1.0/40ff64b1d9d6b3213524485974f36cc0/ui+en.css" type="text/css" rel="stylesheet">
<script src="https://www.google.com/uds/api/visualization/1.0/40ff64b1d9d6b3213524485974f36cc0/format+en,default+en,ui+en,corechart+en.I.js" type="text/javascript">
<script src="https://www.gstatic.com/charts/loader.js">
<link href="styles.77279c25a29673778a1c.bundle.css" rel="stylesheet">
<style>
<script type="text/javascript" charset="utf-8" async="" src="0.9bd994105eb2d54dba78.chunk.js">
<script type="text/javascript" charset="utf-8" async="" src="10.328d3d60aa813c93c06a.chunk.js">
<script type="text/javascript" charset="utf-8" async="" src="1.af512bfedea06d5a0cbc.chunk.js">
<style>
<style>
<style>
<style>
</head>
<body class="" style="padding-right: 0px;">
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MH7JJN7" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<******-cli-app ng-version="4.0.1">
<script type="text/javascript" src="inline.a72ddd58b7d594fb4f3e.bundle.js">
<script type="text/javascript" src="polyfills.c88a23e25eb2f45b7bb7.bundle.js">
<script type="text/javascript" src="scripts.fd3b917905e45b8ba8f8.bundle.js">
<script type="text/javascript" src="vendor.ebddd23038be460d8b8d.bundle.js">
<script type="text/javascript" src="main.f9ced3beb42f51486f9b.bundle.js">
<script id="" type="text/javascript">
<script id="" type="text/javascript">
<script id="" type="text/javascript">
<script id="" type="text/javascript">
<script id="" type="text/javascript">
<script id="" type="text/javascript">
</body>

【问题讨论】：

请阅读为什么a screenshot of code is a bad idea。粘贴代码并正确格式化。
另外，“不工作”是含糊的。请说明它是如何不工作的，并粘贴任何相关的错误消息等。
您可能希望将solution check page load with javascript 和solution check if page load via an specific element after page loaded 结合使用。或者你可以使用solution check if ajax spinner loading icon is available
@Jeffs 感谢您的建议，我根据您的建议修改了我的问题。
@Tuyen Nguyen 我已经提到我尝试过等待 jQuery 和 js 等待，但它总是返回 true，所以这意味着它显示页面已加载，对于微调器和加载器部分，我已经提到它不是根据设计显示在我的页面中。

标签： javascript java jquery angular selenium-webdriver

【解决方案1】：

如果您的应用程序使用 angular 5 或更高版本，请使用以下 java 脚本。

String angularwait = "return window.getAllAngularTestabilities().findIndex(x=>!x.isStable()) === -1"

notDisplay = Boolean.valueOf(((JavascriptExecutor) input).executeScript(angularwait).toString());

【讨论】：

【解决方案2】：

除了你的检查之外，Angular 在后台做了很多事情。您可以在单独的类中使用以下代码 sn-p 并在所需的类中调用方法 (waitUntilAngularReady)。此外，您必须将 WebDriver 对象发送到项目中舒适的位置的此类（setDriver 方法）。对于 Angular 7.2.0 版，这对我来说很好。

public class WaiterForAngular{
 private WebDriver driver;
    private WebDriverWait jsWait;
    private JavascriptExecutor jsExec;
 
    //Get the driver 
    public void setDriver (WebDriver driver) {
        jsWait = new WebDriverWait(driver, 10);
        jsExec = (JavascriptExecutor) driver;
}

        public void waitUntilAngularReady() {
        try {
        Object angular5Check = jsExec.executeScript(
        "return getAllAngularRootElements()[0].attributes['ng-version']");
        if (angular5Check != null) {
        Boolean angularPageLoaded = (Boolean) jsExec.executeScript(
        "return window.getAllAngularTestabilities().findIndex(x=>!x.isStable()) === -1");
        if (!angularPageLoaded) {
        sleep(10);
        waitForAngular5Load();
        sleep(10);
        }
        }
        } catch (Exception e) {
        }
        }
    
        private void waitForAngular5Load() {
                String angularReadynessScript = "return window.getAllAngularTestabilities().findIndex(x=>!x.isStable()) === -1";
                angularLoads(angularReadynessScript );
            }
    
private void angularLoads(String angularReadynessScript ) {
        try {
            ExpectedCondition<Boolean> angularLoad = driver -> Boolean.valueOf(((JavascriptExecutor) driver)
                .executeScript(angularReadynessScript ).toString());
 
            boolean angularReady = Boolean.valueOf(jsExec.executeScript(angularReadynessScript ).toString());
 
            if (!angularReady) {
                jsWait.until(angularLoad);
            }
        } catch (Exception e) {
        }
    }


        private void sleep(long milliseconds){
        try{
        Thread.sleep(milliseconds);
        }
        catch(Exception e){
        }
}

【讨论】：