Youtube API Playlist – List playlist stopped working

I have a strange issue on a system that creates a youtube playlist, and then fills the playlist with videos from a database table.

The code is Version Controlled by GIT, and have no commits in the code for 3-4 months, and it has worked up to a couple of days back.

Suddenly it can’t find the items, and therefore doesn’t find the id, of the item that it should find. The system creates a list, then find the latest created playlist (which is the one you just created), and then fills the playlist up normally.

I’m not very good as javascript to be honest, are there any good javascript developers out there that can solve this? The error seems pretty common when googling, but In addition to the youtube api use, I find it hard to figure out the issue. Why it suddenly doesn’t result items. (If I run a GET in Postman, ill get the correct playlist, so it should be something in the code that isn’t working 100%)

function createPlaylist() {
var client = document.getElementsByName("client")[0].value;
var description = document.getElementsByName("information")[0].value;
return gapi.client.youtube.playlists.insert({
  "part": [
    "snippet,status"
  ],
  "resource": {
    "snippet": {
      "title": client,
      "description": description,
      "position": 1,
      "resourceId": {
        "kind": "youtube#video",
        "videoId": "mhmGwTDpPf0"
      },
      "tags": [
        "postural workout"
      ],
      "defaultLanguage": "en"
    },
    "status": {
      "privacyStatus": "public"
    }
  }
})
    .then(function(response) {
       

            return gapi.client.youtube.playlists.list({
            "part": [
              "id,snippet,contentDetails"
            ],
            "maxResults": 1,
            "mine": true
          })
          .then(function(response) {
                  console.log("Response", response);
                  MyVars.latestPlaylistID = response.result.items[0].id; 
                  
                  pID = MyVars.latestPlaylistID
                  console.log(pID + " is the latest playlist");
                  
                  var doms = document.getElementsByTagName("tr");

                  // Get every TR into an array
                  var array = $('tbody > tr').map(function() {
                    return $.map($(this).data(), function(v) {
                        return v;
                    });
                  }).get();
                  //array.reverse();
                  var array = array.filter(function(element){ return element.length>=11});
                  videosIdArray = array.reverse();
                  
                  console.log(pID, videosIdArray, 0);
                  
                  addVideoToPlayList(pID, videosIdArray, 0);
                  
                  // setTimeout(addVideoToPlayList(pID, videosIdArray, 0), 5000);
                  
                  
                  document.getElementById("playlistID").innerHTML = 'https://www.youtube.com/playlist?list=' + pID;
                  document.getElementById("playlistID").href = 'https://www.youtube.com/playlist?list=' + pID;
                  
                  
                },
                function(err) { console.error("ListPlaylist error", err); });  


      
          },
          function(err) { console.error("InsertPlaylist error", err); });
                        
        

}

This is what happens now: Error

And as you can see the items array is empty.

Answer

I have now solved it!

By breaking down the function into smaller functions it seems to give me the correct result. Why the problem suddenly occured is still uknown, but I’m glad it now works.

This is the final solution if others out there are trying to solve similiar issue.

function createPlaylist() {
    var client = document.getElementsByName("client")[0].value;
    var description = document.getElementsByName("information")[0].value;
    return gapi.client.youtube.playlists.insert({
      "part": [
        "snippet,status"
      ],
      "resource": {
        "snippet": {
          "title": client,
          "description": description,
          "position": 1
        },
        "status": {
          "privacyStatus": "public"
        }
      }
    }).then(function(response) {
        console.log("Response", response);
    });
}


  function addToPlaylist() {
    return gapi.client.youtube.playlists.list({
        "part": [
        "id,snippet,contentDetails"
        ],
        "maxResults": 1,
        "mine": true
        })
        .then(function(response) {
            console.log("Response", response);
            MyVars.latestPlaylistID = response.result.items[0].id; 
            
            pID = MyVars.latestPlaylistID
            console.log(pID + " is the latest playlist");
            
            var doms = document.getElementsByTagName("tr");

            var array = $('tbody > tr').map(function() {
                return $.map($(this).data(), function(v) {
                    return v;
                });
            }).get();
            
            var array = array.filter(function(element){ return element.length>=11});
            videosIdArray = array.reverse();
            console.log(pID, videosIdArray, 0);
            addVideoToPlayList(pID, videosIdArray, 0);

            },
            function(err) { console.error("ListPlaylist error", err); });  

}