找出哪些资源没有使用 Selenium 成功加载答案

【问题标题】：Find out which resources are not loaded successfully with Selenium找出哪些资源没有使用 Selenium 成功加载
【发布时间】：2016-11-23 10:41:39
【问题描述】：

我必须使用 Selenium 测试应用程序。该应用程序包含广告等外部内容。在我的测试中，我有好几次等待文档加载。这看起来像这样：

private static final String DOCUMENT_READY_STATE_COMPLETE = "complete";

protected void waitUntilDocumentLoaded() {
    wait.until(input -> getDocumentReadyState().equals(DOCUMENT_READY_STATE_COMPLETE));
}

private String getDocumentReadyState() {
    return ((JavascriptExecutor) driver).executeScript("return document.readyState").toString();
}

有时会发生，浏览器仍在加载某些资源。据我了解，如果 readyState 是 interactive 而不是 complete，我有时可以接受。比如有些广告没有及时加载，因为我的测试完全没意思。

是否有可能以某种方式获取包含尚未加载的 URL 的资源列表？ 然后我可以构建一个断言，检查哪些资源对于测试是强制性的，哪些是不是。

我在 Linux 下使用 Selenium Java WebDriver 2.53.1 和 Firefox 46。

【问题讨论】：

一种潜在的替代方法...您的广告是否具有容器元素，您可以在其中查看是否存在与广告相关的元素？

标签： javascript java selenium selenium-webdriver integration-testing

【解决方案1】：

等待特定元素出现
某种解决方法是使用 browsermob 代理或类似的 smthn，在 browsermob 的情况下，有一种方法可以让您等待网络流量停止并等待一定时间以确保浏览器没有进行任何其他电话。

【讨论】：

【解决方案2】：

我可以分享 3 种方法来检查元素是否存在。希望通过这些方法，你可以得到平息。

方法#1：

/**
 * Checks if is element present or not.
 * 
 * @param element
 * @return true, if is element present, otherwise return false.
 * @throws Exception
 */
public boolean isElementPresent(WebElement element) throws Exception {
    try {
        waitForElement(element, Integer.valueOf(PropertyLoader
                .loadProperty("implicit_timeout_second")));
        return true;
    } catch (NoSuchElementException e) {
        return false;
    }
}

方法#2：

/**
 * waits for element to be present.
 * 
 * @param element
 * @param timeOut
 *            The timeout in seconds when an expectation is called
 * @return
 */
public WebElement waitForElement(WebElement element, int timeOut) {
    WebDriverWait wait = new WebDriverWait(driverW, timeOut);
    wait.until(ExpectedConditions.elementToBeClickable(element));
    return element;
}

方法#3：

/**
 * Waits for the element to be present BY.
 * 
 * @param dinamic
 *            element
 * @return true, if is element present, otherwise return false.
 * @throws Exception
 */
protected boolean waitForDinamicElementPresent(By by) throws IOException {
    try {
        WebDriverWait wait = new WebDriverWait(driverW,
                Integer.valueOf(PropertyLoader
                        .loadProperty("implicit_call_timeout_second")));
        wait.until(ExpectedConditions.elementToBeClickable(by));
        return true;
    } catch (NoSuchElementException e) {
        return false;
    }
}

【讨论】：

感谢您的时间和精力。我知道这些方法。问题是如何找出哪些资源没有加载，即使我们实际上没有确切的资源列表。

【解决方案3】：

这就是我自己编造的。这可以检测未加载的图像。我使用了非常酷的网络服务http://www.deelay.me 和https://placekitten.com。所以至少对于图像我有一些东西。

<html>
<body>
<img src="http://deelay.me/1000/https://placekitten.com/g/500/500"/>
<img src="http://deelay.me/10000/https://placekitten.com/g/500/501"/>
<script>
function isImageOk(img) {
    //Function taken from http://stackoverflow.com/a/1977898/337621

    // During the onload event, IE correctly identifies any images that
    // weren’t downloaded as not complete. Others should too. Gecko-based
    // browsers act like NS4 in that they report this incorrectly.
    if (!img.complete) {
        return false;
    }

    // However, they do have two very useful properties: naturalWidth and
    // naturalHeight. These give the true size of the image. If it failed
    // to load, either of these should be zero.

    if (typeof img.naturalWidth !== "undefined" && img.naturalWidth === 0) {
        return false;
    }

    // No other way of checking: assume it’s ok.
    return true;
}


function checkState(){
    var documentState = document.readyState;
    if ( documentState != "complete") {
        console.log("Document is still having readystate " + documentState + ". Pending images: " );
        var images = document.getElementsByTagName("img");
        for(i = 0;i < images.length; i++)
        {
            if ( !isImageOk( images[i] ) ) {
                console.log("Image URL: " + images[i].src );
            }
        }
        setTimeout(checkState,500);
    }
    else {
        console.log("Document is loaded successfully.");
    }
}

checkState();

</script>
</body>
</html>

控制台输出：

Document is still having readystate loading. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/1000/https://placekitten.com/g/500/500
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is still having readystate interactive. Pending images: 
Image URL: http://deelay.me/10000/https://placekitten.com/g/500/501
Document is loaded successfully.

【讨论】：