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.
- checksums.yaml +4 -4
- data/.yardopts +1 -0
- data/History.md +587 -16
- data/README.md +240 -90
- data/lib/capybara/config.rb +24 -11
- data/lib/capybara/cucumber.rb +1 -1
- data/lib/capybara/driver/base.rb +8 -0
- data/lib/capybara/driver/node.rb +20 -4
- data/lib/capybara/dsl.rb +5 -3
- data/lib/capybara/helpers.rb +25 -4
- data/lib/capybara/minitest/spec.rb +174 -90
- data/lib/capybara/minitest.rb +256 -142
- data/lib/capybara/node/actions.rb +123 -77
- data/lib/capybara/node/base.rb +20 -12
- data/lib/capybara/node/document.rb +2 -2
- data/lib/capybara/node/document_matchers.rb +3 -3
- data/lib/capybara/node/element.rb +223 -117
- data/lib/capybara/node/finders.rb +81 -71
- data/lib/capybara/node/matchers.rb +271 -134
- data/lib/capybara/node/simple.rb +18 -5
- data/lib/capybara/node/whitespace_normalizer.rb +81 -0
- data/lib/capybara/queries/active_element_query.rb +18 -0
- data/lib/capybara/queries/ancestor_query.rb +8 -9
- data/lib/capybara/queries/base_query.rb +3 -2
- data/lib/capybara/queries/current_path_query.rb +15 -5
- data/lib/capybara/queries/selector_query.rb +364 -54
- data/lib/capybara/queries/sibling_query.rb +8 -6
- data/lib/capybara/queries/style_query.rb +2 -2
- data/lib/capybara/queries/text_query.rb +13 -1
- data/lib/capybara/queries/title_query.rb +1 -1
- data/lib/capybara/rack_test/browser.rb +76 -11
- data/lib/capybara/rack_test/driver.rb +10 -5
- data/lib/capybara/rack_test/errors.rb +6 -0
- data/lib/capybara/rack_test/form.rb +31 -9
- data/lib/capybara/rack_test/node.rb +74 -23
- data/lib/capybara/registration_container.rb +41 -0
- data/lib/capybara/registrations/drivers.rb +42 -0
- data/lib/capybara/registrations/patches/puma_ssl.rb +29 -0
- data/lib/capybara/registrations/servers.rb +66 -0
- data/lib/capybara/result.rb +44 -20
- data/lib/capybara/rspec/matcher_proxies.rb +13 -11
- data/lib/capybara/rspec/matchers/base.rb +31 -16
- data/lib/capybara/rspec/matchers/compound.rb +1 -1
- data/lib/capybara/rspec/matchers/count_sugar.rb +37 -0
- data/lib/capybara/rspec/matchers/have_ancestor.rb +28 -0
- data/lib/capybara/rspec/matchers/have_current_path.rb +2 -2
- data/lib/capybara/rspec/matchers/have_selector.rb +21 -21
- data/lib/capybara/rspec/matchers/have_sibling.rb +27 -0
- data/lib/capybara/rspec/matchers/have_text.rb +4 -4
- data/lib/capybara/rspec/matchers/have_title.rb +2 -2
- data/lib/capybara/rspec/matchers/match_selector.rb +3 -3
- data/lib/capybara/rspec/matchers/match_style.rb +7 -2
- data/lib/capybara/rspec/matchers/spatial_sugar.rb +39 -0
- data/lib/capybara/rspec/matchers.rb +111 -68
- data/lib/capybara/rspec.rb +2 -0
- data/lib/capybara/selector/builders/css_builder.rb +11 -7
- data/lib/capybara/selector/builders/xpath_builder.rb +5 -3
- data/lib/capybara/selector/css.rb +11 -9
- data/lib/capybara/selector/definition/button.rb +68 -0
- data/lib/capybara/selector/definition/checkbox.rb +26 -0
- data/lib/capybara/selector/definition/css.rb +10 -0
- data/lib/capybara/selector/definition/datalist_input.rb +35 -0
- data/lib/capybara/selector/definition/datalist_option.rb +25 -0
- data/lib/capybara/selector/definition/element.rb +28 -0
- data/lib/capybara/selector/definition/field.rb +40 -0
- data/lib/capybara/selector/definition/fieldset.rb +14 -0
- data/lib/capybara/selector/definition/file_field.rb +13 -0
- data/lib/capybara/selector/definition/fillable_field.rb +33 -0
- data/lib/capybara/selector/definition/frame.rb +17 -0
- data/lib/capybara/selector/definition/id.rb +6 -0
- data/lib/capybara/selector/definition/label.rb +62 -0
- data/lib/capybara/selector/definition/link.rb +55 -0
- data/lib/capybara/selector/definition/link_or_button.rb +16 -0
- data/lib/capybara/selector/definition/option.rb +27 -0
- data/lib/capybara/selector/definition/radio_button.rb +27 -0
- data/lib/capybara/selector/definition/select.rb +81 -0
- data/lib/capybara/selector/definition/table.rb +109 -0
- data/lib/capybara/selector/definition/table_row.rb +21 -0
- data/lib/capybara/selector/definition/xpath.rb +5 -0
- data/lib/capybara/selector/definition.rb +280 -0
- data/lib/capybara/selector/filter_set.rb +19 -18
- data/lib/capybara/selector/filters/base.rb +11 -2
- data/lib/capybara/selector/filters/locator_filter.rb +13 -3
- data/lib/capybara/selector/regexp_disassembler.rb +11 -7
- data/lib/capybara/selector/selector.rb +50 -440
- data/lib/capybara/selector/xpath_extensions.rb +17 -0
- data/lib/capybara/selector.rb +473 -482
- data/lib/capybara/selenium/atoms/getAttribute.min.js +1 -0
- data/lib/capybara/selenium/atoms/isDisplayed.min.js +1 -0
- data/lib/capybara/selenium/atoms/src/getAttribute.js +161 -0
- data/lib/capybara/selenium/atoms/src/isDisplayed.js +454 -0
- data/lib/capybara/selenium/driver.rb +174 -62
- data/lib/capybara/selenium/driver_specializations/chrome_driver.rb +74 -18
- data/lib/capybara/selenium/driver_specializations/edge_driver.rb +128 -0
- data/lib/capybara/selenium/driver_specializations/firefox_driver.rb +37 -3
- data/lib/capybara/selenium/driver_specializations/internet_explorer_driver.rb +14 -1
- data/lib/capybara/selenium/driver_specializations/safari_driver.rb +24 -0
- data/lib/capybara/selenium/extensions/file_input_click_emulation.rb +34 -0
- data/lib/capybara/selenium/extensions/find.rb +68 -45
- data/lib/capybara/selenium/extensions/html5_drag.rb +192 -22
- data/lib/capybara/selenium/extensions/modifier_keys_stack.rb +28 -0
- data/lib/capybara/selenium/extensions/scroll.rb +8 -10
- data/lib/capybara/selenium/node.rb +268 -72
- data/lib/capybara/selenium/nodes/chrome_node.rb +105 -9
- data/lib/capybara/selenium/nodes/edge_node.rb +110 -0
- data/lib/capybara/selenium/nodes/firefox_node.rb +51 -61
- data/lib/capybara/selenium/nodes/ie_node.rb +22 -0
- data/lib/capybara/selenium/nodes/safari_node.rb +118 -0
- data/lib/capybara/selenium/patches/atoms.rb +18 -0
- data/lib/capybara/selenium/patches/is_displayed.rb +16 -0
- data/lib/capybara/selenium/patches/logs.rb +45 -0
- data/lib/capybara/selenium/patches/pause_duration_fix.rb +1 -1
- data/lib/capybara/selenium/patches/persistent_client.rb +20 -0
- data/lib/capybara/server/animation_disabler.rb +43 -21
- data/lib/capybara/server/checker.rb +6 -2
- data/lib/capybara/server/middleware.rb +25 -13
- data/lib/capybara/server.rb +20 -4
- data/lib/capybara/session/config.rb +15 -11
- data/lib/capybara/session/matchers.rb +11 -11
- data/lib/capybara/session.rb +162 -131
- data/lib/capybara/spec/public/offset.js +6 -0
- data/lib/capybara/spec/public/test.js +105 -6
- data/lib/capybara/spec/session/accept_alert_spec.rb +1 -1
- data/lib/capybara/spec/session/active_element_spec.rb +31 -0
- data/lib/capybara/spec/session/all_spec.rb +89 -15
- data/lib/capybara/spec/session/ancestor_spec.rb +5 -0
- data/lib/capybara/spec/session/assert_current_path_spec.rb +5 -2
- data/lib/capybara/spec/session/assert_text_spec.rb +26 -22
- data/lib/capybara/spec/session/attach_file_spec.rb +64 -31
- data/lib/capybara/spec/session/check_spec.rb +26 -4
- data/lib/capybara/spec/session/choose_spec.rb +14 -2
- data/lib/capybara/spec/session/click_button_spec.rb +109 -61
- data/lib/capybara/spec/session/click_link_or_button_spec.rb +9 -0
- data/lib/capybara/spec/session/click_link_spec.rb +23 -1
- data/lib/capybara/spec/session/current_scope_spec.rb +1 -1
- data/lib/capybara/spec/session/current_url_spec.rb +11 -1
- data/lib/capybara/spec/session/element/matches_selector_spec.rb +40 -39
- data/lib/capybara/spec/session/evaluate_script_spec.rb +12 -0
- data/lib/capybara/spec/session/fill_in_spec.rb +46 -5
- data/lib/capybara/spec/session/find_link_spec.rb +10 -0
- data/lib/capybara/spec/session/find_spec.rb +80 -7
- data/lib/capybara/spec/session/first_spec.rb +2 -2
- data/lib/capybara/spec/session/frame/switch_to_frame_spec.rb +14 -1
- data/lib/capybara/spec/session/frame/within_frame_spec.rb +14 -1
- data/lib/capybara/spec/session/has_all_selectors_spec.rb +5 -5
- data/lib/capybara/spec/session/has_ancestor_spec.rb +46 -0
- data/lib/capybara/spec/session/has_any_selectors_spec.rb +6 -2
- data/lib/capybara/spec/session/has_button_spec.rb +81 -0
- data/lib/capybara/spec/session/has_css_spec.rb +45 -8
- data/lib/capybara/spec/session/has_current_path_spec.rb +22 -7
- data/lib/capybara/spec/session/has_element_spec.rb +47 -0
- data/lib/capybara/spec/session/has_field_spec.rb +59 -1
- data/lib/capybara/spec/session/has_link_spec.rb +40 -0
- data/lib/capybara/spec/session/has_none_selectors_spec.rb +7 -7
- data/lib/capybara/spec/session/has_select_spec.rb +42 -8
- data/lib/capybara/spec/session/has_selector_spec.rb +19 -4
- data/lib/capybara/spec/session/has_sibling_spec.rb +50 -0
- data/lib/capybara/spec/session/has_table_spec.rb +177 -0
- data/lib/capybara/spec/session/has_text_spec.rb +31 -3
- data/lib/capybara/spec/session/html_spec.rb +1 -1
- data/lib/capybara/spec/session/matches_style_spec.rb +6 -4
- data/lib/capybara/spec/session/node_spec.rb +697 -23
- data/lib/capybara/spec/session/node_wrapper_spec.rb +1 -1
- data/lib/capybara/spec/session/refresh_spec.rb +2 -1
- data/lib/capybara/spec/session/reset_session_spec.rb +21 -7
- data/lib/capybara/spec/session/save_and_open_screenshot_spec.rb +2 -2
- data/lib/capybara/spec/session/save_page_spec.rb +4 -4
- data/lib/capybara/spec/session/save_screenshot_spec.rb +4 -4
- data/lib/capybara/spec/session/scroll_spec.rb +9 -7
- data/lib/capybara/spec/session/select_spec.rb +5 -10
- data/lib/capybara/spec/session/selectors_spec.rb +24 -3
- data/lib/capybara/spec/session/uncheck_spec.rb +3 -3
- data/lib/capybara/spec/session/unselect_spec.rb +1 -1
- data/lib/capybara/spec/session/visit_spec.rb +20 -0
- data/lib/capybara/spec/session/window/become_closed_spec.rb +20 -17
- data/lib/capybara/spec/session/window/switch_to_window_spec.rb +1 -1
- data/lib/capybara/spec/session/window/window_opened_by_spec.rb +1 -1
- data/lib/capybara/spec/session/window/window_spec.rb +54 -57
- data/lib/capybara/spec/session/window/windows_spec.rb +2 -2
- data/lib/capybara/spec/session/within_spec.rb +36 -0
- data/lib/capybara/spec/spec_helper.rb +30 -19
- data/lib/capybara/spec/test_app.rb +122 -34
- data/lib/capybara/spec/views/animated.erb +49 -0
- data/lib/capybara/spec/views/form.erb +86 -8
- data/lib/capybara/spec/views/frame_child.erb +3 -2
- data/lib/capybara/spec/views/frame_one.erb +2 -1
- data/lib/capybara/spec/views/frame_parent.erb +1 -1
- data/lib/capybara/spec/views/frame_two.erb +1 -1
- data/lib/capybara/spec/views/initial_alert.erb +2 -1
- data/lib/capybara/spec/views/layout.erb +10 -0
- data/lib/capybara/spec/views/obscured.erb +10 -10
- data/lib/capybara/spec/views/offset.erb +33 -0
- data/lib/capybara/spec/views/path.erb +2 -2
- data/lib/capybara/spec/views/popup_one.erb +1 -1
- data/lib/capybara/spec/views/popup_two.erb +1 -1
- data/lib/capybara/spec/views/react.erb +45 -0
- data/lib/capybara/spec/views/scroll.erb +2 -1
- data/lib/capybara/spec/views/spatial.erb +31 -0
- data/lib/capybara/spec/views/tables.erb +67 -0
- data/lib/capybara/spec/views/with_animation.erb +39 -4
- data/lib/capybara/spec/views/with_base_tag.erb +2 -2
- data/lib/capybara/spec/views/with_dragula.erb +24 -0
- data/lib/capybara/spec/views/with_fixed_header_footer.erb +2 -1
- data/lib/capybara/spec/views/with_hover.erb +3 -2
- data/lib/capybara/spec/views/with_hover1.erb +10 -0
- data/lib/capybara/spec/views/with_html.erb +34 -6
- data/lib/capybara/spec/views/with_jquery_animation.erb +24 -0
- data/lib/capybara/spec/views/with_js.erb +7 -4
- data/lib/capybara/spec/views/with_jstree.erb +26 -0
- data/lib/capybara/spec/views/with_namespace.erb +1 -0
- data/lib/capybara/spec/views/with_scope.erb +2 -2
- data/lib/capybara/spec/views/with_scope_other.erb +6 -0
- data/lib/capybara/spec/views/with_shadow.erb +31 -0
- data/lib/capybara/spec/views/with_slow_unload.erb +2 -1
- data/lib/capybara/spec/views/with_sortable_js.erb +21 -0
- data/lib/capybara/spec/views/with_unload_alert.erb +1 -0
- data/lib/capybara/spec/views/with_windows.erb +1 -1
- data/lib/capybara/spec/views/within_frames.erb +1 -1
- data/lib/capybara/version.rb +1 -1
- data/lib/capybara/window.rb +14 -18
- data/lib/capybara.rb +91 -126
- data/spec/basic_node_spec.rb +30 -16
- data/spec/capybara_spec.rb +40 -28
- data/spec/counter_spec.rb +35 -0
- data/spec/css_builder_spec.rb +3 -1
- data/spec/css_splitter_spec.rb +1 -1
- data/spec/dsl_spec.rb +33 -22
- data/spec/filter_set_spec.rb +5 -5
- data/spec/fixtures/selenium_driver_rspec_failure.rb +3 -3
- data/spec/fixtures/selenium_driver_rspec_success.rb +3 -3
- data/spec/minitest_spec.rb +24 -2
- data/spec/minitest_spec_spec.rb +60 -45
- data/spec/per_session_config_spec.rb +1 -1
- data/spec/rack_test_spec.rb +131 -98
- data/spec/regexp_dissassembler_spec.rb +53 -39
- data/spec/result_spec.rb +68 -66
- data/spec/rspec/features_spec.rb +9 -4
- data/spec/rspec/scenarios_spec.rb +6 -2
- data/spec/rspec/shared_spec_matchers.rb +137 -98
- data/spec/rspec_matchers_spec.rb +25 -0
- data/spec/rspec_spec.rb +23 -21
- data/spec/sauce_spec_chrome.rb +43 -0
- data/spec/selector_spec.rb +77 -21
- data/spec/selenium_spec_chrome.rb +141 -39
- data/spec/selenium_spec_chrome_remote.rb +32 -17
- data/spec/selenium_spec_edge.rb +36 -8
- data/spec/selenium_spec_firefox.rb +110 -68
- data/spec/selenium_spec_firefox_remote.rb +22 -15
- data/spec/selenium_spec_ie.rb +29 -22
- data/spec/selenium_spec_safari.rb +162 -0
- data/spec/server_spec.rb +153 -81
- data/spec/session_spec.rb +11 -4
- data/spec/shared_selenium_node.rb +79 -0
- data/spec/shared_selenium_session.rb +179 -74
- data/spec/spec_helper.rb +80 -5
- data/spec/whitespace_normalizer_spec.rb +54 -0
- data/spec/xpath_builder_spec.rb +3 -1
- metadata +218 -30
- data/lib/capybara/spec/session/source_spec.rb +0 -0
- 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
|
-
<
|
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
|
-
|
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">
|
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,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>
|
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:
|
12
|
-
height:
|
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>
|
@@ -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>
|
@@ -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
|
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")'
|
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
|
-
|