如何使用 Playwright 滚动到特定浏览器版本？

Question

我需要使用 Playwright 在不同的 Chromium 版本之间运行一些测试。我有不同版本的不同 Chromium 文件夹，但我不知道如何使用 CLI 从一个版本切换到另一个版本来运行我的测试。有帮助吗？谢谢:)

Answer 1

您可以在启动浏览器时使用

executablePath

参数来使用自定义可执行文件。请参阅此处。请注意，这仅适用于基于 Chromium 的浏览器，请参阅此处。

const playwright = require('playwright');

(async () => {
  const browser = await playwright.chromium.launch({
    executablePath: '/your/custom/chromium', 
    headless: false, // to see the browser
    slowMo: 4000 // to slow it down
  });
  // example for edge on msft windows 
  // executablePath: 'C:/Program Files (x86)/Microsoft/Edge/Application/msedge.exe',


  const page = await browser.newPage();
  await page.goto('http://whatsmyuseragent.org/');
  await page.screenshot({ path: `example.png` });
  await browser.close();
})();

此外，Playwright 仅针对最新的稳定版本进行测试，因此其他 Chromium 版本可能会出现错误行为。请参阅版本下的此处。

Answer 2

Max Schmitt 是对的：不保证该库可以与非捆绑的 Chromium 一起使用。不管怎样，你可以在

executablePath

中尝试一下多个基于Chromium的浏览器。由于它不是内置在剧作家测试中的，因此您需要自己实现它。

注意：这样你就失去了剧作家测试的一些简单性。

在我的示例中，我使用 Jest 作为测试运行程序，因此

yarn add --dev jest

是必需的。最后一个 CLI 参数（为浏览器版本保留）可以使用 Node 中的

process.argv.slice(-1)[0]

进行检索，这样您就可以告诉测试您要使用哪个浏览器版本。这里它们是

edge

、

chrome

，默认是捆绑的

chromium

。

MS Edge（铬）

yarn test chrome.test.js edge

铬

yarn test chrome.test.js chrome

Chromium（默认 - 与 Playwright 捆绑在一起）（但任何字符串，或缺少此参数也将将此作为默认值启动）

yarn test chrome.test.js chromium_default

chrome.test.js
（带有 Windows 特定的可执行路径）

const playwright = require('playwright')

let browser
let page

beforeAll(async function () {
  let chromeExecutablePath
  switch (process.argv.slice(-1)[0]) {
    case 'chrome':
      chromeExecutablePath = 'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe'
      break
    case 'edge':
      chromeExecutablePath = 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe'
      break
    default:
      chromeExecutablePath = ''
  }
  browser = await playwright.chromium.launch({ 
    headless: false, 
    executablePath: chromeExecutablePath 
  })
  page = await browser.newPage()
})

describe('Google Search', function () {
  test('should respond with HTTP 200 - OK', async function () {
    const response = await page.goto('https://google.com')
    const responseCode = response.status()
    expect(responseCode).toBe(200)
  })
  afterAll(async function () {
    await browser.close()
  })
})

Answer 3

在 playwright.config.ts 中，添加如下所示的启动选项。

  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'],
      launchOptions: 
      { 
headless: false, 
executablePath: "C:\\Users\\Admin\\AppData\\Local\\ms-playwright\\chromium-1134\\chrome-win\\chrome.exe" }
      

      },
    }
]