Merge branch 'replace-scrollspy-default-behavior-test' of git://github.com/breaddevil...

Conflicts:
	js/tests/unit/scrollspy.js

diff --cc js/tests/unit/scrollspy.js
index 2ec51fc2438e3a787a2e428ddf83f307d3b606a1,a36749f2e8630adfeb0e62eb8908f4ced2a9a3e8..a668687687c7b688264213212efe48b98fb104f2
--- 1/js/tests/unit/scrollspy.js
--- 2/js/tests/unit/scrollspy.js
+++ b/js/tests/unit/scrollspy.js
@@@ -71,47 -51,51 +71,84 @@@ $(function () 
          '</p>' +
          '</div>' +
          '</div>' +
 -        '</div>',
 -        $section = $(sectionHTML).appendTo('#qunit-fixture'),
 -        $scrollSpy = $section
 +        '</div>'
 +    var $section = $(sectionHTML).appendTo('#qunit-fixture')
 +    var $scrollSpy = $section
          .show()
          .find('#scrollspy-example')
 -        .bootstrapScrollspy({target: '#ss-target'})
 +        .bootstrapScrollspy({ target: '#ss-target' })
  
 +    $scrollSpy.on('scroll.bs.scrollspy', function () {
 +      ok($section.hasClass('active'), 'Active class still on root node')
 +      start()
 +    })
      $scrollSpy.scrollTop(350);
 -    ok($section.hasClass('active'), 'Active class still on root node')
 +  })
 +
 +  asyncTest('middle navigation option correctly selected when large offset is used', function () {
 +    expect(3);
 +    var sectionHTML = '<div id="header" style="height: 500px;"></div>' +
 +        '<nav id="navigation" class="navbar">' +
 +        '<ul class="nav navbar-nav">' +
 +        '<li class="active"><a id="one-link" href="#one">One</a></li>' +
 +        '<li><a id="two-link" href="#two">Two</a></li>' +
 +        '<li><a id="three-link" href="#three">Three</a></li>' +
 +        '</ul>' +
 +        '</nav>' +
 +        '<div id="content" style="height: 200px; overflow-y: auto;">' +
 +        '<div id="one" style="height: 500px;"></div>' +
 +        '<div id="two" style="height: 300px;"></div>' +
 +        '<div id="three" style="height: 10px;"></div>' +
 +        '</div>'
 +    var $section = $(sectionHTML).appendTo('#qunit-fixture')
 +    var $scrollSpy = $section
 +        .show()
 +        .filter('#content')
 +    $scrollSpy.bootstrapScrollspy({ target: '#navigation', offset: $scrollSpy.position().top })
 +
 +    $scrollSpy.on('scroll.bs.scrollspy', function () {
 +      ok(!$section.find('#one-link').parent().hasClass('active'), 'Active class removed from first section')
 +      ok($section.find('#two-link').parent().hasClass('active'), 'Active class on middle section')
 +      ok(!$section.find('#three-link').parent().hasClass('active'), 'Active class not on last section')
 +      start()
 +    })
 +    $scrollSpy.scrollTop(550);
    })
+ 
+   test('should add the active class to the correct element', function () {
+     var navbarHtml =
+       '<div class="navbar">' +
+       '<ul class="nav">' +
+       '<li id="li-1"><a href="#div-1">div 1</a></li>' +
+       '<li id="li-2"><a href="#div-2">div 2</a></li>' +
+       '</ul>' +
+       '</div>'
+     var contentHtml =
+       '<div class="content" style="overflow: auto; height: 50px">' +
+       '<div id="div-1" style="height: 100px; padding: 0; margin: 0">div 1</div>' +
+       '<div id="div-2" style="height: 200px; padding: 0; margin: 0">div 2</div>' +
+       '</div>'
+ 
+     $(navbarHtml).appendTo('#qunit-fixture')
+     var $content = $(contentHtml)
+       .appendTo('#qunit-fixture')
+       .bootstrapScrollspy({offset: 0, target: '.navbar'})
+ 
+     var testElementIsActiveAfterScroll = function (element, target) {
+       var deferred = $.Deferred()
+       var scrollHeight = $content.scrollTop() + $(target).position().top
+       stop()
+       $content.one('scroll', function () {
+         ok($(element).hasClass('active'), 'target:' + target + ', element' + element)
+         start()
+         deferred.resolve()
+       })
+       $content.scrollTop(scrollHeight)
+       return deferred.promise()
+     }
+ 
+     $.when(testElementIsActiveAfterScroll('#li-1', '#div-1'))
+       .then(function () { return testElementIsActiveAfterScroll('#li-2', '#div-2') })
+   })
+ 
  })