| <head> |
| <style type="text/css"> |
| .ahem { font: 20px Ahem; } |
| </style> |
| <script> |
| |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| var onMacPlatform = navigator.userAgent.search(/\bMac OS X\b/) != -1; |
| |
| function runTest() { |
| runFrameScrollTest(); |
| runDivScrollTest(); |
| } |
| |
| function generateContent() { |
| var content = ""; |
| for (var i = 0; i < 10; ++i) |
| content += "<p>line " + i + "</p>\n"; |
| return content; |
| } |
| |
| function runFrameScrollTest() { |
| var frame = frames[0]; |
| var doc = frame.document; |
| var body = doc.body; |
| body.innerHTML = generateContent(); |
| frame.focus(); |
| frame.getSelection().setPosition(body.firstChild, 0); |
| if (onMacPlatform) |
| offsets = [ 55, 175 ]; |
| else |
| offsets = [ 120, 240 ]; |
| runScrollingTest("iframe", frame, offsets, function() { return frame.pageYOffset; }); |
| } |
| |
| function runDivScrollTest() { |
| var editable = document.getElementById('editable'); |
| editable.innerHTML = generateContent(); |
| editable.focus(); |
| window.getSelection().setPosition(editable, 0); |
| if (onMacPlatform) |
| offsets = [ 75, 195 ]; |
| else |
| offsets = [ 140, 260 ]; |
| runScrollingTest("div", editable, offsets, function() { return editable.scrollTop; }); |
| } |
| |
| function runScrollingTest(testName, frame, offsets, scrollFunction) { |
| var tolerance = 0; |
| var modifiers = onMacPlatform ? ["altKey"] : []; |
| |
| if (!window.eventSender) |
| return; |
| |
| eventSender.keyDown("pageDown", modifiers); |
| if (Math.abs(scrollFunction() - offsets[0]) > tolerance) { |
| throw "Frame viewport should be around " + offsets[0] + |
| "px , not at " + scrollFunction(); |
| } |
| |
| eventSender.keyDown("pageDown", modifiers); |
| if (Math.abs(scrollFunction() - offsets[1]) > tolerance) { |
| throw "Frame viewport should be around " + offsets[1] + |
| "px , not " + scrollFunction(); |
| } |
| |
| eventSender.keyDown("pageUp", modifiers); |
| if (Math.abs(scrollFunction() - offsets[0]) > tolerance) { |
| throw "Frame viewport should be around " + offsets[0] + |
| "px , not at " + scrollFunction(); |
| } |
| |
| document.getElementById("results").innerHTML += testName + " PASS<br/>"; |
| } |
| </script> |
| </head> |
| <body onload="runTest()"> |
| <div>Page up/down (option+page up/down on Mac) should move the move cursor and scroll the content |
| in contenteditable elements. This sample covers scroll position test of a) iframe element containing |
| contenteditable body and b) content editable div element. Even though the cursor will move exactly to |
| the same location on all platforms (covered by test option-page-up-down.html), please note that Mac will |
| scroll the visible area by placing the cursor position in the middle. All other platforms will scroll by |
| keeping the cursor aligned with the top edge of the visible area. </div> |
| <iframe src="../resources/contenteditable-iframe-fixed-size-src.html" style="height:150px; padding: 0px;"></iframe> |
| <div id="editable" contenteditable="true" class="ahem" style="height:150px; overflow:auto; padding: 0px; margin: 0px;"></div> |
| <div id="results"></div> |
| </body> |