Attempt to replay video muted on NotAllowedError

This commit is contained in:
0x464e 2026-03-30 13:54:51 +03:00
parent 025018dd98
commit bdc838cc5a
No known key found for this signature in database
GPG Key ID: E6D221DF6CBFBFFA
2 changed files with 19 additions and 1 deletions

View File

@ -6,6 +6,7 @@ import {
calculateInpointOffset,
calculateSeekPosition,
} from "@/utils/videoUtil";
import { playWithTemporaryMuteFallback } from "@/utils/videoUtil.ts";
type PlayerMode = "playback" | "scrubbing";
@ -107,7 +108,7 @@ export class DynamicVideoController {
return new Promise((resolve) => {
const onSeekedHandler = () => {
this.playerController.removeEventListener("seeked", onSeekedHandler);
this.playerController.play();
playWithTemporaryMuteFallback(this.playerController);
resolve(undefined);
};

View File

@ -78,3 +78,20 @@ export function calculateSeekPosition(
return seekSeconds >= 0 ? seekSeconds : undefined;
}
/**
* Attempts to play the video, and if it fails due to a NotAllowedError (often caused by browser autoplay restrictions),
* it temporarily mutes the video and tries to play again.
* @param video - The HTMLVideoElement to play
*/
export function playWithTemporaryMuteFallback(video: HTMLVideoElement) {
return video.play().catch((error: { name?: string }) => {
if (error.name === "NotAllowedError" && !video.muted) {
video.muted = true;
return video.play().catch(() => undefined);
}
throw error;
});
}