how to access elements in popup window , cant access popup windows element (selenium Java )

Issue

so here is the senario, whenever I click add to bag there is a popup window with a button go-to bag, but somehow i am not able to access any element from this popup window I have tried locators but not able to access any of it , I am sharing my code and console error message, i have tried list elements also but it also didn’t worked.

driver.findElement(By.cssSelector("//a[normalize-space()='Single Arrow Slim Fit Sweatshirt in Cotton Blend']")).click();
            
            //  List<WebElement> elements = driver.findElements(By.className(".CartItem.MiniCartPopup.is-separate"));  
            //List<WebElement> elements = driver.findElements(By.xpath("//div[@id='MiniCart-items']/div")); 
            // System.out.println(elements.size()); 
            //System.out.println(driver.findElements(By.xpath("//*[@id='MiniCart-items']/div")).size());
            
            
            String kk = driver.findElement(By.cssSelector("a[aria-label='icon-bag'] span")).getText();
            System.out.println("the items on products are"+ kk);
            String comp=driver.findElement(By.linkText("Single Arrow Slim Fit Sweatshirt in Cotton Blend")).getText();
           
            System.out.println("the selected items have text" +comp); 

This is code of popup window which is not accessible during the normal window, but once it hovered then only its code can be inspected

 <div class="CartItem-content"><div class="CartItem-thumbAndBadge">
<a class="CartItem-pdpLink" href="/shop-off-white-single-arrow-slim-fit-sweatshirt-in-cotton-blend-for-men-215022969_22.html">
<img src="//ounass-prod1.atgcdn.ae/small_light(p=thmb,ch=158,cc=fafafa,of=webp)/pub/media/catalog/product/2/1/215022969_orange_in.jpg?1654148030.1771" alt="Single Arrow Slim Fit Sweatshirt in Cotton Blend">
</a>
</div>
<div class="CartItem-info"><h3 class="CartItem-brand"><a href="/shop-off-white-single-arrow-slim-fit-sweatshirt-in-cotton-blend-for-men-215022969_22.html">Off-White</a>
</h3>
<h4 class="CartItem-name"><a href="/shop-off-white-single-arrow-slim-fit-sweatshirt-in-cotton-blend-for-men-215022969_22.html">Single Arrow Slim Fit Sweatshirt in Cotton Blend</a></h4><div class="CartItem-attribute">
<span class="CartItem-attributeName">Colour</span>
<span class="CartItem-attributeValue">Orange</span></div>
<div class="CartItem-attribute"><span class="CartItem-attributeName">Size</span>
<span class="CartItem-attributeValue">S</span>
</div>
<div class="CartItem-attribute"><span class="CartItem-attributeName">Qty</span>
<span class="CartItem-attributeValue">1</span></div>
<div class="CartItem-badge"></div>
<div class="MessageShort display-flexAIC mt10-md" style="color: rgb(203, 32, 45);">
<svg width="12" height="12" viewBox="0 0 26 26" class="svg"><g stroke="#cb202d" class="svg-stroke"><circle cx="13" cy="13" r="12.5">
</circle>
<path d="M13 6.5V13l3 3"></path></g></svg>
<span class="ml5">Low in stock: only 1 left.</span>
</div>
<div class="CartItem-actionLinks"></div></div>
<div class="CartItem-priceAndRemove mlAuto">
<div class="CartItem-oldPrice">2,500 AED</div><div class="CartItem-currentPrice is-discounted">1,625 AED</div>
</div>
</div>

Solution

The reason its not able to access popup window is because after clicking on Add To Bag button the popup window takes some time to display.

You can wait for the popup to display or hover on the bag icon

Also on the line By.xpath("//*[@id='MiniCart-items']/div we are using the id property for MiniCart-items but is the classname not the id

Your solution would look like

// Click on Add To Bag
driver.findElement(By.className("AddToBag")).click();
WebDriverWait wait = new WebDriverWait(driver, 5);;
// Using wait to ensure the popup is displayed before searching for details from the popup
wait.until(ExpectedConditions.presenceOfElementLocated(By.xpath("//div[@class='Popup-content']")));
// Alternatively can hover on the bag icon to display the popup content
Actions actions = new Actions(driver);
actions.moveToElement(driver.findElement(By.cssSelector("a[class='Popup-iconLink has-product']"))).perform();
List<WebElement> elements = driver.findElements(By.xpath("//div[@class='CartItem MiniCartPopup is-separate']"));
System.out.println(elements.size());
System.out.println(driver.findElements(By.xpath("//div[@class='MiniCart-items']/div")).size());
// Click on GO To Bag
driver.findElement(By.className("CartTotal-viewBag")).click();

Answered By – Darshan Shah

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published