2018-08-21


一、打開chrome瀏覽器

1. 安裝chrome瀏覽器

2. 下載控制chrome的驅動器

chrome的版本和chromedriver的版本對應關系和下載地址
https://blog.csdn.net/huilan_same/article/details/51896672

存放路徑:
/工程名/src/main/resources/selenium/driver/chromedriver.exe

3. 下載selenium的jar包

pom.xml添加dependency

<project>
    <dependencies>
        <!--selenium框架 -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>2.50.0</version>
        </dependency>

        <!--testNG測試框架 -->
        <dependency>
            <groupId>org.testng</groupId>
            <artifactId>testng</artifactId>
            <version>6.8</version>
        </dependency>
    </dependencies>
</project>

4. 新建java類,啟動瀏覽器

自寫的類——>selenium——>chromedriver.exe——>chrome瀏覽器

        //此處src前面沒有"/",說明是相對工程根目錄的路徑
        System.setProperty("webdriver.chrome.driver",
        "src/main/resources/selenium/driver/chromedriver.exe");
        WebDriver driver = new ChromeDriver();

如果要窗口最大化,先設置參數,啟動的時候傳入

        //設置環境變量,指定chromedriver的路徑
        System.setProperty("webdriver.chrome.driver",
                "src/main/resources/selenium/driver_v236_63_65/chromedriver.exe");

        //設置瀏覽器的參數
        ChromeOptions options = new ChromeOptions();
        //最大化瀏覽器
        options.addArguments("--test-type", "--start-maximized");
        //指定瀏覽器位置
            //options.setBinary("C:/XXXXXXX/chrome.exe");
        //打開瀏覽器
        WebDriver driver = new ChromeDriver(options);

常見報錯原因:

  1. 瀏覽器和chromedriver版本不一致
  2. 防火墻導致無法訪問chrome瀏覽器,關閉防火墻

5. 關閉瀏覽器

        //先線程休眠3秒,便于觀察,然后才關閉,不然啟動就關閉像閃退
        try {
            Thread.sleep(3000);
        } catch (InterruptedException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        //關閉瀏覽器,driver.close()是關閉當前窗口
        driver.quit();

sleep()方法:

    public static void sleep(int millis) {
        try {
            Thread.sleep(millis);
        } catch (InterruptedException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }

二、地址欄和導航(前進、后退、刷新)

1. get()方法打開

        driver.get("http://www.baidu.com");

2. navigate().to()打開

driver.navigate().to("http://www.dangdang.com");

3. navigate導航

        // 1\. 先打開一個界面
        driver.navigate().to("http://www.baidu.com");

        //2\. to()方法再打開另一個界面
        driver.navigate().to("http://www.dangdang.com");
        sleep(2000);
        //3\. back()回退
        driver.navigate().back();
        sleep(2000);
        //4\. forward()前進
        driver.navigate().forward();
        sleep(2000);
        //5\. refresh()刷新
        driver.navigate().refresh();

三、4種常見方式定位元素

元素包含信息:

  1. 標簽
  2. 屬性
  3. 內容
  4. 位置

1. 按id屬性定位元素

        WebElement alertButton = driver.findElement(By.id("alertButtonId"));

2. 按name屬性定位元素

        WebElement alertButton = driver.findElement(By.name("alertButtonName"));

3. 按class定位元素

        WebElement buttons = driver.findElements(By.className("alertButtonClass"));

4. 使用xpath定位

1)自動化處理的對象:標簽(也稱為元素)

java html
WebElement元素類 標簽(如html、body、head、table、input、tr、alert彈出框等等)

2) 標簽

  1. 標簽名
  2. 標簽的屬性
    • 為了定位標簽的屬性:id、name、class、type
    • 為了產生交互效果的屬性:觸發事件,可以指定觸發后要執行的方法
  3. 要標識的數據:標簽都是為了描述數據的

2)xpath:選擇html標簽

