如何使用Selenium WebDriver和Mocha测试JavaScript

最新推荐文章于 2020-05-28 07:53:43 发布

dingshi7798

最新推荐文章于 2020-05-28 07:53:43 发布

阅读量447

点赞数

文章标签：测试 python javascript ViewUI

本文最初在TestProject上发布。

如果您希望使用JavaScript编写功能测试，则以下教程为UI自动化工程师提供了使用Selenium WebDriver 3 ，Mocha和NodeJS进行JavaScript测试的完美结构参考资料。

如今，JavaScript是一种无处不在的Web语言，似乎克服了其“臭名昭著”的过去，并且不仅对于客户端，而且对于服务器域，已经成为一个更可靠的平台。 Mocha.js，或者简称为Mocha，是一个运行在Node.js上的功能丰富的JavaScript测试框架，它提供了平台和API，可在其基础上使用Google的V8 JavaScript引擎在服务器端构建独立的应用程序。

*注意：要开始学习此JavaScript教程，您需要熟悉NodeJS和JavaScript编程语言的基础。

教程概述：

1.摩卡测试构造

介绍
安装
安装Chai断言模块
测试套件和测试用例结构
用Mocha构建测试
运行Mocha的测试套件和测试用例
管理异步测试代码的同步

2.使用与MochaJS集成的Javascript Selenium 3 API

硒介绍
硒安装
WebDriver构建
将MochaJS与Selenium WebDriver 3集成

使用的版本：

使用的节点版本：6.10.1（LTS）
摩卡咖啡：2.5.3
WebDriverJS：3.3.0

1.使用Mocha构建测试

摩卡简介

如前所述，Mocha是一个JavaScript测试框架，可在Node上运行测试。 Mocha通过npm以Node包的形式出现，允许您使用任何库进行断言，以替代Node的标准“断言”功能，例如ChaiJS。此外，Mocha具有与Jasmine类似的几个组件， Jasmine是我们在研究前端和单元测试自动化趋势时提到的另一个流行的测试自动化框架。

Mocha提供了一个API，该API指定了一种将测试代码结构化为测试套件和测试用例模块以供执行的方法，然后可以生成测试报告。 Mocha提供两种运行模式：通过命令行（CLI）或以编程方式（Mocha API）。

安装摩卡

如果要在CLI中使用Mocha，则应将其作为Node.js全局安装。

npm install -g mocha

安装Chai断言模块

npm install --save chai

–save选项用于在项目范围内而非全局安装模块。

测试套件和测试用例结构

在Mocha中，测试套件由接受回调函数的'describe'关键字定义。一个测试套件可以包含子/内部测试套件，它们可以包含自己的子测试套件，等等。一个测试用例由“ it”函数表示，该函数接受一个回调函数并包含测试代码。

Mocha支持测试套件设置和测试用例设置功能。测试套件设置由before表示，而测试用例设置适用于beforeEach 。 beforeEach实际上是套件中每种情况的通用设置，并且将在每种情况之前执行。

与设置一样，Mocha支持测试套件和测试用例拆卸功能。测试套件的拆卸用after表示，而测试用例的拆卸用afterEach来实现， afterEach函数分别在测试套件之后和每个测试用例之后执行。

创建一个将“托管”测试套件的文件，例如test_suite.js，并将以下内容写入其中：

describe("Inner Suite 1", function(){

    before(function(){

        // do something before test suite execution
        // no matter if there are failed cases

    });

    after(function(){

        // do something after test suite execution is finished
        // no matter if there are failed cases

    });

    beforeEach(function(){

        // do something before test case execution
        // no matter if there are failed cases

    });

    afterEach(function(){

        // do something after test case execution is finished
        // no matter if there are failed cases

    });

    it("Test-1", function(){

        // test Code
        // assertions

    });

    it("Test-2", function(){

        // test Code
        // assertions

    });

    it("Test-3", function(){

        // test Code
        // assertions

    });

});

运行Mocha测试套件和测试用例

Mocha支持以三种方式执行测试：整个Test Suite文件，通过“ grep”模式过滤的测试以及在目录树中查找的grep过滤测试（递归选项）

运行整个测试套件文件：

mocha /path/to/test_suite.js

运行特定套件或从特定套件文件进行测试。

如果选择了套件，则将执行所有子套件和/或测试。

mocha -g “Test-2” /path/to/test_suite.js

通过在目录树中递归搜索来运行特定的套件或测试文件。

mocha --recursive -g “Test-2” /directory/

有关广泛的CLI选项：

mocha –-help

管理异步测试代码的同步

