首页 > 代码库 > Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例

Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例

 

弹出框是网页自动化测试常见得操作页面元素之一,常见的JavaScript弹出框有如下三种:

  • 1alert(message)方法用于显示带有一条指定消息和一个 OK 按钮的警告框。DemoAlert.html 示例代码如下所示:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        <link rel="stylesheet" type="text/css" href="http://www.mamicode.com/css/theme.css" charset="utf-8"/>                <title>元素操作实例-弹出框(警示、提示)</title>                <script type="text/javascript">        function op_alert() {        	alert("这是一个:弹出框(警示、提示)")        }        </script>    </head>        <body>        <div>            <input class="alert" type="button" style="width:200px,height:20px" onclick="op_alert()" value="http://www.mamicode.com/显示警告框" />        </div>    </body></html>

 

  • 2confirm(message)方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。DemoConfirm.html示例代码如下所示:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        <link rel="stylesheet" type="text/css" href="http://www.mamicode.com/css/theme.css" charset="utf-8"/>                <title>元素操作实例-确认框(确认、取消)</title>                <script type="text/javascript">        function op_confirm() {            var op = confirm("这是一个确认消息框示例,是否执行删除操作?")                        if(op == true) {            	document.write("您按下了确认操作键!")            } else {            	document.write("你按下了取消操作键!")            }        }        </script>    </head>        <body>        <div>            <input class="alert" type="button" onclick="op_confirm()" value="http://www.mamicode.com/显示确认框" />        </div>    </body></html>

 

  • 3prompt(text,defaultText)方法用于显示可提示用户进行输入的对话框。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        <link rel="stylesheet" type="text/css" href="http://www.mamicode.com/css/theme.css" charset="utf-8"/>                <title>元素操作实例-输入提示框</title>                <script type="text/javascript">        function op_prompt() {            var name = prompt("Please enter your name :", "http://www.cnblogs.com/fengpingfan/")                        if((name == "范丰平" || name == "http://www.cnblogs.com/fengpingfan/") && name != "") {                document.getElementById(‘content‘).innerHTML = "Welcome to my cnblogs : <a href=http://www.mamicode.com/"http://www.cnblogs.com/fengpingfan/\">范丰平-博客园</a>"            } else if (name == "") {                document.getElementById(‘content‘).innerHTML = "Input nothing !"            } else if (name == null) {                document.getElementById(‘content‘).innerHTML = "Clicked cancel button !"            } else {                document.getElementById(‘content‘).innerHTML = "<a>Input content is : " + name + "</a>"            }        }        </script>    </head>        <body>        <div id="content">        </div>        <div>            <input class="alert" type="button" onclick="op_prompt()" value="http://www.mamicode.com/显示输入提示框" />        </div>    </body></html>

 

三者需要的 theme.css 文件如下所示:

.alert {	width: 300px;	height: 40px;}

 

以上三种对话框均可通过 WebDriver 中的 Alert 去操作,操作源代码如下所示:

DemoAlert.java 源码如下所示:

 1 /** 2  * Aaron.ffp Inc. 3  * Copyright (c) 2004-2016 All Rights Reserved. 4  */ 5 package ffp.demo.webdriver; 6  7 import org.openqa.selenium.Alert; 8 import org.openqa.selenium.By; 9 import org.openqa.selenium.WebDriver;10 import org.openqa.selenium.chrome.ChromeDriver;11 import org.testng.annotations.Test;12 13 14 /**15  * <strong>元素操作实例-弹出框(警示框、提示框)<br></strong>16  * alert(message) 方法用于显示带有一条指定消息和一个 OK 按钮的警告框。<br>17  * @author Aaron.ffp18  * @version V1.0.0: ffp-demo ffp.demo.webdriver DemoAlert.java, 2016-09-16 10:41:02.118 Exp $19  */20 public class DemoAlert {21     String url = "http://localhost:8080/ffp-demo/res/main/webdriver/DemoAlert.html";22     23     private WebDriver driver = new ChromeDriver();24     25     @Test26     public void test_alert() {27         this.driver.manage().window().maximize();28         this.driver.get(this.url);29         30         this.driver.findElement(By.xpath("//input[@class=‘alert‘]")).click();31         Alert alert = this.driver.switchTo().alert();32         33         System.out.println(alert.getText());34         35         alert.accept();36         37         this.driver.quit();38         39     }40 }

 

DemoConfirm.java 源码如下所示:

 1 /** 2  * Aaron.ffp Inc. 3  * Copyright (c) 2004-2016 All Rights Reserved. 4  */ 5 package ffp.demo.webdriver; 6  7 import org.openqa.selenium.Alert; 8 import org.openqa.selenium.By; 9 import org.openqa.selenium.WebDriver;10 import org.openqa.selenium.chrome.ChromeDriver;11 import org.openqa.selenium.os.WindowsUtils;12 import org.testng.annotations.Test;13 14 import com.google.gson.annotations.Until;15 16 import ffp.demo.core.TestCaseBase;17 18 /**19  * <strong>元素操作实例-确认框(确认、取消)</strong><br>20  * <br>21  * @author Aaron.ffp22  * @version V1.0.0: ffp-demo ffp.demo.webdriver DemoConfirm.java, 2016-09-16 10:41:45.227 Exp $23  */24 public class DemoConfirm extends TestCaseBase {25     String url = "http://localhost:8080/ffp-demo/res/main/webdriver/DemoConfirm.html";26     27     private WebDriver driver = new ChromeDriver();28     29     @Test30     public void test_alert() {        31         this.driver.manage().window().maximize();32         this.driver.get(this.url);33         34         this.driver.findElement(By.xpath("//input[@class=‘alert‘]")).click();35         Alert alert = this.driver.switchTo().alert();36         37         System.out.println(alert.getText());38         39         alert.accept();40 //        alert.dismiss();41         42         System.out.println(this.driver.getPageSource().toString());43         44         this.driver.quit();45         46     }47 }

 

DemoPrompt.java 源码如下所示:

 1 /** 2  * Aaron.ffp Inc. 3  * Copyright (c) 2004-2016 All Rights Reserved. 4  */ 5 package ffp.demo.webdriver; 6  7 import org.openqa.selenium.Alert; 8 import org.openqa.selenium.By; 9 import org.openqa.selenium.WebDriver;10 import org.openqa.selenium.chrome.ChromeDriver;11 import org.openqa.selenium.os.WindowsUtils;12 import org.testng.annotations.Test;13 14 15 /**16  * <strong>元素操作实例-输入提示框</strong><br>17  * <br>18  * @author Aaron.ffp19  * @version V1.0.0: ffp-demo ffp.demo.webdriver DemoPrompt.java, 2016-09-16 10:44:16.638 Exp $20  */21 public class DemoPrompt {22     String url = "http://localhost:8080/ffp-demo/res/main/webdriver/DemoPrompt.html";23     24     private WebDriver driver = new ChromeDriver();25     26     @Test27     public void test_prompt() throws InterruptedException {28         this.driver.manage().window().maximize();29         this.driver.get(this.url);30         31         this.driver.findElement(By.xpath("//input[@class=‘alert‘]")).click();32         Alert prompt = this.driver.switchTo().alert();33         34         System.out.println(prompt.getText());35         prompt.sendKeys("Selenium3启动Firefox需要geckodriver.exe");36         37         Thread.sleep(5000);38         39         prompt.accept();40         41 //        alert.dismiss();42         43         Thread.sleep(5000);44         45         System.out.println(this.driver.getPageSource().toString());46         47         WindowsUtils.killByName("chromedriver_x86_2.24.exe");48     }49 }

 

相应的脚本源码文件分享链接:https://yunpan.cn/ckua8gdW5fKYQ  访问密码 e5b2

 

至此,Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例 顺利完结,希望此文能够给初学 Selenium 的您一份参考。

最后,非常感谢亲的驻足,希望此文能对亲有所帮助。热烈欢迎亲一起探讨,共同进步。非常感谢! ^_^

 

 

Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例