首页 » 软件开发 » Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本),自动化测试pom。

Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本),自动化测试pom。

落叶飘零 2024-07-24 01:48:35 软件开发 0

扫一扫用手机浏览

文章目录 [+]

一、前言

二、环境准备

1. 下载安装Node.js

Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本) Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本) 软件开发
(图片来自网络侵删)

2. 切换镜像源

3. 下载Puppeteer

Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本) Puppeteer自动化测试简易入门教程(一)(测试函数自动化执行脚本) 软件开发
(图片来自网络侵删)

三、第一个脚本

1. 建立项目

2. 新建示例脚本

3. 优化代码

4. 执行脚本

一、前言

Puppeteer是Google推出的一款用作自动化测试/爬虫的一个Node.js的库,它的功能非常强大,测试人 员、前端工程师、爬虫工程师都可以使用,不过它只能在Chrome/Chromium上运行。
这里,我将用三 篇文章的篇幅来简单介绍下Puppeteer的安装、运行和在自动化测试领域中的简单应用。

需要注意的是,读者需要有一定的JS编码基础和ES6基础,相关语法本简易教程不会解释得特别细,但会贴 出相关链接供读者参考。

另外本教程所使用的操作环境基于Windows 10。

二、环境准备1. 下载安装Node.js

访问https://nodejs.org/,下载并安装最新版即可。
完成后打开CMD输入 node -v 显示如下即表示安装成 功:

2. 切换镜像源

安装好Node.js之后会自动安装好npm,我们就可以使用npm来下载安装Puppeteer,开始之前我们先把npm 的镜像源从国外切换至国内以加快下载包的速度: npm config set registry http://registry.npmmirror.com ,然后输入 npm get registry 进行确认:

3. 下载Puppeteer

在cmd中输入 npm install puppeteer --ignore-scripts 来安装Puppeteer,这后面的 --ignore-

scripts 参数的意思是跳过下载Chrome步骤,在这里我建议是在本地下载好Chrome浏览器,之后测试脚本 里指定浏览器路径来使用就行了。

等待下载完成后,我们就可以写代码了~

三、第一个脚本1. 建立项目

创建一个文件夹作为工作目录,用VScode打开它,然后新建一个Terminal:

在Terminal中输入 npm init 创建Node.js项目。
创建过程会有一系列的交互性步骤,一路回车下去即可。
创 建好之后工作目录下多出了个package.json文件:

2. 新建示例脚本

工作目录下新建一个JS文件,然后从Puppeteer官网

(https://pptr.dev/api/puppeteer.puppeteernode#example)上复制示例代码到该文件中:

3. 优化代码

将上文的示例代码改为以下内容:

const puppeteer = require('puppeteer');

//遵循CommonJS规范,Node.js中广泛使用,也可以不改

(async () => {

const browser = await puppeteer.launch({//启动浏览器 headless: false,

//改为非无头模式,即执行代码的过程中可以看到浏览器界面

executablePath:

`C:\\Users\\Tinux\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe`

//指定本地Chrome浏览器路径,这里需要注意的是所有复制过来的“\”需要再加一个“\”来转义

});

const page = await browser.newPage();//新建新页面

await page.goto('https://www.baidu.com');//访问百度首页 await browser.close();//关闭浏览器

})();

本段代码(async开始)是一段立即执行函数,简单说就是这段函数无需调用,定义即执行,它的格式是:

(function () {

console.log('此为立即执行函数');//此处是函数体

})();//再跟一对小括号即为立即执行

另外,这个函数是一个async函数,async是asynchronous的简写,意为异步。
async函数体中的每句语句都 必须加上await形成配套,具体原因各位测试工程师可以不用去深究,总之就是这是一种简化异步函数的写 法,可以让异步代码像同步代码一样执行,就像在写Java或Python一样,可读性更强。
如果想要研究相关语法,可以先参考这个教程:https://www.runoob.com/js/js-promise.html,然后可以看 一些介绍异步、Promise、回调函数之类的书面或视频资料,结合起来去理解效果会更好。

4. 执行脚本

在Terminal中执行 node .\example.js ,可以看到Chrome浏览器已经被调起,并且执行完脚本后将自动关 闭:

可以看到上图中的页面区域很小,这是默认Puppeteer给到的浏览器页面尺寸大小,如想改动可以使用

setViewport 方法,修改宽度和高度即可:

const page = await browser.newPage(); await page.setViewport({

width: 1920,

height: 1080,

});

相关文章