Greasy Fork

Hi, at 03:30 on 21/10/2023 French time and date, I ran into the same problem, I came across your script by chance :3, I fixed the problem of fullscreen and autoplay.

Thanks again for the script ^^

    let currentPageUrl = window.location.href;

    window.addEventListener('beforeunload', function () {
        currentPageUrl = window.location.href;
    });

    document.addEventListener('yt-navigate-finish', function () {
        const newUrl = window.location.href;
        if (newUrl !== currentPageUrl) {
            const url = "https://www.youtube-nocookie.com/embed/" + splitUrl(newUrl) + "?autoplay=1";
            const player = document.getElementById("youtube-iframe");
            player.setAttribute('src', url);
        }
    });

    // returns the video ID
    function splitUrl(str) {
        return str.split('=')[1];
    }

    // main function
    function run() {
        console.log("Loaded");
        // remove block screen
        const block = document.querySelector('.yt-playability-error-supported-renderers');
        if(!block) return;
        block.parentNode.removeChild(block);
        // get the url for the iframe
        const url = "https://www.youtube-nocookie.com/embed/" + splitUrl(window.location.href) + "?autoplay=1";
        // get the mount point for the iframe
        const oldplayer = document.getElementById("error-screen");
        // create the iframe
        const player = document.createElement('iframe');
        player.setAttribute('src', url);
        player.setAttribute('allow', 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share');
        player.setAttribute('frameborder', '0');
        player.setAttribute('allowfullscreen', true);
        player.style = "height:100%;width:100%;border-radius:12px;";
        player.id = "youtube-iframe";
        // append the elements to the DOM
        oldplayer.appendChild(player);
        console.log('Finished');
    }

    // Execute the code
    (function() {
        'use strict';
        //|             |||
        // RUN DELAY    VVV
        setTimeout(run, 1000);
    })();

You also have to change the splitUrl() function to return like this instead:

    function splitUrl(str) {
        return str.split('=')[1].split('&')[0];
    }

This is because if you click a video from your notifications, an ID is attached to the end of the URL (e.g. &lc=Ugwz7P5LSoxcCCQnTGh4AaABAg) and this breaks the embedded version of the youtube player - the video will just fail to load. The same goes for things like timestamp tags (e.g. &t=4m00s) - this also breaks the embedded player. Basically any and all extraneous data in the video URL has to be removed first.

Also, this line is incorrect:

       player.setAttribute('allowfullscreen', true);

Change it to be like this, to extend the support to all currently existing browsers:

       player.setAttribute('allowfullscreen', "allowfullscreen");
       player.setAttribute('mozallowfullscreen', "mozallowfullscreen");
       player.setAttribute('msallowfullscreen', "msallowfullscreen");
       player.setAttribute('oallowfullscreen', "oallowfullscreen");
       player.setAttribute('webkitallowfullscreen', "webkitallowfullscreen");
       player.setAttribute('webkitallowfullscreen', "webkitallowfullscreen");

Otherwise, the fix is appreciated. Keep fighting the good fight. :)