Live client-side-only demo site (playground)

[weizman]

visit example.com, open devtools, paste and run - demo works

<script>
const iframe = `
    
    <script> window.exports={} </script>
    <script async onload='onload1()' src='https://cdn.jsdelivr.net/npm/bidc'></script>
    <script>
        async function onload1(){
        const { receive } = createChannel()

        // Handle incoming messages and return a response
        receive(payload => {
          return payload.value.toUpperCase()
        })
        }
    </script>
`;
document.write(`
    <script> window.exports={} </script>
    <script async onload="onload1()" src="https://cdn.jsdelivr.net/npm/bidc"></script>
    <script>
        async function onload1(){
        debugger;
        // Connect to an iframe
        const { send } = createChannel(xxx.contentWindow)
        
        // Send a simple message to the iframe
        const result = await send({ value: 'Hello, iframe!' })
        
        console.assert(result === 'HELLO, IFRAME!')
        }
    </script>
    <iframe id="xxx" srcdoc="${iframe}"></iframe>
`)
</script>

Such an html file in the project, set up GitHub pages, and you get a playground for playing with this without having to load/install anything locally, could be useful