[FIXED] how to dynamically identify which html element on a page

Issue

In my application page, have a web table with multiple rows and columns loaded dynamically based on the data added. In a one of the "td" the data will be sometimes a "p" tag or "button" tag (but will look like a link) based on the status of the account on that row. And also I need to click that button to do some additional action. Here i need to validate a case, need to take all the rows and columns data and store it. But while on this particular td, as it varies based on the account status, how can I dynamically check and take the status text like check if it is "button" or "p" control?

Table looks like below

Code for both the rows looks like (sammple)

<td class="Table2Cell account-list-cell va--middle pl--2" tabindex="0" style="width: 24%; min-height: 120px; max-height: 120px;">
    <div class="FlexBox FlexBox__direction FlexBox__direction--row FlexBox__justify--start">
        <div class="FlexItem FlexItem__align-self--top FlexItem__align-self--base-top">
            <svg class="Icon status-action Icon--rotate-0 Icon--size-small-tight" focusable="false" name="icon-alert-circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin-top: 2px;">
                <use xlink:href="/static/fonts/icons/icon-defs.svg#alert-circle"></use>
            </svg>
        </div>
        <div class="FlexItem FlexItem__align-self--center FlexItem__align-self--base-center">
            <div style="padding-left: 4px;">
                <button aria-disabled="false" aria-label="Upload Check Image" class="Button px--0 py--0 Button--link" formnovalidate="" type="button" style="min-height: 0px; line-height: 16px; margin-bottom: 5px; margin-top: 5px;">
                    <span class="Button__text Button__text--link">Upload Check Image</span>
                </button>
                <p class="text--dark text--small">Action Required
                </p>
            </div>
        </div>
    </div>
</td>

=============

<td class="Table2Cell account-list-cell va--middle pl--2" tabindex="-1" style="width: 24%; min-height: 120px; max-height: 120px;">
    <div class="FlexBox FlexBox__direction FlexBox__direction--row FlexBox__justify--start">
        <div class="FlexItem FlexItem__align-self--top FlexItem__align-self--base-top">
            <svg class="Icon status-verified Icon--rotate-0 Icon--size-small-tight" focusable="false" name="icon-checkmark-circle" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin-top: 2px;">
                <use xlink:href="/static/fonts/icons/icon-defs.svg#checkmark-circle"></use>
            </svg>
        </div>
        <div class="FlexItem FlexItem__align-self--center FlexItem__align-self--base-center">
            <div style="padding-left: 4px;">
                <p class="text--regular flex-grow--0">Verified</p>
                <p class="text--dark text--small">Status
                </p>
            </div>
        </div>
    </div>
</td>

any help on this?

Solution

Comma in css selectors button, p.text--regular return both or existing one element. Using the css selector you'll get button or p. Parent element should be a row element. Use it to get an element and check the tag.

WebDriverWait wait = new WebDriverWait(driver, 5);
WebElement statusElement = wait.until(ExpectedConditions.presenceOfElementLocated(By.cssSelector("button, p.text--regular")));

String tag = statusElement.getTagName();

Answered By - Sers