JSON APIs and Ajax: Access the JSON Data from an API, solution fails verification

JavaScript
1

Tell us what’s happening:
The following solution meets the challenge brief. But fails verification. It seems that determining the index of the required element in the json array using the indexOf method is not valid. I would argue that this is a more reliable way than making the assumption that each objects’ id property value, matches the objects index in the array.

Your code so far


<script>
document.addEventListener('DOMContentLoaded', function(){
  document.getElementById('getMessage').onclick = function(){
    const req = new XMLHttpRequest();
    req.open("GET",'/json/cats.json', true);
    req.send();
    req.onload=function(){
      const json = JSON.parse(req.responseText);
      document.getElementsByClassName('message')[0].innerHTML = JSON.stringify(json);
      // Add your code below this line
  console.log(
    json[json.findIndex(el => 
      el['id'] === 2)].codeNames[1]
  )
      // Add your code above this line
    };
  };
});
</script>

<style>
body {
  text-align: center;
  font-family: "Helvetica", sans-serif;
}
h1 {
  font-size: 2em;
  font-weight: bold;
}
.box {
  border-radius: 5px;
  background-color: #eee;
  padding: 20px 5px;
}
button {
  color: white;
  background-color: #4791d0;
  border-radius: 5px;
  border: 1px solid #4791d0;
  padding: 5px 10px 8px 10px;
}
button:hover {
  background-color: #0F5897;
  border: 1px solid #0F5897;
}
</style>

<h1>Cat Photo Finder</h1>
<p class="message box">
The message will go here
</p>
<p>
<button id="getMessage">
  Get Message
</button>
</p>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36.

Challenge: Access the JSON Data from an API

Link to the challenge:

2

There are two problems here:

  1. The test is not written well (imo).
  2. You’re working too hard.

You’re calculating the index, they want you to just hard code it. Unfortunately the test isn’t smart enough to figure that out.

When I hardcode that value, the test passes for me.