Pause YouTube Video When Popup Closes

🔧 I ran into a small but annoying issue in Bubble while using the default Video element inside a popup to play a YouTube video.

❌ Problem:

If the user doesn’t manually pause the YouTube video and just closes the popup, the audio keeps playing in the background.

✅ Fix:

Added a “Run JavaScript” action on popup close:

var iframe = document.querySelector("iframe[src*='youtube']");
if (iframe) {
  iframe.contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*');
}

🧠 What this does:

• It looks for the YouTube iframe inside your page.

• Bubble’s video element creates an iframe with enablejsapi=1 parameter present in the URL.

  

• Since enablejsapi=1 parameter present, we can control the video with JavaScript commands such as pauseVideo

• When the popup closes, it sends a message to the video telling it to pause.

Now, whenever the popup closes, the video stops cleanly. A small fix, but it really improves the user experience.