ReferenceError: Can't find variable for clientlib initialization
We have multiple components with custom javascript, the way we include this clientlibs is by adding a script tag to the component's html file.
<script>
window.bootstrap_component(function() {
init_component_name();
})
</script>
In our head.html we define the function bootstrap_component like so:
<script>
window.bootstrap_component = function (handler) {
if (typeof handler === 'function') {
if (document.readyState === "complete" || document.readyState === "loaded" || document.readyState === "interactive") {
handler();
} else {
document.addEventListener("DOMContentLoaded", function() {
handler();
});
}
}
}
</script>
This works just fine but for the past two years we have been getting bugs on and off from Bugsnag that say:
ReferenceError: Can't find variable: init_component_name
The pages where this errors are reported work just fine, checking the browser console or the error logs from AEM has revealed nothing, no error messages, no warnings, nothing. Our current theory is that the function is being called before the page has loaded despite the safeguards in place and then again once the DOM loads. Is there anything we could do to further troubleshoot this?