capybara 3.13.2 → 3.40.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (260) hide show
  1. checksums.yaml +4 -4
  2. data/.yardopts +1 -0
  3. data/History.md +587 -16
  4. data/README.md +240 -90
  5. data/lib/capybara/config.rb +24 -11
  6. data/lib/capybara/cucumber.rb +1 -1
  7. data/lib/capybara/driver/base.rb +8 -0
  8. data/lib/capybara/driver/node.rb +20 -4
  9. data/lib/capybara/dsl.rb +5 -3
  10. data/lib/capybara/helpers.rb +25 -4
  11. data/lib/capybara/minitest/spec.rb +174 -90
  12. data/lib/capybara/minitest.rb +256 -142
  13. data/lib/capybara/node/actions.rb +123 -77
  14. data/lib/capybara/node/base.rb +20 -12
  15. data/lib/capybara/node/document.rb +2 -2
  16. data/lib/capybara/node/document_matchers.rb +3 -3
  17. data/lib/capybara/node/element.rb +223 -117
  18. data/lib/capybara/node/finders.rb +81 -71
  19. data/lib/capybara/node/matchers.rb +271 -134
  20. data/lib/capybara/node/simple.rb +18 -5
  21. data/lib/capybara/node/whitespace_normalizer.rb +81 -0
  22. data/lib/capybara/queries/active_element_query.rb +18 -0
  23. data/lib/capybara/queries/ancestor_query.rb +8 -9
  24. data/lib/capybara/queries/base_query.rb +3 -2
  25. data/lib/capybara/queries/current_path_query.rb +15 -5
  26. data/lib/capybara/queries/selector_query.rb +364 -54
  27. data/lib/capybara/queries/sibling_query.rb +8 -6
  28. data/lib/capybara/queries/style_query.rb +2 -2
  29. data/lib/capybara/queries/text_query.rb +13 -1
  30. data/lib/capybara/queries/title_query.rb +1 -1
  31. data/lib/capybara/rack_test/browser.rb +76 -11
  32. data/lib/capybara/rack_test/driver.rb +10 -5
  33. data/lib/capybara/rack_test/errors.rb +6 -0
  34. data/lib/capybara/rack_test/form.rb +31 -9
  35. data/lib/capybara/rack_test/node.rb +74 -23
  36. data/lib/capybara/registration_container.rb +41 -0
  37. data/lib/capybara/registrations/drivers.rb +42 -0
  38. data/lib/capybara/registrations/patches/puma_ssl.rb +29 -0
  39. data/lib/capybara/registrations/servers.rb +66 -0
  40. data/lib/capybara/result.rb +44 -20
  41. data/lib/capybara/rspec/matcher_proxies.rb +13 -11
  42. data/lib/capybara/rspec/matchers/base.rb +31 -16
  43. data/lib/capybara/rspec/matchers/compound.rb +1 -1
  44. data/lib/capybara/rspec/matchers/count_sugar.rb +37 -0
  45. data/lib/capybara/rspec/matchers/have_ancestor.rb +28 -0
  46. data/lib/capybara/rspec/matchers/have_current_path.rb +2 -2
  47. data/lib/capybara/rspec/matchers/have_selector.rb +21 -21
  48. data/lib/capybara/rspec/matchers/have_sibling.rb +27 -0
  49. data/lib/capybara/rspec/matchers/have_text.rb +4 -4
  50. data/lib/capybara/rspec/matchers/have_title.rb +2 -2
  51. data/lib/capybara/rspec/matchers/match_selector.rb +3 -3
  52. data/lib/capybara/rspec/matchers/match_style.rb +7 -2
  53. data/lib/capybara/rspec/matchers/spatial_sugar.rb +39 -0
  54. data/lib/capybara/rspec/matchers.rb +111 -68
  55. data/lib/capybara/rspec.rb +2 -0
  56. data/lib/capybara/selector/builders/css_builder.rb +11 -7
  57. data/lib/capybara/selector/builders/xpath_builder.rb +5 -3
  58. data/lib/capybara/selector/css.rb +11 -9
  59. data/lib/capybara/selector/definition/button.rb +68 -0
  60. data/lib/capybara/selector/definition/checkbox.rb +26 -0
  61. data/lib/capybara/selector/definition/css.rb +10 -0
  62. data/lib/capybara/selector/definition/datalist_input.rb +35 -0
  63. data/lib/capybara/selector/definition/datalist_option.rb +25 -0
  64. data/lib/capybara/selector/definition/element.rb +28 -0
  65. data/lib/capybara/selector/definition/field.rb +40 -0
  66. data/lib/capybara/selector/definition/fieldset.rb +14 -0
  67. data/lib/capybara/selector/definition/file_field.rb +13 -0
  68. data/lib/capybara/selector/definition/fillable_field.rb +33 -0
  69. data/lib/capybara/selector/definition/frame.rb +17 -0
  70. data/lib/capybara/selector/definition/id.rb +6 -0
  71. data/lib/capybara/selector/definition/label.rb +62 -0
  72. data/lib/capybara/selector/definition/link.rb +55 -0
  73. data/lib/capybara/selector/definition/link_or_button.rb +16 -0
  74. data/lib/capybara/selector/definition/option.rb +27 -0
  75. data/lib/capybara/selector/definition/radio_button.rb +27 -0
  76. data/lib/capybara/selector/definition/select.rb +81 -0
  77. data/lib/capybara/selector/definition/table.rb +109 -0
  78. data/lib/capybara/selector/definition/table_row.rb +21 -0
  79. data/lib/capybara/selector/definition/xpath.rb +5 -0
  80. data/lib/capybara/selector/definition.rb +280 -0
  81. data/lib/capybara/selector/filter_set.rb +19 -18
  82. data/lib/capybara/selector/filters/base.rb +11 -2
  83. data/lib/capybara/selector/filters/locator_filter.rb +13 -3
  84. data/lib/capybara/selector/regexp_disassembler.rb +11 -7
  85. data/lib/capybara/selector/selector.rb +50 -440
  86. data/lib/capybara/selector/xpath_extensions.rb +17 -0
  87. data/lib/capybara/selector.rb +473 -482
  88. data/lib/capybara/selenium/atoms/getAttribute.min.js +1 -0
  89. data/lib/capybara/selenium/atoms/isDisplayed.min.js +1 -0
  90. data/lib/capybara/selenium/atoms/src/getAttribute.js +161 -0
  91. data/lib/capybara/selenium/atoms/src/isDisplayed.js +454 -0
  92. data/lib/capybara/selenium/driver.rb +174 -62
  93. data/lib/capybara/selenium/driver_specializations/chrome_driver.rb +74 -18
  94. data/lib/capybara/selenium/driver_specializations/edge_driver.rb +128 -0
  95. data/lib/capybara/selenium/driver_specializations/firefox_driver.rb +37 -3
  96. data/lib/capybara/selenium/driver_specializations/internet_explorer_driver.rb +14 -1
  97. data/lib/capybara/selenium/driver_specializations/safari_driver.rb +24 -0
  98. data/lib/capybara/selenium/extensions/file_input_click_emulation.rb +34 -0
  99. data/lib/capybara/selenium/extensions/find.rb +68 -45
  100. data/lib/capybara/selenium/extensions/html5_drag.rb +192 -22
  101. data/lib/capybara/selenium/extensions/modifier_keys_stack.rb +28 -0
  102. data/lib/capybara/selenium/extensions/scroll.rb +8 -10
  103. data/lib/capybara/selenium/node.rb +268 -72
  104. data/lib/capybara/selenium/nodes/chrome_node.rb +105 -9
  105. data/lib/capybara/selenium/nodes/edge_node.rb +110 -0
  106. data/lib/capybara/selenium/nodes/firefox_node.rb +51 -61
  107. data/lib/capybara/selenium/nodes/ie_node.rb +22 -0
  108. data/lib/capybara/selenium/nodes/safari_node.rb +118 -0
  109. data/lib/capybara/selenium/patches/atoms.rb +18 -0
  110. data/lib/capybara/selenium/patches/is_displayed.rb +16 -0
  111. data/lib/capybara/selenium/patches/logs.rb +45 -0
  112. data/lib/capybara/selenium/patches/pause_duration_fix.rb +1 -1
  113. data/lib/capybara/selenium/patches/persistent_client.rb +20 -0
  114. data/lib/capybara/server/animation_disabler.rb +43 -21
  115. data/lib/capybara/server/checker.rb +6 -2
  116. data/lib/capybara/server/middleware.rb +25 -13
  117. data/lib/capybara/server.rb +20 -4
  118. data/lib/capybara/session/config.rb +15 -11
  119. data/lib/capybara/session/matchers.rb +11 -11
  120. data/lib/capybara/session.rb +162 -131
  121. data/lib/capybara/spec/public/offset.js +6 -0
  122. data/lib/capybara/spec/public/test.js +105 -6
  123. data/lib/capybara/spec/session/accept_alert_spec.rb +1 -1
  124. data/lib/capybara/spec/session/active_element_spec.rb +31 -0
  125. data/lib/capybara/spec/session/all_spec.rb +89 -15
  126. data/lib/capybara/spec/session/ancestor_spec.rb +5 -0
  127. data/lib/capybara/spec/session/assert_current_path_spec.rb +5 -2
  128. data/lib/capybara/spec/session/assert_text_spec.rb +26 -22
  129. data/lib/capybara/spec/session/attach_file_spec.rb +64 -31
  130. data/lib/capybara/spec/session/check_spec.rb +26 -4
  131. data/lib/capybara/spec/session/choose_spec.rb +14 -2
  132. data/lib/capybara/spec/session/click_button_spec.rb +109 -61
  133. data/lib/capybara/spec/session/click_link_or_button_spec.rb +9 -0
  134. data/lib/capybara/spec/session/click_link_spec.rb +23 -1
  135. data/lib/capybara/spec/session/current_scope_spec.rb +1 -1
  136. data/lib/capybara/spec/session/current_url_spec.rb +11 -1
  137. data/lib/capybara/spec/session/element/matches_selector_spec.rb +40 -39
  138. data/lib/capybara/spec/session/evaluate_script_spec.rb +12 -0
  139. data/lib/capybara/spec/session/fill_in_spec.rb +46 -5
  140. data/lib/capybara/spec/session/find_link_spec.rb +10 -0
  141. data/lib/capybara/spec/session/find_spec.rb +80 -7
  142. data/lib/capybara/spec/session/first_spec.rb +2 -2
  143. data/lib/capybara/spec/session/frame/switch_to_frame_spec.rb +14 -1
  144. data/lib/capybara/spec/session/frame/within_frame_spec.rb +14 -1
  145. data/lib/capybara/spec/session/has_all_selectors_spec.rb +5 -5
  146. data/lib/capybara/spec/session/has_ancestor_spec.rb +46 -0
  147. data/lib/capybara/spec/session/has_any_selectors_spec.rb +6 -2
  148. data/lib/capybara/spec/session/has_button_spec.rb +81 -0
  149. data/lib/capybara/spec/session/has_css_spec.rb +45 -8
  150. data/lib/capybara/spec/session/has_current_path_spec.rb +22 -7
  151. data/lib/capybara/spec/session/has_element_spec.rb +47 -0
  152. data/lib/capybara/spec/session/has_field_spec.rb +59 -1
  153. data/lib/capybara/spec/session/has_link_spec.rb +40 -0
  154. data/lib/capybara/spec/session/has_none_selectors_spec.rb +7 -7
  155. data/lib/capybara/spec/session/has_select_spec.rb +42 -8
  156. data/lib/capybara/spec/session/has_selector_spec.rb +19 -4
  157. data/lib/capybara/spec/session/has_sibling_spec.rb +50 -0
  158. data/lib/capybara/spec/session/has_table_spec.rb +177 -0
  159. data/lib/capybara/spec/session/has_text_spec.rb +31 -3
  160. data/lib/capybara/spec/session/html_spec.rb +1 -1
  161. data/lib/capybara/spec/session/matches_style_spec.rb +6 -4
  162. data/lib/capybara/spec/session/node_spec.rb +697 -23
  163. data/lib/capybara/spec/session/node_wrapper_spec.rb +1 -1
  164. data/lib/capybara/spec/session/refresh_spec.rb +2 -1
  165. data/lib/capybara/spec/session/reset_session_spec.rb +21 -7
  166. data/lib/capybara/spec/session/save_and_open_screenshot_spec.rb +2 -2
  167. data/lib/capybara/spec/session/save_page_spec.rb +4 -4
  168. data/lib/capybara/spec/session/save_screenshot_spec.rb +4 -4
  169. data/lib/capybara/spec/session/scroll_spec.rb +9 -7
  170. data/lib/capybara/spec/session/select_spec.rb +5 -10
  171. data/lib/capybara/spec/session/selectors_spec.rb +24 -3
  172. data/lib/capybara/spec/session/uncheck_spec.rb +3 -3
  173. data/lib/capybara/spec/session/unselect_spec.rb +1 -1
  174. data/lib/capybara/spec/session/visit_spec.rb +20 -0
  175. data/lib/capybara/spec/session/window/become_closed_spec.rb +20 -17
  176. data/lib/capybara/spec/session/window/switch_to_window_spec.rb +1 -1
  177. data/lib/capybara/spec/session/window/window_opened_by_spec.rb +1 -1
  178. data/lib/capybara/spec/session/window/window_spec.rb +54 -57
  179. data/lib/capybara/spec/session/window/windows_spec.rb +2 -2
  180. data/lib/capybara/spec/session/within_spec.rb +36 -0
  181. data/lib/capybara/spec/spec_helper.rb +30 -19
  182. data/lib/capybara/spec/test_app.rb +122 -34
  183. data/lib/capybara/spec/views/animated.erb +49 -0
  184. data/lib/capybara/spec/views/form.erb +86 -8
  185. data/lib/capybara/spec/views/frame_child.erb +3 -2
  186. data/lib/capybara/spec/views/frame_one.erb +2 -1
  187. data/lib/capybara/spec/views/frame_parent.erb +1 -1
  188. data/lib/capybara/spec/views/frame_two.erb +1 -1
  189. data/lib/capybara/spec/views/initial_alert.erb +2 -1
  190. data/lib/capybara/spec/views/layout.erb +10 -0
  191. data/lib/capybara/spec/views/obscured.erb +10 -10
  192. data/lib/capybara/spec/views/offset.erb +33 -0
  193. data/lib/capybara/spec/views/path.erb +2 -2
  194. data/lib/capybara/spec/views/popup_one.erb +1 -1
  195. data/lib/capybara/spec/views/popup_two.erb +1 -1
  196. data/lib/capybara/spec/views/react.erb +45 -0
  197. data/lib/capybara/spec/views/scroll.erb +2 -1
  198. data/lib/capybara/spec/views/spatial.erb +31 -0
  199. data/lib/capybara/spec/views/tables.erb +67 -0
  200. data/lib/capybara/spec/views/with_animation.erb +39 -4
  201. data/lib/capybara/spec/views/with_base_tag.erb +2 -2
  202. data/lib/capybara/spec/views/with_dragula.erb +24 -0
  203. data/lib/capybara/spec/views/with_fixed_header_footer.erb +2 -1
  204. data/lib/capybara/spec/views/with_hover.erb +3 -2
  205. data/lib/capybara/spec/views/with_hover1.erb +10 -0
  206. data/lib/capybara/spec/views/with_html.erb +34 -6
  207. data/lib/capybara/spec/views/with_jquery_animation.erb +24 -0
  208. data/lib/capybara/spec/views/with_js.erb +7 -4
  209. data/lib/capybara/spec/views/with_jstree.erb +26 -0
  210. data/lib/capybara/spec/views/with_namespace.erb +1 -0
  211. data/lib/capybara/spec/views/with_scope.erb +2 -2
  212. data/lib/capybara/spec/views/with_scope_other.erb +6 -0
  213. data/lib/capybara/spec/views/with_shadow.erb +31 -0
  214. data/lib/capybara/spec/views/with_slow_unload.erb +2 -1
  215. data/lib/capybara/spec/views/with_sortable_js.erb +21 -0
  216. data/lib/capybara/spec/views/with_unload_alert.erb +1 -0
  217. data/lib/capybara/spec/views/with_windows.erb +1 -1
  218. data/lib/capybara/spec/views/within_frames.erb +1 -1
  219. data/lib/capybara/version.rb +1 -1
  220. data/lib/capybara/window.rb +14 -18
  221. data/lib/capybara.rb +91 -126
  222. data/spec/basic_node_spec.rb +30 -16
  223. data/spec/capybara_spec.rb +40 -28
  224. data/spec/counter_spec.rb +35 -0
  225. data/spec/css_builder_spec.rb +3 -1
  226. data/spec/css_splitter_spec.rb +1 -1
  227. data/spec/dsl_spec.rb +33 -22
  228. data/spec/filter_set_spec.rb +5 -5
  229. data/spec/fixtures/selenium_driver_rspec_failure.rb +3 -3
  230. data/spec/fixtures/selenium_driver_rspec_success.rb +3 -3
  231. data/spec/minitest_spec.rb +24 -2
  232. data/spec/minitest_spec_spec.rb +60 -45
  233. data/spec/per_session_config_spec.rb +1 -1
  234. data/spec/rack_test_spec.rb +131 -98
  235. data/spec/regexp_dissassembler_spec.rb +53 -39
  236. data/spec/result_spec.rb +68 -66
  237. data/spec/rspec/features_spec.rb +9 -4
  238. data/spec/rspec/scenarios_spec.rb +6 -2
  239. data/spec/rspec/shared_spec_matchers.rb +137 -98
  240. data/spec/rspec_matchers_spec.rb +25 -0
  241. data/spec/rspec_spec.rb +23 -21
  242. data/spec/sauce_spec_chrome.rb +43 -0
  243. data/spec/selector_spec.rb +77 -21
  244. data/spec/selenium_spec_chrome.rb +141 -39
  245. data/spec/selenium_spec_chrome_remote.rb +32 -17
  246. data/spec/selenium_spec_edge.rb +36 -8
  247. data/spec/selenium_spec_firefox.rb +110 -68
  248. data/spec/selenium_spec_firefox_remote.rb +22 -15
  249. data/spec/selenium_spec_ie.rb +29 -22
  250. data/spec/selenium_spec_safari.rb +162 -0
  251. data/spec/server_spec.rb +153 -81
  252. data/spec/session_spec.rb +11 -4
  253. data/spec/shared_selenium_node.rb +79 -0
  254. data/spec/shared_selenium_session.rb +179 -74
  255. data/spec/spec_helper.rb +80 -5
  256. data/spec/whitespace_normalizer_spec.rb +54 -0
  257. data/spec/xpath_builder_spec.rb +3 -1
  258. metadata +218 -30
  259. data/lib/capybara/spec/session/source_spec.rb +0 -0
  260. data/lib/capybara/spec/views/with_title.erb +0 -5
