nightwatchjs - 如何等待ajax呼叫完成

Question

我正在使用nightwatchJS進行瀏覽器自動化。 我看到的一個常見用例是，我網頁中的大部分內容都是通過ajax調用的數據進行更新的。 所以，在我的測試中，我正在尋找一種方法來保持我的測試，直到我從Ajax獲得結果。 我沒能在夜間觀察或硒中找到任何api。

我嘗試過waitForElementVisible ，但我覺得這還不夠。 如果我的ajax調用沒有返回任何數據，會發生什么。

以前有人試過這個嗎？

Answer 1

如果您知道這里的ajax路徑是如何解決的，那么我們的想法是將'ajaxComplete'事件附加到客戶端並匹配執行的請求路徑：

client
    .timeoutsAsyncScript(15000) // set async exec timeout
    .click('.btn-submit') // ajax form submit
    .executeAsync(
        function(targetUrl, done){
            var nightwatchAjaxCallback = function(ajaxUrl) {
                if(ajaxUrl.indexOf(targetUrl) === 0) { // if url match notify script that xhr is done
                    done(true);
                }
            };

            if(!window.nightwatchAjaxInited) { // make sure ajaxComplete is attached only once

                window.nightwatchAjaxInited = true;

                $(document).ajaxComplete(function(e, res, req) {
                    nightwatchAjaxCallback(req.url);
                });
            }
        },
        ['/ajaxpath'], // expected xhr request path
        function(status){
            // executes once ajax is done
            client.verify.containsText('.entry', 'lorem ipsup...') // verify post is created
        }
    );

這是從上面的代碼創建的名為'ajaxWait'的命令：

exports.command = function(targetUrl, action, callback) {

    this.timeoutsAsyncScript(15000);

    action();

    this.executeAsync(function(targetUrl, done){

        var nightwatchAjaxCallback = function(ajaxUrl) {
            if(ajaxUrl.indexOf(targetUrl) === 0) {
                done(true);
            }
        };

        if(!window.nightwatchAjaxInited) {

            window.nightwatchAjaxInited = true;

            $(document).ajaxComplete(function(e, res, req) {
                nightwatchAjaxCallback(req.url);
            });
        }

    }, [targetUrl], function(status){

        callback();
    });
};

並且調用應該如下所示：

client.ajaxWait('/ajaxpath', function(){
    // ajax form submit
    client.click('.btn-submit') // ajax form submit
}, function(){
    // executes once ajax is done
    client.verify.containsText('.entry', 'lorem ipsup...') // verify post is created
})

Answer 2

我們在這里有一個自定義命令： https ： //github.com/mobify/nightwatch-commands

我們一直在努力將我們的命令與adaptive.js的特定要求分離，以便任何人都可以在他們的項目中使用它們。

您需要在package.json中包含nightwatch命令：1.6.0，並在settings.json中引用自定義命令

"custom_commands_path": "./node_modules/nightwatch-commands/commands",
"custom_assertions_path": "./node_modules/nightwatch-commands/assertions",

Answer 3

我面臨類似的問題，我看到兩種可能的解決方案：

1）在您想要單擊/檢查ajax請求之后的所有內容之前，請執行暫停語句。 大多數情況下測試失敗是因為ajax請求尚未完成且缺少某些內容。

client.pause(5000); 應該訣竅。

2） adaptive.js似乎有一個nightwatchJS的waitForAjax實現。 無論如何它似乎是封閉的代碼，我不能告訴你任何關於它。

3）使用--verbose選項驗證發生了什么。 詳細可以告訴您未處理的錯誤消息，這可能會導致您解決一個棘手的小問題。