Firefox不會等待頁面加載Webdriverio

Question

我試圖運行我的測試使用Selenium並剛剛遇到問題。我有我爲Chrome瀏覽器編寫的測試。現在我一直試圖在Firefox瀏覽器中運行相同的測試，但失敗了。

我已經開始調查問題，發現Firefox不會等到頁面完全加載。 Chrome完美運作。

我在Docker容器中運行Selenium。

這裏是我的腳本

storeSearch(info) { 
     let that = this; 
     return new Promise(function (resolve, reject) { 
      browserClient.init() 
       .url("http://somewhere.com") 
       .selectByVisibleText("#store","Tech") 
       // Redirect to a new page 
       .setValue("input[name='search']", info.searchCriteria) 
       .selectByValue(".featured", 'MacBook') 
       .click("button[name='info']") 
       .element('.popup') 
       .then(function (element) { 
        if (element.state === 'success') { 

        } 
       }); 
     }); 
    } 

它不會嘗試甚至從選擇.selectByVisibleText("#store","Tech")選擇存儲類型，只是拋出一個異常。

「（輸入[名=「搜索」] \「，

我嘗試添加的元件不能在頁面上使用給定的搜索 參數\）」位於」 timeouts但它不工作，並給我一個錯誤。

browserClient.init() 
        .url("http://somewhere.com") 
        .timeouts('pageLoad', 100000) 
        .selectByVisibleText("#store","Tech") 

引發以下錯誤。

「未知等待類型：頁面加載\ nBuild信息：版本： '3.4.0'，修訂： '未知'，時間： '未知' \ n系統信息：主機： 'ef7581676ebb'，IP： 「 172.17.0.3'，os.name：'Linux'，os.arch：'amd64'，os.version： '4.9.27-moby'，java.version：'1.8.0_121'\ n驅動程序信息：driver.version ： 未知

我一直在試圖解決這個問題了兩天，但至今沒有運氣

可能有人幫助，也許你有秒。 ome的想法是什麼會導致問題？

謝謝。

UPDATE

.url("http://somewhere.com") 
       .pause(2000) 
       .selectByVisibleText("#store","Tech") 

如果我把一些pause陳述它的工作原理，但是這是真的不好，不是我想從這個框架的期望。 Chrome完美運作。它會一直等到加載欄完全加載，然後才執行操作。

問題是在geckodriver我猜測，我測試了它在Python中的相同流，Java和行爲是完全一樣的。

Answer 1

我已經遇到了很多類似於Python和C＃中的Selenium的問題，不幸的是在Chrome和Firefox的webdrivers中都存在這樣的問題。問題似乎是，代碼在它自己之前，並嘗試引用元素，甚至在它們存在/在頁面上可見之前。我在Python中找到的解決方案至少是使用這樣的Wait函數：http://selenium-python.readthedocs.io/waits.html

如果節點中沒有等價物，那麼您可能必須編寫自定義方法來檢查源代碼，隨着時間的推移x元素中的元素。

Answer 2

您可以在JavaScript中使用代碼，它將等待網站的狀態。 在C＃中是這樣的：

public void WaitForPage(IWebDriver driver, int timeout = 30) 
    { 
     IWait<IWebDriver> wait = new WebDriverWait(driver, TimeSpan.FromSeconds(timeout)); 
     wait.Until(driver1 => ((IJavaScriptExecutor)driver).ExecuteScript("return document.readyState").Equals("complete")); 
    } 

Answer 3

我遇到的確切行爲你上面詳細，全面綠色/通過測試用例瀏覽器，但在Firefox，一個不同的故事。

首先，從不使用timeouts或pause在您的測試案例，除非您正在調試。在這種情況下，將.debug()先前鏈接到您的失敗步驟/命令將實際上會更好。

我把我所有的WDIO命令全部包裝在waitUntill()之後，之後我在Firefox中也看到了綠色。看到你的代碼波紋管：

storeSearch(info) { 
let that = this; 
return new Promise(function (resolve, reject) { 
    browserClient.init() 
     .url("http://somewhere.com") 
     .waitUntil(function() { 
      return browser 
       .isExisting("#store"); 
     }, yourTimeout, "Your custom error msg for this step") 
     .selectByVisibleText("#store","Tech") 
     // Redirect to a new page 
     .waitUntil(function() { 
      return browser 
       .setValue("input[name='search']", info.searchCriteria); 
     }, yourTimeout, "Your custom error msg for this step") 
     .waitUntil(function() { 
      return browser 
       .selectByValue(".featured", 'MacBook'); 
     }, yourTimeout, "Your custom error msg for this step") 
     .waitUntil(function() { 
      return browser 
       .click("button[name='info']"); 
     }, yourTimeout, "Your custom error msg for this step") 
     .waitUntil(function() { 
      return browser 
       .isExisting(".popup"); 
     }, yourTimeout, "Your custom error msg for this step") 
     .element('.popup') 
     .then(function (element) { 
      assert.equal(element.state,'success'); 
     }); 
}); 
} 

這不是很漂亮，但它爲我做了工作。希望對你有好處。

增強：如果您計劃在實際構建&維護使用WDIO強大的自動化線束，那麼你應該考慮創建custom commands這個包等待&讓你的測試用例更具可讀性。參見下文對.click()一個例子：

commands.js：

module.exports = (function() { 
browser.addCommand('cwClick', function(element) { 
    return browser 
     .waitUntil(function() { 
      return browser.isExisting(element); 
     }, timeout, "Oups! An error occured.\nReason: element(" + element + ") does not exist") 
     .waitUntil(function() { 
      return browser.isVisible(element); 
     }, timeout, "Oups! An error occured.\nReason: element(" + element + ") is not visible") 
     .waitUntil(function() { 
      return browser.click(element); 
     }, timeout, "Oups! An error occured.\nReason: element(" + element + ") could not be clicked") 
}); 
})(); 

所有剩下要做的，就是通過require()在你的測試用例文件導入模塊：var commands = require('./<pathToCommandsFile>/commands.js');