@@ -0,0 +1,49 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
+ <title>with_animation</title>
6
+ <script src="/jquery.js" type="text/javascript" charset="utf-8"></script>
7
+ <script>
8
+ $(document).on('contextmenu', function(e){ e.preventDefault(); });
9
+ </script>
10
+ <style>
11
+ div {
12
+ width: 400px;
13
+ height: 400px;
14
+ position: absolute;
15
+ }
16
+ #obscured {
17
+ z-index: 1;
18
+ background-color: red;
19
+ }
20
+ #cover {
21
+ z-index: 2;
22
+ background-color: blue;
23
+ }
24
+ #offscreen {
25
+ top: 2000px;
26
+ left: 2000px;
27
+ background-color: green;
28
+ }
29
+ #offscreen_wrapper {
30
+ top: 2000px;
31
+ left: 2000px;
32
+ overflow-x: scroll;
33
+ background-color: yellow;
34
+ }
35
+ </style>
36
+ </head>
37
+
38
+ <body id="with_animation">
39
+ <div id="obscured">
40
+ <input id="obscured_input"/>
41
+ </div>
42
+ <div id="cover"></div>
43
+ <div id="offscreen_wrapper">
44
+ <div id="offscreen"></div>
45
+ </div>
46
+ </body>
47
+
48
+ <iframe id="frameOne" src="/frame_one"></iframe>
49
+ </html>
@@ -1,17 +1,23 @@
1
-
2
1
  <h1>Form</h1>
