test/readywait.html

   1 <!DOCTYPE html>
   2 <html>
   3 <!--
   4         Test for jQuery.holdReady. Needs to be a
   5         standalone test since it deals with DOM
   6         ready.
   7 -->
   8 <head>
   9         <title>
  10                 jQuery.holdReady Test
  11         </title>
  12         <style>
  13                 div { margin-top: 10px; }
  14                 #output { background-color: green }
  15                 #expectedOutput { background-color: green }
  16         </style>
  17         <script src="../dist/jquery.js"></script>
  18
  19         <!-- Load the script loader that uses
  20                 jQuery.readyWait -->
  21         <script src="data/readywaitloader.js"></script>
  22
  23         <script type="text/javascript">
  24         jQuery(function() {
  25                 // The delayedMessage is defined by
  26                 // the readywaitasset.js file, so the
  27                 // next line will only work if this DOM
  28                 // ready callback is called after readyWait
  29                 // has been decremented by readywaitloader.js
  30                 // If an error occurs.
  31                 jQuery("#output").append(delayedMessage);
  32         });
  33         </script>
  34 </head>
  35 <body>
  36         <h1>
  37                 jQuery.holdReady Test
  38         </h1>
  39         <p>
  40                 This is a test page for jQuery.readyWait and jQuery.holdReady,
  41                 see
  42                 <a href="http://bugs.jquery.com/ticket/6781">#6781</a>
  43                 and
  44                 <a href="http://bugs.jquery.com/ticket/8803">#8803</a>.
  45         </p>
  46         <p>
  47         Test for jQuery.holdReady, which can be used
  48         by plugins and other scripts to indicate something
  49         important to the page is still loading and needs
  50         to block the DOM ready callbacks that are registered
  51         with jQuery.
  52         </p>
  53         <p>
  54         Script loaders are the most likely kind of script
  55         to use jQuery.holdReady, but it could be used by
  56         other things like a script that loads a CSS file
  57         and wants to pause the DOM ready callbacks.
  58         </p>
  59         <p>
  60         <strong>Expected Result</strong>: The text
  61         <span id="expectedOutput">It Worked!</span>
  62         appears below after about <strong>2 seconds.</strong>
  63         </p>
  64         <p>
  65         If there is an error in the console,
  66         or the text does not show up, then the test failed.
  67         </p>
  68         <div id="output"></div>
  69 </body>
  70 </html>