wix / wix/react-native-navigation

RNVideo in overlay prevents the componentDidUnmount from being triggered

Open
#8,247 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

platform: iOS type: accepted/bug
Dominant language
MDX
Stars
13.2k
Forks
2.6k
Avg merge
6d 2h
Merged PRs (30d)
1

Description

What happened?

When showing a Overlay with a RNVideo component from react-native-video, the Video prevents the view from being unmounted on dismiss. I noticed this because my RNVideo was still playing in the background when I dismissed the overlay.

In other words, once you have a video playing, this code:

useEffect(() => {
  console.log('mounted');
  return () => {
    console.log('unmounted');
  };
}, []);

will only print mounted to the console, unmounted will never be called.

What was the expected behaviour?

I expect it to actually unmount like a normal Screen (push) does.

Was it tested on latest react-native-navigation?
  • I have tested this issue on the latest react-native-navigation release and it still reproduces.
Help us reproduce this issue!
  1. Show overlay with video
  2. Dismiss overlay
  3. Notice the overlay component still being "mounted" in native view hierarchy (video/audio still playing)
In what environment did this happen?

React Native Navigation version: 7.48.0
React Native version: 0.77
Has Fabric (React Native's new rendering system) enabled: (yes/no) no
Node version: 20
Device model: iPhone 17 Simulator
iOS version: 26

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue with an Overlay containing a react-native-video component, then inspect the overlay dismissal and unmount behavior. Done means dismissing the overlay triggers the component cleanup and the video or audio no longer continues playing in the background.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.