JavaScript Asynchronous Programming with JavaScript Asynchronous JavaScript with Callbacks Implement a Callback

Console is throwing error for the original code that the teacher provided.

When I run my code, the console throws an error for the original code the teacher provided. It says Uncaught TypeError: Cannot read property 'source' of undefined at generateHTML (callbacks.js:24) at XMLHttpRequest.xhr.onload (callbacks.js:13)

My workspace is https://w.trhou.se/bt44d6t918

1 Answer

Ken Stone
Ken Stone
26,868 Points

You need to check that data.thumbnail.source is indeed set:

// Generate the markup for each profile
function generateHTML(data) {
  const img_src = (data.thumbnail && data.thumbnail.source) ? data.thumbnail.source : '';
  const section = document.createElement('section');
  peopleList.appendChild(section);
  section.innerHTML = `
    <img src=${img_src}>
    <h2>${data.title}</h2>
    <p>${data.description}</p>
    <p>${data.extract}</p>
  `;
}

Okay, thanks! It worked.