Testing Strategies for Angular JS – Protractor @ YouTube

http://www.youtube.com/watch?v=UYVcY9EJcRs

This screencast explains some tools for AngularJS testing. Already popular Testem and Jasmine are well covered in other screencasts, but Protractor example was interesting.

Protractor is built on top of WebDriverJs, but also it provides angular-aware features like “By.binding” or “By.repeater” selectors as in the examples.

The document is limited, but it seems the basic interface is the same as WebDriverJs, and the protractor.js source-code can be used to identify the additional definitions in “ProtractorBy.prototype” parts.

Nice.

Notes

  • Default testing file defined in “myConf.js” is “spec/testAppSpec.js”, which needs to be created for your tests.
  • “Appendix A: Setting up a standalone selenium server” in the github page covers the webdriver setup, and then running “node_modules/.bin/protractor myConf.js” works.

It’s pretty much basic one, but the following is what I tried for testAppSpec.js.

var protractor = require('../node_modules/protractor/lib/protractor.js');
require('../node_modules/protractor/jasminewd');

describe('login', function() {
  var ptor = protractor.getInstance();

  it('should remain in the sign-in page if the password is invalid', function() {
    ptor.get('http://localhost:3000');

    ptor.findElement(protractor.By.id("user_email")).sendKeys("xxx@yyy.com")
    ptor.findElement(protractor.By.id("user_password")).sendKeys("XXX")

    ptor.findElement(protractor.By.tagName("button")).click();

    ptor.findElement(protractor.By.tagName('h3')).getText().then(function(text) { expect(text).toEqual('Sign in'); });
    ptor.findElement(protractor.By.id("user_email")).getText().then(function(text) { expect(text).toEqual(''); });
    ptor.findElement(protractor.By.id("user_password")).getText().then(function(text) { expect(text).toEqual(''); });
  }, 10000);
});
Advertisements

Posted on July 31, 2013, in JavaScript, Web. Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: