Index: ManualTests/forms/list-picker.html |
diff --git a/ManualTests/forms/list-picker.html b/ManualTests/forms/list-picker.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..bb4c2833af733daebc3a215da543ccafa5907b28 |
--- /dev/null |
+++ b/ManualTests/forms/list-picker.html |
@@ -0,0 +1,225 @@ |
+<!DOCTYPE html> |
+<html> |
+<head> |
+<meta charset=utf-8> |
+<title>List Picker test</title> |
+<style> |
+body { |
+ background-color: #eeffff; |
+} |
+iframe { |
+ z-index: 2147483647; |
+ width: 100px; |
+ height: 100px; |
+ border: 0; |
+ overflow: hidden; |
+} |
+</style> |
+</head> |
+<body> |
+ |
+<p>This is a testbed for list picker.</p> |
+ |
+<div> |
+<select id="menu"> |
+ <option value="0">foo</option> |
+ <option value="1">bar</option> |
+ <option value="2">bar</option> |
+ <optgroup label=bar> |
+ <option value="4">bar</option> |
+ <option value="5">bar</option> |
+ </optgroup> |
+ <option value="6">bar</option> |
+</select> |
+<iframe></iframe> |
+ |
+<ol id="console" style="font-family:monospace;"> |
+</ol> |
+ |
+<script> |
+var arguments = { |
+ selectedIndex: 0, |
+ children: [{ |
+ type: "option", |
+ label: "foo", |
+ title: "", |
+ value: 0, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }, { |
+ type: "option", |
+ label: "bar", |
+ title: "", |
+ value: 1, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }, { |
+ type: "option", |
+ label: "bar", |
+ title: "", |
+ value: 2, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }, { |
+ type: "optgroup", |
+ label: "foo", |
+ title: "", |
+ ariaLabel: "", |
+ disabled: false, |
+ children: [{ |
+ type: "option", |
+ label: "bar", |
+ title: "", |
+ value: 3, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "700", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }, |
+ { |
+ type: "option", |
+ label: "bar", |
+ title: "", |
+ value: 4, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }], |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }, { |
+ type: "option", |
+ label: "bar", |
+ title: "", |
+ value: 5, |
+ ariaLabel: "", |
+ disabled: false, |
+ style: { |
+ color: "black", |
+ backgroundColor: "transparent", |
+ fontSize: "11px", |
+ fontWeight: "400", |
+ fontFamily: ["sans-serif"], |
+ visibility: "visible", |
+ display: "block", |
+ direction: "ltr", |
+ unicodeBidi: "normal" |
+ } |
+ }], |
+ anchorRectInScreen: { |
+ x: 1332, |
+ y: 356, |
+ width: 64, |
+ height: 18, |
+ }, |
+}; |
+ |
+function openListPicker(args) { |
+ var frame = document.getElementsByTagName('iframe')[0]; |
+ var doc = frame.contentDocument; |
+ doc.documentElement.innerHTML = '<head></head><body><div id=main>Loading...</div></body>'; |
+ var commonCssLink = doc.createElement('link'); |
+ commonCssLink.rel = 'stylesheet'; |
+ commonCssLink.href = '../../Source/web/resources/pickerCommon.css?' + (new Date()).getTime(); |
+ doc.head.appendChild(commonCssLink); |
+ var listPickerCssLink = doc.createElement('link'); |
+ listPickerCssLink.rel = 'stylesheet'; |
+ listPickerCssLink.href = '../../Source/web/resources/listPicker.css?' + (new Date()).getTime(); |
+ doc.head.appendChild(listPickerCssLink); |
+ var commonJsScript = doc.createElement('script'); |
+ commonJsScript.src = '../../Source/web/resources/pickerCommon.js?' + (new Date()).getTime(); |
+ doc.body.appendChild(commonJsScript); |
+ var listPickerJsScript = doc.createElement('script'); |
+ listPickerJsScript.src = '../../Source/web/resources/listPicker.js?' + (new Date()).getTime(); |
+ doc.body.appendChild(listPickerJsScript); |
+ |
+ var pagePopupController = { |
+ setValue: function(stringValue) { |
+ window.log('string="' + stringValue + '"'); |
+ if (numValue == 0) |
+ window.document.getElementById('menu').value = stringValue; |
+ }, |
+ setValueAndClosePopup: function(numValue, stringValue) { |
+ window.log('number=' + numValue + ', string="' + stringValue + '"'); |
+ if (numValue == 0) |
+ window.document.getElementById('menu').value = stringValue; |
+ }, |
+ } |
+ |
+ setTimeout(function() { |
+ frame.contentWindow.postMessage(JSON.stringify(args), "*"); |
+ frame.contentWindow.pagePopupController = pagePopupController; |
+ }, 100); |
+} |
+ |
+function log(str) { |
+ var entry = document.createElement('li'); |
+ entry.innerText = str; |
+ document.getElementById('console').appendChild(entry); |
+} |
+ |
+openListPicker(arguments); |
+</script> |
+</body> |
+</html> |