如何等待元素在angular.js應用程序中可見？

Question

我覺得這似乎是一個很老的問題。但實際上並不適合我。

我的應用程序基於Angular。當Loader出現時立即登錄到應用程序，Selenium測試失敗並引發下面提到的錯誤異常。

unknown error: Element <a id="user_dropdown" href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown">...</a> is not clickable at point (1421, 33). Other element would receive the click: <md-backdrop ng-show="showMainSpinner" class="m-backdrop" aria-hidden="false">...</md-backdrop> 
    (Session info: chrome=58.0.3029.110) 
(Driver info: chromedriver=2.28.455520 
(cc17746adff54984afff480136733114c6b3704b),platform=Windows NT 10.0.14393 
x86_64) (WARNING: The server did not provide any stacktrace information) 
Command duration or timeout: 56 milliseconds 
Build info: version: '2.45.0', revision: 
'5017cb8e7ca8e37638dc3091b2440b90a1d8686f', time: '2015-02-27 09:10:26' 
[Driver info: org.openqa.selenium.chrome.ChromeDriver 
Capabilities \[{applicationCacheEnabled=false, rotatable=false, 
mobileEmulationEn][1]abled=false, networkConnectionEnabled=false, chrome= 
{chromedriverVersion=2.28.455520 
(cc17746adff54984afff480136733114c6b3704b), 
userDataDir=C:\Users\smistry\AppData\Local\Temp\scoped_dir56852_17781}, 
takesHeapSnapshot=true, pageLoadStrategy=normal, databaseEnabled=false, 
handlesAlerts=true, hasTouchScreen=false, version=58.0.3029.110,   
platform=XP, browserConnectionEnabled=false, nativeEvents=true, 
acceptSslCerts=true, locationContextEnabled=true, webStorageEnabled=true, 
browserName=chrome, takesScreenshot=true, javascriptEnabled=true, 
cssSelectorsEnabled=true, unexpectedAlertBehaviour=}] 
Session ID: 41ebcec742d22c760f65efb4bb06b7db 

事情我已經這樣做的遠來實現這一目標：用隱

1）等待

2）使用顯式的等待（WaitForElementPresent/WaitForVisible/elementToBeClickable /等元素等的隱形）（所有可能的嘗試）

3）使用Java Script（window.angular.element（'body'）。injector（）。get（'$ http'）。pendingRequests.length === 0）

typeof運算的jQuery！= '未定義'

document.readystate

的typeof角！= '未定義'）

4）嘗試捕捉元件（裝載機的每一種可能的方式），並等待它消失。根本沒有工作。

5）使用了Thread.sleep（但我不想使用它）

下面是代碼爲我的網站的微調元素：

<md-progress-circular md-mode="indeterminate" md-diameter="70" class="m-spinner md-raised md-hue-2 md-mode-indeterminate" aria-valuemin="0" aria-valuemax="100" role="progressbar" style="width: 70px; height: 70px;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 70 70" style="width: 70px; height: 70px; transform-origin: 35px 35px 35px;"><path fill="none" style="stroke-width: 7px;" d="M21.583326164121,6.500125207614687A31.5,31.5 0 0,1 49.405589517818534,63.01301466540359"></path></svg></md-progress-circular> 

我使用webdriver的硒，鉻58，日食neon.2，窗口10.

真的很努力，因爲最後這麼多天來得到它的解決方案。我希望你有我的問題。如果缺少任何東西，我可以提供詳細信息。幫助將不勝感激。

Answer 1

3）使用Java腳本的（window.angular.element（ '主體'）。噴油器（）。獲得（ '$ HTTP'）。pendingRequests.length === 0）

的typeof的jQuery ！= '未定義'

document.readystate

的typeof角！= '未定義'）

由上述錯誤，我可以說，角度JS庫是沒有加載到您的應用程序

Answer 2

我使用下面提到的代碼來處理AngularJS相關的加載問題。代替獲取待處理的請求長度，它會在之後通知還有沒有未處理的請求。

public void waitForAngularRequestsToFinish() { 
    if ((boolean) getJavascriptExecutorFacade().executeScript(
      "return (typeof angular !== 'undefined')? true : false;")) { 
     getJavascriptExecutorFacade() 
       .executeAsyncScript(
         "var callback = arguments[arguments.length - 1];" 
           + "angular.element(document.body).injector().get('$browser').notifyWhenNoOutstandingRequests(callback);"); 
    } 
} 

距離PageObject類的SerenityBDD的摘錄。

Answer 3

終於在幾個星期的努力後，我已經找到了解決方案，我的問題。

感謝大家的支持和幫助，我發佈了以下適合我的答案。

在這麼多次之前，我已經單獨嘗試過。但是這一次，我一起嘗試了它們，並且像魅力一樣工作。

我已經使用明確的等待並等待加載元素從主頁圖標的頁面和可見性中不可見。

謝謝。

WebDriverWait wait = new WebDriverWait(webDriver, 10); 
    wait.until(ExpectedConditions.presenceOfElementLocated(By.id("elementOfHomePage"))); 
    wait.until(ExpectedConditions.invisibilityOfElementLocated(By.cssSelector("loaderElement")));