How do I make the edge animate like in marching ant and point it towards the target node?

I tried using the line-dash-offset property like this but it doesn't loop.

style

{
      selector: "edge",
      style: {
        "curve-style": "taxi",
        width: 2,
        "target-arrow-shape": "triangle",
        "target-arrow-color": "#9dbaea",
        "line-style": "dashed",
        "line-dash-pattern": [8, 4],
      }
    }

animation

let loopAnimation = eles => {
  eles.animation(
      {
        style: {
          "line-dash-offset": 24,
          "line-dash-pattern": [8, 4],
        }
      },
      {
        duration: 1000
      }
  ).play().promise('complete').then(() => loopAnimation(eles))
};

cy.edges().forEach(loopAnimation);