diff --git a/packages/web-components/src/components/card/card.ts b/packages/web-components/src/components/card/card.ts index f754de426bf..66812e968be 100644 --- a/packages/web-components/src/components/card/card.ts +++ b/packages/web-components/src/components/card/card.ts @@ -377,7 +377,9 @@ class C4DCard extends CTAMixin(StableSelectorMixin(CDSLink)) { */ // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to private _handleVideoTitleUpdate = async (event) => { - if (event && this.ctaType === CTA_TYPE.VIDEO) { + const { videoId } = event.detail || {}; + + if (event && this.ctaType === CTA_TYPE.VIDEO && this.href === videoId) { const { videoDuration, videoName } = event.detail as any; const { formatVideoDuration, formatVideoCaption } = this; const formattedVideoDuration = formatVideoDuration({ diff --git a/packages/web-components/src/components/cta/video-cta-composite.ts b/packages/web-components/src/components/cta/video-cta-composite.ts index e8567c8478c..6f2dfbd6e62 100644 --- a/packages/web-components/src/components/cta/video-cta-composite.ts +++ b/packages/web-components/src/components/cta/video-cta-composite.ts @@ -110,6 +110,7 @@ class C4DVideoCTAComposite extends ModalRenderMixin( detail: { videoName, videoDuration: duration, + videoId: href, }, } ); diff --git a/packages/web-components/src/components/video-player/__stories__/video-player.stories.ts b/packages/web-components/src/components/video-player/__stories__/video-player.stories.ts index 3451f251daa..521036ddb05 100644 --- a/packages/web-components/src/components/video-player/__stories__/video-player.stories.ts +++ b/packages/web-components/src/components/video-player/__stories__/video-player.stories.ts @@ -22,7 +22,12 @@ export const Default = (args) => { video-id=${videoId} caption=${caption} ?hide-caption=${hideCaption} - thumbnail=${thumbnail}> + thumbnail=${thumbnail} + background-mode> + + `; };