Script fails to load with react 18 and iOS

[henninghaakonsen]

Hi, our team has tried to use your package (and implement it ourself), but we are facing the same issue either way. When trying to load an youtube video on iOS the script fails to load. There is little to no information in the errors from the onerror function and we were wondering if you have any ideas as to how we can fix this issue.

useEffect(() => {
    if (!window.YT) {
      // If not, load the script asynchronously
      const tag = document.createElement('script');
      tag.src = 'https://www.youtube.com/iframe_api';
      tag.onerror = (
        event: Event | string,
        source?: string,
        lineno?: number,
        colno?: number,
        error?: Error
      ) => {
        console.log(event, source, error); // Most of these are undefined
      };

      // onYouTubeIframeAPIReady will set the toggle after the script is loaded
      window.onYouTubeIframeAPIReady = onYouTubeIframeAPIReady;

      const firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag?.parentNode?.insertBefore(tag, firstScriptTag);
    } else {
      // If script is already there, load the video directly
      onYouTubeIframeAPIReady();
    }
}, []);

const onYouTubeIframeAPIReady = () => {
    setIsYoutubeIframeApiReady(true); // this enables child components to create new players with "new window.YT.Player()"
};