Added support for watch progress for the session

[actuallyabhi]

Outcome

This PR is to save the watched video duration for various videos, so that they can resume playing from where they left off.
In the current implementation, I am saving time_stamps in session storage, so these persist only for the current session.
I am expecting it to make persistent in future PRs.

Demo

demo video

[user234683]

Since the persistent version would have to be done quite differently, would prefer we just do that first. I wrote out an implementation plan here if you or anyone else would like to give it a shot:
#155 (comment)

[actuallyabhi]

@user234683 Sorry for the delay. I forgot about this. I would like to implement it. Probably start on this weekend. I'll keep you posted. Thanks!

[QodoAI-Agent]

PR Reviewer Guide 🔍

⏱️ Estimated effort to review: 2 🔵🔵⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ Key issues to review Code Robustness The extraction of video_id from the URL is fragile and may fail if the URL structure changes or includes additional parameters before the video ID. Consider using URLSearchParams for a more robust solution. Error Handling There is no error handling for cases where sessionStorage might be disabled or full, which could lead to unhandled exceptions. Code Duplication The sessionStorage.getItem(video_id) is called twice, which is inefficient. Consider storing the result in a variable and reusing it.

[Copilot]

Pull request overview

Adds session-scoped “resume playback” support by persisting each video’s last watched timestamp in sessionStorage, so a video can continue from where it was left off within the same browser session.

Changes:

• Save video.currentTime to sessionStorage on page unload.
• Restore saved time on loadedmetadata to resume playback position.

Comments suppressed due to low confidence (4)

youtube/static/js/watch.js:217

• video_id is assigned without var/let/const, which creates an implicit global variable. This can lead to hard-to-debug collisions and differs from the rest of the file’s variable declarations; declare it explicitly (and ideally make it const).

// save watched time to session storage
video_id = window.location.href.split("?v=")[1].split("&")[0]

youtube/static/js/watch.js:227

• Restoring video.currentTime on loadedmetadata will override the existing &t start-time behavior (data.time_start is applied earlier). If a user opens a link with ?t=..., they likely expect that timestamp to take precedence over the saved session resume time; consider only restoring when data.time_start is 0 (or otherwise define/implement precedence explicitly).

video.addEventListener('loadedmetadata', function () {
    if (sessionStorage.getItem(video_id) !== null) {
        const prevWatchTime = sessionStorage.getItem(video_id);
        if (video.duration > prevWatchTime && prevWatchTime > 0) {
            video.currentTime = prevWatchTime;
        }

youtube/static/js/watch.js:227

• sessionStorage.getItem() returns a string, but prevWatchTime is used in numeric comparisons and assigned to video.currentTime. Convert it once (e.g., Number(...)/parseFloat(...)) and validate it’s finite before comparing/assigning to avoid relying on implicit coercion.

    if (sessionStorage.getItem(video_id) !== null) {
        const prevWatchTime = sessionStorage.getItem(video_id);
        if (video.duration > prevWatchTime && prevWatchTime > 0) {
            video.currentTime = prevWatchTime;
        }

youtube/static/js/watch.js:220

• Saving progress only in a beforeunload handler is unreliable on some browsers (and can be skipped with bfcache/tab-kill scenarios). Consider also persisting on pagehide and/or visibilitychange (and/or throttled timeupdate) so watch progress is saved more consistently without depending on unload.

window.addEventListener('beforeunload', function(e) {
    sessionStorage.setItem(video_id, video.currentTime);
});

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.