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

Question

我有这段HTML代码

我正在使用 Testcomplete (Javascript) 定位按钮并尝试单击它。我认为这更多是关于我的 CSS path/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 帮助主题中的以下文本进行解释。

Result Value

If a TestComplete web object matches the specified selector, then the method returns this object.

If there is no matching TestComplete test object, the method returns the appropriate HTML object.

在您的情况下，第一个找到的对象 (var z = Page.QuerySelector(path2);) 没有相应的 TestComplete 对象，因此 HTML 对象是 returned。当您查询第二个对象 (var y = z.QuerySelector('div.blue');) 时，您实际上调用了本机 QuerySelector 方法，而不是可以 return 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();

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

CSS Selector Path - TestComplete Javascript Can't Click the Button

html

javascript

testcomplete

css-selectors