Skip to content

Commit ba054dd

Browse files
refactor DOMReady specs
1 parent 915eb47 commit ba054dd

File tree

5 files changed

+202
-24
lines changed

5 files changed

+202
-24
lines changed

Specs/Utilities/DOMReady.js

+90-24
Original file line numberDiff line numberDiff line change
@@ -6,30 +6,96 @@ provides: ~
66
...
77
*/
88

9-
/* todo
10-
document.addListener = function(type, fn){
11-
if (this.addEventListener) this.addEventListener(type, fn, false);
12-
else this.attachEvent('on' + type, fn);
13-
return this;
14-
};
15-
16-
document.removeListener = function(type, fn){
17-
if (this.removeEventListener) this.removeEventListener(type, fn, false);
18-
else this.detachEvent('on' + type, fn);
19-
return this;
20-
};
21-
22-
23-
window.fireEvent =
24-
document.fireEvent = function(type){
25-
if (type == 'domready')
26-
for (var i = 0; i < domreadyCallbacks.length; ++i){
9+
describe("DOMReady", function(){
10+
11+
var win, frame, cb, ready;
12+
function checkStatus(){
13+
ready = win && win.callbackFired;
14+
if (ready) cb();
15+
return ready;
2716
}
28-
domreadyCallbacks[i]();
29-
};
3017

31-
window.addEvent = function(){};
18+
function newFrame(url){
19+
var iframe = new IFrame({
20+
src: 'specsserver/' + url
21+
});
22+
document.getElement('body').adopt(iframe);
23+
return iframe;
24+
}
25+
26+
beforeEach(function(){
27+
cb = jasmine.createSpy('DOMReady!');
28+
});
29+
30+
afterEach(function(){
31+
frame.destroy();
32+
win = cb = frame = ready = null;
33+
});
34+
35+
it('should fire DOMReady, after flushing, when the DOM is ready', function(){
36+
frame = newFrame('foo?assets=flush');
37+
frame.addEvent('load', function(){
38+
win = frame.contentWindow;
39+
expect(win.moments[0]).toEqual('loading');
40+
expect(win.moments[1]).toEqual('loading');
41+
expect(win.moments[2] == 'interactive' || win.moments[2] == 'complete').toBeTruthy();
42+
});
43+
44+
waitsFor(function(){
45+
return checkStatus();
46+
}, "the iframe to load", 8000);
47+
runs(function(){
48+
expect(cb).toHaveBeenCalled();
49+
});
50+
});
51+
52+
it('should fire DOMReady when the DOM is ready', function(){
53+
frame = newFrame('DOMReady/DOMReady.head.html');
54+
frame.addEvent('load', function(){
55+
win = frame.contentWindow;
56+
});
57+
waitsFor(function(){
58+
return checkStatus();
59+
}, "the iframe to load", 1500);
60+
runs(function(){
61+
expect(cb).toHaveBeenCalled();
62+
});
63+
});
64+
65+
it('should fire DOMReady when a new `addEvent("domready"` is added', function(){
66+
frame = newFrame('DOMReady/DOMReady.onAdd.html');
67+
frame.addEvent('load', function(){
68+
win = frame.contentWindow;
69+
win.addEvent('domready', win.callback);
70+
});
71+
waitsFor(function(){
72+
return checkStatus();
73+
}, "the iframe to load", 1500);
74+
runs(function(){
75+
expect(cb).toHaveBeenCalled();
76+
});
77+
});
78+
79+
it('should fire when MooTools was loaded into a already-ready page', function(){
80+
frame = newFrame('DOMReady/DOMReady.delayed.html');
81+
var ready;
82+
frame.addEvent('load', function(){
83+
win = frame.contentWindow;
84+
expect(win.MooTools).toBeFalsy(); // because MooTools should not be loaded yet
85+
var i = setInterval(function(){
86+
if (win.addEvent && win.callback){
87+
win.addEvent('domready', win.callback);
88+
if (ready) clearInterval(i);
89+
}
90+
}, 50);
91+
});
92+
waitsFor(function(){
93+
return checkStatus();
94+
}, "the iframe to load and MooTools to be deployed", 6000);
95+
runs(function(){
96+
expect(cb).toHaveBeenCalled();
97+
});
98+
});
99+
100+
});
32101

33-
var Element = this.Element || {};
34-
Element.Events = {};
35-
*/

Tests/DOMReady/DOMReady.delayed.html

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
5+
<title>Add MooTools when page is already ready</title>
6+
</head>
7+
<body>
8+
9+
<script>
10+
function callback(){
11+
window.callbackFired = true;
12+
}
13+
14+
function addScript(path){
15+
var script = document.createElement('script');
16+
script.type = 'text/javascript';
17+
script.src = path;
18+
document.getElementsByTagName('head')[0].appendChild(script);
19+
}
20+
21+
window.callbackFired = false;
22+
window.onload = function(){
23+
addScript('mootoolsPath.js');
24+
}
25+
</script>
26+
</body>
27+
</html>

Tests/DOMReady/DOMReady.head.html

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
5+
<title>Normal DOMReady scenario</title>
6+
7+
<script src="mootoolsPath.js" type="text/javascript"></script>
8+
</head>
9+
<body>
10+
11+
<script>
12+
function callback(){
13+
window.callbackFired = true;
14+
}
15+
16+
window.callbackFired = false;
17+
window.addEvent('domready', callback);
18+
</script>
19+
</body>
20+
</html>
21+

Tests/DOMReady/DOMReady.onAdd.html

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
5+
<title>DOMReady added when page is already loaded</title>
6+
7+
<script src="mootoolsPath.js" type="text/javascript"></script>
8+
</head>
9+
<body>
10+
11+
<script>
12+
function callback(){
13+
window.callbackFired = true;
14+
}
15+
16+
window.callbackFired = false;
17+
</script>
18+
</body>
19+
</html>

Tests/assets.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
"use strict";
2+
3+
// custom behaviours to test
4+
var assets = {
5+
6+
flush: function(req, res, src){
7+
8+
var headString = '' +
9+
'<html>' +
10+
'<head>' +
11+
'<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />' +
12+
'<title>Flushed page scenario</title>' +
13+
'<script src="' + src + '.js" type="text/javascript"></script>' +
14+
'<script>' +
15+
'window.moments = [];' +
16+
'moments.push(document.readyState);' +
17+
'function callback(){' +
18+
'window.callbackFired = true;' +
19+
'moments.push(document.readyState);' +
20+
'}' +
21+
'window.callbackFired = false;' +
22+
'window.addEvent("domready", callback);' +
23+
'</script>' +
24+
'</head>';
25+
var bodyString = '' +
26+
'<body>' +
27+
'<div>body added...</div>' +
28+
'<script>' +
29+
'moments.push(document.readyState);' +
30+
'</script>' +
31+
'</body>';
32+
var endString = '</html>';
33+
34+
res.writeHead(200, {'Content-Type': 'text/html'});
35+
res.write(headString);
36+
setTimeout(function() {
37+
res.write(bodyString);
38+
setTimeout(function() {
39+
res.end(endString);
40+
}, 2000);
41+
}, 2000);
42+
}
43+
}
44+
45+
module.exports = assets;

0 commit comments

Comments
 (0)