How to maximize a Popup window using Playwright (ex clicking a button to open Popup window)

Viewed 6980

The software I am testing has many popup windows / modal windows. The main page loginPage is opened in fullscreen mode. After clicking a button, a new popup (modal) window will be opened, eg. overviewPage

What I want to achieve is to change the viewport of this popup window, or better to maximize it, in this case is overviewPage

Here is my code:

const browser = await chromium.launch({
        args: ['--start-maximized'],
        headless : false, slowMo : 50});
const context = await browser.newContext({viewport : null});
const loginPage = await context.newPage();
await loginPage.goto(myURL.href);  //Login Page was opened in Maximized mode (Fullscreen)

// Next step is to click a button on Login Page, and a new page is opened.
await loginPage.click('#nextBtn');

console.log('Get page after a specific action (e.g. clicking a button');
const [overviewPage] = await Promise.all([
    context.waitForEvent('page')
]);
await overviewPage.waitForLoadState();
await overviewPage.screenshot({ path: `reportoverview.png` });
console.log('Current window: ' + await overviewPage.title());

The popup window overviewPage is opened but with a small viewport, and I don't know how to maximize it.

I already set the flag --start-maximized in the context, and it works for loginPage. How and where can I set the viewport for a Popup window.

I am using Playwright Version: v1.2.1.

2 Answers

I am able to set viewport of the popup window to my demand with setViewportSize

await overviewPage.setViewportSize({ width: 1920, height: 1080 });

It solved my problem.

//You can use setViewPortSize(int width, int height) in Java.
public static void main(String[] args) {

        Playwright playwright = Playwright.create();
        Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
        BrowserContext context = browser.newContext(new Browser.NewContextOptions().setViewportSize(1920, 1080));
        Page page = context.newPage();
        page.navigate("https://www.amazon.com/");
    }
 
//You can get the current screen dimensions as well:
Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
            int width = (int)screenSize.getWidth();
            int height = (int)screenSize.getHeight();
            System.out.println(width + " " + height);
            
            Playwright playwright = Playwright.create();
            Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
            BrowserContext context = browser.newContext(new Browser.NewContextOptions().setViewportSize(width,height));
            Page page = context.newPage();
              page.navigate("https://www.amazon.com/");
Related