Repository: react-materialize/react-materialize
Pull request #883 (2019-07-01 18:52:43)

Fix radio group checked prop
# Description

Changed RadioGroup component. Replaced the `defaultChecked` property of inputs with the `checked` property. RadioGroup component was not properly re-rendering when sent a bad value such as `null` (further explained in testing section).

For some context on usage: 
https://www.w3schools.com/jsref/prop_checkbox_defaultchecked.asp
https://www.w3schools.com/tags/att_input_checked.asp

Should solve RadioGroup issues such as https://github.com/react-materialize/react-materialize/issues/882 . 

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

# How Has This Been Tested?

1. Set a RadioGroup's value to a valid value, such as 4 on a 1-5 scale.
2. Set the RadioGroup's value to any non-valid value, such as `null`.
3. RadioGroup will not update and it will not unselect the input. 

After changing the property passed to inputs from `defaultChecked` to `checked`, the inputs will only remain checked while the RadioGroup's value matches the input's value.

Ran `npm run test:unit -- -u` and then `npm run test`. All tests passing.

# Checklist:

- [x] I have commented my code, particularly in hard-to-understand areas
- [x] My changes generate no new warnings
- [x] I have not generated a new package version. (the maintainers will handle that)



Patch:
diff --git a/src/RadioGroup.js b/src/RadioGroup.js
index 92084f9..11e999c 100644
--- a/src/RadioGroup.js
+++ b/src/RadioGroup.js
@@ -23,7 +23,7 @@ const RadioGroup = ({
             id={`radio${idx}`}
             value={radioItem.value}
             type="radio"
-            defaultChecked={radioItem.value === value}
+            checked={radioItem.value === value}
             name={name}
             onChange={onChange}
             disabled={disabled}


Test patch:
diff --git a/test/__snapshots__/RadioGroup.spec.js.snap b/test/__snapshots__/RadioGroup.spec.js.snap
index 01da649..01445e5 100644
--- a/test/__snapshots__/RadioGroup.spec.js.snap
+++ b/test/__snapshots__/RadioGroup.spec.js.snap
@@ -7,8 +7,8 @@ exports[`<RadioGroup /> disabled 1`] = `
     key="radio0"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       disabled={true}
       id="radio0"
       name="size"
@@ -25,8 +25,8 @@ exports[`<RadioGroup /> disabled 1`] = `
     key="radio1"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       disabled={true}
       id="radio1"
       name="size"
@@ -43,8 +43,8 @@ exports[`<RadioGroup /> disabled 1`] = `
     key="radio2"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       disabled={true}
       id="radio2"
       name="size"
@@ -66,8 +66,8 @@ exports[`<RadioGroup /> renders 1`] = `
     key="radio0"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio0"
       name="size"
       onChange={[MockFunction]}
@@ -83,8 +83,8 @@ exports[`<RadioGroup /> renders 1`] = `
     key="radio1"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio1"
       name="size"
       onChange={[MockFunction]}
@@ -100,8 +100,8 @@ exports[`<RadioGroup /> renders 1`] = `
     key="radio2"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio2"
       name="size"
       onChange={[MockFunction]}
@@ -123,8 +123,8 @@ exports[`<RadioGroup /> with classnames 1`] = `
     key="radio0"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio0"
       name="size"
       onChange={[MockFunction]}
@@ -141,8 +141,8 @@ exports[`<RadioGroup /> with classnames 1`] = `
     key="radio1"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio1"
       name="size"
       onChange={[MockFunction]}
@@ -159,8 +159,8 @@ exports[`<RadioGroup /> with classnames 1`] = `
     key="radio2"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio2"
       name="size"
       onChange={[MockFunction]}
@@ -181,8 +181,8 @@ exports[`<RadioGroup /> with gap 1`] = `
     key="radio0"
   >
     <input
+      checked={false}
       className="with-gap"
-      defaultChecked={false}
       id="radio0"
       name="size"
       onChange={[MockFunction]}
@@ -198,8 +198,8 @@ exports[`<RadioGroup /> with gap 1`] = `
     key="radio1"
   >
     <input
+      checked={false}
       className="with-gap"
-      defaultChecked={false}
       id="radio1"
       name="size"
       onChange={[MockFunction]}
@@ -215,8 +215,8 @@ exports[`<RadioGroup /> with gap 1`] = `
     key="radio2"
   >
     <input
+      checked={false}
       className="with-gap"
-      defaultChecked={false}
       id="radio2"
       name="size"
       onChange={[MockFunction]}
@@ -237,8 +237,8 @@ exports[`<RadioGroup /> with predefined value 1`] = `
     key="radio0"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio0"
       name="size"
       onChange={[MockFunction]}
@@ -254,8 +254,8 @@ exports[`<RadioGroup /> with predefined value 1`] = `
     key="radio1"
   >
     <input
+      checked={true}
       className=""
-      defaultChecked={true}
       id="radio1"
       name="size"
       onChange={[MockFunction]}
@@ -271,8 +271,8 @@ exports[`<RadioGroup /> with predefined value 1`] = `
     key="radio2"
   >
     <input
+      checked={false}
       className=""
-      defaultChecked={false}
       id="radio2"
       name="size"
       onChange={[MockFunction]}