Rayrun
← Back to Discord Forum

How do I prevent the Webkit browser from zooming in automatically?

I'm using the Vscode extension and have the Webkit browser open with Playwright, but every website seem to get zoomed in automatically in this browser. I can't seem to zoom out either.

Screenshot_2023-07-26_171652.png

This thread is trying to answer question "How do I prevent the Webkit browser from zooming in automatically?"

0 replies

Answer

Sure, you can control the zoom level in the WebKit browser using Playwright's deviceScaleFactor option. This option is part of the BrowserType class and it specifies the device scale factor or device pixel ratio (DPR).

Here's how you can use it:

const { webkit } = require('@playwright/test');

(async () => {
  const browser = await webkit.launch();
  const context = await browser.newContext({
    viewport: { width: 800, height: 600 },
    deviceScaleFactor: 0.8 // Set a value less than 1 to zoom out
  });
  
  const page = await context.newPage();
  await page.goto('https://ray.run');
})();

In this code, we're launching a new instance of the WebKit browser using webkit.launch(). Then, we create a new context with a specified viewport size and set the deviceScaleFactor option to control the zoom level.

By setting deviceScaleFactor to a value less than 1 (e.g., 0.8), you are effectively reducing the zoom level and displaying more content on the screen.

Remember, this solution is specific to Playwright's integration with WebKit browsers like Apple Safari. It may not work for other browsers or frameworks. If you need more help, don't hesitate to ask!

Related Discord Threads

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.