HTMLTextAreaElement.cpp 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381
  1. /*
  2. * Copyright (c) 2020, the SerenityOS developers.
  3. * Copyright (c) 2023, Sam Atkins <atkinssj@serenityos.org>
  4. * Copyright (c) 2024, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
  5. *
  6. * SPDX-License-Identifier: BSD-2-Clause
  7. */
  8. #include <LibWeb/Bindings/Intrinsics.h>
  9. #include <LibWeb/CSS/StyleProperties.h>
  10. #include <LibWeb/CSS/StyleValues/DisplayStyleValue.h>
  11. #include <LibWeb/CSS/StyleValues/LengthStyleValue.h>
  12. #include <LibWeb/DOM/Document.h>
  13. #include <LibWeb/DOM/ElementFactory.h>
  14. #include <LibWeb/DOM/Event.h>
  15. #include <LibWeb/DOM/ShadowRoot.h>
  16. #include <LibWeb/DOM/Text.h>
  17. #include <LibWeb/HTML/HTMLTextAreaElement.h>
  18. #include <LibWeb/HTML/Numbers.h>
  19. #include <LibWeb/Infra/Strings.h>
  20. #include <LibWeb/Namespace.h>
  21. namespace Web::HTML {
  22. JS_DEFINE_ALLOCATOR(HTMLTextAreaElement);
  23. HTMLTextAreaElement::HTMLTextAreaElement(DOM::Document& document, DOM::QualifiedName qualified_name)
  24. : HTMLElement(document, move(qualified_name))
  25. , m_input_event_timer(Web::Platform::Timer::create_single_shot(0, [this]() { queue_firing_input_event(); }))
  26. {
  27. }
  28. HTMLTextAreaElement::~HTMLTextAreaElement() = default;
  29. void HTMLTextAreaElement::adjust_computed_style(CSS::StyleProperties& style)
  30. {
  31. // AD-HOC: We rewrite `display: inline` to `display: inline-block`.
  32. // This is required for the internal shadow tree to work correctly in layout.
  33. if (style.display().is_inline_outside() && style.display().is_flow_inside())
  34. style.set_property(CSS::PropertyID::Display, CSS::DisplayStyleValue::create(CSS::Display::from_short(CSS::Display::Short::InlineBlock)));
  35. if (style.property(CSS::PropertyID::Width)->has_auto())
  36. style.set_property(CSS::PropertyID::Width, CSS::LengthStyleValue::create(CSS::Length(cols(), CSS::Length::Type::Ch)));
  37. if (style.property(CSS::PropertyID::Height)->has_auto())
  38. style.set_property(CSS::PropertyID::Height, CSS::LengthStyleValue::create(CSS::Length(rows(), CSS::Length::Type::Lh)));
  39. }
  40. void HTMLTextAreaElement::initialize(JS::Realm& realm)
  41. {
  42. Base::initialize(realm);
  43. set_prototype(&Bindings::ensure_web_prototype<Bindings::HTMLTextAreaElementPrototype>(realm, "HTMLTextAreaElement"_fly_string));
  44. }
  45. void HTMLTextAreaElement::visit_edges(Cell::Visitor& visitor)
  46. {
  47. Base::visit_edges(visitor);
  48. visitor.visit(m_placeholder_element);
  49. visitor.visit(m_placeholder_text_node);
  50. visitor.visit(m_inner_text_element);
  51. visitor.visit(m_text_node);
  52. }
  53. void HTMLTextAreaElement::did_receive_focus()
  54. {
  55. auto* browsing_context = document().browsing_context();
  56. if (!browsing_context)
  57. return;
  58. if (!m_text_node)
  59. return;
  60. browsing_context->set_cursor_position(DOM::Position::create(realm(), *m_text_node, 0));
  61. }
  62. void HTMLTextAreaElement::did_lose_focus()
  63. {
  64. // The change event fires when the value is committed, if that makes sense for the control,
  65. // or else when the control loses focus
  66. queue_an_element_task(HTML::Task::Source::UserInteraction, [this] {
  67. auto change_event = DOM::Event::create(realm(), HTML::EventNames::change);
  68. change_event->set_bubbles(true);
  69. dispatch_event(change_event);
  70. });
  71. }
  72. // https://html.spec.whatwg.org/multipage/interaction.html#dom-tabindex
  73. i32 HTMLTextAreaElement::default_tab_index_value() const
  74. {
  75. // See the base function for the spec comments.
  76. return 0;
  77. }
  78. // https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element:concept-form-reset-control
  79. void HTMLTextAreaElement::reset_algorithm()
  80. {
  81. // The reset algorithm for textarea elements is to set the dirty value flag back to false,
  82. m_dirty_value = false;
  83. // and set the raw value of element to its child text content.
  84. set_raw_value(child_text_content());
  85. update_placeholder_visibility();
  86. }
  87. void HTMLTextAreaElement::form_associated_element_was_inserted()
  88. {
  89. create_shadow_tree_if_needed();
  90. }
  91. void HTMLTextAreaElement::form_associated_element_was_removed(DOM::Node*)
  92. {
  93. set_shadow_root(nullptr);
  94. }
  95. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-defaultvalue
  96. String HTMLTextAreaElement::default_value() const
  97. {
  98. // The defaultValue attribute's getter must return the element's child text content.
  99. return child_text_content();
  100. }
  101. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-defaultvalue
  102. void HTMLTextAreaElement::set_default_value(String const& default_value)
  103. {
  104. // The defaultValue attribute's setter must string replace all with the given value within this element.
  105. string_replace_all(default_value);
  106. }
  107. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-value
  108. String HTMLTextAreaElement::value() const
  109. {
  110. // The value IDL attribute must, on getting, return the element's API value.
  111. return api_value();
  112. }
  113. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-value
  114. void HTMLTextAreaElement::set_value(String const& value)
  115. {
  116. // FIXME: 1. Let oldAPIValue be this element's API value.
  117. // 2. Set this element's raw value to the new value.
  118. set_raw_value(value);
  119. // 3. Set this element's dirty value flag to true.
  120. m_dirty_value = true;
  121. // FIXME: 4. If the new API value is different from oldAPIValue, then move the text entry cursor position to the end of the text control, unselecting any selected text and resetting the selection direction to "none".
  122. update_placeholder_visibility();
  123. }
  124. void HTMLTextAreaElement::set_raw_value(String value)
  125. {
  126. m_raw_value = move(value);
  127. m_api_value.clear();
  128. }
  129. // https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element:concept-fe-api-value-3
  130. String HTMLTextAreaElement::api_value() const
  131. {
  132. // The algorithm for obtaining the element's API value is to return the element's raw value, with newlines normalized.
  133. if (!m_api_value.has_value())
  134. m_api_value = Infra::normalize_newlines(m_raw_value);
  135. return *m_api_value;
  136. }
  137. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-textlength
  138. u32 HTMLTextAreaElement::text_length() const
  139. {
  140. // The textLength IDL attribute must return the length of the element's API value.
  141. // FIXME: This is inefficient!
  142. auto utf16_data = MUST(AK::utf8_to_utf16(api_value()));
  143. return Utf16View { utf16_data }.length_in_code_units();
  144. }
  145. // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#dom-cva-checkvalidity
  146. bool HTMLTextAreaElement::check_validity()
  147. {
  148. dbgln("(STUBBED) HTMLTextAreaElement::check_validity(). Called on: {}", debug_description());
  149. return true;
  150. }
  151. // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#dom-cva-reportvalidity
  152. bool HTMLTextAreaElement::report_validity()
  153. {
  154. dbgln("(STUBBED) HTMLTextAreaElement::report_validity(). Called on: {}", debug_description());
  155. return true;
  156. }
  157. // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#dom-cva-setcustomvalidity
  158. void HTMLTextAreaElement::set_custom_validity(String const& error)
  159. {
  160. dbgln("(STUBBED) HTMLTextAreaElement::set_custom_validity(\"{}\"). Called on: {}", error, debug_description());
  161. }
  162. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-maxlength
  163. WebIDL::Long HTMLTextAreaElement::max_length() const
  164. {
  165. // The maxLength IDL attribute must reflect the maxlength content attribute, limited to only non-negative numbers.
  166. if (auto maxlength_string = get_attribute(HTML::AttributeNames::maxlength); maxlength_string.has_value()) {
  167. if (auto maxlength = parse_non_negative_integer(*maxlength_string); maxlength.has_value())
  168. return *maxlength;
  169. }
  170. return -1;
  171. }
  172. WebIDL::ExceptionOr<void> HTMLTextAreaElement::set_max_length(WebIDL::Long value)
  173. {
  174. // The maxLength IDL attribute must reflect the maxlength content attribute, limited to only non-negative numbers.
  175. return set_attribute(HTML::AttributeNames::maxlength, TRY(convert_non_negative_integer_to_string(realm(), value)));
  176. }
  177. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-minlength
  178. WebIDL::Long HTMLTextAreaElement::min_length() const
  179. {
  180. // The minLength IDL attribute must reflect the minlength content attribute, limited to only non-negative numbers.
  181. if (auto minlength_string = get_attribute(HTML::AttributeNames::minlength); minlength_string.has_value()) {
  182. if (auto minlength = parse_non_negative_integer(*minlength_string); minlength.has_value())
  183. return *minlength;
  184. }
  185. return -1;
  186. }
  187. WebIDL::ExceptionOr<void> HTMLTextAreaElement::set_min_length(WebIDL::Long value)
  188. {
  189. // The minLength IDL attribute must reflect the minlength content attribute, limited to only non-negative numbers.
  190. return set_attribute(HTML::AttributeNames::minlength, TRY(convert_non_negative_integer_to_string(realm(), value)));
  191. }
  192. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-cols
  193. unsigned HTMLTextAreaElement::cols() const
  194. {
  195. // The cols and rows attributes are limited to only positive numbers with fallback. The cols IDL attribute's default value is 20.
  196. if (auto cols_string = get_attribute(HTML::AttributeNames::cols); cols_string.has_value()) {
  197. if (auto cols = parse_non_negative_integer(*cols_string); cols.has_value())
  198. return *cols;
  199. }
  200. return 20;
  201. }
  202. WebIDL::ExceptionOr<void> HTMLTextAreaElement::set_cols(unsigned cols)
  203. {
  204. return set_attribute(HTML::AttributeNames::cols, MUST(String::number(cols)));
  205. }
  206. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-rows
  207. unsigned HTMLTextAreaElement::rows() const
  208. {
  209. // The cols and rows attributes are limited to only positive numbers with fallback. The rows IDL attribute's default value is 2.
  210. if (auto rows_string = get_attribute(HTML::AttributeNames::rows); rows_string.has_value()) {
  211. if (auto rows = parse_non_negative_integer(*rows_string); rows.has_value())
  212. return *rows;
  213. }
  214. return 2;
  215. }
  216. WebIDL::ExceptionOr<void> HTMLTextAreaElement::set_rows(unsigned rows)
  217. {
  218. return set_attribute(HTML::AttributeNames::rows, MUST(String::number(rows)));
  219. }
  220. void HTMLTextAreaElement::create_shadow_tree_if_needed()
  221. {
  222. if (shadow_root_internal())
  223. return;
  224. auto shadow_root = heap().allocate<DOM::ShadowRoot>(realm(), document(), *this, Bindings::ShadowRootMode::Closed);
  225. set_shadow_root(shadow_root);
  226. auto element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
  227. MUST(shadow_root->append_child(element));
  228. m_placeholder_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
  229. m_placeholder_element->set_use_pseudo_element(CSS::Selector::PseudoElement::Type::Placeholder);
  230. MUST(element->append_child(*m_placeholder_element));
  231. m_placeholder_text_node = heap().allocate<DOM::Text>(realm(), document(), String {});
  232. m_placeholder_text_node->set_data(get_attribute_value(HTML::AttributeNames::placeholder));
  233. m_placeholder_text_node->set_editable_text_node_owner(Badge<HTMLTextAreaElement> {}, *this);
  234. MUST(m_placeholder_element->append_child(*m_placeholder_text_node));
  235. m_inner_text_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
  236. MUST(element->append_child(*m_inner_text_element));
  237. m_text_node = heap().allocate<DOM::Text>(realm(), document(), String {});
  238. handle_readonly_attribute(attribute(HTML::AttributeNames::readonly));
  239. m_text_node->set_editable_text_node_owner(Badge<HTMLTextAreaElement> {}, *this);
  240. // NOTE: If `children_changed()` was called before now, `m_raw_value` will hold the text content.
  241. // Otherwise, it will get filled in whenever that does get called.
  242. m_text_node->set_text_content(m_raw_value);
  243. handle_maxlength_attribute();
  244. MUST(m_inner_text_element->append_child(*m_text_node));
  245. update_placeholder_visibility();
  246. }
  247. // https://html.spec.whatwg.org/multipage/input.html#attr-input-readonly
  248. void HTMLTextAreaElement::handle_readonly_attribute(Optional<String> const& maybe_value)
  249. {
  250. // The readonly attribute is a boolean attribute that controls whether or not the user can edit the form control. When specified, the element is not mutable.
  251. m_is_mutable = !maybe_value.has_value();
  252. if (m_text_node)
  253. m_text_node->set_always_editable(m_is_mutable);
  254. }
  255. // https://html.spec.whatwg.org/multipage/form-elements.html#dom-textarea-maxlength
  256. void HTMLTextAreaElement::handle_maxlength_attribute()
  257. {
  258. if (m_text_node) {
  259. auto max_length = this->max_length();
  260. if (max_length >= 0) {
  261. m_text_node->set_max_length(max_length);
  262. } else {
  263. m_text_node->set_max_length({});
  264. }
  265. }
  266. }
  267. void HTMLTextAreaElement::update_placeholder_visibility()
  268. {
  269. if (!m_placeholder_element)
  270. return;
  271. if (!m_text_node)
  272. return;
  273. auto placeholder_text = get_attribute(AttributeNames::placeholder);
  274. if (placeholder_text.has_value() && m_text_node->data().is_empty()) {
  275. MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "block"sv));
  276. } else {
  277. MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "none"sv));
  278. }
  279. }
  280. // https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element:children-changed-steps
  281. void HTMLTextAreaElement::children_changed()
  282. {
  283. // The children changed steps for textarea elements must, if the element's dirty value flag is false,
  284. // set the element's raw value to its child text content.
  285. if (!m_dirty_value) {
  286. set_raw_value(child_text_content());
  287. if (m_text_node)
  288. m_text_node->set_text_content(m_raw_value);
  289. update_placeholder_visibility();
  290. }
  291. }
  292. void HTMLTextAreaElement::form_associated_element_attribute_changed(FlyString const& name, Optional<String> const& value)
  293. {
  294. if (name == HTML::AttributeNames::placeholder) {
  295. if (m_placeholder_text_node)
  296. m_placeholder_text_node->set_data(value.value_or(String {}));
  297. } else if (name == HTML::AttributeNames::readonly) {
  298. handle_readonly_attribute(value);
  299. } else if (name == HTML::AttributeNames::maxlength) {
  300. handle_maxlength_attribute();
  301. }
  302. }
  303. void HTMLTextAreaElement::did_edit_text_node(Badge<Web::HTML::BrowsingContext>)
  304. {
  305. VERIFY(m_text_node);
  306. set_raw_value(m_text_node->data());
  307. // Any time the user causes the element's raw value to change, the user agent must queue an element task on the user
  308. // interaction task source given the textarea element to fire an event named input at the textarea element, with the
  309. // bubbles and composed attributes initialized to true. User agents may wait for a suitable break in the user's
  310. // interaction before queuing the task; for example, a user agent could wait for the user to have not hit a key for
  311. // 100ms, so as to only fire the event when the user pauses, instead of continuously for each keystroke.
  312. m_input_event_timer->restart(100);
  313. // A textarea element's dirty value flag must be set to true whenever the user interacts with the control in a way that changes the raw value.
  314. m_dirty_value = true;
  315. update_placeholder_visibility();
  316. }
  317. void HTMLTextAreaElement::queue_firing_input_event()
  318. {
  319. queue_an_element_task(HTML::Task::Source::UserInteraction, [this]() {
  320. auto change_event = DOM::Event::create(realm(), HTML::EventNames::input, { .bubbles = true, .composed = true });
  321. dispatch_event(change_event);
  322. });
  323. }
  324. }