@@ -127,25 +127,37 @@ describe('Image', function () {
127
127
128
128
img . onload = ( ) => { onloadCalled += 1 }
129
129
130
+ // it's should be png_clock, because when you change the img.src, it doesn't load the image immediately.
130
131
img . src = png_checkers
131
132
assert . strictEqual ( img . src , png_checkers )
132
133
assert . strictEqual ( img . complete , true )
133
- assert . strictEqual ( img . width , 2 )
134
- assert . strictEqual ( img . height , 2 )
134
+
135
+ // it's still png_clock
136
+ assert . strictEqual ( img . width , 320 )
137
+ assert . strictEqual ( img . height , 320 )
135
138
136
139
img . src = png_clock
137
140
assert . strictEqual ( img . src , png_clock )
138
141
assert . strictEqual ( true , img . complete )
139
142
assert . strictEqual ( 320 , img . width )
140
143
assert . strictEqual ( 320 , img . height )
141
144
142
- assert . strictEqual ( onloadCalled , 2 )
145
+ // called in nextTick
146
+ assert . strictEqual ( onloadCalled , 0 )
143
147
144
148
onloadCalled = 0
145
149
img . onload = ( ) => { onloadCalled += 1 }
146
150
151
+ // reset src will clear the old src changes.
147
152
img . src = png_clock
148
- assert . strictEqual ( onloadCalled , 1 )
153
+ assert . strictEqual ( onloadCalled , 0 )
154
+
155
+ return new Promise ( resolve => {
156
+ setTimeout ( ( ) => {
157
+ assert . strictEqual ( onloadCalled , 1 )
158
+ resolve ( ) ;
159
+ } , 0 )
160
+ } ) ;
149
161
} )
150
162
} )
151
163
@@ -189,28 +201,47 @@ describe('Image', function () {
189
201
img . src = `${ png_clock } s2`
190
202
assert . strictEqual ( img . src , `${ png_clock } s2` )
191
203
192
- assert . strictEqual ( onerrorCalled , 2 )
204
+ // it's not synchronized call, onerror will be invoked in async steps.
205
+ assert . strictEqual ( onerrorCalled , 0 )
193
206
194
207
onerrorCalled = 0
195
208
img . onerror = ( ) => { onerrorCalled += 1 }
196
209
197
210
img . src = `${ png_clock } s3`
198
211
assert . strictEqual ( img . src , `${ png_clock } s3` )
199
212
200
- assert . strictEqual ( onerrorCalled , 1 )
213
+ assert . strictEqual ( onerrorCalled , 0 )
201
214
assert . strictEqual ( onloadCalled , 0 )
215
+
216
+ return new Promise ( resolve => {
217
+ setTimeout ( ( ) => {
218
+ assert . strictEqual ( onerrorCalled , 1 )
219
+ assert . strictEqual ( onloadCalled , 0 )
220
+ resolve ( ) ;
221
+ } ) ;
222
+ } ) ;
202
223
} )
203
224
} )
204
225
205
226
it ( 'Image#{width,height}' , function ( ) {
206
227
return loadImage ( png_clock ) . then ( ( img ) => {
207
228
img . src = ''
208
- assert . strictEqual ( img . width , 0 )
209
- assert . strictEqual ( img . height , 0 )
210
-
211
- img . src = png_clock
212
- assert . strictEqual ( img . width , 320 )
213
- assert . strictEqual ( img . height , 320 )
229
+ return new Promise ( ( resolve ) => {
230
+ setTimeout ( ( ) => {
231
+ assert . strictEqual ( img . width , 0 )
232
+ assert . strictEqual ( img . height , 0 )
233
+ resolve ( ) ;
234
+ } )
235
+ } ) . then ( ( ) => {
236
+ img . src = png_clock
237
+ return new Promise ( ( resolve ) => {
238
+ setTimeout ( ( ) => {
239
+ assert . strictEqual ( img . width , 320 )
240
+ assert . strictEqual ( img . height , 320 )
241
+ resolve ( )
242
+ } )
243
+ } )
244
+ } )
214
245
} )
215
246
} )
216
247
@@ -221,11 +252,17 @@ describe('Image', function () {
221
252
img . onerror = ( ) => { onerrorCalled += 1 }
222
253
223
254
img . src = Buffer . alloc ( 0 )
224
- assert . strictEqual ( img . width , 0 )
225
- assert . strictEqual ( img . height , 0 )
226
- assert . strictEqual ( img . complete , true )
227
255
228
- assert . strictEqual ( onerrorCalled , 1 )
256
+ return new Promise ( ( resolve ) => {
257
+ setTimeout ( ( ) => {
258
+ assert . strictEqual ( img . width , 0 )
259
+ assert . strictEqual ( img . height , 0 )
260
+ assert . strictEqual ( img . complete , true )
261
+
262
+ assert . strictEqual ( onerrorCalled , 1 )
263
+ resolve ( )
264
+ } )
265
+ } )
229
266
} )
230
267
} )
231
268
@@ -236,23 +273,34 @@ describe('Image', function () {
236
273
img . onload = ( ) => { onloadCalled += 1 }
237
274
238
275
img . src = png_checkers
239
- assert . strictEqual ( img . src , png_checkers )
240
- assert . strictEqual ( img . complete , true )
241
- assert . strictEqual ( img . width , 2 )
242
- assert . strictEqual ( img . height , 2 )
243
-
244
- assert . strictEqual ( onloadCalled , 1 )
245
-
246
- onloadCalled = 0
247
- img . onload = null
248
-
249
- img . src = png_clock
250
- assert . strictEqual ( img . src , png_clock )
251
- assert . strictEqual ( img . complete , true )
252
- assert . strictEqual ( img . width , 320 )
253
- assert . strictEqual ( img . height , 320 )
254
276
255
- assert . strictEqual ( onloadCalled , 0 )
277
+ return new Promise ( ( resolve ) => {
278
+ setTimeout ( ( ) => {
279
+ assert . strictEqual ( img . src , png_checkers )
280
+ assert . strictEqual ( img . complete , true )
281
+ assert . strictEqual ( img . width , 2 )
282
+ assert . strictEqual ( img . height , 2 )
283
+
284
+ assert . strictEqual ( onloadCalled , 1 )
285
+
286
+ onloadCalled = 0
287
+ img . onload = null
288
+ img . src = png_clock
289
+ resolve ( )
290
+ } )
291
+ } ) . then ( ( ) => {
292
+ return new Promise ( ( resolve ) => {
293
+ setTimeout ( ( ) => {
294
+ assert . strictEqual ( img . src , png_clock )
295
+ assert . strictEqual ( img . complete , true )
296
+ assert . strictEqual ( img . width , 320 )
297
+ assert . strictEqual ( img . height , 320 )
298
+
299
+ assert . strictEqual ( onloadCalled , 0 )
300
+ resolve ( )
301
+ } )
302
+ } )
303
+ } )
256
304
} )
257
305
} )
258
306
@@ -265,21 +313,31 @@ describe('Image', function () {
265
313
img . onerror = ( ) => { onerrorCalled += 1 }
266
314
267
315
img . src = `${ png_clock } s1`
316
+
268
317
assert . strictEqual ( img . src , `${ png_clock } s1` )
269
318
270
319
img . src = `${ png_clock } s2`
271
320
assert . strictEqual ( img . src , `${ png_clock } s2` )
272
321
273
- assert . strictEqual ( onerrorCalled , 2 )
274
322
275
- onerrorCalled = 0
276
- img . onerror = null
277
-
278
- img . src = `${ png_clock } s3`
279
- assert . strictEqual ( img . src , `${ png_clock } s3` )
280
-
281
- assert . strictEqual ( onloadCalled , 0 )
282
- assert . strictEqual ( onerrorCalled , 0 )
323
+ return new Promise ( ( resolve ) => {
324
+ setTimeout ( ( ) => {
325
+ assert . strictEqual ( onerrorCalled , 1 )
326
+ resolve ( )
327
+ } )
328
+ } ) . then ( ( ) => new Promise ( resolve => {
329
+ onerrorCalled = 0
330
+ img . onerror = null
331
+
332
+ img . src = `${ png_clock } s3`
333
+ assert . strictEqual ( img . src , `${ png_clock } s3` )
334
+
335
+ setTimeout ( ( ) => {
336
+ assert . strictEqual ( onloadCalled , 0 )
337
+ assert . strictEqual ( onerrorCalled , 0 )
338
+ resolve ( )
339
+ } )
340
+ } ) )
283
341
} )
284
342
} )
285
343
@@ -386,7 +444,7 @@ describe('Image', function () {
386
444
255 , 0 , 0 , 127 ,
387
445
255 , 255 , 255 , 127 ,
388
446
] ) ;
389
-
447
+
390
448
done ( ) ;
391
449
} ;
392
450
@@ -404,7 +462,7 @@ describe('Image', function () {
404
462
testImgd ( img , [
405
463
255 , 0 , 0 , 255 ,
406
464
] ) ;
407
-
465
+
408
466
done ( ) ;
409
467
} ;
410
468
@@ -423,7 +481,7 @@ describe('Image', function () {
423
481
255 , 0 , 0 , 255 ,
424
482
0 , 255 , 0 , 255 ,
425
483
] ) ;
426
-
484
+
427
485
done ( ) ;
428
486
} ;
429
487
0 commit comments