click.delegate bindings intermittently execute more than once in an Aurelia application
- Dominant language
- JavaScript
- Stars
- 110
- Forks
- 98
- PR merge metrics
- No merged PRs in 30d
Description
**I'm submitting a bug report**
* **Library Version:**
2.5.4
**Please tell us about your environment:**
* **Operating System:**
Windows 11 (same issue on Windows 10)
* **Node Version:**
v20.17.0
* **NPM Version:**
10.8.2
* **JSPM OR Webpack AND Version**
webpack 5.91.0
* **Browser:**
Chrome v128 (although this issue has existed on versions much earlier too, definitely as far back as v108 and extremely likely earlier than that).
* **Language:**
Typescript 5.4.5
**Current behavior:**
We have a front-end application built using Aurelia. We have some automated UI tests for it. Sometimes our UI tests will fail. We added much more in-depth logging and found that it was because buttons that had the `click.delegate` binding on it were executing the handler more than once when they were clicked. So our test was clicking the element once, but the handler was running more than once.
When we changed those handlers to use click.trigger, we could no longer reproduce it.
We have also seen this behaviour in our production application, where users who we believe to be normal users (as we looked at their analytics sessions and didn't see any bot like behaviour) were submitting forms multiple times in extremely quick succession, impossibly quick for a user.
**Expected/desired behavior:**
When click.delegate is used, the handler should be called only once. (Most of the time this is the case, but as I mentioned there see to be cases where it is not).
* **What is the expected behavior?**
To only call the click handler once.
* **What is the motivation / use case for changing the behavior?**
I suspect that this is a bug in Aurelia, as changing the binding from delegate to click seems to solve the problem.
I could not replicate this using a simple gist (1 App viewmodel, no routing) but I have a repository with tests that fail quite reliably when run multiple times.
I'm looking forward to hearing your thoughts and trying anything that you'd like me to try.
The application is 4 years old and this issue has existed for pretty much as far back as I can remember. I also remember seeing this issue whilst working on another Aurelia application as far back as 2016.
Contributor guide
Research direction
Start by running the reporter's failing test repository repeatedly and compare the click.delegate case with click.trigger; the payload does not name a source file or test path. Done means reproducing the intermittent duplicate handler invocation, identifying its cause, and ensuring one click.delegate event calls its handler only once.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, node.js, typescript, webpack
- Domain
- frontend, testing
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100