Text input loses focus after every character

Help
#1

I have a Halogen app in production and I’ve received a bug report saying:

When editing a profile the text input loses focus after every character, meaning you have type one character, click on the input to regain focus, then type another character, and so on.

This is the second time I’ve received this bug report. However, I’m unable to reproduce it. I tried googling around and people seem to be having a similar issue in React when the input is rerendered on every character input, but I haven’t encountered this behavior in my Halogen app on any combination of browsers, devices and operating system that I’ve tested it on. People that experienced the bug weren’t running anything weird: one was on Safari on a Mac, one was on the newest Chrome version on Windows 10.

Has anyone else experienced this loss of focus when working on a Halogen app for whatever reason?

2 Likes
#2

Halogen-vdom purposefully does not touch the value of an input if it is equal to what you are trying to set it to (as long as you are using an actual input element, and not some custom element or something). Maybe they have browser extensions messing with something, or there’s some external script that’s messing with input elements?

3 Likes
#3

I had a similar issue when using 1password. Can’t remember the details right now.

2 Likes
#4

The plot thickens! You were onto something regarding browser extensions. I’ve managed to reproduce it in Chrome with Grammarly installed. However, I can only reproduce it on some pages, even though I’m using the same components in them!

Here’s a short video that demonstrates what this looks like in practice for anyone interested: https://streamable.com/32bhl4

All the form elements are part of the same component which is used on two different pages. The only odd thing about the malfunctioning case is that the form is inside a parent component which again is inside a modal component, which I believe is called a higher-order component. I have no idea though if that can have any influence on such behavior.

4 Likes