3
2
 
4
- <form action="/form" method="post">
3
+ <button type="button" tabindex="1">A Button</button>
4
+
5
+ <label>
6
+ An Input
7
+ <input type="text" tabindex="2">
8
+ </label>
9
+
10
+ <form action="/form" method="post" novalidate>
5
11
 
6
12
  <p>
7
13
  <label for="form_title">Title</label>
8
- <select name="form[title]" id="form_title" class="title">
14
+ <select name="form[title]" id="form_title" class="title" tabindex="3">
9
15
  <option class="title">Mrs</option>
10
16
  <option class="title">Mr</option>
11
17
  <option>Miss</option>
12
18
  <option disabled="disabled">Other</option>
13
19
  </select>
14
- </p>
20
+ </p>
15
21
 
16
22
  <p>
17
23
  <label for="customer_name">Customer Name
@@ -62,6 +68,11 @@
62
68
  <input type="text" name="form[name]" value="John Smith" id="form_name"/>
63
69
  </p>
64
70
 
71
+ <p>
72
+ <label for="form_age">Age</label>
73
+ <input type="range" name="form[age]" value="18" min="13" max="100" step="0.5" id="form_age"/>
74
+ </p>
75
+
65
76
  <p>
66
77
  <label for="form_schmooo">Schmooo</label>
