Playwright JS测试中如何向控制台发送执行命令

在页面上下文执行全局挂载的$gui对象方法，直接使用Playwright的page.evaluate()API即可，该API会将传入的逻辑放到浏览器真实页面环境中执行，可直接访问页面的window全局变量。

标准实现代码 #

// 1. 先走完登录流程，等待登录态生效、目标页面加载完成
await page.waitForSelector('.login-success-flag'); // 替换为你项目里登录成功的标识元素，也可以用waitForURL等判断方式
// 2. 等待页面对象挂载完成，避免调用时$gui还未初始化
await page.waitForFunction(() => typeof window.$gui !== 'undefined', { timeout: 10000 });
// 3. 注入执行模拟扫码的命令
await page.evaluate(() => {
  window.$gui.dispatch('callBarcodeHandler', '98783083');
});
// 4. 后续可加扫码结果的等待逻辑，比如等待扫码成功的弹窗、商品信息加载完成后再做断言

注意事项 #

• 动态传参不要直接拼接变量到evaluate的执行函数里，用参数透传的写法更安全，避免作用域问题：

  const mockBarcode = '98783083';
  await page.evaluate((barcodeVal) => {
    window.$gui.dispatch('callBarcodeHandler', barcodeVal);
  }, mockBarcode);
  

• 如果你的业务逻辑里$gui是在特定路由、特定组件渲染完成后才挂载的，一定要加对应的等待逻辑，不要登录跳转完立刻调用，否则大概率出现undefined报错
• 如果需要在每次页面刷新/跳转后都自动触发扫码逻辑，可以改用page.addInitScript()提前注入执行逻辑，常规单流程里单次触发用上面的page.evaluate()即可

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