diff --git a/src/app/player/components/html-video-player/html-video-player.component.ts b/src/app/player/components/html-video-player/html-video-player.component.ts index b08635706..eac9237d9 100644 --- a/src/app/player/components/html-video-player/html-video-player.component.ts +++ b/src/app/player/components/html-video-player/html-video-player.component.ts @@ -46,7 +46,7 @@ export class HtmlVideoPlayerComponent implements OnChanges, OnDestroy { console.log('... switching channel to ', channel.name, url); this.hls.loadSource(url); this.hls.attachMedia(this.videoPlayer.nativeElement); - this.videoPlayer.nativeElement.play(); + this.handlePlayOperation(); } else if ( this.videoPlayer.nativeElement.canPlayType( 'application/vnd.apple.mpegurl' @@ -56,12 +56,27 @@ export class HtmlVideoPlayerComponent implements OnChanges, OnDestroy { this.videoPlayer.nativeElement.addEventListener( 'loadedmetadata', () => { - this.videoPlayer.nativeElement.play(); + this.handlePlayOperation(); } ); } } + /** + * Handles promise based play operation + */ + handlePlayOperation(): void { + const playPromise = this.videoPlayer.nativeElement.play(); + + if (playPromise !== undefined) { + playPromise + .then(() => { + // Automatic playback started! + }) + .catch((error) => console.error(error)); + } + } + /** * Destroy hls instance on component destroy */