67
78
  <input type="schmooo" name="form[schmooo]" value="This is Schmooo!" id="form_schmooo"/>
@@ -94,6 +105,11 @@
94
105
  <input type="file" name="form[image]" id="form_image"/>
95
106
  </p>
96
107
 
108
+ <p>
109
+ <label for="form_hidden_image">Hidden Image</label>
110
+ <input type="file" name="form[hidden_image]" id="form_hidden_image" style="display: none"/>
111
+ </p>
112
+
97
113
  <p>
98
114
  <input type="hidden" name="form[token]" value="12345" id="form_token"/>
99
115
  </p>
@@ -103,7 +119,7 @@
103
119
  <select name="form[locale]" id="form_locale">
104
120
  <option value="sv">Swedish</option>
105
121
  <option selected="selected" value="en">English</option>
106
- <option value="fi">Finish</option>
122
+ <option value="fi">Finnish</option>
107
123
  <option value="no">Norwegian</option>
108
124
  <option value="jo">John's made-up language</option>
109
125
  <option value="jbo"> Lojban </option>
@@ -130,7 +146,11 @@
130
146
 
131
147
  <p>
132
148
  <label for="form_zipcode">Zipcode</label>
133
- <input type="text" maxlength="5" name="form[zipcode]" id="form_zipcode" />
149
+ <input type="text" maxlength="5" name="form[zipcode]" id="form_zipcode" pattern="[0-9]{5,9}" />
150
+ </p>
151
+
152
+ <p>
153
+ <input maxlength="35" id="long_length" />
134
154
  </p>
