Selenium 自动化测试工具(1) (Selenium 工作原理，常用API的使用）

什么是自动化测试

关于自动化，很好理解，比如，像菜鸟，京东，顺丰等这样的快的公司，在早期时，进行快递的筛选，快递的配送，都是人工进行，而现在随着科技的进步，这些工作就可以使用机器进行代替，效率也能得到了大大的提高，所以自动化测试就是：

将人工要做的测试工作转换成让代码去执行测试，以提高测试效率和测试的质量。

什么是测试工具：

测试工具可以是一个jar包，用的时候，导入这个包，调用方法使用，或者是一个web网站，输入测试数据进行测试，或者是一个exe程序，就例如fiddler工具这样，测试工具是各种各样的，

Selenium 工作原理(重要)

Selenium 是一个主要用于对 Web 程序进行自动化测试的工具， 主要应用于页面当中，模拟用户操作浏览器，实现 UI 自动化测试。它有三大组件，分别是：

Selenium WebDrive：Selenium WebDrive 提供了很多的API，测试人员通过调用这些接口，来访问浏览器驱动，浏览器驱动再操作浏览器。

Selenium 工作原理：

通过以下例子讲解 Selenium 的工作原理：

比如，我们坐出租车到指定的地方这样的一个例子，这里面就涉及到三个角色：我自己，司机，出租车，如下图：

Selenium 的工作原理也就是这样的，Selenium 里面也有三个角色：

自动化代码：自动化测试代码发送请求给浏览器驱动(比如Chrome驱动，火狐驱动)

浏览器驱动：它来解析解析自动化测试代码，然后发送给浏览器。

浏览器：执行浏览器驱动发来的指令，最终完成工程师想要的操作。

下面通画图讲解一下 Selenium WebDriver 和 浏览器之间如何通信：

• 自动化脚本 和 浏览器驱动之间是 C/S 架构(客户端-服务器)，两者之间使用的是 HTTP 协议，对于每一条 Selenium 脚本，都会创建一个HTTP请求发送给浏览器驱动。
• 在浏览器驱动中，包含了一个服务器，用来接收这些http请求
• 服务器收到请求后，进行解析，发送给浏览器
• 浏览器执行具体的测试步骤
• 浏览器执行完之后，将执行结果返回给服务器
• 服务器又将结果返回给自动化测试代码，如果是错误的http代码，我们就会在控制台看到对应的报错信息

问题：驱动是同一个，假如是 Chrome 驱动，在客户端使用 Java 或 python 代码，但是为什么可以同时接收 Java 请求和 python请求呢？

这个驱动里面并不是说可以同时接收两种代码，而是支持一种通用的协议，WebDriver 里遵循的一个协议叫作 Json Wire protocol，它们传输的数据格式是 Json 的，可以理解成在HTTP协议之上，再封装了一层这样的公共协议，通过这层协议，就可以解决多种语言。

Selenium API

使用 Selenium API 需要引入依赖：

    <dependencies>
        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>3.4.0</version>
        </dependency>
    </dependencies>

定位元素

定位元素常用的主要有以下两种：

CSS 选择器

下面介绍几种常见的选择器

1. 类选择器：. class值(例如：. s_ipt)

2. id选择器：# id值 (例如：#s_ipt)

3. 标签选择器：标签名

4. 父类选择器 子类选择器：父类选择器表达式 子类选择器表达式(例如：#s_ipt #kw)

xpath 定位元素

xpath 是根据指定路径选择一组元素，指定路径时可以通过 “绝对路径”和“相对路径”两种方式。

绝对路径：以 ‘/’ 开头为绝对路径

通过绝对路径查找比较麻烦，如下图：

场景：寻找 html 标签下的 head 标签下的 meta 标签。

通过绝对路径的方式就是：html/head/meta，就会比较麻烦，如下图：

相对路径：以 ’//‘ 开头为相对路路径 (推荐)

场景：通过相对路径查寻找 html 标签下的 head 标签下的 meta 标签。

相对路径：//meta，这种方式就比较简单，如下图：

通过相对路径查找时，又可以分为以下几种方式：

场景：通过相对路径查找 form 标签下面的 input 标签，发现 input 标签有多个，所以，可以通过以下几种方式定位。(注意：这里的索引是以1开始的)

• 相对路径+索引

  路径：//form/input[1]

  

• 相对路径 + 属性的值

  场景：找到 form 标签下 name 属性等于 ”ie“的 input 标签

  路径：//form /input[@name=“ie”]

​

• 相对路径 + 通配符

  找到当前路径下面所有等于 hidden 的标签

  路径：// [@*=“hidden”]*

• 相对路径 + 文本匹配

  场景：寻找加载某个标签中的文本，例如下图的 a 标签。

  路径：//a[text()=“新闻”]

  

CSS 选择器和 xpath的区别

CSS 选择器的效率比xpath高，因为，xpath 是通过路径来确定某个元素的，所以有一个路径扫描的开销。

通过Java代码实现自动化

1. 定位元素

场景：通过 Java 代码打开浏览器，定位“百度一下”按钮，如下图：

代码实现：

 public static void main(String[] args) {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定页面
        webDriver.get("https://www.baidu.com");
        //通过 CSS 选择器定位元素
//        WebElement element = webDriver.findElement(By.cssSelector("#su"));
        //通过xpath方式定位元素
        WebElement element = webDriver.findElement(By.xpath("//*[@id=\"su\"]"));
        if(element == null) {
            // 表示当前页面中没有指定的元素
            System.out.println("当前页面没有指定的元素");
        }else {
            System.out.println("测试成功");
        }
    }

小技巧：

在这里指定定位元素时，需要按照前端的语法进行写代码，所以，有的同学可能会觉得麻烦，下面交给同学们一个小技巧：

2. 关闭浏览器

关闭浏览器有两种方式：

• close()
• quit()

在打开浏览器时，也会保存一些 Cookie，使用 quit() 关闭浏览器时，会将浏览器中的 Cooike 也清除掉，而 close() 不会。

3. 获取元素文本

第一种情况：

场景：获取下图中地图按钮上的文本，也就是“地图”文本

   private static void test6() {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定浏览器页面
        webDriver.get("https://www.baidu.com");
        // 定位按钮
        WebElement element = webDriver.findElement(By.cssSelector("#s-top-left > a:nth-child(3)"));
        // 获取文本
        System.out.println(element.getText());
    }

执行结果：

第二种情况：

场景：获取”百度一下“按钮中的文本

如果再使用 getText() 方法就不会获取到，如下图：

原因：

”地图“ 文本是在两个 a 标签中间夹着，所以通过 getText() 可以获取到，这也就说明了 getText() 用于获取到标签中的文本，但是，”百度一下“ 文本是一个属性的值，所以会报错。

解决方法：获取属性的值使用 getAttribute()

  private static void test6() {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定浏览器页面
        webDriver.get("https://www.baidu.com");
        // 定位按钮
        WebElement element = webDriver.findElement(By.cssSelector("#su"));
        // 获取文本
        System.out.println(element.getAttribute("value"));
    }

4. 鼠标点击与键盘输入

场景：通过代码在百度的输入框中输入“软件测试”，然后点击百度一下按钮进入新的页面，在新的页面中查找文本为”软件测试“的元素。

需要使用到的API：

sendkeys(要输入的文本)：自动输入文本

click()：自动点击选择的按钮

代码实现：

private static void test2() throws InterruptedException {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定浏览器页面
        webDriver.get("https://www.baidu.com");
        // 定位输入框
        WebElement importInput = webDriver.findElement(By.cssSelector("#kw"));
        // 输入文本
        importInput.sendKeys("软件测试");
        // 定位按钮
        WebElement clickButton = webDriver.findElement(By.cssSelector("#su"));
        // 进行点击
        clickButton.click();
        // 获取搜索到的页面中指定的所有元素
        // 因为元素不止一个，所以使用findElements
        // 进行一个睡眠，等待页面加载出来在寻找元素
        sleep(3000);
        List<WebElement> elements = webDriver.findElements(By.cssSelector("a em"));
        sleep(3000);
        //遍历list
        for(int i = 0; i < elements.size(); i++) {
            if(elements.get(i).getText().equals("软件测试")) {
                //如果元素是“软件测试”则表示测试成功，否则测试失败
                System.out.println("测试成功");
            }else{
                System.out.println("测试失败");
            }
        }
    }

submit() 与 click() 的区别

click() 是点击，submit() 都是提交，而submit() 是提交form标签，submit 操作的元素需要放在 form 标签中，如果不是 form 标签，使用 submit() 进行提交后，在返回时就会报错。而 click() 就没有任何限制。

5. 清空内容

场景：清空输入框中的元素

    private static void test3() {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定浏览器页面
        webDriver.get("https://www.baidu.com");
        // 定位输入框
        WebElement importInput = webDriver.findElement(By.cssSelector("#kw"));
        // 输入文本
        importInput.sendKeys("软件测试");
        //清空输入框中内容
        importInput.clear();
    }

6.打印信息

1. 打印 title

   

   代码实现：

   private static void test7() {
           // 创建浏览器驱动
           WebDriver webDriver = new ChromeDriver();
           // 指定浏览器页面
           webDriver.get("https://www.baidu.com/");
           // 获取页面的title
           String title = webDriver.getTitle();
           System.out.println("当前页面的title：" + title);
           // 关闭浏览器
           webDriver.quit();
       }
   

   执行结果：

   

2. 获取当前页面的 URL

   getCurrentUrl（）

代码实现：

private static void test8() {
        // 创建浏览器驱动
        WebDriver webDriver = new ChromeDriver();
        // 指定浏览器页面
        webDriver.get("https://www.baidu.com/");
        //获取当前页面的url
        String currentUrl = webDriver.getCurrentUrl();
        //判断当前页面的url与指定跳转的页面的url是否相同
        if(currentUrl.equals("https://www.baidu.com/")) {
            System.out.println("测试通过,当前页面url:" + currentUrl);
        }else {
            System.out.println("测试不通过");
        }
        webDriver.quit();
    }