title: Can't get draggable/droppable work in shopify library
body: <p>I couldn't get <a href="https://github.com/Shopify/draggable" rel="nofollow noreferrer">shopify/draggable</a> work for me. Actually I just need to</p>
  
  <ol>
  <li>Drag an element</li>
  <li>Catch when it's dropped on a canvas</li>
  <li>Do some stuff on canvas</li>
  </ol>
  
  <p>I tried to work just with divs and here is my attempt: <a href="https://jsfiddle.net/1v4eL8oz/6/" rel="nofollow noreferrer">https://jsfiddle.net/1v4eL8oz/6/</a></p>
  
  <pre><code>const containers = document.querySelectorAll('.block')
  
  const droppable = new Draggable.Droppable(containers, {
    draggable: '.draggable',
    droppable: '.droppable'
  });
  
  droppable.on('drag:start', () =&gt; console.log('drag:start'));
  droppable.on('droppable:over', () =&gt; console.log('droppable:over'));
  droppable.on('droppable:out', () =&gt; console.log('droppable:out'));
  </code></pre>
  
  <p>I noticed that drag:start gets fired, and that's it. What am I doing wrong?</p>