# Ember action on select component crashing chrome debugger

**URL:** <https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532>\
**Category:** General\
**Created:** [February 18, 2020, 8:17pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532 "2020-02-18T20:17:41Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jamiu\_Adeleke](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamiu_adeleke/32/16556_2.png) [@Jamiu\_Adeleke](https://discuss.emberjs.com/u/Jamiu_Adeleke)\
**Post date:** [February 18, 2020, 8:17pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/1 "2020-02-18T20:17:41Z")

</div>

I am trying to use an action on a select component on Ember 3.15.

\<select id=“select” {{on “click” this.selected}}\> – Select One –

and in the component action: @action selected() { let x= 3; }

applying a break point in the action crashes chrome but works fine in firefox. with error Aww snap : "_Dev tools disconnected from page …"_

Same test with a button works fine.

Is this normal or am I doing something wrong? Is this Ember issue or Chrome issue? Updated to latest version of chrome today version: 80.0.3987.116 and issue persist

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [February 19, 2020, 3:45pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/2 "2020-02-19T15:45:26Z")

</div>

The first thing I would check is whether this still happens in a completely plain browser session with no extensions. I would be especially suspicious that this could be an issue in the ember inspector.

---

<div class="post-metadata">

**Author:** ![broerse](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/broerse/32/9497_2.png) [@broerse](https://discuss.emberjs.com/u/broerse)\
**Post date:** [February 20, 2020, 3:07am UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/3 "2020-02-20T03:07:21Z")

</div>

> [@Jamiu\_Adeleke](#):
>
> a select component on Ember 3.15.

Maybe it is just a typo for Angle Brackets component names should be `CapitalCase`.

---

<div class="post-metadata">

**Author:** ![Jamiu\_Adeleke](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamiu_adeleke/32/16556_2.png) [@Jamiu\_Adeleke](https://discuss.emberjs.com/u/Jamiu_Adeleke)\
**Post date:** [February 20, 2020, 5:22pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/4 "2020-02-20T17:22:50Z")

</div>

Thank you guys for your comments. Meanwhile the issue persists, I still cannot figure out why it is crashing in Chrome. A fresh install of Chrome without any addons also crashes.

I am using pure html select so I don’t think it should be CapitalCase. At least the linter would complain about that.

at the moment my template looks like this. ```

```
 <select id="{{q.sequence}}" class="form-control" {{on "change" (fn this.selected q)}}>
      <option value=""> Select One </option>
      {{#each q.answer_options as |answer|}}
        <option value={{answer}}>{{answer}}</option>
      {{/each}}
    </select>

```

```auto
and the action looks like this
@action
selected(question, event) {
 try {
   console.log("adass");
   event.preventDefault();
   // set(question, "answer", event.target.value)
   // this.eval_rules(question);
 } catch(e) {
   console.log(e);
 }
}

```

Sorry I wish this editor can format code. I am using something like this: [HTML select tag](https://www.w3schools.com/tags/tag_select.asp). i noticed this editor is removing some content from my code. Anyways, Ive tried everything removing all the variables and issue persist.

every thing works fine unless I put a break point in the action. then it crashes. If I dont apply a break point, then Chrome is fine.

Also in firefox, if I apply a break point, it works fine.

Using same action on a html button works fine as well. It is very strange, never seen anything like this before.

---

<div class="post-metadata">

**Author:** ![dknutsen](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dknutsen/32/16471_2.png) [@dknutsen](https://discuss.emberjs.com/u/dknutsen)\
**Post date:** [February 20, 2020, 6:00pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/5 "2020-02-20T18:00:58Z")

</div>

To format code in this editor try placing it between triple backticks ` like this:

````
```
your code here
```

````

As far as the crashing goes, that is very bizarre. What happens if you put in a console.log or a Chrome logpoint?

---

<div class="post-metadata">

**Author:** ![Jamiu\_Adeleke](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/jamiu_adeleke/32/16556_2.png) [@Jamiu\_Adeleke](https://discuss.emberjs.com/u/Jamiu_Adeleke)\
**Post date:** [February 20, 2020, 6:33pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/6 "2020-02-20T18:33:54Z")

</div>

Hi there, maybe I was not very clear, the code in the action is executed. The crash happens after the action is executed.

I can log things in the console without problem.

Thanks, Jamiu

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [February 20, 2020, 9:26pm UTC](https://discuss.emberjs.com/t/ember-action-on-select-component-crashing-chrome-debugger/17532/7 "2020-02-20T21:26:39Z")

</div>

This may be a real bug in Chrome devtools.
