Skip to content

Commit d1ba51b

Browse files
jimfbzpao
authored andcommitted
Merge pull request #6442 from trevorsmith/master
Correctly select options when nested inside an optgroup (cherry picked from commit 5ac51c3)
1 parent 9d73b23 commit d1ba51b

File tree

2 files changed

+27
-2
lines changed

2 files changed

+27
-2
lines changed

src/renderers/dom/client/wrappers/ReactDOMOption.js

+10-2
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,16 @@ var ReactDOMOption = {
3333

3434
// Look up whether this option is 'selected'
3535
var selectValue = null;
36-
if (nativeParent != null && nativeParent._tag === 'select') {
37-
selectValue = ReactDOMSelect.getSelectValueContext(nativeParent);
36+
if (nativeParent != null) {
37+
var selectParent = nativeParent;
38+
39+
if (selectParent._tag === 'optgroup') {
40+
selectParent = selectParent._nativeParent;
41+
}
42+
43+
if (selectParent != null && selectParent._tag === 'select') {
44+
selectValue = ReactDOMSelect.getSelectValueContext(selectParent);
45+
}
3846
}
3947

4048
// If the value is null (e.g., no specified value or after initial mount)

src/renderers/dom/client/wrappers/__tests__/ReactDOMSelect-test.js

+17
Original file line numberDiff line numberDiff line change
@@ -537,4 +537,21 @@ describe('ReactDOMSelect', function() {
537537
"Cannot set property 'pendingUpdate' of null"
538538
);
539539
});
540+
541+
it('should select grandchild options nested inside an optgroup', function() {
542+
var stub =
543+
<select value="b" onChange={noop}>
544+
<optgroup label="group">
545+
<option value="a">a</option>
546+
<option value="b">b</option>
547+
<option value="c">c</option>
548+
</optgroup>
549+
</select>;
550+
var container = document.createElement('div');
551+
var node = ReactDOM.render(stub, container);
552+
553+
expect(node.options[0].selected).toBe(false); // a
554+
expect(node.options[1].selected).toBe(true); // b
555+
expect(node.options[2].selected).toBe(false); // c
556+
});
540557
});

0 commit comments

Comments
 (0)