Java Selenium Full Page Screenshots for Indian Ecommerce

Yes, you can take full-page screenshots in Java Selenium for Indian ecommerce websites like Flipkart, Amazon.in, and Myntra, but the standard WebDriver interface only captures the visible viewport. To capture the entire scrollable page, you need to combine Selenium with a tool like AShot, or use JavaScript scrolling and image stitching. This article explains the reliable methods, common pitfalls with infinite-scroll pages, and how to handle lazy-loaded images that are typical on Indian ecommerce sites.

Why Standard Selenium Screenshots Fall Short

The default driver.getScreenshotAs() method in Selenium captures only what is currently visible in the browser window. On a typical Indian ecommerce product listing page, which can be 5,000 to 20,000 pixels tall, this means you get just the top slice. The rest of the page—reviews, related products, footer links—is missing. This limitation exists because the WebDriver protocol was designed for viewport-level interaction, not document-level rendering.

For QA engineers and developers building automated visual regression tests, this is a major gap. You need the whole page to catch layout shifts, missing images, or broken sections that appear only after scrolling. Fortunately, there are two proven approaches to work around this in Java.

Method 1: AShot with WebDriverBackedSelenium (Recommended)

AShot is an open-source Java library built specifically for full-page screenshots. It works by taking multiple viewport screenshots, scrolling the page incrementally, and stitching them together into one image. It also handles the devicePixelRatio for high-DPI displays, which is crucial for mobile emulation tests.

Here is a minimal working example:

import ru.yandex.qatools.ashot.AShot;
import ru.yandex.qatools.ashot.Screenshot;
import org.openqa.selenium.WebDriver;
import javax.imageio.ImageIO;
import java.io.File;

WebDriver driver = new ChromeDriver();
driver.get("https://www.flipkart.com");
Screenshot screenshot = new AShot()
    .shootingStrategy(ShootingStrategies.viewportPasting(1000))
    .takeScreenshot(driver);
ImageIO.write(screenshot.getImage(), "PNG", new File("fullpage.png"));

The viewportPasting(1000) parameter sets the scroll delay in milliseconds between shots. A value of 500–1000 ms is usually enough for images to load. AShot automatically detects the full scrollable height and scrolls until the bottom. It also has a coordsProvider option for iframes, but for standard ecommerce pages, the default works fine.

Method 2: Manual JavaScript Scrolling and Stitching

If you cannot add AShot as a dependency, you can implement the same logic manually. The idea is to get the total page height, scroll step by step, capture each viewport, and then combine the images using Java’s BufferedImage class. This gives you full control but requires more code and careful handling of the scrollbar.

Here is a simplified outline:

1. Get the full scroll height using ((JavascriptExecutor) driver).executeScript("return document.documentElement.scrollHeight").
2. Get the viewport height using window.innerHeight.
3. Loop: scroll to each y position, wait for images to load, capture a screenshot, and append it to a final BufferedImage.
4. After the loop, write the final image to a file.

This approach works, but beware of the scrollbar itself. On Windows, the scrollbar takes up about 15–17 pixels, which can cause horizontal misalignment. A common fix is to temporarily set scrollbar-width: none via JavaScript before capturing, then restore it after.

Handling Infinite Scroll and Lazy Loading

Indian ecommerce sites heavily use infinite scroll and lazy loading to improve performance. Flipkart’s search results load new products as you scroll; Amazon.in loads images only when they enter the viewport. If you simply scroll to the bottom and capture, you may miss content that loads after the scroll event.

To handle this, you need to:

• Scroll to the bottom first, wait for the page to stabilise (e.g., 2–3 seconds), then scroll back to the top.
• After scrolling back, use a loop that scrolls down in small increments (e.g., 500 pixels) and waits for new elements to appear before capturing.
• For AShot, you can implement a custom ShootingStrategy that triggers a scroll event and waits for a condition, but a simpler trick is to set a longer viewportPasting delay and pre-scroll the page once.

