淘先锋技术网

首页 1 2 3 4 5 6 7

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

问题背景

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

1.通过SwitchHosts切换host

clipboard.png

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

clipboard.png

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请求),这个命令会告诉浏览器接下来要做什么。

clipboard.png

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...