Chromium Code Reviews Chromium Code Reviews
Issue 196243007:
Implement CRC2D.scrollPathIntoView() on Canvas (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <script src="../../resources/js-test.js"></script> | |
| 5 <style> | |
| 6 | |
| 7 .container { | |
| 8 display : inline-block; | |
| 9 width : 200px; | |
| 10 height : 200px; | |
| 11 overflow : scroll; | |
| 12 } | |
| 13 | |
| 14 .border { | |
| 15 border : 500px solid white; | |
| 16 } | |
| 17 | |
| 18 .padding { | |
| 19 padding : 500px; | |
| 20 } | |
| 21 | |
| 22 .margin { | |
| 23 margin : 500px; | |
| 24 } | |
| 25 | |
| 26 </style> | |
| 27 </head> | |
| 28 <body> | |
| 29 <div class="container"> | |
| 30 <canvas width="400" height="400"></canvas> | |
| 31 </div> | |
| 32 <script> | |
| 33 | |
| 34 if (window.testRunner) | |
| 35 testRunner.dumpAsText(); | |
| 36 | |
| 37 function drawAndScroll(container, context, path) { | |
| 38 | |
| 39 // reset scroll | |
| 40 container.scrollTop = 0; | |
| 41 container.scrollLeft = 0; | |
| 42 | |
| 43 // draw path stroke | |
| 44 context.clearRect(0, 0, 400, 400); | |
| 45 context.beginPath(); | |
| 46 if (path == undefined || path == null) { | |
| 47 context.rect(100, 100, 100, 100); | |
| 48 context.stroke(); | |
| 49 } else { | |
| 50 path.rect(100, 100, 100, 100); | |
| 51 context.stroke(path); | |
| 52 } | |
| 53 | |
| 54 // scroll path into view | |
| 55 if (path == undefined || path == null) | |
| 56 context.scrollPathIntoView(); | |
| 57 else | |
| 58 context.scrollPathIntoView(path); | |
| 59 | |
| 60 // save scroll top value | |
| 61 window.testValue = container.scrollTop; | |
| 62 } | |
| 63 | |
| 64 function scrollTest(container, context, path) { | |
| 65 | |
| 66 canvas.className = ""; | |
| 67 drawAndScroll(container, context); | |
| 68 shouldBe("testValue", "100"); | |
| 69 | |
| 70 canvas.className = "border"; | |
| 71 drawAndScroll(container, context); | |
| 72 shouldBe("testValue", "600"); | |
| 73 | |
| 74 canvas.className = "padding"; | |
| 75 drawAndScroll(container, context); | |
| 76 shouldBe("testValue", "600"); | |
| 77 | |
| 78 canvas.className = "padding border"; | |
| 79 drawAndScroll(container, context); | |
| 80 shouldBe("testValue", "1100"); | |
| 81 | |
| 82 canvas.className = "margin"; | |
| 83 drawAndScroll(container, context); | |
| 84 shouldBe("testValue", "600"); | |
| 85 } | |
| 86 | |
| 87 var container = document.querySelector("div[class='container']"); | |
| 88 var canvas = document.querySelector("canvas"); | |
| 89 var context = canvas.getContext("2d"); | |
| 90 | |
| 91 var path = new Path2D(); | |
| 92 | |
| 93 description("Series of tests to ensure correct results of scrolling path into view on canvas"); | |
| 94 | |
| 95 debug("Test case 1: scrollPathIntoView();"); | |
| 96 scrollTest(container, context); | |
| 97 debug(""); | |
| 98 | |
| 99 debug("Test case 2: scrollPathIntoView(path);"); | |
| 100 scrollTest(container, context, path); | |
|
Justin Novosad
2014/03/20 20:03:12
Need additional test case with CTM != identity. A
| |
| 101 debug(""); | |
| 102 | |
| 103 debug("Test case 3: exceptions"); | |
| 104 shouldThrow("context.scrollPathIntoView(null);"); | |
| 105 shouldThrow("context.scrollPathIntoView([]);"); | |
| 106 shouldThrow("context.scrollPathIntoView({});"); | |
| 107 debug(""); | |
| 108 | |
| 109 </script> | |
| 110 </body> | |
| 111 </html> | |
| OLD | NEW |