Another issue is that some sites use the loading="lazy" attribute on images. These images only load when they are near the viewport. If you scroll too fast, the screenshot may capture blank boxes. The solution is to use the scrollIntoView JavaScript function on each image element before capturing, or to disable lazy loading by setting document.querySelectorAll('img[loading="lazy"]').forEach(img => img.loading = 'eager') at the start.

Common Problems and Fixes

Here are the most frequent issues you will encounter and how to solve them:

• Sticky headers and footers: These appear in every viewport screenshot, causing duplicated content in the stitched image. AShot has a shootingStrategy that can ignore fixed elements, but you can also hide them with JavaScript before capture.
• Variable page height: Some pages grow as you scroll (infinite scroll). AShot captures until the height stops changing, but you may need to set a maximum scroll count to avoid an endless loop.
• WebDriverException on scroll: If the page uses a shadow DOM or cross-origin iframes, the scroll command may fail. Use document.scrollingElement.scrollTop instead of window.scrollTo for better compatibility.
• Memory issues: A 20,000-pixel-tall screenshot can be 50+ MB in memory. Use ImageIO.write to stream to disk, and consider reducing the image quality or using JPEG if PNG is too heavy.

Choosing the Right Tool for Your Project

If you are already using TestNG or JUnit for your Selenium tests, AShot integrates cleanly. It is lightweight, has no extra browser dependencies, and works with Chrome, Firefox, and Edge. The manual stitching method is better if you need to customise the capture logic, such as skipping certain sections or adding watermarks.

For teams that need to run screenshots at scale, consider using a cloud-based service like BrowserStack or Sauce Labs, which offer built-in full-page screenshot APIs. However, these are paid services and may not be necessary if you are running locally.

Cost and Performance Considerations

AShot is free and open-source (MIT license). The main cost is the time it takes to capture—a 10,000-pixel page might take 10–15 seconds depending on network speed and page complexity. For CI/CD pipelines, this can add up. To reduce time, you can:

• Use a headless browser with --window-size=1920,1080 to speed up rendering.
• Disable images and CSS via Chrome options if you only need the layout.
• Run screenshots in parallel using a thread pool.

Memory usage is also a factor. A single full-page screenshot of a long Flipkart listing can be 100+ MB in RAM. Make sure your test runner has enough heap space (-Xmx512m or more).

Frequently Asked Questions

Does AShot work with Selenium 4?

Yes, AShot 1.5.4 and later are compatible with Selenium 4.x. You just need to add the dependency to your pom.xml and it works with the standard WebDriver interface.

How do I capture a full page screenshot on a page with infinite scroll?

You need to scroll to the bottom first, wait for content to load, then scroll back to the top and capture. For AShot, you can use a custom ShootingStrategy that scrolls and waits, or simply increase the viewportPasting delay to 2000 ms and hope the page stabilises. For reliable results, pre-load all content by scrolling to the bottom and waiting for a few seconds.

Why are my screenshots showing blank areas where images should be?

This is usually due to lazy loading. Images load only when they are near the viewport. Before capturing, use JavaScript to force all images to load: document.querySelectorAll('img').forEach(img => img.src = img.src) or set loading='eager'. Also, wait for the window.load event.

Can I take full page screenshots on mobile emulation?

Yes, but you need to set the device pixel ratio correctly. AShot automatically handles this if you use new AShot().shootingStrategy(ShootingStrategies.viewportPasting(1000)). On mobile, the page width is smaller, so the stitched image will be narrower, but the height will be correct.

Is there a way to capture only a specific section of the page?

Yes, AShot allows you to specify a coordsProvider with a custom rectangle. You can also use WebElement coordinates to capture just a product card or a banner. For manual stitching, you can crop the final image using BufferedImage.getSubimage().

What is the best scroll delay for AShot?

It depends on the page speed. For most Indian ecommerce sites, 500–1000 ms is sufficient. If you see incomplete images, increase the delay to 1500 ms. Too long a delay will slow down the test, so find a balance.

Related

• How to Choose a Shell and Run Commands in VS Code
• Can’t Open From Unidentified Developer? Fix It
• Scan Network Devices for Open Ports: A Practical Guide