在本章中，让我们详细了解量角器的样式指南。

介绍

样式指南由两位软件工程师创建，分别是ING的前端工程师Carmen Popoviciu和Google的软件工程师Andres Dominguez 。因此，此样式指南也称为Carmen Popoviciu和Google的量角器样式指南。

该样式指南可分为以下五个关键点-

• 通用规则
• 项目结构
• 定位器策略
• 页面对象
• 测试套件

通用规则

以下是使用量角器进行测试时必须注意的一些通用规则-

不要端到端测试已经进行过单元测试的内容

这是卡门和安德烈斯给出的第一个通用规则。他们建议我们不要对已经进行过单元测试的代码执行端到端测试。其背后的主要原因是单元测试比e2e测试快得多。另一个原因是，为了节省时间，我们必须避免重复测试(不要同时执行单元测试和e2e测试)。

仅使用一个配置文件

建议的另一个重要点是，我们必须仅使用一个配置文件。不要为要测试的每个环境创建配置文件。您可以使用grunt-protractor-coverage来设置不同的环境。

避免对测试使用逻辑

我们必须避免在测试用例中使用IF语句或FOR循环，因为如果这样做，则测试可能会通过而不进行任何测试，或者运行速度可能很慢。

使测试在文件级别独立

启用共享后，量角器可以并行运行测试。这些文件将在可用时在不同的浏览器中执行。 Carmen和Andres建议至少在文件级别使测试独立，因为量角器将执行的顺序不确定，而且单独进行测试非常容易。

项目结构

有关量角器样式指南的另一个重要要点是项目的结构。以下是关于项目结构的建议-

在合理的结构中摸索e2e测试

卡门和安德烈斯建议，我们必须将e2e测试分组到对您的项目结构有意义的结构中。该建议背后的原因是，查找文件将变得容易，并且文件夹结构将更具可读性。此步骤还将e2e测试与单元测试分开。他们建议应避免以下结构-

|-- project-folder
   |-- app
      |-- css
      |-- img
      |-- partials
         home.html
         profile.html
         contacts.html
      |-- js
         |-- controllers
         |-- directives
         |-- services
         app.js
         ...
      index.html
   |-- test
      |-- unit
      |-- e2e
         home-page.js
         home-spec.js
         profile-page.js
         profile-spec.js
         contacts-page.js
         contacts-spec.js

另一方面，他们推荐以下类型的结构-

|-- project-folder
   |-- app
      |-- css
      |-- img
      |-- partials
         home.html
         profile.html
         contacts.html
      |-- js
         |-- controllers
         |-- directives
         |-- services
         app.js
         ...
      index.html
   |-- test
      |-- unit
      |-- e2e
         |-- page-objects
            home-page.js
            profile-page.js
            contacts-page.js
         home-spec.js
         profile-spec.js
         contacts-spec.js

定位器策略

以下是使用量角器进行测试时必须注意的一些定位器策略-

永远不要使用XPATH

这是量角器样式指南中推荐的第一个定位器策略。造成这种情况的原因是XPath需要大量维护，因为标记很容易更改。而且，XPath表达式是最慢的并且很难调试。

始终喜欢量角器特定的定位器，例如by.model和by.binding

量角器特定的定位符(例如by.model和by.binding)简短，特定且易于阅读。在他们的帮助下，也很容易编写我们的定位器。

例

视图

   
{{color.name}}
   
{{color.shade}}
   
{{color.code}}



   

      
   

对于上面的代码，建议避免以下情况-

var nameElement = element.all(by.css('.red li')).get(0);
var personName = element(by.css('.details .personal input'));

另一方面，建议以下使用-

var nameElement = element.all(by.css('.red li')).get(0);
var personName = element(by.css('.details .personal input'));

var nameElement = element(by.binding('color.name'));
var personName = element(by.model('person.name'));

如果没有可用的量角器定位器，则建议使用by.id和by.css。

始终避免使用文本定位器来频繁更改文本

我们必须避免使用基于文本的定位器，例如by.linkText，by.buttonText和by.cssContaningText，因为按钮，链接和标签的文本会随时间频繁变化。

页面对象

如前所述，页面对象封装了有关应用程序页面上元素的信息，因此，这有助于我们编写更简洁的测试用例。页面对象的一个非常有用的优点是，它们可以在多个测试中重复使用，并且如果我们的应用程序模板已更改，我们只需要更新页面对象即可。以下是针对使用量角器进行测试时必须注意的页面对象的一些建议-

要与被测页面交互，请使用页面对象

建议使用页面对象与被测页面进行交互，因为它们可以封装有关被测页面上元素的信息，并且它们也可以重用。

始终为每个文件声明一页对象

我们应该在自己的文件中定义每个页面对象，因为它可以使代码保持整洁，并且查找内容变得容易。

在页面末尾，目标文件始终使用单个模块。

建议每个页面对象应声明一个类，这样我们只需要导出一个类。例如，应避免对目标文件的以下使用-

var UserProfilePage = function() {};
var UserSettingsPage = function() {};
module.exports = UserPropertiesPage;
module.exports = UserSettingsPage;

但另一方面，建议使用以下内容-

/** @constructor */
var UserPropertiesPage = function() {};

module.exports = UserPropertiesPage;

在顶部声明所有必需的模块

我们应该在页面对象的顶部声明所有必需的模块，因为它使模块依赖关系清晰易懂。

在测试套件开始时实例化所有页面对象

建议在测试套件的开头实例化所有页面对象，因为这会将依赖项与测试代码分开，并使依赖项可用于套件的所有规范。

不要在页面对象中使用Expect()

我们不应该在页面对象中使用Expect()，即，我们不应该在页面对象中进行任何断言，因为所有断言必须在测试用例中完成。

另一个原因是测试的阅读者应该仅通过阅读测试用例就能理解应用程序的行为。