Click on Moving links is not waiting for the link to stop moving

Description

On HTML page with a link that is constantly moving, the click function doesn't wait for the link to stop moving

Steps to reproduce openBrowser() goto(html) click("Moving Link")

expected: to wait 10 seconds as indicated here:https://github.com/getgauge/taiko/blob/master/lib/actions/pageActionChecks.js#L71-L107

Actual: clicks right away after a second or so

reproduced every time, on lots of speeds 0.1s, 1s and for 500 px

The html:

<!DOCTYPE html>
<html>
<head>
  <title>Moving Link Example</title>
  <style>
    /* Define the animation */
    @keyframes moveLink {
      0% { transform: translateX(0); }
      100% { transform: translateX(200px); }
    }

    /* Apply the animation to the link */
    a {
      display: inline-block;
      animation: moveLink 2s linear infinite; /* The link will move every 2 seconds */
    }
  </style>
</head>
<body>
  <a href="#">Moving Link</a>
</body>
</html>

seems very similar to this - https://github.com/getgauge/taiko/issues/2550

getgauge / taiko

Click on Moving links is not waiting for the link to stop moving #2711