__bookmarklet_open-yt-channel-feed-as-json.js

/*
    code to get the channel id the youtube video page
    the output in case of susscess will open on a new
    browser tab the youtube channel feed as JSON

    initially based on
    https://paperless.blog/youtube-channel-web-feed-bookmarklet

    but I got some edge cases where that doesn't work, so I reworked it

    ---

    generate a bookmarklet at
    https://make-bookmarklets.com/
*/
(async () => {

    // https://github.com/syntaxsurge/youtube-channel-id-extractor/blob/main/youtube_channel_id_extractor.js#L30
    const readVideoOwnerUrl = () => document.querySelector('.yt-simple-endpoint.style-scope.ytd-video-owner-renderer')?.href;

    const readChannelIdFromDocument = (document) => {
        return document
            .querySelector(
                "link[rel='canonical'][href^='https://www.youtube.com/channel/']",
            )
            ?.getAttribute("href")
            ?.substring(32);
    };

    const extractChannelIdFromYtChannelUrl = async (ytChannelUrl) => {
        // https://stackoverflow.com/a/50812705
        return fetch(ytChannelUrl)
            .then(function(response) {
                // When the page is loaded convert it to text
                return response.text();
            })
            .then(function(html) {
                // Initialize the DOM parser
                const parser = new DOMParser();
        
                // Parse the text
                const doc = parser.parseFromString(html, "text/html");
        
                // You can now even select part of that html as you would in the regular DOM 
                // Example:
                // var docArticle = doc.querySelector('article').innerHTML;
        
                return readChannelIdFromDocument(doc);
            })
            .catch(function(err) {  
                console.log('Failed to fetch page: ', err);  
                return '';
            });
    }

    const resolveChannelId = async () => {
        const channelId =
            window?.ytInitialPlayerResponse?.videoDetails?.channelId ??
            readChannelIdFromDocument(document);

        return channelId ?? await extractChannelIdFromYtChannelUrl(readVideoOwnerUrl());
    };

    const channelId = await resolveChannelId();

    if ( channelId ) {
        const ytChannelFeedURL = `https://www.youtube.com/feeds/videos.xml?channel_id=${channelId}`;
        const feed2jsonURL = `https://feed2json.org/convert?url=${encodeURIComponent(ytChannelFeedURL)}`;

        console.log({ channelId, ytChannelFeedURL, feed2jsonURL })

        // https://stackoverflow.com/questions/4907843/open-a-url-in-a-new-tab-and-not-a-new-window
        Object.assign(document.createElement('a'), {
            target: '_blank',
            rel: 'noopener noreferrer',
            href: feed2jsonURL,
        }).click();
    } else {
        console.warn(`Could not find a channel ID feed at ${location.href}`);
    }
})();

bookmarket__generated_on_02406281708.js

javascript:(function(){(async()=>{const e=e=>e.querySelector("link[rel='canonical'][href^='https://www.youtube.com/channel/']")?.getAttribute("href")?.substring(32),n=await(async()=>window?.ytInitialPlayerResponse?.videoDetails?.channelId??e(document)??await(async n=>fetch(n).then((function(e){return e.text()})).then((function(n){const t=(new DOMParser).parseFromString(n,"text/html");return e(t)})).catch((function(e){return console.log("Failed to fetch page: ",e),""})))(document.querySelector(".yt-simple-endpoint.style-scope.ytd-video-owner-renderer")?.href))();if(n){const e=`https://www.youtube.com/feeds/videos.xml?channel_id=${n}`,t=`https://feed2json.org/convert?url=${encodeURIComponent(e)}`;console.log({channelId:n,ytChannelFeedURL:e,feed2jsonURL:t}),Object.assign(document.createElement("a"),{target:"_blank",rel:"noopener noreferrer",href:t}).click()}else console.warn(`Could not find a channel ID feed at ${location.href}`)})();}());