fix(player): clear progress on episode switch to stop end-of-playback glitch (#94) (#194)

* fix(player): clear progress on episode switch to stop end-of-playback glitch (#94)

When an episode finishes and the queue auto-advances, currentEpisode.set swaps
the player to the next episode and its title/artwork update immediately, but the
$currentTime/$duration stores keep the finished episode's end values until the
new audio fires loadedmetadata. The progress bar therefore stays pinned at 100%
and the timestamps show the previous episode's end against the new episode for
the whole (network-bound) metadata-fetch window — the visual glitch in #94.

Reset $currentTime and $duration to 0 on a genuine in-player episode switch (in
the currentEpisode subscription), guarded by a first-fire flag so the
synchronous initial subscription does not wipe a restored resume position or
flash 0 on mount/remount. onMetadataLoaded -> restorePlaybackTime sets the real
position once the next episode loads, and the existing isLoading guard keeps
this reset from being persisted.

Also clamp non-finite and negative inputs to 0 in formatSeconds so the time
display can never render "NaN:NaN:NaN" or negative components during the brief
window where duration is unknown or currentTime exceeds a shorter next episode.

Verified in real Obsidian: at the auto-advance transition the bar now shows 0%
and 00:00:00 instead of the stale 100% / previous-episode timestamps.

* fix(player): never mark an unknown-duration episode finished on switch (#94)

Addresses Codex review on PR #194. The #94 progress reset sets currentTime and
duration to 0 the instant the episode changes. If the user switches away again
before the next episode's metadata loads (e.g. click B then C from the queue
while B is still loading), currentEpisode.set reads ct === dur === 0 and its
isFinished = (ct === dur) check persisted the skipped episode as finished at
0:00 — surfacing a never-played episode as played.

Guard the finished computation against a zero/unknown duration in both persist
paths: currentEpisode.set (store) and persistPlaybackPosition (player). A
duration of 0 (or NaN) is never "finished". Genuine finishes (duration > 0 and
currentTime === duration) are unaffected.

Reproduced and verified fixed in real Obsidian: rapid A->B->C switch now leaves
B as finished=false, while an episode played to its real end stays finished=true.

Author: chhoumann

src/store/index.test.ts

@@ -9,8 +9,10 @@ import { LOCAL_FILES_SETTINGS, QUEUE_SETTINGS } from "src/constants";
 import { QueueController } from "src/store_controllers/QueueController";
 import {
 	currentEpisode,
+	currentTime,
 	dedupeEpisodesByTitle,
 	downloadedEpisodes,
+	duration,
 	localFiles,
 	playedEpisodes,
 	plugin,
@@ -505,3 +507,42 @@ describe("queue automation toggle (issue #108)", () => {
 		expect(queueTitles()).toEqual(["A", "B"]);
 	});
 });
+
+describe("currentEpisode.set finished guard (issue #94)", () => {
+	beforeEach(() => {
+		playedEpisodes.set({});
+		currentTime.set(0);
+		duration.set(0);
+		currentEpisode.set(undefined as unknown as Episode, false);
+	});
+
+	afterEach(() => {
+		currentTime.set(0);
+		duration.set(0);
+		currentEpisode.set(undefined as unknown as Episode, false);
+	});
+
+	test("does not persist a never-played episode as finished when switched away at unknown (0) duration", () => {
+		// The player resets currentTime/duration to 0 the instant the episode
+		// changes (#94). Rapidly switching A -> B -> C before B's metadata loads
+		// reads ct === dur === 0; that must not mark the skipped episode finished.
+		currentEpisode.set(ep("A"), false);
+		currentTime.set(0);
+		duration.set(0);
+		currentEpisode.set(ep("B"), false);
+
+		const stored = get(playedEpisodes)["Pod::A"];
+		expect(stored?.finished).toBe(false);
+	});
+
+	test("still persists a genuinely finished episode as finished", () => {
+		currentEpisode.set(ep("A"), false);
+		currentTime.set(3600);
+		duration.set(3600);
+		currentEpisode.set(ep("B"), false);
+
+		const stored = get(playedEpisodes)["Pod::A"];
+		expect(stored?.finished).toBe(true);
+		expect(stored?.time).toBe(3600);
+	});
+});

src/store/index.ts

@@ -41,7 +41,12 @@ export const currentEpisode = (() => {
 
 					const ct = get(currentTime);
 					const dur = get(duration);
-					const isFinished = ct === dur;
+					// A zero/unknown duration is never a finished episode. The player
+					// resets currentTime/duration to 0 the instant the episode changes
+					// (issue #94); if the user switches away again before the next
+					// episode's metadata loads, ct === dur === 0 would otherwise persist
+					// a never-played episode as finished at 0:00 and surface it as played.
+					const isFinished = dur > 0 && ct === dur;
 					playedEpisodes.setEpisodeTime(previousEpisode, ct, dur, isFinished);
 				}
 

src/ui/PodcastView/EpisodePlayer.svelte

@@ -57,6 +57,10 @@
 	let isHoveringArtwork: boolean = false;
 	let isLoading: boolean = true;
 	let playerVolume: number = 1;
+	// The currentEpisode subscription fires synchronously on subscribe with the
+	// already-loaded episode; that first fire must not wipe a restored position
+	// (or flash 0) on the initial mount. Only genuine in-player switches reset.
+	let hasSeenFirstEpisodeFire: boolean = false;
 	let chapters: Chapter[] = [];
 	let lastChaptersUrl: string | undefined = undefined;
 
@@ -189,7 +193,9 @@
 			$currentEpisode,
 			$currentTime,
 			$duration,
-			$currentTime === $duration,
+			// A zero/unknown duration is never "finished" — guard against the brief
+			// 0/0 window after an episode switch (issue #94) marking it played at 0:00.
+			$duration > 0 && $currentTime === $duration,
 		);
 	}
 
