Protractor和Angular:如何在应用程序中一个接一个地测试两个页面

Protractor and Angular: How to test two pages in an app, one after the other?

本文关键字：一个 测试 两个 Angular 应用程序 Protractor      更新时间：2023-10-24

我想在我的Angular应用程序中的两个独立页面上运行Protractor测试：/dashboard和/articles。

复杂的是我必须手动登录应用程序。

目前我有这样的设置：

var LoginPage = function() {
  ptor = protractor.getInstance();
  this.login = function(url) {
    ptor.get(url);
    ptor.findElement(protractor.By.model('email')).sendKeys(config.LOGIN_EMAIL);
    ptor.findElement(protractor.By.model('password')).sendKeys(config.LOGIN_PASS);
    ptor.findElement(protractor.By.tagName('button')).click();
  };
};
describe('The dashboard', function() {
  console.log('logging in');
  var loginPage = new LoginPage();
  loginPage.login(config.DASHBOARD_URL);
  console.log('logged in');
  it('has a heading', function() {
    console.log('testing dashboard 1');
    heading = ptor.findElement(protractor.By.tagName('h1'));
    expect(heading.getText()).toEqual(config.DASHBOARD_HEADING);
  });
});
describe('The article widget', function() {
  console.log('logging in');
  var loginPage = new LoginPage();
  loginPage.login(config.ARTICLE_URL);
  console.log('logged in');
  it('has a heading', function() {
    console.log('testing article 1');
    heading = ptor.findElement(protractor.By.tagName('h1'));
    expect(heading.getText()).toEqual(config.ARTICLES_HEADING);
  });
});

这给了我以下输出：

Selenium standalone server started at http://192.168.2.9:56791/wd/hub
logging in
LoginPage
logged in
logging in
LoginPage
logged in
testing dashboard 1
Ftesting article 1

看起来describe的两个部分是并行启动的。如何在以合理的方式构建代码的同时，强制执行以下事件序列？

  1. 加载仪表板页面
  2. 登录
  3. 运行仪表板测试
  4. 加载文章页面（假设我们已经登录）
  5. 运行文章测试

您可以将登录名移动到另一个文件。

然后，在量角器配置文件中执行以下操作：

exports.config = {
  specs: [
    'spec/login.js',
    'spec/dashboard_test.js',
    'spec/article_test.js'
  ],
  ...
};

登录将在其他测试之前运行

describe('my app', function(){
    beforeEach(function(){
        login()...
    })
    describe('dashboard');
    describe('the article widget')
});

Protractor文档推荐

将登录代码放入onPrepare函数中，该函数将在任何测试之前运行一次。

例如，在您的protractor.conf 中

onPrepare: function() {
    browser.driver.get('http://localhost/login.html');
    browser.driver.findElement(by.id('username')).sendKeys('Jane');
    browser.driver.findElement(by.id('password')).sendKeys('1234');
    browser.driver.findElement(by.id('clickme')).click();
    // Login takes some time, so wait until it's done.
    // For the test app's login, we know it's done when it redirects to
    // index.html.
    return browser.driver.wait(function() {
       return browser.driver.getCurrentUrl().then(function(url) {
          return /index/.test(url);
       });
    }, 10000);
}

我的e2e量角器测试也遇到了类似的问题。描述块被并行执行，导致我的测试失败。

在修复之前，我的代码类似于：

describe('test1', function() {
  it('do foo1', function() {..});
  describe('do test1', function() {..});
});
describe('test2', function() {
  it('do foo2', function() {..});
  describe('do test2', function() {..});
});

两个描述块都是并行执行的，导致我的测试失败。解决方法是将it块封装在描述块中。

修复后的代码：

describe('test1', function() {
  describe('foo1', function() {
    it('do foo1', function() {..});  
  });
  describe('do test1', function() {..});
});
describe('test2', function() {
  describe('foo2', function() {
    it('do foo2', function() {..});  
  });
  describe('do test2', function() {..});
});

链接到量角器github上的类似问题：https://github.com/angular/protractor/issues/592

相关文章：