[Feature] create context in fullscreen mode

[star-kashyap]

How to launch browser.newContext() or browser.newPage() in fullscreen ? There is no way to pass full-screen via options while calling browser.newContext(options).

[aesyondu]

I'm not sure what you mean. Currently the default is:

browser.newConext({
  viewport: {
    width: 800, // 1280 in commit 1ee6578
    height: 600, // 720 in commit 1ee6578
  }
})

If I understood correctly, you were expecting that viewport width and height will automatically be set to your current desktop/laptop's viewport?

[star-kashyap]

I am talking about this new cognito window size, which I am launching by context.newPage(). Viewport is visible area which is visible on device, however browser window size is different. Opening new browser window in full screen size is my concern. How to launch it in full screen. Passing viewport do not help.

[pavelfeldman]

I know that the user can maximize the browser window and I know that the page can request full screen mode via the web api. But I'm not sure user can create a new full screen page.

Could you share more about your use case?

[star-kashyap]

Sorry, my bad. My point is user maximize browser window. How can we get it done ? Before context.newPage(), I am getting context by browser.newContext(). Can we get new context in fullscreen mode ?

[pavelfeldman]

My point is user maximize browser window

If you call browser.newContext({ viewport: null }), it would tell Playwright to not emulate certain device size and will follow the browser size when maximized. Is that what you are looking for?

[aesyondu]

Before the viewport: null I'm getting:

width: 800 height: 600

which is expected of course, since that is the default. I tried the browser.newContext({ viewport: null }) and now I'm getting:

width: 1200 height: 610

Which does take the whole size of the browser, but the browser itself is not full screen. For reference, my full screen browser should measure:

{width: 1280, height: 721}

Side Note: not sure why there is an extra 1 pixel height, I used this method on an about:blank page:

{
  width: document.documentElement.clientWidth,
  height: document.documentElement.clientHeight
}

[star-kashyap]

@arjun27 What do you think here ?

[arjunattam]

Synced offline with @star-kashyap to understand this better. Due to DRM constraints, the tests are executed in headful mode. A small browser window impacts verifiability of execution, and looks suboptimal to an observer.

While it is possible to use something like --start-fullscreen or --window-size as args to launch a browser, it is not possible to enlarge the size of a new window launched with newContext. Combination of enlarged window size and viewport: null would fix this.

[pavelfeldman]

I think launching with args: ['--window-size=1280,720'] and using viewport: null should bring you close to where you want to be. But that would be Chromium-specific solution. Non-chromium you should run with viewport: { width: 1280, height: 720 }.

Please feel free to reopen if there is something else we can do for you here!

[pavelfeldman]

Reopening as a feature request.

[chaganiu]

+1 for this.

[alex-popov-tech]

interested also

[ravisdream]

Browser maximize issue is resolved for me with below lines of code. Depending on your screen resolution, you may adjust your window position and view port width and height values:

browser = playwright.chromium.launch(args=['--window-position=-5,-5'],headless=False) context = browser.new_context(viewport={'width':1600,'height':900})

[LongLiveY96]

interested also, especially in Firefox.

[lakshmanp21]

+1

[splurgeop]

+1

[rai-gaurav]

+1

[shtlrs]

+1

[etale-cohomology]

In Python, you can do:

from playwright.sync_api import sync_playwright
import tkinter

root        = tkinter.Tk()
root_ndim_x = root.winfo_screenwidth()
root_ndim_y = root.winfo_screenheight()

with sync_playwright() as p:
  browser = p.firefox.launch(headless=True)
  context = browser.new_context()

  page = browser.new_page()
  page.goto('http://example.com')
  page.set_viewport_size({'width':root_ndim_x/1,'height':root_ndim_y/1})

[asolera]

This worked for me:

from playwright.sync_api import sync_playwright
import time

p = sync_playwright().start()
browser = p.chromium.launch(args=['--start-maximized'], headless=False)
page = browser.new_page(no_viewport=True)
page.goto('https://www.google.com')
time.sleep(3600)

Upvoted this issue aswell 👍

