Popper v Bootstrap gotcha

dev in pain
WordPress Development

I encountered a bit of a gotcha while working with Bootstrap and Popper recently.

Although both javascript libraries were enqued, when I checked the consol I saw this:

Uncaught TypeError: Bootstrap's tooltips require Popper.js

It turns out that the order of enqueuing matters.

This works

<?php
//...
    wp_enqueue_script( 'popper-js' );
    wp_enqueue_script( 'bootstrap-js' );

This does not

<?php
//...
    wp_enqueue_script( 'bootstrap-js' );
    wp_enqueue_script( 'popper-js' );

The difference is that popper-js must happen before bootstrap. If not, then bootstrap gets the right hump.

Not the easiest error to track down. Anyway, I hope this post will save someone from a lot of head scratching. Meanwhile, back to the grindstone for me.

No Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

To respond on your own website, enter the URL of your response which should contain a link to this post's permalink URL. Your response will then appear (possibly after moderation) on this page. Want to update or remove your response? Update or delete your post and re-enter your post's URL again. (Find out more about Webmentions.)

Bugs
PHP updates and fixing BuddyPress Follow

BuddyPress Follow is a plugin we use to enable you to follow rather than “friend” each other. Sadly, it is not PHP 8 ready. This was holding us back both in terms of security and speed. Today, I fixed that. It was a four-line fix, which I shared here. Find …

WordPress Development
8
Possible site speed-up feature

The news is that WordPress released a performance plugin that could offer “Near-Instant Load Times”. Danny pointed this one out to me. It looks good. WordPress released an official plugin that adds support for a cutting edge technology called speculative loading that can help boost site performance and improve the …

WordPress Development
An incomplete BuddyPress codex

To keep all of my notes in one place, I have started a public site for my BuddyPress development notes. This is a personal and incomplete codex and is found here on Matrix Dreams. I am accepting contributions but honestly don’t expect any.

Skip to toolbar