транспортир и XPath для навигации по DOM

Question

Я могу использовать cssContainingText() для поиска строки сетки, и принеси его идентификатор атрибута следующим образом:

this.getRowIdByText = function (text) { 
    var sel = '#theReport .ui-grid-viewport .ui-grid-canvas'; 
    var firstRow = element.all(by.css(sel)).first(); 
    var gridRows = firstRow.all(by.repeater('(rowRenderIndex, row) in rowContainer.renderedRows track by $index')); 

    var result = gridRows.all(by.cssContainingText('div', "COL 1, ROW 1 TEXT CONTENTS")).first(); 

    var parentId = result.all(by.xpath("./div")); // "./ancestor::div[starts-with(@id, 'id')]" 
return parentId.getAttribute("id"); 

, но теперь я хотел бы использовать некоторые xPath выражение для получения связанной строки данных с текстовым значением «МОЕ ЗНАЧЕНИЕ - COL2, ROW 1» и id = «1484316102519-0-uiGrid-0007-cell».

Вот пример DOM -

<div class="ui-grid-contents-wrapper"> 
 
    <div class="grid-menu-stuff">...</div> 
 

 
    <!-- LEFT-MOST COLUMNS --> 
 
    <div class="grid-container-left"> 
 
    \t <div class="grid-header">...</div> 
 
    \t <div role="rowgroup" class="ui-grid-viewport"> 
 
    \t  
 
    \t <div class="ui-grid-canvas"> 
 
    \t  \t <!-- HERE IS THE ROW REPEATER !!! --> 
 
    \t  \t <div ng-repeat="row in rowContainer.renderedRows"> 
 
    \t  \t <div ui-grid-row="row"> 
 
    \t  \t  <div class="ui-grid-cell"> 
 
    \t  \t  
 
    \t  \t   <!-- COL 1, ROW 1 --> 
 
    \t  \t   <div id="1484316102519-0-uiGrid-0006-cell"> 
 
    \t  \t    <div class="ui-grid-cell-contents" title="COL 1, ROW 1 TEXT CONTENTS"> COL 1, ROW 1 TEXT CONTENTS</div> 
 
    \t  \t   </div> 
 
    \t  \t   
 
    \t  \t  </div> 
 
    \t  \t </div> 
 
    \t  \t </div> \t 
 
    \t  \t <div ng-repeat="row in rowContainer.renderedRows"> 
 
    \t  \t <div ui-grid-row="row"> 
 
\t \t  <div class="ui-grid-cell"> 
 
\t \t  
 
\t \t   <!-- COL 1, ROW 2 --> 
 
\t \t \t <div id="1484316102519-1-uiGrid-0006-cell"> 
 
\t \t \t  <div class="ui-grid-cell-contents" title="COL 1, ROW 2 TEXT CONTENTS"> COL 1, ROW 2 TEXT CONTENTS</div> 
 
\t \t \t </div> 
 
\t \t  </div> 
 
    \t  \t </div> 
 
\t \t  \t  \t 
 
\t \t  \t  \t 
 
    \t  \t </div> 
 
    \t  \t <div ng-repeat="row in rowContainer.renderedRows"> 
 
\t \t  \t  \t 
 
    \t  \t </div> 
 
    \t </div> 
 
    \t  
 
    \t </div> 
 
    </div> 
 
    
 
    <!-- DATA ROWS --> 
 
    <div role="rowGroup" class="ui-grid-viewport"> 
 
     <div class="ui-grid-canvas"> 
 
     <div ng-repeat="row in rowContainer.renderedRows"> 
 
      <div ui-grid-row="row"> 
 
       <div ui-grid-row="row"> 
 
        <div ng-repeat="col in Columns" id="1484316102519-0-uiGrid-0007-cell">  
 
        <div class="ui-grid-cell-contents" title="MY VALUE - COL2, ROW 1">MY VALUE - COL2, ROW 1</div> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div> 
 
      
 
     <div ng-repeat="row in rowContainer.renderedRows"> 
 
\t  <div ui-grid-row="row"> 
 
\t \t <div ui-grid-row="row"> 
 
\t \t <div ng-repeat="col in Columns" id="1484316102519-1-uiGrid-0007-cell">  
 
\t \t  <div class="ui-grid-cell-contents" title="MY VALUE - COL2, ROW 2">MY VALUE - COL2, ROW 2</div> 
 
\t \t </div> 
 
\t \t </div> 
 
\t  </div> 
 
     </div> 
 
      
 
     </div 
 
    </div> 
 
</div>

я заметил, есть корреляция с генерацией Див идентификаторов, так что я мог бы, вероятно, лишить ID вниз и вывести его связанную ячейку данных ; однако, есть ли способ использовать xPath для получения связанного div?

Возможно, я ищу элемент для родства, но я не понимаю, как это сделать, используя выражения xpath.

Спасибо, Боб

Answer 1

Мое решение было очень специфичны пользовательский интерфейс сетки, так что, возможно, это поможет кому-то в будущем. Учитывая фрагмент из образца DOM выше, обратите внимание, что -1- представляет номер строки, -0006 это число Col:

<!-- COL 1, ROW 2 --> 
<div id="1484316102519-1-uiGrid-0006-cell"> 
    <div class="ui-grid-cell-contents" title="COL 1, ROW 2 TEXT CONTENTS"> COL 1, ROW 2 TEXT CONTENTS</div> 
</div> 

Я не могу сначала получить все строки ретранслятором:

var rows myGrid.all(by.repeater('...'));

Тогда посмотрите строку текстом:

var result = rows.all(by.cssContainingText('div', 'COL 1, ROW 2 TEXT CONTENTS')).first();

В моем случае, мне нужен первый родительский DIV для того, чтобы захватить id ATTRIB:

var parId = result.all(by.xpath("./div")); var myRowId parId.getAttribute)"id");

Теперь имея идентификатор строки, мне нужно, я извлечь номер строки, так что я могу получить доступ к данным строки Ui-сетки:

var rowId = myRowId.split('-')[1];

Теперь, наконец, я могу получить ряд данных:

var row = this.getDataRows().get(rowId); // getDataRows внутренняя к моей функции lib.

Как только у меня есть row, тогда я готов идти.

Я надеюсь, что это поможет кому-то в будущем.