JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.rawgit.com/HubSpot/tether/master/dist/js/tether.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://v4-alpha.getbootstrap.com/dist/css/bootstrap.min.css">
<script src="https://v4-alpha.getbootstrap.com/dist/js/bootstrap.js"></script>
<h3>
Interactive demo
</h3>
<p>
Click the buttons and hover over the buttons multiple and you will eventually see errors thrown in the console
</p>
<p>
Uncaught Error: Tooltip is transitioning on line 2946
</p>

<!-- Tooltip -->
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">
  Tooltip on top
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="right" title="Tooltip on right">
  Tooltip on right
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">
  Tooltip on bottom
</button>
<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="left" title="Tooltip on left">
  Tooltip on left
</button>

JavaScript

$(function () {
  $('[data-toggle="tooltip"]').tooltip();
})