onFocus and onBlur events on input elements cause issues

[iam-peekay]

Do you want to request a feature or report a bug?
bug

What is the current behavior?
When I use onFocus or onBlur events on an <input> element in my React app, if in theonBlur or onFocus event handler I set the input's value to an empty string, I get:

TypeError·TypeError: property "value" is non-configurable and can't be delete OR
TypeError·Uncaught TypeError: Cannot delete property 'value' of #<HTMLInputElement>

Looking at the stack trace, it's because it is trying to delete the value and detach the onPropertyChange handler when onFocus or onBlur is called:

attachEvent("onpropertychange",d):A.addEventListener("propertychange",d,!1)}function f(){A&&(delete A.value,A.detachEvent?A.detachEvent("onpropertychange",d):A.removeEventListener("propertychange",d,!

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

react 15.1
All browsers

I frankly am not able to reproduce this locally on any browser, but we're seeing this error happen 1000s of times in our bug tracking system. I know this is probably not very helpful but I figured I can at least see if anyone else has run into this. Happy to close this issue if you feel there's not enough information.

[jamesblight]

You'll have to at least show an example of how you are setting the input's value to an empty string.
Here is an example. https://jsbin.com/cofutokaye/edit?html,js,console,output

You should probably move this to Stack Overflow. However, you will still need to show an example.

Are you using a wrapper around a HTML input or not? Is it a controlled or uncontrolled input?

Are you sure detachEvent for onpropertychange is being called? Or is removeEventListener called for propertychange? If detachEvent is being called then it's probably an Internet Explorer issue as onpropertychange is only supported by legacy IE browsers.
https://msdn.microsoft.com/en-us/library/ms536956%28v=vs.85%29.aspx?f=255&MSPPError=-2147217396

[komlev]

@jamesblight
@iam-peekay
The error is there: Nexus 7, Nexus 9 devices has this problems on latest chrome 49.
Error appears when you are focusing or unfocusing input field.
The following error appears:
"Uncaught TypeError: Cannot delete property 'value' of # < HTMLInputElement > "
Code is here: https://jsbin.com/mabulegoye/1/edit?html,js,console,output

Error appears in function "stopWatchingForValueChange"
"delete activeElement.value" tries to remove value attribute from dom input element

[komlev]

Turns out in my case one of the analytics libraries has clash with react and this issue appears.
@iam-peekay are you using any analytics library?

[iam-peekay]

Analytics companies? I'm using new relic and bugsnag.

On Friday, August 5, 2016, Komlev notifications@github.com wrote:

Turns out in my case one of the analytics libraries has clash with react
and this issue appears.
@iam-peekay https://github.com/iam-peekay are you using any analytics
library?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#7421 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AFK4iqL-FYNVKax-soRCBOkCfyYJttHgks5qc1XNgaJpZM4JcQq3
.

Preethi Kasireddy
201-895-9299
Twitter https://twitter.com/iam_preethi
LinkedIn https://www.linkedin.com/pub/preethi-kasireddy/28/835/413
Github https://github.com/iam-peekay
Facebook https://www.facebook.com/preethikasireddy

[j0lvera]

As @komlev says, we had the same issue and it was an analytics/tracking library.

[iam-peekay]

Good to know. thank you!