@therealtinhtute/baroiplayer 1.0.8 → 1.1.0

package/src/context/__tests__/media-store.test.ts

@@ -0,0 +1,509 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"
+import { MediaActionTypes, initialMediaState } from "../media-context"
+import {
+	type EnhancedMediaStore,
+	type OptimisticMediaAction,
+	createEnhancedMediaStore
+} from "../media-store"
+
+describe("createEnhancedMediaStore", () => {
+	let store: EnhancedMediaStore
+
+	beforeEach(() => {
+		// Clear localStorage
+		localStorage.clear()
+		vi.clearAllMocks()
+	})
+
+	afterEach(() => {
+		localStorage.clear()
+	})
+
+	describe("Basic Store Functionality", () => {
+		beforeEach(() => {
+			store = createEnhancedMediaStore()
+		})
+
+		it("should initialize with initial state", () => {
+			const state = store.getState()
+			expect(state).toEqual(initialMediaState)
+		})
+
+		it("should initialize with custom state", () => {
+			const customState = {
+				...initialMediaState,
+				volume: 0.5,
+				isMuted: true
+			}
+			const customStore = createEnhancedMediaStore(customState)
+			expect(customStore.getState()).toEqual(customState)
+		})
+
+		it("should subscribe to state changes", () => {
+			const callback = vi.fn()
+			const unsubscribe = store.subscribe(callback)
+
+			store.setState({ volume: 0.5 })
+
+			expect(callback).toHaveBeenCalled()
+
+			unsubscribe()
+			callback.mockClear()
+
+			store.setState({ volume: 0.7 })
+			expect(callback).not.toHaveBeenCalled()
+		})
+
+		it("should update state with setState", () => {
+			store.setState({ volume: 0.8, isMuted: true })
+
+			const state = store.getState()
+			expect(state.volume).toBe(0.8)
+			expect(state.isMuted).toBe(true)
+		})
+
+		it("should dispatch actions", () => {
+			store.dispatch({
+				type: MediaActionTypes.SET_VOLUME,
+				payload: 0.6
+			})
+
+			const state = store.getState()
+			expect(state.volume).toBe(0.6)
+		})
+
+		it("should handle multiple subscribers", () => {
+			const callback1 = vi.fn()
+			const callback2 = vi.fn()
+			const callback3 = vi.fn()
+
+			store.subscribe(callback1)
+			store.subscribe(callback2)
+			store.subscribe(callback3)
+
+			store.setState({ isPlaying: true })
+
+			expect(callback1).toHaveBeenCalledTimes(1)
+			expect(callback2).toHaveBeenCalledTimes(1)
+			expect(callback3).toHaveBeenCalledTimes(1)
+		})
+
+		it("should allow unsubscribing specific callbacks", () => {
+			const callback1 = vi.fn()
+			const callback2 = vi.fn()
+
+			const unsubscribe1 = store.subscribe(callback1)
+			store.subscribe(callback2)
+
+			unsubscribe1()
+
+			store.setState({ volume: 0.5 })
+
+			expect(callback1).not.toHaveBeenCalled()
+			expect(callback2).toHaveBeenCalled()
+		})
+	})
+
+	describe("Optimistic Updates", () => {
+		beforeEach(() => {
+			store = createEnhancedMediaStore()
+		})
+
+		it("should return optimistic state", () => {
+			const optimisticState = store.getOptimisticState()
+			expect(optimisticState).toEqual(initialMediaState)
+		})
+
+		it("should handle optimistic actions", async () => {
+			const optimisticAction: OptimisticMediaAction = {
+				type: MediaActionTypes.SET_VOLUME,
+				payload: 0.7,
+				optimistic: true
+			}
+
+			await store.dispatchOptimistic(optimisticAction)
+
+			const optimisticState = store.getOptimisticState()
+			expect(optimisticState.volume).toBe(0.7)
+		})
+
+		it("should eventually commit optimistic updates to actual state", async () => {
+			const optimisticAction: OptimisticMediaAction = {
+				type: MediaActionTypes.SET_VOLUME,
+				payload: 0.5,
+				optimistic: true
+			}
+
+			await store.dispatchOptimistic(optimisticAction)
+
+			// Wait for optimistic update to commit
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			const actualState = store.getState()
+			expect(actualState.volume).toBe(0.5)
+		})
+
+		it("should track action state during optimistic updates", async () => {
+			const optimisticAction: OptimisticMediaAction = {
+				type: MediaActionTypes.SET_PLAYING,
+				payload: true,
+				optimistic: true
+			}
+
+			const promise = store.dispatchOptimistic(optimisticAction)
+
+			// Check pending state during execution
+			const actionStateDuring = store.getActionState()
+			expect(actionStateDuring.pending).toBe(true)
+
+			await promise
+
+			const actionStateAfter = store.getActionState()
+			expect(actionStateAfter.pending).toBe(false)
+		})
+	})
+
+	describe("State Persistence", () => {
+		it("should persist state to localStorage", async () => {
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				debounceMs: 10
+			})
+
+			store.setState({ volume: 0.75, isMuted: true })
+
+			// Wait for debounced persist
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			const stored = localStorage.getItem("test-media-state")
+			expect(stored).toBeTruthy()
+
+			const parsed = JSON.parse(stored!)
+			expect(parsed.volume).toBe(0.75)
+			expect(parsed.isMuted).toBe(true)
+			expect(parsed.timestamp).toBeDefined()
+		})
+
+		it("should rehydrate state from localStorage", async () => {
+			const persistedData = {
+				volume: 0.9,
+				isMuted: false,
+				timestamp: Date.now()
+			}
+
+			localStorage.setItem("test-media-state", JSON.stringify(persistedData))
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state"
+			})
+
+			await store.rehydrateFromStorage()
+
+			const state = store.getState()
+			expect(state.volume).toBe(0.9)
+			expect(state.isMuted).toBe(false)
+		})
+
+		it("should not rehydrate expired state", async () => {
+			const expiredData = {
+				volume: 0.5,
+				timestamp: Date.now() - 8 * 24 * 60 * 60 * 1000 // 8 days old
+			}
+
+			localStorage.setItem("test-media-state", JSON.stringify(expiredData))
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state"
+			})
+
+			await store.rehydrateFromStorage()
+
+			const state = store.getState()
+			expect(state.volume).toBe(initialMediaState.volume)
+			expect(localStorage.getItem("test-media-state")).toBeNull()
+		})
+
+		it("should clear persisted state", () => {
+			localStorage.setItem("test-media-state", JSON.stringify({ volume: 0.5 }))
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state"
+			})
+
+			store.clearPersistedState()
+
+			expect(localStorage.getItem("test-media-state")).toBeNull()
+		})
+
+		it("should handle persistence errors gracefully", async () => {
+			const consoleWarnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+
+			// Mock localStorage to throw error
+			vi.spyOn(Storage.prototype, "setItem").mockImplementation(() => {
+				throw new Error("Storage full")
+			})
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				debounceMs: 10
+			})
+
+			store.setState({ volume: 0.5 })
+
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			expect(consoleWarnSpy).toHaveBeenCalledWith(
+				"Failed to persist media state:",
+				expect.any(Error)
+			)
+
+			consoleWarnSpy.mockRestore()
+		})
+
+		it("should only persist configured keys", async () => {
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				persist: ["volume"], // Only persist volume
+				debounceMs: 10
+			})
+
+			store.setState({
+				volume: 0.6,
+				isMuted: true,
+				currentTime: 50
+			})
+
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			const stored = localStorage.getItem("test-media-state")
+			const parsed = JSON.parse(stored!)
+
+			expect(parsed.volume).toBe(0.6)
+			expect(parsed.isMuted).toBeUndefined()
+			expect(parsed.currentTime).toBeUndefined()
+		})
+
+		it("should debounce persistence calls", async () => {
+			const setItemSpy = vi.spyOn(Storage.prototype, "setItem")
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				debounceMs: 100
+			})
+
+			// Multiple rapid updates
+			store.setState({ volume: 0.1 })
+			store.setState({ volume: 0.2 })
+			store.setState({ volume: 0.3 })
+			store.setState({ volume: 0.4 })
+			store.setState({ volume: 0.5 })
+
+			// Should not persist immediately
+			expect(setItemSpy).not.toHaveBeenCalled()
+
+			// Wait for debounce
+			await new Promise((resolve) => setTimeout(resolve, 150))
+
+			// Should persist only once
+			expect(setItemSpy).toHaveBeenCalledTimes(1)
+
+			const stored = localStorage.getItem("test-media-state")
+			const parsed = JSON.parse(stored!)
+			expect(parsed.volume).toBe(0.5) // Latest value
+		})
+
+		it("should update persistence config", async () => {
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				persist: ["volume"],
+				debounceMs: 10
+			})
+
+			// Update config
+			store.setPersistenceConfig({
+				persist: ["volume", "isMuted"],
+				debounceMs: 20
+			})
+
+			store.setState({ volume: 0.7, isMuted: true })
+
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			const stored = localStorage.getItem("test-media-state")
+			const parsed = JSON.parse(stored!)
+
+			expect(parsed.volume).toBe(0.7)
+			expect(parsed.isMuted).toBe(true)
+		})
+
+		it("should disable persistence when configured", async () => {
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: false,
+				key: "test-media-state"
+			})
+
+			store.setState({ volume: 0.8 })
+
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			expect(localStorage.getItem("test-media-state")).toBeNull()
+		})
+	})
+
+	describe("Action State Tracking", () => {
+		beforeEach(() => {
+			store = createEnhancedMediaStore()
+		})
+
+		it("should initialize with empty action state", () => {
+			const actionState = store.getActionState()
+
+			expect(actionState).toEqual({
+				pending: false,
+				error: null,
+				lastAction: null,
+				retryCount: 0
+			})
+		})
+
+		it("should track last action", async () => {
+			const action: OptimisticMediaAction = {
+				type: MediaActionTypes.SET_VOLUME,
+				payload: 0.5,
+				optimistic: true
+			}
+
+			await store.dispatchOptimistic(action)
+
+			const actionState = store.getActionState()
+			expect(actionState.lastAction).toEqual(action)
+		})
+
+		it("should track retry count", async () => {
+			const failingAction: OptimisticMediaAction = {
+				type: MediaActionTypes.SET_VOLUME,
+				payload: 0.5,
+				optimistic: true,
+				retryCount: 3
+			}
+
+			await store.dispatchOptimistic(failingAction)
+
+			const actionState = store.getActionState()
+			expect(actionState.retryCount).toBeGreaterThan(0)
+		})
+	})
+
+	describe("Edge Cases", () => {
+		beforeEach(() => {
+			store = createEnhancedMediaStore()
+		})
+
+		it("should handle rapid state updates", () => {
+			const callback = vi.fn()
+			store.subscribe(callback)
+
+			for (let i = 0; i < 100; i++) {
+				store.setState({ currentTime: i })
+			}
+
+			expect(callback).toHaveBeenCalledTimes(100)
+			expect(store.getState().currentTime).toBe(99)
+		})
+
+		it("should handle concurrent optimistic updates", async () => {
+			const actions = [
+				{ type: MediaActionTypes.SET_VOLUME, payload: 0.5, optimistic: true },
+				{ type: MediaActionTypes.SET_PLAYING, payload: true, optimistic: true },
+				{ type: MediaActionTypes.SET_MUTED, payload: true, optimistic: true }
+			] as OptimisticMediaAction[]
+
+			await Promise.all(actions.map((action) => store.dispatchOptimistic(action)))
+
+			const state = store.getState()
+			expect(state.volume).toBe(0.5)
+			expect(state.isPlaying).toBe(true)
+			expect(state.isMuted).toBe(true)
+		})
+
+		it("should handle invalid JSON during rehydration", async () => {
+			const consoleWarnSpy = vi.spyOn(console, "warn").mockImplementation(() => {})
+
+			localStorage.setItem("test-media-state", "invalid json{")
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state"
+			})
+
+			await store.rehydrateFromStorage()
+
+			expect(consoleWarnSpy).toHaveBeenCalledWith(
+				"Failed to rehydrate media state:",
+				expect.any(Error)
+			)
+
+			consoleWarnSpy.mockRestore()
+		})
+
+		it("should not persist in non-browser environment", async () => {
+			const originalWindow = global.window
+
+			// Simulate SSR environment
+			;(global as any).window = undefined
+
+			store = createEnhancedMediaStore(initialMediaState, {
+				enabled: true,
+				key: "test-media-state",
+				debounceMs: 10
+			})
+
+			store.setState({ volume: 0.5 })
+
+			await new Promise((resolve) => setTimeout(resolve, 50))
+
+			// Restore window
+			global.window = originalWindow
+
+			// No error should be thrown, just silently skip persistence
+			expect(true).toBe(true)
+		})
+	})
+
+	describe("Memory Management", () => {
+		it("should properly cleanup subscriptions", () => {
+			store = createEnhancedMediaStore()
+
+			const callbacks = Array.from({ length: 1000 }, () => vi.fn())
+			const unsubscribers = callbacks.map((cb) => store.subscribe(cb))
+
+			// Unsubscribe all
+			unsubscribers.forEach((unsub) => unsub())
+
+			store.setState({ volume: 0.5 })
+
+			// No callbacks should be called
+			callbacks.forEach((cb) => expect(cb).not.toHaveBeenCalled())
+		})
+
+		it("should handle state updates after all subscribers removed", () => {
+			store = createEnhancedMediaStore()
+
+			const unsub = store.subscribe(vi.fn())
+			unsub()
+
+			// Should not throw
+			expect(() => {
+				store.setState({ volume: 0.5 })
+			}).not.toThrow()
+		})
+	})
+})