首页
学习
活动
专区
圈层
工具
发布

Puppeteer介绍

Puppeteer是什么 Puppeteer是一个Node库,它提供了一个高级API来通过DevTools协议控制Chromium或Chrome。...可以使用Puppeteer来自动化完成浏览器的操作,官方给出的一些使用场景如下: 生成页面PDF 抓取 SPA(单页应用)并生成预渲染内容(即“SSR”(服务器端渲染)) 自动提交表单,进行 UI 测试...,键盘输入等 创建一个时时更新的自动化测试环境,使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中执行测试 捕获网站的timeline trace,用来帮助分析性能问题 测试浏览器扩展...与Selenium比较 说起浏览器自动化操作,很容易联想到另一个自动化框架:Selenium。...await page.focus('#kw'); // 给搜索框输入关键字 await page.keyboard.type('Java开发'); // 按回车键

1.7K20

如何将开发流程工具化,躺着把代码写了

BrowserContext:定义了一个浏览会话,可以拥有多个Page。 Page:至少有一个Frame:主框架。可能存在由iframe或框架标签创建的其他帧。...Electron Electron 可以让你使用纯 JavaScript 调用丰富的原生(操作系统) APIs 来创造桌面应用。...然后通过 executablePath 指定一个本地的 chrome 的启动路径,可以在设置里面修改(一般 chrome 的路径是固定的),这样使用本地的 chrome 来跑,不用连 chrome 一起打包进去...工具箱中工具有两种触发方式,一键触发和定时任务触发,比如每两周都自动列一下可用的会议室,然后准备好邮件,只需要确认下信息,然后点发送就可以自动订会议室,有的工具不需要定时功能。...过程中的一些坑 不得不说,electron 的坑是真的多,我简单列一下几个重要的。

