一、简介

https://github.com/GoogleChrome/puppeteer

Puppeteer是一个Node库,它提供了一个高级API来控制DevTools协议上的 Chrome或Chromium 。

Puppeteer 默认运行无头,但可以配置为运行完整(非无头)Chrome或Chromium。

我能做什么?
您可以在浏览器中手动执行的大多数操作都可以使用Puppeteer完成!以下是一些可以帮助您入门的示例:
  • 生成页面的屏幕截图和PDF。
  • 抓取SPA(单页面应用程序)并生成预渲染内容(即“SSR”(服务器端渲染))。
  • 自动化表单提交,UI测试,键盘输入等。
  • 创建最新的自动化测试环境。使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中运行测试。
  • 捕获站点的时间线跟踪,以帮助诊断性能问题。
  • 测试Chrome扩展程序。

适用范围:

  目前仅支持chrome浏览器,不支持其他如IE、firefox等。

二、环境搭建

1)由于是nodejs的一个库,首先需要安装nodejs.我下载的是最新的10.13.0,安装一直下一步到最后。

https://nodejs.org/zh-cn/

这里安装路径选到D盘,D:\Program Files\nodejs

安装完毕在命令行输入以下命令测试是否安装成功,正确会出现版本号

npm -v

2)改变原有的环境变量

(1)我们要先配置npm的全局模块的存放路径以及cache的路径,例如我希望将以上两个文件夹放在NodeJS的主目录下,便在NodeJs下建立"node_global"及"node_cache"两个文件夹,输入以下命令改变npm配置

npm config set prefix "D:\Program Files\nodejs\node_global"
npm config set cache "D:\Program Files\nodejs\node_cache"

3)在系统环境变量添加系统变量NODE_PATH

输入路径D:\Program Files\nodejs\node_global\node_modules,此后所安装的模块都会安装到改路径下

4)安装淘宝npm(cnpm)

(1) 输入以下命令

npm install -g cnpm --registry=https://registry.npm.taobao.org

(2)添加系统变量path的内容

  因为cnpm会被安装到D:\Program Files\nodejs\node_global下,而系统变量path并未包含该路径。在系统变量path下添加该路径即可正常使用cnpm。

(3) 输入cnpm -v输入是否正常

cnpm -v

5)安装puppeteer

执行如下命令,安装成功后会在D:\Program Files\nodejs\node_global\node_modules下看到puppeteer目录。

cnpm i puppeteer -g

6)npm相关命令

npm安装模块
【npm install xxx】利用 npm 安装xxx模块到当前命令行所在目录;
【npm install -g xxx】利用npm安装全局模块xxx; 本地安装时将模块写入package.json中:
【npm install xxx】安装但不写入package.json;
【npm install xxx –save】 安装并写入package.json的”dependencies”中;
【npm install xxx –save-dev】安装并写入package.json的”devDependencies”中。
npm 删除模块
【npm uninstall xxx】删除xxx模块;
【npm uninstall -g xxx】删除全局模块xxx; 已安装模块查看
npm ls -g --depth 0 //查看全局模块 depth 0 深度为0,可以根据需求改变深度
npm ls --depth 0 //查看当前命令所在目录

