微软出品自动化神器【Playwright+Java】系列（九）多线程、重定向、弹出新 ...

写在前面

关于Playwright系列的文章，真的很久没有写了，今天一个不小心官方API部分过完了，下面将为大家逐一演示，感兴趣的同学可以自行动手练习。
API部分

多线程

直白点说就是多线程下Playwright的使用，示例代码如下：

1. package org.example;
3. import com.microsoft.playwright.*;
5. import java.nio.file.Paths;
7. import static java.util.Arrays.asList;
9. public class PlaywrightThread extends Thread {
10.   private final String browserName;
12.   private PlaywrightThread(String browserName) {
13.     this.browserName = browserName;
14.   }
16.   public static void main(String[] args) throws InterruptedException {
17.     for (String browserName: asList("chromium", "webkit", "firefox")) {
18.       Thread thread = new PlaywrightThread(browserName);
19.       thread.start();
20.     }
21.   }
23.   @Override
24.   public void run() {
25.     try (Playwright playwright = Playwright.create()) {
26.       BrowserType browserType = getBrowserType(playwright, browserName);
27.       Browser browser = browserType.launch();
28.       Page page = browser.newPage();
29.       page.navigate("https://www.baidu.com/");
30.       page.locator("#kw").type("久曲健 博客园");
31.       page.locator("#kw").press("Enter");
32.       page.screenshot(new Page.ScreenshotOptions().setPath(Paths.get("user-agent-" + browserName + ".png")));
33.     }
34.   }
36.   private static BrowserType getBrowserType(Playwright playwright, String browserName) {
37.     switch (browserName) {
38.       case "chromium":
39.         return playwright.chromium();
40.       case "webkit":
41.         return playwright.webkit();
42.       case "firefox":
43.         return playwright.firefox();
44.       default:
45.         throw new IllegalArgumentException();
46.     }
47.   }
48. }

复制代码

重定向到指定页面

跳转到指定页面，示例代码如下：

1. /**
2. * @decription 跳转到指定页面
3. * @author longrong.lang
4. * @date 2023/02/18 9:15
5. * @return: void
6. */
7. @Test
8. public void testNavigations() {
9.     // 跳转到百度页面
10.     page.navigate("https://www.baidu.com/");
11.     //等待网络空闲是跳转
12.     page.navigate("https://www.baidu.com/", new Page.NavigateOptions()
13.             .setWaitUntil(WaitUntilState.NETWORKIDLE));
14. }

复制代码

元素等待

它有显示等待和页面交互操作自动等待，相比Selenium来比的话，对异步操作有自己的处理机制，示例代码如下：

1. /**
2. * @decription 元素等待
3. * @author longrong.lang
4. * @date 2023/2/17 14:09
5. * @return: void
6. */
7. @Test
8. public void testWaitElement(){
9.     //在延迟加载的页面中，使用 Locator.waitFor（）等待元素可见可能很有用。
10.     page.navigate("https://www.baidu.com/");
11.     page.locator("#kw").waitFor();
12.     //Page.click（）这样的页面交互会自动等待元素。
13.     page.navigate("https://www.baidu.com/");
14.     page.locator("#kw").type("test");
15.     //自定义等待
16.     page.locator(".toindex").click(); //点击跳转
17.     page.waitForLoadState(LoadState.NETWORKIDLE); // 这在“网络空闲”之后处理
18.     //显示等待（异步调用建议使用）
19.     page.navigate("asynchronousProcessing.html");
20.     page.waitForNavigation(()->{
21.         page.locator("#submit").click(); //123主页
22.     });
23.     //单击一个元素可能会触发多个异步
24.     page.waitForNavigation(new Page.WaitForNavigationOptions().setUrl("**/login"), () -> {
25.         page.locator("#submit").click();
26.     });
28. }

复制代码

弹出窗口处理

这个案例很有意思，在写对应的html案例时，发现这东西只在ie浏览器上生效（ createPopup()方法只适用在IE !），这里还请读者朋友注意，所以你跑脚本报错，并不是你代码的问题哦，示例代码如下：

1. /**
2. * @decription 弹出窗口处理
3. * @author longrong.lang
4. * @date 2023/02/18 11:08
5. * @return: void
6. */
7. @Test
8. public void testPopup(){
9.     // createPopup()方法只适用在IE !
10.     page.navigate("http://localhost:8080/proup_demo.html");
11.     Page popup = page.waitForPopup(() -> {
12.         page.locator("[onclick]").click();
13.     });
14.     popup.waitForLoadState(LoadState.LOAD);
15. }

复制代码

截图操作

分为快速截图、整页截图、存到缓存区、按照元素区域截图，示例代码如下：

1. /**
2. * @decription 截图操作
3. * @author longrong.lang
4. * @date 2023/02/18 11:08
5. * @return: void
6. */
7. @Test
8. public void testScreenshot(){
9.     page.navigate("https://www.baidu.com/");
10.     //快速截图
11.     page.screenshot(new Page.ScreenshotOptions()
12.             .setPath(Paths.get("screenshot1.png")));
13.     //整页截图
14.     page.screenshot(new Page.ScreenshotOptions()
15.             .setPath(Paths.get("screenshot2.png"))
16.             .setFullPage(true));
17.     //存到缓冲区
18.     byte[] buffer = page.screenshot();
19.     System.out.println(Base64.getEncoder().encode(buffer));
20.     //按照元素区域截图
21.     page.locator("#kw").screenshot(new Locator.ScreenshotOptions().setPath(Paths.get("screenshot3.png")));
22. }

