4K屏幕下如何启动Playwright并设置200% UI缩放？

直接在创建浏览器上下文（BrowserContext）时配置deviceScaleFactor参数为2即可对应200%的UI缩放，以下是各主流语言的实现示例：

Python 示例 #

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch(headless=False)
    # 设定200%缩放比例
    context = browser.new_context(device_scale_factor=2)
    page = context.new_page()
    page.goto("https://example.com")
    
    # 执行你的业务操作
    
    context.close()
    browser.close()

JavaScript/TypeScript 示例 #

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch({ headless: false });
  // 配置200% UI缩放
  const context = await browser.newContext({ deviceScaleFactor: 2 });
  const page = await context.newPage();
  await page.goto('https://example.com');
  
  // 执行你的业务操作
  
  await context.close();
  await browser.close();
})();

Java 示例 #

import com.microsoft.playwright.*;

public class PlaywrightScaleConfig {
  public static void main(String[] args) {
    try (Playwright playwright = Playwright.create()) {
      Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));
      // 设置200%缩放比例
      BrowserContext context = browser.newContext(new Browser.NewContextOptions().setDeviceScaleFactor(2));
      Page page = context.newPage();
      page.navigate("https://example.com");
      
      // 执行你的业务操作
      
      context.close();
      browser.close();
    }
  }
}

补充说明 #

• deviceScaleFactor的数值与缩放比例直接对应：1对应100%，2对应200%，可根据需求调整。
• 推荐在浏览器上下文层面配置该参数，而非浏览器启动阶段，这样能更灵活地为不同页面设置不同缩放比例。
• 如果需要自动匹配系统当前的UI缩放比例，可以通过读取系统的缩放设置动态赋值，不过直接指定2即可满足你的需求。

内容的提问来源于stack exchange，提问作者Rodrigo