Why is my homepage video constantly loading on debut theme?

Topic summary

Homepage YouTube video on Debut theme hangs on loading due to a JavaScript error in theme.js/theme.js.liquid. The issue centers on how the code retrieves the iframe ID in getVideoOptions, which varies across theme versions and breaks after updates.

Root cause: the code references event.target..id (e.g., .h, .a, .l, .f, .g.g), which changes between versions, causing undefined lookups in the videos map.

Working fixes reported:

  • Update getVideoOptions to a robust approach: var id = evt.target.getIframe().id; return videos[id]; (recommended by Visely-Team and others).
  • Version-specific interim tweaks: replace evt.target.a.id with evt.target.l.id, .f.id, .g.g.id, or .h.id depending on each store.
  • In some themes, adjust onPlayerReady: replace event.target.a with event.target.m.
  • For poster overlay not hiding, wrap the .video__iframe CSS in a .loaded scope.
  • Ensure edits are made in the live theme, not a duplicate; some resolved by reverting and reapplying clean code.

Other notes: Some cases were unrelated (e.g., Vimeo password-protected playback, non-Debut themes like Venue). One product-page case required using a YouTube iframe embed instead of a

Status: Ongoing; fixes are theme/version-specific, but the getIframe-based solution aims to be update-proof.

Summarized with AI on January 24. AI used: gpt-5.

This works on my end. Thanks!