如何验证casperjs中的排序(升序和降序)功能
问题描述:
我是这个框架的新手,也不知道如何使用CasperJS测试排序功能。如何验证casperjs中的排序(升序和降序)功能
这种情况是,我需要验证与排序功能的搜索结果。 当我用任何关键字搜索时,它会显示所有可能的匹配结果。
答
你必须定义自己的比较函数。这里有个例子一个是,辞书串排序,不区分大小写的方式进行比较:
function cmpLexiInsAsc(a, b) {
return a.toLowerCase() < b.toLowerCase();
}
function cmpLexiInsDesc(a, b) {
return a.toLowerCase() > b.toLowerCase();
}
难度会检索您可以比较正确的元素。例如,您可能需要拆分价格和货币,将价格解析为数字并进行比较。
我会假设其余的答案是你有一个默认的<table>
并使用按列排序。
您可以定义一个函数,该函数采用列索引(从1开始),附加选择器查找单元格中的元素以及该列的比较函数。它内部定义了CSS选择器或XPath表达式来访问表格单元格。请记住,要做到这一点,你需要知道有多少行,如果有一个页眉/页脚行,可能会调整。
function compare(colIndex, cellSelector, cmpFunc){
function rowSelector(rowIndex) {
return "table#tableId tr:nth-child(" + rowIndex + ") > td:nth-child(" + colIndex + ")" + cellSelector;
}
var count = this.getElementsInfo("table#tableId tr");
if (count < 2) {
return true;
}
var previous = this.getElementInfo(rowSelector(i)).text,
current;
for(var i = 2; i <= count; i++) {
current = this.getElementInfo(rowSelector(i)).text;
if (!cmpFunc(previous, current)) {
return false;
}
previous = current;
}
return true;
}
然后,您可以根据您的条件为多个列运行此功能compare()
函数。例如:
casper.then(function(){
casper.test.assert(compare.call(this, 1, " > span > span.info", cmpLexiInsAsc), "Column 1 ascending");
this.click("some selector to change ordering");
});
casper.then(function(){
casper.test.assert(compare.call(this, 2, " > div > span.info", cmpLexiInsDesc), "Column 2 descending");
});
有一个在PhantomJS 1.x中一个罕见的错误为:nth-child()
CSS选择器。您可以尝试使用其在CasperJS通过辅助函数支持XPath选择:
var x = require('casper').selectXPath;
...
casper.getElementsInfo(x("//table[@id='tableId']//tr["+rowIndex+"]/td["+colIndex+"]/span/span"));
注意CasperJS是建立在PhantomJS之上,并具有相同的限制。您不能直接在页面上下文外部处理DOM元素(casper.evaluate()
)。您需要事先获得这种元素的表示。我通过访问从getElementsInfo()
返回的对象上的text
属性来执行此操作。
否则我们也可以使用sort()作为递升和反向()来降序。没有设置任何标准获取内容并使用sort()函数对它进行排序并将其存储在变量中。现在设置一些标准并获取这些内容并将其存储在另一个变量中。现在比较两个变量。 –