复制代码

处理新页面

就是新句柄处理，只不过是连个窗口罢了，超链接带target="_blank"标识，示例代码如下：

1. /**
2. * @decription 新窗口处理
3. * @author longrong.lang
4. * @date 2023/02/18 11:53
5. * @return: void
6. */
7. @Test
8. public void testHandlingNewPage() {
9.     page.navigate("https://www.baidu.com/");
10.     Page newPage = context.waitForPage(() -> {
11.         page.locator("#s-top-left .c-color-t:nth-of-type(4)").click();
12.     });
13.     newPage.waitForLoadState();
14.     System.out.println(newPage.title());
15. }

复制代码

录制生成脚本

启动命令如下：

1. mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="codegen www.baidu.com"

复制代码

效果：

模拟指定窗口大小录制

运行命令如下：

1. mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args="codegen --viewport-size=800,600 www.baidu.com"

复制代码

效果：

模拟设备录制

运行命令如下：

1. mvn exec:java -e -D exec.mainClass=com.microsoft.playwright.CLI -D exec.args='codegen --device="iPhone 11" playwright.dev'

复制代码

我这执行完报错，不到为啥，也不到官方是怎么成功的，很好奇！
用python的打开命令居然能，很诡异是抗拒Java吗？

1. playwright open --device="iPhone 13 Pro" www.baidu.com

复制代码

效果：

录制视频

使用Playwright，脚本录制结束后会自动生成视频，示例代码如下：

1. context = browser.newContext(new Browser.NewContextOptions().setRecordVideoDir(Paths.get("videos/")));  
2. //确保context关闭，以便保存视频。  
3. context.close();

复制代码

页面对象模式

这个可以用Selenium的pageObject模式一样，目的是为了代码维护方便，这里我以登录功能为例进行演示，登录页面需要存放元素定位和控件操作行为，示例代码如下：

1. package org.example;
4. import com.microsoft.playwright.Locator;
5. import com.microsoft.playwright.Page;
6. /**
7. * @description 存放页面控件及操作
8. * @author longrong.lang
9. * @version 1.0
10. * @date 2023/02/18 15:07
11. */
12. public class LoginPage {
13.   private final Page page;
14.   private final Locator username;
15.   private final Locator password;
16.   private final Locator login_btn;
17.   private final Locator error_msg;
20.   public LoginPage(Page page) {
21.     this.page = page;
22.     this.username = page.locator("input[type='text']");
23.     this.password = page.locator("[type='password']");
24.     this.login_btn = page.locator("button");
25.     this.error_msg = page.locator("#alert");
26.   }
28.   public void open() {
29.     page.navigate("http://localhost:8080/login");
30.   }
32.   /**
33.    * @decription 登录操作
34.    * @author longrong.lang
35.    * @date 2023/02/18 15:03
36.    * @param user
37.    * @param pwd
38.    * @return: java.lang.String
39.    */
40.   public String login(String user,String pwd) {
41.     open();
42.     username.fill(user);
43.     password.fill(pwd);
44.     login_btn.click();
45.     String content = error_msg.textContent();
46.     return content;
47.   }
48. }

复制代码

测试类部分，示例代码如下：

1. package org.example;
3. import com.microsoft.playwright.*;
4. import org.testng.Assert;
5. import org.testng.annotations.AfterClass;
6. import org.testng.annotations.BeforeClass;
7. import org.testng.annotations.Test;
9. /**
10. * @description 测试登录功能
11. * @author longrong.lang
12. * @version 1.0
13. * @date 2023/02/18 15:07
14. */
15. public class TestLogin {
16.     static Playwright playwright;
17.     static Browser browser;
18.     static BrowserContext context;
19.     static Page page;
20.     @BeforeClass
21.     static void launchBrowser() {
22.         playwright = Playwright.create();
23.         browser = playwright.chromium().launch(new BrowserType.LaunchOptions()
24.                 .setHeadless(false));
25.         context = browser.newContext();
26.         page = context.newPage();
27.     }
29.     @Test
30.     public void testLogin() {
31.         LoginPage loginPage = new LoginPage(page);
32.         String errorMsg = loginPage.login("1", "1");
33.         Assert.assertEquals(errorMsg,"用户名或密码错误！");
34.     }
36.     @AfterClass
37.     public void afterClass() {
38.         browser.close();
39.         context.close();
40.         playwright.close();
41.     }
42. }

复制代码

写在最后

总的来说，还是很开心的，而且很有成就感，终于把Playwright+Java系列教程写完了。
可能有些同学会好奇说，网上不是有都是吗，你可以找找Java系列，我敢说，即便是有大部分抄袭我的比较多，抄袭我能理解加个出处行吗？如下图：

真的突然让我想到了洲哥那句话，总会有那么几个让你恶心的狗逼，但已经被恶心了就恶心了，随它去吧！
开心的是，证明我写的还是不错的，要不他也不能抄袭不是吗？

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！