135
155
 
136
156
  <p>
@@ -156,7 +176,7 @@ New line after and before textarea tag
156
176
  <label for="gender_male">Male</label>
157
177
  <input type="radio" name="form[gender]" value="female" id="gender_female" checked="checked"/>
158
178
  <label for="gender_female">Female</label>
159
- <input type="radio" name="form[gender]" value="both" id="gender_both"/>
179
+ <input type="radio" name="form[gender]" value="both" id="gender_both" readonly="readonly"/>
160
180
  <label for="gender_both">Both</label>
161
181
  </p>
162
182
 
@@ -209,6 +229,8 @@ New line after and before textarea tag
209
229
  </label>
210
230
  <input type="checkbox" value="maserati" name="form[cars][]" id="form_cars_maserati" disabled="disabled"/>
211
231
  <label for="form_cars_maserati">Maserati</label>
232
+ <input type="checkbox" value="lotus" name="form[cars][]" id="form_cars_lotus" style="display: none"/>
233
+ <label for="form_cars_lotus"><a href="#" onclick="return false;">Link here</a>Lotus</label>
212
234
  </p>
213
235
 
214
236
  <p>
@@ -435,14 +457,25 @@ New line after and before textarea tag
435
457
 
436
458
  <p>
437
459
  <input type="button" aria-label="Aria button" name="form[fresh]" id="fresh_btn" value="i am fresh"/>
438
- <input type="submit" name="form[awesome]" id="awe123" title="What an Awesome Button" value="awesome"/>
460
+ <input type="submit" name="form[awesome]" id="awe123" data-test-id="test_id_button" title="What an Awesome Button" value="awesome"/>
439
461
  <input type="submit" name="form[crappy]" id="crap321" value="crappy"/>
440
462
  <input type="image" name="form[okay]" id="okay556" title="Okay 556 Image" value="okay" alt="oh hai thar"/>
441
463
  <button type="submit" id="click_me_123" title="Click Title button" value="click_me">Click me!</button>
442
464
  <button type="submit" name="form[no_value]">No Value!</button>
443
465
  <button id="no_type">No Type!</button>
444
466
  <button><img alt="A horse eating hay"/></button>
467
+ <button id="button_with_label"></button>
468
+ <label for="button_with_label">button with label element</label>
469
+ <label>
470
+ button within label element
471
+ <button></button>
472
+ </label>
473
+ <label>
474
+ role=button within label element
475
+ <span role="button">with other text</span>
476
+ </label>
445
477
  <input type="button" disabled="disabled" value="Disabled button"/>
478
+ <span role="button">ARIA button</span>
446
479
  </p>
447
480
 
448
481
  <p>
@@ -455,6 +488,11 @@ New line after and before textarea tag
455
488
  <input id="readonly" name="form[readonly_test]" readonly/>
456
489
  <input id="not_readonly" name="form[readonly_test]" />
457
490
  </p>
491
+
492
+ <p>
493
+ <input id="required" name="form[required]" required />
494
+ <input id="length" name="form[length]" minlength="4" maxlength="4" />
495
+ </p>
458
496
  </form>
459
497
 
460
498
  <input type="text" name="form[outside_input]" value="outside_input" form="form1"/>
@@ -464,6 +502,11 @@ New line after and before textarea tag
464
502
  <input type="text" name="nested_label" id="nested_label"/>
465
503
  </label>
466
504
 
505
+ <label id="wrapper_label">
506
+ Wrapper Label
507
+ <input type="checkbox"/>
508
+ </label>
509
+
467
510
  <form id="form1" action="/form" method="post">
468
511
  <input type="text" name="form[which_form]" value="form1" id="form_which_form"/>
469
512
  <input type="text" name="form[for_form2]" value="for_form2" form="form2"/>
@@ -497,6 +540,7 @@ New line after and before textarea tag
497
540
 
498
541
  <p>
499
542
  <input type="submit" name="form[mediocre]" id="mediocre" value="med" aria-label="Mediocre Button"/>
543
+ <input type="submit" formaction="/form/get?bar=foo" id="mediocre2" value="med2"/>
500
544
  <p>
501
545
  </form>
502
546
 
@@ -542,6 +586,19 @@ New line after and before textarea tag
542
586
  <p>
543
587
  </form>
544
588
 
589
+ <form action="/form" method="post" enctype="multipart/form-data">
590
+ <input type="hidden" name="form[document2]" value="hidden_field"/>
591
+
592
+ <p>
593
+ <label for="form_document">Document with hidden</label>
594
+ <input type="file" name="form[document2]" id="form_document2"/>
595
+ </p>
596
+
597
+ <p>
598
+ <input type="submit" value="Upload Empty With Hidden"/>
599
+ <p>
600
+ </form>
601
+
545
602
  <form action="/upload_multiple" method="post" enctype="multipart/form-data">
546
603
  <p>
547
604
  <label for="form_multiple_file_name">File Name</label>
@@ -638,6 +695,15 @@ New line after and before textarea tag
638
695
  </p>
639
696
  </form>
640
697
 
698
+ <form id="single_input_form" action="/form" method="post">
699
+ <input type="text" name="form[single_input]" id="single_input"/>
700
+ </form>
701
+
702
+ <form id="two_input_form" action="/form" method="post">
703
+ <input type="text" name="form[two_input_1]" id="two_input_1"/>
704
+ <input type="text" name="form[two_input_2]" id="two_input_2"/>
705
+ </form>
706
+
641
707
  <label>Confusion
642
708
  <input type="checkbox" id="confusion_checkbox" class="confusion-checkbox confusion"/>
643
709
  </label>
@@ -658,3 +724,15 @@ New line after and before textarea tag
658
724
  <p>
659
725
  <input id="special" {custom}="abcdef" value="custom attribute"/>
660
726
  </p>
727
+
728
+
729
+ <label for="multi_label_checkbox">
730
+ Label to click
731
+ </label>
732
+ <div>Something random that justifies the usage of a separate label</div>
733
+ <label>
734
+ <div>
735
+ <input type="checkbox" id="multi_label_checkbox" style="display: none"/>
736
+ <div>Visual representation of the checkbox</div>
737
+ </div>
738
+ </label>
@@ -1,4 +1,4 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>This is the child frame title</title>
@@ -10,7 +10,8 @@
10
10
  </script>
11
11
  </head>
12
12
  <body id="childBody">
13
- <a href="javascript:void(0)" onClick="closeWin()">Close Window</a>
13
+ <a href="javascript:void(0)" onClick="closeWin()">Close Window Now</a>
14
+ <a href="javascript:void(0)" onClick="setTimeout(function(){closeWin()}, 10)">Close Window Soon</a>
14
15
  <iframe src="/frame_one" id="grandchildFrame1"></iframe>
15
16
  <iframe src="/frame_two" id="grandchildFrame2"></iframe>
16
17
  </body>
@@ -1,9 +1,10 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>This is the title of frame one</title>
5
5
  </head>
6
6
  <body>
7
7
  <div id="divInFrameOne">This is the text of divInFrameOne</div>
8
+ <div id="otherDivInFrameOne">Some other text</div>
8
9
  </body>
9
10
  </html>
@@ -1,4 +1,4 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>This is the parent frame title</title>
@@ -1,4 +1,4 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>This is the title of frame two</title>
@@ -1,4 +1,5 @@
1
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
1
+ <!DOCTYPE html>
2
+ <html lang="en">
2
3
  <body>
3
4
  <div>