puppeteer(一)环境搭建——新Web自动化工具(同selenium)的更多相关文章

  1. puppeteer(二)操作实例——新Web自动化工具更轻巧更简单

    一.入门实例 了解puppeteer见上一篇文章: https://www.cnblogs.com/baihuitestsoftware/p/9957343.html 1)本例主要是启动浏览器 con ...

  2. Web自动化工具对比

    首先说一下我对Web自动化测试与CS自动化测试的认识.从宏观对比都是通过脚本自动化完成功能的验证,区别不大.Web测试更为显著的浏览器兼容性.安全,以及与Web技术相关的表单测试.链接测试等,其实都是 ...

  3. web自动化工具-开篇

    web自动化工具-开篇 最近几年,前端技术风一样的速度迭代更新,各种框架工具雨后春笋般涌现,作为一个平凡的开发者,也只能在洪流中沉沉浮浮,微不足道,以前前端叫做切图仔.美工,如今改了称号叫前端工程师, ...

  4. web自动化工具-liveStyle

    web自动化工具-liveStyle LiveStyle. The first bi-directional real-time edit tool for CSS, LESS and SCSS主要用 ...

  5. web自动化工具-livereload

    web自动化工具-livereload livereload是一个很神奇的工具,主要解放了F5键,监听文件变动,整个页面自动刷新.可搭载gulp等构建工具使用.和liveStyle 针对样式文件相比, ...

  6. web自动化工具-Browsersync

    web自动化工具-Browsersync browser-sync才是神器中的神器,和livereload一样支持监听所有文件.可是和livereload简单粗暴的F5刷新相比,browsersync ...

  7. 谁能告诉我如何通过Jenkins完成分布式环境搭建并执行自动化脚本

    ​今天我们接着昨天的内容,看一看如何完成Jenkins分布式环境的搭建和使用,因为我之前也是自己一个人摸索的,如果有不对的地方,请各位看官私信指出. 新增分布式部署节点 在系统管理/节点管理中点击新建 ...

  8. harbor环境搭建及web使用

    概述 Habor是由VMWare公司开源的容器镜像仓库.事实上,Habor是在Docker Registry上进行了相应的企业级扩展,从而获得了更加广泛的应用,这些新的企业级特性包括:管理用户界面,基 ...

  9. java环境搭建与安装开发工具全教程

    当前端的后台搭档是做java后台时,这时就需要自己搭建一个java开发环境,和安装eclipse了. 那么,一般这些开发环境在一个开发团队中是统一的.正规完善的公司还会有自己软件库和安装配置文档.这时 ...

随机推荐

  1. HTTP缓存及其合理使用

    以前以为HTTP缓存是个简单的事,项目中遇到后才发觉关于缓存实践有挺深的学问. from几篇文章详见: 使用 HTTP 缓存:Etag, Last-Modified 与 Cache-Control 合 ...

  2. 【转】Flask入门之上传文件到服务器

    #Sample.py # coding:utf-8 from flask import Flask,render_template,request,redirect,url_for from werk ...

  3. is not in the sudoers file解决方法

    用sudo时提示"xxx is not in the sudoers file. This incident will be reported.其中XXX是你的用户名,也就是你的用户名没有权 ...

  4. 【AI】神经网络基本词汇

    neural networks 神经网络activation function 激活函数hyperbolic tangent 双曲正切函数bias units 偏置项activation 激活值for ...

  5. puppet(2)-资源介绍

    puppet- 资源介绍: 类型.属性与状态同实现方式分离.仅指定目标状态 type {'title': attribute => value, ... } 查看支持的资源类型: puppet ...

  6. fidder(介绍)

    处处用到网络抓包 “君子生非异也,善假于物也”,要做好测试很多时候光靠自己是远远不够的,还要会利用测试工具协助测试,这样才能事半功倍. 测试工具多种多样,会在本系列中一一介绍,今天着重介绍网络抓包工具 ...

  7. plsql中文乱码

    一.关于PLSQL无法正确显示中文 刚才下载安装了PLSQL Developer 9.0.0.1601 汉化绿色版,执行SQL查询语句,发现显示的数据中只要有中文都会以?表示. 原因:客户端跟服务器的 ...

  8. mac shell 获取ip,自动启动文件http服务

    因为工作原因,时常有文件传输需求. rz.nc.rsync都用过,各有各的好处. 但相对的,向别处推文件时总有各种麻烦,尤其是在给同事发送文件时. 然后就想到了提供http服务. 在环境变量中定义别名 ...

  9. elk-(七)

    最终架构确定为  logs--->blieb--->redis/kafka--->logstash--->es--->kibana 注意:  geoip下载地址: wge ...

  10. vue中嵌套页面 iframe 标签

    vue中嵌套iframe,将要嵌套的文件放在static下面: <iframe src="../../../static/bear.html" width="300 ...