Puppeteer笔记(七):Puppeteer切换浏览器TAB页
一、Puppeteer切换浏览器TAB页
1、browser.pages()

二、上手实例Demo
功能测试:打开www.ly.com首页,定位搜索"苏州",获取新打开页面上的搜索结果的第一个名称,并在终端输出打印出来。下面列举了两种方法供参考。
const puppeteer = require('puppeteer');
async function tab() {
//创建一个Browser浏览器实例,并设置相关参数
const browser = await puppeteer.launch({
headless: false,
defaultViewport: null,
args: ['--start-maximized'],
ignoreDefaultArgs: ['--enable-automation']
});
//创建一个Page实例
const page = await browser.newPage();
await page.goto("https://www.ly.com", {
waitUntil: 'networkidle2'
});
const searchText = await page.$('#pt__search_text');
await searchText.type('苏州');
const searchBtn = await page.$('#pt__search_btn');
await searchBtn.click();
await page.waitFor(3000);
//方法一:browser.pages(),可以获取所有打开的Page对象,可以通过遍历或筛选找到自己想获取的Page对象
const newPage = (await browser.pages())[2];
//方法二:通过browser.waitForTarget获取target
const target = await browser.waitForTarget(t => t.url().includes('https://so.ly.com/hot'));
const newPage = await target.page();
//获取搜索结果列表页第一个标题的值,并输出终端
const newPageText = await newPage.$eval('div.search_list > ul > li:nth-child(1) > div > a > h3', ele => ele.innerText);
console.log('newPageText:' + newPageText);
//关闭浏览器
await browser.close();
}
tab();
注意点:方法一中browser.pages()定位页面时,遍历时注意页面是从0开始计数的。所以定位的是第2个页面。如下图所示。

以上参考代码运行结果如下

Puppeteer笔记(七):Puppeteer切换浏览器TAB页的更多相关文章
- chrome浏览器tab页内存占用变大,网站变慢为哪般?
问题概述: 公司做的是BS应用. 之前我们的后台服务器程序是带状态的,用ehcache存储登录状态:这两天被我改成了redis存储,应用本身不再存储登录状态. 然后自测,我在测试某个很耗时间的网页操作 ...
- 跨浏览器tab页的通信解决方案尝试
目标 当前页面需要与当前浏览器已打开的的某个tab页通信,完成某些交互.其中,与当前页面待通信的tab页可以是与当前页面同域(相同的协议.域名和端口),也可以是跨域的. 要实现这个特殊的功能,单单使用 ...
- 监听浏览器tab切换
监听浏览器切屏 为了完成验证用户在切换浏览器tab时进行登录再次认证需求需要监听浏览器切换窗口 if (document.hidden !== undefined) { document.addEve ...
- React技巧之处理tab页关闭事件
原文链接:https://bobbyhadz.com/blog/react-handle-tab-close-event 作者:Borislav Hadzhiev 正文从这开始~ 总览 在React中 ...
- 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件
js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...
- selenium WebDriver 对浏览器标签页的切换
关于selenium WebDriver 对浏览器标签页的切换,现在的市面上最新的浏览器,当点击一个链接打开一个新的页面都是在浏览器中打开一个标签页,而selenium只能对窗口进行切换的方法,只能操 ...
- 小技巧之Selenium如何切换到弹出的Tab页中
今天群里讨论了一个问题,如何将selenium的操作焦点切换到浏览器中新弹出来的Tab页中,正好对应到了昨天的那篇文章“小技巧之在浏览器中打开新的页签”.今天就带大家来解决这个问题: 先封装一个Tab ...
- 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还
查看本章节 查看作业目录 需求说明: 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他 ...
- jquery实现tab页切换显示div
1.jQuery实现tab切换显示代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q ...
随机推荐
- java 之 jsp tomcat启动失败问题
问题描述: 创建了一个helloServlet 代码如下 package Test; import java.io.IOException; import javax.servlet.ServletE ...
- 【JAVA基础】02 Java基础语法
一.内容 注释 关键字 标识符 常量.进制和进制转换 变量 数据类型和类型转换 运算符 语句 二.注释 注释概述 用于解释说明程序的文字 Java中注释分类格式 单行注释 格式://注释文字 多行注释 ...
- 【Linux常见命令】seq命令
seq - print a sequence of numbers seq命令用于以指定增量从首数开始打印数字到尾数,即产生从某个数到另外一个数之间的所有整数,并且可以对整数的格式.宽度.分割符号进行 ...
- 利用CRM实现电话营销部门的管控 之数据暂缓
每个公司都有相应的电话营销部门,有的公司是使用的集中的Call Center,有的公司则是使用简单的销售软件.不同的公司都有各自运行管理的方法. 此篇文章主要是介绍基于微软Dynamic CRM下的自 ...
- Material Design 设计规范总结(2)
本文是Material Design设计规范总结的第二部分,是进行UI设计与前端开发的必备参考资料. 八.布局 (1)所有可操作元素最小点击区域尺寸:48dp X 48dp. (2)栅格系统的最小单位 ...
- 用两张图告诉你,为什么你的App会卡顿?
有什么料? 从这篇文章中你能获得这些料: 知道setContentView()之后发生了什么? 知道Android究竟是如何在屏幕上显示我们期望的画面的? 对Android的视图架构有整体把握. 学会 ...
- KAFKA官方教程笔记-introduction
为什么80%的码农都做不了架构师?>>> 介绍 apache kafka是一个分布式流式处理平台,一个流式平台该有的三个关键能力: 发布.订阅流式数据.从这个角度讲类似消息队列或 ...
- log4net进阶手札(二):基本用法
本节将主要在WebSite中,对保存日志在文本文件的基本用法来进行介绍,并结合WebForm的初始化方式区别进行说明,解决方案如下图所示: 一.WebSite应用第1步:配置Web.Config文件, ...
- 用VC实现洪水攻击程序
本文为原创,如需转载,请注明作者和出处,谢谢! 一. 什么是洪水攻击 洪水之猛.势不可挡.如果将洪水比作对计算机的攻击,那大家可以想象得出,攻击是多的猛烈. 在安全领域所指的洪 ...
- POJ 3581 Prime Gap(二分)
Prime Gap Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 11009 Accepted: 6298 Descriptio ...