`onEnterFullscreen` triggers unexpectedly with resizeMode="cover" on mount

[coofzilla]

Problem:

When resizeMode is set to "cover", the component initializes _isFullscreen to true, which triggers the onEnterFullscreen callback on mount, even if the video is not actually in fullscreen mode. This causes unintended side effects, especially when onEnterFullscreen contains functional logic.

I believe this is the culprit:

const [_isFullscreen, setIsFullscreen] = useState<boolean>(
  isFullscreen || resizeMode === 'cover' || false,
);

If resizeMode === 'cover', _isFullscreen is set to true, leading to this useEffect:

// VideoPlayer.tsx (AnimatedVideoPlayer)

  useEffect(() => {
    if (toggleResizeModeOnFullscreen) {
      setResizeMode(_isFullscreen ? ResizeMode.COVER : ResizeMode.CONTAIN);
    }

    if (mounted.current) {
      if (_isFullscreen) {
        typeof events.onEnterFullscreen === 'function' &&
          events.onEnterFullscreen();
      } else {
        typeof events.onExitFullscreen === 'function' &&
          events.onExitFullscreen();
      }
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [_isFullscreen, toggleResizeModeOnFullscreen]);

Since onEnterFullscreen is triggered by _isFullscreen, any logic in onEnterFullscreen is executed even though fullscreen wasn't explicitly intended.

Example:

<VideoPlayer
  resizeMode="cover"
  isFullscreen={false}  // Doesn't prevent the side effect
  onEnterFullscreen={() => {
    // This logic runs unintentionally on mount
  }}
/>

Expected Behavior

onEnterFullscreen should only trigger when fullscreen is explicitly activated by the user or another deliberate action, not just by setting resizeMode to "cover".

Suggested Fix

Revisit how _isFullscreen is initialized or decouple resizeMode="cover" from automatic fullscreen activation. An interim solution is to ensure that resizeMode doesn't implicitly trigger fullscreen logic.

[LunatiqueCoder]

@coofzilla Oh wooow people have been complaining about it but I haven't been able to reproduce this. Really nice find!

[coofzilla]

Active contributors are eligible to receive a license for all JetBrains IDEs: https://www.jetbrains.com/ides/

am I cool enough to get one of these? 🤣

[LunatiqueCoder]

You're so cool and you've been really helpful this year for us, but unfortunately the rule is that you have to contribute actively with code :( Your username needs to appear in the commit history 🚀

SOURCE: https://www.jetbrains.com/community/opensource/

---

So @coofzilla open some PRs and let's get going! 🚀