符號 用途 示例
/ 絕對路徑 /html/body/table/tbody/tr/td/input
// 相對路徑 //body/table//input
標簽名 html的所有標簽 //input
[] 限定t條件 //input[@id='xxxid' and @type='button']
數字 指定匹配到的第幾個 //input[3]
@屬性名=屬性值 通過屬性限定條件
函數() 通過函數限定條件
and/or 連接多個條件
WebElement alertButton = driver.findElement(
            By.xpath("http://input[@id='alertButtonId' and @type='button']"));

四、常見元素的基本操作

0. 界面模板

<html>
    <head>
        <title>導航欄</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    </head>

    <body>
        xxxxxx替換元素代碼xxxxxxx
    </body>

</html>

1. text文本框

界面:
<input type="text" name="edit" id="edit" value="" />

自動化代碼

sendkeys()傳要填的內容

        WebElement text=
        driver.findElement(By.xpath("http://input[@type='text' and @id='edit']"));
        text.clear();
        text.sendKeys("傻不傻?傻!");

2. file文件上傳

界面:
<input type="file" name="attach[]" />

自動化代碼

找到元素,sendkeys()傳文件路徑

        WebElement input=
        driver.findElement(By.xpath("http://input[@type='file' and @name='attach[]']"));
        input.clear();
        input.sendKeys("C:/HtmlWeb/selenium/html_00_summary.html");

3. radio單選框

界面:
<input type='radio' name="company" value='Baidu' /> <label>百度</label> <br/> 
<input type='radio' name="company"  value="AliBaBa"/> <label>阿里巴巴</label><br/>
<input type='radio' name="company" value='Tencent' checked /><label>騰訊</label><br/> 
<input type='radio' name="company" value='Mi' /> <label>小米</label>

自動化代碼

input元素,類型是raidio,name相同的多個radio類型的input組成選項,靠value進行區分

選擇具體某個選項,并選擇:

        WebElement radio=
        driver.findElement(
                By.xpath("http://input[@type='radio' and @name='company' and @value='Mi']"));
        radio.click();

所有選項都點一遍:

        List<WebElement> radios=
        driver.findElements(By.xpath("http://input[@type='radio' and @name='company']"));
        for(int i=0;i<radios.size();i++){
            WebElement item=radios.get(i);
            sleep(1000);
        }

4. checkbox多選框

界面:
<input type="checkbox" name="course" value="web" /><label>網絡</label><br />
<input type="checkbox" name="course" value="training" /><label>培訓</label><br />
<input type="checkbox" name="course" value="friend" /><label>朋友介紹</label><br />
<input type="checkbox" name="course" value="other" /><label>其他方式</label>

自動化代碼

input元素,類型是checkbox,name相同的多個checkbox類型的input組成選項,靠value進行區分

選擇具體某一個選項,并選擇:

        WebElement checkbox=
        driver.findElement(
                By.xpath("http://input[@type='checkbox' and @name='course' and @value='web']"));
        checkbox.click();

所有選項都勾選:

        List<WebElement> checkboxs=
        driver.findElements(
                By.xpath("http://input[@type='checkbox' and @name='course']"));
        for(int i=0;i<checkboxs.size();i++){
            WebElement item=checkboxs.get(i);
            item.click();
            sleep(1000);
        }

5. 時間控件

界面:
<input type="date" name="startTime">

自動化代碼

先寫JavaScript代碼,然后通過driver執行js
js第一句是將只讀屬性去掉(若時間沒設只讀,則不需要)
js第二句是給時間元素設置value屬性,值為“2018-04-10”

String js="document.getElementsByName('startTime')[0].removeAttribute('readOnly');document.getElementsByName('startTime')[0].setAttribute('value','2018-04-10');";
        JavascriptExecutor jsDriver = (JavascriptExecutor) driver;
        jsDriver.executeScript(js);

6. button按鈕

界面:
<input type="button" name="promptbutton"
       value="測試prompt對話框" onclick="confirm('確定提交嗎?');" />

自動化代碼

找到元素,click()點擊

        WebElement button=
        driver.findElement(By.xpath("http://input[@type='button' and @id='alertButtonId']"));
        button.click();
        Alert alert=driver.switchTo().alert();
        alert.accept();

