Click on a first table row

Question

I have the following Angular code:

<div class="ag-body-viewport ag-layout-normal ag-row-no-animation" ref="eBodyViewport" role="presentation">
            <div class="ag-pinned-left-cols-container ag-hidden" ref="eLeftContainer" role="presentation" unselectable="on" style="height: 50px;"><div role="row" row-index="0" aria-rowindex="2" row-id="0" comp-id="229" class="ag-row ag-row-focus ag-row-even ag-row-level-0 task-type-normal ag-row-position-absolute ag-row-first ag-row-last" aria-selected="false" style="height: 50px; transform: translateY(0px); " aria-label="Press SPACE to select this row."></div></div>
            <div class="ag-center-cols-clipper" ref="eCenterColsClipper" role="presentation" unselectable="on" style="height: 50px;">
                <div class="ag-center-cols-viewport" ref="eCenterViewport" role="presentation" style="height: calc(100% + 17px);">
                    <div class="ag-center-cols-container" ref="eCenterContainer" role="rowgroup" unselectable="on" style="width: 2037px; height: 50px;"><div role="row" row-index="0" aria-rowindex="2" row-id="0" comp-id="229" class="ag-row ag-row-focus ag-row-even ag-row-level-0 task-type-normal ag-row-position-absolute ag-row-first ag-row-last" aria-selected="false" style="height: 50px; transform: translateY(0px); " aria-label="Press SPACE to select this row."><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="1" comp-id="230" col-id="rowCheckbox" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 44px; left: 0px;  "><mobileweb-checkbox-selection-renderer _nghost-kgd-c22="" class="ng-star-inserted"><div _ngcontent-kgd-c22="" class="datex-checkbox"><i _ngcontent-kgd-c22="" class="icon ms-Icon ms-Icon--CheckboxCompositeReversed checked" hidden=""></i><i _ngcontent-kgd-c22="" class="icon ms-Icon ms-Icon--Checkbox unchecked"></i></div></mobileweb-checkbox-selection-renderer></div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="3" comp-id="231" col-id="expectedSourceLocationName" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 262px; left: 44px;  "><mobileweb-manual-allocation-renderer _nghost-kgd-c49="" class="ng-star-inserted"><div _ngcontent-kgd-c49="" fxlayout="row" fxlayoutalign="space-between stretch" id="manual-allocation-renderer-box" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-height: 100%;"><div _ngcontent-kgd-c49="" class="caption caption-compact" fxflex="auto" id="manual-allocation-renderer-caption" style="flex: 1 1 auto; box-sizing: border-box;">Warehouse_Modify-zone-shelf-1</div></div></mobileweb-manual-allocation-renderer></div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="4" comp-id="232" col-id="expectedSourceLicensePlateLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 139px; left: 306px;  "></div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="5" comp-id="233" col-id="materialLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-focus ag-cell-value" style="width: 163px; left: 445px;  ">Material_50881</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="6" comp-id="234" col-id="lotLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 608px;  ">53</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="7" comp-id="235" col-id="expectedPackagedAmount" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 109px; left: 708px;  ">150</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="8" comp-id="236" col-id="expectedPackagingName" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 817px;  ">Box</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="9" comp-id="237" col-id="vendorLotLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 125px; left: 917px;  ">53</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="10" comp-id="238" col-id="materialDescription" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 227px; left: 1042px;  ">Description_Material_50881</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="11" comp-id="239" col-id="expectedSerialNumberLookupCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 316px; left: 1269px;  "></div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="12" comp-id="240" col-id="materialName" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 152px; left: 1585px;  ">Material_50881</div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="13" comp-id="241" col-id="upcCode" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 100px; left: 1737px;  "></div><div tabindex="-1" unselectable="on" role="gridcell" aria-colindex="14" comp-id="242" col-id="expectedTargetShippingContainer" class="ag-cell ag-cell-not-inline-editing ag-cell-auto-height ag-cell-value" style="width: 200px; left: 1837px;  "></div></div></div>
                </div>
            </div>
            <div class="ag-pinned-right-cols-container ag-hidden" ref="eRightContainer" role="presentation" unselectable="on" style="height: 50px;"><div role="row" row-index="0" aria-rowindex="2" row-id="0" comp-id="229" class="ag-row ag-row-focus ag-row-even ag-row-level-0 task-type-normal ag-row-position-absolute ag-row-first ag-row-last" aria-selected="false" style="height: 50px; transform: translateY(0px); " aria-label="Press SPACE to select this row."></div></div>
            <div class="ag-full-width-container" ref="eFullWidthContainer" role="presentation" unselectable="on" style="height: 50px;"></div>
        </div> 

I tried to click on the table row using this code:

WebElement element = driver.findElement(By.cssSelector("div:not(.ag-hidden) > .ag-row-first"));
element.click();

But the code is not working. Do you know what is the correct way to implement this?

Answer 1

There are two more ways to click on an element please try these out - it might work

1. Using Action class
2. JavaScript Executor

*Also Wait for Table to load before these code

** Action Class

    Actions action = new Actions(driver);
    WebElement element = driver.findElement(By.xPath("//div[@role='row'][@row-index='0']/div"));
    action.moveToElement(element).click().perform();

** JavaScript Executor

WebElement element = driver.findElement(By.xPath("//div[@role='row'][@row-index='0']/div"));
JavascriptExecutor executor = (JavascriptExecutor)driver;
executor.executeScript("arguments[0].click();", element);