diff options
author | John Resig <jeresig@gmail.com> | 2007-07-29 19:07:21 +0000 |
---|---|---|
committer | John Resig <jeresig@gmail.com> | 2007-07-29 19:07:21 +0000 |
commit | 80a149b82831defa1a9f724801daefda0a8c5685 (patch) | |
tree | 7892441276d541c040f64d3a2bb41d0bdf403073 /build | |
parent | e6c067858ec7f2c4e3e7da90f16c695f93a4ee07 (diff) | |
download | jquery-80a149b82831defa1a9f724801daefda0a8c5685.tar.gz jquery-80a149b82831defa1a9f724801daefda0a8c5685.zip |
Integrated the custom fx test suite into the main test suite. All tests are now run automatically. Removed the old suite, as it was no longer needed.
Diffstat (limited to 'build')
-rw-r--r-- | build/test/data/cow.jpg (renamed from build/test/cow.jpg) | bin | 1635 -> 1635 bytes | |||
-rw-r--r-- | build/test/data/testsuite.css | 103 | ||||
-rw-r--r-- | build/test/fx.html | 350 | ||||
-rw-r--r-- | build/test/index.html | 25 |
4 files changed, 125 insertions, 353 deletions
diff --git a/build/test/cow.jpg b/build/test/data/cow.jpg Binary files differindex 2c5b67225..2c5b67225 100644 --- a/build/test/cow.jpg +++ b/build/test/data/cow.jpg diff --git a/build/test/data/testsuite.css b/build/test/data/testsuite.css index 76319d870..b9d487bc4 100644 --- a/build/test/data/testsuite.css +++ b/build/test/data/testsuite.css @@ -9,4 +9,105 @@ p.result { margin-left: 1em; } #banner { height: 2em; border-bottom: 1px solid white; } h2.pass { background-color: green; } -h2.fail { background-color: red; }
\ No newline at end of file +h2.fail { background-color: red; } + +div#fx-tests h4 { + background: red; +} + +div#fx-tests h4.pass { + background: green; +} + +div#fx-tests div.box { + background: red url(data/cow.jpg) no-repeat; + overflow: hidden; + border: 2px solid #000; +} + +div#fx-tests div.overflow { + overflow: visible; +} + +div.inline { + display: inline; +} + +div.autoheight { + height: auto; +} + +div.autowidth { + width: auto; +} + +div.autoopacity { + opacity: auto; +} + +div.largewidth { + width: 100px; +} + +div.largeheight { + height: 100px; +} + +div.largeopacity { + filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); +} + +div.medwidth { + width: 50px; +} + +div.medheight { + height: 50px; +} + +div.medopacity { + opacity: 0.5; + filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50); +} + +div.nowidth { + width: 0px; +} + +div.noheight { + height: 0px; +} + +div.noopacity { + opacity: 0; + filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); +} + +div.hidden { + display: none; +} + +div#fx-tests div.widewidth { + background-repeat: repeat-x; +} + +div#fx-tests div.wideheight { + background-repeat: repeat-y; +} + +div#fx-tests div.widewidth.wideheight { + background-repeat: repeat; +} + +div#fx-tests div.noback { + background-image: none; +} + +div.chain, div.chain div { width: 100px; height: 20px; position: relative; float: left; } +div.chain div { position: absolute; top: 0px; left: 0px; } + +div.chain.test { background: red; } +div.chain.test div { background: green; } + +div.chain.out { background: green; } +div.chain.out div { background: red; display: none; } diff --git a/build/test/fx.html b/build/test/fx.html deleted file mode 100644 index 07b60f975..000000000 --- a/build/test/fx.html +++ /dev/null @@ -1,350 +0,0 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> -<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr"> -<head> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> - <title>Animation Test Suite</title> - <script src="../dist/jquery.js"></script> -<style> -div#tests h4 { - background: red; -} - -div#tests h4.pass { - background: green; -} - -div#tests div.box { - background: red url(cow.jpg) no-repeat; - overflow: hidden; - border: 2px solid #000; -} - -div#tests div.overflow { - overflow: visible; -} - -div.inline { - display: inline; -} - -div.autoheight { - height: auto; -} - -div.autowidth { - width: auto; -} - -div.autoopacity { - opacity: auto; -} - -div.largewidth { - width: 100px; -} - -div.largeheight { - height: 100px; -} - -div.largeopacity { - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); -} - -div.medwidth { - width: 50px; -} - -div.medheight { - height: 50px; -} - -div.medopacity { - opacity: 0.5; - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50); -} - -div.nowidth { - width: 0px; -} - -div.noheight { - height: 0px; -} - -div.noopacity { - opacity: 0; - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); -} - -div.hidden { - display: none; -} - -div#tests div.widewidth { - background-repeat: repeat-x; -} - -div#tests div.wideheight { - background-repeat: repeat-y; -} - -div#tests div.widewidth.wideheight { - background-repeat: repeat; -} - -div#tests div.noback { - background-image: none; -} - -div.chain, div.chain div { width: 100px; height: 20px; position: relative; float: left; } -div.chain div { position: absolute; top: 0px; left: 0px; } - -div.chain.test { background: red; } -div.chain.test div { background: green; } - -div.chain.out { background: green; } -div.chain.out div { background: red; display: none; } -</style> -<script> -var visible = { - Normal: function(elem){}, - "CSS Hidden": function(elem){ - $(this).addClass("hidden"); - }, - "JS Hidden": function(elem){ - $(this).hide(); - } -}; - -var from = { - "CSS Auto": function(elem,prop){ - $(elem).addClass("auto" + prop) - .text("This is a long string of text."); - return ""; - }, - "JS Auto": function(elem,prop){ - $(elem).css(prop,"auto") - .text("This is a long string of text."); - return ""; - }, - "CSS 100": function(elem,prop){ - $(elem).addClass("large" + prop); - return ""; - }, - "JS 100": function(elem,prop){ - $(elem).css(prop,prop == "opacity" ? 1 : "100px"); - return prop == "opacity" ? 1 : 100; - }, - "CSS 50": function(elem,prop){ - $(elem).addClass("med" + prop); - return ""; - }, - "JS 50": function(elem,prop){ - $(elem).css(prop,prop == "opacity" ? 0.50 : "50px"); - return prop == "opacity" ? 0.5 : 50; - }, - "CSS 0": function(elem,prop){ - $(elem).addClass("no" + prop); - return ""; - }, - "JS 0": function(elem,prop){ - $(elem).css(prop,prop == "opacity" ? 0 : "0px"); - return 0; - } -}; - -var to = { - /*"Auto": function(elem,prop){ - $(elem).addClass("wide"+prop); - return "auto"; - },*/ - /*"toggle (show)": function(elem,prop){ - $(elem).hide().addClass("wide"+prop); - return "show"; - },*/ - "show": function(elem,prop){ - $(elem).hide().addClass("wide"+prop); - return "show"; - }, - "hide": function(elem,prop){ - $(elem).addClass("wide"+prop); - return "hide"; - }, - "100": function(elem,prop){ - $(elem).addClass("wide"+prop); - return prop == "opacity" ? 1 : 100; - }, - "50": function(elem,prop){ - return prop == "opacity" ? 0.50 : 50; - }, - "0": function(elem,prop){ - $(elem).addClass("noback"); - return 0; - } -}; - -/*var oldAttr = jQuery.attr; - -jQuery.attr = function( elem, name, value ){ - if ( arguments.length == 3 ) { - var prev = elem.previousSibling; - if ( prev && prev.nodeName == "UL" ) { - $(prev).append( name + ": " + value ); - } - } - - return oldAttr.apply( jQuery, arguments ); -};*/ - -$(document).ready(function(){ - makeTest( "JS Overflow and Display" ) - .addClass("widewidth") - .css({ overflow: "visible", display: "inline" }) - .add( makeTest( "CSS Overflow and Display" ).addClass("overflow inline") ) - .addClass("widewidth") - .text("Some sample text.") - .before("text before") - .after("text after") - .animate({ opacity: 0.5 }, "slow", function(){ - var o = jQuery.css( this, "overflow" ); - if ( o != "visible" ) - return msg(this, "Overflow should be visible: " + o); - - if ( jQuery.css( this, "display" ) != "inline" ) - return msg(this, "Display has been tampered with."); - - pass( this ); - }); - - jQuery.each( from, function(fn, f){ - jQuery.each( to, function(tn, t){ - var elem = makeTest( fn + " to " + tn ); - - var t_w = t( elem, "width" ); - var f_w = f( elem, "width" ); - var t_h = t( elem, "height" ); - var f_h = f( elem, "height" ); - var t_o = t( elem, "opacity" ); - var f_o = f( elem, "opacity" ); - - var anim = { width: t_w, height: t_h, opacity: t_o }; - - elem.animate(anim, "slow", function(){ - if ( t_w == "show" && this.style.display != "block" ) - return msg(this, "Showing, display not block: " + this.style.display); - - if ( (t_w == "hide"||t_w == "show") && this.style.width.indexOf(f_w) != 0 ) - return msg(this, "Width not reset to " + f_w + ": " + this.style.width); - - if ( (t_h == "hide"||t_h == "show") && this.style.height.indexOf(f_h) != 0 ) - return msg(this, "Height not reset to " + f_h + ": " + this.style.height); - - var cur_o = jQuery.attr(this.style, "opacity"); - if ( cur_o !== "" ) cur_o = parseFloat( cur_o ); - - if ( (t_o == "hide"||t_o == "show") && cur_o != f_o ) { - return msg(this, "Opacity not reset to " + f_o + ": " + cur_o); - } - - if ( t_w == "hide" && this.style.display != "none" ) - return msg(this, "Hiding, display not none: " + this.style.display); - - if ( t_o.constructor == Number && cur_o != t_o ) - return msg(this, "Final opacity is not " + t_o + ": " + cur_o); - - if ( t_w.constructor == Number && this.style.width != t_w + "px" ) - return msg(this, "Final width is not " + t_w + ": " + this.style.width); - - if ( t_h.constructor == Number && this.style.height != t_h + "px" ) - return msg(this, "Final height is not " + t_h + ": " + this.style.height); - - var cur_w = jQuery.css(this,"width"); - if ( t_w.constructor == Number && this.style.width == "" && cur_w != t_w ) - return msg(this, "Width should be explicitly set to " + t_w + ", is instead: " + cur_w); - - var cur_h = jQuery.css(this,"height"); - if ( t_h.constructor == Number && this.style.height == "" && cur_h != t_h ) - return msg(this, "Height should be explicitly set to " + t_h + ", is instead: " + cur_w); - - if ( t_o.constructor == Number && jQuery.curCSS(this, "opacity") == "" && cur_o != t_o ) - return msg(this, "Opacity should be explicitly set to " + t_o + ", is instead: " + cur_o); - - if ( t_h == "show" ) { - var old_h = jQuery.curCSS(this, "height"); - $(elem).append("<br>Some more text<br>and some more..."); - if ( old_h == jQuery.css(this, "height" ) ) - return msg(this, "Height is not truly auto."); - } - - pass( this ); - }); - }); - }); - - // Chaining Tests - $('#fadein div').fadeOut('fast').fadeIn('fast'); - $('#fadeout div').fadeIn('fast').fadeOut('fast'); - - $('#show div').hide('fast').show('fast'); - $('#hide div').show('fast').hide('fast'); - - $('#togglein div').toggle('fast').toggle('fast'); - $('#toggleout div').toggle('fast').toggle('fast'); - - $('#slidedown div').slideDown('fast').slideUp('fast'); - $('#slideup div').slideUp('fast').slideDown('fast'); - - $('#slidetogglein div').slideToggle('fast').slideToggle('fast'); - $('#slidetoggleout div').slideToggle('fast').slideToggle('fast'); -}); - -function pass( elem ) { - $(elem).prev().addClass("pass"); -} - -function makeTest( text ){ - var elem = $("<div></div>") - .attr("id", "test" + makeTest.id++) - .addClass("box"); - - $("<h4></h4>") - .text( text ) - .appendTo("#tests") - .click(function(){ - $(this).next().toggle(); - }) - .after( elem ); - - return elem; -} - -makeTest.id = 1; - -function msg(elem,txt){ - $(elem).prev().append( "<tt> " + txt + "</tt>" ); -} -</script> -</head> -<body> -<b>Chain Tests:</b><br/> -<div id="fadein" class='chain test'>fadeIn<div>fadeIn</div></div> -<div id="fadeout" class='chain test out'>fadeOut<div>fadeOut</div></div> - -<div id="show" class='chain test'>show<div>show</div></div> -<div id="hide" class='chain test out'>hide<div>hide</div></div> - -<div id="togglein" class='chain test'>togglein<div>togglein</div></div> -<div id="toggleout" class='chain test out'>toggleout<div>toggleout</div></div> -<br style="clear:both;"/> - -<div id="slideup" class='chain test'>slideUp<div>slideUp</div></div> -<div id="slidedown" class='chain test out'>slideDown<div>slideDown</div></div> - -<div id="slidetogglein" class='chain test'>slideToggleIn<div>slideToggleIn</div></div> -<div id="slidetoggleout" class='chain test out'>slideToggleOut<div>slideToggleOut</div></div> -<br style="clear:both;"/> - -<div id="tests"></div> -</body> -</html> diff --git a/build/test/index.html b/build/test/index.html index 756e2a5e3..4021d330c 100644 --- a/build/test/index.html +++ b/build/test/index.html @@ -1,6 +1,7 @@ -<html id="html"> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr" id="html"> <head> - <meta http-equiv="Content-Type" content="text/css; charset=utf-8" /> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery Test Suite</title> <link rel="Stylesheet" media="screen" href="data/testsuite.css" /> <script type="text/javascript" src="../dist/jquery.js"></script> @@ -95,6 +96,26 @@ <input type="text" id="idTest" name="id"/> </form> <table id="table"></table> + + <div id="fx-queue"> + <div id="fadein" class='chain test'>fadeIn<div>fadeIn</div></div> + <div id="fadeout" class='chain test out'>fadeOut<div>fadeOut</div></div> + + <div id="show" class='chain test'>show<div>show</div></div> + <div id="hide" class='chain test out'>hide<div>hide</div></div> + + <div id="togglein" class='chain test'>togglein<div>togglein</div></div> + <div id="toggleout" class='chain test out'>toggleout<div>toggleout</div></div> + + + <div id="slideup" class='chain test'>slideUp<div>slideUp</div></div> + <div id="slidedown" class='chain test out'>slideDown<div>slideDown</div></div> + + <div id="slidetogglein" class='chain test'>slideToggleIn<div>slideToggleIn</div></div> + <div id="slidetoggleout" class='chain test out'>slideToggleOut<div>slideToggleOut</div></div> + </div> + + <div id="fx-tests"></div> </div> </dl> |