Accessing custom "element" in HTML

Question

Here's my code:

<input type="text" data-test-id="Thanks">

<script>

    var link = document.querySelectorAll("input");    // find all "input" on page

    for (var i= 0; i < link.length;  i++) {           // loop through them all

        aa=link[i]["data-test-id"];

        alert(aa);  // I want this to output:   Thanks

    }
</script>

Obviously, the code above doesn't work and only outputs: undefined I do not want to change anything in the code besides the "aa= ...."

Any ideas on how to achieve the goal above? I been looking for over an hour :( Thank you soo much!!