Issue with @cycjimmy/jsmpeg-player in React 18, Cannot read properties of null on destroy()

Question

I am currently working on a React 18 project where I am utilizing the @cycjimmy/jsmpeg-player library for video streaming. The implementation is working smoothly without any issues when React.StrictMode is disabled. However, I encountered a problem when I enable React.StrictMode, as it causes a crash with the error message Cannot read properties of null (reading 'abort').

The issue is arriving from player.destroy(). But player is not null.

The relevant code snippet is as follows:

useEffect(() => {
  const canvas = document.createElement("canvas");
  const gl =
    canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
  gl.getExtension("WEBGL_lose_context").loseContext();

  const player = new JSMpeg.VideoElement(`#video-id`, videoUrl, {
    ...options,
    hooks: {
      load: () => setStatus("Loaded"),
      play: () => setStatus("Playing"),
      stop: () => setStatus("Stopped"),
      pause: () => setStatus("Paused"),
    },
  });

  setMPlayer(player);

  return () => {
    player.destroy();
  };
}, [videoUrl, options]);

It seems that the player.destroy() function, intended to handle the player instance destruction, encounters issues when called rapidly after the player instantiation (possibly due to quick successive calls).

I have created a demo of the issue on CodeSandbox to provide a live example for better understanding. You can toggle off and on React.StrictMode to see the difference.

I would greatly appreciate any insights or suggestions on how to resolve this issue.