add collapsed class to collapse invoker when it's target is collapsed #3525

docs/assets/js/bootstrap-collapse.js

@@ -150,6 +150,7 @@
           || e.preventDefault()
           || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
         , option = $(target).data('collapse') ? 'toggle' : $this.data()
+      $this[$(target).hasClass('in') ? 'removeClass' : 'addClass']('show')
       $(target).collapse(option)
     })
   })

docs/assets/js/bootstrap.js

@@ -562,6 +562,7 @@
           || e.preventDefault()
           || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
         , option = $(target).data('collapse') ? 'toggle' : $this.data()
+      $this[$(target).hasClass('in') ? 'removeClass' : 'addClass']('show')
       $(target).collapse(option)
     })
   })

js/bootstrap-collapse.js

@@ -144,12 +144,13 @@
   * ==================== */
 
   $(function () {
-    $('body').on('click.collapse.data-api', '[data-toggle=collapse]', function ( e ) {
+    $('body').on('click.collapse.data-api', '[data-toggle=collapse]', function (e) {
       var $this = $(this), href
         , target = $this.attr('data-target')
           || e.preventDefault()
           || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
         , option = $(target).data('collapse') ? 'toggle' : $this.data()
+      $this[$(target).hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
       $(target).collapse(option)
     })
   })

js/tests/unit/bootstrap-collapse.js

@@ -24,7 +24,7 @@ $(function () {
 
       test("should not fire shown when show is prevented", function () {
         $.support.transition = false
-        stop();
+        stop()
         $('<div class="collapse"/>')
           .bind('show', function (e) {
             e.preventDefault();
@@ -39,7 +39,7 @@ $(function () {
 
       test("should reset style to auto after finishing opening collapse", function () {
         $.support.transition = false
-        stop();
+        stop()
         $('<div class="collapse" style="height: 0px"/>')
           .bind('show', function () {
             ok(this.style.height == '0px')
@@ -51,4 +51,38 @@ $(function () {
           .collapse('show')
       })
 
+      test("should add active class to target when collapse shown", function () {
+        $.support.transition = false
+        stop()
+
+        var target = $('<a data-toggle="collapse" href="#test1"></a>')
+          .appendTo($('#qunit-fixture'))
+
+        var collapsible = $('<div id="test1"></div>')
+          .appendTo($('#qunit-fixture'))
+          .on('show', function () {
+            ok(!target.hasClass('collapsed'))
+            start()
+          })
+
+        target.click()
+      })
+
+      test("should remove active class to target when collapse hidden", function () {
+        $.support.transition = false
+        stop()
+
+        var target = $('<a data-toggle="collapse" href="#test1"></a>')
+          .appendTo($('#qunit-fixture'))
+
+        var collapsible = $('<div id="test1" class="in"></div>')
+          .appendTo($('#qunit-fixture'))
+          .on('hide', function () {
+            ok(target.hasClass('collapsed'))
+            start()
+          })
+
+        target.click()
+      })
+
 })
\ No newline at end of file