Back to Repositories

Testing ngRoute Promise Resolution and Navigation in Angular.js

This test suite evaluates the promise handling capabilities in ngRoute for Angular.js applications. It focuses on testing route resolution timing, timeout behavior, and navigation between routes with pending promises. The suite ensures robust handling of asynchronous operations during routing.

Test Coverage Overview

The test suite provides comprehensive coverage of ngRoute promise functionality in Angular.js applications. It examines essential routing scenarios including promise resolution timing, timeout handling, and route navigation with pending promises.

Promise resolution verification during route changes
Timeout handling for long-running promises
Route navigation with active promises
Script timeout management

Implementation Analysis

The testing approach utilizes Protractor’s E2E testing capabilities to validate route promise behavior. It implements browser automation to verify DOM updates and route transitions, while managing timeouts programmatically.

Browser timeout manipulation using manage().timeouts()
Location-based navigation testing
Promise rejection handling
Dynamic configuration updates

Technical Details

Protractor E2E testing framework
Angular.js ngRoute module
Browser automation APIs
Custom fixture loading
Promise-based assertions
Dynamic timeout configuration

Best Practices Demonstrated

The test suite exemplifies several testing best practices for handling asynchronous operations in Angular.js applications. It demonstrates proper test isolation, cleanup, and error handling patterns.

Proper test cleanup in afterEach blocks
Timeout restoration after tests
Explicit promise rejection handling
Isolated test scenarios
Clear test case descriptions

angular/angularJs

test/e2e/tests/ng-route-promise.spec.js

            
'use strict';

describe('ngRoute promises', function() {
  beforeEach(function() {
    loadFixture('ng-route-promise');
  });

  it('should wait for route promises', function() {
    expect(element.all(by.tagName('li')).count()).toBe(5);
  });

  it('should time out if the promise takes long enough', function(done) {
    // Don't try this at home kids, I'm a protractor dev
    browser.manage().timeouts().setScriptTimeout(1000);
    browser.waitForAngular().then(function() {
      fail('waitForAngular() should have timed out, but didn\'t');
    }, done);
  });

  it('should wait for route promises when navigating to another route', function() {
    browser.setLocation('/foo2');
    expect(element(by.tagName('body')).getText()).toBe('5');
  });

  afterEach(function(done) {
    // Restore old timeout limit
    browser.getProcessedConfig().then(function(config) {
      return browser.manage().timeouts().setScriptTimeout(config.allScriptsTimeout);
    }).then(done);
  });
});