浏览器自动化操作标准--WebDriver

WebDriver是一个浏览器远程控制协议，是一个既定标准，它本身的内容非常丰富，本文不可能全部介绍，本文仅粗略带大家了解一下WebDriver的部分内容以及一个小的实际应用。想深入了解的请参考W3C文档WebDriver.

问题背景

开发的同学都知道公司为了便于开发和测试都会有多套环境，比如dev开发环境、qa测试联调环境、pre预发模拟线上环境、online线上环境。经常切环境也是一个比较繁琐的事情，简单来说，作为一个前端开发，频率最高的操作路径是：

1.通过SwitchHosts切换host

2.选择目录和网关（由于环境不够用，但是又需要部署多套代码。为了解决这个问题，我们利用nginx来在一台机器上配置多个目录，每个目录对应不同的代码，当你访问这个页面的时候，网关会记住你所选择的目录，进而对你的请求进行相应的转发）

3.登录网页进行ui调试和接口联调

SwitchHosts切换host还算方便，但是选择目录、选择网关、打开网页输入用户名密码然后点登录，这个过程操作频率比较高，有点繁琐。能不能自动化这个过程呢？熟悉自动化测试的同学对这个就非常了解了，端到端测试就是利用自动化测试套件模拟用户访问网页的过程。这里我采用selenium-webdriver这个库，通过node来执行自动化脚本，代码如下。

那么selenium-webdriver到底是如何与浏览器进行交互的？如何与不同的浏览器进行交互呢？

下面就要引入主角了—— WebDriver, WebDriver是W3C的一个标准，它是一个标准，所以不同的浏览器都会有自己的实现，而selenium-webdriver是通过WebDriver协议与浏览器进行交互的。

WebDriver是什么

WebDriver是W3C的一个标准，是一个远程控制协议，它提供了跨平台和跨语言的方式来远程操控浏览器，它提供了一系列接口来访问和操作DOM，进而控制浏览器的行为。它使得web开发者能写一些自动化脚本来测试网页。

WebDriver的工作过程

（主要参考：https://blog.csdn.net/ant_ren...）
浏览器在启动后会在某一个端口启动基于WebDriver协议的Web Service，接下来我们调用WebDriver的任何api时，都需要借助一个ComandExecutor发送一个命令（也就是给监听端口上的Web Service发送一个http请求），这个命令会告诉浏览器接下来要做什么。

WebDriver的实际应用

selenium-webdriver

这是一个浏览器自动化库，它提供了许多浏览器自动化接口，用于测试web应用。
除了通过npm安装selenium-webdriver之外，还需要安装浏览器相应的驱动。
它相应的api和用法selenium-webdriver

在我们new一个WebDriver的过程中，selenium首先会确认浏览器的native component是否存在可用而且匹配的版本，然后就在目标浏览器里启动一整套Web Service，这套Web Service使用了selenium自己设计定义的协议，名字叫做The WebDriver Wire Protocol。这套协议非常之强大，几乎可以操作浏览器做任何事情，包括打开、关闭、最大化、最小化、元素定位、元素点击、上传文件等等。

参考资料

https://www.cnblogs.com/linbo...
https://cloud.tencent.com/dev...
http://www.cnblogs.com/sunada...