| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <script src="../../../resources/js-test.js"></script> | |
| 5 <script src="../resources/picker-common.js"></script> | |
| 6 </head> | |
| 7 <body> | |
| 8 <style> | |
| 9 select { | |
| 10 position: absolute; | |
| 11 -webkit-appearance: none; | |
| 12 } | |
| 13 </style> | |
| 14 <select id="menu" style="width: 200px; height: 10px;"> | |
| 15 </select> | |
| 16 <p id="description" style="opacity: 0"></p> | |
| 17 <div id="console" style="opacity: 0"></div> | |
| 18 <script> | |
| 19 var menu = document.getElementById('menu'); | |
| 20 var screenWidth = 500; | |
| 21 var screenHeight = 500; | |
| 22 var menuWidth = 200; | |
| 23 var menuHeight = 10; | |
| 24 test1(); | |
| 25 | |
| 26 function openPickerErrorCallback() { | |
| 27 testFailed('picker didn\'t open') | |
| 28 finishJSTest(); | |
| 29 } | |
| 30 | |
| 31 function test1() { | |
| 32 // Position menu at top left. | |
| 33 menu.style.top = 0; | |
| 34 menu.style.left = 0; | |
| 35 setItemCount(1); | |
| 36 openPicker(menu, function () { | |
| 37 injectFakeScreenSize() | |
| 38 injectFakeItemSize(20, 100, test2); | |
| 39 }, openPickerErrorCallback); | |
| 40 } | |
| 41 | |
| 42 function test2() { | |
| 43 popupWindowRect = getPopupWindowRect(); | |
| 44 shouldBe('popupWindowRect.x', '0'); | |
| 45 shouldBe('popupWindowRect.y', 'menuHeight'); | |
| 46 | |
| 47 popupWindow.pagePopupController.closePopup(); | |
| 48 // Position menu at bottom right. | |
| 49 menu.style.top = (screenHeight - menuHeight) + 'px'; | |
| 50 menu.style.left = (screenWidth - menuWidth) + 'px'; | |
| 51 setItemCount(1); | |
| 52 openPicker(menu, function () { | |
| 53 injectFakeScreenSize(); | |
| 54 injectFakeItemSize(20, 100, test3); | |
| 55 }, openPickerErrorCallback); | |
| 56 } | |
| 57 | |
| 58 function test3() { | |
| 59 popupWindowRect = getPopupWindowRect(); | |
| 60 shouldBe('popupWindowRect.x', 'screenWidth - popupWindowRect.width'); | |
| 61 shouldBe('popupWindowRect.y', 'screenHeight - popupWindowRect.height - menuH
eight'); | |
| 62 | |
| 63 popupWindow.pagePopupController.closePopup(); | |
| 64 // Position menu at right edge, clipped. | |
| 65 menu.style.top = '0'; | |
| 66 menu.style.left = (screenWidth - 100) + 'px'; | |
| 67 setItemCount(1); | |
| 68 openPicker(menu, function () { | |
| 69 injectFakeScreenSize(); | |
| 70 injectFakeItemSize(200, 100, test4); | |
| 71 }, openPickerErrorCallback); | |
| 72 } | |
| 73 | |
| 74 function test4() { | |
| 75 popupWindowRect = getPopupWindowRect(); | |
| 76 shouldBe('popupWindowRect.x', 'screenWidth - 100'); | |
| 77 shouldBe('popupWindowRect.y', 'menuHeight'); | |
| 78 | |
| 79 popupWindow.pagePopupController.closePopup(); | |
| 80 // Position menu at left edge, clipped. | |
| 81 menu.style.top = '0'; | |
| 82 menu.style.left = '-100px'; | |
| 83 setItemCount(1); | |
| 84 openPicker(menu, function () { | |
| 85 injectFakeScreenSize(); | |
| 86 injectFakeItemSize(200, 100, test5); | |
| 87 }, openPickerErrorCallback); | |
| 88 } | |
| 89 | |
| 90 function test5() { | |
| 91 popupWindowRect = getPopupWindowRect(); | |
| 92 shouldBe('popupWindowRect.x', '-100'); | |
| 93 shouldBe('popupWindowRect.y', 'menuHeight'); | |
| 94 | |
| 95 popupWindow.pagePopupController.closePopup(); | |
| 96 // Position close to right edge. | |
| 97 menu.style.top = '0'; | |
| 98 menu.style.left = (screenWidth - menuWidth - 10) + 'px'; | |
| 99 setItemCount(1); | |
| 100 openPicker(menu, function () { | |
| 101 injectFakeScreenSize(); | |
| 102 injectFakeItemSize(250, 100, test6); | |
| 103 }, openPickerErrorCallback); | |
| 104 } | |
| 105 | |
| 106 function test6() { | |
| 107 popupWindowRect = getPopupWindowRect(); | |
| 108 shouldBe('popupWindowRect.x', 'screenWidth - 250 - 10'); | |
| 109 shouldBe('popupWindowRect.y', 'menuHeight'); | |
| 110 | |
| 111 popupWindow.pagePopupController.closePopup(); | |
| 112 // Position close to bottom edge. | |
| 113 menu.style.top = (screenHeight - 100) + 'px'; | |
| 114 menu.style.left = '0'; | |
| 115 setItemCount(2); | |
| 116 openPicker(menu, function () { | |
| 117 injectFakeScreenSize(); | |
| 118 injectFakeItemSize(200, 100, test7); | |
| 119 }, openPickerErrorCallback); | |
| 120 } | |
| 121 | |
| 122 function test7() { | |
| 123 popupWindowRect = getPopupWindowRect(); | |
| 124 // Popup should appear right at the right edge of the screen. | |
| 125 shouldBe('popupWindowRect.x', '0'); | |
| 126 shouldBe('popupWindowRect.y', 'screenHeight - 100 - popupWindowRect.height')
; | |
| 127 | |
| 128 | |
| 129 popupWindow.pagePopupController.closePopup(); | |
| 130 // Apply transform. | |
| 131 menu.style.transform = 'scale(1.2)'; | |
| 132 menu.style.top = '100px'; | |
| 133 menu.style.left = '100px'; | |
| 134 setItemCount(1); | |
| 135 openPicker(menu, function () { | |
| 136 injectFakeScreenSize(); | |
| 137 injectFakeItemSize(200, 100, test8); | |
| 138 }, openPickerErrorCallback); | |
| 139 } | |
| 140 | |
| 141 function test8() { | |
| 142 popupWindowRect = getPopupWindowRect(); | |
| 143 shouldBe('popupWindowRect.x', '100 - menuWidth * 0.1'); | |
| 144 shouldBe('popupWindowRect.y', '100 + menuHeight * 1.1'); | |
| 145 | |
| 146 finishJSTest(); | |
| 147 } | |
| 148 | |
| 149 function getPopupWindowRect() { | |
| 150 return new popupWindow.Rectangle(popupWindow.screenX - window.screen.availLe
ft, popupWindow.screenY - window.screen.availTop, popupWindow.innerWidth, popupW
indow.innerHeight); | |
| 151 } | |
| 152 | |
| 153 function setItemCount(count) { | |
| 154 menu.innerHTML = ''; | |
| 155 for (var i = 0; i < count; i++) { | |
| 156 var option = document.createElement('option'); | |
| 157 menu.appendChild(option); | |
| 158 } | |
| 159 } | |
| 160 | |
| 161 function injectFakeScreenSize() { | |
| 162 Object.defineProperty(popupWindow, 'screen', { | |
| 163 value: { | |
| 164 width: screenWidth, | |
| 165 height: screenHeight, | |
| 166 availLeft: window.screen.availLeft, | |
| 167 availTop: window.screen.availTop, | |
| 168 availWidth: screenWidth, | |
| 169 availHeight: screenHeight | |
| 170 } | |
| 171 }); | |
| 172 } | |
| 173 | |
| 174 function injectFakeItemSize(width, height, callback) { | |
| 175 var style = popupWindow.document.createElement('style'); | |
| 176 style.innerHTML = 'select { width: ' + width + 'px !important; } option { he
ight: ' + height + 'px; }'; | |
| 177 popupWindow.document.body.appendChild(style); | |
| 178 popupWindow.global.picker._fixWindowSize(); | |
| 179 popupWindow.addEventListener('resize', callback, false); | |
| 180 } | |
| 181 </script> | |
| 182 </body> | |
| 183 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1591613002:
Move tests about 'New SELECT Popup' to fast/forms/select-popup, and disable them on OSX and Android. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master