Javascript 量角器测试不一致地通过/失败AngularJS应用程序

我的量角器e2e测试不一致地通过和失败

这似乎是由于异步javascript造成的，如下所述： .

但是，这里提到了量角器测试自动顺序/同步执行：

我的测试脚本：

describe('Login', function() {

  var ptor;

  beforeEach(function() {
    browser.get('https://127.0.0.1:8443');
    ptor = protractor.getInstance();
    element(by.id('splash')).click();
    browser.ignoreSynchronization = true;  // <-- to proceed beyond splash screen
  });

  describe('with correct email and password', function() {

    beforeEach(function() {
        element(by.id('email')).sendKeys('admin@email.com');
        element(by.id('password')).sendKeys('adminpassword');
        element(by.id('loginButton')).click();
    });

    afterEach(function() {
        ptor.findElement(by.id('logout')).then(function(elem) {
            elem.click();
        });
    });

    it('does not show alert', function() {  // <-- sometimes passes, sometimes fails
        expect(browser.isElementPresent(by.css('.alert-danger'))).toBe(false);
    });

    it('changes route to /admin', function() {  // <-- sometimes passes, sometimes fails
        expect(browser.getCurrentUrl()).toMatch(/\/admin/);
    });
  });
});

或

---

非常感谢您的想法/帮助。

browser.ignoreSynchronization=true；对您的所有测试具有全局影响。您可能必须将其设置回false，以便量角器等待angular完成页面渲染。e、 g.在您的第二个before功能中或之前

我能够基于以下内容解决问题：

• 下面是关于添加ptor.waitForAngular（）的答案：
  

• 将browser.get更改为ptor.get，如中的回答：
  

• 此处的注释是关于ignoreSynchronization是一个实例变量，以及将browser.ignoreSynchronization=true更改为ptor.ignoreSynchronization=true:
  

• 下面是关于使用.then（）的答案：
  

正如作者对原始问题的评论所提到的，我正在测试一个纯角度应用程序，我认为它是纯量角器（没有webdriver调用）。我知道在这种情况下不需要ptor.ignoreSynchronization=true，但由于某些原因，在没有此设置的情况下，在单击按钮时测试不会继续进行

我的新规格：

describe('Login', function() {

  var ptor;

  beforeEach(function() {
    ptor = protractor.getInstance();
    ptor.ignoreSynchronization = true;
    ptor.waitForAngular();
    ptor.get('https://127.0.0.1:8443');
    ptor.findElement(by.id('splash')).then(function(elem) {
        elem.click();
    });
  });

  describe('with correct email and password', function() {

    beforeEach(function() {
        ptor.findElement(by.id('email')).then(function(elem) {
            elem.sendKeys('admin@email.com');
        });

        ptor.findElement(by.id('password')).then(function(elem) {
            elem.sendKeys('adminpassword');
        });

        ptor.findElement(by.id('loginButton')).then(function(elem) {
            elem.click();
        });
    });

    afterEach(function() {
        ptor.findElement(by.id('logout')).then(function(elem) {
            elem.click();
        });
    });

    it('does not show alert', function() {
        expect(ptor.isElementPresent(by.css('.alert-danger'))).toBe(false);
    });

    it('changes route to /admin', function() {
        expect(ptor.getCurrentUrl()).toMatch(/\/admin/);
    });
  });
});

---

还有一种技术可以使测试更加稳定：（）

我发现，在测试涉及大量动画的非角度页面或角度应用程序时，使用预期条件特别有用

例如，您可以在单击之前等待图元可单击：

var EC = protractor.ExpectedConditions;
var link = element(by.id("mylink"));

browser.wait(EC.elementToBeClickable(link), "10000", "The link is still not clickable");
link.click();

还有其他内置的预期条件，例如：

• presenseOf（）

• visibilityOf（）

• alertIsPresent（）

• texttobepresentElementValue（）

• 等

而且，编写自定义预期条件很容易，例如用例：

您还可以使用

和

、

或

和

非

，例如：

var urlChanged = function() {
  return browser.getCurrentUrl().then(function(url) {
    return url != 'http://www.angularjs.org';
  });
};

// condition to wait for url to change, title to contain 'foo', and $('abc') element to contain text 'bar'
var condition = EC.and(urlChanged, EC.titleContains('foo'), EC.textToBePresentInElement($('abc'), 'bar'));
$('navButton').click();
browser.wait(condition, 5000); //wait for condition to be true.

---

您正在测试angularjs应用程序还是非angularjs应用程序？为什么要添加此代码“browser.ignoreSynchronization=true”？这是一个角度应用程序。我知道不需要ptor.ignoreSynchronization=true，但由于某些原因，在没有此设置的情况下，在单击按钮时测试不会继续。参见Harri Siirak的评论：这是一个很好的答案，只适合你的情况，但很有趣；）谢谢分享。不幸的是我几次都做不到+1，我真的很喜欢你的答案！谢谢分享，帮了我很多忙。

var EC = protractor.ExpectedConditions;
var link = element(by.id("mylink"));

browser.wait(EC.elementToBeClickable(link), "10000", "The link is still not clickable");
link.click();

var urlChanged = function() {
  return browser.getCurrentUrl().then(function(url) {
    return url != 'http://www.angularjs.org';
  });
};

// condition to wait for url to change, title to contain 'foo', and $('abc') element to contain text 'bar'
var condition = EC.and(urlChanged, EC.titleContains('foo'), EC.textToBePresentInElement($('abc'), 'bar'));
$('navButton').click();
browser.wait(condition, 5000); //wait for condition to be true.