Credits/thanks to @pavelfeldman (https://giters.com/microsoft/playwright-python/issues/585)

[AlexBravo95]

It is necessary, up

[ManikandanMani]

Hi All, I am using playwright with nunit version 1.22 for dotnet 6, Trying to maximize chromium browsers (chromium, chrome,edge) by these approach BrowserTypeLaunchOptions args: --start-maximized,--window-position=-5,-5 & BrowserNewContextOptions: ViewportSize = null, ViewportSize = new ViewportSize() { Width = 1920, Height = 1080 } but cannot able to maximize browser to fullscreen, can anyone share how to maximize browser.

[Treshch1]

@pavelfeldman Trying the code below I get the next browser picture on the Mac Code:

from playwright.sync_api import sync_playwright
import time

p = sync_playwright().start()
browser = p.chromium.launch(args=['--start-maximized'], headless=False)
page = browser.new_page(no_viewport=True)
page.goto('https://www.google.com')
time.sleep(3600)

Browser displaying:

Do you see the same picture after running this code?

[Vanilton18]

from playwright.sync_api import sync_playwright import tkinter

root= tkinter.Tk() root_ndim_x = root.winfo_screenwidth() root_ndim_y = root.winfo_screenheight()

browser = sync_playwright().start().chromium.launch(headless=False, args=["--window-position=-5,-5"]) context = browser.new_context(viewport={'width': root_ndim_x/1, 'height': root_ndim_y/1}) page = context.new_page() page.goto("https://google.com")

[nicostubi]

+1 => needed

[ManikandanMani]

Hi, I couldn't launch ms-edge browser in full screen mode, tried setting the viewport height and width & null along with --start-maximized in launch options in playwright config file, but still launches the browser in half sized.

[AppcenterAucxis]

I see quite a lot of solutions to open the browser in maximized mode but no working solution to put the chrome browser in fullscreen mode (F11). How can this be achieved?

[kputyra]

I've solved this problem (in Python) by using launch_persistent_context() instead of launch() and tweaking the arguments a little but. This change prevents opening pages in new windows.

from playwright.sync_api import sync_playwright as spl

pwt = spl().start()
browser = pwt.chromium.launch_persistent_context(
    # Required (emtpy string means a temporary profile)
    user_data_dir="",
    headless=False,
    # This hides the annoying infobar "Chrome is being controlled by automated test software",
    # but it may break some functionality of playwright
    ignore_default_args=["--enable-automation", "--no-startup-window"],
    # Also possible: --start-fullscreen
    args=["--kiosk"],
    no_viewport=True
)
page = browser.new_page()
page.goto("https://google.com/")

# Check that JavaScript can be evaluated despite removing --enable-automation
print(page.evaluate("location.href"))
print(page.evaluate("document.body.textContent = 'Hello world!'"))
dimensions = page.evaluate('''() => {
        return {
            width: document.documentElement.clientWidth,
            height: document.documentElement.clientHeight,
            deviceScaleFactor: window.devicePixelRatio,
        }
    }''')
print(dimensions)

I've removed the default flag --enable-automation in order to hide the annoying infobar "Chrome is being controlled by automated test software". This is likely to break some features of playwright, but for me all that is important is to communicate with the page using JavaScript, which seems fine.

Cons:

• I don't know if this code works with other browsers as well.
• You cannot change the context in which pages are opened.

[ssv-w32]

+1, I find this feature very useful.

[gs-vchauhan]

+1 => absolutely required

[ManiMozaffar]

do we have some solution for firefox apart from hardcoding the size? willing to see one!

[dron4ik86]

This worked for me:

from playwright.sync_api import sync_playwright
import time

p = sync_playwright().start()
browser = p.chromium.launch(args=['--start-maximized'], headless=False)
page = browser.new_page(no_viewport=True)
page.goto('https://www.google.com')
time.sleep(3600)

Upvoted this issue aswell 👍

Credits/thanks to @pavelfeldman (https://giters.com/microsoft/playwright-python/issues/585)

This solution in working good for me, thanks!

[imbdb]

For some tests we needed fullscreen mode but I was not able to get it working. After embarrasing count of hours I figured out that Playwright exposes the underlying CDP Session and we can use it to make the window fullscreen. This works in chromium

  const client = await page.context().newCDPSession(page);
  // get window id from CDP session
  const { windowId } = await client.send("Browser.getWindowForTarget");
  await client.send("Browser.setWindowBounds", {
    windowId: windowId,
    bounds: { windowState: "fullscreen" },
  });

I don't know of any side effects this might cause, will update here if found any.

[cybairfly]

@imbdb You know your way around! Nice of you to share.

[craitose]

For some tests we needed fullscreen mode but I was not able to get it working. After embarrasing count of hours I figured out that Playwright exposes the underlying CDP Session and we can use it to make the window fullscreen. This works in chromium

  const client = await page.context().newCDPSession(page);
  // get window id from CDP session
  const { windowId } = await client.send("Browser.getWindowForTarget");
  await client.send("Browser.setWindowBounds", {
    windowId: windowId,
    bounds: { windowState: "fullscreen" },
  });

I don't know of any side effects this might cause, will update here if found any.

Yeah, I needed to test the full screen button on a web app but apparently playwright does not allow full screen to be triggered through events as it might interfere with accessibility of elements while the browser is full screen. You code snippet was the only way that allowed me to force full screen after the button was clicked.

[AbhineetSharmax]

For some tests we needed fullscreen mode but I was not able to get it working. After embarrasing count of hours I figured out that Playwright exposes the underlying CDP Session and we can use it to make the window fullscreen. This works in chromium

  const client = await page.context().newCDPSession(page);
  // get window id from CDP session
  const { windowId } = await client.send("Browser.getWindowForTarget");
  await client.send("Browser.setWindowBounds", {
    windowId: windowId,
    bounds: { windowState: "fullscreen" },
  });

I don't know of any side effects this might cause, will update here if found any.

I just made a little change to this configuration and this may help you get what you want to achieve. Try it out.

bounds: { windowState: 'maximized' },

Also, this is my playwright.config.ts projects: [ { name: 'chromium', use: { // ...devices['Desktop Chrome'], headless: false, launchOptions: { args: ['--auth-server-allowlist="*"'] }, viewport: null, } },

[nir-tal-talkspace]

wrote a blog post on how to resolve this issue when using playwright + python + pytest fixtures: https://www.linkedin.com/pulse/test-automation-maximizing-browser-window-playwright-nir-tal-c24hf/