Snackbar not working in version 4.1.1

I cannot include a Codepen, I'm sorry, but I can try to illustrate why I think Snackbar is not working in version 4.1.1:

This HTML will load just fine - and the console is clean as a whistle!

Test Case

. . .
<script src="/assets/application.self-5e866087125b4eb5e02a8365d73cdaeb7f2127bbb3f479fb54ab3ddb0d5c66af.js?body=1" data-turbolinks-track="reload"></script>
</head>
<body>
<span class='btn btn-material-teal' onclick='javascript:$.snackbar({content: &#39;This is a JS generated snackbar, it rocks!&#39;, style: &#39;toast&#39;});'>Create and show a toast!</span>
<!-- / render menu and yield to content -->
<div class='bmd-layout-container bmd-drawer-f-l bmd-drawer-overlay'>

. . .
</nav>
<div id='snackbar-container'></div>
<script crossorigin='anonymous' integrity='sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U' src='https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js'></script>
<script crossorigin='anonymous' integrity='sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9' src='https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js'></script>
<script src='snackbar.min.js'></script>

But if I press the span/button in the top of my viewport - I get this in my console:

avisudklips:28 Uncaught TypeError: $.snackbar is not a function
    at HTMLSpanElement.onclick (avisudklips:28)
onclick @ avisudklips:28

(and the avisudklips line 28 is the one defining the span with the onclick event attached)

Perhaps ill-disguised this is a Rails 5.2.0 site and I had some serious troubles getting the snackbar into line - it would complain again and again (trying to place it in various order - before/after jquery et all) if I took the 'usual route' with

// assets/javascripts/application.js
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's
// vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require pagy
//= require jquery
//= require snackbar/dist/snackbar
//= require_tree .

The message on document load would be:

snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:36 Uncaught TypeError: Cannot read property 'appendChild' of null
    at new Snackbar (snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:36)
    at snackbar (snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:14)
    at Object.1../snackbar (snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:19)
    at s (snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:1)
    at e (snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:1)
    at snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:1
    at snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:1
    at snackbar.self-8cf3e7311ff052ee4b5bfe1b8a6f01c3dd5512533a3e54e4b20857037dd78958.js?body=1:1

The snackbar.js line 36 says:


var Snackbar = function () {
  function Snackbar() {
    _classCallCheck(this, Snackbar);

    this.view = document.body.appendChild(document.createElement('div'));
    this.view.classList.add('snackbar');
    this.isActive = false;
    this.queue = [];
    this.gap = 250;
    this.duration = 5000;
  }

and that error is quickly dismissed as a 'document not yet loaded 100%' hence the DOM is not in place when Snackbar wants to add to the document.body - so I had to include it as a separate script in the bottom of the document - but that (see above) did not improve my success rate

mdbootstrap / mdb-ui-kit

Snackbar not working in version 4.1.1 #1327

Test Case