Testing tab navigation order

I think the PageObject should define a tab order list, since that is really a direct property of the page, and should be expressible as simple data. An array of items seems like a sufficient representation, so something like:

this.tabOrder = [ this.registrationCode, this.rememberRegistrationCode, this.requestCode, this.cancelButton ];

Then you need a bit of generic code that can check a tab order.

function testTabOrder(tabOrder) {    // Assumes TAB order hasn't been messed with and page is on default element    tabOrder.forEach(function(el) {       expect(el.getId()).toEqual(browser.driver.switchTo().activeElement().getId());       el.sendKeys(protractor.Key.TAB);    });}

Then your test would be something like:

it('has correct tab order', function() {    var regCodePage = new RegCodePage();  // this should probably be in the beforeEach    testTabOrder(regCodePage.tabOrder);});

Of course, this assumes each element has a "getId()" method that works. (That seems like a reasonable assumption to me, but some environments may not support it.)

I think this keeps the tab-order nicely isolated on the PageObject (so its easy to keep in sync with the page content and doesn't get lost in the code that verifies the order). The testing code seem "optimistic" (I suspect the real world will introduce enough problems that you will end up expanding this code a bit).

I haven't tried any of this yet, so feel free to downvote if this doesn't work. :)

Also, I believe the forEach loop will work as-is, but I wouldn't be surprised if it needs some more explicit promise handling to make the dependencies explicit.