muxinc / elements

Custom elements for working with media in the browser that Just Work™
https://elements-demo-nextjs.vercel.app
MIT License
266 stars 49 forks source link

Bug: Cast button hidden until tab refresh when switching between two players that have different themes #942

Open arghhhhh opened 5 months ago

arghhhhh commented 5 months ago

Is there an existing issue for this?

Which Mux Elements/Packages does this apply to? Select all that apply

mux-video-react

Which browsers are you using?

Chrome, Safari, Firefox, Edge ("Edgeium")

Which operating systems are you using?

None

Description

When switching between two different players on the same page--one with the default theme and the other with either the minimal or microvideo theme--the second player's cast button is hidden until switching back and forth between tabs.

unnamed

Reduced test case

https://codesandbox.io/p/sandbox/mux-player-react-cast-button-bug-demo-pt2r48

Steps to reproduce

  1. See that casting is available for video player
  2. Hit 'switch player' button
  3. See that cast button is hidden on second player
  4. Open a different browser tab
  5. Return to the original tab and verify that the cast button is now visible

Current Behavior

Cast button on second player is hidden

Expected Behavior

Cast button on second player is visible

Errors

No response

What version of the package are you using?

2.7.0

arghhhhh commented 5 months ago

In case I didn't make it clear, the temporary solution to this issue is ensuring that both players on the page utilize the same theme.

heff commented 4 months ago

That is an unexpected fix... Does using the same theme work with both themes or could it be an issue with one of the themes? i.e. One of the themes could be waiting until the browser says casing is available before showing the button.

Which browsers are you using? Chrome, Safari, Firefox, Edge ("Edgeium")

I don't see any issues in Safari on my side. Just confirming you tested it there.

Otherwise I'm not near a chromecast at the moment but will verify chrome when I am. Right now it just never shows the casting icon for me.

arghhhhh commented 4 months ago

That is an unexpected fix... Does using the same theme work with both themes or could it be an issue with one of the themes? i.e. One of the themes could be waiting until the browser says casing is available before showing the button.

Which browsers are you using? Chrome, Safari, Firefox, Edge ("Edgeium")

I don't see any issues in Safari on my side. Just confirming you tested it there.

Otherwise I'm not near a chromecast at the moment but will verify chrome when I am. Right now it just never shows the casting icon for me.

Using the same theme works with both themes. As for Safari, I don't have a mac available to test.

luwes commented 4 months ago

it should only show in Chrome and Edge, they only support casting. the logic in media-chrome should hide it in the other browsers.

not exactly sure why on theme change it doesn't show right away, I suppose there are no events that are triggering a new evaluation of the casting support.

relevant code: https://github.com/muxinc/media-chrome/blob/16e43f2a8dd8ce877e54c9243563d095ef9889ca/src/js/media-store/state-mediator.js#L988-L1019