mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-21 09:49:21 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Handle <input> element type changing to the image button state

Browse source 
The spec has special steps specific to the image button state to load
the element's image URL.
This commit is contained in:
Timothy Flynn 2024-04-04 12:56:37 -04:00 • committed by Andreas Kling
commit 5d5b69578f
Notes: sideshowbarker 2024-07-16 19:42:24 +09:00
6 changed files with 61 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

20
Tests/LibWeb/Layout/expected/input-image-to-text.txt Normal file
View file

@ -0,0 +1,20 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> 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 <input> at (9,9) content-size 189.875x19 inline-block [BFC] children: not-inline
Box <div> at (11,10) content-size 185.875x17 flex-container(row) [FFC] children: not-inline
BlockContainer <div> 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<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x21]
PaintableWithLines (BlockContainer<INPUT>) [8,8 191.875x21]
PaintableBox (Box<DIV>) [9,9 189.875x19]
PaintableWithLines (BlockContainer<DIV>) [11,10 185.875x17]
TextPaintable (TextNode<#text>)

12
Tests/LibWeb/Layout/expected/input-text-to-image.txt Normal file
View file

@ -0,0 +1,12 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x120 children: inline
frag 0 from ImageBox start: 0, length: 0, rect: [8,8 120x120] baseline: 120
ImageBox <input> at (8,8) content-size 120x120 inline-block children: not-inline
TextNode <#text>
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x120]
ImagePaintable (ImageBox<INPUT>) [8,8 120x120]

7
Tests/LibWeb/Layout/input/input-image-to-text.html Normal file
View file

@ -0,0 +1,7 @@
<input type="image" src="120.png" value="120.png" width="120" height="120" />
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", () => {
let input = document.querySelector("input");
input.type = "text";
});
</script>

7
Tests/LibWeb/Layout/input/input-text-to-image.html Normal file
View file

@ -0,0 +1,7 @@
<input type="text" src="120.png" width="120" height="120" />
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", () => {
let input = document.querySelector("input");
input.type = "image";
});
</script>

13
Userland/Libraries/LibWeb/HTML/HTMLInputElement.cpp
View file

@ -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<void> HTMLInputElement::handle_src_attribute(StringView value)
WebIDL::ExceptionOr<void> HTMLInputElement::handle_src_attribute(String const& value)
{
auto& realm = this->realm();
auto& vm = realm.vm();
@ -1123,6 +1132,8 @@ WebIDL::ExceptionOr<void> 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);

4
Userland/Libraries/LibWeb/HTML/HTMLInputElement.h
View file

@ -248,7 +248,7 @@ private:
void handle_maxlength_attribute();
void handle_readonly_attribute(Optional<String> const& value);
WebIDL::ExceptionOr<void> handle_src_attribute(StringView value);
WebIDL::ExceptionOr<void> 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 };
};