- From: Jake Archibald <notifications@github.com>
- Date: Thu, 31 Oct 2024 03:44:06 -0700
- To: whatwg/dom <dom@noreply.github.com>
- Cc: Subscribed <subscribed@noreply.github.com>
- Message-ID: <whatwg/dom/issues/1320@github.com>
### What problem are you trying to solve? ```js const button = document.querySelector('button'); button.addEventListener('click', (event) => { // … }); ``` I want to add activation behavior to the above button, such as checking a custom checkbox. ### What solutions exist today? ```js const button = document.querySelector('button'); button.addEventListener('click', (event) => { if (event.defaultPrevented) return; checkCustomCheckbox(); }); ``` This isn't great because the default may be prevented by a listener further along the path. ```js const button = document.querySelector('button'); button.addEventListener('click', (event) => { setTimeout(() => { if (event.defaultPrevented) return; checkCustomCheckbox(); }, 0); }); ``` This isn't great because the effect may happen a frame later (`rAF` isn't a reliable solution here due to https://github.com/whatwg/html/issues/10113). It's also observably async: ```js button.click(); console.log(customCheckboxChecked); // expected true, but got false ``` ### How would you solve it? Something like: ```js const button = document.querySelector('button'); button.addEventListener('click', (event) => { event.addActivationCallback(() => { checkCustomCheckbox(); }); }); ``` ### Anything else? _No response_ -- Reply to this email directly or view it on GitHub: https://github.com/whatwg/dom/issues/1320 You are receiving this because you are subscribed to this thread. Message ID: <whatwg/dom/issues/1320@github.com>
Received on Thursday, 31 October 2024 10:44:10 UTC