Strange behaviour of an ASP core attribute in Javascript

Question

I am having a strange issue with ASP core and Javascript and could not find any answer out there.

The index page of the web site I am working with, receives from the controller, a ViewModel containing among other things two attributes. One named "testID" and one named "test". Both have exactly the same information, a string which is an ID.

C#:

public IActionResult Index()
        {
            InboxViewModel newViewModel = new InboxViewModel();

            newViewModel.TestID = "sdf-sdf-sdf-sdf-sdf-sdf-sdf";
            newViewModel.test = "sdf-sdf-sdf-sdf-sdf-sdf-sdf";

            return View(newViewModel);
        }

Now, on my Razor page I set an onClickTest() method onto an tag:

<a href="#" onclick="onClickTest();"> Click Here </a>

The function in Javascript looks like this:

JAVASCRIPT:

function onClickTest() {

       ViewModelJS = @Html.Raw(Json.Serialize(Model)); //Translate C# Model to JS Model.
       
       console.log('test id: ' + ViewModelJS.testid); // This print as UNDEFINED
       console.log('test   : ' + ViewModelJS.test);   // This one prints fine.

}

Like you can see from the above code (Javascript), the line that prints the "test" attribute works as supposed but the attribute named "testid", does not. Prints "UNDEFINED".

Then, if I take away the "id" part of the name or change it to some other thing (without the word "id" on it), it works fine! So it must has something to do with the name...

Now, if the site is running and I open the browser console and print manually something like "console.log(ViewModelJS.testid)" then it works fine, as it should be. But not when I click on the tag and the function is called.

Any ideas???

Thanks a lot!