Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
portal communication
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body style="height: 200vh">
<h1>portal guest</h1>
<script>
portalHost.postMessage("foo");
portalHost.onmessage = (ev) => {
console.log("receive", ev);
};
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body>
<h1>portal test</h1>
<portal style="width: 500px; height: 500px; border: 1px solid black;" src="/" />
<script>
const p = document.querySelector("portal");
p.onmessage = (ev) => {
console.log("event from portal", ev);
p.postMessage("send from host")
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment