Protractor-对象 - 芒果文档

📌 相关文章

📜 Protractor-对象

📅 最后修改于: 2020-12-06 10:24:43 🧑 作者: Mango

本章详细讨论了量角器中的对象。

什么是页面对象?

页面对象是一种设计模式，已广泛用于编写端到端测试，以增强测试维护并减少代码重复。可以将其定义为面向对象的类，用作指向AUT(被测应用程序)页面的接口。但是，在深入研究页面对象之前，我们必须必须了解自动化UI测试所面临的挑战及其处理方式。

自动UI测试面临的挑战

以下是自动化UI测试的一些常见挑战-

使用者介面变更

使用UI测试时，最常见的问题是UI中发生了更改。例如，通常大多数情况下按钮或文本框等会发生更改并为UI测试带来问题。

缺少DSL(特定于域的语言)支持

UI测试的另一个问题是缺少DSL支持。有了这个问题，就很难理解正在测试什么。

大量重复/代码重复

UI测试中的下一个常见问题是重复或代码重复很多。可以通过以下几行代码来理解-

element(by.model(‘event.name’)).sendKeys(‘An Event’);
element(by.model(‘event.name’)).sendKeys(‘Module 3’);
element(by.model(‘event.name’));

艰难的维护

由于上述挑战，维护变得头疼。这是因为我们必须找到所有实例，并用新名称，选择器和其他代码替换。我们还需要花费大量时间使测试与重构保持一致。

测试失败

UI测试的另一个挑战是测试中发生许多失败。

应对挑战的方法

我们已经看到了UI测试的一些常见挑战。解决这些挑战的一些方法如下-

手动更新参考

处理上述挑战的第一个选择是手动更新参考。这个选项的问题是我们必须在代码和测试中进行手动更改。当您有一个或两个测试文件时可以完成此操作，但是，如果一个项目中有数百个测试文件怎么办?

使用页面对象

解决上述挑战的另一种方法是使用页面对象。页面对象基本上是一个普通的JavaScript，它封装了Angular模板的属性。例如，以下规范文件是在没有页面对象的情况下编写的，以了解它们的区别-

没有页面对象

describe('angularjs homepage', function() {
   it('should greet the named user', function() {
      browser.get('http://www.angularjs.org');
      element(by.model('yourName')).sendKeys('Julie');
      var greeting = element(by.binding('yourName'));
      expect(greeting.getText()).toEqual('Hello Julie!');
   });
});

带页面对象

为了使用Page Objects编写代码，我们要做的第一件事是创建一个Page Object。因此，上述示例的Page Object可能看起来像这样-

var AngularHomepage = function() {
   var nameInput = element(by.model('yourName'));
   var greeting = element(by.binding('yourName'));

   this.get = function() {
      browser.get('http://www.angularjs.org');
   };

   this.setName = function(name) {
      nameInput.sendKeys(name);
   };
   
   this.getGreetingText = function() {
      return greeting.getText();
   };
};
module.exports = new AngularHomepage();

使用页面对象组织测试

我们已经在上面的示例中看到了页面对象的使用，以应对UI测试的挑战。接下来，我们将讨论如何使用它们来组织测试。为此，我们需要修改测试脚本而不修改测试脚本的功能。

例

为了理解这个概念，我们将上面的配置文件与页面对象一起使用。我们需要修改测试脚本，如下所示：

var angularHomepage = require('./AngularHomepage');
describe('angularjs homepage', function() {
   it('should greet the named user', function() {
      angularHomepage.get();

      angularHomepage.setName('Julie');
   
      expect(angularHomepage.getGreetingText()).toEqual
      ('Hello Julie!');
   });
});

在这里，请注意，页面对象的路径将相对于您的规范。

同样，我们还可以将测试套件分为多个测试套件。然后可以如下更改配置文件

exports.config = {
   // The address of a running selenium server.
   seleniumAddress: 'http://localhost:4444/wd/hub',

   // Capabilities to be passed to the webdriver instance.
   capabilities: {
      'browserName': 'chrome'
   },
   // Spec patterns are relative to the location of the spec file. They may
   // include glob patterns.
   suites: {
      homepage: 'tests/e2e/homepage/**/*Spec.js',
      search: ['tests/e2e/contact_search/**/*Spec.js',
         'tests/e2e/venue_search/**/*Spec.js']
   },

   // Options to be passed to Jasmine-node.
   jasmineNodeOpts: {
      showColors: true, // Use colors in the command line report.
   }
};

现在，我们可以轻松地在运行一个或另一组测试之间进行切换。以下命令将仅运行测试的主页部分-

protractor protractor.conf.js --suite homepage

类似地，我们可以使用以下命令运行特定的测试套件-

protractor protractor.conf.js --suite homepage,search