OLD | NEW |
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | 1 <script src="../../resources/testharness.js"></script> |
2 <html> | 2 <script src="../../resources/testharnessreport.js"></script> |
3 <head> | |
4 <script src="../../resources/js-test.js"></script> | |
5 </head> | |
6 <body> | 3 <body> |
7 <script src="script-tests/canvas-lineDash.js"></script> | 4 <script> |
| 5 test(function(t) { |
| 6 |
| 7 var canvas = document.createElement('canvas'); |
| 8 document.body.appendChild(canvas); |
| 9 canvas.setAttribute('width', '700'); |
| 10 canvas.setAttribute('height', '700'); |
| 11 var ctx = canvas.getContext('2d'); |
| 12 |
| 13 // Verify default values. |
| 14 assert_equals(ctx.lineDashOffset, 0); |
| 15 |
| 16 // Set dash-style. |
| 17 ctx.setLineDash([15, 10]); |
| 18 ctx.lineDashOffset = 5; |
| 19 ctx.strokeRect (10,10,100,100); |
| 20 |
| 21 // Verify dash and offset. |
| 22 var lineDash; |
| 23 lineDash = ctx.getLineDash(); |
| 24 assert_equals(lineDash[0], 15); |
| 25 assert_equals(lineDash[1], 10); |
| 26 assert_equals(ctx.lineDashOffset, 5); |
| 27 |
| 28 // Verify setting line dash to sequence of nulls is interpreted as zeros |
| 29 ctx.setLineDash([null, null]); |
| 30 lineDash = ctx.getLineDash(); |
| 31 assert_equals(lineDash[0], 0); |
| 32 assert_equals(lineDash[1], 0); |
| 33 |
| 34 // Set dash style to even number |
| 35 ctx.setLineDash([5, 10, 15]); |
| 36 ctx.strokeRect(20, 20, 120, 120); |
| 37 |
| 38 // Verify dash pattern is normalized |
| 39 lineDash = ctx.getLineDash(); |
| 40 assert_equals(lineDash[0], 5); |
| 41 assert_equals(lineDash[1], 10); |
| 42 assert_equals(lineDash[2], 15); |
| 43 assert_equals(lineDash[3], 5); |
| 44 assert_equals(lineDash[4], 10); |
| 45 assert_equals(lineDash[5], 15); |
| 46 |
| 47 // Verify that conversion from string works |
| 48 ctx.setLineDash(["1", 2]); |
| 49 lineDash = ctx.getLineDash(); |
| 50 assert_equals(lineDash[0], 1); |
| 51 assert_equals(lineDash[1], 2); |
| 52 |
| 53 // Verify that line dash offset persists after |
| 54 // clearRect (which causes a save/restore of the context |
| 55 // state to the stack). |
| 56 ctx.clearRect(0, 0, 700, 700); |
| 57 assert_equals(ctx.lineDashOffset, 5); |
| 58 |
| 59 // Verify dash rendering |
| 60 ctx.setLineDash([20, 10]); |
| 61 ctx.lineDashOffset = 0; |
| 62 ctx.lineWidth = 4; // To make the test immune to plaform anti-aliasing discr
epancies |
| 63 ctx.strokeStyle = '#00FF00'; |
| 64 ctx.strokeRect(10.5, 10.5, 30, 30); |
| 65 |
| 66 assert_array_equals(ctx.getImageData(25, 10, 1, 1).data, [0, 255, 0, 255]); |
| 67 assert_array_equals(ctx.getImageData(35, 10, 1, 1).data, [0, 0, 0, 0]); |
| 68 assert_array_equals(ctx.getImageData(40, 25, 1, 1).data, [0, 255, 0, 255]); |
| 69 assert_array_equals(ctx.getImageData(40, 35, 1, 1).data, [0, 0, 0, 0]); |
| 70 assert_array_equals(ctx.getImageData(25, 40, 1, 1).data, [0, 255, 0, 255]); |
| 71 assert_array_equals(ctx.getImageData(15, 40, 1, 1).data, [0, 0, 0, 0]); |
| 72 assert_array_equals(ctx.getImageData(10, 25, 1, 1).data, [0, 255, 0, 255]); |
| 73 assert_array_equals(ctx.getImageData(10, 15, 1, 1).data, [0, 0, 0, 0]); |
| 74 |
| 75 // Verify that lineDashOffset works as expected |
| 76 ctx.lineDashOffset = 20; |
| 77 ctx.strokeRect(50.5, 10.5, 30, 30); |
| 78 assert_array_equals(ctx.getImageData(55, 10, 1, 1).data, [0, 0, 0, 0]); |
| 79 assert_array_equals(ctx.getImageData(65, 10, 1, 1).data, [0, 255, 0, 255]); |
| 80 assert_array_equals(ctx.getImageData(80, 15, 1, 1).data, [0, 0, 0, 0]); |
| 81 assert_array_equals(ctx.getImageData(80, 25, 1, 1).data, [0, 255, 0, 255]); |
| 82 assert_array_equals(ctx.getImageData(75, 40, 1, 1).data, [0, 0, 0, 0]); |
| 83 assert_array_equals(ctx.getImageData(65, 40, 1, 1).data, [0, 255, 0, 255]); |
| 84 assert_array_equals(ctx.getImageData(50, 35, 1, 1).data, [0, 0, 0, 0]); |
| 85 assert_array_equals(ctx.getImageData(50, 25, 1, 1).data, [0, 255, 0, 255]); |
| 86 |
| 87 // Verify negative lineDashOffset |
| 88 ctx.lineDashOffset = -10; |
| 89 ctx.strokeRect(90.5, 10.5, 30, 30); |
| 90 assert_array_equals(ctx.getImageData(95, 10, 1, 1).data, [0, 0, 0, 0]); |
| 91 assert_array_equals(ctx.getImageData(105, 10, 1, 1).data, [0, 255, 0, 255]); |
| 92 assert_array_equals(ctx.getImageData(120, 15, 1, 1).data, [0, 0, 0, 0]); |
| 93 assert_array_equals(ctx.getImageData(120, 25, 1, 1).data, [0, 255, 0, 255]); |
| 94 assert_array_equals(ctx.getImageData(115, 40, 1, 1).data, [0, 0, 0, 0]); |
| 95 assert_array_equals(ctx.getImageData(105, 40, 1, 1).data, [0, 255, 0, 255]); |
| 96 assert_array_equals(ctx.getImageData(90, 35, 1, 1).data, [0, 0, 0, 0]); |
| 97 assert_array_equals(ctx.getImageData(90, 25, 1, 1).data, [0, 255, 0, 255]); |
| 98 |
| 99 // Verify that all zero dash sequence results in no dashing |
| 100 ctx.setLineDash([0, 0]); |
| 101 ctx.lineDashOffset = 0; |
| 102 ctx.strokeRect(130.5, 10.5, 30, 30); |
| 103 assert_array_equals(ctx.getImageData(130, 10, 1, 1).data, [0, 255, 0, 255]); |
| 104 assert_array_equals(ctx.getImageData(130, 15, 1, 1).data, [0, 255, 0, 255]); |
| 105 assert_array_equals(ctx.getImageData(130, 25, 1, 1).data, [0, 255, 0, 255]); |
| 106 assert_array_equals(ctx.getImageData(130, 35, 1, 1).data, [0, 255, 0, 255]); |
| 107 |
| 108 }, "Basic test for setLineDash, getLineDash and lineDashOffset"); |
| 109 </script> |
8 </body> | 110 </body> |
9 </html> | |
OLD | NEW |