7. 文本域

界面:

多行多列的輸入框

<textarea rows="3" ></textarea>

自動化代碼
        WebElement textarea=driver.findElement(By.xpath("http://textarea[@rows='3']"));
textarea.clear();
textarea.sendKeys(“內容”);

8. img圖片

界面:

可點擊的圖片,都是外面有一層<a>超鏈接,只是用圖片替代了文本
自動化測試的時候,要定位的是<a>超鏈接

<a id='imgA'>
  <img src="xxxx">
</a>

自動化代碼
  1. 定位<a>標簽
  2. 點擊
        WebElement img=driver.findElement(By.xpath("http://a[@id='imgA']"));
        img.click();

7. select選擇框

界面:

select標簽:定義一個下拉框
option選項:定義一個選項,一個下拉框可以有很多個選項,即多個option
option的3個屬性:index(選項序號,默認自動加上的)、value選項值、visibleText展現文字

<select id="Selector">
        <option value="apple" >蘋果</option>
        <option value="peach" >桃子</option>
        <option value="banana" >香蕉</option>
        <option value="orange">桔子</option>
        <option value="grape" >葡萄</option>
        <option value="mango" >芒果</option>
</select> 

自動化代碼
  1. 先找select標簽
  2. 再找option標簽,并選擇
    • 把select標簽封裝成Select對象(封裝了找select下面所有option的操作)
    • 通過value、展現文本、序號
        WebElement selectEle=driver.findElement(By.xpath("http://select[@id='Selector']"));
        Select select=new Select(selectEle);
        select.selectByIndex(0);
        sleep(1000);
        select.selectByValue("banana");
        sleep(1000);
        select.selectByVisibleText("桔子");
        sleep(1000);

8. a超鏈接

界面:
<a >Copyright 2017 guoyasoft</a>

自動化代碼

定位超鏈接的3中方法:

  1. 使用xpath
