HTMLInputElement.cpp 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387
  1. /*
  2. * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
  3. * Copyright (c) 2022, Adam Hodgen <ant1441@gmail.com>
  4. *
  5. * SPDX-License-Identifier: BSD-2-Clause
  6. */
  7. #include <LibWeb/DOM/Document.h>
  8. #include <LibWeb/DOM/Event.h>
  9. #include <LibWeb/DOM/ShadowRoot.h>
  10. #include <LibWeb/DOM/Text.h>
  11. #include <LibWeb/HTML/BrowsingContext.h>
  12. #include <LibWeb/HTML/EventNames.h>
  13. #include <LibWeb/HTML/HTMLFormElement.h>
  14. #include <LibWeb/HTML/HTMLInputElement.h>
  15. #include <LibWeb/Layout/BlockContainer.h>
  16. #include <LibWeb/Layout/ButtonBox.h>
  17. #include <LibWeb/Layout/CheckBox.h>
  18. #include <LibWeb/Layout/RadioButton.h>
  19. namespace Web::HTML {
  20. HTMLInputElement::HTMLInputElement(DOM::Document& document, DOM::QualifiedName qualified_name)
  21. : FormAssociatedElement(document, move(qualified_name))
  22. {
  23. activation_behavior = [this](auto&) {
  24. // The activation behavior for input elements are these steps:
  25. // FIXME: 1. If this element is not mutable and is not in the Checkbox state and is not in the Radio state, then return.
  26. // 2. Run this element's input activation behavior, if any, and do nothing otherwise.
  27. run_input_activation_behavior();
  28. };
  29. }
  30. HTMLInputElement::~HTMLInputElement()
  31. {
  32. }
  33. RefPtr<Layout::Node> HTMLInputElement::create_layout_node(NonnullRefPtr<CSS::StyleProperties> style)
  34. {
  35. if (type_state() == TypeAttributeState::Hidden)
  36. return nullptr;
  37. if (type_state() == TypeAttributeState::SubmitButton || type_state() == TypeAttributeState::Button || type_state() == TypeAttributeState::ResetButton)
  38. return adopt_ref(*new Layout::ButtonBox(document(), *this, move(style)));
  39. if (type_state() == TypeAttributeState::Checkbox)
  40. return adopt_ref(*new Layout::CheckBox(document(), *this, move(style)));
  41. if (type_state() == TypeAttributeState::RadioButton)
  42. return adopt_ref(*new Layout::RadioButton(document(), *this, move(style)));
  43. auto layout_node = adopt_ref(*new Layout::BlockContainer(document(), this, move(style)));
  44. layout_node->set_inline(true);
  45. return layout_node;
  46. }
  47. void HTMLInputElement::set_checked(bool checked, ChangeSource change_source)
  48. {
  49. if (m_checked == checked)
  50. return;
  51. // The dirty checkedness flag must be initially set to false when the element is created,
  52. // and must be set to true whenever the user interacts with the control in a way that changes the checkedness.
  53. if (change_source == ChangeSource::User)
  54. m_dirty_checkedness = true;
  55. m_checked = checked;
  56. set_needs_style_update(true);
  57. }
  58. void HTMLInputElement::set_checked_binding(bool checked)
  59. {
  60. if (type_state() == TypeAttributeState::RadioButton) {
  61. if (checked)
  62. set_checked_within_group();
  63. else
  64. set_checked(false, ChangeSource::Programmatic);
  65. } else {
  66. set_checked(checked, ChangeSource::Programmatic);
  67. }
  68. }
  69. // https://html.spec.whatwg.org/multipage/input.html#input-activation-behavior
  70. void HTMLInputElement::run_input_activation_behavior()
  71. {
  72. if (type_state() == TypeAttributeState::Checkbox || type_state() == TypeAttributeState::RadioButton) {
  73. // 1. If the element is not connected, then return.
  74. if (!is_connected())
  75. return;
  76. // 2. Fire an event named input at the element with the bubbles and composed attributes initialized to true.
  77. auto input_event = DOM::Event::create(HTML::EventNames::input);
  78. input_event->set_bubbles(true);
  79. input_event->set_composed(true);
  80. dispatch_event(move(input_event));
  81. // 3. Fire an event named change at the element with the bubbles attribute initialized to true.
  82. auto change_event = DOM::Event::create(HTML::EventNames::change);
  83. change_event->set_bubbles(true);
  84. dispatch_event(move(change_event));
  85. } else if (type_state() == TypeAttributeState::SubmitButton) {
  86. RefPtr<HTMLFormElement> form;
  87. // 1. If the element does not have a form owner, then return.
  88. if (!(form = this->form()))
  89. return;
  90. // 2. If the element's node document is not fully active, then return.
  91. if (!document().is_fully_active())
  92. return;
  93. // 3. Submit the form owner from the element.
  94. form->submit_form(this);
  95. } else {
  96. dispatch_event(DOM::Event::create(EventNames::change));
  97. }
  98. }
  99. void HTMLInputElement::did_edit_text_node(Badge<BrowsingContext>)
  100. {
  101. // NOTE: This is a bit ad-hoc, but basically implements part of "4.10.5.5 Common event behaviors"
  102. // https://html.spec.whatwg.org/multipage/input.html#common-input-element-events
  103. queue_an_element_task(HTML::Task::Source::UserInteraction, [this] {
  104. auto input_event = DOM::Event::create(HTML::EventNames::input);
  105. input_event->set_bubbles(true);
  106. input_event->set_composed(true);
  107. dispatch_event(move(input_event));
  108. // FIXME: This should only fire when the input is "committed", whatever that means.
  109. auto change_event = DOM::Event::create(HTML::EventNames::change);
  110. change_event->set_bubbles(true);
  111. dispatch_event(move(change_event));
  112. });
  113. }
  114. String HTMLInputElement::value() const
  115. {
  116. if (m_text_node)
  117. return m_text_node->data();
  118. return default_value();
  119. }
  120. void HTMLInputElement::set_value(String value)
  121. {
  122. auto sanitised_value = value_sanitization_algorithm(move(value));
  123. if (m_text_node) {
  124. m_text_node->set_data(sanitised_value);
  125. return;
  126. }
  127. set_attribute(HTML::AttributeNames::value, sanitised_value);
  128. }
  129. void HTMLInputElement::create_shadow_tree_if_needed()
  130. {
  131. if (shadow_root())
  132. return;
  133. // FIXME: This could be better factored. Everything except the below types becomes a text input.
  134. switch (type_state()) {
  135. case TypeAttributeState::RadioButton:
  136. case TypeAttributeState::Checkbox:
  137. case TypeAttributeState::Button:
  138. case TypeAttributeState::SubmitButton:
  139. case TypeAttributeState::ResetButton:
  140. case TypeAttributeState::ImageButton:
  141. return;
  142. default:
  143. break;
  144. }
  145. auto shadow_root = adopt_ref(*new DOM::ShadowRoot(document(), *this));
  146. auto initial_value = attribute(HTML::AttributeNames::value);
  147. if (initial_value.is_null())
  148. initial_value = String::empty();
  149. auto element = document().create_element(HTML::TagNames::div).release_value();
  150. element->set_attribute(HTML::AttributeNames::style, "white-space: pre; padding-top: 1px; padding-bottom: 1px; padding-left: 2px; padding-right: 2px");
  151. m_text_node = adopt_ref(*new DOM::Text(document(), initial_value));
  152. m_text_node->set_always_editable(true);
  153. m_text_node->set_owner_input_element({}, *this);
  154. element->append_child(*m_text_node);
  155. shadow_root->append_child(move(element));
  156. set_shadow_root(move(shadow_root));
  157. }
  158. void HTMLInputElement::did_receive_focus()
  159. {
  160. auto* browsing_context = document().browsing_context();
  161. if (!browsing_context)
  162. return;
  163. if (!m_text_node)
  164. return;
  165. browsing_context->set_cursor_position(DOM::Position { *m_text_node, 0 });
  166. }
  167. bool HTMLInputElement::is_focusable() const
  168. {
  169. return m_text_node;
  170. }
  171. void HTMLInputElement::parse_attribute(FlyString const& name, String const& value)
  172. {
  173. FormAssociatedElement::parse_attribute(name, value);
  174. if (name == HTML::AttributeNames::checked) {
  175. // When the checked content attribute is added, if the control does not have dirty checkedness,
  176. // the user agent must set the checkedness of the element to true
  177. if (!m_dirty_checkedness)
  178. set_checked(true, ChangeSource::Programmatic);
  179. } else if (name == HTML::AttributeNames::type) {
  180. m_type = parse_type_attribute(value);
  181. }
  182. }
  183. HTMLInputElement::TypeAttributeState HTMLInputElement::parse_type_attribute(StringView type)
  184. {
  185. #define __ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTE(keyword, state) \
  186. if (type.equals_ignoring_case(#keyword)) \
  187. return HTMLInputElement::TypeAttributeState::state;
  188. ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTES
  189. #undef __ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTE
  190. // The missing value default and the invalid value default are the Text state.
  191. // https://html.spec.whatwg.org/multipage/input.html#the-input-element:missing-value-default
  192. // https://html.spec.whatwg.org/multipage/input.html#the-input-element:invalid-value-default
  193. return HTMLInputElement::TypeAttributeState::Text;
  194. }
  195. void HTMLInputElement::did_remove_attribute(FlyString const& name)
  196. {
  197. FormAssociatedElement::did_remove_attribute(name);
  198. if (name == HTML::AttributeNames::checked) {
  199. // When the checked content attribute is removed, if the control does not have dirty checkedness,
  200. // the user agent must set the checkedness of the element to false.
  201. if (!m_dirty_checkedness)
  202. set_checked(false, ChangeSource::Programmatic);
  203. }
  204. }
  205. String HTMLInputElement::type() const
  206. {
  207. switch (m_type) {
  208. #define __ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTE(keyword, state) \
  209. case TypeAttributeState::state: \
  210. return #keyword##sv;
  211. ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTES
  212. #undef __ENUMERATE_HTML_INPUT_TYPE_ATTRIBUTE
  213. }
  214. VERIFY_NOT_REACHED();
  215. }
  216. void HTMLInputElement::set_type(String const& type)
  217. {
  218. set_attribute(HTML::AttributeNames::type, type);
  219. }
  220. // https://html.spec.whatwg.org/multipage/input.html#value-sanitization-algorithm
  221. String HTMLInputElement::value_sanitization_algorithm(String value) const
  222. {
  223. if (type_state() == HTMLInputElement::TypeAttributeState::Text || type_state() == HTMLInputElement::TypeAttributeState::Search || type_state() == HTMLInputElement::TypeAttributeState::Telephone || type_state() == HTMLInputElement::TypeAttributeState::Password) {
  224. // Strip newlines from the value.
  225. if (value.contains('\r') || value.contains('\n')) {
  226. StringBuilder builder;
  227. for (auto c : value) {
  228. if (!(c == '\r' || c == '\n'))
  229. builder.append(c);
  230. }
  231. return builder.to_string();
  232. }
  233. } else if (type_state() == HTMLInputElement::TypeAttributeState::URL) {
  234. // Strip newlines from the value, then strip leading and trailing ASCII whitespace from the value.
  235. if (value.contains('\r') || value.contains('\n')) {
  236. StringBuilder builder;
  237. for (auto c : value) {
  238. if (!(c == '\r' || c == '\n'))
  239. builder.append(c);
  240. }
  241. return builder.to_string().trim_whitespace();
  242. }
  243. } else if (type_state() == HTMLInputElement::TypeAttributeState::Number) {
  244. // If the value of the element is not a valid floating-point number, then set it to the empty string instead.
  245. char* end_ptr;
  246. auto val = strtod(value.characters(), &end_ptr);
  247. if (!isfinite(val) || *end_ptr)
  248. return "";
  249. }
  250. // FIXME: Implement remaining value sanitation algorithms
  251. return value;
  252. }
  253. void HTMLInputElement::inserted()
  254. {
  255. create_shadow_tree_if_needed();
  256. }
  257. void HTMLInputElement::set_checked_within_group()
  258. {
  259. if (checked())
  260. return;
  261. set_checked(true, ChangeSource::User);
  262. String name = this->name();
  263. document().for_each_in_inclusive_subtree_of_type<HTML::HTMLInputElement>([&](auto& element) {
  264. if (element.checked() && &element != this && element.name() == name)
  265. element.set_checked(false, ChangeSource::User);
  266. return IterationDecision::Continue;
  267. });
  268. }
  269. // https://html.spec.whatwg.org/multipage/input.html#the-input-element:legacy-pre-activation-behavior
  270. void HTMLInputElement::legacy_pre_activation_behavior()
  271. {
  272. m_before_legacy_pre_activation_behavior_checked = checked();
  273. // 1. If this element's type attribute is in the Checkbox state, then set
  274. // this element's checkedness to its opposite value (i.e. true if it is
  275. // false, false if it is true) and set this element's indeterminate IDL
  276. // attribute to false.
  277. // FIXME: Set indeterminate to false when that exists.
  278. if (type_state() == TypeAttributeState::Checkbox) {
  279. set_checked(!checked(), ChangeSource::User);
  280. }
  281. // 2. If this element's type attribute is in the Radio Button state, then
  282. // get a reference to the element in this element's radio button group that
  283. // has its checkedness set to true, if any, and then set this element's
  284. // checkedness to true.
  285. if (type_state() == TypeAttributeState::RadioButton) {
  286. String name = this->name();
  287. document().for_each_in_inclusive_subtree_of_type<HTML::HTMLInputElement>([&](auto& element) {
  288. if (element.checked() && element.name() == name) {
  289. m_legacy_pre_activation_behavior_checked_element_in_group = element;
  290. return IterationDecision::Break;
  291. }
  292. return IterationDecision::Continue;
  293. });
  294. set_checked_within_group();
  295. }
  296. }
  297. // https://html.spec.whatwg.org/multipage/input.html#the-input-element:legacy-canceled-activation-behavior
  298. void HTMLInputElement::legacy_cancelled_activation_behavior()
  299. {
  300. // 1. If the element's type attribute is in the Checkbox state, then set the
  301. // element's checkedness and the element's indeterminate IDL attribute back
  302. // to the values they had before the legacy-pre-activation behavior was run.
  303. if (type_state() == TypeAttributeState::Checkbox) {
  304. set_checked(m_before_legacy_pre_activation_behavior_checked, ChangeSource::Programmatic);
  305. }
  306. // 2. If this element 's type attribute is in the Radio Button state, then
  307. // if the element to which a reference was obtained in the
  308. // legacy-pre-activation behavior, if any, is still in what is now this
  309. // element' s radio button group, if it still has one, and if so, setting
  310. // that element 's checkedness to true; or else, if there was no such
  311. // element, or that element is no longer in this element' s radio button
  312. // group, or if this element no longer has a radio button group, setting
  313. // this element's checkedness to false.
  314. if (type_state() == TypeAttributeState::RadioButton) {
  315. String name = this->name();
  316. bool did_reselect_previous_element = false;
  317. if (m_legacy_pre_activation_behavior_checked_element_in_group) {
  318. auto& element_in_group = *m_legacy_pre_activation_behavior_checked_element_in_group;
  319. if (name == element_in_group.name()) {
  320. element_in_group.set_checked_within_group();
  321. did_reselect_previous_element = true;
  322. }
  323. m_legacy_pre_activation_behavior_checked_element_in_group = nullptr;
  324. }
  325. if (!did_reselect_previous_element)
  326. set_checked(false, ChangeSource::User);
  327. }
  328. }
  329. void HTMLInputElement::legacy_cancelled_activation_behavior_was_not_called()
  330. {
  331. m_legacy_pre_activation_behavior_checked_element_in_group = nullptr;
  332. }
  333. }