如果异步功能与Mocha一起使用并且未正确处理，则可能会遇到麻烦。如果要在测试案例中使用异步代码（例如，http请求，文件，硒等），请遵循以下准则来克服意外结果：

1. done功能

在您的测试函数（ it ）中，您需要将done函数向下传递给回调链-这可以确保在最后一步之后执行该函数。

下面的示例强调完成的功能。在这种情况下，测试功能结束时将发生三秒钟的超时。

it(‘Test-1’, function(done){

    setTimeout(function(){

        console.log(“timeout!”);

  // mocha will wait for done to be called before exiting function.
        done();     
    }, 3000);

});

2.退货承诺

返回承诺是确保使用异步功能时Mocha已执行所有代码行的另一种方式（在这种情况下，不需要“完成”功能。）

it(‘Test-1’, function(done){

    var promise;
    promise = new Promise(function(resolve, reject){
        setTimeout(function(){

            console.log("Timeout");
            resolve();

        }, 3000);

    });
    // mocha will wait for the promise to be resolved before exiting
    return promise;  
});

2. Javascript Selenium 3与MochaJS的集成

硒介绍

Selenium是一个控制Web浏览器并模拟用户行为的库。更具体地说，Selenium为用户提供了称为“绑定”的特定语言库API。这些“绑定”充当客户端，以执行对中间组件的请求，充当服务器，以最终控制浏览器。

硒API或绑定现在已存在于所有流行的开发语言中。现在，所有语言实现都同意与API函数的命名约定保持一致。

中间组件可以是实际的Webdriver，可以在每个Selenium软件包中本地找到，也可以是selenium-standalone-server，也可以是供应商本地浏览器控制驱动程序-例如Mozilla的Geckodriver，Chrome的chromedriver等。此外，Selenium Webdriver与通过“ JsonWired协议”的浏览器驱动程序，并成为W3C Web标准。

硒安装

在深入研究与MochaJS的Selenium集成之前，我们将快速了解一下NodeJS的Selenium实现。

为了将Selenium API用于JavaScript（或Selenium JavaScript绑定），我们应该安装适当的模块：

npm install selenium-webdriver

在这一点上，应该澄清Javascript Selenium WebDriver也可以称为Webdriverjs（尽管在npm中不是）。 Webdrivejs与其他库/模块（例如WebdriverIO ，Protractor等）不同。selenium -webdriver是官方的开源基础JavaScript Selenium库，而其他是基于webdriverjs API构建的包装库/框架，声称可以增强可用性和维护。

在NodeJS代码中，该模块由以下人员使用：

require(‘selenium-webdriver’)

WebDriver构建

为了能够使用Selenium，我们应该构建适当的“ webdriver”对象，该对象随后将控制我们的浏览器。在下面，我们可以看到如何使用“ Builder”模式通过链接多个函数来构造一个webdriver对象。

带有选项的生成器

var webdriver = require('selenium-webdriver')
var chrome = require('selenium-webdriver/chrome'),
var firefox = require('selenium-webdriver/firefox');

var driver = new webdriver.Builder()
    .forBrowser(‘firefox’)
    .setFirefoxOptions( /* … */)
    .setChromeOptions( /* … */)
    .build();

在上面的代码中，尽管forBrowser()方法显式设置了firefox ，但我们设法构建了一个WebDriver对象，该对象聚集了多个浏览器的配置（请注意'options'方法）。

用户可以在运行时设置SELENIUM_BROWSER环境变量来设置所需的浏览器。因为我们已经通过set<browser_name>Options配置了多个浏览器功能，它将覆盖forBrowser设置的任何set<browser_name>Options 。

浏览器属性可以具有多种类型的信息，具体取决于所测试的浏览器。例如，在Mozilla的属性中，我们可以如下设置所需的“配置文件”配置：

var profile = new firefox.Profile( /* … path to firefox local profile … */);
var firefoxOptions = new firefox Options().setProfile(profile);

然后，在上面的Builder片段中，我们可以添加：

‘setFirefoxOptions( firefoxOptions )’

具有能力的建设者

Selenium WebDriver JavaScript API记录了构建Webdriver的几种方法。另一种可能的方式是通过在功能中设置所有必需的驱动程序配置：

var driver = new webdriver.Builder().
    .withCapabilities( { ‘browserName’ : ‘firefox’ } )
    .build();

请注意，如果在withCapabilities之后设置setOptions，则配置将被覆盖（例如，代理配置）。

Selenium WebDriver控制流和承诺管理

由于JavaScript和NodeJS基于异步原理，因此Selenium WebDriver的行为类似。为了避免回调金字塔并帮助测试工程师获得脚本编写经验以及代码的可读性和可维护性，Selenium WebDriver对象包含使用“ ControlFlow”的Promise Manager。 “ ControlFlow”是负责异步webdriver命令的顺序执行的类。

