Do not trigger the change event for the same radio value

[mightyaleksey]

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

bug

What is the current behavior?

Selecting of the same value for the input[type=radio] twice in a row results in triggering of change event twice for the same value.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/84v837e9/).

Open http://jsfiddle.net/69z2wepo/80433/ and click twice on any option. As the result you'll see in console that change event is triggered each time (even if the changed value is equal to the previous one).

For comparison you may check the native html implementation: https://jsfiddle.net/hjfpsu2y/1/

What is the expected behavior?

The change event should not trigger again for the same value.

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

macOS Sierra 10.12.5, Safari 10.1.1

[gaearon]

cc @nhunzaker @aweary

[aweary]

Thanks for the report @sullenor. It looks like this works as expected with React 16. We'll look into this and see if we can include a fix in the 15.6 release.

[klavs]

If you extend the given example with 4 radio elements (see here), onChange fires only once per radio. In other words, the onChange event is not fired if a value for a name changes.

Might as well rename onChange to onFirstTimeChecked (screen grab) so it is clear when the callback is fired.

But it seems to be a different problem than what @sullenor is describing.

Tested on Google Chrome Version 59.0.3071.86 (Official Build) (64-bit).

[avivshafir]

Same as @klavs mentioned above, uncontrolled radio inputs in my project just stopped working as was expected, they stopped calling the onChange function if a radio button was checked before.

[gaearon]

@avivshafir

This particular issue was filed before 15.6 release so I don't think what you're describing is related to it.
Can you confirm your bug is the same as #9988?

[avivshafir]

@gaearon yes i think this particular issue is not related indeed.
I am almost certain the #9988 is the same bug
I have the example here:
https://codesandbox.io/embed/nZqp8xv2R
sorry about the confusion

[klavs]

Thanks to @avivshafir and comments in #9988 I managed to understand that my reported issue is only affecting uncontrolled radio inputs.

Here is a working example of controlled radios working as expected: http://jsfiddle.net/69z2wepo/81050/

[andreicek]

While @klavs solutions works, I would love to see this fixed in React 15.6 release. Any news on this, it's been a few months.

Thanks!

[aweary]

I'm unable to reproduce the issue @sullenor reported with the latest React 15 release: https://jsfiddle.net/q9cdkjhg/

The issue where it only fires a single change event per input seems to still be a problem, which we will investigate separately. Thanks!