Как написать селектор css/xpath для определенного значка в определенной строке таблицы, построенной из div?

Я пытаюсь получить доступ к значку «Изменить» для определенного элемента в динамической таблице.

HTML -

        <div class="fixedDataTableLayout_rowsContainer" style="height: 323px; width: 1882px;">
            <div class="fixedDataTableColumnResizerLineLayout_main fixedDataTableColumnResizerLineLayout_hiddenElem public_fixedDataTableColumnResizerLine_main" style="width: 0px; height: 325px; left: 0px;">
                <div class="fixedDataTableColumnResizerLineLayout_mouseArea" style="height: 325px;"></div>
            </div>
            <div class="fixedDataTableRowLayout_rowWrapper" style="width: 1882px; height: 48px; z-index: 1; left: 0px; top: 0px;">
                <div class="fixedDataTableRowLayout_main public_fixedDataTableRow_main fixedDataTableLayout_header public_fixedDataTable_header" style="width: 1882px; height: 48px;">
                    <div class="fixedDataTableRowLayout_body">
                        <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 48px; width: 0px; left: 0px;">
                            <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 48px; position: absolute; width: 0px; z-index: 2; left: 0px; top: 0px;"></div>
                        </div>
                        <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 48px; width: 1882px; left: 0px;">
                            <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 48px; position: absolute; width: 1882px; z-index: 0; left: 0px; top: 0px;">
                                <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 48px; width: 916px; left: 0px;">
                                    <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell cell-header text-center" style="height: 48px; width: 916px;">
                                        <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                            <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                <div class="public_fixedDataTableCell_cellContent">
                                                    <div class="sort-by ">Facility
                                                        <i class="fa fa-sort-undefined" style="margin-left: 3px; position: absolute; top: -3px;"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 48px; width: 866px; left: 916px;">
                                    <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell cell-header text-center" style="height: 48px; width: 866px;">
                                        <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                            <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                <div class="public_fixedDataTableCell_cellContent">
                                                    <div class="sort-by "># of rooms
                                                        <i class="fa fa-sort-undefined" style="margin-left: 3px; position: absolute; top: -3px;"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 48px; width: 100px; left: 1782px;">
                                    <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1" style="height: 48px; width: 100px;">
                                        <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                            <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                <div class="public_fixedDataTableCell_cellContent"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="" style="left: 0px; height: 48px;"></div>
                        <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 48px; width: 0px; left: 1882px;">
                            <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 48px; position: absolute; width: 0px; z-index: 2; left: 0px; top: 0px;"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div>
                <div class="fixedDataTableRowLayout_rowWrapper" style="width: 1882px; height: 60px; z-index: 0; transform: translate3d(0px, 48px, 0px); backface-visibility: hidden;">
                    <div class="fixedDataTableRowLayout_main public_fixedDataTableRow_main public_fixedDataTableRow_even public_fixedDataTable_bodyRow" style="width: 1882px; height: 60px;">
                        <div class="fixedDataTableRowLayout_body">
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 1882px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 1882px; z-index: 0; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;">
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 916px; left: 0px;">
                                        <div data="[object Object],[object Object],[object Object]" field="name" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell undefined" style="height: 60px; width: 916px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">uitestsfacility</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 866px; left: 916px;">
                                        <div data="[object Object],[object Object],[object Object]" field="roomCount" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 866px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">1</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 100px; left: 1782px;">
                                        <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 100px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">
                                                        <i class="fa fa-edit" data-tip="Edit Facility"></i>
                                                        <i class="fa fa-trash-o disabled" data-tip="Cannot be deleted due to rooms or devices belonged to this facility"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="" style="left: 0px; height: 60px;"></div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 1882px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="fixedDataTableRowLayout_rowWrapper" style="width: 1882px; height: 60px; z-index: 0; transform: translate3d(0px, 108px, 0px); backface-visibility: hidden;">
                    <div class="fixedDataTableRowLayout_main public_fixedDataTableRow_main public_fixedDataTableRow_highlighted public_fixedDataTableRow_odd public_fixedDataTable_bodyRow" style="width: 1882px; height: 60px;">
                        <div class="fixedDataTableRowLayout_body">
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 1882px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 1882px; z-index: 0; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;">
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 916px; left: 0px;">
                                        <div data="[object Object],[object Object],[object Object]" field="name" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell undefined" style="height: 60px; width: 916px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">testsearchfacility</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 866px; left: 916px;">
                                        <div data="[object Object],[object Object],[object Object]" field="roomCount" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 866px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">1</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 100px; left: 1782px;">
                                        <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 100px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">
                                                        <i class="fa fa-edit" data-tip="Edit Facility"></i>
                                                        <i class="fa fa-trash-o disabled" data-tip="Cannot be deleted due to rooms or devices belonged to this facility"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="" style="left: 0px; height: 60px;"></div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 1882px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="fixedDataTableRowLayout_rowWrapper" style="width: 1882px; height: 60px; z-index: 0; transform: translate3d(0px, 168px, 0px); backface-visibility: hidden;">
                    <div class="fixedDataTableRowLayout_main public_fixedDataTableRow_main public_fixedDataTableRow_even public_fixedDataTable_bodyRow fixedDataTableLayout_hasBottomBorder public_fixedDataTable_hasBottomBorder" style="width: 1882px; height: 60px;">
                        <div class="fixedDataTableRowLayout_body">
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 1882px; left: 0px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 1882px; z-index: 0; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;">
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 916px; left: 0px;">
                                        <div data="[object Object],[object Object],[object Object]" field="name" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell undefined" style="height: 60px; width: 916px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">AutomationFacility 1249.0</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 866px; left: 916px;">
                                        <div data="[object Object],[object Object],[object Object]" field="roomCount" class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 866px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">0</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="fixedDataTableCellLayout_main public_fixedDataTableCell_main" style="height: 60px; width: 100px; left: 1782px;">
                                        <div class="fixedDataTableCellLayout_wrap1 public_fixedDataTableCell_wrap1 text-cell text-center" style="height: 60px; width: 100px;">
                                            <div class="fixedDataTableCellLayout_wrap2 public_fixedDataTableCell_wrap2">
                                                <div class="fixedDataTableCellLayout_wrap3 public_fixedDataTableCell_wrap3">
                                                    <div class="public_fixedDataTableCell_cellContent">
                                                        <i class="fa fa-edit" data-tip="Edit Facility"></i>
                                                        <i class="fa fa-trash-o " data-tip="Delete Facility"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="" style="left: 0px; height: 60px;"></div>
                            <div class="fixedDataTableCellGroupLayout_cellGroupWrapper" style="height: 60px; width: 0px; left: 1882px;">
                                <div class="fixedDataTableCellGroupLayout_cellGroup" style="height: 60px; position: absolute; width: 0px; z-index: 2; transform: translate3d(0px, 0px, 0px); backface-visibility: hidden;"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Например. Мне нужен селектор для значка редактирования в строке для AutomationFacility 9341.0. Этот элемент создается в моем тесте, а затем мне нужно щелкнуть значок «Изменить» для него. В этом случае я никогда не знаю положение элемента.

