#学习笔记#e2e学习使用（一）

本文仅限于记录本人学习的过程，以及怎么踩的坑，是如何解决的。逻辑确定是混乱的，有用之处会抽出共通另行发帖。

 

最终目标：要运用于Vue项目中，进行功能测试甚至自动化测试。

 

1、e2e概念

• 理解：end to end，端到端，前端到后端整个过程的测试（也叫功能测试/链接测试）。

　　　　　 主要是测业务，绝大部分状况是指在浏览器上对某个网站进行某个的操做，好比：登陆。

　　　　　 模拟用户操做。

• 特征：e2e是由Nightwatch + Selenium 搭建的（未作深刻考究别认真）测试环境。

　　　　　　把整个系统看成一个黑盒；

　　　　　 测试人员模拟真实用户在浏览器中操做UI；

　　　　　 测试出的问题多是前端也多是后端致使的。

　　　　 -- Nightwatch 是一款 Test Runner，能够简单理解为Selenium 的控制软件，它将提供一系列接口供咱们编写测试案例，同时也是与现有前端项目结合的桥梁；

　　　　 -- Selenium 是一款 Web 的自动化测试环境，它将帮咱们搭建好测试环境，调取系统安装的浏览器，在浏览器里执行一切自动化行为。

• 运行过程：

　　　　1.  测试编写测试脚本

　　　　2.  runner.js 引入依赖、浏览器内核并运行脚本

　　　　3.  nightwatch.js 在后台打开一个 java 进程，用于操做浏览器

　　　　4.  java 进程收到脚本的指令

　　　　5.  java 进程操做浏览器

•  流程一览：

 　　　  1.  检查环境（node.js、vue-cli、【webpack】、jdk、）

 　　　  2.  使用 Vue + Webpack 构建vue项目：#vue init webpack vue-project ，选择e2e、nightWatch

 　　　  3.  npm run e2e

 　　　  4.  编写测试代码，测试用例，运行测试

 　　　  5. 结果分析

• 为何须要jdk？ 

　　　　运行过程当中，java进程须要jdk支持

 

2、项目搭建

　0、安装jdk【点击进入】

　　查看默认安装的openJDK：#rpm -qa | grep openjdk

 

  一、建立Git知识库，克隆到本地

　　#git clone https://github.com/MrLittlepirate/vue-e2eDemo.git

　　

 

 二、进入项目根目录，搭建vue项目

　#vue init webpack vue-e2eDemo

　

 

  三、first cmmit

　还不会git命令直接提交，采用在VSCode中提交。

　pull (拉取) --> commit all（提交所有） --> push （推送）

 

   四、 npm run e2e

　 终端，转到项目根目录，运行命令

 # npm run e2e　

   报错：

      Error： Cannot find module 'chromedrive'

　　

　　

　　

　缘由：

 　   没有安装chrome驱动

   解决：

     解决chorm驱动问题：    

   #npm install chromedriver　　

    仍然报错：

　　ChromeDriver installation failed Error with http(s) request: Error: connect ETIMEDOUT 172.217.160.112:443  

　　多是不能翻（F）墙（Q）的问题？？？【百度出来的额】

　换命令：　

