使用 Protractor 并行浏览器测试的最佳实践是什么？

Question

我是 Protractor 的新手。如果您想知道为什么我将功能文件分成文件夹是因为我想知道哪个浏览器无法进行黄瓜报告。如果我只在 1 个文件夹 specs: 'features/*.feature' 中运行所有 4 个浏览器，我无法确定最终哪个浏览器测试失败以获取黄瓜报告。

黄瓜报告： https://github.com/damianszczepanik/cucumber-reporting

在学习这个新框架时，我一直在尝试在 selenium 网格上使用相同规范（例如登录/注销 IE、safari、firefox、chrome）运行多个浏览器测试。我注意到在 4 台不同的机器上并行运行 4 种不同的浏览器有时会失败，但是当我在 1 台机器上运行 1 个浏览器测试时它通过了。它失败，要么是其中一个浏览器在页面上找不到元素，要么是浏览器卡住了。

运行多个浏览器测试的最佳做法是什么？您是想在同一个规范文件上运行并行测试，还是并行测试来帮助在不同的规范文件上运行？这里的特征文件路径是这样的

features/chrome/login.feature

features/safari/login.feature

features/firefox/login.feature

exports.config = {
        seleniumAddress: 'http://localhost:4444/wd/hub',
        framework: 'custom',
        // path relative to the current config file
        frameworkPath: require.resolve('protractor-cucumber-framework'),
        multiCapabilities:
        [{
          'browserName': 'chrome',
          specs: 'features/chrome/*.feature'
        },
        {
          'browserName': 'firefox',
          specs: 'features/firefox/*.feature'
        },
        {
          'browserName': 'internet explorer',
          specs: 'features/ie/*.feature'
        },
        {
          'browserName': 'safari',
          specs: 'features/safari/*.feature'
        }],
        maxSessions: 2,
        baseUrl: 'https://localhost:8080',
        cucumberOpts: {
          strict: true,
          require: [
            'hooks/hooks.js',
            'specs/*Spec.js'
          ],
          tags: [
            "@runThis", 
            "~@ignoreThis"
          ],
          profile: false,
          format: 'json:e2e/reports/cucumber-report.json',
          resultJsonOutputFile: 'e2e/reports/cucumber-report.json'
        },
        onPrepare: function() {

          const fs = require('fs');
          const path = require('path');

          const directory = 'e2e/reports';

          //cleans up the json results from the previous build when using node flake
          // fs.readdir(directory, (err, files) => {
          //   if (err) throw err;

          //   for (const file of files) {
          //     fs.unlink(path.join(directory, file), err => {
          //       if (err) throw err;
          //     });
          //   }
          // });

          var chai = require('chai');
          chai.use(require('chai-as-promised'));
          global.expect = chai.expect;
          browser.ignoreSynchronization = true;
          browser.manage().window().maximize();
          browser.waitForAngular(false);

        }
    }

---

Feature: Login to see the dashboard pages and logout

    @runThis
    Scenario: Open the browser and login
        Given I am on the login page
        When I should be able to login with my credentials
        When I logout
        Then I should be able to see login page

---

LoginSpec.js

let loginPage = require('../pages/loginPage.js');

const username = 'xxx';
const password = 'xxx';

module.exports = function() {

    this.Given('I am on the login page', function() {

        browser.get("https://localhost:8080");
    });

    this.When('I should be able to login with my credentials', function() {

        loginPage.setUsername(username);
        loginPage.setPassword(password);
        loginPage.clickLogin();
        loginPage.loaded(loginPage.HAMBERBURGER_MENU_ICON_CLASS);
    });

    this.When('I logout', function() {

        loginPage.openSideMenu();
        loginPage.clickLogout();
        loginPage.clickLogoutPopup();
    });

    this.Then('I should be able to see login page', {timeout: 120 * 1000},  async function () {

        expect(await element(by.id(loginPage.LOGIN_BUTTON_ID)).isPresent()).to.equal(true);
    });

};

Answer 1

在多个浏览器上进行测试的目的是检查每个浏览器上的应用程序兼容性。为了实现这个目标，我们应该在所有浏览器上运行所有规范文件。 如果我们同意这一点，那么您可以使用 multiCapabilites 在每个浏览器上并行运行规范。以下是在两个浏览器上运行规范的 conf.js。

// An example configuration file.
exports.config = {
  directConnect: false,

  // Capabilities to be passed to the webdriver instance.
  multiCapabilities: [{
    'browserName': 'chrome'
  },
  {
    'browserName': 'firefox'
  }],

  // Framework to use. Jasmine is recommended.
  framework: 'jasmine',

  // Spec patterns are relative to the current working directory when
  // protractor is called.
  specs: ['example_spec.js'],

  // Options to be passed to Jasmine.
  jasmineNodeOpts: {
    defaultTimeoutInterval: 30000
  }
};

Answer 2

更正您尝试的配置文件会更容易。那么您能否发布用于在多个浏览器上并行运行测试的 config.js 文件。 另外有趣的是，您是否正在使用任何基于云的硒网格解决方案（如浏览器堆栈等）或使用您自己的硒网格基础设施？

Answer 3

回答您最初的问题“运行多个浏览器测试的最佳做法是什么？”

您可以对两者使用并行测试： 1) 无论您使用多少浏览器或操作系统完成应用程序测试，都可以加快您的测试执行速度。

2) 同时验证您的应用程序在不同浏览器/操作系统版本上的行为。

要实现 1) 您只能使用具有 maxInstances 和 shardTestFiles 属性的功能对象，例如：

capabilities : {
browserName : 'chrome',
maxinstances: 10 ,// if you want to run 10 specs in parallels //which speed up your test execution time by 10 times
shardTestFiles: true,
},
specs: 'features/**/*.feature'

要实现 2) 您可以使用如下所示的 multiCapabilities 对象

    multiCapabilities:
        [{
          'browserName': 'chrome's,
        },
        {
          'browserName': 'firefox',
        {
          'browserName': 'internet explorer',
        {
          'browserName': 'safari',
        }],
specs: 'features/**/*.feature'