Question

尝试使用量角器#JasmineJs查找元素时遇到一个小问题

我有这个元素：

<div class="x-editor x-small-editor x-grid-editor x-grid-cell-editor x-layer x-editor-default x-border-box" id="ext-comp-1325" style="right: auto; left: 338px; top: 51px; z-index: 19000; display: none;">
<table class="x-field x-table-plain x-form-item x-form-type-text x-field-default x-container-form-item" cellpadding="0" id="textfield-1324" style="table-layout: fixed; width: 79px;"><tbody><tr role="presentation" id="textfield-1324-inputRow" class="x-form-item-input-row">
<td role="presentation" id="textfield-1324-labelCell" style="display:none;" valign="top" halign="left" width="105" class="x-field-label-cell">
<label id="textfield-1324-labelEl" for="textfield-1324-inputEl" class="x-form-item-label x-unselectable x-form-item-label-left" style="width:100px;margin-right:5px;" unselectable="on">
</label>
</td>
<td role="presentation" class="x-form-item-body  " id="textfield-1324-bodyEl" colspan="3" style="width: 100%;">
<input id="textfield-1324-inputEl" type="text" name="orderConfigurationData_localTaxID" class="x-form-field x-form-text" autocomplete="off" aria-invalid="false" data-errorqtip="" style="width: 100%;">
</td>
</tr>
</tbody>
</table>
</div>

试图同时找到这两个文本字段（name =“ orderConfigurationData_localTaxID”）

CSS：

let reqelem = element(by.css("input[name='orderConfigurationData_localTaxID']"));
    browser.wait(protractor.ExpectedConditions.presenceOf(reqelem), 10000);   
    reqelem.isDisplayed().then(null, function(err) { 
      console.error("An error was thrown! " + err);
    });

和Xpath：

let reqelem = element(by.xpath("//input[@name='orderConfigurationData_localTaxID']"));
    browser.wait(protractor.ExpectedConditions.presenceOf(reqelem), 10000);   
    reqelem.isDisplayed().then(null, function(err) { 
      console.error("An error was thrown! " + err);
    });

但在两种情况下均以“ NoSuchElementError”结尾。由于该元素在dom中可用，因此如何检索它。

Snapshot of the DOM where the element is present

CSS错误：

An error was thrown! NoSuchElementError: No element found using locator: By(css selector, input[name='orderConfigurationData_localTaxID'])

Xpath错误：

An error was thrown! NoSuchElementError: No element found using locator: By(xpath, //input[@name='orderConfigurationData_localTaxID'])

Answer 1

定位器似乎很好。您能否检查页面中是否有iframe。

（或）

在browser.wait中增加最大时间超过10秒。

Answer 2

使用ExpectedConditions.visibilityOf代替

ExpectedConditions.presenceOf

该元素可能存在于DOM中但不可见。

Answer 3

好的。找到了引发NoSuchElementError的答案。

问题是，最初该字段不可编辑。在这一点上，字段/网格单元仍然是灰色的（仅对人眼有效，但实际上在后端不可用），这是表格元素。因此，用户必须单击字段/网格单元格（使其可编辑），以允许他/她输入值。

仅在首先单击相应的表格元素时，DOM才会生成上述元素标签。

下面是解决问题的代码。

//Click on corresponding tabular element first.

    element(by.xpath("//table/tbody/tr/td[contains(@class,'orderConfigurationData_localTaxID')]/descendant::div")).click();

//GridCell is editable now and we can pass the input.

    let reqelem = element(by.css("input[name='orderConfigurationData_localTaxID']"));
    browser.wait(protractor.ExpectedConditions.presenceOf(reqelem), 10000);   
    reqelem.isDisplayed().then(null, function(err) { 
    console.error("An error was thrown! " + err);
      });
    reqelem.sendKeys('56428');

无法识别量角器中的css / xpath元素

3 个答案: