diff --git a/Tests/LibWeb/Layout/expected/input-element-with-display-inline.txt b/Tests/LibWeb/Layout/expected/input-element-with-display-inline.txt index 20f97d91c0..fd8360912f 100644 --- a/Tests/LibWeb/Layout/expected/input-element-with-display-inline.txt +++ b/Tests/LibWeb/Layout/expected/input-element-with-display-inline.txt @@ -5,9 +5,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline frag 0 from BlockContainer start: 0, length: 0, rect: [11,11 200x25.84375] BlockContainer at (11,11) content-size 200x25.84375 inline-block [BFC] children: not-inline Box
at (13,12) content-size 196x23.84375 flex-container(row) [FFC] children: not-inline - BlockContainer <(anonymous)> at (13,23.921875) content-size 0x0 flex-item [BFC] children: inline - InlineNode
- TextNode <#text> BlockContainer
at (14,13) content-size 194x21.84375 flex-item [BFC] children: inline TextNode <#text> @@ -16,6 +13,4 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [9,9 782x29.84375] PaintableWithLines (BlockContainer) [10,10 202x27.84375] PaintableBox (Box
) [11,11 200x25.84375] - PaintableWithLines (BlockContainer(anonymous)) [13,23.921875 0x0] - InlinePaintable (InlineNode
) PaintableWithLines (BlockContainer
) [13,12 196x23.84375] diff --git a/Tests/LibWeb/Ref/input-placeholder.html b/Tests/LibWeb/Ref/input-placeholder.html new file mode 100644 index 0000000000..231fcc4895 --- /dev/null +++ b/Tests/LibWeb/Ref/input-placeholder.html @@ -0,0 +1,11 @@ + + + diff --git a/Tests/LibWeb/Ref/reference/images/input-placeholder-ref.png b/Tests/LibWeb/Ref/reference/images/input-placeholder-ref.png new file mode 100644 index 0000000000..76e554854e Binary files /dev/null and b/Tests/LibWeb/Ref/reference/images/input-placeholder-ref.png differ diff --git a/Tests/LibWeb/Ref/reference/input-placeholder-ref.html b/Tests/LibWeb/Ref/reference/input-placeholder-ref.html new file mode 100644 index 0000000000..fad703c634 --- /dev/null +++ b/Tests/LibWeb/Ref/reference/input-placeholder-ref.html @@ -0,0 +1,15 @@ + + + diff --git a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp index 5d648ec339..e7eaa5be22 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp +++ b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp @@ -500,6 +500,23 @@ static bool is_allowed_to_have_placeholder(HTML::HTMLInputElement::TypeAttribute } } +// https://html.spec.whatwg.org/multipage/input.html#attr-input-placeholder +String HTMLInputElement::placeholder() const +{ + auto maybe_placeholder = get_attribute(HTML::AttributeNames::placeholder); + if (!maybe_placeholder.has_value()) + return String {}; + auto placeholder = *maybe_placeholder; + + // The attribute, if specified, must have a value that contains no U+000A LINE FEED (LF) or U+000D CARRIAGE RETURN (CR) characters. + StringBuilder builder; + for (auto c : placeholder.bytes_as_string_view()) { + if (c != '\r' && c != '\n') + builder.append(c); + } + return MUST(builder.to_string()); +} + // https://html.spec.whatwg.org/multipage/input.html#attr-input-placeholder Optional HTMLInputElement::placeholder_value() const { @@ -509,19 +526,7 @@ Optional HTMLInputElement::placeholder_value() const return {}; if (!has_attribute(HTML::AttributeNames::placeholder)) return {}; - - auto placeholder = deprecated_attribute(HTML::AttributeNames::placeholder); - - if (placeholder.contains('\r') || placeholder.contains('\n')) { - StringBuilder builder; - for (auto ch : placeholder) { - if (ch != '\r' && ch != '\n') - builder.append(ch); - } - placeholder = builder.to_deprecated_string(); - } - - return placeholder; + return placeholder().to_deprecated_string(); } void HTMLInputElement::create_shadow_tree_if_needed() @@ -573,8 +578,8 @@ void HTMLInputElement::create_text_input_shadow_tree() )~~~"_string)); MUST(element->append_child(*m_placeholder_element)); - m_placeholder_text_node = heap().allocate(realm(), document(), initial_value); - m_placeholder_text_node->set_data(attribute(HTML::AttributeNames::placeholder).value_or(String {})); + m_placeholder_text_node = heap().allocate(realm(), document(), String {}); + m_placeholder_text_node->set_data(placeholder()); m_placeholder_text_node->set_editable_text_node_owner(Badge {}, *this); MUST(m_placeholder_element->append_child(*m_placeholder_text_node)); @@ -597,6 +602,8 @@ void HTMLInputElement::create_text_input_shadow_tree() m_text_node->set_is_password_input({}, true); MUST(m_inner_text_element->append_child(*m_text_node)); + update_placeholder_visibility(); + if (type_state() == TypeAttributeState::Number) { // Up button auto up_button = MUST(DOM::create_element(document(), HTML::TagNames::button, Namespace::HTML)); @@ -718,7 +725,7 @@ void HTMLInputElement::attribute_changed(FlyString const& name, Optional } } else if (name == HTML::AttributeNames::placeholder) { if (m_placeholder_text_node) - m_placeholder_text_node->set_data(value.value_or(String {})); + m_placeholder_text_node->set_data(placeholder()); } else if (name == HTML::AttributeNames::readonly) { handle_readonly_attribute(value); } diff --git a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h index 22ce87181f..df1754f9dc 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h +++ b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h @@ -71,6 +71,7 @@ public: void commit_pending_changes(); + String placeholder() const; Optional placeholder_value() const; bool checked() const { return m_checked; }