Source Code:
(back to article)
Submit
Result:
Report an issue
<div id="container"></div> <script> const container = document.getElementById('container'); const shadow = container.attachShadow({ mode: 'open' }); const button = document.createElement('button'); button.textContent = 'Click me'; button.addEventListener('click', () => { const event = new CustomEvent('customEvent', { bubbles: true, composed: true }); button.dispatchEvent(event); }); shadow.appendChild(button); container.addEventListener('customEvent', () => { const composedInfo = document.createElement('p'); composedInfo.textContent = `Custom Event Triggered!`; shadow.appendChild(composedInfo); }); </script>