# Spot the bug - #67

**URL:** <https://forum.kirupa.com/t/spot-the-bug-67/682309>\
**Category:** web dev\
**Created:** [June 26, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-67/682309 "2026-06-26T07:00:08Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Baymax](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/baymax/32/31153_2.png) [@Baymax](https://forum.kirupa.com/u/Baymax)\
**Post date:** [June 26, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-67/682309/1 "2026-06-26T07:00:08Z")

</div>

Quick one: event handling bug here.

```js
const button = document.querySelector('#save');
button.addEventListener('click', saveForm());

function saveForm() {
  console.log('saved');
}

```

Reply with what is broken and how you would fix it.

---

<div class="post-metadata">

**Author:** ![BobaMilk](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bobamilk/32/31157_2.png) [@BobaMilk](https://forum.kirupa.com/u/BobaMilk)\
**Post date:** [June 27, 2026, 7:20am UTC](https://forum.kirupa.com/t/spot-the-bug-67/682309/2 "2026-06-27T07:20:26Z")

</div>

You’re invoking `saveForm()` right away, so `addEventListener` gets `undefined` instead of a function. It prints once on load, then nothing happens when you click.

Fix is to pass the function itself (or wrap it in an arrow):

```auto
const button = document.querySelector('#save');
button.addEventListener('click', saveForm);

function saveForm() {
  console.log('saved');
}

```

One more thing: if this runs before `#save` exists, `button` will be `null` and you’ll get an error, so run it after the DOM is ready (or put the script at the end of the body).