puppeteer学习笔记（四）--API问题解决--切换不一样的窗口

今天解决的问题是切换窗口的问题，页面点击元素后，在本页面还好，直接进行操做就行了，有时会打开一个新的页面，句柄还停留在第一个页面，直接操做会报错，须要切换到新页面进行操做，

下面上调试好的代码：

const puppeteer = require('puppeteer');

(async () => {
	const browser = await puppeteer.launch({headless:false});
	const page = await browser.newPage();
	//打开掘进首页，点击第一个文章连接
	await page.goto('https://juejin.im/');
	await page.setViewport({width:1280,height:800});
	await page.waitFor('#juejin > div.view-container > main > div > div.feed.welcome__feed > ul > li:nth-child(1) > div > div > a > div > div > div.info-row.title-row > a');
	await page.tap('#juejin > div.view-container > main > div > div.feed.welcome__feed > ul > li:nth-child(1) > div > div > a > div > div > div.info-row.title-row > a');
	//跳转到第二个窗口输入文字
	await page.waitFor(3000);//等待3秒，等待新窗口打开
	const page2 = ( await browser.pages() )[2];//获得全部窗口使用列表索引获得新的窗口
	await page2.setViewport({width:1280,height:800});
	await page2.waitFor('.search-input');
	await page2.type('.search-input','succeed');//在新窗口中输入文字
	const title = await page2.title();//获得新窗口的标题
	console.log(title);//打印新窗口的标题
})();
复制代码

解析：第10行之前就不用说了，打开一个浏览器进入掘进首页，点击文章，打开新的页面

一、第12行我加了3秒的等待，由于点击完文章后，后会当即执行脚本browser.pages()，而新的页面有时还没打开，就会获取不到，因此加一个等待，等待新页面彻底打开。 二、第13行中我使用索引的方法来获取最新的页面，由于返回的是一个列表，这里有一个要注意,索引前面的脚本要加括号，否则会出错

const page2 = ( await browser.pages() )[2];//获得全部窗口使用列表索引获得新的窗口
复制代码

三、后边就是正常的操做了，page2就是新的页面，page就是旧的页面能够直接进行操做

PS：这里留意个注意事项，若是你们有遇到的能够看看 我在作web网页UI自动化时候也会遇到要切换窗口，我当时是获得全部的句柄使用索引进行切换的。

可是注意啦：有时候会遇到一个问题，就是窗口的句柄顺序会常常不同！（在puppeteer中暂时还没遇到这种状况）

举个例子：同一个脚本，获得句柄列表顺序，第一次获得的句柄是[1,2,3]，可是第二次运行获得的句柄列表是[1,3,2]，第三次获得的句柄是[2,1,3]，不知道你们有没有明白，句柄并不会按照打开的顺序来依次排序，因此使用索引就会有时成功有时失败，

我这边写一下我当时解决的思路： 环境是：Python + robotframework 首先：获得只有一个窗口的列表x=[1]，在获得有两个窗口的列表y=[1,2]，在获得有三个窗口的列表z=[2,3,1]，在Python中进行处理：把列表转换成元祖，进行相减，在转换成列表返回 脚本以下：

list(set(y)-set(x)[0]
复制代码

图示以下： 要切换到第3个窗口：用3个的窗口列表减去2个窗口的列表 要切换到第2个窗口：用2个的窗口列表减去1个窗口的列表