Error occurs on typing in a selected input field

This issue has been tracked since 2022-04-28.

Simple-keyboard version
Using CDN script src="[email protected]/build/index.js"

Describe the bug
If I type keys without selecting the field, everything works fine. However, once I select an input field - any typed keys are no longer entered into field. Instead an (index):133 Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '#' is not a valid selector error occurs. Please see shared screencast below.


hodgef wrote this answer on 2022-04-29

Hey @arnoldtonderaimarunda,

I don't think I have this selector anywhere in simple-keyboard's code. In my view this is likely an issue in your app's code. Can you share a sandbox or test git repository so I can run the code that's giving you this error?

Will reopen once I get that. Thanks!
Francisco Hodge

arnoldtonderaimarunda wrote this answer on 2022-04-29

Hi @hodgef
Thanks for following up this issue. Below is link to sandbox with code.

hodgef wrote this answer on 2022-04-29

Thanks for the sandbox @arnoldtonderaimarunda. Your issue is in this part of the code:

function onInputFocus(event) {
    selectedInput = `#${}`;

As you can see selectedInput is set with the id of the selected input. But your input element does not have an id:

<input class="input" name="code" placeholder="Card code" required="required" type="password">

You can debug these issues in Chrome Dev tools. By clicking in the source link it takes you straight to the problematic line:


Francisco Hodge

More Details About Repo
Owner Name hodgef
Repo Name simple-keyboard
Full Name hodgef/simple-keyboard
Language JavaScript
Created Date 2018-03-02
Updated Date 2022-12-02
Star Count 1737
Watcher Count 20
Fork Count 130
Issue Count 0


Issue Title Created Date Updated Date