Keydown event not firing when pressing enter inside a <textarea>


The keydown event doesn’t register when pressing Enter inside a textarea.

Steps to reproduce

  1. Have a dialog with a <textarea> in it (and have a JS reference to that text area as elem) – I won’t copy and paste all the boilerplate plugin creation code here, but I’ve reproduced it in a minimal example, meaning it should be the case with every dialog creation code out there
  2. Use the following code snippet:
    elem.addEventListener('keydown', evt => console.log(evt));
  3. Run the plugin, click on the textarea (to put it in focus) and hit Enter. Nothing will appear in the developer console (tested on XD, Windows 10)…

Expected Behavior

The event should trigger when pressing the Enter key, like in browsers. See a screenshot from Chrome as an example:

Actual Behavior

The event doesn’t trigger (fairly obvious by now :wink: )

Additional information

I’m trying to achieve the following behavior:

When the user presses Enter while holding Ctrl inside a textarea of my plugin’s dialog, the dialog should get submitted. Therefore, I require the event to also trigger when pressing Enter… I’ve had this working with simple <input> elements before, so it’s “exclusive” to the Enter key in a <textarea>.

@pklaschka Are you still seeing this problem in the latest release? I wasn’t able to replicate your error. Note that you will have to console.log(evt.key) to look at what key was pressed as evt object is not enumerable and will be logged as an empty {}.

1 Like

Sorry for the late answer – it’s working now. It “actually” didn’t work in an earlier version (it wasn’t just me doing a mistake – my old code base of it is working now and didn’t in an earlier version of XD :wink: )