🔥《刚刚问世》系列初窥篇-Java+Playwright自动化测试-17- 如何优雅地切换浏览器多窗口(详细教程)

1.简介

有时候我们在网页上点击一些按钮或超链接时,有时会打开一个新的网页窗口。这个时候如果下一步操作是在新的网页窗口上,那么就需要切换网页窗口,切换到新的网页窗口后再执行元素定位等操作。Playwright处理浏览器多窗口切换相比较于Selenium简单快捷。下边宏哥就给小伙伴们或者童鞋们介绍一下playwrigh如何优雅地切换浏览器多个窗口。

2.窗口切换步骤

1、 context.pages(); //获取所有的page对象,返回数据类型为列表,列表中的网页对象的索引按照打开顺序从0开始依次递增。

2、 page.bringToFront(); //激活网页,将网页显示在屏幕最上层,本行代码不写也不影响脚本执行。

3、 page.close(); //关闭网页。

3.测试场景

我们以访问百度为例,百度首页有多个选项,新闻,hao123网址导航,贴吧等多个选项,我们点击不同的选项,就会打开不同的新标签页。当打开多个标签页后, 如何切换到自己想要的页面上操作。

思路:我们可以通过脚本,输出百度首页各页面的标题,通过context.pages(); 可以获取到所有的page对象,每一个page对象就代表一个标签页实例。

3.1代码设计

3.2参考代码

ini 复制代码
package com.bjhg.playwright;

import java.util.List;

import com.microsoft.playwright.Browser;
import com.microsoft.playwright.BrowserContext;
import com.microsoft.playwright.BrowserType;
import com.microsoft.playwright.Locator;
import com.microsoft.playwright.Page;
import com.microsoft.playwright.Playwright;

/**
 * @author 北京-宏哥
 * 
 * @公众号:北京宏哥(微信搜索,关注宏哥,提前解锁更多测试干货)
 * 
 * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-17-  如何优雅地切换浏览器多窗口(详细教程)
 *
 * 2025年06月05日
 */
public class Test_Switch_Window {
    
    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
          //1.使用chromium浏览器,# 浏览器配置,设置以GUI模式启动Chrome浏览器(要查看浏览器UI,在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。
          Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(3000));
          //2.创建context
          BrowserContext context = browser.newContext();
         
          //创建page
          Page page = context.newPage();
          //3.浏览器打开网站
          page.navigate("https://www.baidu.com");
          //4.点击打开多个新的标签页
          List<Locator> links = page.locator("#s-top-left>a").all();
          for(Locator link:links){
              link.click();
          }
          
          //5.遍历page对象
          List<Page> pages = context.pages();
          for(Page i:pages){
              System.out.println(i.title());
          }
          
          System.out.println("Test Pass");
          //关闭page
          page.close();
          //关闭browser
          browser.close();
        }
    }

}

3.3运行代码

1.运行代码,右键Run As->Java Application,就可以看到控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

4.多窗口切换方法

4.1Title切换

从上边可以看到宏哥已经将所有的标签的title都循环出来了,因此我们只要切换到我们需要操作的title标签页即可切换对应窗口然后再进行后续定位操作。

4.1.1代码设计

4.1.2参考代码

java 复制代码
package com.bjhg.playwright;

import java.util.List;

import com.microsoft.playwright.Browser;
import com.microsoft.playwright.BrowserContext;
import com.microsoft.playwright.BrowserType;
import com.microsoft.playwright.Locator;
import com.microsoft.playwright.Page;
import com.microsoft.playwright.Playwright;

/**
 * @author 北京-宏哥
 *
 * @公众号:北京宏哥(微信搜索,关注宏哥,提前解锁更多测试干货)
 * 
 * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-17-  如何优雅地切换浏览器多窗口(详细教程)
 *
 * 2025年06月05日
 */
public class Test_Switch_Window{
    