@@ -227,6 +233,23 @@
 			isLoading = true;
 			lastPositionSaveMs = Number.NEGATIVE_INFINITY;
 
+			// Clear the outgoing episode's progress the instant the episode changes
+			// so the player never renders its full/last position against the
+			// incoming episode while the new audio's metadata loads (issue #94).
+			// Finishing an episode auto-advances by calling currentEpisode.set (see
+			// queue.playNext), which swaps the title/artwork immediately — but
+			// $currentTime/$duration keep the finished episode's end values until
+			// the next episode's loadedmetadata fires. Without this reset the
+			// progress bar stays pinned at 100% and the timestamps show the
+			// previous episode's end for the whole (network-bound) metadata fetch.
+			// onMetadataLoaded → restorePlaybackTime sets the real position, and
+			// the isLoading guard above keeps this reset from being persisted.
+			if (hasSeenFirstEpisodeFire) {
+				currentTime.set(0);
+				duration.set(0);
+			}
+			hasSeenFirstEpisodeFire = true;
+
 			srcPromise = getSrc($currentEpisode);
 
 			// Fetch chapters when episode changes

src/ui/PodcastView/EpisodePlayer.test.ts

@@ -215,6 +215,52 @@ describe("EpisodePlayer — persists playback position during playback (issue #3
 		expect(get(playedEpisodes)[keyB]?.time).toBe(1800);
 	});
 
+	test("resets progress immediately on episode switch so the finished episode's bar is not shown against the next (issue #94)", async () => {
+		const episodeB: Episode = {
+			title: "Episode B",
+			streamUrl: "https://pod.example.com/b.mp3",
+			url: "https://pod.example.com/b",
+			description: "",
+			content: "",
+			podcastName: "Test Podcast",
+		};
+
+		const { container } = render(EpisodePlayer);
+		await waitFor(() => {
+			expect(container.querySelector("audio")).not.toBeNull();
+		});
+		const audio = container.querySelector("audio") as HTMLAudioElement;
+		await fireEvent.loadedMetadata(audio);
+
+		// Simulate episode A finishing: progress pinned at the very end.
+		currentTime.set(3600);
+		duration.set(3600);
+		await fireEvent.timeUpdate(audio);
+
+		// Auto-advance (queue.playNext) swaps the episode via currentEpisode.set.
+		currentEpisode.set(episodeB);
+		await waitFor(() => {
+			const next = container.querySelector("audio");
+			expect(next?.getAttribute("src")).toBe(episodeB.streamUrl);
+		});
+
+		// Before B's loadedmetadata fires, the finished episode's playback position
+		// must be cleared so the UI renders a zeroed loading state — not A's full
+		// bar — for the duration of B's (network-bound) metadata fetch.
+		expect(get(currentTime)).toBe(0);
+
+		// The user-visible outcome: the progress bar collapses to 0% and neither
+		// timestamp shows A's end or a garbled "NaN" (the bar/text must not lag the
+		// title/artwork switch).
+		const bar = container.querySelector(".progress__bar") as HTMLElement;
+		expect(bar.style.width).toBe("0%");
+		const [elapsed, remaining] = Array.from(
+			container.querySelectorAll(".status-container span"),
+		).map((s) => s.textContent);
+		expect(elapsed).toBe("00:00:00");
+		expect(remaining).toBe("00:00:00");
+	});
+
 	test("persists immediately when the app is backgrounded (visibilitychange → hidden)", async () => {
 		await renderLoadedPlayer();
 		currentTime.set(222);

src/utility/formatSeconds.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, test } from "vitest";
+import { formatSeconds } from "./formatSeconds";
+
+describe("formatSeconds", () => {
+	test("formats whole seconds into HH:mm:ss", () => {
+		expect(formatSeconds(0, "HH:mm:ss")).toBe("00:00:00");
+		expect(formatSeconds(3661, "HH:mm:ss")).toBe("01:01:01");
+	});
+
+	test("clamps NaN to 0 instead of rendering 'NaN:NaN:NaN' (issue #94)", () => {
+		// Happens mid episode-switch when duration is briefly unknown and the
+		// remaining-time expression ($duration - $currentTime) evaluates to NaN.
+		expect(formatSeconds(Number.NaN, "HH:mm:ss")).toBe("00:00:00");
+	});
+
+	test("clamps negative input to 0 instead of rendering negative components (issue #94)", () => {
+		// Happens when currentTime momentarily exceeds a shorter next episode's
+		// duration, making the remaining time negative.
+		expect(formatSeconds(-42, "HH:mm:ss")).toBe("00:00:00");
+	});
+
+	test("clamps non-finite Infinity to 0", () => {
+		expect(formatSeconds(Number.POSITIVE_INFINITY, "HH:mm:ss")).toBe(
+			"00:00:00",
+		);
+	});
+});

src/utility/formatSeconds.ts

@@ -8,6 +8,15 @@
  * - A: AM/PM, a: am/pm
  */
 export function formatSeconds(totalSeconds: number, format: string): string {
+    // Clamp non-finite (NaN/Infinity) and negative inputs to 0 so the player never
+    // renders garbled times like "NaN:NaN:NaN" or "-1:-1:-10". These arise during
+    // an episode switch, when duration is briefly unknown (NaN) before the new
+    // audio's metadata loads, or when currentTime momentarily exceeds a shorter
+    // next episode's duration (issue #94).
+    if (!Number.isFinite(totalSeconds) || totalSeconds < 0) {
+        totalSeconds = 0;
+    }
+
     const hours = Math.floor(totalSeconds / 3600);
     const minutes = Math.floor((totalSeconds % 3600) / 60);
     const secs = Math.floor(totalSeconds % 60);