| OLD | NEW |
|---|
| (Empty) |
| 1 <html> | |
| 2 <head> | |
| 3 <script src="../../../http/tests/inspector/inspector-test.js"></script> | |
| 4 <script src="../canvas-profiler-test.js"></script> | |
| 5 <script> | |
| 6 | |
| 7 var ctx; | |
| 8 var rawCtx; | |
| 9 var ctxResource; | |
| 10 | |
| 11 var sampleAttributes1 = { | |
| 12 "strokeStyle": "#000001", | |
| 13 "fillStyle": "#000002", | |
| 14 "globalAlpha": 0.5, | |
| 15 "lineWidth": 2, | |
| 16 "lineCap": "round", | |
| 17 "lineJoin": "bevel", | |
| 18 "miterLimit": 12, | |
| 19 "shadowOffsetX": 1, | |
| 20 "shadowOffsetY": 2, | |
| 21 "shadowBlur": 3, | |
| 22 "shadowColor": "#000003", | |
| 23 "globalCompositeOperation": "source-in", | |
| 24 "font": "12px sans-serif", | |
| 25 "textAlign": "end", | |
| 26 "textBaseline": "top", | |
| 27 "lineDashOffset": 1 | |
| 28 }; | |
| 29 | |
| 30 var sampleAttributes2 = { | |
| 31 "strokeStyle": "#100001", | |
| 32 "fillStyle": "#100002", | |
| 33 "globalAlpha": 0, | |
| 34 "lineWidth": 3, | |
| 35 "lineCap": "square", | |
| 36 "lineJoin": "round", | |
| 37 "miterLimit": 11, | |
| 38 "shadowOffsetX": 3, | |
| 39 "shadowOffsetY": 4, | |
| 40 "shadowBlur": 2, | |
| 41 "shadowColor": "#100003", | |
| 42 "globalCompositeOperation": "xor", | |
| 43 "font": "13px sans-serif", | |
| 44 "textAlign": "left", | |
| 45 "textBaseline": "middle", | |
| 46 "lineDashOffset": 2 | |
| 47 }; | |
| 48 | |
| 49 function assignAttributes(attributes) | |
| 50 { | |
| 51 for (var attribute in attributes) | |
| 52 ctx[attribute] = attributes[attribute]; | |
| 53 } | |
| 54 | |
| 55 function assertAttributes(attributes) | |
| 56 { | |
| 57 for (var attribute in attributes) | |
| 58 console.assert(ctx[attribute] === attributes[attribute], "Expected value
for attribute " + attribute + ": " + attributes[attribute] + ", but was: " + ct
x[attribute]); | |
| 59 } | |
| 60 | |
| 61 function assertNumberOfCallsInLog(expected) | |
| 62 { | |
| 63 var errors = []; | |
| 64 var calls = ctxResource.calls(); | |
| 65 if (calls.length !== expected.length) { | |
| 66 var names = []; | |
| 67 for (var i = 0; calls[i]; ++i) | |
| 68 names.push(calls[i].functionName()); | |
| 69 errors.push("Expected size of the 2D context call log: " + expected.leng
th + ", but was: " + calls.length + ", names: " + names); | |
| 70 } else { | |
| 71 for (var i = 0; i < calls.length; ++i) { | |
| 72 var name = calls[i].functionName(); | |
| 73 var expectedName = expected[i]; | |
| 74 if (name !== expectedName) | |
| 75 errors.push("Expected name: " + expectedName + ", but was: " + n
ame + ", at index: " + i); | |
| 76 } | |
| 77 } | |
| 78 if (errors.length) | |
| 79 console.error("FAIL: " + errors.join("\n ") + "\n " + (new Error).
stack); | |
| 80 } | |
| 81 | |
| 82 function testDrawingAttributes() | |
| 83 { | |
| 84 assertNumberOfCallsInLog([]); | |
| 85 assignAttributes(sampleAttributes1); | |
| 86 assertAttributes(sampleAttributes1); | |
| 87 assertNumberOfCallsInLog([]); | |
| 88 | |
| 89 // Save previous attribute values and set new values. | |
| 90 ctx.save(); | |
| 91 assignAttributes(sampleAttributes2); | |
| 92 assertAttributes(sampleAttributes2); | |
| 93 assertNumberOfCallsInLog(["save"]); | |
| 94 | |
| 95 // Restore previous attribute values. | |
| 96 ctx.restore(); | |
| 97 assertAttributes(sampleAttributes1); | |
| 98 // Call log should be empty after save() and restore() calls. | |
| 99 assertNumberOfCallsInLog([]); | |
| 100 } | |
| 101 | |
| 102 function testSaveRestoreSequence() | |
| 103 { | |
| 104 assertNumberOfCallsInLog([]); | |
| 105 ctx.restore(); | |
| 106 ctx.restore(); | |
| 107 assertNumberOfCallsInLog([]); | |
| 108 ctx.save(); | |
| 109 assertNumberOfCallsInLog(["save"]); | |
| 110 ctx.save(); | |
| 111 assertNumberOfCallsInLog(["save", "save"]); | |
| 112 ctx.save(); | |
| 113 assertNumberOfCallsInLog(["save", "save", "save"]); | |
| 114 ctx.restore(); | |
| 115 assertNumberOfCallsInLog(["save", "save"]); | |
| 116 ctx.restore(); | |
| 117 assertNumberOfCallsInLog(["save"]); | |
| 118 ctx.restore(); | |
| 119 assertNumberOfCallsInLog([]); | |
| 120 ctx.restore(); | |
| 121 ctx.restore(); | |
| 122 assertNumberOfCallsInLog([]); | |
| 123 } | |
| 124 | |
| 125 function callPathMethods() | |
| 126 { | |
| 127 ctx.beginPath(); | |
| 128 ctx.lineWidth = 2; | |
| 129 ctx.moveTo(11, 12); | |
| 130 ctx.lineTo(111, 112); | |
| 131 ctx.stroke(); | |
| 132 } | |
| 133 | |
| 134 function clearContextResourceLog() | |
| 135 { | |
| 136 while (ctxResource.calls().length) | |
| 137 ctxResource.calls().pop(); | |
| 138 assertNumberOfCallsInLog([]); | |
| 139 } | |
| 140 | |
| 141 function testPathMethodsSequence() | |
| 142 { | |
| 143 assertNumberOfCallsInLog([]); | |
| 144 callPathMethods(); | |
| 145 assertNumberOfCallsInLog(["beginPath", "moveTo", "lineTo"]); | |
| 146 callPathMethods(); | |
| 147 assertNumberOfCallsInLog(["beginPath", "moveTo", "lineTo"]); // old methods
should have been cleared | |
| 148 ctx.ellipse(100, 100, 50, 75, 45, 0, 2 * Math.PI); | |
| 149 ctx.stroke(); | |
| 150 assertNumberOfCallsInLog(["beginPath", "moveTo", "lineTo", "ellipse"]); | |
| 151 clearContextResourceLog(); | |
| 152 } | |
| 153 | |
| 154 function testClipMethods() | |
| 155 { | |
| 156 assertNumberOfCallsInLog([]); | |
| 157 ctx.save(); | |
| 158 callPathMethods(); | |
| 159 assertNumberOfCallsInLog(["save", "beginPath", "moveTo", "lineTo"]); | |
| 160 ctx.clip(); | |
| 161 assertNumberOfCallsInLog(["save", "beginPath", "moveTo", "lineTo", "clip"]); | |
| 162 callPathMethods(); | |
| 163 assertNumberOfCallsInLog(["save", "beginPath", "moveTo", "lineTo", "clip", "
beginPath", "moveTo", "lineTo"]); | |
| 164 callPathMethods(); | |
| 165 assertNumberOfCallsInLog(["save", "beginPath", "moveTo", "lineTo", "clip", "
beginPath", "moveTo", "lineTo"]); // the last calls should have been cleared | |
| 166 ctx.restore(); | |
| 167 assertNumberOfCallsInLog(["save", "beginPath", "moveTo", "lineTo", "restore"
]); | |
| 168 ctx.beginPath(); | |
| 169 assertNumberOfCallsInLog(["beginPath"]); | |
| 170 clearContextResourceLog(); | |
| 171 } | |
| 172 | |
| 173 function testMatrixMethods() | |
| 174 { | |
| 175 assertNumberOfCallsInLog([]); | |
| 176 ctx.save(); | |
| 177 ctx.translate(100, 200); | |
| 178 ctx.scale(0.9, 0.9); | |
| 179 ctx.rotate(0.2); | |
| 180 ctx.translate(-100, -200); | |
| 181 assertNumberOfCallsInLog(["save", "translate", "scale", "rotate", "translate
"]); | |
| 182 ctx.setTransform(1, 2, 3, 4, 5, 6); | |
| 183 ctx.rotate(0.3); | |
| 184 assertNumberOfCallsInLog(["save", "setTransform", "rotate"]); | |
| 185 ctx.resetTransform(); | |
| 186 assertNumberOfCallsInLog(["save", "resetTransform"]); | |
| 187 ctx.restore(); | |
| 188 assertNumberOfCallsInLog([]); | |
| 189 } | |
| 190 | |
| 191 function testMatrixMethodsWithPathMethods() | |
| 192 { | |
| 193 assertNumberOfCallsInLog([]); | |
| 194 ctx.save(); | |
| 195 ctx.translate(100, 200); | |
| 196 ctx.scale(0.9, 0.9); | |
| 197 ctx.rotate(0.2); | |
| 198 ctx.translate(-100, -200); | |
| 199 assertNumberOfCallsInLog(["save", "translate", "scale", "rotate", "translate
"]); | |
| 200 ctx.beginPath(); | |
| 201 ctx.rect(1, 1, 10, 10); | |
| 202 ctx.translate(1, 2); | |
| 203 assertNumberOfCallsInLog(["save", "translate", "scale", "rotate", "translate
", "beginPath", "rect", "translate"]); | |
| 204 ctx.restore(); | |
| 205 assertNumberOfCallsInLog(["save", "translate", "scale", "rotate", "translate
", "beginPath", "rect", "restore"]); | |
| 206 ctx.beginPath(); | |
| 207 assertNumberOfCallsInLog(["beginPath"]); | |
| 208 clearContextResourceLog(); | |
| 209 } | |
| 210 | |
| 211 function testNestedSaveRestoreCalls() | |
| 212 { | |
| 213 assertNumberOfCallsInLog([]); | |
| 214 ctx.save(); | |
| 215 ctx.translate(100, 200); | |
| 216 ctx.beginPath(); | |
| 217 ctx.rect(1, 1, 10, 10); | |
| 218 ctx.clip(); | |
| 219 ctx.save(); | |
| 220 ctx.rotate(0.2); | |
| 221 callPathMethods(); | |
| 222 assertNumberOfCallsInLog(["save", "translate", "beginPath", "rect", "clip",
"save", "rotate", "beginPath", "moveTo", "lineTo"]); | |
| 223 ctx.restore(); | |
| 224 assertNumberOfCallsInLog(["save", "translate", "beginPath", "rect", "clip",
"save", "rotate", "beginPath", "moveTo", "lineTo", "restore"]); | |
| 225 ctx.restore(); | |
| 226 assertNumberOfCallsInLog(["save", "translate", "save", "rotate", "beginPath"
, "moveTo", "lineTo", "restore", "restore"]); | |
| 227 ctx.restore(); | |
| 228 assertNumberOfCallsInLog(["save", "translate", "save", "rotate", "beginPath"
, "moveTo", "lineTo", "restore", "restore"]); // no effect | |
| 229 ctx.setTransform(1, 2, 3, 4, 5, 6); | |
| 230 assertNumberOfCallsInLog(["save", "translate", "save", "rotate", "beginPath"
, "moveTo", "lineTo", "restore", "restore", "setTransform"]); // nothing to remo
ve from the log | |
| 231 ctx.beginPath(); | |
| 232 assertNumberOfCallsInLog(["setTransform", "beginPath"]); | |
| 233 clearContextResourceLog(); | |
| 234 } | |
| 235 | |
| 236 function testDeepNestedSaveRestoreCalls() | |
| 237 { | |
| 238 assertNumberOfCallsInLog([]); | |
| 239 var expected = []; | |
| 240 for (var i = 0; i < 10; ++i) { | |
| 241 ctx.save(); | |
| 242 ctx.translate(1, 2); | |
| 243 expected.push("save", "translate"); | |
| 244 } | |
| 245 assertNumberOfCallsInLog(expected); | |
| 246 callPathMethods(); | |
| 247 expected.push("beginPath", "moveTo", "lineTo"); | |
| 248 assertNumberOfCallsInLog(expected); | |
| 249 for (var i = 0; i < 10; ++i) { | |
| 250 ctx.rotate(1); | |
| 251 ctx.scale(2, 2); | |
| 252 ctx.clip(); | |
| 253 ctx.transform(3, 3, 3, 3, 3, 3); | |
| 254 ctx.restore(); | |
| 255 expected.push("restore"); | |
| 256 assertNumberOfCallsInLog(expected); | |
| 257 } | |
| 258 assertNumberOfCallsInLog(expected); | |
| 259 ctx.beginPath(); | |
| 260 assertNumberOfCallsInLog(["beginPath"]); // now clear up the log | |
| 261 clearContextResourceLog(); | |
| 262 } | |
| 263 | |
| 264 function createAndRunCanvas2DProgram() | |
| 265 { | |
| 266 ctx = createCanvas2DContext(); | |
| 267 console.assert(ctx, "Failed to create 2D context"); | |
| 268 | |
| 269 ctxResource = ctx["__resourceObject"]; | |
| 270 console.assert(ctxResource, "2D context is not wrapped"); | |
| 271 | |
| 272 rawCtx = ctxResource.wrappedObject(); | |
| 273 console.assert(rawCtx, "No raw 2D context found"); | |
| 274 console.assert(ctx !== rawCtx, "Proxy and RAW contexts should not be the sam
e"); | |
| 275 | |
| 276 testDrawingAttributes(); | |
| 277 testSaveRestoreSequence(); | |
| 278 testPathMethodsSequence(); | |
| 279 testClipMethods(); | |
| 280 testMatrixMethods(); | |
| 281 testMatrixMethodsWithPathMethods(); | |
| 282 testNestedSaveRestoreCalls(); | |
| 283 testDeepNestedSaveRestoreCalls(); | |
| 284 | |
| 285 return "SUCCESS"; | |
| 286 } | |
| 287 | |
| 288 function test() | |
| 289 { | |
| 290 InspectorTest.enableCanvasAgent(step1); | |
| 291 function step1() | |
| 292 { | |
| 293 InspectorTest.evaluateInPage("createAndRunCanvas2DProgram()", step2); | |
| 294 } | |
| 295 function step2(error) | |
| 296 { | |
| 297 InspectorTest.assertEquals("SUCCESS", error.description); | |
| 298 InspectorTest.completeTest(); | |
| 299 } | |
| 300 } | |
| 301 | |
| 302 </script> | |
| 303 </head> | |
| 304 <body onload="runTest()"> | |
| 305 <p> | |
| 306 Tests Canvas 2D capturing basics. | |
| 307 </p> | |
| 308 <a href="https://bugs.webkit.org/show_bug.cgi?id=100752">Bug 100752</a> | |
| 309 | |
| 310 </body> | |
| 311 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1073863003:
DevTools: remove Canvas profiler from DevTools source base. See details in the bug. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master