demo · v140
Kiosk Builder
The Controlled Frame chromestatus entry calls out kiosk deployment as a flagship use case. Configure a locked-down kiosk shell — fixed URL, navigation guard, JS injection — and see the <controlledframe> declaration it would emit. Real frame embed falls back to a vanilla iframe outside an IWA.
Only inside an Isolated Web App
The real <controlledframe> element is only constructible inside an IWA shipped with the controlled-frame permission. To install an IWA: enable chrome://flags/#enable-isolated-web-apps and use chrome://web-app-internals. This page renders the configuration and a normal iframe preview.
about:blank
partition: —
Event tap (real Controlled Frame would emit these):
—
Generated <controlledframe> declaration:
<!-- press Apply -->
// Inside an Isolated Web App, this is the real thing:
const frame = document.createElement("controlledframe");
frame.src = "https://example.com/";
frame.setAttribute("partition", "persist:menu-board-001");
frame.addEventListener("loadstop", () => console.log("kiosk loaded"));
frame.addEventListener("permissionrequest", (e) => e.deny());
// Lock navigation
frame.addEventListener("newwindow", (e) => e.preventDefault());
frame.request.onBeforeRequest.addListener(
(details) => ({ cancel: details.url !== frame.src }),
{ urls: ["<all_urls>"] }
);
document.body.appendChild(frame);