Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-10-19 07:33:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb/Tests: Add empty text chunk in empty editables

Browse source 
Otherwise the cursor won't get rendered in empty input fields.
This commit is contained in:
zac 2025-08-08 21:17:33 +10:00 • committed by Sam Atkins
parent 152711958e
commit 8c29b0a848
Notes: github-actions[bot] 2025-09-24 11:34:26 +00:00
16 changed files with 248 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

59
Libraries/LibWeb/HTML/HTMLInputElement.cpp
View file

@ -762,6 +762,36 @@ void HTMLInputElement::commit_pending_changes()
dispatch_event(change_event);
}
// https://www.w3.org/TR/css-ui-4/#input-rules
static GC::Ref<CSS::CSSStyleProperties> inner_text_style_when_visible()
{
static GC::Root<CSS::CSSStyleProperties> style;
if (!style) {
style = CSS::CSSStyleProperties::create(internal_css_realm(), {}, {});
style->set_declarations_from_text(R"~~~(
width: 100%;
height: 1lh;
align-items: center;
text-overflow: clip;
white-space: nowrap;
)~~~"sv);
}
return *style;
}
static GC::Ref<CSS::CSSStyleProperties> inner_text_style_when_hidden()
{
static GC::Root<CSS::CSSStyleProperties> style;
if (!style) {
style = CSS::CSSStyleProperties::create(internal_css_realm(), {}, {});
style->set_declarations_from_text(R"~~~(
width: 0;
display: inline;
)~~~"sv);
}
return *style;
}
static GC::Ref<CSS::CSSStyleProperties> placeholder_style_when_visible()
{
static GC::Root<CSS::CSSStyleProperties> style;
@ -772,7 +802,7 @@ static GC::Ref<CSS::CSSStyleProperties> placeholder_style_when_visible()
align-items: center;
text-overflow: clip;
white-space: nowrap;
display: block;
display: inline;
)~~~"sv);
}
return *style;
@ -792,10 +822,13 @@ void HTMLInputElement::update_placeholder_visibility()
{
if (!m_placeholder_element)
return;
if (this->placeholder_value().has_value())
if (this->placeholder_value().has_value()) {
m_inner_text_element->set_inline_style(inner_text_style_when_hidden());
m_placeholder_element->set_inline_style(placeholder_style_when_visible());
else
} else {
m_inner_text_element->set_inline_style(inner_text_style_when_visible());
m_placeholder_element->set_inline_style(placeholder_style_when_hidden());
}
}
Utf16String HTMLInputElement::button_label() const
@ -1011,7 +1044,6 @@ void HTMLInputElement::create_text_input_shadow_tree()
auto shadow_root = realm().create<DOM::ShadowRoot>(document(), *this, Bindings::ShadowRootMode::Closed);
set_shadow_root(shadow_root);
auto initial_value = m_value;
auto element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
{
static GC::Root<CSS::CSSStyleProperties> style;
@ -1030,15 +1062,6 @@ void HTMLInputElement::create_text_input_shadow_tree()
}
MUST(shadow_root->append_child(element));
m_placeholder_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
m_placeholder_element->set_use_pseudo_element(CSS::PseudoElement::Placeholder);
update_placeholder_visibility();
MUST(element->append_child(*m_placeholder_element));
m_placeholder_text_node = realm().create<DOM::Text>(document(), Utf16String::from_utf8(placeholder()));
MUST(m_placeholder_element->append_child(*m_placeholder_text_node));
// https://www.w3.org/TR/css-ui-4/#input-rules
m_inner_text_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
{
@ -1057,12 +1080,20 @@ void HTMLInputElement::create_text_input_shadow_tree()
}
MUST(element->append_child(*m_inner_text_element));
m_text_node = realm().create<DOM::Text>(document(), move(initial_value));
m_text_node = realm().create<DOM::Text>(document(), Utf16String {});
if (type_state() == TypeAttributeState::Password)
m_text_node->set_is_password_input({}, true);
m_text_node->set_text_content(m_value);
handle_maxlength_attribute();
MUST(m_inner_text_element->append_child(*m_text_node));
m_placeholder_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
m_placeholder_element->set_use_pseudo_element(CSS::PseudoElement::Placeholder);
MUST(element->append_child(*m_placeholder_element));
m_placeholder_text_node = realm().create<DOM::Text>(document(), Utf16String::from_utf8(placeholder()));
MUST(m_placeholder_element->append_child(*m_placeholder_text_node));
update_placeholder_visibility();
if (type_state() == TypeAttributeState::Number) {

20
Libraries/LibWeb/HTML/HTMLTextAreaElement.cpp
View file

@ -344,13 +344,6 @@ void HTMLTextAreaElement::create_shadow_tree_if_needed()
auto element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
MUST(shadow_root->append_child(element));
m_placeholder_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
m_placeholder_element->set_use_pseudo_element(CSS::PseudoElement::Placeholder);
MUST(element->append_child(*m_placeholder_element));
m_placeholder_text_node = realm().create<DOM::Text>(document(), Utf16String::from_utf8(get_attribute_value(HTML::AttributeNames::placeholder)));
MUST(m_placeholder_element->append_child(*m_placeholder_text_node));
m_inner_text_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
MUST(element->append_child(*m_inner_text_element));
@ -361,6 +354,13 @@ void HTMLTextAreaElement::create_shadow_tree_if_needed()
handle_maxlength_attribute();
MUST(m_inner_text_element->append_child(*m_text_node));
m_placeholder_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
m_placeholder_element->set_use_pseudo_element(CSS::PseudoElement::Placeholder);
MUST(element->append_child(*m_placeholder_element));
m_placeholder_text_node = realm().create<DOM::Text>(document(), Utf16String::from_utf8(get_attribute_value(HTML::AttributeNames::placeholder)));
MUST(m_placeholder_element->append_child(*m_placeholder_text_node));
update_placeholder_visibility();
}
@ -385,11 +385,11 @@ void HTMLTextAreaElement::update_placeholder_visibility()
return;
auto placeholder_text = get_attribute(AttributeNames::placeholder);
if (placeholder_text.has_value() && m_text_node->data().is_empty()) {
MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "block"sv));
MUST(m_inner_text_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "none"sv));
MUST(m_inner_text_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "inline"sv));
MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "inline"sv));
} else {
MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "none"sv));
MUST(m_inner_text_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "block"sv));
MUST(m_placeholder_element->style_for_bindings()->set_property(CSS::PropertyID::Display, "none"sv));
}
}

