Interactjs decreases data-y attribute of an element to 0 in Safari
<p>I am using interactjs with angular js. I use the plugin only for dragging in y-axis and the grid in in one container. It works fine in Chrome and Firefox. However, when I move a grid in Safari, the data-y gets decreased to 0 at the end.
My code:</p>

<pre><code>.draggable({
    // enable inertial throwing
    enabled:true,
    inertia: true,
    snap: {
      targets: [
        interact.createSnapGrid({ x: 0, y: 30})
      ],
      range: Infinity,
      relativePoints: [ { x: 0, y: 0 } ]
    },
    // keep the element within the area of it"s parent
    restrict: {
      restriction: "parent",
      endOnly: true,
      elementRect: { top: 0, left: 0, bottom: 1, right: 1 }
    },
    // enable autoScroll
    autoScroll: true,
    // call this function on every dragmove event
    onmove: function(event){
        console.log("onmove");
        var target = event.target,
            x = parseFloat(target.getAttribute("data-x")) + event.dx,
            y = parseFloat(target.getAttribute("data-y")) + event.dy;
        // translate the element
        target.style.webkitTransform =
        target.style.transform =
          "translate(" + 0 + "px, " + y + "px)";
          console.log("y onmove: "+y);

        // update the posiion attributes
        target.setAttribute("data-x", 0);
        target.setAttribute("data-y", y);
    },
    onend: function(event){
        console.log("onend");
        var target = event.target,
            y = parseFloat(target.getAttribute("data-y"));
        console.log("y onend: "+ y);    
        y = getMoveGrid(y);
        // translate the element
        target.style.webkitTransform =
        target.style.transform =
          "translate(" + 0 + "px, " + y + "px)";
        // update the posiion attributes
        target.setAttribute("data-x", 0);
        target.setAttribute("data-y", y);
        $scope.updateReservation(event.target.getAttribute("id"));
    }
})
.on("dragmove", function (event) {
    console.log("dragmove");
    var x = 0+ event.dx;
    var y = 0 +event.dy;

    event.target.style.webkitTransform =
    event.target.style.transform =
        "translate(" + x + "px, " + y + "px)";
})
</code></pre>

<p>The log in my console when I dragged a grid (in safari):</p>

<pre><code>[Log] dragmove (reservations.js, line 378)
[Log] onmove (reservations.js, line 346)
[Log] y onmove: 45 (reservations.js, line 354)
//then several y onmove: 15
[Log] dragmove (reservations.js, line 378)
[Log] onmove (reservations.js, line 346)
[Log] y onmove: 15 (reservations.js, line 354)
//then one y onmove: 0 and the onend function is run
[Log] dragmove (reservations.js, line 378)
[Log] onmove (reservations.js, line 346)
[Log] y onmove: 0 (reservations.js, line 354)

[Log] onend (reservations.js, line 362)
[Log] y onend: 0 (reservations.js, line 365)
</code></pre>

<p>In Chrome it would print</p>

<pre><code>reservations.js:346 onmove
reservations.js:354 y onmove: 45
reservations.js:355  

reservations.js:362 onend
reservations.js:365 y onend: 45
</code></pre>