tests & docs & twipsy too

3 files changed, 46 insertions, 4 deletions

diff --git a/js/bootstrap-twipsy.js b/js/bootstrap-twipsy.js
index e249c815d..9eb6e79f4 100644
--- a/js/bootstrap-twipsy.js
+++ b/js/bootstrap-twipsy.js
@@ -119,7 +119,7 @@
 
   , setContent: function () {
       var $tip = this.tip()
-      $tip.find('.twipsy-inner')[this.options.html ? 'html' : 'text'](this.getTitle())
+      $tip.find(this.options.contentSelector)[this.options.html ? 'html' : 'text'](this.getTitle())
       $tip[0].className = 'twipsy'
     }
 
@@ -302,10 +302,11 @@
   , title: 'title'
   , trigger: 'hover'
   , template: '<div class="twipsy-arrow"></div><div class="twipsy-inner"></div>'
+  , contentSelector: '.twipsy-inner'
   }
 
   $.fn.twipsy.elementOptions = function(ele, options) {
     return $.extend({}, options, $(ele).data())
   }
 
-}( window.jQuery || window.ender );
\ No newline at end of file
+}( window.jQuery || window.ender );
diff --git a/js/tests/unit/bootstrap-popover.js b/js/tests/unit/bootstrap-popover.js
index 3e13d2fd2..69f3e0d7f 100644
--- a/js/tests/unit/bootstrap-popover.js
+++ b/js/tests/unit/bootstrap-popover.js
@@ -73,4 +73,27 @@ $(function () {
         $('#qunit-runoff').empty()
       })
 
-})
\ No newline at end of file
+      test("should allow arbitrary template html with title and content selector options", function() {
+        $.support.transition = false
+        var expectedTitle = 'Gotta make you understand'
+          , popover = $('<a href="#">@rvagg</a>')
+              .attr('title', expectedTitle)
+              .data('content', '<p><b>Never gonna give you up</b>,</p><p>Never gonna let you down</p>')
+              .appendTo('#qunit-runoff')
+              .popover({
+                    html: true
+                  , titleSelector: 'h1'
+                  , contentSelector: '.rick > .roll'
+                  , template: '<div class="rick"><h1></h1><div class="roll"></div></div>'
+                })
+              .popover('show')
+
+        ok($('.popover > div > h1').length, 'h1 tag was inserted')
+        ok($('.popover > div > h1').text() === expectedTitle)
+        ok($('.popover > .rick > .roll > p').length === 2, 'p > b tags were inserted')
+        popover.popover('hide')
+        ok(!$('.popover').length, 'popover was removed')
+        $('#qunit-runoff').empty()
+      })
+
+})
diff --git a/js/tests/unit/bootstrap-twipsy.js b/js/tests/unit/bootstrap-twipsy.js
index 04000696a..74855931a 100644
--- a/js/tests/unit/bootstrap-twipsy.js
+++ b/js/tests/unit/bootstrap-twipsy.js
@@ -78,4 +78,22 @@ $(function () {
         $('#qunit-runoff').empty()
       })
 
-})
\ No newline at end of file
+      test("should allow arbitrary template html with content selector options", function() {
+        $.support.transition = false
+        var twipsy = $('<a href="#" rel="twipsy" title="<b>@fat</b>"></a>')
+          .appendTo('#qunit-runoff')
+          .twipsy({
+                html: true
+              , contentSelector: 'h1'
+              , template: '<div><h1>Funky Twipsy!</h1><p class="funky"><b>@rvagg was here</b></p></div>'
+            })
+          .twipsy('show')
+
+        ok($('.twipsy h1').length, 'h1 tag was inserted')
+        ok($('.twipsy p>b').length, 'p > b tags were inserted')
+        ok($('.twipsy h1>b').length, 'h1 tag was customised')
+        twipsy.twipsy('hide')
+        ok(!$(".twipsy").length, 'twipsy removed')
+        $('#qunit-runoff').empty()
+      })
+})