Film Finder

Film Finder, Did the Film Finder Project as part of Front End Career Path but this is the error I get : helpers.js:76 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading ‘length’) at getRandomMovie (helpers.js:76:59) at HTMLButtonElement.showRandomMovie (script.js:76:23) getRandomMovie @ helpers.js:76 showRandomMovie @ script.js:76 please help
const tmdbKey = ‘0224d2571b06ca0936b2a161af7f498c’;
const tmdbBaseUrl = ‘https://api.themoviedb.org/3’;
const playBtn = document.getElementById(‘playBtn’);

const getGenres = async () => {
const genreRequestEndpoint = ‘/genre/movie/list’
const requestParams = ?api_key=${tmdbKey}
const urlToFetch = ${tmdbBaseUrl}${genreRequestEndpoint}${requestParams}
try{
const response = await fetch(urlToFetch)
if(response.ok){

  const jsonResponse = await response.json()
  //console.log(jsonResponse)
  const genres = jsonResponse.genres
  //console.log(genres) 
  return genres

}

}catch(err){
console.log(err)
}

};

const getMovies = async () => {
const selectedGenre = getSelectedGenre();
const discoverMovieEndpoint = ‘/discover/movie’
const requestParams = ?api_key=${tmdbKey}&with_genres=${selectedGenre}
const urlToFetch = ${selectedGenre}${discoverMovieEndpoint}${requestParams}
try{
const response = await fetch(urlToFetch)
if(response.ok){
const jsonResponse = await response.json()
//console.log(jsonResponse)
const movies = jsonResponse.results
return movies
}

}catch(err){
console.log(err)
}

};
//getMovies()
const getMovieInfo = async (movie) => {
const movieId = movie.id
const movieEndpoint = movie/${movieId}
const requestParams = ?api_key=${tmdbKey}
const urlToFetch = ${tmdbBaseUrl}${movieEndpoint}${requestParams}
try{
const response = await fetch(urlToFetch)
if(response.ok){
const jsonResponse = await response.json()
const movieInfo = jsonResponse
return movieInfo

}

}catch(err){
console.log(err)
}

};

// Gets a list of movies and ultimately displays the info of a random movie from the list
const showRandomMovie = async () => {
const movieInfo = document.getElementById(‘movieInfo’);
if (movieInfo.childNodes.length > 0) {
clearCurrentMovie();
};
const movies = await getMovies()
const randomMovie = getRandomMovie(movies)
const info = await getMovieInfo(randomMovie)
displayMovie(info)

};

getGenres().then(populateGenreDropdown);
playBtn.onclick = showRandomMovie;

Hey @microblaster20003 ,

It looks like you’ve only posted your JS file, and not your HTML file. Do you mind sharing your entire project? It would be best through GitHub. If not, try and share it in the forums, but please follow How do I format code in my posts? so that I can better read your code.

Michael

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.