Allow Fullscreen in Canvas component

[jgcarrillo]

Hi! I'm trying to recreate this example. I just tried with e.target.requestFullscreen() but every time I want to go back to non-fullscreen mode, my <Canvas > just disappears. Here is my code:

const onFullScreenMode = (e) => {
  const fullscreenElement = document.fullscreenElement || document.webkitFullscreen;

  if (!fullscreenElement) {
    if (e.target.requestFullscreen) {
      e.target.requestFullscreen();
    } else if (e.webkitFullscreen) {
      e.target.webkitFullscreen();
    }
  } else {
    if (document.exitFullscreen) {
      document.exitFullscreen();
    } else if (document.webkitExitFullscreen) {
      document.webkitExitFullscreen();
    }
  }
}

const BasicScene = () => {
  return (
    <Canvas onDoubleClick={onFullScreenMode}>
      // ...
    <Canvas />
  )
}

I don't know if a FullScreen Component already exists like the OrbitControls or I can create a custom one in my case.

Thanks in advance 😃