Merge branch 'v4' of https://github.com/twbs/derpstrap into v4

docs/_plugins/callout.rb

@@ -6,12 +6,11 @@ module Jekyll
 
       def initialize(tag_name, type, tokens)
         super
-        @type = type
-        if type == "danger"
-          @type = "danger"
-        elsif type == "warning"
-          @type = "warning"
-        elsif type == "info"
+        type.strip!
+        if %w(info danger warning).include?(type)
+          @type = type
+        else
+          puts "#{type} callout not supported. Defaulting to info"
           @type = "info"
         end
       end

docs/components/card.md

@@ -21,7 +21,7 @@ Cards require very little markup, but do require some additional classes to give
 
 ### Sizing
 
-Cards are block-leve by default, so they'll fill the available horizontal space. Constrain their widths via custom styles, our predefined grid classes, or our grid mixins.
+Cards are block-level by default, so they'll fill the available horizontal space. Constrain their widths via custom styles, our predefined grid classes, or our grid mixins.
 
 {% example html %}
 <div class="card" style="width: 20rem;">

docs/components/forms.md

@@ -185,7 +185,7 @@ Use the `.inline-form` class to to display a series of labels, form controls, an
 - Controls receive `width: auto` to override the Bootstrap default `width: 100%`.
 - Controls **only appear inline in viewports that are at least 768px wide** to account for narrow viewports on mobile devices.
 
-Because of this, you may need to manually adddres the width and alignment of individual form controls. Lastly, as shown below, you should always include a `<label>` with each form control.
+Because of this, you may need to manually address the width and alignment of individual form controls. Lastly, as shown below, you should always include a `<label>` with each form control.
 
 #### Visible labels
 

docs/components/reboot.md

@@ -118,7 +118,7 @@ Tables are slightly adjusted to style `<caption>`s and ensure consistent `text-a
 <div class="bd-example">
   <table>
     <caption>
-      This is an example table, and this is it's caption to describe the contents.
+      This is an example table, and this is its caption to describe the contents.
     </caption>
     <thead>
       <tr>

js/tests/unit/popover.js

@@ -166,7 +166,8 @@ $(function () {
 
   QUnit.test('should destroy popover', function (assert) {
     assert.expect(7)
-    var $popover = $('<div/>')
+    var $popover = $('<div>Popover trigger</div>')
+      .appendTo('#qunit-fixture')
       .bootstrapPopover({
         trigger: 'hover'
       })
@@ -240,6 +241,17 @@ $(function () {
       .bootstrapPopover('show')
   })
 
+  QUnit.test('should throw an error when trying to show a popover on a hidden element', function (assert) {
+    assert.expect(1)
+    var $target = $('<a href="#" title="Another popover" data-content="Body" style="display: none;">I am hidden</a>').appendTo('#qunit-fixture')
+
+    assert.throws(function () {
+      $target.bootstrapPopover('show')
+    }, new Error('Can\'t show a tooltip/popover on a hidden element'))
+
+    $target.remove()
+  })
+
   QUnit.test('should throw an error when initializing popover on the document object without specifying a delegation selector', function (assert) {
     assert.expect(1)
     assert.throws(function () {

js/tooltip.js

@@ -293,6 +293,14 @@ Tooltip.prototype['destroy'] = function () {
  * and replace with external lib
  */
 Tooltip.prototype['show'] = function () {
+  // jQuery's :hidden gives false positives for SVG elements
+  // See https://github.com/jquery/jquery/pull/939
+  // Since this hiddenness check is just a nicety anyway, simply assume SVGs are always visible.
+  var isHidden = $(this.element).is(':hidden') && !(window.SVGElement && this.element instanceof window.SVGElement)
+  if (isHidden) {
+    throw new Error('Can\'t show a tooltip/popover on a hidden element')
+  }
+
   var showEvent = $.Event(this.getEventObject().SHOW)
 
   if (this.isWithContent() && this._isEnabled) {

scss/_reboot.scss

@@ -243,7 +243,7 @@ textarea {
   margin: 0;
   // Normalize includes `font: inherit;`, so `font-family`. `font-size`, etc are
   // properly inherited. However, `line-height` isn't addressed there. Using this
-  // ensures we don't need to unnessarily redeclare the global font stack.
+  // ensures we don't need to unnecessarily redeclare the global font stack.
   line-height: inherit;
 }