聊一聊众 Webdrivers

WebDriver 是浏览器自动化工具。

主要的用途:

  1. 自动化测试
  2. 爬虫
  3. 网页截图

知名的:

  • Selenium
  • Puppeteer

浏览器这边的接口

浏览器的接口支持是关键。
其实我蛮想知道在没有 PhantomJS 和 Headless 浏览器之前,Selenium 是怎么弄的。
是自己维护了一个 Headless 浏览器,还是在一个完整的系统下,模拟键盘和鼠标的操作。

PS:我查到有一个叫做 HtmlUnit 的 Java 版无头浏览器项目,考虑到 Selenium 项目的 Java 背景,之前可能使用的这个。

PhantomJS

这个玩意儿必须说一下。
2011 的一个发布的一个 BSD 协议开源 Headless 浏览器,基于 WebKit (是否使用 V8 引擎?),C++ 编写。
和现在 Chrome、FireFox 的无头模式不一样的是,他是一个专门创造出来作自动化的浏览器,提供了一套 JS API。

随着主流浏览器 Chrome 和 FireFox 都宣布支持 Headless 和自动化之后,该项目淡出开发者视野了。

Headless 浏览器

https://en.wikipedia.org/wiki/Headless_browser

Selenium

https://www.seleniumhq.org/
https://github.com/SeleniumHQ/selenium

  • 2004 年,ThoughtWorks 的 Jason Huggins 开发了 Selenium,并开源了。
    • 早期用过的名字:Driven Selenium,Selenium B
    • 后来同一家公司的 Paul Hammant 加入,重构了项目,项目命名为:Selenium RC,RC 是 Remote Control 的意思。
      • 我的理解是,原来只支持本地调用,后来加入了 HTTP 调用。总之,这次架构调整的意义足以使 Jason Huggins 称 Paul 为项目的共同创始人。
  • 2005 年,Selenium 成立了委员会,负责协调开源项目的运作。
  • 2007 年,Selenium 项目创始人 Jason Huggins 转投谷歌,开始利用谷歌的力量继续开发 Selenium,同时 ThoughtWorks 开发了另一个项目 WebDriver。
    • 根据文档来看,Selenium 1.0 是在浏览器启动时注入 JS,从而提供一系列交互接口,然后使用者通过在页面上执行 JS 的方式实现自动化。
    • WebDrvier 调用浏览器驱动,直接参与页面互动。
  • 2009 年,Google 测试自动化大会之后,两个项目决定合并,叫做 Selenium WebDriver,又叫 Selenium 2.0。
  • 2012 年,WebDriver 开发者向 W3C 提交了工作草案,旨在使 WebDriver 使用的浏览器驱动接口成为技术标准。
    • 标准化的是 WebDriver 之前采用的 JsonWireProtocol 通讯协议 https://github.com/SeleniumHQ/selenium/wiki/JsonWireProtocol
    • 由于各浏览器的驱动程序实现都不一样,在标准化之前,Selenium 对各种驱动进行封装,提供统一 API
  • 2018 年,WebDriver API 成为正式的 W3C 技术标准:https://www.w3.org/TR/webdriver1/
  • 2019 年,Selenium 4 发布。

目前,Selenium 项目由以下四部分组成:

  1. Selenium IDE,浏览器插件,之前叫做 Selenium Recorder,估计是用来记录用户操作,然后回放。
  2. Selenium Client API,提供的 API,方便各种语言调用。
  3. Selenium WebDriver,主体。
  4. Selenium Grid,服务器,目的是为了支持大规模的并发运行。没用过,也估计用不到这么深入,不研究。

Puppeteer

https://pptr.dev/
https://github.com/GoogleChrome/puppeteer

可能有人会把他和运维工具 Puppet 弄混(我身边就有这样的人,笑哭)。

学英语
puppet ['pʌpɪt] 木偶,音同 papi 酱的 papi
puppeteer [pʌpɪ'tɪə] 木偶师,音同 papi 剃额

根据资料,这是 Google 开发的一个 Node 库,使用了 Chrome 调试协议(DevTools 协议)。

目前已知的缺陷是:

  1. 参考资料不够多(比 Selenium 少好多,连维基百科的词条都还没有建立)
  2. 仅支持 Chrome
  3. 没有官方 Python 库
    https://miyakogi.github.io/pyppeteer 当前版本 0.0.25

优点是:

  1. 和 Chrome 适配很好,能做针对 Chrome 上的所有操作,包括测试 Chrome 拓展
  2. 据说效率不错

关于 Puppeteer 和 Selenium 的区别,Puppeteer 自己这么说:

Selenium / WebDriver 专注于跨浏览器自动化; 它的价值主张是一个适用于所有主流浏览器的标准API。
Puppeteer 专注于 Chromium; 它的价值主张是更丰富的功能和更高的可靠性。

值得注意的是,Puppeteer 是自带浏览器的,安装时会安装绑定的 Chromium,可能是为了保证完全兼容。

非官方 Python 绑定:https://github.com/miyakogi/pyppeteer
文档:https://miyakogi.github.io/pyppeteer/reference.html

步骤

  • 启动浏览器
  • 创建浏览器上下文
  • 创建页面
browser = await launch()

选择器

  • Page.querySelector() / Page.J() -> 对应 Puppeteer 中的 .$
  • Page.querySelectorAll() / Page.JJ() -> 对应 Puppeteer 中的 .$$
  • Page.xpath() / Page.Jx -> 对应 Puppeteer 中的 .$x