4
5
  Initial alert page
@@ -0,0 +1,10 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
+ </head>
6
+
7
+ <body>
8
+ <%= yield %>
9
+ </body>
10
+ </html>
@@ -1,15 +1,14 @@
1
+ <!DOCTYPE html>
1
2
  <html>
2
3
  <head>
3
4
  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
4
- <title>with_animation</title>
5
- <script src="/jquery.js" type="text/javascript" charset="utf-8"></script>
6
- <script>
7
- $(document).on('contextmenu', function(e){ e.preventDefault(); });
8
- </script>
5
+ <title>Obscured</title>
9
6
  <style>
10
7
  div {
11
- width: 400px;
12
- height: 400px;
8
+ width: 200px;
9
+ height: 200px;
10
+ }
11
+ #cover, #offscreen, #offscreen_wrapper {
13
12
  position: absolute;
14
13
  }
15
14
  #obscured {
@@ -17,6 +16,7 @@
17
16
  background-color: red;
18
17
  }
19
18
  #cover {
19
+ top: 0px;
20
20
  z-index: 2;
21
21
  background-color: blue;
22
22
  }
@@ -33,15 +33,15 @@
33
33
  }
34
34
  </style>
35
35
  </head>
36
-
37
- <body id="with_animation">
36
+ <body>
38
37
  <div id="obscured">
39
38
  <input id="obscured_input"/>
40
39
  </div>
41
40
  <div id="cover"></div>
41
+ <iframe id="frameOne" height="10px" src="/frame_one"></iframe>
42
+ <iframe id="nestedFrames" src="/frame_parent"></iframe>
42
43
  <div id="offscreen_wrapper">
43
44
  <div id="offscreen"></div>
44
45
  </div>
45
46
  </body>
46
47
  </html>
47
-
@@ -0,0 +1,33 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
+ <title>Offset</title>
6
+ <style>
7
+ body {
8
+ margin: 0px;
9
+ }
10
+ #wrapper {
11
+ width: 300px;
12
+ height: 300px;
13
+ margin: 0px;
14
+ }
15
+ #clicker {
16
+ position: relative;
17
+ width: 100px;
18
+ height: 100px;
19
+ top: 100px;
20
+ left: 100px;
21
+ background-color: red;
22
+ margin: 0px;
23
+ }
24
+ </style>
25
+ <script src="/jquery.js" type="text/javascript" charset="utf-8"></script>
26
+ <script src="/offset.js" type="text/javascript" charset="utf-8"></script>
27
+ </head>
28
+ <body>
29
+ <div id="wrapper">
30
+ <div id="clicker"></div>
31
+ </div>
32
+ </body>
33
+ </html>
@@ -1,5 +1,5 @@
1
-
2
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
3
  <body>
4
4
  <div>
5
5
  <a href="#">First Link</a>
@@ -1,4 +1,4 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>Title of the first popup</title>
@@ -1,4 +1,4 @@
1
-
1
+ <!DOCTYPE html>
2
2
  <html>
3
3
  <head>
4
4
  <title>Title of popup two</title>
@@ -0,0 +1,45 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <script src="https://unpkg.com/react/umd/react.development.js"></script>
5
+ <script src="https://unpkg.com/react-dom/umd/react-dom.development.js"></script>
6
+ </head>
7
+ <body>
8
+ <div id="root"></div>
9
+ <script>
10
+ // https://codepen.io/gaearon/pen/VmmPgp?editors=0010
11
+ class NameForm extends React.Component {
12
+ constructor(props) {
13
+ super(props);
14
+ this.state = { value: '' };
15
+
16
+ this.handleChange = this.handleChange.bind(this);
17
+ this.handleSubmit = this.handleSubmit.bind(this);
18
+ }
19
+
20
+ handleChange(event) {
21
+ this.setState({ value: event.target.value });
22
+ }
23
+
24
+ handleSubmit(event) {
25
+ alert('A name was submitted: ' + this.state.value);
26
+ event.preventDefault();
27
+ }
28
+
29
+ render() {
30
+ return (
31
+ React.createElement("form", { onSubmit: this.handleSubmit },
32
+ React.createElement("label", null, "Name:",
33
+
34
+ React.createElement("input", { type: "text", value: this.state.value, onChange: this.handleChange })),
35
+
36
+ React.createElement("input", { type: "submit", value: "Submit" })));
37
+ }}
38
+
39
+
40
+ ReactDOM.render(
41
+ React.createElement(NameForm, null),
42
+ document.getElementById('root'));
43
+ </script>
44
+ </body>
45
+ </html>
@@ -1,3 +1,4 @@
1
+ <!DOCTYPE html>
1
2
  <html style="height: 250%; width: 150%">
2
3
  <head>
3
4
  <style>
@@ -17,4 +18,4 @@
17
18
  </div>
18
19
  </div>
19
20
  </body>
