Skip to content

Commit 23a5bbb

Browse files
blueimpblueimp
committed
Use mocha+expect.js as testing framework.
1 parent 58987fb commit 23a5bbb

File tree

2 files changed

+170
-153
lines changed

2 files changed

+170
-153
lines changed

‎test/index.html‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,17 +15,21 @@
1515
<head>
1616
<meta charset="utf-8">
1717
<title>JavaScript Load Image Test</title>
18-
<link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css">
18+
<link rel="stylesheet" href="http://blueimp.github.com/cdn/css/mocha.min.css">
1919
</head>
2020
<body>
21-
<h1 id="qunit-header">JavaScript Load Image Test</h1>
22-
<h2 id="qunit-banner"></h2>
23-
<div id="qunit-testrunner-toolbar"></div>
24-
<h2 id="qunit-userAgent"></h2>
25-
<ol id="qunit-tests"></ol>
26-
<div id="qunit-fixture"></div>
21+
<div id="mocha"></div>
22+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
23+
<script src="http://blueimp.github.com/cdn/js/mocha.min.js"></script>
24+
<script src="http://blueimp.github.com/cdn/js/expect.min.js"></script>
25+
<script>
26+
mocha.setup('bdd');
27+
$(function () {
28+
mocha.run();
29+
});
30+
</script>
31+
<script type="text/html" id="template">{%=o.value%}</script>
2732
<script src="../load-image.js"></script>
28-
<script src="http://code.jquery.com/qunit/git/qunit.js"></script>
2933
<script src="base64-binary.js"></script>
3034
<script src="test.js"></script>
3135
</body>

‎test/test.js‎

Lines changed: 158 additions & 145 deletions
Original file line numberDiff line numberDiff line change
@@ -9,159 +9,172 @@
99
* http://www.opensource.org/licenses/MIT
1010
*/
1111

