O erro "Uncaught (in promise) TypeError: video.className is not a function" ocorre porque você está usando className como uma função em vez de uma propriedade.

Para corrigir o erro, você precisa modificar a linha onde está definindo a classe do elemento video. Em vez de video.className('videos__item'), você deve usar video.classList.add('videos__item'). O método classList.add() adiciona a classe especificada ao elemento.

Aqui está o trecho corrigido do código:

function constroiCard(titulo, descricao, url, imagem) {
    const video = document.createElement('li');
    video.classList.add('videos__item');
    video.innerHTML = `<iframe width="100%" height="72%" src="${url}"
    title="${titulo}" frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
    <div class="descricao-video">
    <img src="${imagem}" alt="logo canal alura">
    <h3>${titulo}</h3>
    <p>${descricao}</p>
    </div>
  `;

    return video;
}

Com essa correção, o erro deve desaparecer, e seu código deve funcionar corretamente. Certifique-se de que o arquivo conectaAPI.js esteja importado corretamente e que a função conectaAPI.listaVideos() esteja retornando os dados esperados.

Nota:

Com essa correeção sugerida pelo ChatGPT realmente o erro sumiu, porém fiquei sem entender a razão do código escrito video.className('videitem) funcionar na aula e na minha máquina não funcionar, poderia me ajudar a entender?