30
Libraries/LibWeb/Layout/InlineLevelIterator.cpp
View file

@ -5,6 +5,7 @@
*/
#include <LibGfx/Font/FontVariant.h>
#include <LibWeb/HTML/FormAssociatedElement.h>
#include <LibWeb/Layout/BreakNode.h>
#include <LibWeb/Layout/InlineFormattingContext.h>
#include <LibWeb/Layout/InlineLevelIterator.h>
@ -496,16 +497,29 @@ Optional<InlineLevelIterator::Item> InlineLevelIterator::next_without_lookahead(
else
m_text_node_context->is_first_chunk = false;
auto chunk_opt = m_text_node_context->chunk_iterator.next();
if (!chunk_opt.has_value()) {
m_text_node_context = {};
skip_to_next();
return next_without_lookahead();
}
if (!m_text_node_context->chunk_iterator.peek(0).has_value())
m_text_node_context->is_last_chunk = true;
auto chunk_opt = m_text_node_context->chunk_iterator.next();
auto is_empty_editable = false;
if (!chunk_opt.has_value()) {
auto const is_only_chunk = m_text_node_context->is_first_chunk && m_text_node_context->is_last_chunk;
if (is_only_chunk && text_node->text_for_rendering().is_empty()) {
if (auto const* shadow_root = as_if<DOM::ShadowRoot>(text_node->dom_node().root()))
if (auto const* form_associated_element = as_if<HTML::FormAssociatedTextControlElement>(shadow_root->host()))
is_empty_editable = form_associated_element->is_mutable();
is_empty_editable |= text_node->dom_node().parent() && text_node->dom_node().parent()->is_editing_host();
}
if (is_empty_editable) {
chunk_opt = m_text_node_context->chunk_iterator.create_empty_chunk();
} else {
m_text_node_context = {};
skip_to_next();
return next_without_lookahead();
}
}
auto& chunk = chunk_opt.value();
auto text_type = chunk.text_type;
if (text_type == Gfx::GlyphRun::TextType::Ltr || text_type == Gfx::GlyphRun::TextType::Rtl)
@ -583,7 +597,7 @@ Optional<InlineLevelIterator::Item> InlineLevelIterator::next_without_lookahead(
CSSPixels chunk_width = CSSPixels::nearest_value_for(glyph_run->width() + x);
// NOTE: We never consider `content: ""` to be collapsible whitespace.
bool is_generated_empty_string = text_node->is_generated_for_pseudo_element() && chunk.length == 0;
bool is_generated_empty_string = is_empty_editable || (text_node->is_generated_for_pseudo_element() && chunk.length == 0);
auto collapse_whitespace = m_text_node_context->chunk_iterator.should_collapse_whitespace();
Item item {

10
Libraries/LibWeb/Layout/TextNode.cpp
View file

@ -479,6 +479,16 @@ Optional<TextNode::Chunk> TextNode::ChunkIterator::peek(size_t count)
return m_peek_queue[count];
}
TextNode::Chunk TextNode::ChunkIterator::create_empty_chunk()
{
return TextNode::Chunk {
.view = {},
.font = m_font_cascade_list.first(),
.is_all_whitespace = true,
.text_type = Gfx::GlyphRun::TextType::Common,
};
}
Optional<TextNode::Chunk> TextNode::ChunkIterator::next_without_peek()
{
if (m_current_index >= m_view.length_in_code_units())

2
Libraries/LibWeb/Layout/TextNode.h
View file

@ -52,6 +52,8 @@ public:
Optional<Chunk> next();
Optional<Chunk> peek(size_t);
Chunk create_empty_chunk();
private:
Optional<Chunk> next_without_peek();
Optional<Chunk> try_commit_chunk(size_t start, size_t end, bool has_breaking_newline, bool has_breaking_tab, Gfx::Font const&, Gfx::GlyphRun::TextType) const;

16
Tests/LibWeb/Layout/expected/block-and-inline/inline-block-leading-and-trailing-metrics.txt
View file

@ -18,13 +18,13 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
BlockContainer <(anonymous)> at [8,28] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
BlockContainer <div#b> at [9,29] [0+1+0 782 0+1+0] [0+1+0 18 0+1+0] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [70.296875,29 88.453125x18] baseline: 13.796875
frag 0 from BlockContainer start: 0, length: 0, rect: [50.296875,29 88.453125x18] baseline: 13.796875
InlineNode <i> at [9,29] [0+0+0 41.296875 20+0+0] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 0, length: 6, rect: [9,29 41.296875x18] baseline: 13.796875
"inline"
TextNode <#text> (not painted)
BlockContainer <b> at [70.296875,29] inline-block [0+0+0 88.453125 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 12, rect: [70.296875,29 88.453125x18] baseline: 13.796875
BlockContainer <b> at [50.296875,29] inline-block [0+0+0 88.453125 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 12, rect: [50.296875,29 88.453125x18] baseline: 13.796875
"inline-block"
TextNode <#text> (not painted)
InlineNode <u> at [158.75,29] [0+0+0 41.296875 0+0+0] [0+0+0 18 0+0+0]
@ -34,7 +34,7 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
BlockContainer <(anonymous)> at [8,48] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
BlockContainer <div#c> at [9,49] [0+1+0 782 0+1+0] [0+1+0 18 0+1+0] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [131.59375,49 88.453125x18] baseline: 13.796875
frag 0 from BlockContainer start: 0, length: 0, rect: [111.59375,49 88.453125x18] baseline: 13.796875
InlineNode <i> at [9,49] [0+0+0 41.296875 0+0+0] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 0, length: 6, rect: [9,49 41.296875x18] baseline: 13.796875
"inline"
@ -43,8 +43,8 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
frag 0 from TextNode start: 0, length: 6, rect: [70.296875,49 41.296875x18] baseline: 13.796875
"inline"
TextNode <#text> (not painted)
BlockContainer <u> at [131.59375,49] inline-block [0+0+0 88.453125 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 12, rect: [131.59375,49 88.453125x18] baseline: 13.796875
BlockContainer <u> at [111.59375,49] inline-block [0+0+0 88.453125 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 12, rect: [111.59375,49 88.453125x18] baseline: 13.796875
"inline-block"
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [8,68] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
@ -64,7 +64,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<DIV>#b) [8,28 784x20]
PaintableWithLines (InlineNode<I>) [9,29 61.296875x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<B>) [70.296875,29 88.453125x18]
PaintableWithLines (BlockContainer<B>) [50.296875,29 88.453125x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (InlineNode<U>) [158.75,29 41.296875x18]
TextPaintable (TextNode<#text>)
@ -74,7 +74,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
TextPaintable (TextNode<#text>)
PaintableWithLines (InlineNode<B>) [50.296875,49 81.296875x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<U>) [131.59375,49 88.453125x18]
PaintableWithLines (BlockContainer<U>) [111.59375,49 88.453125x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,68 784x0]

6
Tests/LibWeb/Layout/expected/block-and-inline/leading-margin-on-inline-content-that-starts-with-collapsible-whitespace.txt
View file

@ -5,8 +5,8 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
frag 0 from TextNode start: 1, length: 9, rect: [28,8 82.125x18] baseline: 13.796875
"Download "
TextNode <#text> (not painted)
InlineNode <div> at [150.125,8] [20+0+0 39.5625 0+0+20] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 1, length: 4, rect: [150.125,8 39.5625x18] baseline: 13.796875
InlineNode <div> at [130.125,8] [20+0+0 39.5625 0+0+20] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 1, length: 4, rect: [130.125,8 39.5625x18] baseline: 13.796875
"News"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
@ -16,7 +16,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x18]
PaintableWithLines (InlineNode<DIV>) [28,8 82.125x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (InlineNode<DIV>) [150.125,8 39.5625x18]
PaintableWithLines (InlineNode<DIV>) [130.125,8 39.5625x18]
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)

16
Tests/LibWeb/Layout/expected/css-appearance-none.txt
View file

@ -22,8 +22,9 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
BlockContainer <input> at [13,10] inline-block [0+1+4 0 4+1+0] [0+1+1 18 1+1+0] [BFC] children: not-inline
BlockContainer <(anonymous)> at [13,10] flex-container(column) [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [FFC] children: not-inline
BlockContainer <(anonymous)> at [13,10] flex-item [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [13,23 0x0] baseline: 0
BlockContainer <span> at [13,23] inline-block [0+0+0 0 0+0+0] [0+0+0 0 0+0+0] [BFC] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [13,10 0x18] baseline: 13.796875
BlockContainer <span> at [13,10] inline-block [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [13,10 0x18] baseline: 13.796875
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BreakNode <br> (not painted)
@ -31,8 +32,9 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
BlockContainer <input> at [13,32] inline-block [0+1+4 0 4+1+0] [0+1+1 18 1+1+0] [BFC] children: not-inline
BlockContainer <(anonymous)> at [13,32] flex-container(column) [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [FFC] children: not-inline
BlockContainer <(anonymous)> at [13,32] flex-item [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [13,45 0x0] baseline: 0
BlockContainer <span> at [13,45] inline-block [0+0+0 0 0+0+0] [0+0+0 0 0+0+0] [BFC] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [13,32 0x18] baseline: 13.796875
BlockContainer <span> at [13,32] inline-block [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [13,32 0x18] baseline: 13.796875
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BreakNode <br> (not painted)
@ -60,12 +62,14 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<INPUT>) [8,8 10x22]
PaintableWithLines (BlockContainer(anonymous)) [13,10 0x18]
PaintableWithLines (BlockContainer(anonymous)) [13,10 0x18]
PaintableWithLines (BlockContainer<SPAN>) [13,23 0x0]
PaintableWithLines (BlockContainer<SPAN>) [13,10 0x18]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<INPUT>) [8,30 10x22]
PaintableWithLines (BlockContainer(anonymous)) [13,32 0x18]
PaintableWithLines (BlockContainer(anonymous)) [13,32 0x18]
PaintableWithLines (BlockContainer<SPAN>) [13,45 0x0]
PaintableWithLines (BlockContainer<SPAN>) [13,32 0x18]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
CheckBoxPaintable (CheckBox<INPUT>) [8,52 13x13]
TextPaintable (TextNode<#text>)

88
Tests/LibWeb/Layout/expected/empty-editable-shows-cursor.txt Normal file
View file

@ -0,0 +1,88 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 50 0+0+0] [BFC] children: not-inline
BlockContainer <(anonymous)> at [0,0] [0+0+0 800 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
BlockContainer <body> at [8,8] [8+0+0 784 0+0+8] [8+0+0 34 0+0+8] children: not-inline
BlockContainer <(anonymous)> at [8,8] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
BlockContainer <div> at [8,8] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: not-inline
BlockContainer <(anonymous)> at [8,8] [0+0+0 784 0+0+0] [0+0+0 34 0+0+0] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [9,9 200x20] baseline: 14.796875
frag 1 from TextNode start: 0, length: 1, rect: [210,9 8x18] baseline: 13.796875
" "
frag 2 from BlockContainer start: 0, length: 0, rect: [221,11 160x28] baseline: 14.390625
frag 3 from TextNode start: 0, length: 1, rect: [384,9 8x18] baseline: 13.796875
" "
frag 4 from BlockContainer start: 0, length: 0, rect: [393,9 200x20] baseline: 14.796875
frag 5 from TextNode start: 0, length: 1, rect: [594,9 8x18] baseline: 13.796875
" "
frag 6 from BlockContainer start: 0, length: 0, rect: [605,11 160x28] baseline: 14.390625
TextNode <#text> (not painted)
BlockContainer <input> at [9,9] inline-block [0+1+0 200 0+1+0] [0+1+0 20 0+1+0] [BFC] children: not-inline
Box <div> at [11,10] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 18 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [11,10] flex-item [0+0+0 0 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [11,10 0x18] baseline: 13.796875
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [11,10] flex-item [0+0+0 36.84375 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
InlineNode <div> at [11,10] [0+0+0 36.84375 0+0+0] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 0, length: 5, rect: [11,10 36.84375x18] baseline: 13.796875
"hello"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BlockContainer <textarea> at [221,11] inline-block [0+1+2 160 2+1+0] [0+1+2 28 2+1+0] [BFC] children: not-inline
BlockContainer <div> at [221,11] [0+0+0 160 0+0+0] [0+0+0 15 0+0+0] children: inline
InlineNode <div> at [221,11] [0+0+0 0 0+0+0] [0+0+0 15 0+0+0]
frag 0 from TextNode start: 0, length: 0, rect: [221,11 0x15] baseline: 11.390625
TextNode <#text> (not painted)
InlineNode <div> at [221,11] [0+0+0 29.921875 0+0+0] [0+0+0 15 0+0+0]
frag 0 from TextNode start: 0, length: 5, rect: [221,11 29.921875x15] baseline: 11.390625
"hello"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BlockContainer <input> at [393,9] inline-block [0+1+0 200 0+1+0] [0+1+0 20 0+1+0] [BFC] children: not-inline
Box <div> at [395,10] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 18 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [395,10] flex-item [0+0+0 196 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [395,10 0x18] baseline: 13.796875
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BlockContainer <textarea> at [605,11] inline-block [0+1+2 160 2+1+0] [0+1+2 28 2+1+0] [BFC] children: not-inline
BlockContainer <div> at [605,11] [0+0+0 160 0+0+0] [0+0+0 15 0+0+0] children: not-inline
BlockContainer <div> at [605,11] [0+0+0 160 0+0+0] [0+0+0 15 0+0+0] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [605,11 0x15] baseline: 11.390625
TextNode <#text> (not painted)
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x50]
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x34]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (BlockContainer<DIV>) [8,8 784x0]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x34]
PaintableWithLines (BlockContainer<INPUT>) [8,8 202x22]
PaintableBox (Box<DIV>) [9,9 200x20]
PaintableWithLines (BlockContainer<DIV>) [11,10 0x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [11,10 36.84375x18]
PaintableWithLines (InlineNode<DIV>) [11,10 36.84375x18]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<TEXTAREA>) [218,8 166x34]
PaintableWithLines (BlockContainer<DIV>) [221,11 160x15]
PaintableWithLines (InlineNode<DIV>) [221,11 0x15]
TextPaintable (TextNode<#text>)
PaintableWithLines (InlineNode<DIV>) [221,11 29.921875x15]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<INPUT>) [392,8 202x22]
PaintableBox (Box<DIV>) [393,9 200x20]
PaintableWithLines (BlockContainer<DIV>) [395,10 196x18]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<TEXTAREA>) [602,8 166x34]
PaintableWithLines (BlockContainer<DIV>) [605,11 160x15]
PaintableWithLines (BlockContainer<DIV>) [605,11 160x15]
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x50] [children: 0] (z-index: auto)

2
Tests/LibWeb/Layout/expected/inline-nested-with-padding.txt
View file

@ -15,7 +15,7 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
InlineNode <span.b> at [40,44] [0+0+30 130.109375 30+0+0] [0+0+0 18 0+0+0]
frag 0 from TextNode start: 0, length: 2, rect: [40,44 20.515625x18] baseline: 13.796875
"wh"
frag 1 from TextNode start: 0, length: 1, rect: [163.671875,44 6.4375x18] baseline: 13.796875
frag 1 from TextNode start: 0, length: 1, rect: [133.671875,44 6.4375x18] baseline: 13.796875
"f"
TextNode <#text> (not painted)
InlineNode <span.b> at [90.515625,44] [0+0+30 43.15625 30+0+0] [0+0+0 18 0+0+0]

4
Tests/LibWeb/Layout/expected/input-element-with-display-inline.txt
View file

@ -1,10 +1,11 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-inline
BlockContainer <html> at [1,1] [0+1+0 798 0+1+0] [0+1+0 45 0+1+0] [BFC] children: not-inline
BlockContainer <body> at [10,10] [8+1+0 780 0+1+8] [8+1+0 27 0+1+8] children: inline
frag 0 from BlockContainer start: 0, length: 0, rect: [11,11 200x25] baseline: 27
frag 0 from BlockContainer start: 0, length: 0, rect: [11,11 200x25] baseline: 18.5
BlockContainer <input> at [11,11] inline-block [0+1+0 200 0+1+0] [0+1+0 25 0+1+0] [BFC] children: not-inline
Box <div> at [13,12] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 23 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [13,12] flex-item [0+0+0 196 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [13,12 0x23] baseline: 17.5
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
@ -13,6 +14,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<INPUT>) [10,10 202x27]
PaintableBox (Box<DIV>) [11,11 200x25]
PaintableWithLines (BlockContainer<DIV>) [13,12 196x23]
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [1,1 798x45] [children: 0] (z-index: auto)

18
Tests/LibWeb/Layout/expected/input-placeholder-with-line-height.txt
View file

@ -6,12 +6,14 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
"text"
BlockContainer <input> at [9,9] inline-block [0+1+0 200 0+1+0] [0+1+0 82 0+1+0] [BFC] children: not-inline
Box <div> at [11,10] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 80 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [11,10] flex-item [0+0+0 98 0+0+0] [0+0+0 80 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 11, rect: [11,10 89.90625x80] baseline: 44.796875
"placeholder"
TextNode <#text> (not painted)
BlockContainer <div> at [109,10] flex-item [0+0+0 98 0+0+0] [0+0+0 80 0+0+0] [BFC] children: inline
BlockContainer <div> at [11,10] flex-item [0+0+0 0 0+0+0] [0+0+0 80 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [11,10 0x80] baseline: 44.796875
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [11,10] flex-item [0+0+0 89.90625 0+0+0] [0+0+0 80 0+0+0] [BFC] children: inline
InlineNode <div> at [11,10] [0+0+0 89.90625 0+0+0] [0+0+0 80 0+0+0]
frag 0 from TextNode start: 0, length: 11, rect: [11,10 89.90625x80] baseline: 44.796875
"placeholder"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
@ -19,9 +21,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x84]
PaintableWithLines (BlockContainer<INPUT>) [8,8 202x84]
PaintableBox (Box<DIV>) [9,9 200x82]
PaintableWithLines (BlockContainer<DIV>) [11,10 98x80]
PaintableWithLines (BlockContainer<DIV>) [11,10 0x80]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>) [109,10 98x80]
PaintableWithLines (BlockContainer(anonymous)) [11,10 89.90625x80]
PaintableWithLines (InlineNode<DIV>) [11,10 89.90625x80]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)

36
Tests/LibWeb/Layout/expected/input-placeholder.txt
View file

@ -18,12 +18,14 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
TextNode <#text> (not painted)
BlockContainer <input> at [221,9] inline-block [0+1+0 200 0+1+0] [0+1+0 25 0+1+0] [BFC] children: not-inline
Box <div> at [223,10] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 23 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [223,10] flex-item [0+0+0 196 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 34, rect: [223,10 344.546875x23] baseline: 17.5
"This placeholder should be visible"
TextNode <#text> (not painted)
BlockContainer <div> at [419,10] flex-item [0+0+0 0 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
BlockContainer <div> at [223,10] flex-item [0+0+0 0 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [223,10 0x23] baseline: 17.5
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [223,10] flex-item [0+0+0 344.546875 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
InlineNode <div> at [223,10] [0+0+0 344.546875 0+0+0] [0+0+0 23 0+0+0]
frag 0 from TextNode start: 0, length: 34, rect: [223,10 344.546875x23] baseline: 17.5
"This placeholder should be visible"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
BlockContainer <input> at [433,9] inline-block [0+1+0 200 0+1+0] [0+1+0 25 0+1+0] [BFC] children: not-inline
Box <div> at [435,10] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 23 1+0+0] [FFC] children: not-inline
@ -34,12 +36,14 @@ Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] children: not-
TextNode <#text> (not painted)
BlockContainer <input#placeholder> at [9,36] inline-block [0+1+0 200 0+1+0] [0+1+0 25 0+1+0] [BFC] children: not-inline
Box <div> at [11,37] flex-container(row) [0+0+2 196 2+0+0] [0+0+1 23 1+0+0] [FFC] children: not-inline
BlockContainer <div> at [11,37] flex-item [0+0+0 196 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 39, rect: [11,37 396.171875x23] baseline: 17.5
"This placeholder should also be visible"
TextNode <#text> (not painted)
BlockContainer <div> at [207,37] flex-item [0+0+0 0 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
BlockContainer <div> at [11,37] flex-item [0+0+0 0 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 0, rect: [11,37 0x23] baseline: 17.5
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [11,37] flex-item [0+0+0 396.171875 0+0+0] [0+0+0 23 0+0+0] [BFC] children: inline
InlineNode <div> at [11,37] [0+0+0 396.171875 0+0+0] [0+0+0 23 0+0+0]
frag 0 from TextNode start: 0, length: 39, rect: [11,37 396.171875x23] baseline: 17.5
"This placeholder should also be visible"
TextNode <#text> (not painted)
TextNode <#text> (not painted)
TextNode <#text> (not painted)
@ -53,9 +57,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<INPUT>) [220,8 202x27] overflow: [221,9 346.546875x26]
PaintableBox (Box<DIV>) [221,9 200x25] overflow: [221,9 346.546875x26]
PaintableWithLines (BlockContainer<DIV>) [223,10 196x23] overflow: [223,10 344.546875x23]
PaintableWithLines (BlockContainer<DIV>) [223,10 0x23]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>) [419,10 0x23]
PaintableWithLines (BlockContainer(anonymous)) [223,10 344.546875x23]
PaintableWithLines (InlineNode<DIV>) [223,10 344.546875x23]
TextPaintable (TextNode<#text>)
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<INPUT>) [432,8 202x27]
PaintableBox (Box<DIV>) [433,9 200x25]
@ -63,9 +69,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<INPUT>#placeholder) [8,35 202x27] overflow: [9,36 398.171875x26]
PaintableBox (Box<DIV>) [9,36 200x25] overflow: [9,36 398.171875x26]
PaintableWithLines (BlockContainer<DIV>) [11,37 196x23] overflow: [11,37 396.171875x23]
PaintableWithLines (BlockContainer<DIV>) [11,37 0x23]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>) [207,37 0x23]
PaintableWithLines (BlockContainer(anonymous)) [11,37 396.171875x23]
PaintableWithLines (InlineNode<DIV>) [11,37 396.171875x23]
TextPaintable (TextNode<#text>)
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x70] [children: 0] (z-index: auto)

9
Tests/LibWeb/Layout/input/empty-editable-shows-cursor.html Normal file
View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<head><style></style></head>
<body>
<div contenteditable></div>
<input placeholder="hello"/>
<textarea placeholder="hello"></textarea>
<input/>
<textarea></textarea>
</body>

4
Tests/LibWeb/Ref/expected/css-read-only-read-write-selectors-ref.html
View file

@ -7,8 +7,8 @@
border: 4px solid magenta;
}
</style>
<input type="text" class="read-only">
<input type="text" class="read-write">
<input type="text" class="read-only" value="whf">
<input type="text" class="read-write" value="whf">
<p class="read-only">Well hello friends</p>
<p class="read-write">Well hello friends</p>

4
Tests/LibWeb/Ref/input/css-read-only-read-write-selectors.html
View file

@ -8,8 +8,8 @@
border: 4px solid magenta;
}
</style>
<input type="text" readonly>
<input type="text">
<input type="text" readonly value="whf">
<input type="text" value="whf">
<p>Well hello friends</p>
<p contenteditable>Well hello friends</p>