From f990698aaaa848225f6ba5f5b3f3f97e33623019 Mon Sep 17 00:00:00 2001
From: Jakub Suder <jakub.suder@gmail.com>
Date: Wed, 14 Oct 2009 15:16:02 +0200
Subject: [PATCH] fixed some issues with selects and options, updated tests

<select>'s type is "select-one" by default
<select> should return selected <option>'s value as its value
(un)selecting <option> should update its <select> and other <option>s
---
 dist/env.js                 |   51 ++++++++++++++++++++++++++++++++-----------
 dist/env.rhino.js           |   51 ++++++++++++++++++++++++++++++++-----------
 src/html/option.js          |   26 ++++++++++++++++++++-
 src/html/select.js          |   23 +++++++++++--------
 test/index.html             |   12 +++++++++-
 test/unit/elementmembers.js |   31 ++++++++++++++++++++++++++
 6 files changed, 155 insertions(+), 39 deletions(-)

diff --git a/dist/env.js b/dist/env.js
index 032786c..341da57 100644
--- a/dist/env.js
+++ b/dist/env.js
@@ -6763,9 +6763,31 @@ __extend__(HTMLOptionElement.prototype, {
         return (this.getAttribute('selected')=='selected');
     },
     set selected(value){
-        if(this.defaultSelected===null&&this.selected!==null)
+        if (this.defaultSelected === null && this.selected !== null) {
             this.defaultSelected = this.selected;
-        this.setAttribute('selected', (value ? 'selected' :''));
+        }
+        var selectedValue = (value ? 'selected' : '');
+        if (this.getAttribute('selected') == selectedValue) {
+            // prevent inifinite loops (option's selected modifies select's value which modifies option's selected)
+            return;
+        }
+        this.setAttribute('selected', selectedValue);
+        if (value) {
+            // set select's value to this option's value (this also unselects previously selected value)
+            this.parentNode.value = this.value;
+        } else {
+            // if no other option is selected, select the first option in the select
+            var i, anythingSelected;
+            for (i=0; i<this.parentNode.options.length; i++) {
+                if (this.parentNode.options[i].selected) {
+                    anythingSelected = true;
+                    break;
+                }
+            }
+            if (!anythingSelected) {
+                this.parentNode.value = this.parentNode.options[0].value;
+            }
+        }
     },
     get value(){
         return ((this.getAttribute('value') === undefined) || (this.getAttribute('value') === null)) ?
@@ -6898,7 +6920,7 @@ var HTMLSelectElement = function(ownerDocument) {
 HTMLSelectElement.prototype = new HTMLElement;
 __extend__(HTMLSelectElement.prototype, {
     get type(){
-        return this.getAttribute('type');
+        return this.getAttribute('type') || 'select-one';
     },
     get selectedIndex(){
         var options = this.options;
@@ -6909,17 +6931,20 @@ __extend__(HTMLSelectElement.prototype, {
         };
         return -1;
     },
-    set selectedIndex(value){
-        if (this.selectedIndex != -1) {
-            this.options[this.selectedIndex].selected = '';
-        }
-        var option = this.options[Number(value)];
-        if (option) {
-            option.selected = 'selected';
+    set selectedIndex(value) {
+        var i;
+        for (i=0; i<this.options.length; i++) {
+            this.options[i].selected = (i == Number(value));
         }
     },
-    get value(){
-        return this.getAttribute('value')||'';
+    get value() {
+        var value = this.getAttribute('value');
+        if (value === undefined || value === null) {
+            var index = this.selectedIndex;
+            return (index != -1) ? this.options[index].value : "";
+        } else {
+            return value;
+        }
     },
     set value(value) {
         var options = this.options,
@@ -8520,7 +8545,7 @@ XMLHttpRequest.prototype = {
                                     $debug("parsing response text into xml document");
                                     responseXML = $domparser.parseFromString(_this.responseText+"");
                                     return responseXML;
-                                } catch(e) { 
+                                } catch(e) {
                                     $error('response XML does not apear to be well formed xml', e);
                                     responseXML = $domparser.parseFromString("<html>"+
                                         "<head/><body><p> parse error </p></body></html>");
diff --git a/dist/env.rhino.js b/dist/env.rhino.js
index 22f6c98..d788c7b 100644
--- a/dist/env.rhino.js
+++ b/dist/env.rhino.js
@@ -7401,9 +7401,31 @@ __extend__(HTMLOptionElement.prototype, {
         return (this.getAttribute('selected')=='selected');
     },
     set selected(value){
-        if(this.defaultSelected===null&&this.selected!==null)
+        if (this.defaultSelected === null && this.selected !== null) {
             this.defaultSelected = this.selected;
-        this.setAttribute('selected', (value ? 'selected' :''));
+        }
+        var selectedValue = (value ? 'selected' : '');
+        if (this.getAttribute('selected') == selectedValue) {
+            // prevent inifinite loops (option's selected modifies select's value which modifies option's selected)
+            return;
+        }
+        this.setAttribute('selected', selectedValue);
+        if (value) {
+            // set select's value to this option's value (this also unselects previously selected value)
+            this.parentNode.value = this.value;
+        } else {
+            // if no other option is selected, select the first option in the select
+            var i, anythingSelected;
+            for (i=0; i<this.parentNode.options.length; i++) {
+                if (this.parentNode.options[i].selected) {
+                    anythingSelected = true;
+                    break;
+                }
+            }
+            if (!anythingSelected) {
+                this.parentNode.value = this.parentNode.options[0].value;
+            }
+        }
     },
     get value(){
         return ((this.getAttribute('value') === undefined) || (this.getAttribute('value') === null)) ?
@@ -7536,7 +7558,7 @@ var HTMLSelectElement = function(ownerDocument) {
 HTMLSelectElement.prototype = new HTMLElement;
 __extend__(HTMLSelectElement.prototype, {
     get type(){
-        return this.getAttribute('type');
+        return this.getAttribute('type') || 'select-one';
     },
     get selectedIndex(){
         var options = this.options;
@@ -7547,17 +7569,20 @@ __extend__(HTMLSelectElement.prototype, {
         };
         return -1;
     },
-    set selectedIndex(value){
-        if (this.selectedIndex != -1) {
-            this.options[this.selectedIndex].selected = '';
-        }
-        var option = this.options[Number(value)];
-        if (option) {
-            option.selected = 'selected';
+    set selectedIndex(value) {
+        var i;
+        for (i=0; i<this.options.length; i++) {
+            this.options[i].selected = (i == Number(value));
         }
     },
-    get value(){
-        return this.getAttribute('value')||'';
+    get value() {
+        var value = this.getAttribute('value');
+        if (value === undefined || value === null) {
+            var index = this.selectedIndex;
+            return (index != -1) ? this.options[index].value : "";
+        } else {
+            return value;
+        }
     },
     set value(value) {
         var options = this.options,
@@ -9158,7 +9183,7 @@ XMLHttpRequest.prototype = {
                                     $debug("parsing response text into xml document");
                                     responseXML = $domparser.parseFromString(_this.responseText+"");
                                     return responseXML;
-                                } catch(e) { 
+                                } catch(e) {
                                     $error('response XML does not apear to be well formed xml', e);
                                     responseXML = $domparser.parseFromString("<html>"+
                                         "<head/><body><p> parse error </p></body></html>");
diff --git a/src/html/option.js b/src/html/option.js
index 21a9dfa..4c97f45 100644
--- a/src/html/option.js
+++ b/src/html/option.js
@@ -50,9 +50,31 @@ __extend__(HTMLOptionElement.prototype, {
         return (this.getAttribute('selected')=='selected');
     },
     set selected(value){
-        if(this.defaultSelected===null&&this.selected!==null)
+        if (this.defaultSelected === null && this.selected !== null) {
             this.defaultSelected = this.selected;
-        this.setAttribute('selected', (value ? 'selected' :''));
+        }
+        var selectedValue = (value ? 'selected' : '');
+        if (this.getAttribute('selected') == selectedValue) {
+            // prevent inifinite loops (option's selected modifies select's value which modifies option's selected)
+            return;
+        }
+        this.setAttribute('selected', selectedValue);
+        if (value) {
+            // set select's value to this option's value (this also unselects previously selected value)
+            this.parentNode.value = this.value;
+        } else {
+            // if no other option is selected, select the first option in the select
+            var i, anythingSelected;
+            for (i=0; i<this.parentNode.options.length; i++) {
+                if (this.parentNode.options[i].selected) {
+                    anythingSelected = true;
+                    break;
+                }
+            }
+            if (!anythingSelected) {
+                this.parentNode.value = this.parentNode.options[0].value;
+            }
+        }
     },
     get value(){
         return ((this.getAttribute('value') === undefined) || (this.getAttribute('value') === null)) ?
diff --git a/src/html/select.js b/src/html/select.js
index 9f5b841..a004cf4 100644
--- a/src/html/select.js
+++ b/src/html/select.js
@@ -11,7 +11,7 @@ var HTMLSelectElement = function(ownerDocument) {
 HTMLSelectElement.prototype = new HTMLElement;
 __extend__(HTMLSelectElement.prototype, {
     get type(){
-        return this.getAttribute('type');
+        return this.getAttribute('type') || 'select-one';
     },
     get selectedIndex(){
         var options = this.options;
@@ -22,17 +22,20 @@ __extend__(HTMLSelectElement.prototype, {
         };
         return -1;
     },
-    set selectedIndex(value){
-        if (this.selectedIndex != -1) {
-            this.options[this.selectedIndex].selected = '';
-        }
-        var option = this.options[Number(value)];
-        if (option) {
-            option.selected = 'selected';
+    set selectedIndex(value) {
+        var i;
+        for (i=0; i<this.options.length; i++) {
+            this.options[i].selected = (i == Number(value));
         }
     },
-    get value(){
-        return this.getAttribute('value')||'';
+    get value() {
+        var value = this.getAttribute('value');
+        if (value === undefined || value === null) {
+            var index = this.selectedIndex;
+            return (index != -1) ? this.options[index].value : "";
+        } else {
+            return value;
+        }
     },
     set value(value) {
         var options = this.options,
diff --git a/test/index.html b/test/index.html
index 3a86da7..cab3db2 100644
--- a/test/index.html
+++ b/test/index.html
@@ -181,7 +181,17 @@
 				<option id="option3c" selected="selected" value="2">2</option>
 				<option id="option3d" value="3">3</option>
 			</select>
-			
+
+      <select id="test_value">
+        <option value="optionvalue" selected="selected">optiontext</option>
+      </select>
+
+      <select id="test_selecting">
+        <option value="0">option0</option>
+        <option value="1" selected="selected">option1</option>
+        <option value="2">option2</option>
+      </select>
+
 			<object id="object1" codebase="stupid">
 				<param name="p1" value="x1" />
 				<param name="p2" value="x2" />
diff --git a/test/unit/elementmembers.js b/test/unit/elementmembers.js
index 60247dc..7d25fee 100644
--- a/test/unit/elementmembers.js
+++ b/test/unit/elementmembers.js
@@ -27,3 +27,34 @@ test("attributes common to all HTML elements", function() {
     }catch(e){print(e);}
 });
 
+test("select element", function() {
+    expect(14);
+
+    var select = document.getElementById('select1');
+    equals("select-one", select.type, "Select field's type is select-one by default");
+
+    select = document.getElementById('test_value');
+    equals("optionvalue", select.value, "Select field returns its selected option's value as its value");
+
+    // if option2 is selected, unselect option1 (and update select.value)
+    select = document.getElementById('test_selecting');
+    select.options[2].selected = true;
+    ok(select.options[2].selected, "Select's option should be selected");
+    ok(!select.options[1].selected, "Previously selected option should be automatically unselected");
+    equals("2", select.value, "Select's value should be updated");
+
+    // if option2 is unselected, then select first option on the list (and update select.value)
+    select.options[2].selected = false;
+    ok(!select.options[2].selected, "Select's option should be unselected");
+    ok(!select.options[1].selected, "Previously selected option should stay unselected");
+    ok(select.options[0].selected, "First option in the select should be selected");
+    equals("0", select.value, "Select's value should be updated");
+
+    // update select's value and options when selectedIndex is changed
+    equals(0, select.selectedIndex, "Select's selectedIndex should return the index of selected option");
+    select.selectedIndex = 2;
+    equals(2, select.selectedIndex, "Select's selectedIndex should be updated");
+    equals("2", select.value, "Changing selectedIndex should update select's value");
+    ok(!select.options[0].selected, "Changing selectedIndex should unselect currently selected option");
+    ok(select.options[2].selected, "Changing selectedIndex should select option at given index");
+});
-- 
1.6.0.1