twbs/bootstrap · error · TypeError

No method named "${config}"

Error message

No method named "${config}"

What it means

Collapse's jQueryInterface has a special preprocessing step: when the string is 'show' or 'hide', it merges {toggle: false} into the config before creating the instance, then invokes the string as a method. The guard here is the weakest of all components — it only checks typeof data[config] === 'undefined', with no '_'/'constructor' filtering. Public methods are show, hide, toggle and dispose.

Source

Thrown at js/src/collapse.js:267

    for (const element of triggerArray) {
      element.classList.toggle(CLASS_NAME_COLLAPSED, !isOpen)
      element.setAttribute('aria-expanded', isOpen)
    }
  }

  // Static
  static jQueryInterface(config) {
    const _config = {}
    if (typeof config === 'string' && /show|hide/.test(config)) {
      _config.toggle = false
    }

    return this.each(function () {
      const data = Collapse.getOrCreateInstance(this, _config)

      if (typeof config === 'string') {
        if (typeof data[config] === 'undefined') {
          throw new TypeError(`No method named "${config}"`)
        }

        data[config]()
      }
    })
  }
}

/**
 * Data API implementation
 */

EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
  // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
  if (event.target.tagName === 'A' || (event.delegateTarget && event.delegateTarget.tagName === 'A')) {
    event.preventDefault()
  }

View on GitHub (pinned to 6177d5f849)

Solutions

1. Use the actual methods: show, hide, toggle, dispose.
2. Fix typos — note the vocabulary is show/hide, not open/close.
3. Check the name before dispatch: typeof bootstrap.Collapse.getInstance(el)?.[name] === 'function'.
4. Use the vanilla API (bootstrap.Collapse.getOrCreateInstance(el).toggle()) for dynamic call sites.

Example fix

// before
$('#collapse').collapse('toogle') // TypeError: No method named "toogle"

// after
$('#collapse').collapse('toggle') // public methods: show | hide | toggle | dispose

function callCollapseMethod(element, method) {
  const instance = bootstrap.Collapse.getOrCreateInstance(element)
  if (typeof instance[method] !== 'function') {
    console.warn(`Collapse: ignoring unknown method "${method}"`)
    return
  }
  instance[method]()
}

const COLLAPSE_METHODS = ['show', 'hide', 'toggle', 'dispose'] as const
type CollapseMethod = (typeof COLLAPSE_METHODS)[number]
const isCollapseMethod = (m: string): m is CollapseMethod =>
  (COLLAPSE_METHODS as readonly string[]).includes(m)

try {
  $('#collapse').collapse(method)
} catch (err) {
  if (err instanceof TypeError && err.message.startsWith('No method named')) {
    console.warn(`Collapse: unknown method "${method}"`)
  } else {
    throw err
  }
}

When it happens

Trigger: $('#collapse').collapse('toogle') (typo for toggle); $('#collapse').collapse('open') or 'close' (the vocabulary is show/hide); $('#collapse').collapse('expandAll'); any dynamic name that is not exactly show, hide, toggle or dispose.

Common situations: Server-rendered templates using open/close wording; developers mixing data-bs-toggle attributes with programmatic calls; typos in wrapper libraries (Rails/Turbo, Livewire helpers) that forward string commands.

Related errors

• No method named "${config}"
• No method named "${config}"
• No method named "${config}"
• No method named "${config}"
• No method named "${config}"

AI-assisted analysis of twbs/bootstrap@6177d5f849 (2026-08-22). Data as JSON: /api/errors/ab503d05069f3ae0. Report an issue: GitHub.