Updated
This commit is contained in:
Éric Lemoine
317
master/examples/onloads.html
Normal file
317
master/examples/onloads.html
Normal file
@@ -0,0 +1,317 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>Sample Dojo / Dijit Page</title>
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position:absolute;
|
||||
left:-9999px;
|
||||
width:9000px;
|
||||
overflow:hidden;
|
||||
}
|
||||
#randomimage {
|
||||
height:100px;
|
||||
}
|
||||
</style>
|
||||
<!-- load Dojo -->
|
||||
<script>var djConfig = { isDebug:true }</script>
|
||||
<script src="../../../dojo/dojo.js"></script>
|
||||
<script type="text/javascript">
|
||||
dojo.require("doh.runner");
|
||||
dojo.addOnLoad(function(){
|
||||
|
||||
doh.register("testUi",
|
||||
[
|
||||
{
|
||||
name:"basic onload",
|
||||
timeout:7000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
try{
|
||||
var n = dojo.create("img", null, "container");
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
dojo.connect(n, "onload", function(e){
|
||||
try{
|
||||
t.is("load", e.type);
|
||||
t.is(359, n.height, "height mismatch");
|
||||
t.is(359, n.width, "width mismatch");
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
return;
|
||||
}
|
||||
d.callback(true);
|
||||
});
|
||||
|
||||
n.src = "images/square.jpg";
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"basic onload, probably cached",
|
||||
timeout:17000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
try{
|
||||
var n = dojo.create("img", null, "container");
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
dojo.connect(n, "onload", function(e){
|
||||
try{
|
||||
t.is("load", e.type);
|
||||
t.is(359, n.height);
|
||||
t.is(359, n.width);
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
return;
|
||||
}
|
||||
d.callback(true);
|
||||
});
|
||||
n.src = "images/square.jpg";
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"set src after long delay",
|
||||
timeout:5000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var n = dojo.place("<img id='bar'/>", "container");
|
||||
dojo.connect(n, "onload", function(){
|
||||
t.is(375, n.height);
|
||||
t.is(500, n.width);
|
||||
d.callback(true);
|
||||
})
|
||||
|
||||
setTimeout(function(){
|
||||
n.src = "images/chris1_lg.jpg";
|
||||
}, 2000)
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"test re-calling of onload",
|
||||
timeout:9000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var called = 0;
|
||||
var n = dojo.create("img", null, "container");
|
||||
|
||||
dojo.connect(n, "onload", function(e){
|
||||
called++;
|
||||
if(called == 2){
|
||||
d.callback(true);
|
||||
}
|
||||
});
|
||||
|
||||
n.src = "images/chris1_sm.jpg";
|
||||
|
||||
setTimeout(function(){
|
||||
n.src = "images/chris1_sm.jpg?" + (new Date().getTime());
|
||||
}, 1000);
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"testing the sizes, styled by js (height)",
|
||||
timeout:9000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var newn = dojo.create("img", null, "container");
|
||||
dojo.style(newn, "height", "100px");
|
||||
|
||||
dojo.connect(newn, "onload", function(e){
|
||||
try{
|
||||
t.is(100, newn.height);
|
||||
t.is(100, newn.width);
|
||||
d.callback(true);
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
});
|
||||
newn.src = "images/square.jpg";
|
||||
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"testing the sizes, styled by js (width)",
|
||||
timeout:9000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var newn = dojo.create("img", null, "container");
|
||||
dojo.style(newn, "width", "100px");
|
||||
|
||||
dojo.connect(newn, "onload", function(e){
|
||||
try{
|
||||
t.is(100, newn.height);
|
||||
t.is(100, newn.width);
|
||||
d.callback(true);
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
});
|
||||
newn.src = "images/square.jpg";
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
name:"testing the sizes, styled by js (both)",
|
||||
timeout:9000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var newn = dojo.create("img", null, "container");
|
||||
dojo.style(newn, { "height":"100px", "width":"100px" });
|
||||
|
||||
dojo.connect(newn, "onload", function(e){
|
||||
try{
|
||||
t.is(100, newn.height);
|
||||
t.is(100, newn.width);
|
||||
d.callback(true);
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
});
|
||||
newn.src = "images/square.jpg";
|
||||
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
// {
|
||||
// name:"testing the sizes, styled by css (no .src)",
|
||||
// timeout:9000,
|
||||
// runTest: function(t){
|
||||
// var d = new doh.Deferred();
|
||||
//
|
||||
// var newn = dojo.byId("randomimage");
|
||||
// dojo.connect(newn, "onload", function(e){
|
||||
// try{
|
||||
// t.is(100, newn.height);
|
||||
// t.is(100, newn.width);
|
||||
// d.callback(true);
|
||||
// }catch(e){
|
||||
// d.errback(e);
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// // janky here?:
|
||||
// setTimeout(function(){
|
||||
// if(dojo.isOpera){
|
||||
// d.callback("expecting opera not to fire onload?");
|
||||
// }
|
||||
// }, 8500)
|
||||
//
|
||||
// return d;
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// name:"testing the sizes, styled by css (set .src)",
|
||||
// timeout:9000,
|
||||
// runTest: function(t){
|
||||
// var d = new doh.Deferred();
|
||||
//
|
||||
// var newn = dojo.byId("randomimage");
|
||||
// dojo.connect(newn, "onload", function(e){
|
||||
// try{
|
||||
// t.is(100, newn.height);
|
||||
// t.is(100, newn.width);
|
||||
// d.callback(true);
|
||||
// }catch(e){
|
||||
// d.errback(e);
|
||||
// }
|
||||
// });
|
||||
// newn.src = "images/square.jpg";
|
||||
//
|
||||
// return d;
|
||||
// }
|
||||
// },
|
||||
{
|
||||
name:"testing the sizes, styled by attr ",
|
||||
timeout:9000,
|
||||
runTest: function(t){
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var newn = dojo.byId("randomimage");
|
||||
dojo.connect(newn, "onload", function(e){
|
||||
try{
|
||||
t.is(100, newn.height);
|
||||
t.is(100, newn.width);
|
||||
d.callback(true);
|
||||
}catch(e){
|
||||
d.errback(e);
|
||||
}
|
||||
});
|
||||
newn.height = 100;
|
||||
newn.src = "images/square.jpg";
|
||||
|
||||
return d;
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
name:"load event does not bubble",
|
||||
timeout:4000,
|
||||
runTest: function(t){
|
||||
|
||||
var d = new doh.Deferred();
|
||||
|
||||
var bubbles; // it doesn't bubble, btw.
|
||||
var c = dojo.byId("container2")
|
||||
var x = dojo.connect(c, "load", function(){
|
||||
d.errback("Should not fire");
|
||||
dojo.disconnect(x);
|
||||
});
|
||||
|
||||
dojo.create("img", { src:"images/square.jpg" }, "container2");
|
||||
setTimeout(function(){
|
||||
dojo.disconnect(x);
|
||||
d.callback(true);
|
||||
}, 3000);
|
||||
|
||||
return d;
|
||||
}
|
||||
|
||||
}
|
||||
]
|
||||
);
|
||||
|
||||
doh.run();
|
||||
|
||||
//
|
||||
// var setimg = dojo.create("img", { src:"../rockstar.jpg" });
|
||||
// setimg.width = 175;
|
||||
// dojo.connect(setimg, "onload", function(e){
|
||||
// console.log("attr'd onload", img.height, dojo.style(img, "height"), img.offsetHeight, img.naturalHeight);
|
||||
// });
|
||||
//
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="tundra">
|
||||
<h2>These tests are all expected to take a long time (image loading)</h2>
|
||||
<p>Some of them might fail</p>
|
||||
<div id="container">
|
||||
<div id="container2"></div>
|
||||
</div>
|
||||
<img id="randomimage" src="images/square.jpg">
|
||||
<img id="fixedimage">
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user