如何为从div构建的表中特定行中的特定图标编写css / xpath选择器?

时间:2019-08-22 11:52:24

标签: selenium selenium-webdriver xpath css-selectors xpath-1.0

我正在尝试访问动态表中特定元素的“编辑”图标。

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的行中,我需要用于编辑图标的选择器。这个元素正在我的测试中创建,然后我需要单击“编辑”图标。在这种情况下,我永远都不知道元素的位置。

第183行中提供的HTML编辑图标 我试图通过类似这样的方式找到它:

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

但是它不起作用,并且我收到错误消息,表明选择器不正确。

4 个答案:

答案 0 :(得分:-1)

编辑您要表示的图标和文本不在一个div中,这是您的html模式:

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

我尝试使用containspreceding-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

答案 1 :(得分:-1)

您可以使用descendant XPath轴和contains()功能组合,例如:

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

参考文献:

继续考虑包括页面的HTML代码,而不是图像,获得全面答案的机会会大大增加

答案 2 :(得分:-1)

要相对于文本 AutomationFacility 1249.0 找到编辑 图标,可以使用以下Locator Strategy

  • 使用XPATH

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

注意:您需要为所需的 elementToBeClickable 诱导 WebDriverWait

答案 3 :(得分:-1)

尝试使用下面给出的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']