Bug 685197 - Multiple select options become unselected when tapping on multi-select [r=mbrubeck]

mobile/chrome/content/content.js

@@ -501,7 +501,8 @@ let Content = {
         if (!this.formAssistant.open(element, x, y))
           sendAsyncMessage("FindAssist:Hide", { });
 
-        if (this._highlightElement) {
+        // don't fire mouse events on selects, see bug 685197
+        if (this._highlightElement && !(element instanceof HTMLSelectElement)) {
           this._sendMouseEvent("mousemove", this._highlightElement, x, y);
           this._sendMouseEvent("mousedown", this._highlightElement, x, y);
           this._sendMouseEvent("mouseup", this._highlightElement, x, y);

mobile/chrome/tests/browser_select.html

@@ -69,16 +69,31 @@
     <br>
     <!-- Multi-select listbox -->
     <select id="listbox-multiselect" size="5" multiple="true">
+        <optgroup label="first">
         <option>Alpha</option>
         <option>Beta</option>
+        </optgroup>
         <option>Gamma</option>
         <option>Epsilon</option>
         <option>One</option>
         <option>Two</option>
         <option>Three</option>
-        <option>Four</option>
+        <option selected="true">Four</option>
     </select>
     <br>
     <button onclick="unselectCombo(document.getElementById('listbox-multiselect'));">Unselect</button>
+<pre id="result"></pre>
+<script>
+var x=document.getElementById('result');
+
+function mwdoe(aEvent) {
+x.innerHTML += aEvent.type + '\n';
+}
+
+window.addEventListener('mousedown', mwdoe, true);
+window.addEventListener('mouseup', mwdoe, true);
+window.addEventListener('click', mwdoe, true);
+
+</script>
 </body>
 </html>

mobile/chrome/tests/browser_select.js

@@ -25,9 +25,46 @@ function onPageReady() {
   let combo = new_tab.browser.contentDocument.getElementById("combobox");
   isnot(combo, null, "Get the select from web content");
 
-  // Sending a synthesized event to the combo is not working
+  new_tab.browser.contentWindow.addEventListener('mousedown', function(e) {
+    ok(false, e.type + ' should not have been fired');
+  }, true);
+  new_tab.browser.contentWindow.addEventListener('mouseup', function(e) {
+    ok(false, e.type + ' should not have been fired');
+  }, true);
+  new_tab.browser.contentWindow.addEventListener('click', function(e) {
+    ok(false, e.type + ' should not have been fired');
+  }, true);
+
+  //This should be removed and below there should be uncommented once bug 689403 is fixed
+  tapOnMultiSelect();
+/* 
   let rect = browserViewToClientRect(Rect.fromRect(combo.getBoundingClientRect()));
+  ContentTouchHandler.tapDown(rect.left + 1, rect.top + 1);
   ContentTouchHandler.tapSingle(rect.left + 1, rect.top + 1);
+  ContentTouchHandler.tapUp(rect.left + 1, rect.top + 1);
+
+  waitFor(closeSelect, function() { return document.getElementById("select-container").hidden == false; });
+*/
+}
+
+function closeSelect() {
+  let selectui = document.getElementById("select-container");
+  is(selectui.hidden, false, "Select UI should be open");
+
+  EventUtils.sendKey("ESCAPE", window);
+
+  waitFor(tapOnMultiSelect, function() { return document.getElementById("select-container").hidden == true; });
+}
+
+function tapOnMultiSelect() {
+  let selectui = document.getElementById("select-container");
+  is(selectui.hidden, true, "Select UI should be hidden");
+
+  let option = new_tab.browser.contentDocument.getElementById("listbox-multiselect");
+  let rect = browserViewToClientRect(Rect.fromRect(option.getBoundingClientRect()));
+  ContentTouchHandler.tapDown(rect.left + 1, rect.top + 1);
+  ContentTouchHandler.tapSingle(rect.left + 1, rect.top + 1);
+  ContentTouchHandler.tapUp(rect.left + 1, rect.top + 1);
 
   waitFor(onUIReady, function() { return document.getElementById("select-container").hidden == false; });
 }
@@ -35,8 +72,9 @@ function onPageReady() {
 function onUIReady() {
   let selectui = document.getElementById("select-container");
   is(selectui.hidden, false, "Select UI should be open");
+  is(SelectHelperUI._selectedIndexes, 7, "Select UI should have the 8th option selected:" + SelectHelperUI._selectedIndexes);
 
-  EventUtils.synthesizeKey("VK_ESCAPE", {}, window);
+  EventUtils.sendKey("ESCAPE", window);
 
   // Close our tab when finished
   Browser.closeTab(new_tab);

mobile/themes/core/content.css

@@ -162,6 +162,11 @@ textarea,
   background: white -moz-linear-gradient(top, rgba(115,115,115,0.5) 0, rgba(215,215,215,0.5) 3px, rgba(255,255,255,0.2) 16px);
 }
 
+/* Selects are handled by the form helper, see bug 685197 */
+select option, select optgroup {
+  pointer-events: none;
+}
+
 input:-moz-placeholder,
 textarea:-moz-placeholder {
   color: GrayText;