Stop writing click handlers for UI

Stop writing click handlers for UI
February 13, 2026 | Read time: 3 minutes
Sponsor this newsletter to reach 9,000+ active developers

Hey everyone,

We’ve spent years writing the same “glue code” just to open a dialog or a popover.

                            
// The old way (Every. Single. Time.)
const btn = document.querySelector('#open-btn');
const dialog = document.querySelector('#my-dialog');

btn.addEventListener('click', () => {
  dialog.showModal();
});

Starting in 2025/2026, we have a native, declarative way to do this using Invokers. No JavaScript required for the toggle.

The Modern Way: commandfor and command

By using the commandfor attribute on a button, you can point directly to an interactive element (like a <dialog> or a popover) and tell it what to do.

                            
<button commandfor="my-dialog" command="show-modal">
  Open Dialog
</button>

<dialog id="my-dialog">
  <p>Look, Ma! No JS click handler.</p>
  <button commandfor="my-dialog" command="close">Close</button>
</dialog>

Why this is a win:

  • Zero JS: You don’t need to wait for the DOM to load or manage event listeners.
  • Built-in Accessibility: The browser automatically handles the relationship between the trigger and the target.
  • Custom Commands: You can even create custom commands in JS using the command event if you need logic beyond just “open/close.”

Browser Support:

This feature is part of Baseline 2025 and works in the latest versions of Chrome, Edge, Safari, and Firefox.

Happy coding!

P.S. I’ve officially opened up a few spots for 1-on-1 consultations! Since you’re on my list, you can use [this link] to grab a spot at 50% off. I’m only offering 10 at this price, so move fast if you’re interested.