1

I tried every tag to get this element but it not working any help on this.

WebElement filterSizeDropdown = driver.findElement(By.cssSelector("#maincontent > div > div > div.klevuLanding.klevuTarget.kuLEFTFilters.kuSearchResultsPageContainer.kuCategoryPageContainer > div > div > div > div.kuResultsListing > div > div > div > div > section:nth-child(2) > div:nth-child(1) > div.kuDropdown.kuDropItemsPerpage > div.kuDropdownOptions > div:nth-child(2)"));
filterSizeDropdown.click();

Here is my code.

The problem is that the dropdown menu is not wrapped in select options. I dont know how to get this item element. Can anyone give me some hints?

https://store.liverpoolfc.com/living?productListFilters=&productListPgNo=1 Here is the web page that I am testing (it is for university project), I need to get element of Size dropdown and click on some value :) Any help would appreciate

Prophet
  • 32,350
  • 22
  • 54
  • 79
loranni
  • 47
  • 1
  • 7
  • If you use the development mode / html inspector of your browser most of them have a feature that allows you to select an element in html and do "copy->xpath" or "copy->CSS selector" to get a selector. For example: https://stackoverflow.com/questions/41857614/how-to-find-xpath-of-an-element-in-firefox-inspector – OH GOD SPIDERS Dec 16 '22 at 09:29
  • I know that I tried with css selector, xpath, id, name but its not working, I mean its working in inspect element I get the yellow marked element but when I put in code it cant recognize the element – loranni Dec 16 '22 at 09:35

1 Answers1

2

On that page you need to hover over the drop-down div element to make the drop-down options presented. Then you are able to get the locators of presented options. Here I selected 9-10 size. Of cause before doing all this we need to close the cookies banner. The following code works:

driver.get("https://store.liverpoolfc.com/living?productListFilters=&productListPgNo=1");
WebdriverUtils.clickVisible(driver,By.id("onetrust-accept-btn-handler"));
WebElement dropDown = WebdriverUtils.waitForVisibilityOfElement(driver,By.xpath("//div[@class='kuFilterHead kuCollapse'][contains(.,'Size')]"));
Actions action = new Actions(driver);
action.moveToElement(dropDown).build().perform();
WebdriverUtils.clickVisible(driver,By.cssSelector("[data-optioncount='10'] [title='9-10'] .kuFilterIcon"));

The methods I used here are implemented as following:

public static boolean clickVisible(WebDriver driver, By locator, int timeout) {
    try {
        Wait<WebDriver> wait = new WebDriverWait(driver, timeout);
        wait.until(ExpectedConditions.visibilityOfElementLocated(locator)).click();
        return true;
    } catch (Exception e) {
        ConsoleLogger.error("Failed to click on element" + e.getMessage());
        return false;
    }
}
public static WebElement waitForVisibilityOfElement(WebDriver driver, By locator, int timeout) {
    try {
        Wait<WebDriver> wait = new WebDriverWait(driver, timeout);
        return wait.until(ExpectedConditions.visibilityOfElementLocated(locator));
    } catch (Exception e) {
        ConsoleLogger.error("Failed to find the element visible" + e.getMessage());
        return null;
    }
}

The result is:

enter image description here

Prophet
  • 32,350
  • 22
  • 54
  • 79