Wrap radio and checkbox labels into span to enable styling. (rjsf-team#428)

* Wrap radio and checkbox labels into span to enable styling. * Wrap radio and checkbox labels into span to enable styling. Update test.

Author: wintercounter

src/components/widgets/CheckboxWidget.js

@@ -21,7 +21,7 @@ function CheckboxWidget({
  disabled={disabled}
  autoFocus={autofocus}
  onChange={(event) => onChange(event.target.checked)}/>
- <strong>{label}</strong>
+ <span>{label}</span>
  </label>
  </div>
  );

src/components/widgets/CheckboxesWidget.js

@@ -36,7 +36,7 @@ function CheckboxesWidget(props) {
  onChange(deselectValue(option.value, value));
  }
  }}/>
- {option.label}
+ <span>{option.label}</span>
  </span>
  );
  return inline ? (

src/components/widgets/RadioWidget.js

@@ -29,7 +29,7 @@ function RadioWidget({
  disabled={disabled}
  autoFocus={autofocus && i === 0}
  onChange={_ => onChange(option.value)}/>
- {option.label}
+ <span>{option.label}</span>
  </span>
  );
 

test/BooleanField_test.js

@@ -33,7 +33,7 @@ describe("BooleanField", () => {
  title: "foo"
  }});
 
- expect(node.querySelector(".field label strong").textContent)
+ expect(node.querySelector(".field label span").textContent)
  .eql("foo");
  });