12-
(function ($) {
12+
/*global window, describe, it, expect, require */
13+
14+
(function (expect, loadImage) {
1315
'use strict';
1416

1517
// 80x60px GIF image (color black, base64 data):
1618
var b64Data = 'R0lGODdhUAA8AIABAAAAAP///ywAAAAAUAA8AAACS4SPqcvtD6' +
1719
'OctNqLs968+w+G4kiW5omm6sq27gvH8kzX9o3n+s73/g8MCofE' +
1820
'ovGITCqXzKbzCY1Kp9Sq9YrNarfcrvcLDovH5PKsAAA7',
1921
imageUrl = 'data:image/gif;base64,' + b64Data,
20-
BlobBuilder = $.MozBlobBuilder || $.WebKitBlobBuilder || $.BlobBuilder,
22+
BlobBuilder = window.MozBlobBuilder || window.WebKitBlobBuilder || window.BlobBuilder,
2123
builder = new BlobBuilder(),
2224
blob;
23-
builder.append($.Base64Binary.decodeArrayBuffer(b64Data));
25+
builder.append(window.Base64Binary.decodeArrayBuffer(b64Data));
2426
blob = builder.getBlob('image/gif');
2527

26-
$.module('Loading');
27-
28-
$.test('Return the img element or FileReader object to allow aborting the image load', function () {
29-
var img = $.loadImage(blob, function () {});
30-
$.strictEqual(img && typeof img.onload, 'function');
31-
});
32-
33-
$.asyncTest('Load image url', function () {
34-
$.ok($.loadImage(imageUrl, function (img) {
35-
$.start();
36-
$.strictEqual(img.width, 80);
37-
$.strictEqual(img.height, 60);
38-
}));
39-
});
40-
41-
$.asyncTest('Load image blob', function () {
42-
$.ok($.loadImage(blob, function (img) {
43-
$.start();
44-
$.strictEqual(img.width, 80);
45-
$.strictEqual(img.height, 60);
46-
}));
47-
});
48-
49-
$.asyncTest('Return image loading error to callback', function () {
50-
$.ok($.loadImage('404', function (img) {
51-
$.start();
52-
$.ok(img instanceof $.Event);
53-
$.strictEqual(img.type, 'error');
54-
}));
55-
});
56-
57-
$.module('Scaling');
58-
59-
$.asyncTest('Scale to options.maxWidth', function () {
60-
$.ok($.loadImage(blob, function (img) {
61-
$.start();
62-
$.strictEqual(img.width, 40);
63-
$.strictEqual(img.height, 30);
64-
}, {maxWidth: 40}));
65-
});
66-
67-
$.asyncTest('Scale to options.maxHeight', function () {
68-
$.ok($.loadImage(blob, function (img) {
69-
$.start();
70-
$.strictEqual(img.width, 20);
71-
$.strictEqual(img.height, 15);
72-
}, {maxHeight: 15}));
73-
});
74-
75-
$.asyncTest('Scale to options.minWidth', function () {
76-
$.ok($.loadImage(blob, function (img) {
77-
$.start();
78-
$.strictEqual(img.width, 160);
79-
$.strictEqual(img.height, 120);
80-
}, {minWidth: 160}));
81-
});
82-
83-
$.asyncTest('Scale to options.minHeight', function () {
84-
$.ok($.loadImage(blob, function (img) {
85-
$.start();
86-
$.strictEqual(img.width, 320);
87-
$.strictEqual(img.height, 240);
88-
}, {minHeight: 240}));
89-
});
90-
91-
$.asyncTest('Scale to options.minWidth but respect options.maxWidth', function () {
92-
$.ok($.loadImage(blob, function (img) {
93-
$.start();
94-
$.strictEqual(img.width, 160);
95-
$.strictEqual(img.height, 120);
96-
}, {minWidth: 240, maxWidth: 160}));
97-
});
98-
99-
$.asyncTest('Scale to options.minHeight but respect options.maxHeight', function () {
100-
$.ok($.loadImage(blob, function (img) {
101-
$.start();
102-
$.strictEqual(img.width, 160);
103-
$.strictEqual(img.height, 120);
104-
}, {minHeight: 180, maxHeight: 120}));
105-
});
106-
107-
$.asyncTest('Scale to options.minWidth but respect options.maxHeight', function () {
108-
$.ok($.loadImage(blob, function (img) {
109-
$.start();
110-
$.strictEqual(img.width, 160);
111-
$.strictEqual(img.height, 120);
112-
}, {minWidth: 240, maxHeight: 120}));
113-
});
114-
115-
$.asyncTest('Scale to options.minHeight but respect options.maxWidth', function () {
116-
$.ok($.loadImage(blob, function (img) {
117-
$.start();
118-
$.strictEqual(img.width, 160);
119-
$.strictEqual(img.height, 120);
120-
}, {minHeight: 180, maxWidth: 160}));
121-
});
122-
123-
$.asyncTest('Do not scale to max settings without min settings', function () {
124-
$.ok($.loadImage(blob, function (img) {
125-
$.start();
126-
$.strictEqual(img.width, 80);
127-
$.strictEqual(img.height, 60);
128-
}, {maxWidth: 160, maxHeight: 120}));
129-
});
130-
131-
$.asyncTest('Do not scale to min settings without max settings', function () {
132-
$.ok($.loadImage(blob, function (img) {
133-
$.start();
134-
$.strictEqual(img.width, 80);
135-
$.strictEqual(img.height, 60);
136-
}, {minWidth: 40, minHeight: 30}));
137-
});
138-
139-
$.module('Canvas');
140-
141-
$.asyncTest('Return img element to callback if options.canvas is not true', function () {
142-
$.ok($.loadImage(blob, function (img) {
143-
$.start();
144-
$.ok(!img.getContext);
145-
$.strictEqual(img.nodeName.toLowerCase(), 'img');
146-
}));
147-
});
148-
149-
$.asyncTest('Return canvas element to callback if options.canvas is true', function () {
150-
$.ok($.loadImage(blob, function (img) {
151-
$.start();
152-
$.ok(img.getContext);
153-
$.strictEqual(img.nodeName.toLowerCase(), 'canvas');
154-
}, {canvas: true}));
155-
});
156-
157-
$.asyncTest('Return scaled canvas element to callback', function () {
158-
$.ok($.loadImage(blob, function (img) {
159-
$.start();
160-
$.ok(img.getContext);
161-
$.strictEqual(img.nodeName.toLowerCase(), 'canvas');
162-
$.strictEqual(img.width, 40);
163-
$.strictEqual(img.height, 30);
164-
}, {canvas: true, maxWidth: 40}));
165-
});
166-
167-
}(this));
28+
describe('Loading', function () {
29+
30+
it('Return the img element or FileReader object to allow aborting the image load', function () {
31+
var img = loadImage(blob, function () {});
32+
expect(img).to.be.an(Object);
33+
expect(img.onload).to.be.a('function');
34+
expect(img.onerror).to.be.a('function');
35+
});
36+
37+
it('Load image url', function (done) {
38+
expect(loadImage(imageUrl, function (img) {
39+
done();
40+
expect(img.width).to.be(80);
41+
expect(img.height).to.be(60);
42+
})).to.be.ok();
43+
});
44+
45+
it('Load image blob', function (done) {
46+
expect(loadImage(blob, function (img) {
47+
done();
48+
expect(img.width).to.be(80);
49+
expect(img.height).to.be(60);
50+
})).to.be.ok();
51+
});
52+
53+
it('Return image loading error to callback', function (done) {
54+
expect(loadImage('404', function (img) {
55+
done();
56+
expect(img).to.be.a(window.Event);
57+
expect(img.type).to.be('error');
58+
})).to.be.ok();
59+
});
60+
61+
});
62+
63+
describe('Scaling', function () {
64+
65+
it('Scale to options.maxWidth', function (done) {
66+
expect(loadImage(blob, function (img) {
67+
done();
68+
expect(img.width).to.be(40);
69+
expect(img.height).to.be(30);
70+
}, {maxWidth: 40})).to.be.ok();
71+
});
72+
73+
it('Scale to options.maxHeight', function (done) {
74+
expect(loadImage(blob, function (img) {
75+
done();
76+
expect(img.width).to.be(20);
77+
expect(img.height).to.be(15);
78+
}, {maxHeight: 15})).to.be.ok();
79+
});
80+
81+
it('Scale to options.minWidth', function (done) {
82+
expect(loadImage(blob, function (img) {
83+
done();
84+
expect(img.width).to.be(160);
85+
expect(img.height).to.be(120);
86+
}, {minWidth: 160})).to.be.ok();
87+
});
88+
89+
it('Scale to options.minHeight', function (done) {
90+
expect(loadImage(blob, function (img) {
91+
done();
92+
expect(img.width).to.be(320);
93+
expect(img.height).to.be(240);
94+
}, {minHeight: 240})).to.be.ok();
95+
});
96+
97+
it('Scale to options.minWidth but respect options.maxWidth', function (done) {
98+
expect(loadImage(blob, function (img) {
99+
done();
100+
expect(img.width).to.be(160);
101+
expect(img.height).to.be(120);
102+
}, {minWidth: 240, maxWidth: 160})).to.be.ok();
103+
});
104+
105+
it('Scale to options.minHeight but respect options.maxHeight', function (done) {
106+
expect(loadImage(blob, function (img) {
107+
done();
108+
expect(img.width).to.be(160);
109+
expect(img.height).to.be(120);
110+
}, {minHeight: 180, maxHeight: 120})).to.be.ok();
111+
});
112+
113+
it('Scale to options.minWidth but respect options.maxHeight', function (done) {
114+
expect(loadImage(blob, function (img) {
115+
done();
116+
expect(img.width).to.be(160);
117+
expect(img.height).to.be(120);
118+
}, {minWidth: 240, maxHeight: 120})).to.be.ok();
119+
});
120+
121+
it('Scale to options.minHeight but respect options.maxWidth', function (done) {
122+
expect(loadImage(blob, function (img) {
123+
done();
124+
expect(img.width).to.be(160);
125+
expect(img.height).to.be(120);
126+
}, {minHeight: 180, maxWidth: 160})).to.be.ok();
127+
});
128+
129+
it('Do not scale to max settings without min settings', function (done) {
130+
expect(loadImage(blob, function (img) {
131+
done();
132+
expect(img.width).to.be(80);
133+
expect(img.height).to.be(60);
134+
}, {maxWidth: 160, maxHeight: 120})).to.be.ok();
135+
});
136+
137+
it('Do not scale to min settings without max settings', function (done) {
138+
expect(loadImage(blob, function (img) {
139+
done();
140+
expect(img.width).to.be(80);
141+
expect(img.height).to.be(60);
142+
}, {minWidth: 40, minHeight: 30})).to.be.ok();
143+
});
144+
145+
});
146+
147+
describe('Canvas', function () {
148+
149+
it('Return img element to callback if options.canvas is not true', function (done) {
150+
expect(loadImage(blob, function (img) {
151+
done();
152+
expect(img.getContext).to.not.be.ok();
153+
expect(img.nodeName.toLowerCase()).to.be('img');
154+
})).to.be.ok();
155+
});
156+
157+
it('Return canvas element to callback if options.canvas is true', function (done) {
158+
expect(loadImage(blob, function (img) {
159+
done();
160+
expect(img.getContext).to.be.ok();
161+
expect(img.nodeName.toLowerCase()).to.be('canvas');
162+
}, {canvas: true})).to.be.ok();
163+
});
164+
165+
it('Return scaled canvas element to callback', function (done) {
166+
expect(loadImage(blob, function (img) {
167+
done();
168+
expect(img.getContext).to.be.ok();
169+
expect(img.nodeName.toLowerCase()).to.be('canvas');
170+
expect(img.width).to.be(40);
171+
expect(img.height).to.be(30);
172+
}, {canvas: true, maxWidth: 40})).to.be.ok();
173+
});
174+
175+
});
176+
177+
}(
178+
this.expect || require('expect.js'),
179+
this.loadImage || require('../load-image').loadImage
180+
));

0 commit comments

Comments
 (0)