跳转到主要内容
版本:26.倍

使用和操纵

全球安装/拆卸异步测试环境api, Jest可以顺畅地工作傀儡师

使用Puppeteer生成测试文件的代码覆盖率目前是不可能的,如果您的测试使用eval美元页面。,页面。$ $ evalpage.evaluate因为所传递的函数在Jest的作用域之外执行。看看问题# 7962在GitHub上的一个解决方案。看看问题# 7962在GitHub上的一个解决方案。

使用jest-puppeteer预设#

Jest操纵木偶的人提供使用Puppeteer运行测试所需的所有配置。

  1. 首先,安装jest-puppeteer
yarn add—dev jest-puppeteer
  1. 在Jest配置中指定preset:
{
“预设” : “jest-puppeteer”
}
  1. 写您的测试
描述 ( “谷歌” , ( ) = > {
beforeAll ( 异步 ( ) = > {
等待 页面 转到 ( “https://google.com” ) ;
} ) ;
( '应该命名为谷歌' , 异步 ( ) = > {
等待 预计 ( 页面 标题 ( ) ) 解决了 toMatch ( “谷歌” ) ;
} ) ;
} ) ;

不需要加载任何依赖项。不需要加载任何依赖项。操纵木偶的页面浏览器类将自动公开

看到文档

没有jest-puppeteer预设的自定义示例#

你也可以从零开始勾搭木偶师。基本思路是:基本思路是:

  1. 使用全局设置启动并文件puppeteer的websocket端点
  2. 从每个测试环境连接到木偶师
  3. 使用全局拆卸关闭木偶师

下面是GlobalSetup脚本的一个示例

/ / setup.js
常量 fs = 需要 ( “fs” ) ;
常量 操作系统 = 需要 ( “操作系统” ) ;
常量 路径 = 需要 ( “路径” ) ;
常量 mkdirp = 需要 ( “mkdirp” ) ;
常量 傀儡师 = 需要 ( “操纵” ) ;
常量 DIR = 路径 加入 ( 操作系统 tmpdir ( ) , “jest_puppeteer_global_setup” ) ;
模块 出口 = 异步 函数 ( ) {
常量 浏览器 = 等待 傀儡师 发射 ( ) ;
//保存浏览器实例,以便我们稍后可以删除它
//这个全局变量只在teardown中可用,而在测试环境中不可用
全球 __BROWSER_GLOBAL__ = 浏览器 ;
//使用文件系统为测试环境公开wsEndpoint
mkdirp 同步 ( DIR ) ;
fs writeFileSync ( 路径 加入 ( DIR , “wsEndpoint” ) , 浏览器 wsEndpoint ( ) ) ;
} ;

然后我们需要为puppeteer定制测试环境

/ / puppeteer_environment.js
常量 fs = 需要 ( “fs” ) ;
常量 操作系统 = 需要 ( “操作系统” ) ;
常量 路径 = 需要 ( “路径” ) ;
常量 傀儡师 = 需要 ( “操纵” ) ;
常量 NodeEnvironment = 需要 ( “jest-environment-node” ) ;
常量 DIR = 路径 加入 ( 操作系统 tmpdir ( ) , “jest_puppeteer_global_setup” ) ;
PuppeteerEnvironment 扩展 NodeEnvironment {
构造函数 ( 配置 ) {
超级 ( 配置 ) ;
}
异步 设置 ( ) {
等待 超级 设置 ( ) ;
//获取wsEndpoint
常量 wsEndpoint = fs readFileSync ( 路径 加入 ( DIR , “wsEndpoint” ) , “use utf8” ) ;
如果 ( ! wsEndpoint ) {
错误 ( “wsEndpoint没有找到” ) ;
}
//连接到木偶师
全球 __BROWSER__ = 等待 傀儡师 连接 ( {
browserWSEndpoint : wsEndpoint ,
} ) ;
}
异步 拆卸 ( ) {
等待 超级 拆卸 ( ) ;
}
runScript ( 脚本 ) {
返回 超级 runScript ( 脚本 ) ;
}
}
模块 出口 = PuppeteerEnvironment ;

最后,我们可以关闭puppeteer实例并清理文件

/ / teardown.js
常量 操作系统 = 需要 ( “操作系统” ) ;
常量 路径 = 需要 ( “路径” ) ;
常量 rimraf = 需要 ( “rimraf” ) ;
常量 DIR = 路径 加入 ( 操作系统 tmpdir ( ) , “jest_puppeteer_global_setup” ) ;
模块 出口 = 异步 函数 ( ) {
//关闭浏览器实例
等待 全球 __BROWSER_GLOBAL__ 关闭 ( ) ;
//清理wsEndpoint文件
rimraf 同步 ( DIR ) ;
} ;

设置好所有的东西后,我们现在可以像这样编写我们的测试:

/ / . js
常量 超时 = 5000 ;
描述 (
' /(主页)' ,
( ) = > {
页面 ;
beforeAll ( 异步 ( ) = > {
页面 = 等待 全球 __BROWSER__ newPage ( ) ;
等待 页面 转到 ( “https://google.com” ) ;
} , 超时 ) ;
( “应无错误加载” , 异步 ( ) = > {
常量 文本 = 等待 页面 评估 ( ( ) = > 文档 身体 textContent ) ;
预计 ( 文本 ) toContain ( “谷歌” ) ;
} ) ;
} ,
超时 ,
) ;

最后,设置jest.config.js从这些文件中读取。(jest-puppeteer预设在引擎盖下做类似的事情jest-puppeteer预设在引擎盖下做类似的事情。)

模块 出口 = {
globalSetup : ”。/ setup.js ' ,
globalTeardown : ”。/ teardown.js ' ,
testEnvironment : ”。/ puppeteer_environment.js ' ,
} ;

这是代码完整的工作示例