Learn Fetch and Promises by Building an fCC Authors Page Step 17

const authorContainer = document.getElementById('author-container');
const loadMoreBtn = document.getElementById('load-more-btn');

let startingIndex = 0;
let endingIndex = 8;
let authorDataArr = [];

  .then((res) => res.json())
  .then((data) => {
    authorDataArr = data;
    displayAuthors(authorDataArr.slice(startingIndex, endingIndex));
  .catch((err) => {
    console.error(`There was an error: ${err}`);

const displayAuthors = (authors) => {
  authors.forEach(({ author, image, url, bio }, index) => {
    authorContainer.innerHTML += `
    <div id="${index}" class="user-card">
      <h2 class="author-name">${author}</h2>
<img class="user-img" src="${image}" alt="${author} avatar">

It ask me to create an img element, Ive done it and it keeps giving me a test timed out error. I dont know why.

I tested it on my end and it is working for me.

Try resetting the lesson and only adding the image again.

Still no luck. Steps 17-19 are giving me the same error.

Can you try another browser?

I am testing your code on google chrome with extensions off and I am not able to reproduce the error you are seeing

1 Like

Oh it worked on chrome! Weird that it doesn’t work safari though. Thank you for helping me!