1.1K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    实战派 | AI摸爬滚打之Win7+docker安装PaddlePaddle全纪实

    看来,是贫穷限制了我的想象力。 于是,作为没基础、没经验、没背景、也没颜值的一只AI小白,我也定下了一个小目标,那就是玩转AI大法,坐拥百万年薪,走上人生巅峰。...不同的电脑进入BIOS的方式可能有所差别,大体分为以下几步: 1)开机时,按下快捷键进入BIOS。 不同电脑的快捷键略有不同,一般为F2、F12、DEL、ESC、Enter等键。...这里需要在开机刚出现Dell、ThinkPad等界面时就按下键,可以按下开机键后,就一直按对应的键,但需要注意一旦进入BIOS界面,第二次按Enter等键,则会退出BIOS,正常开机。...而我ThinkPad的PC按照屏幕显示的按下esc,却进入了一个神奇的界面,显示video BIOS shallowed,换了F2、F12、DEL几个键,一直无法进入BIOS,直到维修店帮我按下enter...在容器中输入 paddle version 如下图结果,显示PaddlePaddle已安装好,可以使用了。 这里PaddlePaddle测试与安装参考了win7 32位系统下安装paddle。

    1.8K10

    Puppeteer 爬虫框架入门

    这时,Puppeteer 就能派上用场了。它是一个 Node.js 库,可以用来操作 Chrome 浏览器。 Puppeteer 中文释义是提线木偶,意思我们可以很方便地通过操纵它来控制浏览器。...在终端中运行以下命令: npm install puppeteer 注:建议用最新版本的 Node 使用 Puppeteer 爬取网页 让我们来看一个简单的例子。...1、使用 puppeteer.launch() 方法来打开浏览器,然后使用 browser.newPage() 方法创建一个新页面。...3、接下来,我们使用 page.type(selector, text) 方法来在搜索框中输入关键词 “Puppeteer”,然后使用 page.keyboard.press(key) 方法来模拟按下回车键...5、最后,使用 browser.close() 方法来关闭浏览器。 小结 使用 Puppeteer 可以非常方便地爬取网页并获取所需的数据。

    93000

    复制黏贴上传图片和跨浏览器自动化测试

    Experiences in IE11 IE 11 中需要使用 hack 的方法来获取粘贴板中的图片数据 hack 的实例可以去 这里 看下, 要使用 IE 11 浏览器哦, 目前能找到的在线编辑器支持..., Windows 操作系统下可以使用 C# 加上 .net 框架和操作系统的剪切板交互, 可以看下我的尝试 github.com/Jiang-Xuan/… github.com/Jiang-Xuan/...写了测试用例, 我就有理由相信是浏览器出了问题, 所以后续我对 copy-logo-to-clipboard 写了 测试用例 来保证这个模块是正确的 第三步, 按下 ctrl+v 在按下 ctrl+v...selenium 操作的浏览器的请求, 在 puppeteer 中可以通过监听 page.on('request') 事件来拦截和 mock 请求 // 来自: https://pptr.dev/#?...的这种功能, 可以 mock 一个服务器, 然后在 selenium 环境中请求 mock 的服务器, 我手动实现了一个 mock-server, 提供的功能仅仅满足该测试的需求, 详情可以去项目仓库看细节

    1.5K10

    网站性能测试利器:Puppeteer

    所有的例子都是在本地运行的,但如果你不想这么做的话,你还可以使用live demo,网址是https://vue-hn.now.sh.简单地用我的例子http:// localhost:8080替换为https...puppeteer.launch()在无头模式下创建新的浏览器实例,接下来的browser.newPage()可以通过创建新的标签来识别。...但是,如果度量标准已准备就绪,我们可以制定一个解决方法来检查每个时间点: testPage.js async function testPage(page) { // ... // await...我举上面的例子只是为了引出一个简单的例子。下面的代码通过在一个promise中包含page.on(’metrics’,callback)来解决这个问题,并使用了async/await的特性 。...在下面的代码中,我只展示提取CSS文件的开始和结束网络请求时间。

    5.7K130

    干货 | 基于 BDD 理念的 UI 自动化测试在携程度假的应用

    在解释这之前,我要先给大家演示一个朴素的 BDD-UI-Testing 自动化用例。 我们使用一个大家都很熟悉的 ToDoList APP 来带大家进入 BDD-UI-Testing。...在 GitLab CI 上使用并行模式,加快测试速度(充分榨干服务器性能) 参考 Cucumber-CLI 文档 我们可以使用 --parallel 来指定并行数量...因此这二者可以更好的结合,并且更加方便在浏览器中调试。 更简单的拦截网络请求(可以更加方便的 Mock 接口等) 5.2 我可不可以使用 Selenium ? 当然可以!...甚至你可以不使用 JavaScript 来编写。Cucumber 这款 BDD 自动化测试框架支持多种编程语言,你可以挑选任意你喜欢的语言去与 Selenium 进行组合。...5.3 BDD-UI-Testing 只适用 Web 端吗 ?

    3.3K21

    使用浏览器自动化框架开发了一款多平台自动发布工具——万媒易发

    作为一名充满热情的开发者,我一直在追求更高效的工作方式。近期,我成功地利用浏览器自动化框架Puppeteer和node.js,自主开发了一款强大的多平台自动发布工具——万媒易发。...初始化Puppeteer在代码中,我初始化了Puppeteer,启动了一个浏览器实例:const puppeteer = require('puppeteer');async function initPuppeteer...模拟用户操作通过Puppeteer,我可以模拟用户在浏览器中的各种操作,比如点击按钮、输入表单等。...通过与【万媒易发】的集成,我可以更方便地管理多个社交媒体平台上的账号,并一键同步发布内容,提高了整体的工作效率。...如果你也是一个内容创作者或开发者,想要提高发布效率,不妨尝试一下使用Puppeteer和node.js打造的自动发布工具【万媒易发】的强大功能,让你的自媒体运营更上一层楼!

    73121

    实现一个 Code Pen:(六)云函数生成网页缩略图

    vercel 由于我使用的是 vercel 部署的,那么我们是否可以使用 vercel 来生成缩略图吗?...uniapp 由于我使用的云存储是 uniapp,那么我将尝试下 uniapp 的云函数。 本地尝试 于是我建立了一个云函数,然后在本地运行云函数。...但是我在阿里云官网找到了一篇文章 《Serverless 实战 —— 快速开发一个分布式 Puppeteer 网页截图服务》 按这篇文章讲述的是阿里云是支持 Puppeteer,由于 puppeteer...后来我又查到腾讯云云函数中内置了 puppeteer,可以在文档中找到,注意(nodejs 16)已经不支持 puppeteer 于是我又尝试了腾讯云函数,代码如下 const puppeteer =...以上就是本文全部内容,希望这篇文章对大家有所帮助,也可以参考我往期的文章或者在评论区交流你的想法和心得,欢迎一起探索前端。

    1.7K10

    Typora优化教程:如何使用回车键来实现「换行」而非「分段」(类似Obsidian)

    前言:首先在Typora中的默认设置中按一下 回车键 会实现「分段」操作(中间空一行)按一下 Shift+回车键会实现「换行」操作(中间不空行)效果如下图所示:分段分段分段换行换行换行我们的最终目标:按一下...回车键 会实现「换行」操作按一下 shift+回车键 会实现「分段」操作(更推荐按两下 回车键 来实现「分段」操作,非常好用)一些题外话,心急的话可以直接去看后面的教程:如果你只使用Typora来编写和上传文章...」操作的两行文字变为同一行(实时渲染模式下)二、安装软件「AutoHotkey」三、编写程序提示:手残党可以直接运行我分享的压缩包里的文件步骤:右键桌面,新建一个文本文件打开文件,输入下面的代码#IfWinActive...」)四、运行程序双击运行程序,即可生效该程序只对Typora生效,不影响其它应用的使用效果:按一下 回车键 会实现「换行」操作按一下 shift+回车键 会实现「分段」操作(更推荐按两下 回车键 来实现...「分段」操作,非常好用)五、设置开机自启动(可选)请参考下面的教程《Win10——如何设置开机自启动项》 - 温稚生 - 博客园六、唯一的Bug在使用中文输入法时如果你打出了一串英文,正常情况下按回车键就能把这串英文打出来但修改快捷键后

    30410

    盘点4个浏览器插件相关的.Net开源项目

    SharpBrowser 是一个用 C# 和 CefSharp 开发的全功能网页浏览器。它声称是最快的开源 C# 网页浏览器,渲染网页的速度比谷歌浏览器还快,因为其使用轻量级的 CEF 渲染器。...自定义上下文菜单:用户可以根据需要自定义浏览器的右键菜单。 品牌化与定制:可以轻松添加特定供应商的品牌标识、按钮或快捷键。 离线浏览:支持查看在线和离线网页。...脚本:执行Js代码/函数等; 3、操作Html页面:比如获取元素的属性、文本内容,插入、更改元素等; 4、模拟鼠标操作:模拟点击页面元素、双击页面元素、拖动页面元素等; 5、模拟键盘输入:输入文字、按下按键...该应用框架只具备基础功能,大家可以根据自己的需求,进行二次开发。 1、采用最新浏览器内核,保证Web的渲染。 2、支持多种窗口样式:原生、无边框、系统无边框、异形、Kisok窗体。...支持多线程,方便开发人员创建多个浏览器对象,并可以通过设定CookieContainer和UserAgent来模拟不同用户的操作,提升网页数据采集和速度。

    25300

    Puppeteer 初探

    Puppeteer是一个Node库,它提供了一个高级API来通过DevTools协议控制无头 Chrome或Chromium ,它也可以配置为使用完整(非无头)Chrome或Chromium。...你可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UI Test或者作为爬虫访问页面来收集数据。 为什么会产生Puppeteer呢?...Puppeteer能做什么? 你可以在浏览器中手动完成的大部分事情都可以使用Puppteer完成 比如: 生成页面的屏幕截图和PDF。 抓取SPA并生成预先呈现的内容(即“SSR”)。...创建一个最新的自动化测试环境。使用最新的的JavaScript和浏览器功能,直接在最新版本的Chrome浏览器中运行测试。 捕获您网站的时间线跟踪,以帮助诊断性能问题。...默认的页面大小为800x600分辨率,页面的大小可以通过Page.setViewport()来更改 实例二 创建一个PDF const puppeteer = require('puppeteer')

    3.1K20

    叮!您有一封来自Photoshop CC 2019的简历待查收

    又长大一岁的我拥有了更多的优秀特性 变得更加成熟、更智能、也更懂设计师了 更新后的我不但实现了更加简单的操作 还懂得借助人工智能 学习设计师的使用习惯 让我成为每个一个设计师独一无二的Ps好友 下面就让我来介绍一些有关于我的新技能和提升吧...现在 Photoshop CC 2019 可以通过隐藏参考点来实现实现更高效地裁切、转换、放置等操作。你只需要通过双击画布就可以进行编辑文本,变换图形,无需Enter键或单击选项栏等额外操作。...有我在,手残也能变“巧手”哦! 懒癌患者的必备:可用于轻松进行蒙版操作的图框工具 ? 在我的画布中,使用“图框工具”(点击K键) 就可以快速创建占位符图框或向其中填充图像。...除此之外,我还可以帮助你更轻松地替换图像,只需将图像置入图框中,简单的图像替换就完成了。你还可以将任意形状或文本转化为图框,并使用图像填充图框,图像可以自动缩放以适应大小需求。...1 按k键打开框架工具或在工具栏上寻找“小信封”样式符号 ? 2 单击&拖动创建框架 ? 3 从图库面板或计算机中拖放图像 ? 4 要在框架中尝试不同的图像,只需再次拖放即可 ?

    98310

    vscode如何多行同时编辑,vscode快速选中多行快捷键

    比如这里我用 showMap 来控制显示的组件,用来切换组件的按钮根据触发状态设计了不同的样式,这个样式是否触发是由 showMap 决定的,这个时候就有多行重复的代吗,比如::class="showMap...使用鼠标拖动选择一个矩形区域。 在选中的矩形区域内,每一行都会插入一个光标,您可以直接开始同时编辑。...这里有一点要注意噢,如果画一个矩形,然后输入,就会将这个矩形中的所有行都替换为你输入的内容(圈了几行就写几行一模一样的内容) 如果你只是在若干行同时写入,可以直接采用 Shift + Alt...有一种相近的快捷键,选中一行或者一块内容,然后使用快捷键 : Alt + Shift + ↑ / ↓,就能直接在选中的一行/一块内容下方/上方复制生成一模一样的内容。...点击搜索框左侧的“查找所有”按钮(或按下 Alt + Enter),VSCode 会自动在所有匹配项上添加光标。 直接编辑即可同时修改所有匹配内容。

    2.6K20

    Headless Testing入坑指南

    + CasperJS PhantomJS是一个无头的WebKit框架,它对外提供了JavaScript API来与WebKit框架进行交互。...安装phantomjs方法(Linux) 安装casperjs方法 下面是一个使用PhantomJS+CasperJS来进行无头测试的例子。...他可以辅助Nightmare更好的完成自动化测试。 将Nightmare和Mocha安装成开发依赖的方法: 下面是一个基于Nightmare和Mocha的例子: 这里我还使用到了断言库——chai。...它提供了一系列的高级别API来控制Headless Chrome。它和其他自动化测试框架一样,如PhantomJS和NightmareJS,不过它只适用于59+版本的Chrome。...安装Puppeteer的方法 下面的例子中,使用Puppeteer来对页面进行截屏。 下面的例子中,使用Puppeteer来对页面数据进行抓取。

    2.1K50

    我写了一个自动化脚本涨粉,从0阅读到接近100粉丝

    Puppeteer 是一个 Node 库,它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome。...Browser 实例可以拥有浏览器上下文。 BrowserContext 实例定义了一个浏览会话并可拥有多个页面。 Page 至少有一个框架:主框架。...默认是使用它自带的 chrome webdriver, 如果你想指定一个自己的 webdriver 路径,可以通过这个参数设置 slowMo number 使 Puppeteer 操作减速,单位是毫秒...args Array(String) 传递给 chrome 实例的其他参数,比如你可以使用”–ash-host-window-bounds=1024x768” 来设置浏览器窗口大小。...Frame 包含了一个执行上下文(Execution Context),我们不能跨 Frame 执行函数,一个页面中可以有多个 Frame,主要是通过 iframe 标签嵌入的生成的。

    94610
    领券