    public static Page switchToPage(BrowserContext context,String string){
        
        //切换到指定title 名称的标签页
        List<Page> pages = context.pages();
        
        for(Page i:pages){
            if(string != null){
                if(i.title().contains(string)){
                    //激活当前选项卡
                    i.bringToFront();
                    return i;
                }
            }else{
                System.out.println("not found title");
            }
//            return context.pages[0];        
        }
        return (Page) pages.listIterator(0); 
    }

    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
          //1.使用chromium浏览器,# 浏览器配置,设置以GUI模式启动Chrome浏览器(要查看浏览器UI,在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。
          Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(300));
          //2.创建context
          BrowserContext context = browser.newContext();
         
          //创建page
          Page page = context.newPage();
          //3.浏览器打开网站
          page.navigate("https://www.baidu.com");
          //4.点击打开多个新的标签页
          List<Locator> links = page.locator("#s-top-left>a").all();
          for(Locator link:links){
              link.click();
          }
          
          //5.打开多个tab 标签页, 切换到新闻页
          Page page1 = switchToPage(context, "新闻");
          System.out.println(page1.title());
          
          System.out.println("Test Pass");
          //关闭page
          page.close();
          //关闭browser
          browser.close();
        }
    }

}

4.1.3运行代码

1.运行代码,右键Run As->Java Application,就可以看到控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

4.2URL切换

和title的思路类似:前边已经将所有的标签的title都循环出来了,我们只要切换到我们需要操作的url标签页即可。

4.2.1代码设计

4.2.2参考代码

java 复制代码
package com.bjhg.playwright;

import java.util.List;

import com.microsoft.playwright.Browser;
import com.microsoft.playwright.BrowserContext;
import com.microsoft.playwright.BrowserType;
import com.microsoft.playwright.Locator;
import com.microsoft.playwright.Page;
import com.microsoft.playwright.Playwright;

/**
 * @author 北京-宏哥
 * @param <context>
 * 
 * @公众号:北京宏哥(微信搜索,关注宏哥,提前解锁更多测试干货)
 * 
 * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-17-  如何优雅地切换浏览器多窗口(详细教程)
 *
 * 2025年06月05日
 */
public class Test_Switch_Window{
    
    public static Page switchToPage(BrowserContext context,String url){
        
        //切换到指定 URL 名称的标签页
        List<Page> pages = context.pages();
        
        for(Page i:pages){
            if(url != null){
                if(i.url().contains(url)){
                    //激活当前选项卡
                    i.bringToFront();
                    return i;
                }
            }else{
                System.out.println("not found url");
            }
//            return context.pages[0];        
        }
        return (Page) pages.listIterator(0); 
    }

    public static void main(String[] args) {
        try (Playwright playwright = Playwright.create()) {
          //1.使用chromium浏览器,# 浏览器配置,设置以GUI模式启动Chrome浏览器(要查看浏览器UI,在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。
          Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(300));
          //2.创建context
          BrowserContext context = browser.newContext();
         
          //创建page
          Page page = context.newPage();
          //3.浏览器打开网站
          page.navigate("https://www.baidu.com");
          //4.点击打开多个新的标签页
          List<Locator> links = page.locator("#s-top-left>a").all();
          for(Locator link:links){
              link.click();
          }
          
          //5.打开多个tab 标签页, 切换到新闻页
          Page page1 = switchToPage(context, "hao");
          System.out.println(page1.title());
          
          System.out.println("Test Pass");
          //关闭page
          page.close();
          //关闭browser
          browser.close();
        }
    }

}

4.2.3运行代码

1.运行代码,右键Run As->Java Application,就可以看到控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

4.小结

本文主要介绍了playwright如何优雅地切换浏览器多窗口,playwright切换页面窗口不需要获取页面窗口的句柄,实现比selenium简单便捷许多,是playwright相对于selenium的一大优势。

相关推荐
寻星探路7 小时前
【深度长文】万字攻克网络原理:从 HTTP 报文解构到 HTTPS 终极加密逻辑
java·开发语言·网络·python·http·ai·https
崔庆才丨静觅8 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
曹牧9 小时前
Spring Boot:如何测试Java Controller中的POST请求?
java·开发语言
passerby60619 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了9 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅9 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅10 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
爬山算法10 小时前
Hibernate(90)如何在故障注入测试中使用Hibernate?
java·后端·hibernate
kfyty72510 小时前
集成 spring-ai 2.x 实践中遇到的一些问题及解决方案
java·人工智能·spring-ai