实际上，每个命令都在driver对象上执行，并返回一个Promise。除非需要按以下方式处理promise解析的值，否则下一个命令不需要嵌套在“ thens”中：

driver.get("http://www.google.com");
driver.getTitle().then(function( title ) {

    // google page title should be printed 
    console.log(title)

});

driver.quit();

使用Selenium WebDriver和Mocha进行JavaScript测试的指针

driver是一个webdriver对象，不是 promise对象
driver.getTitle()或driver.get(url)或任何其他Selenium命令都返回一个driver.get(url)对象！

这意味着我们可以执行以下操作：

var titlePromise = driver.getTitle();
titlePromise.then(function(title){

    console.log(title);

});

此外，由于driver在其基础上处于异步状态，因此以下操作将不起作用：

var title = driver.getTitle();
expect (title).equals("Google");

注意： title是一个promise对象，而不是实际的解析值。

MochaJS + Selenium WebDriver

一般来说，Selenium WebDriver可以与MochaJS集成，因为它可以在任何普通的NodeJS脚本中使用。但是，由于Mocha在调用done()或返回promise之前不知道异步函数何时完成，因此我们在处理时必须非常小心。

基于承诺

Selenium命令会自动注册，以确保以正确的顺序执行webdriver命令，并应返回承诺。

下面的代码显示了它挂接的Mocha的（之前，之前，之后，之后）或测试用例主体。

describe( 'Test Suite' , function(){

    before(function(){

        driver.get( my_service );
        driver.findElement(webdriver.By.id(username)).sendKeys(my_username);

        // a promise is returned while ‘click’ action
        // is registered in ‘driver’ object
        return driver.findElement(webdriver.By.id(submit)).click();
    });

    after(function(){

        return driver.quit();

    });

    it( 'Test Case', function(){

        driver.getTitle().then(function(title){
            expect(title).equals(my_title);
        })

将执行以下操作：

加载“ my_service”的浏览器页面
标识为“用户名”的文本字段
ID为“用户名”的文本字段填充为“ my_username”
检索页面标题并检查与“ my_title”是否相等
WebDriver退出，浏览器窗口关闭。浏览器进程终止。

Selenium Webdriver对MochaJS的支持

为了以一种简单的方式使用Selenium WebDriver和Mocha执行JavaScript测试，WebDriver通过将MochaJS测试函数（之前，之前，每个等）包装到test对象中来促进MochaJS的使用。这将创建一个范围，使您可以意识到正在使用WebDriver。因此，不需要承诺回报。

首先，应加载相应的模块：

var test = require('selenium-webdriver/testing');

Mocha的所有功能均以“测试”开头。如下：

test.before()
test.describe()

等等。然后，将以上代码完全重写为：

test.describe( 'Test Suite' , function(){

    test.before(function(){

        driver.get( my_service );
        driver.findElement(webdriver.By.id(username)).sendKeys(my_username);
        driver.findElement(webdriver.By.id(submit)).click();
    });

    test.after(function(){
        driver.quit();
    });

    test.it( 'Test Case' , function(){

        driver.getTitle().then(function(title){
            expect(title).equals(my_title);
        })

        driver.sleep();
    });

});

结论

在本教程中，我们有机会体验Selenium WebDriver和MochaJS的JavaScript测试。由于NodeJS，MochaJS和Selenium WebDriver的异步特性，与其他编程语言绑定相比，我们应该牢记主要区别。

只要我们在创建诺言的任何函数（自定义测试库函数或MochaJS钩子/测试用例）中始终返回诺言，Mocha就会以正确的顺序执行它们。

其他框架（例如WebdriverIO，Protractor和CodeseptJS）提供了包装解决方案，这些解决方案对用户隐藏了一些配置，并提供了一些应许增强的处理，以提供更好的脚本体验，许多测试自动化专家可能会从中找到帮助。

From: https://www.sitepoint.com/how-to-test-your-javascript-with-selenium-webdriver-and-mocha/

dingshi7798

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
如何使用Selenium WebDriver和Mocha测试JavaScript

这篇文章最初发表在TestProject 。如果您正在寻找在JavaScript编写功能测试，下面的教程提供UI自动化工程师与完美结构的参考材料为JavaScript的测试与硒的webdriver 3 ，摩卡和的NodeJS。这些天来，JavaScript是这似乎克服了“臭名昭著”过去的已经成为了更坚实的平台，不仅为客户端，但对于服务器领域也无处不在的网络语言。 Mocha.js，或者干...
复制链接

扫一扫