We are changing over to expo SDK 52, and in the docs they recommend switching from expo-av to expo-video. We want very simple functionality, just a videoplayer that will play the videos automatically when opening them. This is the current set up for the component:

import { FC, useEffect } from 'react';

import { useVideoPlayer, VideoView } from 'expo-video';

import Box from '@/src/components/Box';
import useMediaStore from '@/src/store/mediaStore';
import useIsWeb from '@/src/lib/shared/utils/hooks/useIsWeb';

const VideoViewer: FC = () => {
  const isWeb = useIsWeb();

  const { url, title, setIsLoading, setIsError } = useMediaStore((state) => ({
    url: state.url,
    title: state.title,
  }));

  const player = useVideoPlayer(url, (player) => {
    if (isWeb) {
      player.muted = true;
    }
    player.play();
  });

  return (
    <Box flex={1} backgroundColor={'black'}>
      <VideoView
        player={player}
        allowsFullscreen
        accessibilityLabel={title}
        accessibilityHint='Double-tap to play or pause the video'
        accessibilityRole='adjustable'
        style={{ flex: 1, width: 'auto' }}
      />
    </Box>
  );
};

export default VideoViewer;

It works well on ios and android, but I have not been able to get it to autoplay on web. I read online that sometimes browsers stop autoplay with sound, so I have also tried muting it, but that still did not work. And even if it did, that is not really the functionality we want.

Does anyone have any tips?

Thanks!