Skip to content

Commit b1f61c4

Browse files
AntonChesnokovcrisbeto
authored andcommitted
fix(youtube-player): apply startSeconds with disablePlaceholder and autoplay (#32570)
Fixes a bug where the YouTube player ignored the startSeconds input when both disablePlaceholder and playerVars.autoplay were set. The player now correctly seeks to the specified start time using seekTo() when the video autoplays. The issue occurred because the code only checked the playVideo parameter to determine if seekTo should be called, but didn't account for videos that autoplay through playerVars.autoplay = 1. Fixes #32545 (cherry picked from commit 0302e4b)
1 parent 964c39e commit b1f61c4

2 files changed

Lines changed: 25 additions & 5 deletions

File tree

src/youtube-player/youtube-player.spec.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -679,6 +679,22 @@ describe('YoutubePlayer', () => {
679679
expect(playerCtorSpy).toHaveBeenCalled();
680680
});
681681

682+
it('should apply startSeconds when disablePlaceholder and autoplay are both set', () => {
683+
testComponent.disablePlaceholder = true;
684+
testComponent.playerVars = {autoplay: 1};
685+
testComponent.startSeconds = 30;
686+
fixture.changeDetectorRef.markForCheck();
687+
fixture.detectChanges();
688+
689+
// Simulate player state being PLAYING (autoplay has started the video)
690+
playerSpy.getPlayerState.and.returnValue(window.YT!.PlayerState.PLAYING);
691+
events.onReady({target: playerSpy});
692+
693+
// Should use seekTo instead of cueVideoById when player is already playing
694+
expect(playerSpy.seekTo).toHaveBeenCalledWith(30, true);
695+
expect(playerSpy.cueVideoById).not.toHaveBeenCalled();
696+
});
697+
682698
it('should allow for the placeholder image quality to be changed', () => {
683699
const placeholder = getPlaceholder(fixture);
684700
expect(placeholder.style.backgroundImage).toContain(

src/youtube-player/youtube-player.ts

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -628,11 +628,15 @@ export class YouTubePlayer implements AfterViewInit, OnChanges, OnDestroy {
628628
const state = player.getPlayerState();
629629
if (state === PlayerState.UNSTARTED || state === PlayerState.CUED || state == null) {
630630
this._cuePlayer();
631-
} else if (playVideo && this.startSeconds && this.startSeconds > 0) {
632-
// We have to use `seekTo` when `startSeconds` are specified to simulate it playing from
633-
// a specific time. The "proper" way to do it would be to either go through `cueVideoById`
634-
// or `playerVars.start`, but at the time of writing both end up resetting the video
635-
// to the state as if the user hasn't interacted with it.
631+
} else if (
632+
(playVideo || this.playerVars?.autoplay === 1) &&
633+
this.startSeconds &&
634+
this.startSeconds > 0
635+
) {
636+
// We have to use `seekTo` when `startSeconds` are specified with a playing video
637+
// (either from user interaction or autoplay). The "proper" way to do it would be to
638+
// either go through `cueVideoById` or `playerVars.start`, but at the time of writing
639+
// both end up resetting the video to the state as if the user hasn't interacted with it.
636640
player.seekTo(this.startSeconds, true);
637641
}
638642

0 commit comments

Comments
 (0)