20
- </html>
21
+ </html>
@@ -0,0 +1,31 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
+ <title>spatial</title>
6
+ <style>
7
+ #spatial {
8
+ display: grid;
9
+ grid-template-columns: repeat(3, 1fr);
10
+ grid-gap: 10px;
11
+ grid-auto-rows: minmax(100px, auto);
12
+ }
13
+ .footer {
14
+ grid-column: 1 / 4;
15
+ }
16
+ </style>
17
+ </head>
18
+
19
+ <body id="spatial">
20
+ <div class="corner">1</div>
21
+ <div class="distance">2</div>
22
+ <div class="corner">3</div>
23
+ <div>4</div>
24
+ <div class="center">5</div>
25
+ <div>6</div>
26
+ <div class="corner">7</div>
27
+ <div>8</div>
28
+ <div class="corner">9</div>
29
+ <div class="footer distance">10</div>
30
+ </body>
31
+ </html>
@@ -61,3 +61,70 @@
61
61
  </tr>
62
62
  </table>
63
63
  </form>
64
+
65
+ <table>
66
+ <caption>Horizontal Headers</caption>
67
+ <thead>
68
+ <tr>
69
+ <th>First Name</th>
70
+ <th>Last Name</th>
71
+ <th>City</th>
72
+ </tr>
73
+ </thead>
74
+ <tbody>
75
+ <tr>
76
+ <td>Thomas</td>
77
+ <td>Walpole</td>
78
+ <td>Oceanside</td>
79
+ </tr>
80
+ <tr>
81
+ <td>Danilo</td>
82
+ <td>Wilkinson</td>
83
+ <td>Johnsonville</td>
84
+ </tr>
85
+ <tr>
86
+ <td>Vern</td>
87
+ <td>Konopelski</td>
88
+ <td>Everette</td>
89
+ </tr>
90
+ <tr>
91
+ <td>Ratke</td>
92
+ <td>Lawrence</td>
93
+ <td>East Sorayashire</td>
94
+ </tr>
95
+ <tr>
96
+ <td>Palmer</td>
97
+ <td>Sawayn</td>
98
+ <td>West Trinidad</td>
99
+ </tr>
100
+ </tbody>
101
+ </table>
102
+
103
+ <table>
104
+ <caption>Vertical Headers</caption>
105
+ <tr>
106
+ <th>First Name</th>
107
+ <td>Thomas</td>
108
+ <td>Danilo</td>
109
+ <td>Vern</td>
110
+ <td>Ratke</td>
111
+ <td>Palmer</td>
112
+ </tr>
113
+ <tr>
114
+ <th>Last Name</th>
115
+ <td>Walpole</td>
116
+ <td>Wilkinson</td>
117
+ <td>Konopelski</td>
118
+ <td>Lawrence</td>
119
+ <td>Sawayn</td>
120
+ </tr>
121
+ <tr>
122
+ <th>City</th>
123
+ <td>Oceanside</td>
124
+ <td>Johnsonville</td>
125
+ <td>Everette</td>
126
+ <td>East Sorayashire</td>
127
+ <td>West Trinidad</td>
128
+ </tr>
129
+ </table>
130
+
@@ -1,12 +1,31 @@
1
-
2
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
3
  <head>
4
4
  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
5
  <title>with_animation</title>
6
6
  <script src="/jquery.js" type="text/javascript" charset="utf-8"></script>
7
7
  <script src="/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
8
8
  <script src="/test.js" type="text/javascript" charset="utf-8"></script>
9
+ <script type="text/javascript">
10
+ $(document).on('transitionend', function(){
11
+ $(document.body).append('<div>Transition Ended</div>')
12
+ });
13
+ $(document).on('animationend', function(){
14
+ $(document.body).append('<div>Animation Ended</div>')
15
+ });
16
+ $(document).on('contextmenu', function(e){
17
+ e.preventDefault();
18
+ });
19
+ </script>
9
20
  <style>
21
+ html {
22
+ scroll-behavior: smooth;
23
+ }
24
+
25
+ body {
26
+ min-height: 2000px;
27
+ }
28
+
10
29
  .transition.away {
11
30
  width: 0%;
12
31
  }
@@ -17,6 +36,13 @@
17
36
  overflow: hidden;
18
37
  }
19
38
 
39
+ a::after {
40
+ content: "";
41
+ width: 0px;
42
+ height: 0px;
43
+ background-color: blue;
44
+ }
45
+
20
46
  a:not(.away) {
21
47
  height: 20px;
22
48
  }
@@ -35,12 +61,21 @@
35
61
  animation-duration: 3s;
36
62
  animation-fill-mode: forwards;
37
63
  }
64
+
65
+ @keyframes pseudo_grow {
66
+ 100% { height: 100px, width: 100px };
67
+ }
68
+
69
+ a.animation.pseudo::after {
70
+ animation: pseudo_grow 3s forwards;
71
+ }
38
72
  </style>
39
73
  </head>
40
74
 
41
75
  <body id="with_animation">
42
76
  <a href='#' class='transition' onclick='this.classList.add("away")'>transition me away</a>
43
- <a href='#' class='animation' onclick='this.classList.add("away")'>animate me away</a>
77
+ <a href='#' class='animation' onclick='this.classList.add("away")' oncontextmenu='this.classList.add("pseudo")'>
78
+ animate me away
79
+ </a>
44
80
  </body>
45
81
  </html>
46
-
@@ -1,5 +1,5 @@
1
-
2
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
3
  <head>
4
4
  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5
5
  <base href="http://example2.com" />