Sp-button onclick does not work

In my dialog I have

<sp-button onclick="console.log(1)">Close</sp-button>

But clicking on it does absolutely nothing. Tried moving button up to the root <dialog> element, but no luck. Any ideas?

Wonder if this could be some bug, when dialog is created in JS and not in HTML :thinking:

    const dialog = document.createElement('DIALOG');
    dialog.innerHTML = dialogContents;
    document.body.appendChild(dialog);

    dialog.querySelector('sp-button').addEventListener('click', () => {
        dialog.close();
    });

Adding event listener like this, works perfectly fine :roll_eyes:

This is the intended pattern – inline event handlers are not supported.

1 Like