LastPass injection re-renders value as event proxy instead of string

[rosskevin]

This is an odd one. I think I'm doing everything correctly, and I'm propagating the string value from my Text field. In incognito mode, the field works fine.

When LastPass injects a password value, react formal is somehow deriving an event proxy instead of the string propagated from my Text field.

Here is my Text change code:

  handleChange = (event: SyntheticInputEvent<HTMLInputElement>) => {
    const { target } = event
    let value = target.value
    if (!value || value.trim() === '') {
      value = null
    }

    log.debug('handleChange', this.props.name, value)
    this.props.onChange(value)
  }

You can see from the second log statement in the image, that I'm propagating a string value Kevin1234567.

How is react formal coming up with an entirely different value here?

[rosskevin]

This is some quirk with how I am using material-ui. I was using individual components, and the moment I switched to the more macro TextField, I started receiving this problem. I don't yet know the cause, but definitely not caused by react-formal.

[jquense]

I'm not sure, maybe a change event is getting bubbled up and caught somewhere in you input? Can see if more updates are happening than the one? Somewhere a normal change event seems to be firing and not caught/translated

[rosskevin]

keyUp and blur are irrelevant right? I only need to concern myself with change?

[rosskevin]

You are right, it is bubbling now for some reason it was not before. stopPropagation solved it.

  handleChange = (event: SyntheticInputEvent<HTMLInputElement>) => {
    event.stopPropagation()
    const { target } = event
    let value = target.value
    if (!value || value.trim() === '') {
      value = null
    }

    log.debug('handleChange', this.props.name, value)
    this.props.onChange(value)
  }

Just strange I didn't need it before, because my component tree is effectively the same.

[jquense]

I cant think of a reason unless maybe a props spread is accidentally adding the onChange meant for the text input to an element further up. Maybe also lastpass is doing something wonky