From 9a4a8aa71a0ce5a255dfba533fec3ff885a7d708 Mon Sep 17 00:00:00 2001
From: WU Jun <quark@lihdd.net>
Date: Wed, 18 Dec 2013 09:06:45 +0800
Subject: [PATCH] Do not automatically select other options

For <select multiple />, `value` is an array and should not be
converted to a string.
---
 src/dom/components/ReactDOMSelect.js             | 16 ++++++++++++----
 .../components/__tests__/ReactDOMSelect-test.js  | 14 ++++++++++++++
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/dom/components/ReactDOMSelect.js b/src/dom/components/ReactDOMSelect.js
index 2a9a05a862..aaf18cf9df 100644
--- a/src/dom/components/ReactDOMSelect.js
+++ b/src/dom/components/ReactDOMSelect.js
@@ -59,13 +59,21 @@ function selectValueType(props, propName, componentName) {
  */
 function updateOptions() {
   /*jshint validthis:true */
+  var multiple = this.props.multiple;
   var propValue = this.getValue();
   var value = propValue != null ? propValue : this.state.value;
   var options = this.getDOMNode().options;
-  var selectedValue = '' + value;
-
-  for (var i = 0, l = options.length; i < l; i++) {
-    var selected = this.props.multiple ?
+  var selectedValue, i, l;
+  if (multiple) {
+    selectedValue = [];
+    for (i = 0, l = value.length; i < l; ++i) {
+      selectedValue.push('' + value[i]);
+    }
+  } else {
+    selectedValue = '' + value;
+  }
+  for (i = 0, l = options.length; i < l; i++) {
+    var selected = multiple ?
       selectedValue.indexOf(options[i].value) >= 0 :
       selected = options[i].value === selectedValue;
 
diff --git a/src/dom/components/__tests__/ReactDOMSelect-test.js b/src/dom/components/__tests__/ReactDOMSelect-test.js
index 6bbe58ca2a..ee4c9746ec 100644
--- a/src/dom/components/__tests__/ReactDOMSelect-test.js
+++ b/src/dom/components/__tests__/ReactDOMSelect-test.js
@@ -116,6 +116,20 @@ describe('ReactDOMSelect', function() {
     expect(node.options[2].selected).toBe(false);  // gorilla
   });
 
+  it('should not select other options automatically', function() {
+    var stub =
+      <select multiple={true} value={['12']}>
+        <option value="1">one</option>
+        <option value="2">two</option>
+        <option value="12">twelve</option>
+      </select>;
+    var node = renderSelect(stub);
+
+    expect(node.options[0].selected).toBe(false);  // one
+    expect(node.options[1].selected).toBe(false);  // two
+    expect(node.options[2].selected).toBe(true);  // twelve
+  });
+
   it('should allow setting `value` with `objectToString`', function() {
     var objectToString = {
       animal: "giraffe",