　　#cnpm install chromedriver

　　

   再次运行npm run e2e，报错以下：

       Error retrieving a new session from the selenium server

       Connection refused! Is selenium server started?

　　

   此时我认为错误缘由是：虚拟机中 centos7 没有安装Chrome浏览器致使的。目前只有自带的firefox，且还不打算下载Chrome，因此决定把浏览器的链接修改成firefox：

   配置文件： /test/e2e/runner.js

 if (opts.indexOf('--env') === -1) { // opts = opts.concat(['--env', 'chrome']) 原来的注释掉
    opts = opts.concat(['--env', 'firefox']) }

   再次npm run e2e，报错以下：

　　

  仔细检查了一下/test/e2e/runner.js配置文件，发现以前修改Chrome时还有一处须要改动【其实彻底没有必要】：

 selenium: { start_process: true, server_path: require('selenium-server').path, host: '127.0.0.1', port: 4444, // cli_args: { 原来的注释掉
    // 'webdriver.chrome.driver': require('chromedriver').path
    // } },

   因为 selenium 打开火狐浏览器不须要驱动（只须要正确安装便可正常启动），故而不须要install 火狐driver。

   运行仍报相同的错。嗯，没办法了，只能先把 jdk 安装一波了。

 

二、安装JDK1.8 Linux64bit【点进进入“正经”的安装过程】

// =====  若是你不是我本人，彻底不必看这部分 =========

(1) Oracle 官网下载时，须要登陆帐号接收协议（我是没有跳过帐号一这步），忙活了一阵子，去搜了免费分享的JDK，感谢大佬。

JDK8下载|JDK1.8下载可选择window版和linux版

(2) 综合这两个教程安装的：

 Centos7 JDK8的安装配置 ：解压缩 && 配置环境变量JAVA_HOME

 在Centos下用alternative命令切换各个版本的jdk的方法 ：能够不卸载Linux自带的OpenJDK，只切换你当前要用的版本就行。

 

正确操做步骤：

　　【在opt目录下解压缩 --> 配置JAVA_HOME环境变量 --> 用alternatives命令：登记个新的jdk在 alternatives 里面 --> alternatives --config java 切换要用的JDK】

 

实际操做步骤截图（顺序其实有误的，无知踩坑，最终ok）：

step1：拷贝JDK压缩包到 /usr/java 

 

Step2：用alternatives命令

Step3：切换JDK

 

step4:查看java版本

【巨坑：都尚未解压缩安装，怎么可能会有此命令哼哼！】

 

step5：配置JAVA_HOME环境变量：

在/etc/profile 文件末尾新增如下内容：

#JDK1.8 export JAVA_HOME=/opt/jdk1.8.0_11 export JAVA_BIN=/opt/jdk1.8.0_11/bin  
export PATH=$PATH:$JAVA_HOME/bin  
export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar export JAVA_HOME JAVA_BIN PATH CLASSPATH

step6：输入重启命令：reboot 

step7：重启后打开终端输入 java -version查看，仍然报【bash java：未找到命令....】的错误。

step8：解压缩安装JDK1.8【应该在最开始就作这个操做】

step9：将解压缩后的文件夹【jdk1.8.0_11】移动到  /opt 目录下

　　—— 由于以前配置的JAVA_HOME路径是  /opt/jdk1.8.0_11

 

step10: java -version

终于OK了，被蠢到了，无语凝噎。

注：若是仍是不对，就把以前的alternative命令再执行一遍。

 

三、再次运行e2e：

#npm run e2e

 

四、无限多的坑：

无用功1：以后我又下载了selenium-server-sandalone-3.8.1.jar   和  selenium-html-runner-3.8.1.jar，用java -jar selenium-server-sandalone-3.8.1.jar 命令安装。install --save-dev selenium    install --save-dev selenium-standalone  等命令没用。

无用功2：更新firefox

无用功3：修改配置文件

  

五、最终：

• 下载安装Chrome浏览器：Centos7 yum安装chrome浏览器
•  从新建了一个vue项目【vue install webpack my-project】，没有修改任何配置文件，建立的时候 chromedriver 安装失败了，因此须要单独install：

#npm install chromedriver　　

          在下一步运行e2e以前，我还用了这两个命令，虽然不知道有没有什么用：

#npm install selenium-service
#npm install nightwatch

• 运行e2e：

#npm run e2e

　　报错：Error：socket hang up 

       

　   大体意思就是selenium仍是没有成功启动浏览器，最后一句应该是断开/挂起了。

　　解决：

　　　　换一个帐号（非root权限）登陆，这下npm run e2e就好了！！

      

   我用的虚拟机，习惯很差一直用的root帐号，这下撞墙了—— Chrome默认不能以root身份运行 Google Chrome浏览器，请以普通用户身份启动“Google Chrome浏览器“。

   有关如何容许 root 启动 Google Chrome浏览器，请点击“设置root启动Chrome”。

 

六、编写测试代码、测试用例

见#学习笔记#e2e学习使用（二）

  

资料：

一、怎么为大中型的vue.js项目编写e2e测试？

二、前端自动化测试是干吗的？

三、搭建本身的前端自动化测试脚手架（一）

四、Centos7 JDK8的安装配置 

五、使用nightwatch进行E2E测试中文教程