Although the Bootstrap-native JavaScript may not be directly necessary until user interaction begins, I am considering lazy loading it to save a few KB. However, I have encountered a minor issue with the initialization function initCallback(); because DOMContentLoaded triggers before the bootstrap.js is downloaded when lazy loading, causing the script to not initialize properly.
As a JavaScript hobbyist, I am struggling to manually call this function after fetch() has finished downloading the script using fetchInject(). Perhaps lazy loading Bootstrap is not the best idea, but I will continue to work on it to see if I can make it function correctly.
/* Native Javascript for Bootstrap 4 | Initialize Data API --------------------------------------------------------*/ var initializeDataAPI = function(constructor, collection) { for (var i=0, l=collection[length]; i< l; i++) { new constructor(collection[i]); } }, initCallback = BSN.initCallback = function(lookUp) { lookUp = lookUp || DOC; for (var i=0, l=supports[length]; i<l; i++) { initializeDataAPI(supports[i][1], lookUp[querySelectorAll](supports[i][2])); } }; // bulk initialize all components DOC[body] ? initCallback() : on(DOC, 'DOMContentLoaded', function() { initCallback(); }); I need initCallback() to run so that Bootstrap can detect all the HTML inline data hooks and elements like dropdowns.