|
1 |
|
2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
|
3 <html> |
|
4 <head> |
|
5 <meta http-equiv="content-type" content="text/html; charset=utf-8"> |
|
6 <title>Asynchronous Testing</title> |
|
7 |
|
8 <style type="text/css"> |
|
9 /*margin and padding on body element |
|
10 can introduce errors in determining |
|
11 element position and are not recommended; |
|
12 we turn them off as a foundation for YUI |
|
13 CSS treatments. */ |
|
14 body { |
|
15 margin:0; |
|
16 padding:0; |
|
17 } |
|
18 </style> |
|
19 |
|
20 <link type="text/css" rel="stylesheet" href="../../build/cssfonts/fonts-min.css" /> |
|
21 <script type="text/javascript" src="../../build/yui/yui-min.js"></script> |
|
22 |
|
23 |
|
24 <!--begin custom header content for this example--> |
|
25 <style type="text/css"> |
|
26 #testLogger { |
|
27 margin-bottom: 1em; |
|
28 } |
|
29 |
|
30 #testLogger .yui-console .yui-console-title { |
|
31 border: 0 none; |
|
32 color: #000; |
|
33 font-size: 13px; |
|
34 font-weight: bold; |
|
35 margin: 0; |
|
36 text-transform: none; |
|
37 } |
|
38 #testLogger .yui-console .yui-console-entry-meta { |
|
39 margin: 0; |
|
40 } |
|
41 |
|
42 .yui-skin-sam .yui-console-entry-pass .yui-console-entry-cat { |
|
43 background: #070; |
|
44 color: #fff; |
|
45 } |
|
46 </style> |
|
47 |
|
48 <!--end custom header content for this example--> |
|
49 |
|
50 </head> |
|
51 |
|
52 <body class=" yui-skin-sam"> |
|
53 |
|
54 <h1>Asynchronous Testing</h1> |
|
55 |
|
56 <div class="exampleIntro"> |
|
57 <p>This example shows how to create an asynchronous test with the YUI Test framework for testing browser-based JavaScript code. |
|
58 A <code>Y.Test.Case</code> object is created with a test that waits for a |
|
59 few seconds before continuing. The <code>Y.Test.Runner</code> |
|
60 is then used to run the tests once the page has loaded.</p> |
|
61 </div> |
|
62 |
|
63 <!--BEGIN SOURCE CODE FOR EXAMPLE =============================== --> |
|
64 |
|
65 <div id="testLogger"></div> |
|
66 <script type="text/javascript"> |
|
67 YUI({base:"../../build/", timeout: 10000}).use("node", "console", "test",function (Y) { |
|
68 |
|
69 Y.namespace("example.test"); |
|
70 |
|
71 Y.example.test.AsyncTestCase = new Y.Test.Case({ |
|
72 |
|
73 //name of the test case - if not provided, one is auto-generated |
|
74 name : "Asynchronous Tests", |
|
75 |
|
76 //--------------------------------------------------------------------- |
|
77 // setUp and tearDown methods - optional |
|
78 //--------------------------------------------------------------------- |
|
79 |
|
80 /* |
|
81 * Sets up data that is needed by each test. |
|
82 */ |
|
83 setUp : function () { |
|
84 this.data = { |
|
85 name: "test", |
|
86 year: 2007, |
|
87 beta: true |
|
88 }; |
|
89 }, |
|
90 |
|
91 /* |
|
92 * Cleans up everything that was created by setUp(). |
|
93 */ |
|
94 tearDown : function () { |
|
95 delete this.data; |
|
96 }, |
|
97 |
|
98 //--------------------------------------------------------------------- |
|
99 // Test methods - names must begin with "test" |
|
100 //--------------------------------------------------------------------- |
|
101 |
|
102 testWait : function (){ |
|
103 var Assert = Y.Assert; |
|
104 |
|
105 //do some assertions now |
|
106 Assert.isTrue(this.data.beta); |
|
107 Assert.isNumber(this.data.year); |
|
108 |
|
109 //wait five seconds and do some more |
|
110 this.wait(function(){ |
|
111 |
|
112 Assert.isString(this.data.name); |
|
113 |
|
114 }, 5000); |
|
115 |
|
116 } |
|
117 |
|
118 }); |
|
119 |
|
120 //create the console |
|
121 var r = new Y.Console({ |
|
122 newestOnTop : false, |
|
123 style: 'block' // to anchor in the example content |
|
124 }); |
|
125 |
|
126 r.render('#testLogger'); |
|
127 |
|
128 Y.Test.Runner.add(Y.example.test.AsyncTestCase); |
|
129 |
|
130 //run the tests |
|
131 Y.Test.Runner.run(); |
|
132 }); |
|
133 |
|
134 </script> |
|
135 |
|
136 <!--END SOURCE CODE FOR EXAMPLE =============================== --> |
|
137 |
|
138 </body> |
|
139 </html> |