Implement select element list box with shadow DOM.

LayoutTests/fast/forms/listbox-selection-2.html

Index: LayoutTests/fast/forms/listbox-selection-2.html
diff --git a/LayoutTests/fast/forms/listbox-selection-2.html b/LayoutTests/fast/forms/listbox-selection-2.html
index 1ea7abb0c63bf73397010f892b379fc852683307..46e5d4ade370a323fcea60c79742f9be065136e7 100644
--- a/LayoutTests/fast/forms/listbox-selection-2.html
+++ b/LayoutTests/fast/forms/listbox-selection-2.html
@@ -41,7 +41,7 @@ var sl1 = document.getElementById('sl1');
 var sl2 = document.getElementById('sl2');
 var itemHeight = Math.floor(sl1.offsetHeight / sl1.size);
 sl1.removeAttribute('size');
-var height = itemHeight * 9 + 9;
+var height = Math.floor(itemHeight * 9 + itemHeight / 2);
 sl1.setAttribute('style', 'height: ' + height + 'px; border: 10px solid; padding: 5px;');
 
 function mouseDownOnSelect(selId, index)
@@ -49,10 +49,10 @@ function mouseDownOnSelect(selId, index)
     var sl = document.getElementById(selId);
     var borderPaddingTop = 15;
     var borderPaddingLeft = 15;
-    var y = index * itemHeight + itemHeight / 3 - window.pageYOffset + borderPaddingTop;
-    var event = document.createEvent("MouseEvent");
-    event.initMouseEvent("mousedown", true, true, document.defaultView, 1, sl.offsetLeft +  borderPaddingLeft, sl.offsetTop + y, sl.offsetLeft + borderPaddingLeft, sl.offsetTop + y, false, false, false, false, 0, document);
-    sl.dispatchEvent(event);
+    var y = index * itemHeight + itemHeight / 2 - window.pageYOffset + borderPaddingTop;
+    eventSender.mouseMoveTo(sl.offsetLeft +  borderPaddingLeft, sl.offsetTop + y);
+    eventSender.mouseDown();
+    eventSender.mouseUp();
 }
 
 function selectionPattern(selectId)