dotnet/AspNetCore.Docs · critical · Error

Popover requires tooltip.js

Error message

Popover requires tooltip.js

What it means

Bootstrap 3's Popover module checks `if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')` at definition time. Popover extends the Tooltip constructor (`Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)`), so it depends on Tooltip being loaded first.

Source

Thrown at aspnetcore/mvc/views/tag-helpers/th-components/samples/RazorPagesSample/wwwroot/lib/bootstrap/js/bootstrap.js:1797

 * Bootstrap: popover.js v3.3.7
 * http://getbootstrap.com/javascript/#popovers
 * ========================================================================
 * Copyright 2011-2016 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.VERSION  = '3.3.7'

  Popover.DEFAULTS = $.extend({}, $.fn.tooltip.Constructor.DEFAULTS, {
    placement: 'right',
    trigger: 'click',
    content: '',
    template: '<div class="popover" role="tooltip"><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

View on GitHub (pinned to c67a80103a)

Solutions

1. Load the full bootstrap.js (which includes tooltip before popover), or ensure tooltip.js precedes popover.js in any custom build.
2. Verify `$.fn.tooltip` is defined in the console before relying on popovers.
3. Use the bundled Bootstrap distribution rather than hand-picked individual component files.

Example fix

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

<!-- after -->
<script src="bootstrap/js/tooltip.js"></script>
<script src="bootstrap/js/popover.js"></script>

function assertTooltipLoaded() {
  if (!window.jQuery || !jQuery.fn.tooltip) {
    throw new Error('Load tooltip.js before popover.js');
  }
}

function popoverDepsReady() {
  return typeof jQuery !== 'undefined' && typeof jQuery.fn.tooltip === 'function';
}

// Build-time error — fix bundling, do not catch.
// Guard at runtime if loading components dynamically:
if (!$.fn.tooltip) { import('./tooltip.js').then(() => import('./popover.js')); }

When it happens

Trigger: Loading the popover portion of bootstrap without the tooltip portion; or splitting bootstrap into modules and including popover.js before tooltip.js. In the combined bootstrap.js this only fires if tooltip was somehow stripped.

Common situations: Custom build of Bootstrap that excluded tooltip.js but kept popover.js; partial bundle that tree-shook away tooltip; ordering bug in a concatenated vendor bundle; manually loading only `popover.js` from the Bootstrap source.

Related errors

• Popover requires tooltip.js
• Popover requires tooltip.js
• Bootstrap's JavaScript requires jQuery
• Bootstrap's JavaScript requires jQuery
• ${this.type} `template` option must consist of exactly 1 top

AI-assisted analysis of dotnet/AspNetCore.Docs@c67a80103a (2026-08-13). Data as JSON: /api/errors/41331f975f01a761. Report an issue: GitHub.