WebElement link=
        driver.findElement(By.xpath("http://a[@));

  1. 使用linkText:按鏈接的文本精確匹配
WebElement link=driver.findElement(By.linkText("Copyright 2017 guoyasoft"));

  1. 使用partialLinkText:按鏈接的文本模糊匹配
WebElement baike=driver.findElement(By.partialLinkText("guoyasoft"));

三種點擊方式:1、 當前界面打開;2、新的標簽頁打開;新的窗口打開

直接點擊:當前界面打開

        WebElement link=
        driver.findElement(By.xpath("http://a[@));
        link.click();

ctrl+shift+點擊:當前瀏覽器的新標簽頁打開

        Actions actions=new Actions(driver);
        actions.keyDown(Keys.SHIFT).keyDown(Keys.CONTROL).click(link).perform();

shift+點擊:新窗口打開(新開一個瀏覽器)

        Actions actions=new Actions(driver);
        actions.keyDown(Keys.SHIFT).click(link).perform();

五、alert框切換

界面:
            <tr>
                <td>prompt對話框</td>
                <td><input type="button" name="promptbutton"
                    value="測試prompt對話框" onclick="clickbutton();" /></td>
            </tr>

javascript:

    function clickbutton() {
            var name = prompt("測試prompt對話框", "");
            if (name != null && name != "") {
                //document.write(name);
                alert(name);
            }
        }

自動化代碼
       WebElement clickOnPrompt = driver.findElement(By
               .xpath("http://td/input[@name='promptbutton']"));
       clickOnPrompt.click();
               try {
           Thread.sleep(2000);
       } catch (InterruptedException e) {
           e.printStackTrace();
       }   
       Alert prompt = driver.switchTo().alert();
               try {
           Thread.sleep(2000);
       } catch (InterruptedException e) {
           e.printStackTrace();
       }   
       prompt.sendKeys("I love Selenium");
       prompt.accept();
               try {
           Thread.sleep(2000);
       } catch (InterruptedException e) {
           e.printStackTrace();
       }   
       Alert afterAccept = driver.switchTo().alert();
       afterAccept.accept();
           try {
           Thread.sleep(2000);
       } catch (InterruptedException e) {
           e.printStackTrace();
       }   

六、窗口切換

界面:
            <tr>
                <td>超鏈接</td>
                <td>
                    <div>
                        <a id="link_baidu" >百度</a>
                    </div>
                    <div>
                        <a id="link_jd" >京東</a>
                    </div>
                    <div>
                        <a id="link_dangdang" >當當</a>
                    </div>
                </td>
            </tr>

自動化代碼

核心代碼:

  1. driver.getWindowHandle()獲取當前窗口句柄
  2. driver.getWindowHandles()獲取瀏覽器所有窗口句柄
  3. driver.switchTo().windows(目標句柄)
  4. 根據窗口的title判斷選擇的窗口是否正確(先切換控制,再查titile)
    public static void switchToWindow(String windowTitle, WebDriver dr) {
        // 將頁面上所有的windowshandle放在入set集合當中
        String currentHandle = dr.getWindowHandle();
        Set<String> handles = dr.getWindowHandles();
        for (String s : handles) {
            dr.switchTo().window(s);
            // 判斷title是否和handles當前的窗口相同
            if (dr.getTitle().contains(windowTitle)) {
                break;// 如果找到當前窗口就停止查找
            }
        }
    }

實踐測試:

  1. 打開測試界面
  2. 打開京東,切回原窗口
  3. 打開百度,切回原窗口
  4. 打開當當,切回原窗口
    private void testWindow(WebDriver driver, TestSelenium3 test) {
        /*
         * 第1步:打開測試界面
         */
        driver.get("http://127.0.0.1:8081/HtmlWeb/selenium/html_00_summary.html");
        Actions actions = new Actions(driver);

        /*
         * 第2步:點擊京東,再切換回原界面
         */
        WebElement jd = driver.findElement(By.xpath("http://a[@id='link_jd']"));
        //按順序點,按順序放
        actions.keyDown(Keys.SHIFT).keyDown(Keys.CONTROL).click(jd)
                .keyUp(Keys.SHIFT).keyUp(Keys.CONTROL).perform();
        test.mySleep(1000);

        //窗口切換到京東,進行操作,此處不做任何操作
        switchToWindow("京東", driver);
        test.mySleep(1000);

        //切換回原窗口
        switchToWindow("selenium", driver);
        test.mySleep(1000);

        /*
         * 第3步:點擊百度,再切換回原界面
         */
        WebElement baidu = driver
                .findElement(By.xpath("http://a[@id='link_baidu']"));
        actions.keyDown(Keys.SHIFT).keyDown(Keys.CONTROL).click(baidu)
                .keyUp(Keys.SHIFT).keyUp(Keys.CONTROL).perform();
        actions.click();
        test.mySleep(1000);

        switchToWindow("百度一下,你就知道", driver);
        test.mySleep(1000);

        switchToWindow("selenium", driver);
        test.mySleep(1000);
        /*
         * 第4步:點擊當當,再切換回原界面
         */
        WebElement dangdang = driver.findElement(By
                .xpath("http://a[@id='link_dangdang']"));
        actions.keyDown(Keys.SHIFT).keyDown(Keys.CONTROL).click(dangdang)
                .keyUp(Keys.SHIFT).keyUp(Keys.CONTROL).perform();
        actions.click();
        test.mySleep(1000);
        switchToWindow("當當", driver);
        test.mySleep(1000);

        switchToWindow("selenium", driver);
        test.mySleep(1000);

    }

七、切換界面框架frame

1. 界面代碼

1.1 main.html

<html>
<head>
<title>iframe測試界面</title>
</head>
<frameset rows="15%,75%,*" frameborder="1" framespacing="10">
    <frame src="top.html"></frame>
    <frameset cols="20%,*">
        <frame src="left.html"></frame>
        <frame src="right.html" name="content"></frame>
    </frameset>
    <frame src="button.html"></frame>
</frameset>
</html>

1.2 top.html

<html>
<body>
 <!--圖片放到webapp/images下面-->
    <img src="../../images/top.png" width="90%" height="80%">
</body>
</html>

[圖片上傳失敗...(image-e61e46-1534842841384)]

1.3 left.html

<html>

<body>
    <ul>
        <li><a  target="content">百度</a></li>
        <li><a  target="content">京東</a></li>
        <li><a  target="content">淘寶</a></li>
        <li><a  target="content">當當</a></li>
        <li><a  target="content">優酷</a></li>
    </ul>
</body>
</html>

1.4 right.html


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>管理頁面</title>
</head>
<body>該界面用于展示菜單內容
</body>
</html>

1.5 button.html

<html>

<body>

    <img src="../../images/button.png" width="90%" height="75%" >
</body>
</html>

[圖片上傳失敗...(image-720a89-1534842841383)]

2. frame測試代碼

第1步:打開測試界面

driver.get("http://127.0.0.1:8081/HtmlWeb/selenium/iframe2/main.html");

第2步:找到左邊導航frame框

WebElement leftFrame=driver.findElement(By.xpath("http://frame[@src='left.html']"));

第3步:切換控制權到frame窗口

driver.switchTo().frame(leftFrame);

第4步:測試frame框里的內容

WebElement baidu=driver.findElement(By.xpath("http://a[@));
            baidu.click();
            test.mySleep(2000);

第5步:將控制窗口切換回原主窗口

driver.switchTo().defaultContent();

第6步:定位右窗口,即點擊連接后打開的內容

WebElement rightFrame=driver.findElement(By.xpath("http://frame[@src='right.html']"));

第7步:切換到右邊的frame窗口

driver.switchTo().frame(rightFrame);

第8步:測試右窗口

            test.mySleep(3000);
            WebElement input=driver.findElement(By.xpath("http://input[@id='kw']"));
            input.clear();
            input.sendKeys("果芽軟件");

            WebElement submit=driver.findElement(By.id("su"));
            submit.click();
            test.mySleep(2000);

            //定位超鏈接元素的專用方法(精確和模糊兩種,類似id和name選擇器)
            WebElement baike=driver.findElement(By.linkText("上海果芽軟件科技有限公司_百度百科"));
            //WebElement baike=driver.findElement(By.partialLinkText("果芽軟件"));

            baike.click();
            test.mySleep(2000);

八、設置界面加載和元素定位等待時間

1. 線程休眠

        try {
            Thread.sleep(3000);
        } catch (InterruptedException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } 

2. 隱式等待

        //設置界面加載等待時間,全局設置,作用于driver,對所有后續界面加載都有效
        driver.manage().timeouts().pageLoadTimeout(3000, TimeUnit.MILLISECONDS);
        driver.get("http://www.baidu.com");
        //設置元素定位超時等待時間,全局設置,作用于driver,對所有后續元素定位都有效
        driver.manage().timeouts().implicitlyWait(3000, TimeUnit.MILLISECONDS);
        WebElement element=driver.findElement(By.xpath("kw"));

3. 顯示等待

        WebDriverWait wait=new WebDriverWait(driver, 2);
        wait.until(new ExpectedCondition<Boolean>() {
            public Boolean apply(WebDriver d) {
                boolean loadcomplete = d.findElement(By.xpath("")).isDisplayed();
                return loadcomplete;
                }
                });

常見錯誤

image.png
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 1、通過CocoaPods安裝項目名稱項目信息 AFNetworking網絡請求組件 FMDB本地數據庫組件 SD...
    陽明AGI閱讀 16,003評論 3 119
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,792評論 1 92
  • 01 你的微信上,有你很在乎的朋友嗎? 你們多久沒見了。 ta最初在你心中留下的印象,是否已被朋友圈掩蓋。 以前,...
    拾凡時光閱讀 480評論 0 0
  • 好久沒吃方便面了,煮著吃都很少更不用說泡著吃,也許這是人慢慢長大的節奏吧,以前超愛吃方便面的我,現在就算再...
    語甜閱讀 199評論 0 0