hodgef/react-simple-keyboard

Cannot read properties of undefined (reading 'length') when clearing input

sophielevens opened this issue · 2 comments

sophielevens commented

React-simple-keyboard version
Version 3.4.191

Describe the bug
When backspace is pressed I get an error that says Cannot read properties of undefined (reading 'length'). I can see that the error comes from react-simple-keyboard's node modules so wanted to ask if you know what's causing it?

It might be that i am setting the inputs incorrectly when backspace is pressed, but I'd really appreciate if you could take a look 👀

Code sandbox here - please note that the styles aren't working on the sandbox (not sure why).

Many thanks for the upkeep of this repo 💪
Screenshots
If applicable, add screenshots to help explain your problem.
image

Screen.Recording.2022-08-25.at.15.45.17.mov
hodgef commented

Hey @sophielevens, yes this is definitely caused by the logic in the onKeyPress, because if you comment that out the error is gone.

This is the best I could do to fix it with the time I had:
https://codesandbox.io/s/busy-keller-3lymw6?file=/src/keyboard.tsx

It's still not the best but I'm sure you can take it from there.

Some tips:

  • use debug={true} & console.log the keyboard properties such as keyboard.current.input and keyboard.current.options.inputName.
  • simple-keyboard keeps it's own internal state, so make sure to compare it with your local state (this goes with the previous comment).

Cheers,
Francisco Hodge

  • 👍1
sophielevens commented

@hodgef thanks so much for your speedy reply and taking a look 🙏

  • 🎉1