iOS PWA - getUserMedia Camera not displaying

Question

So When I remove this alerts from code, it doesn't display camera on the first try, if I leave alerts like this and user clicks "Ok" on alert video on iOS, stream displays. I want to know how to fix this so stream is displayed instantly when someone clicks this "enable camera" element. Stack overflow says my post is mostly code and I need to add more details but I don't know what to say.

export default function CreatePage() {
  const [isEnabled, setIsEnabled] = useState<boolean>(true);
  const [stream, setStream] = useState<MediaStream | null>(null);
  const videoElement = useRef<HTMLVideoElement | null>(null);
  const isPWA = useSelector(selectPwaStatus);
  useEffect(() => {
    const checkCameraStatus = async () => {
      const isAllowed = await useCameraAllowed();
      if (isAllowed) {
        const live = await getStream();
        setIsEnabled(true);
        setStream(live);
      } else {
        setIsEnabled(false);
      }
    };
    checkCameraStatus();
  }, []);

  const getStream = async (): Promise<MediaStream | null> => {
    while (true) {
      try {
        const environmentStream = await navigator.mediaDevices.getUserMedia({
          video: {
            facingMode: "environment",
          },
        });
        if (isPWA) {
          alert("Camera Enabled, Click Close to continue");
        }

        return environmentStream;
      } catch (environmentError) {
        try {
          const userStream = await navigator.mediaDevices.getUserMedia({
            video: {
              facingMode: "user",
            },
          });
          if (isPWA) {
            alert("Camera Enabled, Click Close to continue");
          }
          return userStream;
        } catch (userError) {}
      }
    }
  };

  const enableCamera = async () => {
    const live = await getStream();
    if (live) {
      setIsEnabled(true);
    }
    setStream(live);
  };

  useEffect(() => {
    if (stream) {
      if (videoElement.current) {
        videoElement.current.srcObject = stream;
      }
    }
  }, [stream]);

  return (
    <Wrapper>
      <VideoWrapper>
        <Video ref={videoElement} autoPlay playsInline muted />
      </VideoWrapper>
      <UI_Wrapper>{!isEnabled && <CenteredText onClick={enableCamera}>Tap to enable camera</CenteredText>}</UI_Wrapper>
    </Wrapper>
  );
}