1、基础知识

  • puppeteer.launch() 创建浏览器实例
  • puppeteer.newPage() 创建一个新页面
  • puppeteer.goto() 进入指定网站
  • page.screenshot() 截屏
  • page.pdf() 输出为pdf 注意必须是headless=true
  • page.evaluate() 在浏览器中执行函数想到与在控制台执行函数 返回promise
  • page.waitFor(selectorOrFunctionOrTimeout[, options[, ...args]]) 等待 可以是等待一段时间,某个函数执行或某个DOM的出现
  • page.click(selector[, options]) 点击某个元素
  • page.type(selector, text[, options]) 文本输入
  • page.frames() 获取当前页面所有的 iframe,然后根据 iframe 的名字精确获取某个想要的 iframe
  • iframe.$(‘.srchsongst‘) 获取 iframe 中的某个元素
  • iframe.evaluate() 在浏览器中执行函数,相当于在控制台中执行函数,返回一个 Promise
  • Array.from 将类数组对象转化为对象
  • iframe.$eval() 相当于在 iframe 中运行 document.queryselector 获取指定元素,并将其作为第一个参数传递
  • iframe.$$eval 相当于在 iframe 中运行 document.querySelectorAll 获取指定元素数组,并将其作为第一个参数传递
  • page.emulate() 指定设备

2、配置文件

jest.config.js
module.exports = { preset: 'jest-puppeteer', //调用preset
// globals: _.assign({}, config.get('e2e'), { //这里可以注入全局变量
// ENV_URL: config.get('baseUrl')
// }),
testMatch: ['**/test/*.test.js?(x)'] //指定需要进行测试的文件
}
jest-puppeteer.config.js
const port = process.env.TEST_SERVER_PORT ?
Number(process.env.TEST_SERVER_PORT) : // console.log(port) process.env.TEST_SERVER_PORT = port module.exports = {
    exitOnPageError: false,//false忽略错误,true捕获错误(default)
    launch: {
headless: process.env.CI === 'true',
},
browserContext: process.env.INCOGNITO ? 'incognito' : 'default',
server: {
command: `cross-env PORT=${port} node test`,
port,
launchTimeout: ,
},
}
命令行 npm run test
"test": "cross-env INCOGNITO=true jest -c jest.config.js --notify --detectOpenHandles",

3、服务文件/test/index.js(static即测试文件)

const path = require('path')
const express = require('express') const app = express() app.use(express.static(path.join(__dirname, 'static')))
console.log(process.env.PORT) app.listen(process.env.PORT)

参考文章

https://jestjs.io/docs/en/using-matchers

puppeteer自动化测试的更多相关文章

  1. Puppeteer自动化测试cnode.js中文社区

    如果完全不了解puppeteer的朋友可以去看看我的这篇随笔:https://www.cnblogs.com/zlforever-young/p/11569890.html 开始之前需要了解的知识:E ...

  2. 令人惊叹的Chrome浏览器插件

    Chrome是一个简洁而又高效(高性能,高消耗)的浏览器.接下来让我吐血推荐一些常用的Chrome插件. 日常插件 uBlock Origin ----- 比Adblock性能更高的广告插件. Adk ...

  3. web前端自动化测试/爬虫利器puppeteer介绍

    web前端自动化测试/爬虫利器puppeteer介绍 Intro Chrome59(linux.macos). Chrome60(windows)之后,Chrome自带headless(无界面)模式很 ...

  4. 基于jest和puppeteer的前端自动化测试实战

    前端测试现状 经常听到后端同学说“单元测试”,前端写过测试用例的有多少?答案是:并不多,为什么呢?两个主要原因 1.前端属于GUI软件,浏览器众多,兼容问题让人头大,用户量有一定规模的浏览器包括: I ...

  5. Puppeteer前端自动化测试实践

    本篇内容将记录并介绍使用Puppeteer进行自动化网页测试,并依靠约定来避免反复修改测试用例的方案.主要解决页面众多时,修改代码导致的牵连错误无法被发现的运行时问题.文章首发于个人博客.对前端感兴趣 ...

  6. puppeteer UI自动化测试demo(一)

    一.简介 这个不大常见,比较常见的是selenium和weddriver: 所以就增加一个说明,来自官网的. Puppeteer 是一个 Node 库,它提供了一个高级 API 来通过 DevTool ...

  7. CukeTest+Puppeteer的Web自动化测试(一)

    CukeTest+Puppeteer的Web自动化测试 一.初识BDD.Cucumber(黄瓜).CukeTest 行为驱动开发(Behavior Driven Development,BDD).行为 ...

  8. Puppeteer - 谷歌推出的自动化测试工具库

    Puppeteer 是一个 Node 库,它提供了一个高级 API 来通过 DevTools 协议控制无头 Chrome 或 Chromium.它允许你从浏览器之外的环境(即命令行)与Chromium ...

  9. puppeteer:官方出品的chrome浏览器自动化测试工具

    puppeteer发布应该有一段时间了,这两天正好基于该工具写了一些自动化解决方案,在这里抛砖引给大家介绍一下. 官方描述: Puppeteer is a Node library which pro ...

随机推荐

  1. virsh 连接虚拟机 (vnc 或 控制台)

    第一种方式 1.如果虚拟机登录方式为VNC,在ubuntu机器上安装vncviewer 在虚拟机的配置xml中 <graphics type="vnc" autoport=& ...

  2. 玩转MongoDB

    一.主从复制 1)首先主从服务器在启动的时候,分别要设置master.slave选项,对于slave可以启动中设置源,也可以在启动后设置源. 如:主:mongod --dbpath=/data/mon ...

  3. 前端获取指定cookie

    前端获取指定cookie的值 function getCookie(cookiename){ var name = cookiename + "="; var cs = docum ...

  4. V1-bug Alpha阶段项目展示

    V1-bug Alpha阶段项目展示 团队成员简介 Name Summary Sefie wxmwy V1-bug制造公司资深工程师精通各种抱大腿方式团队吉祥物 182 面面俱到流派一丝不苟 Powe ...

  5. try-catch里面加了return后,finally还会执行吗?

    请看下面的方法,在我们的catch里面,捕获到了异常之后,我们的catch模块里面的语句,还会接着执行,当我们执行到return之后,我们不会立即返回,而是会接着执行finally块里面的代码,只有执 ...

  6. KafKa 启动

    Zookeeper 运行kafka需要使用Zookeeper,所以要先启动Zookeeper,如果没有Zookeeper,可以使用kafka自带打包和配置好的Zookeeper 1.进入kafka的b ...

  7. (转)Mysql数据库管理 表的维护

    原文:http://t.dbdao.com/archives/mysql%E6%95%B0%E6%8D%AE%E5%BA%93%E7%AE%A1%E7%90%86-%E8%A1%A8%E7%9A%84 ...

  8. MongoDB实战开发

    [目标]:本文将以实战的形式,向您展示如何用C#访问MongoDB,完成常见的数据库操作任务, 同时,也将介绍MongoDB的客户端(命令行工作模式)以及一些基础的命令. [说明]:MongoDB是什 ...

  9. Python数据类型(字符串)

    文章内容参考了教程:http://www.runoob.com/python/python-basic-syntax.html#commentform Python 字符串 字符串是 Python 中 ...

  10. 使用BeanUtils封装数据时数据类型的转换

    //获得表单数据 Map<String, String[]> properties = request.getParameterMap(); User user = new User(); ...