В представленном значке редактирования HTML находится в строке 183. Я пытался найти его примерно так:

 $(byXpath("//*[text()='"+facilityName+"']/i[@class='fa fa-edit']")).click();

Но это не работает, и я получаю сообщение об ошибке, что селектор неверен.


person Mikhail Siekhin    schedule 22.08.2019    source источник
comment
Пожалуйста, уточните, что не работает. Вы получаете ошибку или неверный результат?   -  person jsheeran    schedule 22.08.2019
comment
не размещайте изображение html, выложите сам html, пожалуйста   -  person Lucas Wieloch    schedule 22.08.2019
comment
Под не работает я подразумеваю, что я не могу щелкнуть этот элемент и получить ошибку, что мой селектор неверен.   -  person Mikhail Siekhin    schedule 22.08.2019


Ответы (4)


Чтобы найти Edit значок относительно текста AutomationFacility 1249.0, вы можете использовать следующий Стратегия поиска:

  • Использование XPATH:

    //div[@class='public_fixedDataTableCell_cellContent' and contains(.,'AutomationFacility 1249')]//following::i[@class='fa fa-edit' and @data-tip='Edit Facility']
    

Примечание. Вам необходимо вызвать WebDriverWait для нужного элемента elementToBeClickable.

person DebanjanB    schedule 22.08.2019

Вы можете использовать потомка ось XPath и contains(), например:

//*[contains(text(), 'AutomationFacility')]/descendant::i[@data-tip='Edit Facility']

Использованная литература:

В будущем рассмотрите возможность включения HTML-кода страницы, а не изображения, шанс получить исчерпывающий ответ будет намного выше.

person Dmitri T    schedule 22.08.2019
comment
пытается использовать ваш xpath, но все еще получает ошибку «Элемент не найден». - person Mikhail Siekhin; 22.08.2019

Попробуйте использовать приведенный ниже xpath

//div[@class='fixedDataTableLayout_rowsContainer']//child::div[3]//child::div[1]//child::div[1]//child::div[1]//child::div[2]//child::div[1]//child::div[3]//child::div[1]//child::div[1]//child::div[1]//child::div[1]//child::i[@class='fa fa-edit']
person Zohair    schedule 22.08.2019

Отредактируйте значки и текст, которые вы имеете в виду, не в одном div, это ваш шаблон html:

div
   div
      text
   div
   div
      text
   div
   div
      edit icon you mean
    div
div

Я пытался использовать contains и preceding-sibling, например:

facilityName = "AutomationFacility 1249.0";

$(byXpath("//*[contains(@class,'fixedDataTableCell') and ./preceding-sibling::*[contains(@class,'fixedDataTableCell')]//div[contains(text(),'"+facilityName+"')]]//i[@class='fa fa-edit']")).click();

Попробуйте изменить значение facilityName на ожидаемое.

person frianH    schedule 22.08.2019
comment
Я никогда не знаю, какой номер будет у моего элемента, потому что в какой-то момент у меня может быть 10 или 15 строк, и если я всегда нажимаю [3], я нажимаю на неправильный элемент. - person Mikhail Siekhin; 22.08.2019
comment
пожалуйста, предоставьте HTML. - person frianH; 22.08.2019
comment
добавлен HTML в описание - person Mikhail Siekhin; 22.08.2019
comment
@MikhailSeekhin, я обновил код, попробуйте еще раз. - person frianH; 23.08.2019