[BUG]: iOS infinite loop with react native 0.76

[DeAtHhAwK-1999]

Version

^6.7.0

What platforms are you having the problem on?

iOS

System Version

^0.76.1

On what device are you experiencing the issue?

Real device, Simulator

Architecture

New architecture with interop layer

What happened?

iOS doesn't access any of the internal function and keep loading except the onLayout
{"_dispatchInstances": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": {"_debugHookTypes": [Array], "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 1.3437069654464722, "actualStartTime": 101610388.838375, "alternate": null, "child": [FiberNode], "childLanes": 0, "deletions": null, "dependencies": null, "elementType": [Object], "flags": 4194309, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": [Object], "mode": 3, "pendingProps": [Object], "ref": [Function ref], "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.21000000834465027, "sibling": null, "stateNode": null, "subtreeFlags": 3146241, "tag": 11, "treeBaseDuration": 0.3764999806880951, "type": [Object], "updateQueue": [Object]}, "actualDuration": 0.4639579951763153, "actualStartTime": 101610389.097541, "alternate": null, "child": null, "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTVideo", "flags": 3146240, "index": 0, "key": null, "lanes": 0, "memoizedProps": {"controls": true, "disableFocus": true, "fullscreen": false, "ignoreSilentSwitch": "obey", "onAudioFocusChanged": undefined, "onAudioTracks": undefined, "onControlsVisibilityChange": undefined, "onGetLicense": undefined, "onLayout": [Function onLayout], "onPictureInPictureStatusChanged": undefined, "onPlaybackRateChange": undefined, "onReadyForDisplay": [Function anonymous], "onReceiveAdEvent": undefined, "onRestoreUserInterfaceForPictureInPictureStop": undefined, "onTextTrackDataChanged": undefined, "onTextTracks": undefined, "onTimedMetadata": undefined, "onVideoAspectRatio": undefined, "onVideoAudioBecomingNoisy": undefined, "onVideoBandwidthUpdate": undefined, "onVideoBuffer": [Function anonymous], "onVideoEnd": undefined, "onVideoError": [Function anonymous], "onVideoExternalPlaybackChange": undefined, "onVideoFullscreenPlayerDidDismiss": undefined, "onVideoFullscreenPlayerDidPresent": undefined, "onVideoFullscreenPlayerWillDismiss": undefined, "onVideoFullscreenPlayerWillPresent": undefined, "onVideoIdle": [Function onIdle], "onVideoLoad": [Function anonymous], "onVideoLoadStart": [Function anonymous], "onVideoPlaybackStateChanged": undefined, "onVideoProgress": [Function anonymous], "onVideoSeek": undefined, "onVideoTracks": undefined, "onVolumeChange": undefined, "playInBackground": false, "playWhenInactive": false, "repeat": false, "resizeMode": "contain", "restoreUserInterfaceForPIPStopCompletionHandler": undefined, "selectedAudioTrack": undefined, "selectedTextTrack": undefined, "selectedVideoTrack": undefined, "shutterColor": undefined, "src": [Object], "style": [Object], "viewType": 1, "volume": 1}, "memoizedState": null, "mode": 3, "pendingProps": {"controls": true, "disableFocus": true, "fullscreen": false, "ignoreSilentSwitch": "obey", "onAudioFocusChanged": undefined, "onAudioTracks": undefined, "onControlsVisibilityChange": undefined, "onGetLicense": undefined, "onLayout": [Function onLayout], "onPictureInPictureStatusChanged": undefined, "onPlaybackRateChange": undefined, "onReadyForDisplay": [Function anonymous], "onReceiveAdEvent": undefined, "onRestoreUserInterfaceForPictureInPictureStop": undefined, "onTextTrackDataChanged": undefined, "onTextTracks": undefined, "onTimedMetadata": undefined, "onVideoAspectRatio": undefined, "onVideoAudioBecomingNoisy": undefined, "onVideoBandwidthUpdate": undefined, "onVideoBuffer": [Function anonymous], "onVideoEnd": undefined, "onVideoError": [Function anonymous], "onVideoExternalPlaybackChange": undefined, "onVideoFullscreenPlayerDidDismiss": undefined, "onVideoFullscreenPlayerDidPresent": undefined, "onVideoFullscreenPlayerWillDismiss": undefined, "onVideoFullscreenPlayerWillPresent": undefined, "onVideoIdle": [Function onIdle], "onVideoLoad": [Function anonymous], "onVideoLoadStart": [Function anonymous], "onVideoPlaybackStateChanged": undefined, "onVideoProgress": [Function anonymous], "onVideoSeek": undefined, "onVideoTracks": undefined, "onVolumeChange": undefined, "playInBackground": false, "playWhenInactive": false, "repeat": false, "resizeMode": "contain", "restoreUserInterfaceForPIPStopCompletionHandler": undefined, "selectedAudioTrack": undefined, "selectedTextTrack": undefined, "selectedVideoTrack": undefined, "shutterColor": undefined, "src": [Object], "style": [Object], "viewType": 1, "volume": 1}, "ref": {"current": [ReactFabricHostComponent]}, "refCleanup": null, "return": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 1.1014999449253082, "actualStartTime": 101610389.081083, "alternate": null, "child": [Circular], "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTView", "flags": 0, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": null, "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.015666991472244263, "sibling": null, "stateNode": [Object], "subtreeFlags": 3146241, "tag": 5, "treeBaseDuration": 0.13637496531009674, "type": "RCTView", "updateQueue": null}, "selfBaseDuration": 0.003457993268966675, "sibling": {"_debugHookTypes": [Array], "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 0.5222919583320618, "actualStartTime": 101610389.563958, "alternate": null, "child": [FiberNode], "childLanes": 0, "deletions": null, "dependencies": [Object], "elementType": [Object], "flags": 1048577, "index": 1, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": null, "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.03312499821186066, "sibling": null, "stateNode": null, "subtreeFlags": 1, "tag": 11, "treeBaseDuration": 0.1172499805688858, "type": [Object], "updateQueue": null}, "stateNode": {"canonical": [Object], "node": [Object]}, "subtreeFlags": 0, "tag": 5, "treeBaseDuration": 0.003457993268966675, "type": "RCTVideo", "updateQueue": null}, "_dispatchListeners": [Function onLayout], "_targetInst": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": {"_debugHookTypes": [Array], "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 1.3437069654464722, "actualStartTime": 101610388.838375, "alternate": null, "child": [FiberNode], "childLanes": 0, "deletions": null, "dependencies": null, "elementType": [Object], "flags": 4194309, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": [Object], "mode": 3, "pendingProps": [Object], "ref": [Function ref], "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.21000000834465027, "sibling": null, "stateNode": null, "subtreeFlags": 3146241, "tag": 11, "treeBaseDuration": 0.3764999806880951, "type": [Object], "updateQueue": [Object]}, "actualDuration": 0.4639579951763153, "actualStartTime": 101610389.097541, "alternate": null, "child": null, "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTVideo", "flags": 3146240, "index": 0, "key": null, "lanes": 0, "memoizedProps": {"controls": true, "disableFocus": true, "fullscreen": false, "ignoreSilentSwitch": "obey", "onAudioFocusChanged": undefined, "onAudioTracks": undefined, "onControlsVisibilityChange": undefined, "onGetLicense": undefined, "onLayout": [Function onLayout], "onPictureInPictureStatusChanged": undefined, "onPlaybackRateChange": undefined, "onReadyForDisplay": [Function anonymous], "onReceiveAdEvent": undefined, "onRestoreUserInterfaceForPictureInPictureStop": undefined, "onTextTrackDataChanged": undefined, "onTextTracks": undefined, "onTimedMetadata": undefined, "onVideoAspectRatio": undefined, "onVideoAudioBecomingNoisy": undefined, "onVideoBandwidthUpdate": undefined, "onVideoBuffer": [Function anonymous], "onVideoEnd": undefined, "onVideoError": [Function anonymous], "onVideoExternalPlaybackChange": undefined, "onVideoFullscreenPlayerDidDismiss": undefined, "onVideoFullscreenPlayerDidPresent": undefined, "onVideoFullscreenPlayerWillDismiss": undefined, "onVideoFullscreenPlayerWillPresent": undefined, "onVideoIdle": [Function onIdle], "onVideoLoad": [Function anonymous], "onVideoLoadStart": [Function anonymous], "onVideoPlaybackStateChanged": undefined, "onVideoProgress": [Function anonymous], "onVideoSeek": undefined, "onVideoTracks": undefined, "onVolumeChange": undefined, "playInBackground": false, "playWhenInactive": false, "repeat": false, "resizeMode": "contain", "restoreUserInterfaceForPIPStopCompletionHandler": undefined, "selectedAudioTrack": undefined, "selectedTextTrack": undefined, "selectedVideoTrack": undefined, "shutterColor": undefined, "src": [Object], "style": [Object], "viewType": 1, "volume": 1}, "memoizedState": null, "mode": 3, "pendingProps": {"controls": true, "disableFocus": true, "fullscreen": false, "ignoreSilentSwitch": "obey", "onAudioFocusChanged": undefined, "onAudioTracks": undefined, "onControlsVisibilityChange": undefined, "onGetLicense": undefined, "onLayout": [Function onLayout], "onPictureInPictureStatusChanged": undefined, "onPlaybackRateChange": undefined, "onReadyForDisplay": [Function anonymous], "onReceiveAdEvent": undefined, "onRestoreUserInterfaceForPictureInPictureStop": undefined, "onTextTrackDataChanged": undefined, "onTextTracks": undefined, "onTimedMetadata": undefined, "onVideoAspectRatio": undefined, "onVideoAudioBecomingNoisy": undefined, "onVideoBandwidthUpdate": undefined, "onVideoBuffer": [Function anonymous], "onVideoEnd": undefined, "onVideoError": [Function anonymous], "onVideoExternalPlaybackChange": undefined, "onVideoFullscreenPlayerDidDismiss": undefined, "onVideoFullscreenPlayerDidPresent": undefined, "onVideoFullscreenPlayerWillDismiss": undefined, "onVideoFullscreenPlayerWillPresent": undefined, "onVideoIdle": [Function onIdle], "onVideoLoad": [Function anonymous], "onVideoLoadStart": [Function anonymous], "onVideoPlaybackStateChanged": undefined, "onVideoProgress": [Function anonymous], "onVideoSeek": undefined, "onVideoTracks": undefined, "onVolumeChange": undefined, "playInBackground": false, "playWhenInactive": false, "repeat": false, "resizeMode": "contain", "restoreUserInterfaceForPIPStopCompletionHandler": undefined, "selectedAudioTrack": undefined, "selectedTextTrack": undefined, "selectedVideoTrack": undefined, "shutterColor": undefined, "src": [Object], "style": [Object], "viewType": 1, "volume": 1}, "ref": {"current": [ReactFabricHostComponent]}, "refCleanup": null, "return": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 1.1014999449253082, "actualStartTime": 101610389.081083, "alternate": null, "child": [Circular], "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTView", "flags": 0, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": null, "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.015666991472244263, "sibling": null, "stateNode": [Object], "subtreeFlags": 3146241, "tag": 5, "treeBaseDuration": 0.13637496531009674, "type": "RCTView", "updateQueue": null}, "selfBaseDuration": 0.003457993268966675, "sibling": {"_debugHookTypes": [Array], "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 0.5222919583320618, "actualStartTime": 101610389.563958, "alternate": null, "child": [FiberNode], "childLanes": 0, "deletions": null, "dependencies": [Object], "elementType": [Object], "flags": 1048577, "index": 1, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": null, "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.03312499821186066, "sibling": null, "stateNode": null, "subtreeFlags": 1, "tag": 11, "treeBaseDuration": 0.1172499805688858, "type": [Object], "updateQueue": null}, "stateNode": {"canonical": [Object], "node": [Object]}, "subtreeFlags": 0, "tag": 5, "treeBaseDuration": 0.003457993268966675, "type": "RCTVideo", "updateQueue": null}, "bubbles": undefined, "cancelable": undefined, "currentTarget": {"__internalInstanceHandle": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 0.4639579951763153, "actualStartTime": 101610389.097541, "alternate": null, "child": null, "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTVideo", "flags": 3146240, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": [Object], "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.003457993268966675, "sibling": [FiberNode], "stateNode": [Object], "subtreeFlags": 0, "tag": 5, "treeBaseDuration": 0.003457993268966675, "type": "RCTVideo", "updateQueue": null}, "__nativeTag": 1398, "_viewConfig": {"Commands": [Object], "Constants": [Object], "Manager": "VideoManager", "NativeProps": [Object], "baseModuleName": "RCTView", "bubblingEventTypes": [Object], "directEventTypes": [Object], "uiViewClassName": "RCTVideo", "validAttributes": [Object]}}, "defaultPrevented": undefined, "dispatchConfig": {"registrationName": "onLayout"}, "eventPhase": undefined, "isDefaultPrevented": [Function functionThatReturnsFalse], "isPropagationStopped": [Function functionThatReturnsFalse], "isTrusted": undefined, "nativeEvent": {"layout": {"height": 0, "width": 0, "x": 0, "y": 0}, "target": 1398}, "target": {"__internalInstanceHandle": {"_debugHookTypes": null, "_debugInfo": null, "_debugNeedsRemount": false, "_debugOwner": [FiberNode], "actualDuration": 0.4639579951763153, "actualStartTime": 101610389.097541, "alternate": null, "child": null, "childLanes": 0, "deletions": null, "dependencies": null, "elementType": "RCTVideo", "flags": 3146240, "index": 0, "key": null, "lanes": 0, "memoizedProps": [Object], "memoizedState": null, "mode": 3, "pendingProps": [Object], "ref": [Object], "refCleanup": null, "return": [FiberNode], "selfBaseDuration": 0.003457993268966675, "sibling": [FiberNode], "stateNode": [Object], "subtreeFlags": 0, "tag": 5, "treeBaseDuration": 0.003457993268966675, "type": "RCTVideo", "updateQueue": null}, "__nativeTag": 1398, "_viewConfig": {"Commands": [Object], "Constants": [Object], "Manager": "VideoManager", "NativeProps": [Object], "baseModuleName": "RCTView", "bubblingEventTypes": [Object], "directEventTypes": [Object], "uiViewClassName": "RCTVideo", "validAttributes": [Object]}}, "timeStamp": 1730389000760, "type": undefined}
this is the onLayout log

