Question

我已将所有图片网址存储在一个数组中，并尝试测试图片是否已正确加载。如果你看到下面的代码，我不得不一次又一次地重复几行。我怎么能把它写成通用的？

casper.start()
var imagesArray = [];
imagesArray = ['https://www.google.co.in/images/srpr/logo11w.png',
'https://www.google.co.in/images/srpr/logo1w.png']; 

casper.thenOpen(imagesArray[0], function () {
    if (this.currentHTTPStatus === 404) {
        this.warn(imagesArray[0] + ' is missing (HTTP 404)');
    } else if (this.currentHTTPStatus === 500) {
        this.warn(imagesArray[0] + ' is broken (HTTP 500)');
    } else {
    this.echo(' is okay (HTTP %s)');
    }
});

casper.thenOpen(imagesArray[1], function () {
    if (this.currentHTTPStatus === 404) {
        this.warn(imagesArray[0] + ' is missing (HTTP 404)');
    } else if (this.currentHTTPStatus === 500) {
        this.warn(imagesArray[0] + ' is broken (HTTP 500)');
    } else {
    this.echo(' is okay (HTTP %s)');
    }
});


casper.run(function() {
this.echo('Image loading test finished');
this.exit();
});

我尝试了下面的方法，调用一个函数，但是它抛出了解析器错误，我做错了什么，或者我该如何处理呢？

function checkImages(item){
if (this.currentHTTPStatus === 404) {
this.warn(item + ' is missing (HTTP 404)');
} else if (this.currentHTTPStatus === 500) {
this.warn(item + ' is broken (HTTP 500)');
} else {
this.echo(' is okay (HTTP %s)');
}
}

      casper.thenOpen(imagesArray[0], function () {
    this.evaluate(checkImages(imagesArray[0]));
    });

      casper.thenOpen(imagesArray[1], function () {
    this.evaluate(checkImages(imagesArray[1]));
    });

提前致谢。

Answer 1

由于所有then*函数都是将步骤插入队列的异步步骤函数，因此可以在循环中调用它们。由于imagesArray是本机数组，因此可以使用PhantomJS支持的Array.prototype.forEach进行迭代：

var imagesArray = [
    'https://www.google.co.in/images/srpr/logo11w.png',
    'https://www.google.co.in/images/srpr/logo1w.png'
]; 

casper.start();

imagesArray.forEach(function(imageUrl){
    casper.thenOpen(imageUrl, function () {
        if (this.currentHTTPStatus === 404) {
            this.warn(imageUrl + ' is missing (HTTP 404)');
        } else if (this.currentHTTPStatus === 500) {
            this.warn(imageUrl + ' is broken (HTTP 500)');
        } else {
            this.echo(' is okay (HTTP %s)');
        }
    });
});

casper.run();

一个简单的for循环就足够了，但是你会遇到imagesArray[i]内thenOpen的问题。 i变量永远不会改变，因为每个步骤都在循环完成执行后执行。因此，每个imagesArray[i]都会显示最后一个网址。因为JavaScript具有功能级别范围，所以url绑定到每次迭代并且之后永远不会更改。

Answer 2

提醒一下，将evaluate（）方法视为CasperJS环境与您打开的页面之间的门;每次将一个闭包传递给evaluate（）时，您都会进入该页面并执行代码，就像使用浏览器控制台一样。因此，您无法在evaluate上使用checkImages。

像这样使用echo：

casper.thenOpen(imagesArray[0], function () {
    this.echo(checkImages(imagesArray[0]));
});

casper.thenOpen(imagesArray[1], function () {
    this.echo(checkImages(imagesArray[1]));
});

Answer 3

在此测试用例中，您不需要thenOpen，因为您只想验证响应代码。你可以这样做，但它浪费时间/资源是非常浪费的。这就是我实现同一目标的方式：

casper.test.begin('link tester', 73, function(test) {
  casper.start(url);

getLinks = function(){
     links = this.evaluate(function(){
        var links = document.getElementsByTagName('a');
        links = Array.prototype.map.call(links,function(link){
            return link.getAttribute('href');
        });
        return links;
    });
}

casper.then(getLinks);

casper.then(function(response) {
  for (q = 0; q < links.length; q++) {
    if (response == undefined || response.status >= 400) {
      this.test.fail("URL " + links[q] + " failed with response code " + (response.status));
    } else {
      this.test.pass((response.status + " ---- " + links[q]));
    }
  }
});

唯一需要注意的是每个casper函数只能有1个失败。如果您在页面上测试100个URL，并且在第4个页面上失败，则必须先修复该URL，然后才能看到其他URL是否失败。因此，您需要在if语句中嵌套casper.then()。万一你想知道，它看起来像这样：

casper.then(function(response) {
  links.forEach(function(link){
    if (response == undefined || response.status >= 400) {
      casper.then(function() {
        this.test.fail("URL " + link + " failed with response code " + (response.status));
      })
    } else {
      this.test.pass((response.status + " ---- " + link));
    }
  });
});

如何将参数传递给casperjs中的函数？

3 个答案: