| OLD | NEW | 
|---|
|  | (Empty) | 
| 1 description("Ensure correct behavior of canvas with path stroke + shadow after s
     caling. A blue and red checkered pattern should be displayed."); |  | 
| 2 |  | 
| 3 function print(message, color) |  | 
| 4 { |  | 
| 5     var paragraph = document.createElement("div"); |  | 
| 6     paragraph.appendChild(document.createTextNode(message)); |  | 
| 7     paragraph.style.fontFamily = "monospace"; |  | 
| 8     if (color) |  | 
| 9         paragraph.style.color = color; |  | 
| 10     document.getElementById("console").appendChild(paragraph); |  | 
| 11 } |  | 
| 12 |  | 
| 13 function shouldBeAround(a, b) |  | 
| 14 { |  | 
| 15     var evalA; |  | 
| 16     try { |  | 
| 17         evalA = eval(a); |  | 
| 18     } catch(e) { |  | 
| 19         evalA = e; |  | 
| 20     } |  | 
| 21 |  | 
| 22     if (Math.abs(evalA - b) < 20) |  | 
| 23         print("PASS " + a + " is around " + b , "green") |  | 
| 24     else |  | 
| 25         print("FAIL " + a + " is not around " + b + " (actual: " + evalA + ")", 
     "red"); |  | 
| 26 } |  | 
| 27 |  | 
| 28 var canvas = document.createElement('canvas'); |  | 
| 29 document.body.appendChild(canvas); |  | 
| 30 canvas.setAttribute('width', '600'); |  | 
| 31 canvas.setAttribute('height', '600'); |  | 
| 32 var ctx = canvas.getContext('2d'); |  | 
| 33 |  | 
| 34 ctx.scale(2, 2); |  | 
| 35 ctx.shadowOffsetX = 100; |  | 
| 36 ctx.shadowOffsetY = 100; |  | 
| 37 ctx.strokeStyle = 'rgba(0, 0, 255, 1)'; |  | 
| 38 ctx.lineWidth = 5; |  | 
| 39 |  | 
| 40 ctx.shadowColor = 'rgba(255, 0, 0, 1.0)'; |  | 
| 41 ctx.beginPath(); |  | 
| 42 ctx.moveTo(50, 50); |  | 
| 43 ctx.lineTo(100, 50); |  | 
| 44 ctx.lineTo(100, 100); |  | 
| 45 ctx.lineTo(50, 100); |  | 
| 46 ctx.lineTo(50, 50); |  | 
| 47 ctx.stroke(); |  | 
| 48 |  | 
| 49 ctx.shadowColor = 'rgba(255, 0, 0, 0.3)'; |  | 
| 50 ctx.beginPath(); |  | 
| 51 ctx.moveTo(50, 150); |  | 
| 52 ctx.lineTo(100, 150); |  | 
| 53 ctx.lineTo(100, 200); |  | 
| 54 ctx.lineTo(50, 200); |  | 
| 55 ctx.lineTo(50, 150); |  | 
| 56 ctx.stroke(); |  | 
| 57 |  | 
| 58 ctx.shadowColor = 'rgba(255, 0, 0, 1.0)'; |  | 
| 59 ctx.shadowBlur = 10; |  | 
| 60 ctx.beginPath(); |  | 
| 61 ctx.moveTo(150, 50); |  | 
| 62 ctx.lineTo(200, 50); |  | 
| 63 ctx.lineTo(200, 100); |  | 
| 64 ctx.lineTo(150, 100); |  | 
| 65 ctx.lineTo(150, 50); |  | 
| 66 ctx.stroke(); |  | 
| 67 |  | 
| 68 ctx.shadowColor = 'rgba(255, 0, 0, 0.6)'; |  | 
| 69 ctx.beginPath(); |  | 
| 70 ctx.moveTo(150, 150); |  | 
| 71 ctx.lineTo(200, 150); |  | 
| 72 ctx.lineTo(200, 200); |  | 
| 73 ctx.lineTo(150, 200); |  | 
| 74 ctx.lineTo(150, 150); |  | 
| 75 ctx.stroke(); |  | 
| 76 |  | 
| 77 var d; // imageData.data |  | 
| 78 |  | 
| 79 // Verify solid shadow. |  | 
| 80 d = ctx.getImageData(250, 200, 1, 1).data; |  | 
| 81 shouldBe('d[0]', '255'); |  | 
| 82 shouldBe('d[1]', '0'); |  | 
| 83 shouldBe('d[2]', '0'); |  | 
| 84 shouldBe('d[3]', '255'); |  | 
| 85 |  | 
| 86 d = ctx.getImageData(300, 290, 1, 1).data; |  | 
| 87 shouldBe('d[0]', '255'); |  | 
| 88 shouldBe('d[1]', '0'); |  | 
| 89 shouldBe('d[2]', '0'); |  | 
| 90 shouldBe('d[3]', '255'); |  | 
| 91 |  | 
| 92 d = ctx.getImageData(200, 250, 1, 1).data; |  | 
| 93 shouldBe('d[0]', '255'); |  | 
| 94 shouldBe('d[1]', '0'); |  | 
| 95 shouldBe('d[2]', '0'); |  | 
| 96 shouldBe('d[3]', '255'); |  | 
| 97 |  | 
| 98 // Verify solid alpha shadow. |  | 
| 99 d = ctx.getImageData(201, 405, 1, 1).data; |  | 
| 100 shouldBe('d[0]', '255'); |  | 
| 101 shouldBe('d[1]', '0'); |  | 
| 102 shouldBe('d[2]', '0'); |  | 
| 103 shouldBeAround('d[3]', '76'); |  | 
| 104 |  | 
| 105 d = ctx.getImageData(201, 500, 1, 1).data; |  | 
| 106 shouldBe('d[0]', '255'); |  | 
| 107 shouldBe('d[1]', '0'); |  | 
| 108 shouldBe('d[2]', '0'); |  | 
| 109 shouldBeAround('d[3]', '76'); |  | 
| 110 |  | 
| 111 d = ctx.getImageData(300, 499, 1, 1).data; |  | 
| 112 shouldBe('d[0]', '255'); |  | 
| 113 shouldBe('d[1]', '0'); |  | 
| 114 shouldBe('d[2]', '0'); |  | 
| 115 shouldBeAround('d[3]', '76'); |  | 
| 116 |  | 
| 117 // Verify blurry shadow. |  | 
| 118 d = ctx.getImageData(398, 210, 1, 1).data; |  | 
| 119 shouldBe('d[0]', '255'); |  | 
| 120 shouldBe('d[1]', '0'); |  | 
| 121 shouldBe('d[2]', '0'); |  | 
| 122 shouldBeAround('d[3]', '200'); |  | 
| 123 |  | 
| 124 d = ctx.getImageData(508, 250, 1, 1).data; |  | 
| 125 shouldBe('d[0]', '255'); |  | 
| 126 shouldBe('d[1]', '0'); |  | 
| 127 shouldBe('d[2]', '0'); |  | 
| 128 shouldBeAround('d[3]', '49'); |  | 
| 129 |  | 
| 130 d = ctx.getImageData(450, 198, 1, 1).data; |  | 
| 131 shouldBe('d[0]', '255'); |  | 
| 132 shouldBe('d[1]', '0'); |  | 
| 133 shouldBe('d[2]', '0'); |  | 
| 134 shouldBeAround('d[3]', '199'); |  | 
| 135 |  | 
| 136 // Verify blurry alpha shadow. |  | 
| 137 d = ctx.getImageData(505, 450, 1, 1).data; |  | 
| 138 shouldBe('d[0]', '255'); |  | 
| 139 shouldBe('d[1]', '0'); |  | 
| 140 shouldBe('d[2]', '0'); |  | 
| 141 shouldBeAround('d[3]', '70'); |  | 
| 142 |  | 
| 143 d = ctx.getImageData(505, 450, 1, 1).data; |  | 
| 144 shouldBe('d[0]', '255'); |  | 
| 145 shouldBe('d[1]', '0'); |  | 
| 146 shouldBe('d[2]', '0'); |  | 
| 147 shouldBeAround('d[3]', '70'); |  | 
| 148 |  | 
| 149 d = ctx.getImageData(450, 405, 1, 1).data; |  | 
| 150 shouldBe('d[0]', '255'); |  | 
| 151 shouldBe('d[1]', '0'); |  | 
| 152 shouldBe('d[2]', '0'); |  | 
| 153 shouldBeAround('d[3]', '69'); |  | 
| OLD | NEW | 
|---|