启动Puppeteer时窗口出现空白边框，如何去除或判断是否为正常现象？

启动Puppeteer时出现的空白边框效果如下：

该空白边框不属于正常现象，通常是Puppeteer默认视口配置、Chrome启动参数的窗口大小/位置设置不匹配导致的，可通过以下方案解决：

• 方案1：调整启动配置，适配窗口和视口
  启动Puppeteer时关闭默认视口限制，同时明确设置窗口尺寸和位置，参考代码如下：

  const browser = await puppeteer.launch({
    headless: false,
    // 关闭Puppeteer默认的固定视口，自动适配窗口大小
    defaultViewport: null,
    args: [
      // 按需修改宽高数值，匹配你需要的窗口尺寸
      '--window-size=1920,1080',
      // 设置窗口从屏幕左上角开始展示，消除偏移导致的空白边
      '--window-position=0,0',
      '--no-first-run',
      '--no-default-browser-check'
    ]
  })
  

• 方案2：启用无边框/精简窗口模式
  如果需要完全消除浏览器工具栏和外围边框，可以在上述args参数中追加--kiosk参数直接启动全屏无边框模式，或者追加--app=你要访问的页面地址启动极简应用窗口，彻底消除多余边框。
• 方案3：清除页面默认边距
  如果是页面内容周围存在空白边，可在页面加载后注入样式清除浏览器默认边距：

  await page.addStyleTag({
    content: 'body { margin: 0; padding: 0; }'
  })
  

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