honojs / honox

HonoX - Hono based meta framework
https://hono.dev
MIT License
1.41k stars 39 forks source link

Cursor on an input box gets kicked out with a specific condition #68

Closed wataruoguchi closed 7 months ago

wataruoguchi commented 7 months ago

What version of HonoX are you using?

0.1.3 / Hono: 4.0.3

What steps can reproduce the bug?

  1. Clone the repository: https://github.com/wataruoguchi/honox-repro and run npm install && npm run dev.
  2. Type multiple characters (e.g., "1111") on each input element.
  3. Your cursor gets kicked out on every key press with the third input element.

The UI

Screenshot 2024-02-16 at 2 33 10 PM

The issue occurs with a very specific condition.

  1. The input element has a corresponding label. (Please see hasLabel in the code)
  2. The corresponding state (str) is NOT rendered in a sibling element of the input element. (form.tsx vs form2.tsx)

What is the expected behavior?

The input cursor stays in the input element so that you can type more than one character at a time.

What do you see instead?

The input cursor gets kicked out, hence, you can only type one character at a time. You need to click on the input element every time you type in it.

Additional information

No response

usualoma commented 7 months ago

Hi @wataruoguchi

Thanks for the report!

I can't seem to open https://github.com/wataruoguchi/honox-repro, but I wonder if I could ask you to either make it public or give me an example here of the source code for the relevant section separately.

wataruoguchi commented 7 months ago

@usualoma Oops! I updated the visibility of the repository! Sorry about that!

usualoma commented 7 months ago

@wataruoguchi Thanks to you; we will be able to fix it!