Restore Delete button for YouTube playlists - https://i.imgur.com/MwM3GCb.gif

restore-delete-button-for-yt-playlists.user.js

// ==UserScript==
// @name         Restore Delete button for YouTube playlists
// @namespace    restore-delete-button-for-yt-playlists
// @version      0.1
// @description  When you watch a playlist, the delete button is hidden under a submenu. It restores the delete button to its original place near the playlist item. When you hover over a playlist item, the trashcan  icon appears. See in action: https://i.imgur.com/MwM3GCb.gif
// @author       Lorand Horvath
// @match        https://www.youtube.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @grant        none
// ==/UserScript==

(function()
{
    'use strict';

    /*
    How the script works?
    - if you hover over a playlist item (mouseenter) with your mouse, the script opens the mini menu and places the delete button near the playlist item
    - if you stop hovering over the playlist item (mouseleave), the script puts back the delete button to its original place
    */

    // variables holding the opened menu element and delete button temporarily
    var minimenu = undefined;
    var deletebutton = undefined;

    // puts back delete button to its original place
    function putback()
    {
        document.querySelector("ytd-popup-container").style.opacity = 1;
        minimenu.appendChild(deletebutton);
        deletebutton = undefined;
        minimenu.style.display = "initial";
    }

    setInterval(function()
    {

        if ( !window.location.href.match("youtube\.com/watch.*list=.*") ) return;
        console.log("restore-delete-button-for-yt-playlists loaded");

        // get every playlist item
        var videos = document.querySelectorAll("ytd-playlist-panel-video-renderer");

        // for every playlist item
        for (var i = 0; i < videos.length; i++)
        {
            // check if event listener is already added to the item
            if ( videos[i].hasAttribute("deletebutton") ) continue;
            videos[i].setAttribute("deletebutton");

            // it no event listener, add it
            videos[i].addEventListener("mouseenter", function()
            {
                // make mini menu invisible and open it
                document.querySelector("ytd-popup-container").style.opacity = 0;
                this.querySelector("div#menu ytd-menu-renderer yt-icon-button button").click();
                minimenu = document.querySelector("ytd-menu-popup-renderer tp-yt-paper-listbox");
                minimenu.style.display = "none";

                // wait for minimenu open
                setTimeout(function()
                {
                    minimenu.style.display = "none";

                    // due to quick mousemove the putback function fails. this line triggers it again
                    if (typeof deletebutton !== 'undefined') putback();

                    // search for delete button and remove its label
                    var menuitems = minimenu.querySelectorAll("ytd-menu-service-item-renderer");
                    deletebutton = menuitems[menuitems.length - 1];
                    deletebutton.querySelector("yt-formatted-string").textContent = "";

                    this.appendChild(deletebutton); // append delete button to playlist item

                    // when you click delete button (it deletes the video) and after it put back the button into the minimenu
                    deletebutton.onclick = function()
                    {
                        minimenu.appendChild(deletebutton);
                    }

                }.bind(this), 50); // end of setTimeout

            }); // end of addEventListener

            // after leaving the playlist item (without clicking on the delete button) also put back into the minimenu
            videos[i].addEventListener("mouseleave", function()
            {
                setTimeout(putback, 50);
            });

        } // end of for

    }, 1000); // end of setinterval

})();