Search code examples
node.jstypescriptautomationpopupwindowplaywright

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


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.


Solution

  • 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.