Browser Bookmarklet to download YouTube Transcript

bookmarklet-youtube-transcript-downloader.js

// javascript:javascript:%20(function()%20{function%20delay(ms)%20{return%20new%20Promise(resolve%20=>%20setTimeout(resolve,%20ms));}async%20function%20fetchTranscript()%20{const%20showTranscriptButton%20=%20Array.from(document.querySelectorAll(%27button%27)).find(button%20=>%20button.textContent.includes(%27Show%20transcript%27)%20||%20button.getAttribute(%27aria-label%27)%20===%20%27Show%20transcript%27);if%20(showTranscriptButton)%20{showTranscriptButton.click();console.log(%22Clicked%20%27Show%20Transcript%27%20button%22);await%20delay(6000);const%20channelName%20=%20document.querySelector(%22ytd-video-owner-renderer%20div#text-container.ytd-channel-name%20.yt-simple-endpoint%22)?%20document.querySelector(%22ytd-video-owner-renderer%20div#text-container.ytd-channel-name%20.yt-simple-endpoint%22).innerText.trim()%20:%20%27Unknown%20Channel%27;const%20videoTitle%20=%20document.title.replace(%27%20-%20YouTube%27,%20%27%27);const%20publishDate%20=%20document.querySelectorAll(%22ytd-watch-info-text%20span%22)[2]%20?%20document.querySelectorAll(%22ytd-watch-info-text%20span%22)[2].innerText.trim()%20:%20%27Unknown%20Date%27;const%20sourceUrl%20=%20window.location.href;const%20yamlHeader%20=%20`---\nYouTube%20channel:%20${channelName}\ntitle:%20${videoTitle}\nsource_url:%20${sourceUrl}\ndate:%20${publishDate}\ndoctype:%20transcript\n---\n\n`;let%20ytt%20=%20Array.from(document.getElementsByTagName(%27ytd-transcript-segment-renderer%27)).map(el%20=>%20el.innerText.replace(/\n/g,%20%27%20%27)).join(%27\n%27);const%20content%20=%20yamlHeader%20+%20ytt;let%20blob%20=%20new%20Blob([content],%20{%20type:%20%27text/plain%27%20});let%20link%20=%20document.createElement(%27a%27);link.download%20=%20`TRANSCRIPT%E2%80%94${document.title}.txt`;link.href%20=%20URL.createObjectURL(blob);link.click();URL.revokeObjectURL(link.href);console.log(%22Transcript%20downloaded%22);}%20else%20{console.log(%27Show%20Transcript%20button%20not%20found.%27);}}fetchTranscript();})();



javascript: (function() {
    function delay(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }
    
    async function fetchTranscript() {
        const showTranscriptButton = Array.from(document.querySelectorAll('button'))
            .find(button => button.textContent.includes('Show transcript') || button.getAttribute('aria-label') === 'Show transcript');
        
        if (showTranscriptButton) {
            showTranscriptButton.click();
            console.log("Clicked 'Show Transcript' button");

            // Wait for 5 seconds to allow the transcript to load
            await delay(6000);
			
			// Collect video details
            const channelName = document.querySelector("ytd-video-owner-renderer div#text-container.ytd-channel-name .yt-simple-endpoint")
			? document.querySelector("ytd-video-owner-renderer div#text-container.ytd-channel-name .yt-simple-endpoint").innerText.trim() : 'Unknown Channel';
            const videoTitle = document.title.replace(' - YouTube', ''); 
            const publishDate = document.querySelectorAll("ytd-watch-info-text span")[2] ? document.querySelectorAll("ytd-watch-info-text span")[2].innerText.trim() : 'Unknown Date';
            const sourceUrl = window.location.href;

            // Format YAML header
            const yamlHeader = `---\nYouTube channel: ${channelName}\ntitle: ${videoTitle}\nsource_url: ${sourceUrl}\ndate: ${publishDate}\ndoctype: transcript\n---\n\n`;

            // Collect the transcript content
            let ytt = Array.from(document.getElementsByTagName('ytd-transcript-segment-renderer'))
                .map(el => el.innerText.replace(/\n/g, ' ')).join('\n');
				
			// Combine YAML header and transcript
            const content = yamlHeader + ytt;
            
            // Create a Blob with the transcript text
            let blob = new Blob([content], { type: 'text/plain' });

            // Create a download link
            let link = document.createElement('a');
            link.download = `TRANSCRIPT—${document.title}.txt`;
            link.href = URL.createObjectURL(blob);
            
            // Trigger the download
            link.click();

            // Clean up the object URL
            URL.revokeObjectURL(link.href);

            console.log("Transcript downloaded");
        } else {
            console.log('Show Transcript button not found.');
        }
    }

    // Run the function to fetch the transcript
    fetchTranscript();
})();