The DevJoy module provides functionality for handling full screen API.

Browser support

See: Element API: fullscreenchange event | Can I use

// Establish Phoenix Socket and LiveView configuration.
import { Socket } from "phoenix";
import { LiveSocket } from "phoenix_live_view";
import DevJoy from "dev_joy";

let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content");
let liveSocket = new LiveSocket("/live", Socket, {
  longPollFallbackMs: 2500,
  params: { _csrf_token: csrfToken },
});

// connect if there are any LiveViews on the page
liveSocket.connect();
DevJoy.init(liveSocket);

Adds event listeners to support full screen in DevJoy-based applications. Those listeners would communicate with the default implementation generated using DevJoy.Session.LiveView.