javascript - CasperJS/PhantomJS，一些测试随机失败

Question

我有一些测试随机失败的场景(可能是 5/65)，通常是 svg、自动完成等...虽然 CPU 很好，所以它来 self 编写脚本的方式。

但我不知道如何改变它们以使其坚固可靠。这是当我使用 wait() 函数时 -> 有时我有超时错误，有时它会通过。

最奇怪的是，当我将我的脚本拆分为两个脚本时，失败的次数少于一个 ....

---

添加waitForResource试试

感谢 Artjom B. 的帮助。

casper.test.begin('\n********* Navigation on directories : ***********', 4,{
setUp: function(test) {
    setLevel("normal");
},

tearDown: function(test) {
    getJSON();
},

test: function(test){
    "use strict";
    var url = 'http://www.linternaute.com/';
    casper.start()
   .thenOpen(url + "/ville/", function(){
        if(this.exists('.ui-dialog-titlebar-close')){this.click('.ui-dialog-titlebar-close');}
        if(this.exists('#top_oas')){this.click('#top_oas > .right');}
        this.test.assertExists(".jODMainSearch", "Search toolbar present");
        this.sendKeys(".jODMainSearch", "Ren");
        this.click(".submit.search");
    })
    .waitForSelector(".odListGlossary", function(){
        this.test.assertExists(".odListGlossary", "Search result ok");
        this.clickLabel("Rennes (35000)");
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )
    //auto-completion
    .thenOpen(url + "/ville/", function(){

        //this.waitForResource(/odmainsearch/, function(){
            /*var fs = require('fs');
            fs.write("results1.html", this.getPageContent(), 'w');
            this.wait(8000, function(){
                var fs = require('fs');
            fs.write("results2.html", this.getPageContent(), 'w');
            });*/

            /*casper.waitFor(function check() {
                    return this.fetchText('script').indexOf("fn.odMainsearch=function") !== -1;
                    }
                    , function then() {
                        this.echo('cc');
                        this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
                    }
            );*/
        /*** the changes ***/   
        this.waitForResource(function testResource(resource) {
            return resource.url.indexOf("http://static.ccmbg.com/www.linternaute.com/asset/js?m=odmainsearch") !== -1;
        }, function onReceived() {
            this.echo('JS for auto-completion present');
            this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
        });
        this.waitForSelector('ul.ui-autocomplete[viewbox="true"]', function() {
            this.mouse.move('a[href="/ville/rennes/ville-35238"]');
            this.click('a[href="/ville/rennes/ville-35238"]');
        });
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )
    .run(function() {
            this.test.comment('--- Done ---\n');
            test.done();
    });
}
});

---

第一次尝试:

这是一个随机失败的例子:

casper.test.begin('\n********* Navigation on directories : ***********', 4,{
setUp: function(test) {
    //setLevel("normal");
},

tearDown: function(test) {
    //getJSON();
},

test: function(test){
    "use strict";
    var url = 'http://www.linternaute.com/';
    casper.start()
   .thenOpen(url + "/ville/", function(){
        //close some ads
        if(this.exists('.ui-dialog-titlebar-close')){this.click('.ui-dialog-titlebar-close');}
        if(this.exists('#top_oas')){this.click('#top_oas > .right');}
        this.test.assertExists(".jODMainSearch", "Search toolbar present");
        this.sendKeys(".jODMainSearch", "Ren");
        this.click(".submit.search");
    })
    .waitForSelector(".odListGlossary", function(){
        this.test.assertExists(".odListGlossary", "Search result ok");
        this.clickLabel("Rennes (35000)");
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )
    //auto-completion
    .thenOpen(url + "/ville/", function(){
        this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
        this.waitForSelector('ul.ui-autocomplete[viewbox="true"]', function() {
            this.mouse.move('a[href="/ville/rennes/ville-35238"]');
            this.click('a[href="/ville/rennes/ville-35238"]');
        });
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )
    .run(function() {
            this.test.comment('--- Done ---\n');
            test.done();
    });
}
});

如果我只看脚本的结尾(在第一个示例中它随机失败，我已经评论了开头):

casper.test.begin('\n********* Navigation on directories : ***********', 1,{
setUp: function(test) {
    //setLevel("normal");
},

tearDown: function(test) {
    //getJSON();
},

test: function(test){
    "use strict";
    var url = 'http://www.linternaute.com/';
    casper.start()
   /*.thenOpen(url + "/ville/", function(){
        if(this.exists('.ui-dialog-titlebar-close')){this.click('.ui-dialog-titlebar-close');}
        if(this.exists('#top_oas')){this.click('#top_oas > .right');}
        this.test.assertExists(".jODMainSearch", "Search toolbar present");
        this.sendKeys(".jODMainSearch", "Ren");
        this.click(".submit.search");
    })
    .waitForSelector(".odListGlossary", function(){
        this.test.assertExists(".odListGlossary", "Search result ok");
        this.clickLabel("Rennes (35000)");
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )*/
    //auto-completion
    .thenOpen(url + "/ville/", function(){
        this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
        this.waitForSelector('ul.ui-autocomplete[viewbox="true"]', function() {
            this.mouse.move('a[href="/ville/rennes/ville-35238"]');
            this.click('a[href="/ville/rennes/ville-35238"]');
        });
    })
    .waitFor(function check() {
            return this.fetchText('h1').indexOf("Rennes") !== -1;
            }
            , function then() {
                this.test.assertSelectorHasText("h1", "Rennes");
            }
    )
    .run(function() {
            this.test.comment('--- Done ---\n');
            test.done();
    });
}
});

那么问题出在哪里，你有什么想法吗？ -> 堆栈中的两个步骤函数:它经常失败，只有一个:它有时会失败......

Answer 1

加载页面时，似乎并非所有脚本都存在于 DOM 中。至少有一个 js 资源在评估内联脚本 block 之后加载，因此在 window.onload 之后加载，因此在 thenOpen 之后将控制权交给下一个步。您的案例中的资源是:

http://static.ccmbg.com/www.linternaute.com/asset/js?m=odmainsearch&v=201405201‌​800

So you need to wait for such a late resource if you want to take action based on its code. In your case it is necessary for the autocomplete dropdown to open. So I changed

casper.thenOpen(url + "/ville/", function(){
    this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
    this.waitForSelector('ul.ui-autocomplete[viewbox="true"]', function() {
        this.mouse.move('a[href="/ville/rennes/ville-35238"]');
        this.click('a[href="/ville/rennes/ville-35238"]');
    });
});

到

casper.thenOpen(url + "/ville/")
.waitForResource(/linternaute\.com\/asset\/js/, function(){
    this.wait(500); // this seem necessary: maybe to wait for the script evaluation
})
.then(function(){
    this.sendKeys('.jODMainSearch', 'Ren', {keepFocus: true});
})
.waitForSelector('ul.ui-autocomplete[viewbox="true"]', function() {
    this.mouse.move('a[href="/ville/rennes/ville-35238"]');
    this.click('a[href="/ville/rennes/ville-35238"]');
});

我在没有取消注释第一部分的情况下使用了完整的脚本。 casper 仅用于定向。 20 次运行没有错误。