。从微型的开始，到更大型的。绝对属于后一种。

Puppeteer宣传自己是

\

一个Node库，它提供了一组高级API，通过DevTools协议控制无界面Chrome。

\

简而言之，基于Chrome Devtools协议，Puppeteer可以让用户界面测试变得很轻松。而所有这一切都是免费的。

什么是Puppeteer？

是一个用户界面自动化工具。它通过使用Chrome无界面模式和DevTools协议的组合来实现这一点。正如上面的引用所言，它使用一个更上层的API来封装其功能，让用户界面测试自动化变得轻而易举。

人们基于开发了一系列Google Chrome工具。你在浏览器中点击更多工具 -\u0026gt;开发工具，打开的就是。DevTools协议是DevTools的动力基础，我们现在可以使用Chrome中的DevTools来做更多的事情。

是没有Chrome的Chrome。是的，你没看错。它允许你从浏览器之外的环境（即命令行）与Chromium进行交互。

将Chromium和渲染引擎带入命令行使得很多事情变得可行，比如自动化测试。

安装

安装很简单，可以通过或来完成。只需运行下面的命令：

\yarn add pupeeter\# or \"npm i puppeteer\"\

之后可以像其它nodejs程序一样用来运行。

创建截图

有时你想测试像CSS这样的东西，确保网站观感没有出现回退。

譬如，对我的博客进行截图：

\const puppeteer = require(\"puppeteer\");\(async() =\u0026gt; {\    const browser = await puppeteer.launch();\    const page = await browser.newPage();\    await page.goto(\"http://jackhiston.com/\");\    await page.screenshot({ path: \"jackhiston-blog.png\" });\    browser.close();\})();\

首先我们要引用puppeteer作为依赖包。有了这个，你可以一个浏览器实例，它实际上也可以在屏幕上加载浏览器，如下所示：

\const browser = await puppeteer.launch({ headless: false });

注意headless选项。

这样你就可以在浏览页面时创建一个全新的页面，然后你可以“”一个特定的网址（在这个例子里会转到我的主页）。

然后，我们可以使用内建的屏幕截图功能来保存页面截图。

爬取网页

另外一个应用场景是用Puppeteer爬取网站的内容。在下面的例子里，我将浏览骇客新闻并从第一页上取得所有新闻的链接：

\const puppeteer = require(\"puppeteer\");\(async() =\u0026gt; {\    const browser = await puppeteer.launch();\    const page = await browser.newPage();\    page.on(\"console\