Showing posts with label Maximize Window in Playwright. Show all posts
Showing posts with label Maximize Window in Playwright. Show all posts

Maximize Window in Playwright




In Playwright, maximizing the browser window means opening the browser in such a way that it occupies the full available screen space of the operating system, similar to when a user clicks the maximize button on a normal browser window.

By default, when Playwright launches a browser, it opens in a standard viewport size (often 1280×720 or as configured). If the viewport is not specified, Playwright automatically applies its default dimensions. However, maximizing is not automatically done because Playwright is designed to provide predictable, controlled environments for automation rather than adapting to the current screen resolution.

(a) Maximizing the window is useful in scenarios such as:

(b) When testing applications that behave differently on full-screen layouts versus smaller viewports.

(c) When elements shift position or appear only in larger layouts (e.g., responsive designs).

(d) When ensuring that the UI is tested under real-world screen conditions, such as a user running the browser maximized.

Although there isn’t a direct "maximize" command in Playwright like in Selenium, the effect is usually achieved by setting the browser window size equal to the screen’s resolution. In essence, maximizing is about resizing the Playwright browser context to cover the full display area so that the tests replicate what an end user would see on a maximized browser.

In order to maximize window while using Playwright Java, you typically set the viewport size to match the screen size, since Playwright does not have a direct method like maximize() (as in Selenium). However, we can simulate maximization by:

  • Launching the browser in headful mode.
  • Fetching the screen dimensions.
  • Setting the viewport to full screen dimensions.






















Steps to Maximize Browser Window in Playwright Java:

  • Launch Playwright.
  • Start browser in headful mode (not headless).
  • Use setViewportSize() to simulate maximized window.














Java Code Example to Maximize Window in Playwright


import com.microsoft.playwright.*;

public class MaximizeWindowExample {
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
            // Launch the browser in headful mode (so we can see the window)
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));

            // Create a new browser context without a specified viewport size (will use system default)
            BrowserContext context = browser.newContext(new Browser.NewContextOptions().setViewportSize(null));

            // Create a new page
            Page page = context.newPage();

            // Navigate to a website
            page.navigate("https://example.com");

            // Optional: log current viewport size
            System.out.println("Viewport size: " + page.viewportSize());

            // Wait to see the maximized window
            page.waitForTimeout(5000); // 5 seconds

            // Close browser
            browser.close();
        }
    }
}


Explanation:

  • .setHeadless(false): Launches the browser in visible mode.

  • .setViewportSize(null): Instructs Playwright to use the full available screen size, which mimics maximizing.
  • page.waitForTimeout(5000): Allows you to see the effect before closing the browser.



Below is the difference between headed mode and headless mode

Headed Mode (UI Visible)

  • In this mode, the browser actually opens on your screen.
  • If you want a maximized effect, you need to set the window size equal to the system’s screen resolution (e.g., 1920×1080).
  • Since the browser is visible, you can truly replicate what happens when a real user clicks the maximize button.
  • This is often used for manual debugging, visual checks, or when testing UI behavior at full resolution.

Headless Mode (UI Hidden)

  • In headless mode, there’s no actual "window" being drawn on the screen.
  • The concept of "maximization" doesn’t really exist, since nothing is visible.
  • Instead, Playwright just renders pages in whatever viewport size you specify.
  • If you want the same conditions as a maximized window, you simply configure the viewport to match a full HD resolution (e.g., 1920×1080).

Suggested Posts:

1. Handle Alerts in Playwright
2. BrowserContext in Playwright
3. Playwright with JUnit
4. Handle IFrames in Playwright
5. Page Object Model in Playwright