693 lines
23 KiB
TypeScript
693 lines
23 KiB
TypeScript
import assert from "node:assert/strict";
|
|
import { before, beforeEach, describe, test } from "node:test";
|
|
|
|
/* eslint-disable max-classes-per-file */
|
|
|
|
class FakeElement extends EventTarget {
|
|
readonly dataset: Record<string, string> = {};
|
|
className = "";
|
|
classList = fakeClassList();
|
|
disabled = false;
|
|
parentElement: FakeElement | null = null;
|
|
style: Record<string, string> = {};
|
|
textContent = "";
|
|
tabIndex = 0;
|
|
private readonly children: FakeElement[] = [];
|
|
private readonly queries = new Map<string, FakeElement | null>();
|
|
|
|
append(child: FakeElement): void {
|
|
child.parentElement = this;
|
|
this.children.push(child);
|
|
}
|
|
|
|
closest(_selector: string): FakeElement | null {
|
|
return null;
|
|
}
|
|
|
|
focus(options?: FocusOptions): void {
|
|
void options;
|
|
}
|
|
|
|
querySelector(selector: string): FakeElement | null {
|
|
return this.queries.get(selector) ?? null;
|
|
}
|
|
|
|
querySelectorAll(_selector: string): FakeElement[] {
|
|
return [];
|
|
}
|
|
|
|
removeAttribute(name: string): void {
|
|
void name;
|
|
}
|
|
|
|
replaceChildren(...children: FakeElement[]): void {
|
|
this.children.length = 0;
|
|
children.forEach((child) => {
|
|
this.append(child);
|
|
});
|
|
}
|
|
|
|
setQuery(selector: string, element: FakeElement | null): void {
|
|
this.queries.set(selector, element);
|
|
}
|
|
|
|
setAttribute(name: string, value: string): void {
|
|
void name;
|
|
void value;
|
|
}
|
|
|
|
scrollIntoView(options?: ScrollIntoViewOptions): void {
|
|
void options;
|
|
}
|
|
}
|
|
|
|
class FakeAnchorElement extends FakeElement {
|
|
href = "";
|
|
target = "";
|
|
|
|
override closest(selector: string): FakeAnchorElement | null {
|
|
return selector === "a[data-episode-id]" ? this : null;
|
|
}
|
|
}
|
|
|
|
class FakeMouseEvent {
|
|
readonly altKey: boolean;
|
|
readonly button: number;
|
|
readonly ctrlKey: boolean;
|
|
defaultPrevented = false;
|
|
readonly metaKey: boolean;
|
|
readonly shiftKey: boolean;
|
|
readonly target: FakeElement;
|
|
|
|
constructor(
|
|
target: FakeElement,
|
|
options: Partial<
|
|
Pick<MouseEvent, "altKey" | "button" | "ctrlKey" | "metaKey" | "shiftKey">
|
|
> = {},
|
|
) {
|
|
this.target = target;
|
|
this.altKey = options.altKey ?? false;
|
|
this.button = options.button ?? 0;
|
|
this.ctrlKey = options.ctrlKey ?? false;
|
|
this.metaKey = options.metaKey ?? false;
|
|
this.shiftKey = options.shiftKey ?? false;
|
|
}
|
|
|
|
preventDefault(): void {
|
|
this.defaultPrevented = true;
|
|
}
|
|
}
|
|
|
|
type FakeVideoElement = FakeElement & {
|
|
buffered: TimeRanges;
|
|
currentTime: number;
|
|
duration: number;
|
|
load: () => void;
|
|
pause: () => void;
|
|
paused: boolean;
|
|
play: () => Promise<void>;
|
|
readyState: number;
|
|
removeAttribute: (name: string) => void;
|
|
seekable: TimeRanges;
|
|
src: string;
|
|
};
|
|
|
|
type PlayerModules = {
|
|
completeAnime: (episodeNumber: number) => Promise<void>;
|
|
handleEpisodeNavigationClick: (event: MouseEvent) => boolean;
|
|
refreshCurrentModeSource: (signal?: AbortSignal) => Promise<boolean>;
|
|
saveProgress: (force?: boolean, progressSeconds?: number) => Promise<void>;
|
|
setupProgress: () => void;
|
|
state: typeof import("./state").state;
|
|
streamUrlForMode: (mode: string, quality?: string) => string;
|
|
setupEpisodeNavigation: (signal: AbortSignal) => void;
|
|
transitionToEpisode: (
|
|
episode: number,
|
|
options?: { fallbackHref?: string; history?: "none" | "push" | "replace" },
|
|
) => Promise<boolean>;
|
|
};
|
|
|
|
const emptyRanges = (): TimeRanges => ({ length: 0, end: () => 0, start: () => 0 });
|
|
|
|
const fakeClassList = (): DOMTokenList => {
|
|
const values = new Set<string>();
|
|
return {
|
|
add: (...tokens: string[]): void => {
|
|
tokens.forEach((token) => {
|
|
values.add(token);
|
|
});
|
|
},
|
|
remove: (...tokens: string[]): void => {
|
|
tokens.forEach((token) => {
|
|
values.delete(token);
|
|
});
|
|
},
|
|
toggle: (token: string, force?: boolean): boolean => {
|
|
const shouldAdd = force ?? !values.has(token);
|
|
if (shouldAdd) {
|
|
values.add(token);
|
|
} else {
|
|
values.delete(token);
|
|
}
|
|
return shouldAdd;
|
|
},
|
|
} as DOMTokenList;
|
|
};
|
|
|
|
const fakeVideoElement = (): FakeVideoElement => {
|
|
const video = Object.assign(new FakeElement(), {
|
|
buffered: emptyRanges(),
|
|
currentTime: 0,
|
|
duration: 0,
|
|
paused: true,
|
|
readyState: 0,
|
|
seekable: emptyRanges(),
|
|
src: "",
|
|
load: (): void => {
|
|
void video.src;
|
|
},
|
|
pause: (): void => {
|
|
video.paused = true;
|
|
},
|
|
play: (): Promise<void> => {
|
|
video.paused = false;
|
|
return Promise.resolve();
|
|
},
|
|
removeAttribute: (name: string): void => {
|
|
if (name === "src") {
|
|
video.src = "";
|
|
}
|
|
},
|
|
});
|
|
return video;
|
|
};
|
|
|
|
const fakeDocument = (): Document & {
|
|
setDropdownTrigger: (trigger: FakeElement | null) => void;
|
|
} => {
|
|
let trigger: FakeElement | null = null;
|
|
return {
|
|
body: new FakeElement(),
|
|
createElement: (tag: string): FakeElement =>
|
|
tag === "video" ? fakeVideoElement() : new FakeElement(),
|
|
querySelector: (selector: string): FakeElement | null =>
|
|
selector === "[data-dropdown-trigger]" ? trigger : null,
|
|
setDropdownTrigger: (nextTrigger: FakeElement | null): void => {
|
|
trigger = nextTrigger;
|
|
},
|
|
} as unknown as Document & { setDropdownTrigger: (trigger: FakeElement | null) => void };
|
|
};
|
|
|
|
const documentStub = fakeDocument();
|
|
const storage = (): Storage => {
|
|
const values = new Map<string, string>();
|
|
return {
|
|
clear: (): void => {
|
|
values.clear();
|
|
},
|
|
getItem: (key: string): string | null => values.get(key) ?? null,
|
|
key: (index: number): string | null => [...values.keys()][index] ?? null,
|
|
get length(): number {
|
|
return values.size;
|
|
},
|
|
removeItem: (key: string): void => {
|
|
values.delete(key);
|
|
},
|
|
setItem: (key: string, value: string): void => {
|
|
values.set(key, value);
|
|
},
|
|
};
|
|
};
|
|
const historyCalls: string[] = [];
|
|
const localStorageStub = storage();
|
|
const sessionStorageStub = storage();
|
|
const windowStub = Object.assign(new EventTarget(), {
|
|
clearTimeout: (_handle: number | undefined): void => {
|
|
void _handle;
|
|
},
|
|
setTimeout: (_callback: () => void, _delay: number): number => {
|
|
void _callback;
|
|
void _delay;
|
|
return 1;
|
|
},
|
|
localStorage: localStorageStub,
|
|
location: { href: "http://localhost/anime/42/watch?ep=3", origin: "http://localhost" },
|
|
showToast: (options: { message: string }): void => {
|
|
void options;
|
|
},
|
|
});
|
|
let modules: PlayerModules;
|
|
let beaconCalls: string[];
|
|
let fetchCalls: Array<{ body?: string; url: string }>;
|
|
let timeoutCallbacks: Array<() => void>;
|
|
const originalConsoleError = console.error;
|
|
|
|
const installBrowserGlobals = (): void => {
|
|
Object.assign(globalThis, {
|
|
document: documentStub,
|
|
Element: FakeElement,
|
|
HTMLAnchorElement: FakeAnchorElement,
|
|
HTMLElement: FakeElement,
|
|
HTMLVideoElement: FakeElement,
|
|
HTMLMediaElement: { HAVE_METADATA: 1, HAVE_CURRENT_DATA: 2 },
|
|
MouseEvent: FakeMouseEvent,
|
|
window: windowStub,
|
|
});
|
|
Object.assign(globalThis, {
|
|
history: {
|
|
pushState: (_data: unknown, _unused: string, url?: string | URL | null): void => {
|
|
const href = String(url);
|
|
historyCalls.push(href);
|
|
windowStub.location.href = href;
|
|
},
|
|
replaceState: (_data: unknown, _unused: string, url?: string | URL | null): void => {
|
|
const href = String(url);
|
|
historyCalls.push(href);
|
|
windowStub.location.href = href;
|
|
},
|
|
},
|
|
sessionStorage: sessionStorageStub,
|
|
});
|
|
Object.defineProperty(globalThis, "navigator", {
|
|
configurable: true,
|
|
value: {
|
|
sendBeacon: (_url: string, data: Blob): boolean => {
|
|
void data.text().then((value) => {
|
|
beaconCalls.push(value);
|
|
});
|
|
return true;
|
|
},
|
|
},
|
|
});
|
|
};
|
|
|
|
const asHTMLElement = (element: FakeElement): HTMLElement => element as unknown as HTMLElement;
|
|
|
|
const resetPlayerState = (): void => {
|
|
const { state } = modules;
|
|
const video = fakeVideoElement();
|
|
video.duration = 120;
|
|
state.elements.container = asHTMLElement(new FakeElement());
|
|
state.elements.video = video as unknown as HTMLVideoElement;
|
|
state.elements.progress = asHTMLElement(new FakeElement());
|
|
state.elements.scrubber = asHTMLElement(new FakeElement());
|
|
state.elements.buffered = asHTMLElement(new FakeElement());
|
|
state.elements.timeDisplay = asHTMLElement(new FakeElement());
|
|
state.elements.durationDisplay = asHTMLElement(new FakeElement());
|
|
state.episode.current = "3";
|
|
state.episode.total = 10;
|
|
state.episode.malID = 42;
|
|
state.episode.transitionEpisode = null;
|
|
state.episode.completionSent = false;
|
|
state.episode.completionAttempts = 0;
|
|
state.episode.endedProgressSaved = false;
|
|
state.episode.lastSavedProgress = { episode: "3", seconds: -1 };
|
|
state.playback.currentMode = "sub";
|
|
state.playback.modeSwitchedFrom = "";
|
|
state.playback.startTimeSeconds = 0;
|
|
state.playback.streamURL = "/watch/proxy/stream";
|
|
state.playback.modeSources = {};
|
|
state.elements.episodeGrid = null;
|
|
state.elements.episodeList = null;
|
|
state.elements.videoOverlay = null;
|
|
state.timers.progressSaveTimer = undefined;
|
|
documentStub.setDropdownTrigger(null);
|
|
};
|
|
|
|
const flushPromises = async (): Promise<void> => {
|
|
await Promise.resolve();
|
|
await Promise.resolve();
|
|
await Promise.resolve();
|
|
await Promise.resolve();
|
|
};
|
|
|
|
const loadPlayerModules = async (): Promise<PlayerModules> => {
|
|
const completeModule = await import("./episodes/complete");
|
|
const navModule = await import("./episodes/nav");
|
|
const progressModule = await import("./progress");
|
|
const stateModule = await import("./state");
|
|
const sourceModule = await import("./source");
|
|
|
|
return {
|
|
completeAnime: completeModule.completeAnime,
|
|
handleEpisodeNavigationClick: navModule.handleEpisodeNavigationClick,
|
|
refreshCurrentModeSource: sourceModule.refreshCurrentModeSource,
|
|
saveProgress: progressModule.saveProgress,
|
|
setupProgress: progressModule.setupProgress,
|
|
state: stateModule.state,
|
|
streamUrlForMode: sourceModule.streamUrlForMode,
|
|
setupEpisodeNavigation: navModule.setupEpisodeNavigation,
|
|
transitionToEpisode: navModule.transitionToEpisode,
|
|
};
|
|
};
|
|
|
|
before(async () => {
|
|
installBrowserGlobals();
|
|
modules = await loadPlayerModules();
|
|
});
|
|
|
|
beforeEach(() => {
|
|
console.error = originalConsoleError;
|
|
fetchCalls = [];
|
|
beaconCalls = [];
|
|
historyCalls.length = 0;
|
|
localStorageStub.clear();
|
|
sessionStorageStub.clear();
|
|
windowStub.location.href = "http://localhost/anime/42/watch?ep=3";
|
|
windowStub.showToast = (options: { message: string }): void => {
|
|
void options;
|
|
};
|
|
timeoutCallbacks = [];
|
|
globalThis.fetch = ((url: string, init?: RequestInit) => {
|
|
fetchCalls.push({ url, body: typeof init?.body === "string" ? init.body : undefined });
|
|
return Promise.resolve({ ok: true, status: 200 } as Response);
|
|
}) as typeof fetch;
|
|
windowStub.setTimeout = (callback: () => void, _delay: number): number => {
|
|
timeoutCallbacks.push(callback);
|
|
return timeoutCallbacks.length;
|
|
};
|
|
globalThis.setTimeout = windowStub.setTimeout.bind(windowStub) as typeof setTimeout;
|
|
resetPlayerState();
|
|
});
|
|
|
|
const episodePayload = (
|
|
episode: number,
|
|
modes?: Record<string, { subtitles: never[]; token: string; type: string }>,
|
|
): Record<string, unknown> => {
|
|
const modeSources = modes ?? {
|
|
dub: { subtitles: [], token: `dub-${episode}`, type: "mp4" },
|
|
sub: { subtitles: [], token: `sub-${episode}`, type: "mp4" },
|
|
};
|
|
return {
|
|
episode_title: `Episode ${episode}`,
|
|
initial_mode: "sub",
|
|
mode_sources: modeSources,
|
|
mode_switched_from: "",
|
|
segments: [],
|
|
start_time_seconds: 12,
|
|
};
|
|
};
|
|
|
|
const episodeResponse = (episode: number): Response =>
|
|
({ json: () => Promise.resolve(episodePayload(episode)), ok: true, status: 200 }) as Response;
|
|
|
|
describe("browser player flow", () => {
|
|
test("builds initial stream URLs from mode token, HLS type, and preferred quality", () => {
|
|
modules.state.playback.modeSources = {
|
|
sub: { token: "sub token", type: "m3u8", qualities: ["1080p"], subtitles: [] },
|
|
};
|
|
|
|
assert.equal(
|
|
modules.streamUrlForMode("sub", "720p"),
|
|
"/watch/proxy/stream?mode=sub&token=sub%20token&hls=1&quality=720p",
|
|
);
|
|
});
|
|
|
|
test("returns no stream URL when the selected mode has no playable token", () => {
|
|
modules.state.playback.modeSources = { sub: { token: "", subtitles: [] } };
|
|
|
|
assert.equal(modules.streamUrlForMode("sub", "best"), "");
|
|
});
|
|
|
|
test("refreshes stale current stream token from episode data", async () => {
|
|
modules.state.elements.video.currentTime = 64;
|
|
modules.state.playback.modeSources = {
|
|
sub: { token: "stale-token", type: "m3u8", qualities: ["720p"], subtitles: [] },
|
|
};
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
return Promise.resolve({
|
|
ok: true,
|
|
status: 200,
|
|
json: () =>
|
|
Promise.resolve({
|
|
mode_sources: {
|
|
sub: { token: "fresh-token", type: "m3u8", qualities: ["720p"], subtitles: [] },
|
|
},
|
|
}),
|
|
} as Response);
|
|
}) as typeof fetch;
|
|
|
|
const refreshed = await modules.refreshCurrentModeSource();
|
|
|
|
assert.equal(refreshed, true);
|
|
assert.deepEqual(
|
|
fetchCalls.map((call) => call.url),
|
|
["/api/watch/episode/42/3?mode=sub"],
|
|
);
|
|
assert.equal(modules.state.playback.modeSources.sub?.token, "fresh-token");
|
|
assert.equal(
|
|
modules.state.elements.video.src,
|
|
"/watch/proxy/stream?mode=sub&token=fresh-token&hls=1",
|
|
);
|
|
assert.equal(modules.state.playback.pendingSeekTime, 64);
|
|
});
|
|
|
|
test("saves progress on pause and after scrub mouseup", async () => {
|
|
modules.setupProgress();
|
|
modules.state.elements.video.currentTime = 30;
|
|
|
|
modules.state.elements.video.dispatchEvent(new Event("pause"));
|
|
await flushPromises();
|
|
modules.state.elements.video.currentTime = 47;
|
|
window.dispatchEvent(new Event("mouseup"));
|
|
await flushPromises();
|
|
|
|
assert.deepEqual(
|
|
fetchCalls.map((call) => JSON.parse(call.body ?? "{}")),
|
|
[
|
|
{ mal_id: 42, episode: 3, time_seconds: 30 },
|
|
{ mal_id: 42, episode: 3, time_seconds: 47 },
|
|
],
|
|
);
|
|
});
|
|
|
|
test("retries failed completion and updates completion trigger after success", async () => {
|
|
const errors: unknown[][] = [];
|
|
console.error = (...args: unknown[]): void => {
|
|
errors.push(args);
|
|
};
|
|
const trigger = new FakeElement();
|
|
documentStub.setDropdownTrigger(trigger);
|
|
globalThis.fetch = ((url: string, init?: RequestInit) => {
|
|
fetchCalls.push({ url, body: typeof init?.body === "string" ? init.body : undefined });
|
|
return Promise.resolve({ ok: fetchCalls.length > 1, status: 500 } as Response);
|
|
}) as typeof fetch;
|
|
|
|
await modules.completeAnime(3);
|
|
assert.equal(modules.state.episode.completionSent, false);
|
|
assert.equal(modules.state.episode.completionAttempts, 1);
|
|
assert.equal(timeoutCallbacks.length, 1);
|
|
|
|
timeoutCallbacks[0]?.();
|
|
await flushPromises();
|
|
|
|
assert.equal(fetchCalls.length, 2);
|
|
assert.deepEqual(JSON.parse(fetchCalls[1]?.body ?? "{}"), { mal_id: 42, episode: 3 });
|
|
assert.equal(modules.state.episode.completionSent, true);
|
|
assert.equal(trigger.textContent, "Completed ");
|
|
assert.equal(errors.length, 1);
|
|
});
|
|
|
|
test("transitions episodes in place and saves progress for the episode being left", async () => {
|
|
const loading = new FakeElement();
|
|
(modules.state.elements.container as unknown as FakeElement).setQuery(
|
|
"[data-loading]",
|
|
loading,
|
|
);
|
|
modules.state.elements.video.currentTime = 30;
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
return Promise.resolve(episodeResponse(4));
|
|
}) as typeof fetch;
|
|
|
|
const transitioned = await modules.transitionToEpisode(4);
|
|
await flushPromises();
|
|
|
|
assert.equal(transitioned, true);
|
|
assert.deepEqual(
|
|
fetchCalls.map((call) => call.url),
|
|
["/api/watch/episode/42/4?mode=sub"],
|
|
);
|
|
assert.equal(modules.state.episode.current, "4");
|
|
assert.equal(modules.state.playback.startTimeSeconds, 12);
|
|
assert.equal(modules.state.elements.video.src, "/watch/proxy/stream?mode=sub&token=sub-4");
|
|
assert.equal(loading.style.display, "flex");
|
|
assert.match(historyCalls[0] ?? "", /[?&]ep=4(?:&|$)/);
|
|
assert.deepEqual(JSON.parse(beaconCalls[0] ?? "{}"), {
|
|
mal_id: 42,
|
|
episode: 3,
|
|
time_seconds: 30,
|
|
});
|
|
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
assert.equal(modules.state.episode.transitionEpisode, null);
|
|
});
|
|
|
|
test("uses the same async path for episode links and leaves modified clicks native", async () => {
|
|
const modifiedLink = new FakeAnchorElement();
|
|
modifiedLink.href = "http://localhost/anime/42/watch?ep=2";
|
|
modifiedLink.dataset.episodeId = "2";
|
|
const modifiedClick = new FakeMouseEvent(modifiedLink, { metaKey: true });
|
|
|
|
assert.equal(
|
|
modules.handleEpisodeNavigationClick(modifiedClick as unknown as MouseEvent),
|
|
false,
|
|
);
|
|
assert.equal(modifiedClick.defaultPrevented, false);
|
|
assert.equal(fetchCalls.length, 0);
|
|
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
const episode = Number.parseInt(
|
|
new URL(url, "http://localhost").pathname.split("/").at(-1) ?? "",
|
|
10,
|
|
);
|
|
return Promise.resolve(episodeResponse(episode));
|
|
}) as typeof fetch;
|
|
const previousLink = new FakeAnchorElement();
|
|
previousLink.href = "http://localhost/anime/42/watch?ep=2";
|
|
previousLink.dataset.episodeId = "2";
|
|
const previousClick = new FakeMouseEvent(previousLink);
|
|
|
|
assert.equal(
|
|
modules.handleEpisodeNavigationClick(previousClick as unknown as MouseEvent),
|
|
true,
|
|
);
|
|
assert.equal(previousClick.defaultPrevented, true);
|
|
await flushPromises();
|
|
assert.equal(modules.state.episode.current, "2");
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
|
|
const nextLink = new FakeAnchorElement();
|
|
nextLink.href = "http://localhost/anime/42/watch?ep=4";
|
|
nextLink.dataset.episodeId = "4";
|
|
assert.equal(
|
|
modules.handleEpisodeNavigationClick(new FakeMouseEvent(nextLink) as unknown as MouseEvent),
|
|
true,
|
|
);
|
|
await flushPromises();
|
|
assert.equal(modules.state.episode.current, "4");
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
});
|
|
|
|
test("aborts a stale episode request and commits only the latest selection", async () => {
|
|
modules.state.episode.current = "1";
|
|
windowStub.location.href = "http://localhost/anime/42/watch?ep=1";
|
|
const pending = new Map<
|
|
number,
|
|
{ reject: (reason: unknown) => void; resolve: (response: Response) => void }
|
|
>();
|
|
globalThis.fetch = ((url: string, init?: RequestInit) => {
|
|
fetchCalls.push({ url });
|
|
const episode = Number.parseInt(
|
|
new URL(url, "http://localhost").pathname.split("/").at(-1) ?? "",
|
|
10,
|
|
);
|
|
return new Promise<Response>((resolve, reject) => {
|
|
pending.set(episode, { reject, resolve });
|
|
init?.signal?.addEventListener("abort", () => {
|
|
reject(new DOMException("aborted", "AbortError"));
|
|
});
|
|
});
|
|
}) as typeof fetch;
|
|
|
|
const episode2 = modules.transitionToEpisode(2);
|
|
const episode3 = modules.transitionToEpisode(3);
|
|
pending.get(3)?.resolve(episodeResponse(3));
|
|
|
|
assert.equal(await episode3, true);
|
|
assert.equal(await episode2, false);
|
|
assert.equal(modules.state.episode.current, "3");
|
|
assert.equal(modules.state.elements.video.src, "/watch/proxy/stream?mode=sub&token=sub-3");
|
|
assert.equal(historyCalls.length, 1);
|
|
assert.match(historyCalls[0] ?? "", /[?&]ep=3(?:&|$)/);
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
});
|
|
|
|
test("falls back to the original link when the episode payload fails", async () => {
|
|
console.error = (): void => {
|
|
void 0;
|
|
};
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
return Promise.resolve({ ok: false, status: 503 } as Response);
|
|
}) as typeof fetch;
|
|
const fallbackHref = "http://localhost/anime/42/watch?ep=5";
|
|
|
|
assert.equal(await modules.transitionToEpisode(5, { fallbackHref }), false);
|
|
assert.equal(windowStub.location.href, fallbackHref);
|
|
assert.equal(modules.state.episode.current, "3");
|
|
});
|
|
|
|
test("retries one failed media source before falling back to navigation", async () => {
|
|
console.error = (): void => {
|
|
void 0;
|
|
};
|
|
let request = 0;
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
request += 1;
|
|
const payload = episodePayload(4);
|
|
payload.mode_sources = {
|
|
dub: { subtitles: [], token: `dub-${request}`, type: "mp4" },
|
|
sub: { subtitles: [], token: `sub-${request}`, type: "mp4" },
|
|
};
|
|
return Promise.resolve({
|
|
json: () => Promise.resolve(payload),
|
|
ok: true,
|
|
status: 200,
|
|
} as Response);
|
|
}) as typeof fetch;
|
|
const fallbackHref = "http://localhost/anime/42/watch?ep=4";
|
|
|
|
assert.equal(await modules.transitionToEpisode(4, { fallbackHref }), true);
|
|
assert.equal(modules.state.elements.video.src, "/watch/proxy/stream?mode=sub&token=sub-1");
|
|
modules.state.elements.video.dispatchEvent(new Event("error"));
|
|
await flushPromises();
|
|
assert.equal(modules.state.elements.video.src, "/watch/proxy/stream?mode=sub&token=sub-2");
|
|
|
|
modules.state.elements.video.dispatchEvent(new Event("error"));
|
|
assert.equal(windowStub.location.href, fallbackHref);
|
|
});
|
|
|
|
test("uses the returned fallback mode and restores episodes on popstate", async () => {
|
|
const notices: string[] = [];
|
|
windowStub.showToast = ({ message }: { message: string }): void => {
|
|
notices.push(message);
|
|
};
|
|
modules.state.playback.currentMode = "dub";
|
|
globalThis.fetch = ((url: string) => {
|
|
fetchCalls.push({ url });
|
|
const episode = Number.parseInt(
|
|
new URL(url, "http://localhost").pathname.split("/").at(-1) ?? "",
|
|
10,
|
|
);
|
|
const payload = episodePayload(episode, {
|
|
sub: { subtitles: [], token: `sub-${episode}`, type: "mp4" },
|
|
});
|
|
payload.mode_switched_from = "dub";
|
|
return Promise.resolve({
|
|
json: () => Promise.resolve(payload),
|
|
ok: true,
|
|
status: 200,
|
|
} as Response);
|
|
}) as typeof fetch;
|
|
|
|
assert.equal(await modules.transitionToEpisode(4), true);
|
|
assert.equal(modules.state.playback.currentMode, "sub");
|
|
assert.deepEqual(notices, ["Episode 4 is only available in sub, switched from dub."]);
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
|
|
const controller = new AbortController();
|
|
modules.setupEpisodeNavigation(controller.signal);
|
|
windowStub.location.href = "http://localhost/anime/42/watch?ep=2";
|
|
windowStub.dispatchEvent(new Event("popstate"));
|
|
await flushPromises();
|
|
assert.equal(modules.state.episode.current, "2");
|
|
assert.equal(historyCalls.length, 1);
|
|
modules.state.elements.video.dispatchEvent(new Event("loadedmetadata"));
|
|
controller.abort();
|
|
});
|
|
});
|