padrino/padrino-framework · error · Error

Popover requires tooltip.js

Error message

Popover requires tooltip.js

What it means

This vendored Bootstrap 3 popover.js ships in the padrino-admin generator templates and is copied into a generated app's public javascripts. Popover is a subclass of Bootstrap's Tooltip plugin, so at load time it checks jQuery's $.fn.tooltip and throws immediately if tooltip.js was not included first. Hitting it means the page (usually a customized admin layout or a hand-built asset bundle) loads popover.js without tooltip.js.

Source

Thrown at padrino-admin/lib/padrino-admin/generators/templates/assets/javascripts/bootstrap/popover.js:20

 * Bootstrap: popover.js v3.1.0
 * http://getbootstrap.com/javascript/#popovers
 * ========================================================================
 * Copyright 2011-2014 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * ======================================================================== */


+function ($) {
  'use strict';

  // POPOVER PUBLIC CLASS DEFINITION
  // ===============================

  var Popover = function (element, options) {
    this.init('popover', element, options)
  }

  if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')

  Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, {
    placement: 'right',
    trigger: 'click',
    content: '',
    template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
  })


  // NOTE: POPOVER EXTENDS tooltip.js
  // ================================

  Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)

  Popover.prototype.constructor = Popover

  Popover.prototype.getDefaults = function () {
    return Popover.DEFAULTS

View on GitHub (pinned to 167044f3d5)

Solutions

  1. Add a script tag for bootstrap/tooltip.js ahead of popover.js in the layout
  2. Restore the script includes emitted by `padrino g admin` — the generated admin layout already orders tooltip.js before popover.js
  3. If concatenating assets, order the bundle so jQuery, then tooltip.js, then popover.js
  4. If tooltips were intentionally dropped, also drop popover.js and remove any data-toggle='popover' usage

Example fix

<!-- before -->
<script src='/javascripts/bootstrap/popover.js'></script>

<!-- after -->
<script src='/javascripts/bootstrap/tooltip.js'></script>
<script src='/javascripts/bootstrap/popover.js'></script>
Defensive patterns

Strategy: validation

Validate before calling

// before adding popover.js, verify its dependency is present
if (window.jQuery && jQuery.fn.tooltip) {
  // safe to include popover.js
} else {
  console.error('bootstrap/tooltip.js must be loaded before popover.js')
}

Try / catch

try {
  $('[data-toggle=popover]').popover()
} catch (e) {
  if (/tooltip\.js/.test(e.message)) { /* load tooltip.js, then retry once */ }
  else { throw e }
}

Prevention

When it happens

Trigger: A layout or manifest that includes bootstrap/popover.js but not bootstrap/tooltip.js; concatenating/precompiling the vendored admin scripts in an order that puts popover.js ahead of tooltip.js; pruning 'unused' scripts from the generated admin layout and dropping tooltip.js while elements with data-toggle='popover' remain.

Common situations: Customizing the admin layout and rewriting the script tags; replacing or upgrading the vendored Bootstrap copy; switching to an asset pipeline where manual or alphabetical ordering puts popover first; reusing the vendored files on a non-admin page.

Related errors


AI-assisted analysis of padrino/padrino-framework@167044f3d5 (2026-08-23). Data as JSON: /api/errors/6f10c0aa67e55060. Report an issue: GitHub.