CSS选择器路径 - TestComplete Javascript无法单击按钮

Question

我有这段HT​​ML代码

我正在使用Testcomplete（Javascript）来定位按钮并尝试单击它。我认为这更多是关于我的CSS路径/ Javascript而不是TestComplete本身。

我尝试了这个代码，它工作正常

var path2 = "#Table > div > table > tfoot > tr > th:last-child > span > div";
var z = Page.QuerySelector(path2);
z.Click();   // Works Fine

我也试过这个，它工作正常

var path2 = "#Table > div > table > tfoot > tr > th:nth-child(7) > span > div";
var z = Page.QuerySelector(path2);
z.Click();  //Works Fine

但是当我尝试这个时，它找不到并单击按钮

var path2 = "#Table > div > table > tfoot > tr";   // path to parent table
var z = Page.QuerySelector(path2);
var y = z.QuerySelector('div.blue'); // Look for the child from that parent with tag div and class blue
Log.message(y.getAttribute("class"));  // Will return "button blue w-icon footer-add"
y.Click();  // Will return Javascript Runtime Error. y.Click is not a function

我不知道为什么如果我先找到父节点然后搜索它的子节点，Javascript将无法找到它并单击它？

Answer 1

可以通过QuerySelector Method (Page Objects) TestComplete帮助主题中的以下文本来解释此行为的原因。

结果值

如果TestComplete Web对象与指定的选择器匹配，则该方法返回此对象。

如果没有匹配的TestComplete测试对象，则该方法返回相应的HTML对象。

在您的情况下，第一个找到的对象（var z = Page.QuerySelector(path2);）没有相应的TestComplete对象，因此返回本机HTML对象。当您查询第二个对象（var y = z.QuerySelector('div.blue');）时，实际上调用的是本机QuerySelector方法，而不是可以返回TestComplete对象的TestComplete方法。因此，即使存在相应的TestComplete对象，您也可以获得第二个查询的结果。 Click方法附加到TestComplete对象，在使用本机HTML对象时不能使用它。

因此，在您的情况下，将长路径分成两部分的唯一选择似乎就是这样：

  var path2 = "#Table > div > table";
  var z = Page.QuerySelector(path2);
  var y = z.QuerySelector('tfoot > tr > th:last-child > span > div.blue');
  Log.message(y.getAttribute("class"));
  y.Click();