Merge branch 'kasperp-tab-event'

2 files changed, 46 insertions, 12 deletions

diff --git a/js/bootstrap-tabs.js b/js/bootstrap-tabs.js
index dece95be6..e0286a364 100644
--- a/js/bootstrap-tabs.js
+++ b/js/bootstrap-tabs.js
@@ -27,21 +27,27 @@
 
   function tab( e ) {
     var $this = $(this)
-      , href = $this.attr('href')
       , $ul = $this.closest('ul')
-      , $controlled
+      , href = $this.attr('href')
+      , previous
 
     if (/^#\w+/.test(href)) {
       e.preventDefault()
 
-      if ($this.hasClass('active')) {
+      if ($this.parent('li').hasClass('active')) {
         return
       }
 
+      previous = $ul.find('.active a')[0]
       $href = $(href)
 
       activate($this.parent('li'), $ul)
       activate($href, $href.parent())
+
+      $this.trigger({
+        type: 'change'
+      , relatedTarget: previous
+      })
     }
   }
 
@@ -59,4 +65,4 @@
     $('body').tabs('ul[data-tabs] li > a, ul[data-pills] > li > a')
   })
 
-}( window.jQuery || window.ender );
\ No newline at end of file
+}( window.jQuery || window.ender );
diff --git a/js/tests/unit/bootstrap-tabs.js b/js/tests/unit/bootstrap-tabs.js
index 2ee6761ed..1d024ecbb 100644
--- a/js/tests/unit/bootstrap-tabs.js
+++ b/js/tests/unit/bootstrap-tabs.js
@@ -11,39 +11,67 @@ $(function () {
       })
 
       test("should activate element by tab id", function () {
-        var tabsHTML = '<ul class="tabs">'
+        var $tabsHTML = $('<ul class="tabs">'
           + '<li class="active"><a href="#home">Home</a></li>'
           + '<li><a href="#profile">Profile</a></li>'
-          + '</ul>'
+          + '</ul>')
 
 
         $('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo("#qunit-runoff")
 
-        $(tabsHTML).tabs().find('a').last().click()
+        $tabsHTML.tabs().find('a').last().click()
         equals($("#qunit-runoff").find('.active').attr('id'), "profile")
 
-        $(tabsHTML).tabs().find('a').first().click()
+        $tabsHTML.tabs().find('a').first().click()
         equals($("#qunit-runoff").find('.active').attr('id'), "home")
 
         $("#qunit-runoff").empty()
       })
 
       test("should activate element by pill id", function () {
-        var pillsHTML = '<ul class="pills">'
+        var $pillsHTML = $('<ul class="pills">'
           + '<li class="active"><a href="#home">Home</a></li>'
           + '<li><a href="#profile">Profile</a></li>'
-          + '</ul>'
+          + '</ul>')
 
 
         $('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo("#qunit-runoff")
 
-        $(pillsHTML).pills().find('a').last().click()
+        $pillsHTML.pills().find('a').last().click()
         equals($("#qunit-runoff").find('.active').attr('id'), "profile")
 
-        $(pillsHTML).pills().find('a').first().click()
+        $pillsHTML.pills().find('a').first().click()
         equals($("#qunit-runoff").find('.active').attr('id'), "home")
 
         $("#qunit-runoff").empty()
       })
 
+      test( "should trigger change event on activate", function () {
+        var $tabsHTML = $('<ul class="tabs">'
+          + '<li class="active"><a href="#home">Home</a></li>'
+          + '<li><a href="#profile">Profile</a></li>'
+          + '</ul>')
+          , $target
+          , count = 0
+          , relatedTarget
+          , target
+
+        $tabsHTML
+          .tabs()
+          .bind( "change", function (e) {
+            target = e.target
+            relatedTarget = e.relatedTarget
+            count++
+          })
+
+        $target = $tabsHTML
+          .find('a')
+          .last()
+          .click()
+
+        equals(relatedTarget, $tabsHTML.find('a').first()[0])
+        equals(target, $target[0])
+        equals(count, 1)
+      })
+
 })
\ No newline at end of file