diff --git a/Tests/LibWeb/Layout/expected/input-image-to-text.txt b/Tests/LibWeb/Layout/expected/input-image-to-text.txt new file mode 100644 index 00000000000..e458d9e516d --- /dev/null +++ b/Tests/LibWeb/Layout/expected/input-image-to-text.txt @@ -0,0 +1,20 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x21 children: inline + frag 0 from BlockContainer start: 0, length: 0, rect: [9,9 189.875x19] baseline: 13.296875 + BlockContainer at (9,9) content-size 189.875x19 inline-block [BFC] children: not-inline + Box
at (11,10) content-size 185.875x17 flex-container(row) [FFC] children: not-inline + BlockContainer
at (11,10) content-size 185.875x17 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 7, rect: [11,10 55.6875x17] baseline: 13.296875 + "120.png" + TextNode <#text> + TextNode <#text> + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x21] + PaintableWithLines (BlockContainer) [8,8 191.875x21] + PaintableBox (Box
) [9,9 189.875x19] + PaintableWithLines (BlockContainer
) [11,10 185.875x17] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/input-text-to-image.txt b/Tests/LibWeb/Layout/expected/input-text-to-image.txt new file mode 100644 index 00000000000..32a843a5efb --- /dev/null +++ b/Tests/LibWeb/Layout/expected/input-text-to-image.txt @@ -0,0 +1,12 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x120 children: inline + frag 0 from ImageBox start: 0, length: 0, rect: [8,8 120x120] baseline: 120 + ImageBox at (8,8) content-size 120x120 inline-block children: not-inline + TextNode <#text> + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x120] + ImagePaintable (ImageBox) [8,8 120x120] diff --git a/Tests/LibWeb/Layout/input/input-image-to-text.html b/Tests/LibWeb/Layout/input/input-image-to-text.html new file mode 100644 index 00000000000..18543e0090d --- /dev/null +++ b/Tests/LibWeb/Layout/input/input-image-to-text.html @@ -0,0 +1,7 @@ + + diff --git a/Tests/LibWeb/Layout/input/input-text-to-image.html b/Tests/LibWeb/Layout/input/input-text-to-image.html new file mode 100644 index 00000000000..5e7e0340a36 --- /dev/null +++ b/Tests/LibWeb/Layout/input/input-text-to-image.html @@ -0,0 +1,7 @@ + + diff --git a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp index 36ff501e04e..8a6efeb7270 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp +++ b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp @@ -1085,6 +1085,15 @@ void HTMLInputElement::form_associated_element_attribute_changed(FlyString const set_shadow_root(nullptr); create_shadow_tree_if_needed(); + + // https://html.spec.whatwg.org/multipage/input.html#image-button-state-(type=image):the-input-element-4 + // the input element's type attribute is changed back to the Image Button state, and the src attribute is present, + // and its value has changed since the last time the type attribute was in the Image Button state + if (type_state() == TypeAttributeState::ImageButton) { + if (auto src = attribute(AttributeNames::src); src.has_value() && src != m_last_src_value) + handle_src_attribute(*src).release_value_but_fixme_should_propagate_errors(); + } + } else if (name == HTML::AttributeNames::value) { if (!m_dirty_value) { if (!value.has_value()) { @@ -1115,7 +1124,7 @@ void HTMLInputElement::form_associated_element_attribute_changed(FlyString const } // https://html.spec.whatwg.org/multipage/input.html#attr-input-src -WebIDL::ExceptionOr HTMLInputElement::handle_src_attribute(StringView value) +WebIDL::ExceptionOr HTMLInputElement::handle_src_attribute(String const& value) { auto& realm = this->realm(); auto& vm = realm.vm(); @@ -1123,6 +1132,8 @@ WebIDL::ExceptionOr HTMLInputElement::handle_src_attribute(StringView valu if (type_state() != TypeAttributeState::ImageButton) return {}; + m_last_src_value = value; + // 1. Let url be the result of encoding-parsing a URL given the src attribute's value, relative to the element's // node document. auto url = document().parse_url(value); diff --git a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h index e530b18a3fc..eb9e5c13a7f 100644 --- a/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h +++ b/Userland/Libraries/LibWeb/HTML/HTMLInputElement.h @@ -248,7 +248,7 @@ private: void handle_maxlength_attribute(); void handle_readonly_attribute(Optional const& value); - WebIDL::ExceptionOr handle_src_attribute(StringView value); + WebIDL::ExceptionOr handle_src_attribute(String const& value); // https://html.spec.whatwg.org/multipage/input.html#value-sanitization-algorithm String value_sanitization_algorithm(String const&) const; @@ -309,6 +309,8 @@ private: TypeAttributeState m_type { TypeAttributeState::Text }; String m_value; + String m_last_src_value; + bool m_has_uncommitted_changes { false }; };