Reproduction Link

repository link

Reproduction

Step to reproduce this bug are:

[github-actions]

Thank you for your issue report. Please note that the following information is missing or incomplete:

• reproduction
• reproduction link

Please update your issue with this information to help us address it more effectively.

Note: issues without complete information have a lower priority

There is a newer version of the library available. You are using version ^6.7.0, while the latest stable version is 6.7.0. Please update to the latest version and check if the issue still exists.

Note: If the issue still exists, please update the issue report with the latest information.

[nalinsakthivel]

I am also facing this issue. Does anyone have a solution?

[DeAtHhAwK-1999]

I already use version 6.7.0 and the arrow is not even do anything cause it is the latest version, but when go to the react native 0.75 version it working good but is not a solution so please solve this :)

[nalinsakthivel]

I already use version 6.7.0 and the arrow is not even do anything cause it is the latest version, but when go to the react native 0.75 version it working good but is not a solution so please solve this :)

@DeAtHhAwK-1999 Yes, now I have reverted to RN 0.75.4.

[freeboub]

I don't reproduce the issue on sample I just build. It would be useful to provide a sample app source code

[DeAtHhAwK-1999]

@freeboub you can check this is the component code

import {appColors} from '@constants/colors';
import React, {useCallback} from 'react';
import {StyleSheet} from 'react-native';
import Video, {
  OnProgressData,
  OnVideoErrorData,
  ReactVideoProps,
  ReactVideoSource,
  VideoRef,
} from 'react-native-video';

