Fix for empty <select> elements with value
There is an exception when value or defaultValue is set but there are no children as ReactDOMSelect tries to mark the first children as selected even if there are no children.
Vitaly Kramskikh committed
Mar 13, 2015 at 21:42 UTC
2f52d818657a7bd5d3a4373251a5f71b957e4498
2 files changed
+19
-1
src/browser/ui/dom/components/ReactDOMSelect.js
+3
-1
@@ -89,7 +89,9 @@ function updateOptions(component, propValue) {
89
return;
90
}
91
}
92
- options[0].selected = true;
92
+ if (options.length) {
93
+ options[0].selected = true;
94
+ }
95
}
96
}
97
src/browser/ui/dom/components/__tests__/ReactDOMSelect-test.js
+16
@@ -43,6 +43,14 @@ describe('ReactDOMSelect', function() {
43
expect(node.value).toEqual('giraffe');
44
});
45
46
+ it('should not throw with `defaultValue` and without children', function() {
47
+ var stub = <select defaultValue="dummy"></select>;
48
+
49
+ expect(() => {
50
+ ReactTestUtils.renderIntoDocument(stub);
51
+ }).not.toThrow();
52
+ });
53
+
54
it('should not control when using `defaultValue`', function() {
55
var stub =
56
<select defaultValue="giraffe">
@@ -100,6 +108,14 @@ describe('ReactDOMSelect', function() {
108
expect(node.value).toEqual('gorilla');
109
});
110
111
+ it('should not throw with `value` and without children', function() {
112
+ var stub = <select value="dummy"></select>;
113
+
114
+ expect(() => {
115
+ ReactTestUtils.renderIntoDocument(stub);
116
+ }).not.toThrow();
117
+ });
118
+
119
it('should allow setting `value` with multiple', function() {
120
var stub =
121
<select multiple={true} value={['giraffe', 'gorilla']}>