PageRenderTime 29ms CodeModel.GetById 22ms RepoModel.GetById 0ms app.codeStats 0ms

/src/dom/tests/test-cloudy.html

https://github.com/timeflows/kissy
HTML | 304 lines | 265 code | 23 blank | 16 comment | 0 complexity | a9a6b41282d2068fa90b99f6b88082ae MD5 | raw file
    

  1. <!doctype html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. <meta charset="utf-8"/>
    5. 

  5. 

  6. <title>DOM Test Runner</title>
    7. 

  7. <link rel="stylesheet" href="../../../tools/jasmine/jasmine.css">
    8. 

  8. <script src="http://a.tbcdn.cn/p/cloudyrun/1.0/cloudyrun-jasmine-pkg.js"></script>
    9. 

  9. 

  10. <script src="../../../build/seed.js" charset="utf-8"></script>
    11. 

  11. <script src="../../../build/ua.js" charset="utf-8"></script>
    12. 

  12. <script src="../data.js" charset="utf-8"></script>
    13. 

  13. <script src="../attr.js" charset="utf-8"></script>
    14. 

  14. <script src="../base.js" charset="utf-8"></script>
    15. 

  15. <script src="../class.js" charset="utf-8"></script>
    16. 

  16. <script src="../create.js" charset="utf-8"></script>
    17. 

  17. <script src="../insertion.js" charset="utf-8"></script>
    18. 

  18. <script src="../offset.js" charset="utf-8"></script>
    19. 

  19. <script src="../selector.js" charset="utf-8"></script>
    20. 

  20. <script src="../style-ie.js" charset="utf-8"></script>
    21. 

  21. <script src="../style.js" charset="utf-8"></script>
    22. 

  22. <script src="../traversal.js" charset="utf-8"></script>
    23. 

  23. <script src="../../dom.js" charset="utf-8"></script>
    24. 

  24. <script>
    25. 

  25.     KISSY.__combines = {};
    26. 

  26. </script>
    27. 

  27. <style>
    28. 

  28.     body {
    29. 

  29.         font-size: 16px;
    30. 

  30.     }
    31. 

  31. </style>
    32. 

  32. </head>
    33. 

  33. <body>
    34. 

  34. <h1>KISSY DOM Test Cases</h1>
    35. 

  35. 

  36. <div id="test_cases">
    37. 

  37. 

  38. <!--selector-spec start-->
    39. 

  39. 

  40. <div id="test-selector">
    41. 

  41.     <div class="test-selector" id="test-selector-1">
    42. 

  42.         <div class="test-selector">
    43. 

  43.             <s id="test-selector-tag"></s>
    44. 

  44.         </div>
    45. 

  45.     </div>
    46. 

  46. 

  47.     <div class="test-selector" id="test-selector-2">
    48. 

  48.         <p class="test-selector">
    49. 

  49.             <s></s>
    50. 

  50.         </p>
    51. 

  51.     </div>
    52. 

  52. </div>
    53. 

  53. <!--selector-spec end-->
    54. 

  54. 

  55. 

  56. <!-- attr-spec start-->
    57. 

  57. <div id="test-data">
    58. 

  58.     <input id='hidepass'/>
    59. 

  59.     <p id="foo">
    60. 

  60.         <a href="../kissy/"
    61. 

  61.            style="color:red; border-top:1px solid #333;"
    62. 

  62.            class="link"
    63. 

  63.            title="test" data-test="test">test link</a>
    64. 

  64.         <input type="text" id="test-input" readonly='' maxlength="20" value="hello"/>
    65. 

  65.         <input type="radio" id="test-radio"/>
    66. 

  66.         <input type="radio" id="test-radio2" checked/>
    67. 

  67.         <label class="test" for="test-input">label</label>
    68. 

  68.         <button type="button" tabindex="3">Submit</button>
    69. 

  69.         <textarea rows="2" cols="2">
    70. 

  70.             test
    71. 

  71.         </textarea>
    72. 

  72.     </p>
    73. 

  73.     <div id="test-div"></div>
    74. 

  74.     <img id="test-img" src="./logo.png" alt="kissy"/>
    75. 

  75.     <table id="test-table" cellspacing="10">
    76. 

  76.         <tbody>
    77. 

  77.         <tr>
    78. 

  78.             <td rowspan="2" colspan="3">td</td>
    79. 

  79.         </tr>
    80. 

  80.         </tbody>
    81. 

  81.     </table>
    82. 

  82.     <select id="test-select">
    83. 

  83.         <option id="test-opt" value="1">0</option>
    84. 

  84.         <option>2</option>
    85. 

  85.         <option>3</option>
    86. 

  86.     </select>
    87. 

  87.     <select id="test-select2">
    88. 

  88.         <option>2</option>
    89. 

  89.     </select>
    90. 

  90.     <select id="test-select3" multiple autocomplete="off">
    91. 

  91.         <option selected>1</option>
    92. 

  92.         <option selected>2</option>
    93. 

  93.         <option>3</option>
    94. 

  94.     </select>
    95. 

  95.     <br/>
    96. 

  96.     <br/>
    97. 

  97.     <input type="checkbox" id="test-20100728-checkbox"/>test checked
    98. 

  98. 

  99.     <br/>
    100. 

  100. 

  101.     <input type="button" id="test-20100728-disabled"/>test disabled
    102. 

  102. </div>
    103. 

  103. <!-- attr-spec end-->
    104. 

  104. 

  105. 

  106. <!-- class-spec start -->
    107. 

  107. <div id="test-data-class">
    108. 

  108.     <p id="foo-class">
    109. 

  109.         <a href="../kissy/" style="color:red" class="link" title="test"
    110. 

  110.            data-test="test">test link</a>
    111. 

  111.         <input type="text" id="test-input-class" readonly maxlength="20" value="hello"/>
    112. 

  112.         <input type="radio" id="test-radio-class"/>
    113. 

  113.         <input type="radio" id="test-radio2-class" checked/>
    114. 

  114.         <label class="test" for="test-input">label</label>
    115. 

  115.         <button type="button" tabindex="3">Submit</button>
    116. 

  116.         <textarea rows="2" cols="2">
    117. 

  117.             test
    118. 

  118.         </textarea>
    119. 

  119.     </p>
    120. 

  120.     <div id="test-div-class"></div>
    121. 

  121.     <table id="test-table-class" cellspacing="10">
    122. 

  122.         <tbody>
    123. 

  123.         <tr>
    124. 

  124.             <td rowspan="2" colspan="3">td</td>
    125. 

  125.         </tr>
    126. 

  126.         </tbody>
    127. 

  127.     </table>
    128. 

  128.     <select id="test-select-class">
    129. 

  129.         <option id="test-opt-class" value="1">0</option>
    130. 

  130.         <option>2</option>
    131. 

  131.         <option>3</option>
    132. 

  132.     </select>
    133. 

  133.     <select id="test-select2-class">
    134. 

  134.         <option>2</option>
    135. 

  135.     </select>
    136. 

  136.     <select id="test-select3-class" multiple autocomplete="off">
    137. 

  137.         <option selected>1</option>
    138. 

  138.         <option selected>2</option>
    139. 

  139.         <option>3</option>
    140. 

  140.     </select>
    141. 

  141. </div>
    142. 

  142. <!-- class-spec end -->
    143. 

  143. 

  144. <!--
    145. 

  145. offset-spec start
    146. 

  146. -->
    147. 

  147. <div id='test-offset' style="width:100px;height:100px;border: 1px solid red;">
    148. 

  148.     offset
    149. 

  149. </div>
    150. 

  150. <!--
    151. 

  151. offset-spec end
    152. 

  152. -->
    153. 

  153. 

  154. 

  155. <!--scroll-spec start-->
    156. 

  156. <p>x</p>
    157. 

  157. <p>x</p>
    158. 

  158. <p>x</p>
    159. 

  159. <p>x</p>
    160. 

  160. <p>x</p>
    161. 

  161. <p>x</p>
    162. 

  162. <p>x</p>
    163. 

  163. <p>x</p>
    164. 

  164. <p>x</p>
    165. 

  165. <p>x</p>
    166. 

  166. <p>x</p>
    167. 

  167. <p>x</p>
    168. 

  168. <p>x</p>
    169. 

  169. <p>x</p>
    170. 

  170. <p>x</p>
    171. 

  171. <p>x</p>
    172. 

  172. <p>x</p>
    173. 

  173. <p>x</p>
    174. 

  174. <p>x</p>
    175. 

  175. <p>x</p>
    176. 

  176. <p>x</p>
    177. 

  177. <p>x</p>
    178. 

  178. <p>x</p>
    179. 

  179. <p>x</p>
    180. 

  180. <p>x</p>
    181. 

  181. <p>x</p>
    182. 

  182. <p>x</p>
    183. 

  183. <p>x</p>
    184. 

  184. <p>x</p>
    185. 

  185. <p>x</p>
    186. 

  186. <p>x</p>
    187. 

  187. <p>x</p>
    188. 

  188. <p>x</p>
    189. 

  189. <p>x</p>
    190. 

  190. <p>x</p>
    191. 

  191. <p>x</p>
    192. 

  192. <p>x</p>
    193. 

  193. <p>x</p>
    194. 

  194. <p>x</p>
    195. 

  195. <p>x</p>
    196. 

  196. 

  197. <div style="width:200px;height:200px;overflow:auto;border: 5px solid #ccc;" id="scroll-container">
    198. 

  198.     <p>x</p>
    199. 

  199.     <p>x</p>
    200. 

  200.     <p>x</p>
    201. 

  201.     <p>x</p>
    202. 

  202.     <p>x</p>
    203. 

  203.     <p>x</p>
    204. 

  204.     <p>x</p>
    205. 

  205.     <p>x</p>
    206. 

  206.     <p>x</p>
    207. 

  207.     <p>x</p>
    208. 

  208.     <p>x</p>
    209. 

  209.     <p>x</p>
    210. 

  210.     <p>x</p>
    211. 

  211.     <p>x</p>
    212. 

  212.     <p>x</p>
    213. 

  213.     <p>x</p>
    214. 

  214.     <div id="scroll-el" style="border:5px solid #9f9;">
    215. 

  215.         test
    216. 

  216.     </div>
    217. 

  217.     <p>x</p>
    218. 

  218.     <p>x</p>
    219. 

  219.     <p>x</p>
    220. 

  220.     <p>x</p>
    221. 

  221.     <p>x</p>
    222. 

  222.     <p>x</p>
    223. 

  223.     <p>x</p>
    224. 

  224.     <p>x</p>
    225. 

  225.     <p>x</p>
    226. 

  226.     <p>x</p>
    227. 

  227.     <p>x</p>
    228. 

  228.     <p>x</p>
    229. 

  229.     <p>x</p>
    230. 

  230.     <p>x</p>
    231. 

  231.     <p>x</p>
    232. 

  232.     <p>x</p>
    233. 

  233.     <p>x</p>
    234. 

  234.     <p>x</p>
    235. 

  235.     <p>x</p>
    236. 

  236.     <p>x</p>
    237. 

  237.     <p>x</p>
    238. 

  238. </div>
    239. 

  239. 

  240. <p>x</p>
    241. 

  241. <p>x</p>
    242. 

  242. <p>x</p>
    243. 

  243. <p>x</p>
    244. 

  244. <p>x</p>
    245. 

  245. <iframe src="test-dom-offset-iframe.html"
    246. 

  246.         id="test-iframe"
    247. 

  247.         style="border:1px solid black; "
    248. 

  248.         width="200"
    249. 

  249.         height="200"
    250. 

  250.         frameborder="0"
    251. 

  251.         scrolling="no"
    252. 

  252.         ></iframe>
    253. 

  253. <p>x</p>
    254. 

  254. <p>x</p>
    255. 

  255. <p>x</p>
    256. 

  256. <p>x</p>
    257. 

  257. <p>x</p>
    258. 

  258. <p>x</p>
    259. 

  259. <p>x</p>
    260. 

  260. <p>x</p>
    261. 

  261. <p>x</p>
    262. 

  262. <p>x</p>
    263. 

  263. <p>x</p>
    264. 

  264. <p>x</p>
    265. 

  265. <p>x</p>
    266. 

  266. <p>x</p>
    267. 

  267. <p>x</p>
    268. 

  268. <p>x</p>
    269. 

  269. <p>x</p>
    270. 

  270. <p>x</p>
    271. 

  271. <!--scroll-spec end-->
    272. 

  272. 

  273. <!--traversal-spec start-->
    274. 

  274. <div id="test-children" class="test-parent">
    275. 

  275.     <p id="test-next"><a>1</a></p>
    276. 

  276.     <p class="test-next-p"><a class="test-a">2</a></p>
    277. 

  277.     <p class="test-next"><a id="test-parent3">3</a></p>
    278. 

  278.     <p class="test-p" id="test-prev"><em class="test-em"><span><a id="test-parent4">4</a></span></em></p>
    279. 

  279. </div>
    280. 

  280. <div id="test-contains">text node</div>
    281. 

  281. <!--traversal-spec end-->
    282. 

  282. 

  283. 

  284. </div>
    285. 

  285. <script src="attr-spec.js"></script>
    286. 

  286. <script src="class-spec.js"></script>
    287. 

  287. <script src="create-spec.js"></script>
    288. 

  288. <script src="data-spec.js"></script>
    289. 

  289. <script src="insertion-spec.js"></script>
    290. 

  290. <script src="offset-spec.js"></script>
    291. 

  291. <script src="scroll-spec.js"></script>
    292. 

  292. <script src="style-spec.js"></script>
    293. 

  293. <script src="traversal-spec.js"></script>
    294. 

  294. <script src="selector-spec.js"></script>
    295. 

  295. <script>
    296. 

  296. 

  297.     window.onload = function() {
    298. 

  298. 

  299.         CloudyRun.runJasmine();
    300. 

  300. 

  301.     };
    302. 

  302. </script>
    303. 

  303. </body>
    304. 

  304. </html>
    305.