interface VideoPlayerProps extends ReactVideoProps {
  onVideoReady: (ref: VideoRef) => void;
  uri: ReactVideoSource['uri'];
}

const VideoView = ({
  uri,
  onVideoReady,
  fullscreen,
  repeat,
  controls,
  onReadyForDisplay,
  renderLoader,
}: VideoPlayerProps): React.JSX.Element => {
  const onError = useCallback((error: OnVideoErrorData) => {
    console.log('Video Error =>', error);
  }, []);

  return (
    <Video
      // Can be a URL or a local file.
      source={{uri: uri}}
      // Store reference
      ref={(ref: VideoRef) => onVideoReady(ref)}
      // Callback when video cannot be loaded
      onError={onError}
      disableFocus
      repeat={repeat}
      fullscreen={fullscreen}
      style={styles.backgroundVideo}
      playWhenInactive={false}
      playInBackground={false}
      renderLoader={renderLoader}
      volume={1.0}
      resizeMode={'contain'}
      ignoreSilentSwitch={'obey'}
      onReadyForDisplay={onReadyForDisplay}
      controls={controls}
      onProgress={(progress: OnProgressData) => {
        console.log('progress =>', progress);
      }}
    />
  );
};

export default VideoView;

const styles = StyleSheet.create({
  backgroundVideo: {
    flex: 1,
    backgroundColor: appColors.black,
  },
});